@trafilea/afrodita-components 5.0.0-beta.94 → 5.0.0-beta.96

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 (8) hide show
  1. package/build/index.d.ts +324 -19
  2. package/build/index.esm.js +870 -415
  3. package/build/index.esm.js.map +1 -1
  4. package/build/index.js +873 -414
  5. package/build/index.js.map +1 -1
  6. package/build/theme/revel.theme.d.ts +422 -0
  7. package/build/theme/revel.theme.js +737 -0
  8. package/package.json +1 -1
package/build/index.esm.js CHANGED
@@ -161,6 +161,131 @@ var Copy = function (_a) {
161
161
  return (jsxs$1(IconWrapper$1, __assign$1({ width: width, height: height, viewBoxX: 18, viewBoxY: 22, title: "copy" }, { children: [jsx$1("rect", { x: "0.5", y: "0.5", width: "13", height: "17", rx: "1.5", fill: fill, stroke: stroke }, void 0), jsx$1("rect", { x: "4.5", y: "4.5", width: "13", height: "17", rx: "1.5", fill: fill, stroke: stroke }, void 0)] }), void 0));
162
162
  };
163
163
 
164
+ var CheckboxEmpty = function (_a) {
165
+ var height = _a.height, width = _a.width, fill = _a.fill;
166
+ return (jsx$1(IconWrapper$1, __assign$1({ width: width, height: height, viewBoxX: 40, viewBoxY: 40, fill: "none", title: "checkbox empty" }, { children: jsx$1("rect", { x: "3", y: "3", width: "34", height: "34", rx: "3", stroke: "#292929", strokeWidth: "2", fill: fill }, void 0) }), void 0));
167
+ };
168
+
169
+ var CheckboxLight = function (_a) {
170
+ var height = _a.height, width = _a.width, _b = _a.fill, fill = _b === void 0 ? '#292929' : _b;
171
+ return (jsxs$1(IconWrapper$1, __assign$1({ width: width, height: height, viewBoxX: 40, viewBoxY: 40, fill: "none", title: "checkbox light" }, { children: [jsx$1("rect", { x: "3", y: "3", width: "34", height: "34", rx: "3", stroke: "#292929", strokeWidth: "2" }, void 0), jsx$1("path", { d: "M28.3029 12.3902L16.1394 24.2537L11.8029 19.8829C11.1683 19.3626 10.1106 19.3626 9.47596 19.8829C8.84135 20.4033 8.84135 21.4439 9.47596 22.0683L15.0817 27.5837C15.399 27.8959 15.8221 28 16.2452 28C16.6683 28 17.0913 27.8959 17.3029 27.5837L30.524 14.5756C31.1587 13.9512 31.1587 13.0146 30.524 12.3902C29.8894 11.8699 28.9375 11.8699 28.3029 12.3902Z", fill: fill }, void 0)] }), void 0));
172
+ };
173
+
174
+ var CheckboxSolid = function (_a) {
175
+ var height = _a.height, width = _a.width, fill = _a.fill;
176
+ return (jsx$1(IconWrapper$1, __assign$1({ width: width, height: height, viewBoxX: 40, viewBoxY: 40, title: "checkbox solid" }, { children: jsx$1("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M6 2C3.79086 2 2 3.79086 2 6V34C2 36.2091 3.79086 38 6 38H34C36.2091 38 38 36.2091 38 34V6C38 3.79086 36.2091 2 34 2H6ZM16.1394 24.2537L28.3029 12.3902C28.9375 11.8699 29.8894 11.8699 30.524 12.3902C31.1587 13.0146 31.1587 13.9512 30.524 14.5756L17.3029 27.5837C17.0913 27.8959 16.6683 28 16.2452 28C15.8221 28 15.399 27.8959 15.0817 27.5837L9.47596 22.0683C8.84135 21.4439 8.84135 20.4033 9.47596 19.8829C10.1106 19.3626 11.1683 19.3626 11.8029 19.8829L16.1394 24.2537Z", fill: fill }, void 0) }), void 0));
177
+ };
178
+
179
+ var Like = function (_a) {
180
+ var height = _a.height, width = _a.width, fill = _a.fill;
181
+ return (jsx$1(IconWrapper$1, __assign$1({ width: width, height: height, viewBoxX: 40, viewBoxY: 40, title: "like" }, { children: jsx$1("path", { d: "M27.8003 5.00068C24.7988 4.98312 21.937 6.30891 20.0087 8.62685C18.0805 6.30013 15.2186 4.96556 12.2084 5.00068C6.57198 5.00068 2 9.60144 2 15.2734C2 25.0017 18.8657 34.493 19.5463 34.8617C19.8255 35.0461 20.1832 35.0461 20.4537 34.8617C21.1343 34.493 38 25.1334 38 15.2734C38.0087 9.60144 33.4367 5.00068 27.8003 5.00068ZM20.0087 33.0267C17.365 31.4726 3.82356 23.1667 3.82356 15.2734C3.82356 10.6111 7.57537 6.83571 12.2084 6.83571C15.0441 6.80059 17.6966 8.24052 19.2322 10.6463C19.5463 11.0765 20.1396 11.1731 20.5671 10.857C20.6457 10.7955 20.7242 10.7253 20.7765 10.6463C23.3156 6.74791 28.507 5.6504 32.3897 8.2054C34.763 9.76826 36.1939 12.4286 36.1852 15.2821C36.1852 23.2545 22.6524 31.5165 20.0087 33.0267Z", fill: fill }, void 0) }), void 0));
182
+ };
183
+
184
+ var LikeSolid = function (_a) {
185
+ var height = _a.height, width = _a.width, fill = _a.fill;
186
+ return (jsx$1(IconWrapper$1, __assign$1({ width: width, height: height, viewBoxX: 40, viewBoxY: 40, title: "like solid" }, { children: jsx$1("path", { d: "M27.8003 5C24.3364 5 21.937 7.10727 20.0087 9.41648C18.0805 7.0897 15.873 5 12.2084 5C6.57198 5 2 9.60086 2 15.2729C2 25.0015 18.8657 34.4929 19.5463 34.8617C19.8255 35.0461 20.1832 35.0461 20.4537 34.8617C21.1343 34.4929 38 25.1332 38 15.2729C38.0087 9.60086 33.4367 5 27.8003 5Z", fill: fill }, void 0) }), void 0));
187
+ };
188
+
189
+ var NotAllowed = function (_a) {
190
+ var height = _a.height, width = _a.width, fill = _a.fill;
191
+ return (jsxs$1(IconWrapper$1, __assign$1({ width: width, height: height, viewBoxX: 40, viewBoxY: 40, title: "not allowed" }, { children: [jsx$1("path", { d: "M32.0292 28.8111C32.0292 28.8111 32.0291 28.8111 32.0292 28.8111C32.4746 28.2051 32.869 27.5717 33.2118 26.9172L32.0292 28.8111Z", fill: fill }, void 0), jsx$1("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M2 20C2 10.0588 10.0588 2 20 2C29.9412 2 38 10.0588 38 20C38 29.9412 29.9412 38 20 38C10.0588 38 2 29.9412 2 20ZM10.0669 8.22486L31.7751 29.9331L32.114 29.5028C36.8163 23.5321 36.519 14.7473 30.8858 9.11416C25.2542 3.48246 16.4698 3.18221 10.4972 7.88597L10.0669 8.22486ZM29.9331 31.7751L8.22486 10.0669L7.88597 10.4972C3.18368 16.4679 3.48098 25.2527 9.11416 30.8858C14.7458 36.5175 23.5302 36.8178 29.5028 32.114L29.9331 31.7751Z", fill: fill }, void 0)] }), void 0));
192
+ };
193
+
194
+ var RadioEmpty = function (_a) {
195
+ var height = _a.height, width = _a.width; _a.fill;
196
+ return (jsx$1(IconWrapper$1, __assign$1({ width: width, height: height, viewBoxX: 40, viewBoxY: 40, fill: "none", title: "radio empty" }, { children: jsx$1("path", { d: "M37 20C37 29.3888 29.3888 37 20 37C10.6112 37 3 29.3888 3 20C3 10.6112 10.6112 3 20 3C29.3888 3 37 10.6112 37 20Z", stroke: "#292929", strokeWidth: "2" }, void 0) }), void 0));
197
+ };
198
+
199
+ var RadioFilled = function (_a) {
200
+ var height = _a.height, width = _a.width; _a.fill;
201
+ return (jsx$1(IconWrapper$1, __assign$1({ width: width, height: height, viewBoxX: 40, viewBoxY: 40, fill: "none", title: "radio filled" }, { children: jsx$1("circle", { cx: "20", cy: "20", r: "11", stroke: "#292929", strokeWidth: "14" }, void 0) }), void 0));
202
+ };
203
+
204
+ var Minus$1 = function (_a) {
205
+ var height = _a.height, width = _a.width, _b = _a.fill, fill = _b === void 0 ? '#292929' : _b;
206
+ return (jsx$1(IconWrapper$1, __assign$1({ width: width, height: height, viewBoxX: 40, viewBoxY: 40, fill: "none", title: "minus" }, { children: jsx$1("rect", { x: "4", y: "22.5", width: "4.5", height: "32", rx: "2.25", transform: "rotate(-90 4 22.5)", fill: fill }, void 0) }), void 0));
207
+ };
208
+
209
+ var SettingsSolid = function (_a) {
210
+ var height = _a.height, width = _a.width, fill = _a.fill;
211
+ return (jsx$1(IconWrapper$1, __assign$1({ width: width, height: height, viewBoxX: 40, viewBoxY: 40, title: "settings solid" }, { children: jsx$1("path", { d: "M36.1575 16.221L33.6307 15.7924C33.3675 14.9426 33.029 14.1228 32.6154 13.3407L34.1044 11.2576C34.7362 10.3702 34.6384 9.15939 33.8638 8.39231L31.6227 6.15124C31.2016 5.7301 30.6451 5.49697 30.051 5.49697C29.5847 5.49697 29.141 5.63986 28.765 5.91059L26.6743 7.39962C25.8621 6.97096 25.0123 6.61751 24.1324 6.35429L23.7113 3.85753C23.5308 2.78212 22.6058 2 21.5154 2H18.3493C17.2588 2 16.3338 2.78212 16.1533 3.85753L15.7171 6.41446C14.8749 6.67767 14.0551 7.02361 13.273 7.44475L11.2049 5.95571C10.8289 5.68498 10.3777 5.54209 9.91143 5.54209C9.31732 5.54209 8.75329 5.77522 8.33967 6.19636L6.09108 8.43743C5.324 9.20451 5.21872 10.4153 5.85043 11.3027L7.3545 13.4159C6.94088 14.2056 6.60999 15.0253 6.35429 15.8751L3.85753 16.2962C2.78212 16.4767 2 17.4017 2 18.4922V21.6582C2 22.7487 2.78212 23.6737 3.85753 23.8542L6.41446 24.2904C6.67767 25.1326 7.02361 25.9524 7.44475 26.7345L5.96323 28.7951C5.33152 29.6825 5.42929 30.8932 6.20389 31.6603L8.44495 33.9014C8.8661 34.3225 9.4226 34.5557 10.0167 34.5557C10.483 34.5557 10.9267 34.4128 11.3027 34.142L13.4159 32.638C14.1755 33.0366 14.9726 33.3599 15.7924 33.6156L16.2135 36.1425C16.394 37.2179 17.319 38 18.4094 38H21.583C22.6735 38 23.5985 37.2179 23.779 36.1425L24.2076 33.6156C25.0574 33.3524 25.8772 33.014 26.6593 32.6004L28.7424 34.0894C29.1184 34.3601 29.5697 34.503 30.0359 34.503C30.63 34.503 31.1865 34.2699 31.6077 33.8488L33.8488 31.6077C34.6158 30.8406 34.7211 29.6298 34.0894 28.7424L32.6004 26.6518C33.014 25.8621 33.3599 25.0424 33.6156 24.2001L36.1425 23.779C37.2179 23.5985 38 22.6735 38 21.583V18.417C38.015 17.3265 37.2329 16.4015 36.1575 16.221ZM20.0038 26.8924C16.1985 26.8924 13.1076 23.8015 13.1076 19.9962C13.1076 16.1909 16.1985 13.1001 20.0038 13.1001C23.8091 13.1001 26.8999 16.1909 26.8999 19.9962C26.8999 23.8015 23.8091 26.8924 20.0038 26.8924Z", fill: fill }, void 0) }), void 0));
212
+ };
213
+
214
+ var Settings = function (_a) {
215
+ var height = _a.height, width = _a.width, fill = _a.fill;
216
+ return (jsx$1(IconWrapper$1, __assign$1({ width: width, height: height, viewBoxX: 40, viewBoxY: 40, title: "settings" }, { children: jsx$1("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M34.3879 15.5586L37.0551 16.0111C38.1903 16.2016 39.0159 17.178 39 18.329V21.671C39 22.822 38.1744 23.7984 37.0393 23.9889L34.372 24.4335C34.1021 25.3225 33.737 26.1878 33.3004 27.0213L34.8722 29.2281C35.539 30.1648 35.4278 31.4429 34.6181 32.2526L32.2526 34.6181C31.808 35.0627 31.2206 35.3088 30.5935 35.3088C30.1013 35.3088 29.625 35.1579 29.2281 34.8722L27.0292 33.3004C26.2037 33.737 25.3384 34.0942 24.4414 34.372L23.9889 37.0393C23.7984 38.1744 22.822 39 21.671 39H18.3211C17.17 39 16.1936 38.1744 16.0031 37.0393L15.5586 34.372C14.6933 34.1021 13.8519 33.7608 13.0501 33.3401L10.8195 34.9277C10.4226 35.2135 9.95425 35.3643 9.46208 35.3643C8.83497 35.3643 8.24755 35.1182 7.80301 34.6737L5.43743 32.3081C4.6198 31.4984 4.51661 30.2204 5.18341 29.2837L6.74723 27.1086C6.30269 26.2831 5.93754 25.4178 5.6597 24.5287L2.96073 24.0683C1.82557 23.8778 1 22.9014 1 21.7504V18.4084C1 17.2574 1.82557 16.281 2.96073 16.0905L5.5962 15.6459C5.8661 14.7489 6.21537 13.8836 6.65197 13.0501L5.06434 10.8195C4.39754 9.88281 4.50867 8.60476 5.31836 7.79507L7.69187 5.4295C8.12847 4.98496 8.72384 4.73888 9.35095 4.73888C9.84312 4.73888 10.3194 4.8897 10.7163 5.17548L12.8993 6.74723C13.7249 6.30269 14.5901 5.93754 15.4792 5.6597L15.9396 2.96073C16.1301 1.82557 17.1065 1 18.2576 1H21.5995C22.7506 1 23.727 1.82557 23.9175 2.96073L24.362 5.5962C25.2908 5.87403 26.1878 6.24713 27.0451 6.6996L29.2519 5.12785C29.6488 4.84207 30.1172 4.69125 30.6094 4.69125C31.2365 4.69125 31.8239 4.93733 32.2684 5.38187L34.634 7.74744C35.4516 8.55713 35.5548 9.83518 34.888 10.7719L33.3163 12.9708C33.7529 13.7963 34.1101 14.6616 34.3879 15.5586ZM36.6979 21.8774C36.8011 21.8615 36.8726 21.7742 36.8726 21.671L36.8805 18.329C36.8805 18.2258 36.8091 18.1385 36.7059 18.1226L33.3718 17.559C32.9591 17.4955 32.6177 17.1859 32.5145 16.7731C32.2129 15.6062 31.7525 14.4869 31.1333 13.447C30.9189 13.0819 30.9348 12.6215 31.1809 12.2801L33.1416 9.52559C33.1972 9.43827 33.1893 9.32714 33.1178 9.25569L30.7522 6.89012C30.6967 6.83455 30.6332 6.82661 30.6014 6.82661C30.5617 6.82661 30.522 6.84249 30.4823 6.8663L27.7437 8.83497C27.3944 9.08105 26.9419 9.09693 26.5768 8.8826C25.5131 8.25548 24.37 7.78713 23.1713 7.48548C22.7585 7.38229 22.4489 7.04094 22.3775 6.62022L21.8218 3.31001C21.8059 3.20681 21.7186 3.13537 21.6154 3.13537H18.2734C18.1703 3.13537 18.0829 3.20681 18.0671 3.31001L17.4955 6.66785C17.4241 7.08064 17.1145 7.41404 16.7096 7.52517C15.5427 7.82682 14.4234 8.30311 13.3915 8.92229C13.0263 9.13662 12.5659 9.12074 12.2166 8.87466L9.47796 6.92187C9.44621 6.89806 9.40652 6.88218 9.35889 6.88218C9.3192 6.88218 9.26363 6.89012 9.20806 6.94569L6.84249 9.31126C6.77105 9.3827 6.76311 9.50178 6.81868 9.58116L8.79528 12.3595C9.04136 12.7009 9.06518 13.1533 8.85085 13.5185C8.23961 14.5584 7.78713 15.6856 7.49342 16.8525C7.39022 17.2653 7.04888 17.5749 6.62816 17.6463L3.31794 18.202C3.21475 18.2179 3.1433 18.3052 3.1433 18.4084V21.7504C3.1433 21.8536 3.21475 21.9409 3.31794 21.9568L6.67579 22.5283C7.08857 22.5998 7.42198 22.9093 7.53311 23.3142C7.83476 24.4811 8.31105 25.6004 8.93023 26.6323C9.14456 26.9975 9.12868 27.4579 8.8826 27.8072L6.92981 30.5459C6.87424 30.6332 6.88218 30.7443 6.95362 30.8158L9.3192 33.1813C9.37477 33.2369 9.43827 33.2448 9.47002 33.2448C9.50971 33.2448 9.5494 33.229 9.5891 33.2051L12.3675 31.2285C12.55 31.0936 12.7723 31.0301 12.9866 31.0301C13.1692 31.0301 13.3597 31.0777 13.5264 31.173C14.5504 31.7604 15.6459 32.2129 16.7811 32.5066C17.1859 32.6098 17.4955 32.9432 17.567 33.3639L18.1226 36.6979C18.1385 36.8011 18.2258 36.8726 18.329 36.8726H21.671C21.7742 36.8726 21.8615 36.8011 21.8774 36.6979L22.441 33.3639C22.5045 32.9511 22.8141 32.6098 23.2269 32.5066C24.3938 32.2049 25.5131 31.7445 26.553 31.1253C26.9181 30.911 27.3785 30.9269 27.7199 31.173L30.4744 33.1337C30.5062 33.1575 30.5459 33.1734 30.5935 33.1734C30.6332 33.1734 30.6887 33.1654 30.7443 33.1099L33.1099 30.7443C33.1813 30.6729 33.1893 30.5538 33.1337 30.4744L31.173 27.7119C30.9269 27.3626 30.911 26.9102 31.1253 26.545C31.7445 25.5051 32.2049 24.3858 32.5066 23.2189C32.6098 22.8141 32.9432 22.5045 33.3639 22.433L36.6979 21.8774ZM11.8039 19.9961C11.8039 15.4713 15.4792 11.7959 20.004 11.7959C24.5287 11.7959 28.2041 15.4713 28.2041 19.9961C28.2041 24.5208 24.5287 28.1962 20.004 28.1962C15.4792 28.1962 11.8039 24.5208 11.8039 19.9961ZM13.9472 19.9961C13.9472 23.338 16.662 26.0529 20.004 26.0529C23.3459 26.0529 26.0608 23.338 26.0608 19.9961C26.0608 16.6541 23.3459 13.9392 20.004 13.9392C16.662 13.9392 13.9472 16.6541 13.9472 19.9961Z", fill: fill }, void 0) }), void 0));
217
+ };
218
+
219
+ var Share = function (_a) {
220
+ var height = _a.height, width = _a.width, fill = _a.fill;
221
+ return (jsx$1(IconWrapper$1, __assign$1({ width: width, height: height, viewBoxX: 40, viewBoxY: 40, title: "share" }, { children: jsx$1("path", { d: "M30.3746 26.7496C28.687 26.7496 27.1752 27.4944 26.1415 28.675L13.9695 21.7392C14.1453 21.1911 14.2438 20.6078 14.2438 19.9965C14.2438 19.3922 14.1453 18.8019 13.9695 18.2538L26.1415 11.318C27.1752 12.4985 28.687 13.2434 30.3746 13.2434C33.4756 13.2434 36 10.7207 36 7.62171C36 4.52274 33.4756 2 30.3746 2C27.2736 2 24.7492 4.52274 24.7492 7.62171C24.7492 8.22604 24.8476 8.81632 25.0234 9.36443L12.8515 16.3002C11.8248 15.1267 10.313 14.3818 8.6254 14.3818C5.5244 14.3818 3 16.9045 3 20.0035C3 23.1025 5.5244 25.6252 8.6254 25.6252C10.313 25.6252 11.8319 24.8803 12.8585 23.6998L25.0234 30.6356C24.8406 31.1837 24.7422 31.7669 24.7422 32.3783C24.7422 35.4773 27.2666 38 30.3676 38C33.4686 38 35.993 35.4773 35.993 32.3783C35.993 29.2793 33.4756 26.7496 30.3746 26.7496ZM30.3746 4.26274C32.238 4.26274 33.7498 5.77357 33.7498 7.63576C33.7498 9.49795 32.238 11.0088 30.3746 11.0088C28.5112 11.0088 26.9994 9.49795 26.9994 7.63576C26.9994 5.77357 28.5182 4.26274 30.3746 4.26274ZM8.6254 23.3765C6.76199 23.3765 5.25016 21.8657 5.25016 20.0035C5.25016 18.1413 6.76199 16.6305 8.6254 16.6305C10.4888 16.6305 12.0006 18.1413 12.0006 20.0035C12.0006 21.8657 10.4888 23.3765 8.6254 23.3765ZM30.3746 35.7443C28.5112 35.7443 26.9994 34.2335 26.9994 32.3713C26.9994 30.5091 28.5112 28.9982 30.3746 28.9982C32.238 28.9982 33.7498 30.5091 33.7498 32.3713C33.7498 34.2335 32.238 35.7443 30.3746 35.7443Z", fill: fill }, void 0) }), void 0));
222
+ };
223
+
224
+ var CircleCheck = function (_a) {
225
+ var height = _a.height, width = _a.width, fill = _a.fill;
226
+ return (jsxs$1(IconWrapper$1, __assign$1({ width: width, height: height, viewBoxX: 40, viewBoxY: 40, title: "circle check" }, { children: [jsx$1("path", { d: "M20 1C9.51505 1 1 9.51505 1 20C1 30.4849 9.51505 39 20 39C30.4849 39 39 30.4849 39 20C39 9.51505 30.4849 1 20 1ZM20 37.0936C10.5953 37.0936 2.90635 29.4682 2.90635 20C2.90635 10.5953 10.5953 2.90635 20 2.90635C29.4047 2.90635 37.0936 10.5953 37.0936 20C37.0936 29.4682 29.4682 37.0936 20 37.0936Z", fill: fill }, void 0), jsx$1("path", { d: "M26.7933 14.3293L16.8413 24.339L13.2933 20.6512C12.774 20.2122 11.9087 20.2122 11.3894 20.6512C10.8702 21.0902 10.8702 21.9683 11.3894 22.4951L15.976 27.1488C16.2356 27.4122 16.5817 27.5 16.9279 27.5C17.274 27.5 17.6202 27.4122 17.7933 27.1488L28.6106 16.1732C29.1298 15.6463 29.1298 14.8561 28.6106 14.3293C28.0913 13.8902 27.3125 13.8902 26.7933 14.3293Z", fill: fill }, void 0)] }), void 0));
227
+ };
228
+
229
+ var CircleClear = function (_a) {
230
+ var height = _a.height, width = _a.width, fill = _a.fill;
231
+ return (jsxs$1(IconWrapper$1, __assign$1({ width: width, height: height, viewBoxX: 40, viewBoxY: 40, title: "circle clear" }, { children: [jsx$1("path", { d: "M26.6938 24.5698L22.1199 19.9886L26.5823 15.5192C27.0285 15.0723 27.1401 14.4019 26.8054 13.8432C26.3592 13.0611 25.2436 12.9493 24.6858 13.508L20.1119 18.0891L15.3148 13.3963C14.8686 12.9493 13.9761 12.8376 13.4183 13.2845C12.8606 13.8432 12.8606 14.7371 13.4183 15.2958L18.1038 19.9886L13.5299 24.5698C13.0837 25.0167 12.9721 25.6871 13.3068 26.2458C13.753 27.0279 14.8686 27.1397 15.4264 26.581L20.0003 21.9999L24.5742 26.581C25.132 27.1397 25.9129 27.1397 26.4707 26.581C27.0285 26.0223 27.1401 25.1284 26.6938 24.5698Z", fill: fill }, void 0), jsx$1("path", { d: "M20 1C9.51505 1 1 9.51505 1 20C1 30.4849 9.51505 39 20 39C30.4849 39 39 30.4849 39 20C39 9.51505 30.4849 1 20 1ZM20 37.0936C10.5953 37.0936 2.90635 29.4682 2.90635 20C2.90635 10.5953 10.5953 2.90635 20 2.90635C29.4047 2.90635 37.0936 10.5953 37.0936 20C37.0936 29.4682 29.4682 37.0936 20 37.0936Z", fill: fill }, void 0)] }), void 0));
232
+ };
233
+
234
+ var CircleInfo = function (_a) {
235
+ var height = _a.height, width = _a.width, fill = _a.fill;
236
+ return (jsx$1(IconWrapper$1, __assign$1({ width: width, height: height, viewBoxX: 40, viewBoxY: 40, title: "circle info" }, { children: jsx$1("path", { d: "M20 4.32258C28.6096 4.32258 35.6774 11.2958 35.6774 20C35.6774 28.6582 28.6654 35.6774 20 35.6774C11.3452 35.6774 4.32258 28.6689 4.32258 20C4.32258 11.3482 11.334 4.32258 20 4.32258ZM20 2C10.0596 2 2 10.0625 2 20C2 29.9433 10.0596 38 20 38C29.9404 38 38 29.9433 38 20C38 10.0625 29.9404 2 20 2ZM17.3871 26.9677H18.2581V18.2581H17.3871C16.9061 18.2581 16.5161 17.8681 16.5161 17.3871V16.8065C16.5161 16.3255 16.9061 15.9355 17.3871 15.9355H20.871C21.352 15.9355 21.7419 16.3255 21.7419 16.8065V26.9677H22.6129C23.0939 26.9677 23.4839 27.3577 23.4839 27.8387V28.4194C23.4839 28.9003 23.0939 29.2903 22.6129 29.2903H17.3871C16.9061 29.2903 16.5161 28.9003 16.5161 28.4194V27.8387C16.5161 27.3577 16.9061 26.9677 17.3871 26.9677ZM20 9.54839C18.7173 9.54839 17.6774 10.5883 17.6774 11.871C17.6774 13.1537 18.7173 14.1935 20 14.1935C21.2827 14.1935 22.3226 13.1537 22.3226 11.871C22.3226 10.5883 21.2827 9.54839 20 9.54839Z", fill: fill }, void 0) }), void 0));
237
+ };
238
+
239
+ var CircleMinus = function (_a) {
240
+ var height = _a.height, width = _a.width, fill = _a.fill;
241
+ return (jsxs$1(IconWrapper$1, __assign$1({ width: width, height: height, viewBoxX: 40, viewBoxY: 40, title: "circle minus" }, { children: [jsx$1("path", { d: "M20 1C9.51505 1 1 9.51505 1 20C1 30.4849 9.51505 39 20 39C30.4849 39 39 30.4849 39 20C39 9.51505 30.4849 1 20 1ZM20 37.0936C10.5953 37.0936 2.90635 29.4682 2.90635 20C2.90635 10.5953 10.5953 2.90635 20 2.90635C29.4047 2.90635 37.0936 10.5953 37.0936 20C37.0936 29.4682 29.4682 37.0936 20 37.0936Z", fill: fill }, void 0), jsx$1("rect", { x: "11", y: "22", width: "3", height: "18", rx: "1.5", transform: "rotate(-90 11 22)", fill: fill }, void 0)] }), void 0));
242
+ };
243
+
244
+ var CirclePlus = function (_a) {
245
+ var height = _a.height, width = _a.width, fill = _a.fill;
246
+ return (jsxs$1(IconWrapper$1, __assign$1({ width: width, height: height, viewBoxX: 40, viewBoxY: 40, title: "circle plusd" }, { children: [jsx$1("path", { d: "M20 1C9.51505 1 1 9.51505 1 20C1 30.4849 9.51505 39 20 39C30.4849 39 39 30.4849 39 20C39 9.51505 30.4849 1 20 1ZM20 37.0936C10.5953 37.0936 2.90635 29.4682 2.90635 20C2.90635 10.5953 10.5953 2.90635 20 2.90635C29.4047 2.90635 37.0936 10.5953 37.0936 20C37.0936 29.4682 29.4682 37.0936 20 37.0936Z", fill: fill }, void 0), jsx$1("path", { d: "M20 12C19.3144 12 18.7586 12.5558 18.7586 13.2414V18.7586H13.2414C12.5558 18.7586 12 19.3144 12 20C12 20.6856 12.5558 21.2414 13.2414 21.2414H18.7586V26.7586C18.7586 27.4442 19.3144 28 20 28C20.6856 28 21.2414 27.4442 21.2414 26.7586V21.2414H26.7586C27.4442 21.2414 28 20.6856 28 20C28 19.3144 27.4442 18.7586 26.7586 18.7586H21.2414V13.2414C21.2414 12.5558 20.6856 12 20 12Z", fill: fill }, void 0)] }), void 0));
247
+ };
248
+
249
+ var CircleQuestion = function (_a) {
250
+ var height = _a.height, width = _a.width, fill = _a.fill;
251
+ return (jsx$1(IconWrapper$1, __assign$1({ width: width, height: height, viewBoxX: 40, viewBoxY: 40, title: "circle question" }, { children: jsx$1("path", { d: "M20 26.0968C18.8776 26.0968 17.9677 27.0066 17.9677 28.129C17.9677 29.2514 18.8776 30.1613 20 30.1613C21.1224 30.1613 22.0323 29.2514 22.0323 28.129C22.0323 27.0066 21.1224 26.0968 20 26.0968ZM20.5567 24.3548H19.3954C18.9144 24.3548 18.5244 23.9649 18.5244 23.4839V23.4562C18.5244 18.3507 24.1451 18.8387 24.1451 15.6605C24.1451 14.2077 22.856 12.7419 19.976 12.7419C17.8608 12.7419 16.7633 13.4423 15.6785 14.8244C15.3948 15.1859 14.8762 15.2595 14.4992 14.9969L13.5459 14.3328C13.1376 14.0483 13.048 13.4784 13.3539 13.086C14.8945 11.1099 16.7224 9.83871 19.976 9.83871C23.7735 9.83871 27.0483 11.9981 27.0483 15.6605C27.0483 20.5534 21.4277 20.2947 21.4277 23.4562V23.4839C21.4277 23.9649 21.0377 24.3548 20.5567 24.3548ZM20 4.32258C28.6096 4.32258 35.6774 11.2958 35.6774 20C35.6774 28.6582 28.6654 35.6774 20 35.6774C11.3452 35.6774 4.32258 28.6689 4.32258 20C4.32258 11.3482 11.334 4.32258 20 4.32258ZM20 2C10.0596 2 2 10.0625 2 20C2 29.9433 10.0596 38 20 38C29.9404 38 38 29.9433 38 20C38 10.0625 29.9404 2 20 2Z", fill: fill }, void 0) }), void 0));
252
+ };
253
+
254
+ var CircleWarning = function (_a) {
255
+ var height = _a.height, width = _a.width; _a.fill;
256
+ return (jsxs$1(IconWrapper$1, __assign$1({ width: width, height: height, viewBoxX: 40, viewBoxY: 40, fill: "none", title: "circle Warning" }, { children: [jsx$1("path", { d: "M37 20C37 29.3888 29.3888 37 20 37C10.6112 37 3 29.3888 3 20C3 10.6112 10.6112 3 20 3C29.3888 3 37 10.6112 37 20Z", stroke: "#292929", strokeWidth: "2" }, void 0), jsx$1("path", { d: "M21.1827 10C21.4986 10 21.7293 10.295 21.7209 10.625L21.2225 22.6134C21.2135 22.9361 20.9802 23.1997 20.6844 23.1997H19.3222C19.0249 23.1997 18.7931 22.9268 18.7841 22.6135L18.2858 10.627L18.2857 10.625C18.2773 10.295 18.508 10 18.8239 10H21.1827Z", fill: "#292929" }, void 0), jsx$1("path", { d: "M20 25.7635C21.1026 25.7635 22 26.6127 22 27.8818C22 29.1509 21.1026 30 20 30C18.8974 30 18 29.1509 18 27.8818C18 26.6127 18.8974 25.7635 20 25.7635Z", fill: "#292929" }, void 0)] }), void 0));
257
+ };
258
+
259
+ var CircleSolidCheck = function (_a) {
260
+ var height = _a.height, width = _a.width, fill = _a.fill;
261
+ return (jsx$1(IconWrapper$1, __assign$1({ width: width, height: height, viewBoxX: 40, viewBoxY: 40, title: "circle solid check" }, { children: jsx$1("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M20 1C9.50659 1 1 9.50659 1 20C1 30.4934 9.50659 39 20 39C30.4934 39 39 30.4934 39 20C39 9.50659 30.4934 1 20 1ZM16.8413 24.339L26.7933 14.3293C27.3125 13.8902 28.0913 13.8902 28.6106 14.3293C29.1298 14.8561 29.1298 15.6463 28.6106 16.1732L17.7933 27.1488C17.6202 27.4122 17.274 27.5 16.9279 27.5C16.5817 27.5 16.2356 27.4122 15.976 27.1488L11.3894 22.4951C10.8702 21.9683 10.8702 21.0902 11.3894 20.6512C11.9087 20.2122 12.774 20.2122 13.2933 20.6512L16.8413 24.339Z", fill: fill }, void 0) }), void 0));
262
+ };
263
+
264
+ var CircleSolidClear = function (_a) {
265
+ var height = _a.height, width = _a.width, fill = _a.fill;
266
+ return (jsx$1(IconWrapper$1, __assign$1({ width: width, height: height, viewBoxX: 40, viewBoxY: 40, title: "circle solid clear" }, { children: jsx$1("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M20 1C9.50659 1 1 9.50659 1 20C1 30.4934 9.50659 39 20 39C30.4934 39 39 30.4934 39 20C39 9.50659 30.4934 1 20 1ZM22.1199 19.9886L26.6938 24.5698C27.1401 25.1284 27.0285 26.0223 26.4707 26.581C25.9129 27.1397 25.132 27.1397 24.5742 26.581L20.0003 21.9999L15.4264 26.581C14.8686 27.1397 13.753 27.0279 13.3068 26.2458C12.9721 25.6871 13.0837 25.0167 13.5299 24.5698L18.1038 19.9886L13.4183 15.2958C12.8606 14.7371 12.8606 13.8432 13.4183 13.2845C13.9761 12.8376 14.8686 12.9493 15.3148 13.3963L20.1119 18.0891L24.6858 13.508C25.2436 12.9493 26.3592 13.0611 26.8054 13.8432C27.1401 14.4019 27.0285 15.0723 26.5823 15.5192L22.1199 19.9886Z", fill: fill }, void 0) }), void 0));
267
+ };
268
+
269
+ var CircleSolidMinus = function (_a) {
270
+ var height = _a.height, width = _a.width, fill = _a.fill;
271
+ return (jsx$1(IconWrapper$1, __assign$1({ width: width, height: height, viewBoxX: 40, viewBoxY: 40, title: "circle solid minus" }, { children: jsx$1("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M20 1C9.50659 1 1 9.50659 1 20C1 30.4934 9.50659 39 20 39C30.4934 39 39 30.4934 39 20C39 9.50659 30.4934 1 20 1ZM11 20.5C11 21.3284 11.6716 22 12.5 22H27.5C28.3284 22 29 21.3284 29 20.5C29 19.6716 28.3284 19 27.5 19H12.5C11.6716 19 11 19.6716 11 20.5Z", fill: fill }, void 0) }), void 0));
272
+ };
273
+
274
+ var CircleSolidPlus = function (_a) {
275
+ var height = _a.height, width = _a.width, fill = _a.fill;
276
+ return (jsx$1(IconWrapper$1, __assign$1({ width: width, height: height, viewBoxX: 40, viewBoxY: 40, title: "circle solid plus" }, { children: jsx$1("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M20 1C9.50659 1 1 9.50659 1 20C1 30.4934 9.50659 39 20 39C30.4934 39 39 30.4934 39 20C39 9.50659 30.4934 1 20 1ZM18.7586 13.2414C18.7586 12.5558 19.3144 12 20 12C20.6856 12 21.2414 12.5558 21.2414 13.2414V18.7586H26.7586C27.4442 18.7586 28 19.3144 28 20C28 20.6856 27.4442 21.2414 26.7586 21.2414H21.2414V26.7586C21.2414 27.4442 20.6856 28 20 28C19.3144 28 18.7586 27.4442 18.7586 26.7586V21.2414H13.2414C12.5558 21.2414 12 20.6856 12 20C12 19.3144 12.5558 18.7586 13.2414 18.7586H18.7586V13.2414Z", fill: fill }, void 0) }), void 0));
277
+ };
278
+
279
+ var CircleSolidQuestion = function (_a) {
280
+ var height = _a.height, width = _a.width, fill = _a.fill;
281
+ return (jsx$1(IconWrapper$1, __assign$1({ width: width, height: height, viewBoxX: 40, viewBoxY: 40, title: "circle solid question" }, { children: jsx$1("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M20 1C9.50659 1 1 9.50659 1 20C1 30.4934 9.50659 39 20 39C30.4934 39 39 30.4934 39 20C39 9.50659 30.4934 1 20 1ZM20.4506 24.6453H19.279C18.7937 24.6453 18.4003 24.2518 18.4003 23.7666V23.7387C18.4003 20.8594 20.1721 19.7434 21.7349 18.7591C22.968 17.9824 24.0709 17.2877 24.0709 15.8736C24.0709 14.4079 22.7704 12.9291 19.8648 12.9291C17.7307 12.9291 16.6235 13.6356 15.529 15.0301C15.2428 15.3947 14.7196 15.4691 14.3392 15.2041L13.3775 14.534C12.9656 14.2471 12.8751 13.6721 13.1838 13.2762C14.7381 11.2825 16.5822 10 19.8648 10C23.696 10 27 12.1786 27 15.8736C27 18.6102 25.2572 19.7495 23.704 20.7649C22.4554 21.5811 21.3293 22.3173 21.3293 23.7387V23.7666C21.3293 24.2518 20.9359 24.6453 20.4506 24.6453ZM19.889 26.4027C18.7566 26.4027 17.8386 27.3207 17.8386 28.453C17.8386 29.5854 18.7566 30.5034 19.889 30.5034C21.0214 30.5034 21.9393 29.5854 21.9393 28.453C21.9393 27.3207 21.0214 26.4027 19.889 26.4027Z", fill: fill }, void 0) }), void 0));
282
+ };
283
+
284
+ var CircleSolidWarning = function (_a) {
285
+ var height = _a.height, width = _a.width, fill = _a.fill;
286
+ return (jsx$1(IconWrapper$1, __assign$1({ width: width, height: height, viewBoxX: 40, viewBoxY: 40, title: "circle solid warning" }, { children: jsx$1("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M20 1C9.50659 1 1 9.50659 1 20C1 30.4934 9.50659 39 20 39C30.4934 39 39 30.4934 39 20C39 9.50659 30.4934 1 20 1ZM21.7209 10.625C21.7293 10.295 21.4986 10 21.1827 10H18.8239C18.508 10 18.2773 10.295 18.2858 10.625L18.2858 10.627L18.7841 22.6135C18.7931 22.9268 19.0249 23.1997 19.3223 23.1997H20.6844C20.9802 23.1997 21.2136 22.9361 21.2225 22.6134L21.7209 10.625ZM22 27.8818C22 26.6127 21.1026 25.7635 20 25.7635C18.8974 25.7635 18 26.6127 18 27.8818C18 29.1509 18.8974 30 20 30C21.1026 30 22 29.1509 22 27.8818Z", fill: fill }, void 0) }), void 0));
287
+ };
288
+
164
289
  var Actions = /*#__PURE__*/Object.freeze({
165
290
  __proto__: null,
166
291
  Check: Check$1,
@@ -174,7 +299,32 @@ var Actions = /*#__PURE__*/Object.freeze({
174
299
  Edit: Edit,
175
300
  SignOut: SignOut,
176
301
  Add: Add,
177
- Copy: Copy
302
+ Copy: Copy,
303
+ CheckboxEmpty: CheckboxEmpty,
304
+ CheckboxLight: CheckboxLight,
305
+ CheckboxSolid: CheckboxSolid,
306
+ Like: Like,
307
+ LikeSolid: LikeSolid,
308
+ NotAllowed: NotAllowed,
309
+ RadioEmpty: RadioEmpty,
310
+ RadioFilled: RadioFilled,
311
+ Minus: Minus$1,
312
+ SettingsSolid: SettingsSolid,
313
+ Settings: Settings,
314
+ Share: Share,
315
+ CircleCheck: CircleCheck,
316
+ CircleClear: CircleClear,
317
+ CircleInfo: CircleInfo,
318
+ CircleMinus: CircleMinus,
319
+ CirclePlus: CirclePlus,
320
+ CircleQuestion: CircleQuestion,
321
+ CircleWarning: CircleWarning,
322
+ CircleSolidCheck: CircleSolidCheck,
323
+ CircleSolidClear: CircleSolidClear,
324
+ CircleSolidMinus: CircleSolidMinus,
325
+ CircleSolidPlus: CircleSolidPlus,
326
+ CircleSolidQuestion: CircleSolidQuestion,
327
+ CircleSolidWarning: CircleSolidWarning
178
328
  });
179
329
 
180
330
  var FitPredictor$1 = function (_a) {
@@ -182,7 +332,7 @@ var FitPredictor$1 = function (_a) {
182
332
  return (jsx$1(IconWrapper$1, __assign$1({ width: width, height: height, viewBoxX: 18, viewBoxY: 18, title: "fit predictor" }, { children: jsx$1("path", { d: "M9.125 0C4 0 0 3.97241 0 8.93793C0 13.9034 4 18 9 18C14 18 18 14.0276 18 9.06207C18 4.09655 14.125 0 9.125 0ZM13.125 4.84138C12.125 4.84138 12 3.6 11.625 3.6C11.375 3.6 11 6.2069 11 6.2069H13.625L13.25 7.44828H10.75C9.75 12.1655 9.125 15.5172 5.75 15.5172C3.375 15.5172 3.625 13.2828 5 13.1586C6.5 13.0345 6.25 14.4 6.5 14.4C7.125 14.4 8.375 7.57241 8.375 7.44828H5.875L6.25 6.2069H8.625C9.75 1.11724 13.75 2.35862 14.125 3.22759C14.625 4.34483 13.625 4.96552 13.125 4.84138Z", fill: fill }, void 0) }), void 0));
183
333
  };
184
334
 
185
- var Loading = function (_a) {
335
+ var Loading$1 = function (_a) {
186
336
  var height = _a.height, width = _a.width, fill = _a.fill, backgroundColor = _a.backgroundColor;
187
337
  return (jsxs$1(IconWrapper$1, __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));
188
338
  };
@@ -261,7 +411,7 @@ var FitGuarantee = function (_a) {
261
411
  var Other = /*#__PURE__*/Object.freeze({
262
412
  __proto__: null,
263
413
  FitPredictor: FitPredictor$1,
264
- Loading: Loading,
414
+ Loading: Loading$1,
265
415
  Shapermint: Shapermint,
266
416
  McAfee: McAfee,
267
417
  GetDiscount: GetDiscount,
@@ -313,6 +463,61 @@ var CircleUp = function (_a) {
313
463
  return (jsx$1(IconWrapper$1, __assign$1({ width: width, height: height, viewBoxX: 38, viewBoxY: 38, title: "circle up" }, { children: jsx$1("path", { d: "M0 19C0 8.50403 8.50403 0 19 0C29.496 0 38 8.50403 38 19C38 29.496 29.496 38 19 38C8.50403 38 0 29.496 0 19ZM17.6976 10.2738L7.31653 20.6548C6.59637 21.375 6.59637 22.5395 7.31653 23.252L8.61895 24.5544C9.33911 25.2746 10.5036 25.2746 11.2161 24.5544L19 16.7706L26.7839 24.5544C27.504 25.2746 28.6685 25.2746 29.381 24.5544L30.6835 23.252C31.4036 22.5319 31.4036 21.3673 30.6835 20.6548L20.3024 10.2738C19.5823 9.55363 18.4177 9.55363 17.6976 10.2738Z", fill: fill }, void 0) }), void 0));
314
464
  };
315
465
 
466
+ var CircleChevronLeft = function (_a) {
467
+ var width = _a.width, height = _a.height, fill = _a.fill;
468
+ return (jsx$1(IconWrapper$1, __assign$1({ width: width, height: height, viewBoxX: 38, viewBoxY: 38, title: "circle chevron left" }, { children: jsx$1("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M38 20C38 29.9411 29.9411 38 20 38C10.0589 38 2 29.9411 2 20C2 10.0589 10.0589 2 20 2C29.9411 2 38 10.0589 38 20ZM23.6061 28.6476C23.1487 29.1175 22.3863 29.1175 21.9288 28.6476L14.3558 20.9202C14.1525 20.6592 14 20.3459 14 20.0326C14 19.6671 14.1525 19.3539 14.3558 19.145L21.9288 11.3655C22.183 11.1044 22.4879 11 22.7929 11C23.0978 11 23.4028 11.1044 23.6569 11.3655C24.1144 11.8354 24.1144 12.6186 23.6569 13.0885C21.8272 15.0203 19.9975 16.8999 18.1677 18.7796C18.1677 18.8057 17.8501 19.1189 17.5324 19.4322C17.2147 19.7455 16.8971 20.0587 16.8971 20.0848C16.8971 20.1109 17.202 20.4112 17.507 20.7114C17.8119 21.0116 18.1169 21.3118 18.1169 21.3379C19.0318 22.2778 19.9467 23.2045 20.8615 24.1313C21.7764 25.058 22.6912 25.9848 23.6061 26.9246C24.0635 27.3945 24.0635 28.1777 23.6061 28.6476Z", fill: fill }, void 0) }), void 0));
469
+ };
470
+
471
+ var CircleChevronRight = function (_a) {
472
+ var width = _a.width, height = _a.height, fill = _a.fill;
473
+ return (jsx$1(IconWrapper$1, __assign$1({ width: width, height: height, viewBoxX: 38, viewBoxY: 38, title: "circle chevron Right" }, { children: jsx$1("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M2 20C2 29.9411 10.0589 38 20 38C29.9411 38 38 29.9411 38 20C38 10.0589 29.9411 2 20 2C10.0589 2 2 10.0589 2 20ZM16.3939 28.6476C16.8513 29.1175 17.6137 29.1175 18.0712 28.6476L25.6442 20.9202C25.8475 20.6592 26 20.3459 26 20.0326C26 19.6671 25.8475 19.3539 25.6442 19.145L18.0712 11.3655C17.817 11.1044 17.5121 11 17.2071 11C16.9022 11 16.5972 11.1044 16.3431 11.3655C15.8856 11.8354 15.8856 12.6186 16.3431 13.0885C18.1728 15.0203 20.0025 16.8999 21.8323 18.7796C21.8323 18.8057 22.1499 19.1189 22.4676 19.4322C22.7853 19.7455 23.1029 20.0587 23.1029 20.0848C23.1029 20.1109 22.798 20.4112 22.493 20.7114C22.1881 21.0116 21.8831 21.3118 21.8831 21.3379C20.9682 22.2778 20.0533 23.2045 19.1385 24.1313C18.2236 25.058 17.3088 25.9848 16.3939 26.9246C15.9365 27.3945 15.9365 28.1777 16.3939 28.6476Z", fill: fill }, void 0) }), void 0));
474
+ };
475
+
476
+ var CircleChevronDown = function (_a) {
477
+ var width = _a.width, height = _a.height, fill = _a.fill;
478
+ return (jsx$1(IconWrapper$1, __assign$1({ width: width, height: height, viewBoxX: 38, viewBoxY: 38, title: "circle chevron down" }, { children: jsx$1("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M20 2C10.0589 2 2 10.0589 2 20C2 29.9411 10.0589 38 20 38C29.9411 38 38 29.9411 38 20C38 10.0589 29.9411 2 20 2ZM11.3524 16.3939C10.8825 16.8513 10.8825 17.6137 11.3524 18.0712L19.0798 25.6442C19.3408 25.8475 19.6541 26 19.9674 26C20.3329 26 20.6461 25.8475 20.855 25.6442L28.6345 18.0712C28.8956 17.817 29 17.5121 29 17.2071C29 16.9022 28.8956 16.5972 28.6345 16.3431C28.1646 15.8856 27.3814 15.8856 26.9115 16.3431C24.9797 18.1728 23.1001 20.0025 21.2204 21.8323C21.1943 21.8323 20.8811 22.1499 20.5678 22.4676C20.2545 22.7853 19.9413 23.1029 19.9152 23.1029C19.8891 23.1029 19.5888 22.798 19.2886 22.493C18.9884 22.1881 18.6882 21.8831 18.6621 21.8831C17.7222 20.9682 16.7955 20.0533 15.8687 19.1385C14.942 18.2236 14.0152 17.3088 13.0754 16.3939C12.6055 15.9365 11.8223 15.9365 11.3524 16.3939Z", fill: fill }, void 0) }), void 0));
479
+ };
480
+
481
+ var CircleChevronUp = function (_a) {
482
+ var width = _a.width, height = _a.height, fill = _a.fill;
483
+ return (jsx$1(IconWrapper$1, __assign$1({ width: width, height: height, viewBoxX: 38, viewBoxY: 38, title: "circle chevron up" }, { children: jsx$1("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M20 38C29.9411 38 38 29.9411 38 20C38 10.0589 29.9411 2 20 2C10.0589 2 2 10.0589 2 20C2 29.9411 10.0589 38 20 38ZM28.6476 23.6061C29.1175 23.1487 29.1175 22.3863 28.6476 21.9288L20.9202 14.3558C20.6592 14.1525 20.3459 14 20.0326 14C19.6671 14 19.3539 14.1525 19.145 14.3558L11.3655 21.9288C11.1044 22.183 11 22.4879 11 22.7929C11 23.0978 11.1044 23.4028 11.3655 23.6569C11.8354 24.1144 12.6186 24.1144 13.0885 23.6569C15.0203 21.8272 16.8999 19.9975 18.7796 18.1677C18.8057 18.1677 19.1189 17.8501 19.4322 17.5324C19.7455 17.2147 20.0587 16.8971 20.0848 16.8971C20.1109 16.8971 20.4112 17.202 20.7114 17.507C21.0116 17.8119 21.3118 18.1169 21.3379 18.1169C22.2778 19.0318 23.2045 19.9467 24.1313 20.8615C25.058 21.7764 25.9848 22.6912 26.9246 23.6061C27.3945 24.0635 28.1777 24.0635 28.6476 23.6061Z", fill: fill }, void 0) }), void 0));
484
+ };
485
+
486
+ var ChevronDownVariant = function (_a) {
487
+ var width = _a.width, height = _a.height, fill = _a.fill;
488
+ return (jsx$1(IconWrapper$1, __assign$1({ width: width, height: height, viewBoxX: 38, viewBoxY: 38, title: "chevron down variant" }, { children: jsx$1("path", { d: "M29.5843 30.1397C30.1386 29.5972 30.1386 28.7835 29.5843 28.241C29.03 27.6985 28.1986 27.6985 27.6443 28.241L21.455 34.389V2.35617C21.3626 1.63288 20.7159 1 19.9769 1C19.2379 1 18.5912 1.63288 18.5912 2.35617V34.389L12.3095 28.241C11.7552 27.6985 10.9238 27.6985 10.3695 28.241C10.0924 28.5123 10 28.8739 10 29.2355C10 29.5972 10.0924 29.9588 10.3695 30.2301L18.9607 38.6384C19.2379 38.9096 19.6074 39 19.9769 39C20.3464 39 20.7159 38.8192 20.9931 38.6384L29.5843 30.1397Z", fill: fill }, void 0) }), void 0));
489
+ };
490
+
491
+ var ChevronUpVariant = function (_a) {
492
+ var width = _a.width, height = _a.height, fill = _a.fill;
493
+ return (jsx$1(IconWrapper$1, __assign$1({ width: width, height: height, viewBoxX: 38, viewBoxY: 38, title: "chevron up variant" }, { children: jsx$1("path", { d: "M10.4157 9.86033C9.86143 10.4028 9.86143 11.2165 10.4157 11.759C10.97 12.3015 11.8014 12.3015 12.3557 11.759L18.545 5.61099V37.6438C18.6374 38.3671 19.2841 39 20.0231 39C20.7621 39 21.4088 38.3671 21.4088 37.6438V5.61099L27.6905 11.759C28.2448 12.3015 29.0762 12.3015 29.6305 11.759C29.9076 11.4877 30 11.1261 30 10.7645C30 10.4028 29.9076 10.0412 29.6305 9.76992L21.0393 1.36164C20.7621 1.09041 20.3926 1 20.0231 1C19.6536 1 19.2841 1.18082 19.0069 1.36164L10.4157 9.86033Z", fill: fill }, void 0) }), void 0));
494
+ };
495
+
496
+ var ChevronLeftVariant = function (_a) {
497
+ var width = _a.width, height = _a.height, fill = _a.fill;
498
+ return (jsx$1(IconWrapper$1, __assign$1({ width: width, height: height, viewBoxX: 38, viewBoxY: 38, title: "chevron left variant" }, { children: jsx$1("path", { d: "M9.86033 10.4157C10.4028 9.86143 11.2165 9.86143 11.759 10.4157C12.3015 10.97 12.3015 11.8014 11.759 12.3557L5.61099 18.545H37.6438C38.3671 18.6374 39 19.2841 39 20.0231C39 20.7621 38.3671 21.4088 37.6438 21.4088H5.61099L11.759 27.6905C12.3015 28.2448 12.3015 29.0762 11.759 29.6305C11.4877 29.9076 11.1261 30 10.7645 30C10.4028 30 10.0412 29.9076 9.76992 29.6305L1.36164 21.0393C1.09041 20.7621 1 20.3926 1 20.0231C1 19.6536 1.18082 19.2841 1.36164 19.0069L9.86033 10.4157Z", fill: fill }, void 0) }), void 0));
499
+ };
500
+
501
+ var CircleLineUp = function (_a) {
502
+ var width = _a.width, height = _a.height, fill = _a.fill;
503
+ return (jsx$1(IconWrapper$1, __assign$1({ width: width, height: height, viewBoxX: 38, viewBoxY: 38, title: "circle line right" }, { children: jsx$1("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M20 38C10.0589 38 2 29.9411 2 20C2 10.0589 10.0589 2 20 2C29.9411 2 38 10.0589 38 20C38 29.9411 29.9411 38 20 38ZM21.0262 13.5445V28.8923C21.0262 29.5805 20.398 30.0623 19.7699 29.9935C19.2814 29.8558 18.9324 29.4429 18.9324 28.9611V13.6133L14.8146 17.6051C14.4656 17.9492 13.9073 18.018 13.4886 17.7427C13.1396 17.5363 13 17.1921 13 16.848C13 16.5727 13.0698 16.2974 13.2792 16.091L19.2116 10.3097C19.6303 9.89676 20.2585 9.89676 20.6772 10.3097L26.6794 16.091C27.1679 16.5039 27.0981 17.3298 26.47 17.6739C26.0513 17.9492 25.4929 17.8804 25.1439 17.5363L21.0262 13.5445Z", fill: fill }, void 0) }), void 0));
504
+ };
505
+
506
+ var CircleLineDown = function (_a) {
507
+ var width = _a.width, height = _a.height, fill = _a.fill;
508
+ return (jsx$1(IconWrapper$1, __assign$1({ width: width, height: height, viewBoxX: 38, viewBoxY: 38, title: "circle line down" }, { children: jsx$1("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M20 2C10.0589 2 2 10.0589 2 20C2 29.9411 10.0589 38 20 38C29.9411 38 38 29.9411 38 20C38 10.0589 29.9411 2 20 2ZM21.0262 26.4555V11.1077C21.0262 10.4195 20.398 9.93772 19.7699 10.0065C19.2814 10.1442 18.9324 10.5571 18.9324 11.0389V26.3867L14.8146 22.3949C14.4656 22.0508 13.9073 21.982 13.4886 22.2573C13.1396 22.4637 13 22.8079 13 23.152C13 23.4273 13.0698 23.7026 13.2792 23.909L19.2116 29.6903C19.6303 30.1032 20.2585 30.1032 20.6772 29.6903L26.6794 23.909C27.1679 23.4961 27.0981 22.6702 26.47 22.3261C26.0513 22.0508 25.4929 22.1196 25.1439 22.4637L21.0262 26.4555Z", fill: fill }, void 0) }), void 0));
509
+ };
510
+
511
+ var CircleLineLeft = function (_a) {
512
+ var width = _a.width, height = _a.height, fill = _a.fill;
513
+ return (jsx$1(IconWrapper$1, __assign$1({ width: width, height: height, viewBoxX: 38, viewBoxY: 38, title: "circle line left" }, { children: jsx$1("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M38 20C38 29.9411 29.9411 38 20 38C10.0589 38 2 29.9411 2 20C2 10.0589 10.0589 2 20 2C29.9411 2 38 10.0589 38 20ZM13.5445 18.9738H28.8923C29.5805 18.9738 30.0623 19.602 29.9935 20.2301C29.8558 20.7186 29.4429 21.0676 28.9611 21.0676H13.6133L17.6051 25.1854C17.9492 25.5344 18.018 26.0927 17.7427 26.5114C17.5363 26.8604 17.1921 27 16.848 27C16.5727 27 16.2974 26.9302 16.091 26.7208L10.3097 20.7884C9.89676 20.3697 9.89676 19.7415 10.3097 19.3228L16.091 13.3206C16.5039 12.8321 17.3298 12.9019 17.6739 13.53C17.9492 13.9487 17.8804 14.5071 17.5363 14.8561L13.5445 18.9738Z", fill: fill }, void 0) }), void 0));
514
+ };
515
+
516
+ var CircleLineRight = function (_a) {
517
+ var width = _a.width, height = _a.height, fill = _a.fill;
518
+ return (jsx$1(IconWrapper$1, __assign$1({ width: width, height: height, viewBoxX: 38, viewBoxY: 38, title: "circle line right" }, { children: jsx$1("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M2 20C2 29.9411 10.0589 38 20 38C29.9411 38 38 29.9411 38 20C38 10.0589 29.9411 2 20 2C10.0589 2 2 10.0589 2 20ZM26.4555 18.9738H11.1077C10.4195 18.9738 9.93772 19.602 10.0065 20.2301C10.1442 20.7186 10.5571 21.0676 11.0389 21.0676H26.3867L22.3949 25.1854C22.0508 25.5344 21.982 26.0927 22.2573 26.5114C22.4637 26.8604 22.8079 27 23.152 27C23.4273 27 23.7026 26.9302 23.909 26.7208L29.6903 20.7884C30.1032 20.3697 30.1032 19.7415 29.6903 19.3228L23.909 13.3206C23.4961 12.8321 22.6702 12.9019 22.3261 13.53C22.0508 13.9487 22.1196 14.5071 22.4637 14.8561L26.4555 18.9738Z", fill: fill }, void 0) }), void 0));
519
+ };
520
+
316
521
  var Arrows = /*#__PURE__*/Object.freeze({
317
522
  __proto__: null,
318
523
  ChevronDown: ChevronDown,
@@ -321,7 +526,18 @@ var Arrows = /*#__PURE__*/Object.freeze({
321
526
  ChevronRightVariant: ChevronRightVariant,
322
527
  ChevronUp: ChevronUp,
323
528
  ChevronUpSolid: ChevronUpSolid,
324
- CircleUp: CircleUp
529
+ CircleUp: CircleUp,
530
+ CircleChevronLeft: CircleChevronLeft,
531
+ CircleChevronRight: CircleChevronRight,
532
+ CircleChevronDown: CircleChevronDown,
533
+ CircleChevronUp: CircleChevronUp,
534
+ ChevronDownVariant: ChevronDownVariant,
535
+ ChevronUpVariant: ChevronUpVariant,
536
+ ChevronLeftVariant: ChevronLeftVariant,
537
+ CircleLineUp: CircleLineUp,
538
+ CircleLineDown: CircleLineDown,
539
+ CircleLineLeft: CircleLineLeft,
540
+ CircleLineRight: CircleLineRight
325
541
  });
326
542
 
327
543
  var Clock = function (_a) {
@@ -374,7 +590,7 @@ var Shipping = function (_a) {
374
590
  return (jsx$1(IconWrapper$1, __assign$1({ width: width, height: height, viewBoxX: 40, viewBoxY: 40, title: "Shipping" }, { children: jsx$1("path", { d: "M38.7573 19.8505L36.5475 17.0208L32.9942 9.99748C32.796 9.60365 32.3849 9.34839 31.9371 9.34839H26.8861V8.17419C26.8861 7.52511 26.3575 7 25.7041 7H5.95551C5.30212 7 4.77353 7.52511 4.77353 8.17419C4.77353 8.18878 4.77353 8.20337 4.77353 8.21795C4.77353 8.22525 4.77353 8.22525 4.77353 8.23254V10.0558C4.77353 10.6976 5.30212 11.2227 5.94817 11.2227H14.3835C15.0076 11.2227 15.7197 11.7259 15.7197 12.3459V12.4261C15.7197 13.046 15.0076 13.5492 14.3835 13.5492H4.77353V13.5784H4.24494C3.6356 13.5784 2.97486 13.9576 2.97486 14.7526C2.9822 15.5257 3.6356 15.9705 4.24494 15.9705H11.8728C12.5115 15.9705 13.0401 16.4592 13.0401 17.1812C13.0401 17.7865 12.4894 18.2971 11.8801 18.2971H2.10122C1.49188 18.2971 1 18.8732 1 19.4712C1 20.0766 1.49188 20.6892 2.10122 20.6892H8.89211C9.50879 20.6892 10.0007 21.1778 10.0007 21.7832C10.0007 22.3885 9.50879 23.0813 8.89945 23.0813H3.59155C2.99689 23.0813 2.49032 23.5335 2.46096 24.1243C2.43159 24.7515 2.93815 25.2693 3.56218 25.2693H5.36085V28.5512C5.36085 29.1565 5.85273 29.6452 6.46207 29.6452H8.26074C8.65718 31.5778 10.3751 33 12.394 33C14.4129 33 16.1382 31.5778 16.5273 29.6452H27.7084C28.1048 31.5778 29.8227 33 31.8416 33C33.8605 33 35.5858 31.5778 35.9749 29.6452H37.8983C38.5077 29.6452 38.9996 29.1565 38.9996 28.5512V28.223V21.9947V20.5725C39.0069 20.31 38.9188 20.0547 38.7573 19.8505ZM13.8182 30.2286C12.5702 31.4684 10.4412 30.6224 10.3751 28.894C10.309 27.1874 12.2105 26.1736 13.5907 27.1947C14.6038 27.9459 14.6772 29.3753 13.8182 30.2286ZM26.8861 16.6196V11.7041H31.2102L33.699 16.6196H26.8861ZM33.2732 30.2286C32.0252 31.4684 29.8961 30.6224 29.83 28.894C29.764 27.1874 31.6654 26.1736 33.0456 27.1947C34.0588 27.9459 34.1322 29.3753 33.2732 30.2286Z", fill: fill }, void 0) }), void 0));
375
591
  };
376
592
 
377
- var LightBulb = function (_a) {
593
+ var LightBulb$1 = function (_a) {
378
594
  var height = _a.height, width = _a.width, fill = _a.fill;
379
595
  return (jsx$1(IconWrapper$1, __assign$1({ width: width, height: height, viewBoxX: 18, viewBoxY: 14, title: "LightBulb" }, { children: jsx$1("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M6.98637 11.9815C6.98671 12.1398 7.03367 12.2945 7.12139 12.4263L7.55212 13.0734C7.68386 13.2727 7.98462 13.4331 8.22316 13.4331H9.77733C10.0159 13.4331 10.3166 13.2727 10.4484 13.0734L10.8789 12.4263C10.9607 12.2917 11.0075 12.1388 11.0151 11.9815V11.0157H6.98485L6.98637 11.9815ZM8.98614 0.53701C6.41659 0.54482 4.56669 2.62771 4.56669 4.97031C4.56519 6.04361 4.95533 7.08058 5.66393 7.88672C6.08006 8.36154 6.73094 9.35324 6.97906 10.19C6.97906 10.1971 6.98082 10.2034 6.98183 10.2097H11.0182C11.0182 10.2034 11.0199 10.1971 11.0209 10.19C11.269 9.35323 11.9199 8.36154 12.3361 7.88672C13.0447 7.08058 13.4348 6.04361 13.4333 4.97031C13.4333 2.51764 11.4411 0.5292 8.98614 0.53701ZM9 2.95517C7.88759 2.95642 6.98611 3.8579 6.98486 4.97031C6.98486 5.1929 6.80442 5.37334 6.58183 5.37334C6.35924 5.37334 6.1788 5.1929 6.1788 4.97031C6.18047 3.4129 7.44258 2.15078 8.99999 2.14912C9.22257 2.14912 9.40302 2.32956 9.40302 2.55215C9.40302 2.77474 9.22258 2.95518 8.99999 2.95518L9 2.95517ZM3.76064 5.37334C3.76064 5.03946 3.48998 4.7688 3.1561 4.7688H1.54399C1.21011 4.7688 0.939453 5.03946 0.939453 5.37334C0.939453 5.70722 1.21011 5.97788 1.54399 5.97788H3.1561C3.48998 5.97788 3.76064 5.70722 3.76064 5.37334ZM16.456 4.7688H14.8439C14.51 4.7688 14.2394 5.03946 14.2394 5.37334C14.2394 5.70722 14.51 5.97788 14.8439 5.97788H16.456C16.7899 5.97788 17.0605 5.70722 17.0605 5.37334C17.0605 5.03946 16.7899 4.7688 16.456 4.7688ZM4.24125 1.92796L2.84526 1.12191C2.55618 0.95486 2.18644 1.05389 2.01947 1.34302C1.8525 1.63215 1.95154 2.00189 2.24067 2.16886L3.63671 2.97483C3.92579 3.14188 4.29553 3.04285 4.4625 2.75372C4.62947 2.46459 4.53043 2.09485 4.2413 1.92788L4.24125 1.92796ZM15.7593 8.57791L14.3633 7.77186C14.0742 7.6048 13.7045 7.70384 13.5375 7.99297C13.3705 8.2821 13.4696 8.65184 13.7587 8.81881L15.1547 9.62478C15.4438 9.79183 15.8136 9.6928 15.9805 9.40367C16.1475 9.11454 16.0485 8.7448 15.7593 8.57783L15.7593 8.57791ZM3.63671 7.77185L2.24072 8.5779C1.95154 8.74478 1.8525 9.11452 2.01947 9.40365C2.18644 9.69278 2.55618 9.79182 2.84531 9.62485L4.24125 8.81871C4.53043 8.65183 4.62947 8.28209 4.4625 7.99296C4.29553 7.70383 3.92579 7.6048 3.63666 7.77176L3.63671 7.77185ZM14.0615 3.05593C14.1677 3.05613 14.272 3.02814 14.3638 2.97482L15.7598 2.16877C16.049 2.00189 16.148 1.63215 15.981 1.34302C15.8141 1.05389 15.4443 0.95485 15.1552 1.12182L13.7593 1.92796C13.5224 2.06482 13.407 2.34366 13.4778 2.60787C13.5486 2.87209 13.788 3.05584 14.0615 3.05593H14.0615Z", fill: fill }, void 0) }), void 0));
380
596
  };
@@ -384,6 +600,26 @@ var ErrorCross = function (_a) {
384
600
  return (jsx$1(IconWrapper$1, __assign$1({ width: width, height: height, viewBoxX: 17, viewBoxY: 17, title: "ErrorCross" }, { children: jsxs$1("g", { children: [jsx$1("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M16.5649 13.7595L3.24133 0.43581C2.66025 -0.14527 1.71818 -0.14527 1.13801 0.43581L0.43581 1.13693C-0.14527 1.7182 -0.14527 2.66028 0.43581 3.24046L13.7594 16.5642C14.3406 17.1453 15.2827 17.1453 15.8629 16.5642L16.564 15.8631C17.1462 15.2829 17.1462 14.3406 16.5649 13.7596V13.7595Z", fill: fill }, void 0), jsx$1("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M13.7595 0.436691L0.43581 13.7602C-0.14527 14.3413 -0.14527 15.2836 0.43581 15.8637L1.13693 16.5648C1.7182 17.1459 2.66028 17.1459 3.24046 16.5648L16.5651 3.2422C17.1464 2.66112 17.1464 1.71905 16.5651 1.13888L15.864 0.437771C15.2829 -0.144399 14.3408 -0.144399 13.7596 0.436681L13.7595 0.436691Z", fill: fill }, void 0)] }, void 0) }), void 0));
385
601
  };
386
602
 
603
+ var CircleNumber = function (_a) {
604
+ var height = _a.height, width = _a.width; _a.fill;
605
+ return (jsxs$1(IconWrapper$1, __assign$1({ width: width, height: height, viewBoxX: 40, viewBoxY: 40, title: "Shipping empty" }, { children: [jsx$1("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M1 20C1 9.50659 9.50659 1 20 1C30.4934 1 39 9.50659 39 20C39 30.4934 30.4934 39 20 39C9.50659 39 1 30.4934 1 20Z", fill: "#292929" }, void 0), jsx$1("path", { d: "M21.9593 28V11.008H19.8713L15.0473 14.92L16.4153 16.528L19.6313 13.84V28H21.9593Z", fill: "white" }, void 0)] }), void 0));
606
+ };
607
+
608
+ var SizeEmpty = function (_a) {
609
+ var height = _a.height, width = _a.width, fill = _a.fill;
610
+ return (jsx$1(IconWrapper$1, __assign$1({ width: width, height: height, viewBoxX: 40, viewBoxY: 40, title: "size empty" }, { children: jsx$1("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M27.4001 12H23.799V21C23.799 21.5523 23.3512 22 22.799 22C22.2467 22 21.799 21.5523 21.799 21V12H18.1977V17C18.1977 17.5523 17.75 18 17.1977 18C16.6454 18 16.1977 17.5523 16.1977 17V12H12.5931V21C12.5931 21.5523 12.1454 22 11.5931 22C11.0408 22 10.5931 21.5523 10.5931 21V12H6.99524V17C6.99524 17.5523 6.54752 18 5.99524 18C5.44295 18 4.99524 17.5523 4.99524 17V12H2V28H38V12H35.0013V21C35.0013 21.5523 34.5536 22 34.0013 22C33.4491 22 33.0013 21.5523 33.0013 21V12H29.4001V17C29.4001 17.5523 28.9524 18 28.4001 18C27.8479 18 27.4001 17.5523 27.4001 17V12ZM34.0013 10H28.4001H22.799H17.1977H11.5931H5.99524H2C0.895431 10 0 10.8954 0 12V28C0 29.1046 0.895431 30 2 30H38C39.1046 30 40 29.1046 40 28V12C40 10.8954 39.1046 10 38 10H34.0013Z", fill: fill }, void 0) }), void 0));
611
+ };
612
+
613
+ var PlayMini = function (_a) {
614
+ var height = _a.height, width = _a.width; _a.fill;
615
+ return (jsxs$1(IconWrapper$1, __assign$1({ width: width, height: height, viewBoxX: 40, viewBoxY: 40, fill: "none", title: "play mini" }, { children: [jsx$1("path", { d: "M26.5973 19.1975L18.5425 13.1907C18.2469 12.9709 17.8545 12.9378 17.5305 13.1086C17.204 13.2781 17 13.6224 17 13.9945V26.0042C17 26.3803 17.204 26.7232 17.5305 26.8927C17.6686 26.9642 17.8197 27 17.972 27C18.1708 27 18.3721 26.9351 18.5425 26.8067L26.5973 20.8052C26.8515 20.6131 27 20.3165 27 20.0013C27.0013 19.6809 26.849 19.3856 26.5973 19.1975Z", fill: "#292929" }, void 0), jsx$1("path", { d: "M20 2C10.0589 2 2 10.0589 2 20C2 29.9411 10.0589 38 20 38C29.9411 38 38 29.9411 38 20C38 10.0589 29.9411 2 20 2Z", stroke: "#292929", strokeWidth: "2" }, void 0)] }), void 0));
616
+ };
617
+
618
+ var ShippingEmpty = function (_a) {
619
+ var height = _a.height, width = _a.width, fill = _a.fill;
620
+ return (jsx$1(IconWrapper$1, __assign$1({ width: width, height: height, viewBoxX: 40, viewBoxY: 40, title: "Shipping empty" }, { children: jsx$1("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M36.5585 17.0681L38.769 19.9111C38.9306 20.1163 39.0187 20.3728 38.9967 20.6366V28.3085C38.9967 28.9607 38.4679 29.4882 37.8143 29.4882H33.9588C33.4227 31.5107 31.5721 32.9981 29.3837 32.9981C27.1952 32.9981 25.3519 31.5033 24.8085 29.4882H17.7732C17.2371 31.5107 15.3864 32.9981 13.198 32.9981C11.0095 32.9981 9.16625 31.5033 8.62281 29.4882H5.53843C4.88483 29.4882 4.35608 28.9607 4.35608 28.3085C4.35608 27.6564 4.88483 27.1288 5.53843 27.1288H8.60813C9.12219 25.0771 10.9875 23.5456 13.2053 23.5456C15.4231 23.5456 17.2885 25.0697 17.8025 27.1288H24.8011C25.3152 25.0771 27.1805 23.5456 29.3983 23.5456C31.6162 23.5456 33.4815 25.0697 33.9955 27.1288H36.6466V21.0323L34.9209 18.812H25.7044C25.0508 18.812 24.5221 18.2844 24.5221 17.6323V9.35947H5.95703C5.30343 9.35947 4.77468 8.83189 4.77468 8.17974C4.77468 7.52758 5.30343 7 5.95703 7H25.7118C26.3654 7 26.8941 7.52758 26.8941 8.17974V9.35947H31.9466C32.3946 9.35947 32.8059 9.61593 33.0041 10.0116L36.5585 17.0681ZM31.2196 11.7263H26.8941V16.4525H33.599L31.2196 11.7263ZM10.8333 28.2792C10.8333 29.5835 11.8981 30.646 13.2053 30.646C14.5125 30.646 15.5774 29.5835 15.5774 28.2792C15.5774 26.9749 14.5125 25.9124 13.2053 25.9124C11.8981 25.9124 10.8333 26.9749 10.8333 28.2792ZM27.0263 28.2792C27.0263 29.5835 28.0912 30.646 29.3983 30.646C30.7055 30.646 31.7704 29.5835 31.7704 28.2792C31.7704 26.9749 30.7055 25.9124 29.3983 25.9124C28.0912 25.9124 27.0263 26.9749 27.0263 28.2792ZM9.57019 21.1495C10.2238 21.1495 10.7525 21.6771 10.7525 22.3292C10.7525 22.9814 10.2238 23.509 9.57019 23.509H4.12111C3.46751 23.509 2.93876 22.9814 2.93876 22.3292C2.93876 21.6771 3.46751 21.1495 4.12111 21.1495H9.57019ZM13.4771 17.6763C13.4771 17.0241 12.9483 16.4965 12.2947 16.4965H2.18235C1.52875 16.4965 1 17.0241 1 17.6763C1 18.3284 1.52875 18.856 2.18235 18.856H12.2947C12.9483 18.8633 13.4771 18.3357 13.4771 17.6763ZM14.2335 14.2103H4.12111C3.46751 14.2103 2.93876 13.6827 2.93876 13.0306C2.93876 12.3784 3.46751 11.8508 4.12111 11.8508H14.2335C14.8871 11.8508 15.4158 12.3784 15.4158 13.0306C15.4158 13.6827 14.8871 14.2103 14.2335 14.2103Z", fill: fill }, void 0) }), void 0));
621
+ };
622
+
387
623
  var PDP = /*#__PURE__*/Object.freeze({
388
624
  __proto__: null,
389
625
  Clock: Clock,
@@ -396,8 +632,12 @@ var PDP = /*#__PURE__*/Object.freeze({
396
632
  StarHalf: StarHalf,
397
633
  Stopwatch: Stopwatch,
398
634
  Shipping: Shipping,
399
- LightBulb: LightBulb,
400
- ErrorCross: ErrorCross
635
+ LightBulb: LightBulb$1,
636
+ ErrorCross: ErrorCross,
637
+ CircleNumber: CircleNumber,
638
+ SizeEmpty: SizeEmpty,
639
+ PlayMini: PlayMini,
640
+ ShippingEmpty: ShippingEmpty
401
641
  });
402
642
 
403
643
  var Facebook = function (_a) {
@@ -497,6 +737,81 @@ var Benefits = function (_a) {
497
737
  return (jsxs$1(IconWrapper$1, __assign$1({ width: width, height: height, viewBoxX: 25, viewBoxY: 24, title: "Benefits" }, { children: [jsx$1("path", { d: "M1.50086 15.0492C1.66801 14.6891 1.94945 14.5589 2.34477 14.5718C2.99531 14.5928 3.64758 14.5817 4.29899 14.5718C4.40244 14.5688 4.50244 14.5339 4.58516 14.4716C5.67184 13.599 6.92653 13.2518 8.30153 13.2685C9.0711 13.2784 9.7947 13.4924 10.5161 13.7347C12.0871 14.2624 13.6529 14.8154 15.2397 15.2859C16.3384 15.6116 17.0874 16.5204 16.7771 17.8344C17.1432 17.736 17.45 17.5508 17.7418 17.336C18.6229 16.6877 19.5036 16.0386 20.3839 15.3886C20.8733 15.0272 21.4152 14.8988 22.0069 15.0418C22.7803 15.2301 23.253 15.7319 23.4549 16.4951C23.4674 16.5419 23.4854 16.5874 23.5009 16.6338V17.1924C23.378 17.6969 23.1571 18.1421 22.7274 18.4587C21.777 19.1574 20.8506 19.8917 19.8726 20.5492C17.1759 22.3629 14.2127 23.0237 11.0056 22.4256C9.60907 22.1652 8.22891 21.8155 6.84102 21.5057C6.35633 21.3974 5.8725 21.2869 5.36891 21.1735C5.36891 21.3218 5.36891 21.4425 5.36891 21.5632C5.36676 22.0359 5.1111 22.2937 4.64317 22.2963C3.88434 22.2963 3.12551 22.2821 2.36582 22.3027C1.96578 22.3135 1.6723 22.1944 1.5 21.8249L1.50086 15.0492ZM5.36805 19.8466C5.44625 19.8664 5.50813 19.8836 5.57043 19.8978C7.24321 20.2789 8.9177 20.6514 10.5879 21.0416C13.0053 21.6066 15.3458 21.4047 17.606 20.3678C19.2362 19.6193 20.567 18.4274 21.9957 17.3828C22.3906 17.094 22.2389 16.4624 21.7761 16.312C21.5329 16.2325 21.3172 16.2995 21.1131 16.4517C20.2414 17.1005 19.3667 17.7459 18.489 18.3878C17.3972 19.1853 16.1777 19.4835 14.856 19.1965C14.1685 19.047 13.5033 18.7866 12.8304 18.5692C12.0149 18.3056 11.2005 18.0378 10.3872 17.7656C10.0757 17.6617 9.90212 17.397 9.92532 17.0971C9.94638 16.8233 10.1496 16.5737 10.4289 16.5307C10.5767 16.5127 10.7267 16.5282 10.8676 16.5763C12.1184 16.9802 13.3663 17.3953 14.6162 17.8013C14.7431 17.8475 14.878 17.8677 15.0128 17.8606C15.1566 17.8448 15.2902 17.779 15.3903 17.6747C15.4905 17.5704 15.5508 17.4342 15.5607 17.29C15.5873 16.9626 15.4159 16.7142 15.0717 16.6003C13.3693 16.037 11.6647 15.4806 9.96356 14.9125C9.41142 14.7277 8.85755 14.5769 8.27016 14.5636C7.2518 14.5404 6.31036 14.7617 5.49567 15.4011C5.4368 15.4475 5.37364 15.5343 5.37364 15.6022C5.36805 17.0098 5.36805 18.4171 5.36805 19.8466ZM2.80539 15.8733V20.9999H4.06739V15.8733H2.80539Z", fill: fill }, void 0), jsx$1("path", { d: "M23.5008 7.25869C23.4033 7.70342 23.3435 8.16104 23.2 8.59073C22.3742 11.1074 19.9052 12.7707 17.3288 12.5675C14.5848 12.3526 12.42 10.3881 11.9749 7.71202C11.4313 4.44639 13.7959 1.36165 17.0963 1.03037C20.285 0.710248 23.0754 2.95537 23.4608 6.1501C23.4703 6.20549 23.4829 6.2603 23.4986 6.31424L23.5008 7.25869ZM17.7 2.28506C15.2156 2.28506 13.1904 4.30459 13.1883 6.78174C13.1861 9.25889 15.2078 11.2862 17.688 11.2935C20.1802 11.2995 22.2139 9.27393 22.2113 6.78518C22.2092 4.30459 20.1853 2.28506 17.7 2.28506Z", fill: fill }, void 0), jsx$1("path", { d: "M18.3501 4.24914C18.5852 4.36773 18.8103 4.46055 19.0127 4.58902C19.341 4.79613 19.4248 5.17727 19.2323 5.48235C19.0398 5.78742 18.6552 5.86906 18.3269 5.6684C17.9484 5.43766 17.5659 5.45355 17.1822 5.63617C17.101 5.67484 17.0473 5.77066 16.9811 5.84027C17.0555 5.89785 17.1216 5.98594 17.205 6.00785C17.5298 6.09379 17.8624 6.14664 18.1868 6.23129C18.4343 6.29574 18.6891 6.3602 18.9152 6.47535C19.8729 6.96176 19.9975 8.18422 19.1558 8.85281C18.9581 9.00922 18.7154 9.11406 18.4825 9.21848C18.3793 9.26488 18.3454 9.30828 18.342 9.41742C18.3286 9.81402 18.0678 10.0839 17.7082 10.0886C17.3485 10.0933 17.0735 9.82348 17.0602 9.43332C17.0559 9.31945 17.0142 9.27992 16.9154 9.23996C16.7288 9.17 16.5492 9.08252 16.3791 8.97871C16.0564 8.7716 15.9761 8.38231 16.1733 8.08196C16.3645 7.79063 16.7465 7.70469 17.0632 7.89934C17.4409 8.13094 17.8233 8.12449 18.2075 7.94231C18.2934 7.89934 18.3497 7.79793 18.4193 7.72359C18.3415 7.66859 18.2711 7.58566 18.1851 7.56375C17.8113 7.46922 17.4306 7.40176 17.0576 7.30594C16.8424 7.25508 16.6343 7.17787 16.438 7.07606C15.5455 6.58363 15.4175 5.44324 16.1896 4.77336C16.3998 4.59117 16.6808 4.49191 16.924 4.34582C16.9794 4.31273 17.0529 4.24226 17.0499 4.1907C17.0448 4.09941 17.0586 4.00806 17.0903 3.92231C17.122 3.83656 17.171 3.75825 17.2343 3.69224C17.2976 3.62623 17.3737 3.57394 17.458 3.53861C17.5424 3.50328 17.6331 3.48567 17.7245 3.48687C18.0962 3.50535 18.3299 3.77691 18.3458 4.21734C18.345 4.22894 18.3493 4.24269 18.3501 4.24914Z", fill: fill }, void 0)] }), void 0));
498
738
  };
499
739
 
740
+ var Home = function (_a) {
741
+ var height = _a.height, width = _a.width, fill = _a.fill;
742
+ return (jsx$1(IconWrapper$1, __assign$1({ width: width, height: height, viewBoxX: 40, viewBoxY: 40, title: "Home" }, { children: jsx$1("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M20.6292 2.20886L37.5565 17.7192C38.0415 18.0703 38.1385 18.7483 37.799 19.2206C37.5929 19.5111 37.2534 19.6685 36.926 19.6685C36.6956 19.6685 36.4773 19.608 36.2833 19.4627L19.9987 4.42462L3.7262 19.4627C3.24118 19.8138 2.56215 19.717 2.21051 19.2327C1.85887 18.7483 1.95587 18.0703 2.4409 17.7192L19.3439 2.20886C19.7319 1.93038 20.2533 1.93038 20.6292 2.20886ZM31.9181 19.2206C31.9181 18.6394 32.391 18.1672 32.973 18.1672C33.5551 18.1672 34.0158 18.6394 34.0158 19.2206V36.9466C34.0158 37.5278 33.5429 38 32.9609 38H23.4909C22.9452 38 22.4844 37.5762 22.4481 37.0314V36.9466V26.788C22.4481 25.0566 21.7205 23.64 19.9866 23.64C18.2526 23.64 17.5251 25.0566 17.5251 26.788V36.9466V37.0314C17.4887 37.5762 17.0401 38 16.4823 38H7.01223C6.4302 38 5.9573 37.5278 5.9573 36.9466V19.2206C5.9573 18.6394 6.4302 18.1672 7.01223 18.1672C7.59425 18.1672 8.06715 18.6394 8.06715 19.2206V35.9053H15.4395V26.8001C15.4395 23.9063 17.1007 21.5574 19.9987 21.5574C22.8967 21.5574 24.5579 23.9063 24.5579 26.8001V35.9053H31.9181V19.2206Z", fill: fill }, void 0) }), void 0));
743
+ };
744
+
745
+ var HomeSolid = function (_a) {
746
+ var height = _a.height, width = _a.width, fill = _a.fill;
747
+ return (jsx$1(IconWrapper$1, __assign$1({ width: width, height: height, viewBoxX: 40, viewBoxY: 40, title: "Home solid" }, { children: jsx$1("path", { d: "M38.9792 19.0431C38.9054 18.5828 38.6594 18.1709 38.2905 17.8923L21.1464 2.39973C21.1341 2.38762 21.1095 2.3755 21.0972 2.35128C20.7774 2.12113 20.3962 2 20.0026 2C19.6091 2 19.2278 2.12113 18.908 2.35128C18.8957 2.36339 18.8711 2.3755 18.8588 2.39973L1.71472 17.8923C0.841526 18.5585 0.73084 19.8668 1.59174 20.6541C1.85 20.8964 2.18206 21.0538 2.52642 21.1144C3.03066 21.1992 3.5349 21.0781 3.92845 20.7873C3.95305 20.7752 3.96535 20.751 3.98994 20.7389L5.77323 19.1157V19.2005V21.9139V36.9462C5.77323 37.5276 6.25287 38 6.8432 38H14.2715C14.9479 38 15.5013 37.4549 15.5013 36.7887V26.1292C15.5013 23.646 17.5675 21.5626 20.0887 21.611C22.5361 21.6595 24.5039 23.6218 24.5039 26.0444V36.7645C24.5039 37.4307 25.0573 37.9758 25.7337 37.9758H33.162C33.7523 37.9758 34.232 37.5034 34.232 36.9219V24.4455V19.2005V19.1157L36.0153 20.7389C36.0399 20.751 36.0522 20.7752 36.0768 20.7873C36.4457 21.0538 36.9008 21.175 37.3681 21.1386C37.7863 21.0902 38.1921 20.9085 38.4873 20.6057C38.8808 20.1696 39.0653 19.6124 38.9792 19.0431Z", fill: fill }, void 0) }), void 0));
748
+ };
749
+
750
+ var ShoppingBagV2 = function (_a) {
751
+ var height = _a.height, width = _a.width, fill = _a.fill, _b = _a.testId, testId = _b === void 0 ? 'shopping-bag-icon' : _b;
752
+ return (jsx$1(IconWrapper$1, __assign$1({ width: width, height: height, viewBoxX: 32, viewBoxY: 38, title: "Shopping bag v2", testId: testId }, { children: jsx$1("path", { d: "M35 33.1642L32.8322 9.85821C32.7622 9.38806 32.3427 8.98507 31.8531 8.98507H27.3776C27.3077 5.15672 24.021 2 19.965 2C15.9091 2 12.6224 5.15672 12.6224 9.05224H8.14685C7.65734 9.05224 7.23776 9.45522 7.16783 9.92537L5 33.1642V33.2313C5 35.8507 7.51748 38 10.5944 38H29.4056C32.4825 38 35 35.8507 35 33.2313V33.1642ZM20.035 3.8806C22.972 3.8806 25.4196 6.16418 25.4196 8.98507H14.6503C14.6503 6.16418 17.0979 3.8806 20.035 3.8806ZM29.4056 36.1194H10.5944C8.63636 36.1194 7.02797 34.8433 6.95804 33.2985L9.05594 10.9328H12.6224V13.9552C12.6224 14.4254 13.042 14.8955 13.5315 14.8955C14.0909 14.9627 14.5804 14.4925 14.5804 13.9552V10.8657H25.3496V13.8881C25.3496 14.3582 25.7692 14.8284 26.2587 14.8284C26.8182 14.8955 27.3077 14.4254 27.3077 13.8881V10.7985H30.8741L32.972 33.1642C32.972 34.8433 31.3636 36.1194 29.4056 36.1194Z", fill: fill }, void 0) }), void 0));
753
+ };
754
+
755
+ var UserSolid = function (_a) {
756
+ var height = _a.height, width = _a.width, fill = _a.fill;
757
+ return (jsx$1(IconWrapper$1, __assign$1({ width: width, height: height, viewBoxX: 40, viewBoxY: 40, title: "User Solid" }, { children: jsx$1("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M20.1332 21.3964H20.0523H19.8743C17.4468 21.358 15.4805 20.5424 14.024 18.9883C10.8844 15.626 11.3699 9.9095 11.4346 9.24013C11.645 5.02389 13.7651 3.01579 15.5129 2.07714C17.2445 1.13849 19.0409 1 19.9633 1H20.1009C21.7597 1.03078 23.2566 1.40008 24.5513 2.10792C26.2667 3.04657 28.3625 5.03928 28.5729 9.24013C28.6457 9.9018 29.1231 15.6183 25.9835 18.9883C24.527 20.5424 22.5607 21.358 20.1332 21.3964ZM36.9963 31.1292V31.1523C37.0044 31.4138 37.0368 33.5989 36.5675 34.7145C36.4785 34.9453 36.3005 35.1531 36.0658 35.2916C35.4265 35.6763 29.5762 39 20.0038 39C9.96194 39 3.99026 35.33 3.93362 35.2916C3.70705 35.1531 3.52904 34.953 3.43193 34.7145C2.97071 33.5989 2.99498 31.3985 3.00307 31.1523V31.1215V31.1061C3.01117 31.0522 3.01117 30.9984 3.01117 30.9368V30.9214L3.01207 30.8965C3.06911 29.3286 3.2006 25.7141 6.85473 24.5355C6.88709 24.5201 6.91137 24.5125 6.95183 24.5048C10.5931 23.6354 13.587 22.3889 13.6194 22.3659C14.1373 22.0196 14.8251 22.0812 15.2701 22.4736C15.4562 22.6428 15.6585 22.7967 15.8851 22.9121C17.0826 23.5353 20.5378 24.9664 24.0658 22.9121C24.26 22.7967 24.438 22.6736 24.5918 22.5197C25.0368 22.0889 25.7489 22.0119 26.2829 22.3659C26.3153 22.3889 29.4144 23.6354 33.0476 24.5048L33.0638 24.5125C33.0678 24.5125 33.0739 24.5144 33.08 24.5163C33.086 24.5182 33.0921 24.5201 33.0961 24.5201C33.1042 24.524 33.1123 24.5259 33.1204 24.5278C33.1285 24.5298 33.1366 24.5317 33.1447 24.5355C36.8183 25.7204 36.9397 29.3673 36.9882 30.9291V30.9368V31.0292C36.9963 31.0599 36.9963 31.0984 36.9963 31.1292Z", fill: fill }, void 0) }), void 0));
758
+ };
759
+
760
+ var SlideDot$1 = function (_a) {
761
+ var height = _a.height, width = _a.width; _a.fill;
762
+ return (jsx$1(IconWrapper$1, __assign$1({ width: width, height: height, viewBoxX: 16, viewBoxY: 16, fill: "none", title: "Slide Dot" }, { children: jsx$1("circle", { cx: "8", cy: "8", r: "7.5", stroke: "#292929" }, void 0) }), void 0));
763
+ };
764
+
765
+ var SlideDotSolid = function (_a) {
766
+ var height = _a.height, width = _a.width, _b = _a.fill, fill = _b === void 0 ? '#292929' : _b;
767
+ return (jsx$1(IconWrapper$1, __assign$1({ width: width, height: height, viewBoxX: 16, viewBoxY: 16, title: "Map Solid" }, { children: jsx$1("circle", { cx: "8", cy: "8", r: "8", fill: fill }, void 0) }), void 0));
768
+ };
769
+
770
+ var Ellipsis = function (_a) {
771
+ var height = _a.height, width = _a.width, fill = _a.fill;
772
+ return (jsx$1(IconWrapper$1, __assign$1({ width: width, height: height, viewBoxX: 40, viewBoxY: 40, title: "ellipsis" }, { children: jsx$1("path", { d: "M20 15.92C22.2083 15.92 24 17.7475 24 20C24 22.2525 22.2083 24.08 20 24.08C17.7917 24.08 16 22.2525 16 20C16 17.7475 17.7917 15.92 20 15.92ZM16 7.08C16 9.3325 17.7917 11.16 20 11.16C22.2083 11.16 24 9.3325 24 7.08C24 4.8275 22.2083 3 20 3C17.7917 3 16 4.8275 16 7.08ZM16 32.92C16 35.1725 17.7917 37 20 37C22.2083 37 24 35.1725 24 32.92C24 30.6675 22.2083 28.84 20 28.84C17.7917 28.84 16 30.6675 16 32.92Z", fill: fill }, void 0) }), void 0));
773
+ };
774
+
775
+ var EllipsisHorizontal = function (_a) {
776
+ var height = _a.height, width = _a.width, fill = _a.fill;
777
+ return (jsx$1(IconWrapper$1, __assign$1({ width: width, height: height, viewBoxX: 40, viewBoxY: 40, title: "Ellipsis Horizontal" }, { children: jsx$1("path", { d: "M24 20C24 22.2083 22.2083 24 20 24C17.7917 24 16 22.2083 16 20C16 17.7917 17.7917 16 20 16C22.2083 16 24 17.7917 24 20ZM34 16C31.7917 16 30 17.7917 30 20C30 22.2083 31.7917 24 34 24C36.2083 24 38 22.2083 38 20C38 17.7917 36.2083 16 34 16ZM6 16C3.79167 16 2 17.7917 2 20C2 22.2083 3.79167 24 6 24C8.20833 24 10 22.2083 10 20C10 17.7917 8.20833 16 6 16Z", fill: fill }, void 0) }), void 0));
778
+ };
779
+
780
+ var Filters$1 = function (_a) {
781
+ var height = _a.height, width = _a.width, fill = _a.fill;
782
+ return (jsx$1(IconWrapper$1, __assign$1({ width: width, height: height, viewBoxX: 40, viewBoxY: 40, title: "filters" }, { children: jsx$1("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M32.232 1C29.4069 1 27.0889 3.07242 26.5818 5.78801H2.96671C2.53208 5.78801 2.09745 6.07386 2.02501 6.50264C1.88013 7.14581 2.3872 7.71751 2.96671 7.71751H26.6542C27.1613 10.6475 29.8416 12.8628 33.0289 12.4341C35.6367 12.1482 37.665 10.0758 37.9547 7.50312C38.3893 4.00144 35.6367 1 32.232 1ZM32.232 10.4331C30.1313 10.4331 28.4652 8.71799 28.4652 6.71703C28.4652 4.71607 30.2037 3.00096 32.232 3.00096C34.3328 2.9295 36.0713 4.64461 36.0713 6.71703C36.0713 8.78945 34.3328 10.4331 32.232 10.4331ZM37.0127 19.0086H13.3977C12.8906 16.293 10.4277 14.2206 7.45766 14.3636C4.5601 14.5065 2.16962 16.7218 2.02474 19.5803C1.87986 22.7962 4.48766 25.4403 7.74742 25.4403C10.5725 25.4403 12.8906 23.4393 13.3977 20.7952H37.0127C37.4474 20.7952 37.8096 20.5094 37.9544 20.152C38.0993 19.5803 37.6647 19.0086 37.0127 19.0086ZM7.74742 23.7252C5.64669 23.7252 3.98059 22.0101 3.98059 20.0091C3.98059 18.0082 5.71913 16.293 7.74742 16.293C9.7757 16.293 11.5142 18.0082 11.5142 20.0091C11.5867 22.0101 9.84814 23.7252 7.74742 23.7252ZM26.5808 32.3007C27.0879 29.5851 29.4059 27.5127 32.231 27.5127C35.6357 27.5127 38.3883 30.5142 37.9537 34.0158C37.6639 36.5885 35.6357 38.6609 33.0279 38.9468C29.8405 39.3756 27.1603 37.1602 26.6532 34.2302H3.03814C2.45863 34.2302 1.95156 33.6585 2.09643 33.0154C2.16887 32.5866 2.60351 32.3007 3.03814 32.3007H26.5808ZM28.4642 33.3012C28.4642 35.3022 30.1303 37.0173 32.231 37.0173C34.3318 37.0173 35.9978 35.3022 35.9978 33.3012C35.9978 31.3003 34.3318 29.5851 32.231 29.5851C30.2027 29.5851 28.4642 31.3003 28.4642 33.3012Z", fill: fill }, void 0) }), void 0));
783
+ };
784
+
785
+ var Lock = function (_a) {
786
+ var height = _a.height, width = _a.width, fill = _a.fill;
787
+ return (jsx$1(IconWrapper$1, __assign$1({ width: width, height: height, viewBoxX: 40, viewBoxY: 40, title: "Lock" }, { children: jsx$1("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M8.837 13.0762C8.837 6.9557 13.8578 2 20 2C26.1422 2 31.163 6.9557 31.163 13.0762V16.9129H31.8238C34.1164 16.9129 36 18.7594 36 21.0652V33.8477C36 36.1535 34.1164 38 31.8238 38H8.17622C5.88362 38 4 36.1535 4 33.8477V21.0652C4 18.7594 5.88362 16.9129 8.17622 16.9129H8.837V13.0762ZM20 3.91342C14.8829 3.91342 10.7401 8.03844 10.7401 13.0762V17.8696C10.7401 18.3968 10.3152 18.8263 9.78855 18.8263H8.17622C6.90875 18.8263 5.9031 19.842 5.9031 21.0652V33.8477C5.9031 35.0709 6.90875 36.0866 8.17622 36.0866H31.8238C33.0912 36.0866 34.0969 35.0709 34.0969 33.8477V21.0652C34.0969 19.842 33.0912 18.8263 31.8238 18.8263H30.2114C29.6848 18.8263 29.2599 18.3968 29.2599 17.8696V13.0762C29.2599 8.03844 25.1171 3.91342 20 3.91342ZM13.3262 13.0762C13.3262 9.99299 15.85 6.42901 20 6.42901C24.15 6.42901 26.6738 9.99299 26.6738 13.0762V17.8696C26.6738 18.3968 26.2489 18.8263 25.7222 18.8263H14.2778C13.7511 18.8263 13.3262 18.3968 13.3262 17.8696V13.0762ZM20 8.34244C17.0668 8.34244 15.2293 10.875 15.2293 13.0762V16.9129H24.7707V13.0762C24.7707 10.875 22.9332 8.34244 20 8.34244ZM20 32C18.8929 32 18 31.1667 18 30.1333V25.8667C18 24.8333 18.8929 24 20 24C21.1071 24 22 24.8333 22 25.8667V30.1333C22 31.1667 21.1071 32 20 32Z", fill: fill }, void 0) }), void 0));
788
+ };
789
+
790
+ var LockSolid = function (_a) {
791
+ var height = _a.height, width = _a.width, fill = _a.fill;
792
+ return (jsx$1(IconWrapper$1, __assign$1({ width: width, height: height, viewBoxX: 40, viewBoxY: 40, title: "Lock solid" }, { children: jsx$1("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M31.5357 17.625H33.3571C35.3683 17.625 37 19.2207 37 21.1875V35.4375C37 37.4043 35.3683 39 33.3571 39H6.64286C4.6317 39 3 37.4043 3 35.4375V21.1875C3 19.2207 4.6317 17.625 6.64286 17.625H8.46429V12.2812C8.46429 6.06172 13.6402 1 20 1C26.3598 1 31.5357 6.06172 31.5357 12.2812V17.625ZM13.5357 12.2812V17.625H26.4643V12.2812C26.4643 9.33477 24 5.9375 20 5.9375C16 5.9375 13.5357 9.33477 13.5357 12.2812ZM20 32C18.8929 32 18 31.1667 18 30.1333V25.8667C18 24.8333 18.8929 24 20 24C21.1071 24 22 24.8333 22 25.8667V30.1333C22 31.1667 21.1071 32 20 32Z", fill: fill }, void 0) }), void 0));
793
+ };
794
+
795
+ var Loading = function (_a) {
796
+ var height = _a.height, width = _a.width, fill = _a.fill;
797
+ return (jsx$1(IconWrapper$1, __assign$1({ width: width, height: height, viewBoxX: 40, viewBoxY: 40, title: "Loading" }, { children: jsx$1("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M29.1958 7.86544C23.6297 3.33207 15.4135 3.40801 9.92333 8.3742C5.89114 12.0191 4.19018 17.57 5.4659 22.8551C5.60259 23.4019 5.26088 23.9562 4.71414 24.0929C4.63061 24.1157 4.55467 24.1233 4.47114 24.1233C4.00794 24.1233 3.59029 23.8119 3.47639 23.3411C2.01842 17.327 3.96237 11.0092 8.54889 6.85549C11.8825 3.83325 16.2032 2.29175 20.6986 2.51956C24.3283 2.70181 27.7227 4.0079 30.4791 6.26319L30.3197 2.06395C30.2969 1.49443 30.7373 1.02363 31.3068 1.00085C31.8688 0.978065 32.3472 1.41849 32.3699 1.98801L32.6205 8.68554V8.69313V8.7311V8.80704C32.6205 9.36137 32.1877 9.80939 31.6334 9.83217L24.8599 10.0828H24.8219C24.2752 10.0828 23.8196 9.64992 23.7968 9.09559C23.774 8.52608 24.2144 8.05527 24.784 8.03249L29.1958 7.86544ZM35.2859 16.03C35.8326 15.894 36.3869 16.2339 36.5236 16.7778C37.9816 22.7677 36.0376 29.0446 31.4511 33.1763C28.3226 35.9862 24.3435 37.512 20.1595 37.512C19.8785 37.512 19.59 37.5044 19.3014 37.4893C15.6945 37.308 12.3153 36.0164 9.55885 33.7957L9.92334 37.8821C9.97649 38.4486 9.55885 38.9396 8.99692 38.9924C8.96655 39 8.93618 39 8.9058 39C8.38184 39 7.93382 38.5997 7.88826 38.0709L7.28078 31.3559C7.22762 30.7894 7.64527 30.2984 8.20719 30.2456L14.9579 29.6413C15.5274 29.5884 16.021 29.9963 16.0741 30.5628C16.1273 31.1293 15.7096 31.6203 15.1477 31.6732L10.6827 32.0735C13.4012 34.3244 16.7727 35.465 20.1519 35.465C23.6905 35.465 27.2443 34.2111 30.0767 31.6656C34.1089 28.04 35.8174 22.5184 34.5341 17.2612C34.3974 16.7173 34.7391 16.1659 35.2859 16.03Z", fill: fill }, void 0) }), void 0));
798
+ };
799
+
800
+ var MapSolid = function (_a) {
801
+ var height = _a.height, width = _a.width, fill = _a.fill;
802
+ return (jsx$1(IconWrapper$1, __assign$1({ width: width, height: height, viewBoxX: 40, viewBoxY: 40, title: "Map Solid" }, { children: jsx$1("path", { d: "M18.5612 38.2333C7.96656 22.6 6 20.9955 6 15.25C6 7.37992 12.268 1 20 1C27.732 1 34 7.37992 34 15.25C34 20.9955 32.0334 22.6 21.4388 38.2333C20.7435 39.2556 19.2564 39.2555 18.5612 38.2333ZM20 21.1875C23.2217 21.1875 25.8333 18.5292 25.8333 15.25C25.8333 11.9708 23.2217 9.3125 20 9.3125C16.7783 9.3125 14.1667 11.9708 14.1667 15.25C14.1667 18.5292 16.7783 21.1875 20 21.1875Z", fill: fill }, void 0) }), void 0));
803
+ };
804
+
805
+ var UserV2 = function (_a) {
806
+ var height = _a.height, width = _a.width, fill = _a.fill;
807
+ return (jsx$1(IconWrapper$1, __assign$1({ width: width, height: height, viewBoxX: 40, viewBoxY: 40, title: "User" }, { children: jsx$1("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M20.1251 21.4006H20.0442H19.8661C17.4374 21.3621 15.4702 20.5464 14.013 18.9919C10.8719 15.629 11.3577 9.9113 11.4224 9.2418C11.6329 5.02471 13.754 3.0162 15.5026 2.07736C17.235 1.13852 19.0322 1 19.9551 1H20.0928C21.7523 1.03078 23.25 1.40016 24.5453 2.10814C26.2616 3.04698 28.3583 5.0401 28.5688 9.2418C28.6416 9.90361 29.1193 15.6213 25.9782 18.9919C24.521 20.5464 22.5538 21.3621 20.1251 21.4006ZM13.9887 9.44188V9.47266C13.9885 9.47513 13.9882 9.47848 13.9878 9.48268C13.9598 9.79248 13.5114 14.7562 15.9236 17.3528C16.9031 18.407 18.2146 18.9226 19.9389 18.938H20.0199C21.7442 18.9226 23.0557 18.3994 24.0353 17.3528C24.7477 16.5909 25.6625 15.1288 25.9539 12.4585C26.1239 10.9117 26.0106 9.64196 25.9944 9.48036C25.9863 9.44188 25.9863 9.4034 25.9863 9.38032C25.8811 7.15634 25.1201 5.52491 23.7196 4.5399C22.5133 3.6857 21.048 3.48562 20.0361 3.46254H19.947C19.008 3.46254 17.6317 3.63183 16.4255 4.41677C14.9278 5.39409 14.1102 7.06399 13.9968 9.38801C13.9968 9.40072 13.9944 9.4111 13.9922 9.42043C13.9904 9.42804 13.9887 9.43496 13.9887 9.44188ZM36.9962 31.1353V31.1584C37.0043 31.42 37.0367 33.6055 36.5834 34.7136C36.4943 34.9445 36.3162 35.1523 36.0814 35.2908C35.4419 35.6756 29.5888 39 20.0118 39C9.96524 39 3.99073 35.3293 3.93406 35.2908C3.70739 35.1523 3.52929 34.9522 3.43214 34.7136C2.97069 33.5978 2.99498 31.3969 3.00308 31.1507V31.1199V31.1045C3.01117 31.0506 3.01117 30.9968 3.01117 30.9352V30.9198L3.01208 30.8949C3.06914 29.3267 3.2007 25.7114 6.85655 24.5326C6.88893 24.5172 6.91322 24.5095 6.9537 24.5018C10.5967 23.6322 13.6406 21.6468 13.673 21.6237C14.264 21.2313 15.0816 21.3698 15.4945 21.9239C15.6969 22.1932 15.7697 22.5164 15.7131 22.8396C15.6483 23.1628 15.4621 23.4475 15.1707 23.6399L15.1302 23.663C14.2964 24.194 11.2848 25.987 7.64991 26.872C5.87699 27.4723 5.6746 29.2422 5.61793 31.0045C5.61793 31.019 5.61613 31.0352 5.61422 31.0524C5.61209 31.0716 5.60984 31.0919 5.60984 31.1122V31.1891C5.60174 31.8433 5.65032 32.8437 5.76365 33.4439C7.26133 34.2288 12.3372 36.5375 20.0037 36.5375C27.7026 36.5375 32.7461 34.2288 34.2357 33.4516C34.349 32.8667 34.3976 31.9048 34.3895 31.2122C34.3814 31.143 34.3814 31.0737 34.3814 31.0045C34.3247 29.2499 34.1223 27.4799 32.3494 26.8797C28.2288 25.887 24.9663 23.74 24.8286 23.6476C24.5372 23.4552 24.3429 23.1705 24.2862 22.8473C24.2296 22.5241 24.3024 22.2009 24.5048 21.9316C24.9258 21.3775 25.7353 21.239 26.3263 21.6314C26.3587 21.6545 29.4107 23.6399 33.0456 24.5095L33.0618 24.5172C33.0659 24.5172 33.0719 24.5191 33.078 24.5211C33.0841 24.523 33.0901 24.5249 33.0942 24.5249C33.1023 24.5288 33.1104 24.5307 33.1185 24.5326C33.1266 24.5345 33.1347 24.5364 33.1428 24.5403C36.8181 25.7254 36.9396 29.373 36.9881 30.9352V30.9429V31.0352C36.9962 31.066 36.9962 31.1045 36.9962 31.1353Z", fill: fill }, void 0) }), void 0));
808
+ };
809
+
810
+ var ShoppingCartV2 = function (_a) {
811
+ var height = _a.height, width = _a.width, fill = _a.fill;
812
+ return (jsx$1(IconWrapper$1, __assign$1({ width: width, height: height, viewBoxX: 40, viewBoxY: 40, title: "Shopping cart v2" }, { children: jsx$1("path", { d: "M9.82547 25.2855C10.4093 25.5724 11.0307 25.7113 11.6804 25.7113C18.4222 25.7113 25.1546 25.7205 31.8965 25.702C34.1186 25.6928 35.9359 23.9527 35.9736 21.7685C36.0206 18.9456 35.9924 16.1319 35.983 13.309C35.983 12.7722 35.6252 12.3835 35.0696 12.3002C33.3183 12.0595 31.5575 11.8282 29.8061 11.5875C27.1414 11.2266 24.4767 10.8656 21.8214 10.5046C18.9684 10.1159 16.1153 9.72718 13.2717 9.33846C12.0476 9.17186 10.8236 9.00526 9.57124 8.83866C9.57124 8.69058 9.57124 8.561 9.57124 8.44068C9.57124 7.47812 9.57124 6.52481 9.57124 5.56225C9.57124 4.83107 9.41117 4.59969 8.71439 4.31277C8.23418 4.10915 7.74455 3.91479 7.26433 3.72042C5.95552 3.1651 4.6467 2.61903 3.32846 2.06371C3.2908 2.0452 3.25314 2.03594 3.21547 2.02669C3.03657 1.98041 2.80117 1.98966 2.56577 2.09147C2.29271 2.20254 1.98198 2.53573 2.00082 3.06329C2.01965 3.60936 2.38687 3.86851 2.85767 4.06287C4.28889 4.64596 5.72012 5.25682 7.15134 5.83066C7.38674 5.92321 7.53739 6.1546 7.53739 6.40449C7.52798 13.5126 7.52798 20.6115 7.52798 27.7197C7.52798 27.84 7.52798 27.9603 7.53739 28.0806C7.67863 29.7003 8.49782 30.8758 10.0044 31.5607C10.3528 31.718 10.7294 31.8106 11.0966 31.9216C9.91963 34.1337 10.833 36.0588 11.9911 37.0306C13.3753 38.1783 15.3526 38.3079 16.8686 37.3361C17.6125 36.8548 18.1586 36.1976 18.4693 35.3739C18.9119 34.2077 18.7706 33.0786 18.2057 31.9772H27.2732C26.9248 32.6065 26.7365 33.2452 26.7365 33.9208C26.7554 35.6423 27.5745 36.8918 29.1376 37.6322C30.5971 38.3171 32.3767 38.021 33.5631 36.9473C34.7966 35.8274 35.2297 34.1615 34.6836 32.6528C34.0715 30.9498 32.5556 29.941 30.5971 29.9317C24.4202 29.9317 18.2339 29.9317 12.0571 29.9317C11.8876 29.9317 11.7275 29.9317 11.558 29.9225C10.494 29.8669 9.62774 29.1265 9.56182 28.0806C9.49591 27.1273 9.55241 26.1648 9.55241 25.1837C9.67482 25.23 9.75014 25.2485 9.82547 25.2855ZM30.9266 31.9402C32.0565 31.9772 32.9416 32.8935 32.9228 33.9949C32.904 35.1148 31.953 36.0033 30.8136 35.9755C29.6931 35.9477 28.7704 35.0222 28.7892 33.9393C28.808 32.8102 29.7779 31.9031 30.9266 31.9402ZM14.7123 31.9402C15.8611 31.9679 16.7556 32.8842 16.7274 34.0134C16.6991 35.1425 15.7575 36.0218 14.6182 35.9848C13.4883 35.9477 12.6032 35.0407 12.622 33.9301C12.6314 32.8009 13.573 31.9124 14.7123 31.9402ZM9.56182 11.0414C9.56182 10.9952 9.57124 10.9489 9.58066 10.8563C10.6258 10.9952 11.6427 11.134 12.6503 11.2728C15.3338 11.6338 18.0268 12.004 20.7103 12.365C23.5539 12.7537 26.3881 13.1332 29.2317 13.5126C30.7006 13.7163 32.1789 13.9106 33.6478 14.1142C33.8079 14.1328 33.9491 14.142 33.9491 14.3641C33.9397 16.8076 33.968 19.2602 33.9209 21.7037C33.8926 22.9346 32.9981 23.6936 31.727 23.7214C31.3315 23.7306 30.9454 23.7214 30.55 23.7214C24.3449 23.7214 18.1398 23.7214 11.9441 23.7214C11.0025 23.7214 10.2304 23.4159 9.79722 22.5552C9.65598 22.2683 9.57124 21.9258 9.57124 21.6111C9.56182 18.0941 9.56182 14.5678 9.56182 11.0414Z", fill: fill }, void 0) }), void 0));
813
+ };
814
+
500
815
  var Navigation = /*#__PURE__*/Object.freeze({
501
816
  __proto__: null,
502
817
  Search: Search,
@@ -507,7 +822,22 @@ var Navigation = /*#__PURE__*/Object.freeze({
507
822
  Hamburger: Hamburger,
508
823
  AddressInformation: AddressInformation,
509
824
  ClubMembership: ClubMembership,
510
- Benefits: Benefits
825
+ Benefits: Benefits,
826
+ Home: Home,
827
+ HomeSolid: HomeSolid,
828
+ ShoppingBagV2: ShoppingBagV2,
829
+ UserSolid: UserSolid,
830
+ SlideDot: SlideDot$1,
831
+ SlideDotSolid: SlideDotSolid,
832
+ Ellipsis: Ellipsis,
833
+ EllipsisHorizontal: EllipsisHorizontal,
834
+ Filters: Filters$1,
835
+ Lock: Lock,
836
+ LockSolid: LockSolid,
837
+ Loading: Loading,
838
+ MapSolid: MapSolid,
839
+ UserV2: UserV2,
840
+ ShoppingCartV2: ShoppingCartV2
511
841
  });
512
842
 
513
843
  var QuestionCircle = function (_a) {
@@ -535,13 +865,73 @@ var Community$1 = function (_a) {
535
865
  return (jsxs$1(IconWrapper$1, __assign$1({ width: width, height: height, viewBoxX: 44, viewBoxY: 35, title: "Messenger" }, { children: [jsx$1("path", { d: "M36.7393 6.25122C28.0886 -0.997151 15.4849 -0.997151 6.83411 6.25122C2.91144 9.55264 0.626988 14.4031 0.580078 19.5299C0.614018 23.698 2.14398 27.7151 4.89127 30.8498C4.34696 32.0819 3.461 33.1322 2.33829 33.8764C1.77439 34.2431 1.49878 34.9225 1.64789 35.5784C1.80045 36.2227 2.33286 36.7073 2.98862 36.7987C3.65885 36.8926 4.33493 36.9382 5.01172 36.9352C7.03693 36.9639 9.03827 36.4953 10.8402 35.5704C14.2113 37.3646 17.9719 38.302 21.7907 38.3C27.2685 38.3566 32.5805 36.4224 36.7393 32.8568C40.704 29.5855 43.0001 24.7142 43.0001 19.5741C43.0001 14.434 40.704 9.56269 36.7393 6.29136V6.25122ZM21.7907 36.1645C18.1368 36.177 14.5417 35.245 11.354 33.459C11.198 33.3674 11.021 33.3177 10.8402 33.3145C10.6505 33.3166 10.4649 33.3693 10.3023 33.467C8.69864 34.4026 6.86795 34.8776 5.01169 34.8398H4.53C5.68805 33.7955 6.56815 32.4795 7.09097 31.0103C7.22293 30.6405 7.14294 30.2282 6.88226 29.9346C4.2045 27.1336 2.70187 23.413 2.68347 19.538C2.68347 10.3697 11.2496 2.91149 21.7987 2.91149C32.3478 2.91149 40.914 10.3778 40.914 19.538C40.914 28.6982 32.3318 36.1645 21.7907 36.1645L21.7907 36.1645Z", fill: fill }, void 0), jsx$1("path", { d: "M25.6687 11.6544C24.2567 11.6527 22.8873 12.1376 21.791 13.0273C19.2677 10.9044 15.5166 11.16 13.3046 13.6056C11.0926 16.0511 11.2135 19.8089 13.5781 22.1072L20.4985 29.0276C20.8406 29.3717 21.3058 29.5653 21.791 29.5653C22.2763 29.5653 22.7415 29.3717 23.0835 29.0276L29.9959 22.1152C31.7328 20.362 32.2481 17.7377 31.3028 15.4579C30.3576 13.1782 28.1365 11.6883 25.6686 11.6785L25.6687 11.6544ZM28.5107 20.6461L21.791 27.3657L15.0714 20.622C13.4974 19.0502 13.4956 16.5 15.0674 14.9259C16.6392 13.3519 19.1894 13.3501 20.7634 14.9219L21.0524 15.211C21.2474 15.4081 21.5138 15.5182 21.791 15.516C22.07 15.515 22.3377 15.4056 22.5377 15.211L22.8106 14.93C24.3891 13.3559 26.9447 13.3595 28.5187 14.938C30.0927 16.5164 30.0891 19.072 28.5107 20.6461L28.5107 20.6461Z", fill: fill }, void 0)] }), void 0));
536
866
  };
537
867
 
868
+ var QuoteLeft = function (_a) {
869
+ var height = _a.height, width = _a.width, fill = _a.fill;
870
+ return (jsx$1(IconWrapper$1, __assign$1({ width: width, height: height, viewBoxX: 40, viewBoxY: 40, title: "quote left" }, { children: jsx$1("path", { d: "M34.25 17.8571H30.5556V17.3214C30.5556 15.8415 31.7365 14.6429 33.1944 14.6429H33.7222C35.4705 14.6429 36.8889 13.2031 36.8889 11.4286V8.21429C36.8889 6.43973 35.4705 5 33.7222 5H33.1944C26.4983 5 21.0556 10.5246 21.0556 17.3214V30.1786C21.0556 32.8371 23.1865 35 25.8056 35H34.25C36.8691 35 39 32.8371 39 30.1786V22.6786C39 20.0201 36.8691 17.8571 34.25 17.8571ZM35.8333 30.1786C35.8333 31.0625 35.1208 31.7857 34.25 31.7857H25.8056C24.9347 31.7857 24.2222 31.0625 24.2222 30.1786V17.3214C24.2222 12.2991 28.2465 8.21429 33.1944 8.21429H33.7222V11.4286H33.1944C29.9948 11.4286 27.3889 14.0737 27.3889 17.3214V21.0714H34.25C35.1208 21.0714 35.8333 21.7946 35.8333 22.6786V30.1786ZM14.1944 17.8571H10.5V17.3214C10.5 15.8415 11.6809 14.6429 13.1389 14.6429H13.6667C15.4149 14.6429 16.8333 13.2031 16.8333 11.4286V8.21429C16.8333 6.43973 15.4149 5 13.6667 5H13.1389C6.44271 5 1 10.5246 1 17.3214V30.1786C1 32.8371 3.1309 35 5.75 35H14.1944C16.8135 35 18.9444 32.8371 18.9444 30.1786V22.6786C18.9444 20.0201 16.8135 17.8571 14.1944 17.8571ZM15.7778 30.1786C15.7778 31.0625 15.0653 31.7857 14.1944 31.7857H5.75C4.87917 31.7857 4.16667 31.0625 4.16667 30.1786V17.3214C4.16667 12.2991 8.19097 8.21429 13.1389 8.21429H13.6667V11.4286H13.1389C9.93924 11.4286 7.33333 14.0737 7.33333 17.3214V21.0714H14.1944C15.0653 21.0714 15.7778 21.7946 15.7778 22.6786V30.1786Z", fill: fill }, void 0) }), void 0));
871
+ };
872
+
873
+ var QuoteRight = function (_a) {
874
+ var height = _a.height, width = _a.width, fill = _a.fill;
875
+ return (jsx$1(IconWrapper$1, __assign$1({ width: width, height: height, viewBoxX: 40, viewBoxY: 40, title: "quote left" }, { children: jsx$1("path", { d: "M14.1944 5H5.75C3.1309 5 1 7.16295 1 9.82143V17.3214C1 19.9799 3.1309 22.1429 5.75 22.1429H9.44444V22.6786C9.44444 24.1585 8.26354 25.3571 6.80556 25.3571H6.27778C4.52951 25.3571 3.11111 26.7969 3.11111 28.5714V31.7857C3.11111 33.5603 4.52951 35 6.27778 35H6.80556C13.5017 35 18.9444 29.4754 18.9444 22.6786V9.82143C18.9444 7.16295 16.8135 5 14.1944 5ZM15.7778 22.6786C15.7778 27.7009 11.7535 31.7857 6.80556 31.7857H6.27778V28.5714H6.80556C10.0052 28.5714 12.6111 25.9263 12.6111 22.6786V18.9286H5.75C4.87917 18.9286 4.16667 18.2054 4.16667 17.3214V9.82143C4.16667 8.9375 4.87917 8.21429 5.75 8.21429H14.1944C15.0653 8.21429 15.7778 8.9375 15.7778 9.82143V22.6786ZM34.25 5H25.8056C23.1865 5 21.0556 7.16295 21.0556 9.82143V17.3214C21.0556 19.9799 23.1865 22.1429 25.8056 22.1429H29.5V22.6786C29.5 24.1585 28.3191 25.3571 26.8611 25.3571H26.3333C24.5851 25.3571 23.1667 26.7969 23.1667 28.5714V31.7857C23.1667 33.5603 24.5851 35 26.3333 35H26.8611C33.5573 35 39 29.4754 39 22.6786V9.82143C39 7.16295 36.8691 5 34.25 5ZM35.8333 22.6786C35.8333 27.7009 31.809 31.7857 26.8611 31.7857H26.3333V28.5714H26.8611C30.0608 28.5714 32.6667 25.9263 32.6667 22.6786V18.9286H25.8056C24.9347 18.9286 24.2222 18.2054 24.2222 17.3214V9.82143C24.2222 8.9375 24.9347 8.21429 25.8056 8.21429H34.25C35.1208 8.21429 35.8333 8.9375 35.8333 9.82143V22.6786Z", fill: fill }, void 0) }), void 0));
876
+ };
877
+
878
+ var QuoteSolidLeft = function (_a) {
879
+ var height = _a.height, width = _a.width, fill = _a.fill;
880
+ return (jsx$1(IconWrapper$1, __assign$1({ width: width, height: height, viewBoxX: 40, viewBoxY: 40, title: "quote solid left" }, { children: jsx$1("path", { d: "M35.4375 20H29.5V15.4286C29.5 12.9071 31.6301 10.8571 34.25 10.8571H34.8438C35.8309 10.8571 36.625 10.0929 36.625 9.14286V5.71429C36.625 4.76429 35.8309 4 34.8438 4H34.25C27.6891 4 22.375 9.11429 22.375 15.4286V32.5714C22.375 34.4643 23.9707 36 25.9375 36H35.4375C37.4043 36 39 34.4643 39 32.5714V23.4286C39 21.5357 37.4043 20 35.4375 20ZM14.0625 20H8.125V15.4286C8.125 12.9071 10.2551 10.8571 12.875 10.8571H13.4688C14.4559 10.8571 15.25 10.0929 15.25 9.14286V5.71429C15.25 4.76429 14.4559 4 13.4688 4H12.875C6.31406 4 1 9.11429 1 15.4286V32.5714C1 34.4643 2.5957 36 4.5625 36H14.0625C16.0293 36 17.625 34.4643 17.625 32.5714V23.4286C17.625 21.5357 16.0293 20 14.0625 20Z", fill: fill }, void 0) }), void 0));
881
+ };
882
+
883
+ var QuoteSolidRight = function (_a) {
884
+ var height = _a.height, width = _a.width, fill = _a.fill;
885
+ return (jsx$1(IconWrapper$1, __assign$1({ width: width, height: height, viewBoxX: 40, viewBoxY: 40, title: "quote solid right" }, { children: jsx$1("path", { d: "M35.4375 4H25.9375C23.9707 4 22.375 5.53571 22.375 7.42857V16.5714C22.375 18.4643 23.9707 20 25.9375 20H31.875V24.5714C31.875 27.0929 29.7449 29.1429 27.125 29.1429H26.5312C25.5441 29.1429 24.75 29.9071 24.75 30.8571V34.2857C24.75 35.2357 25.5441 36 26.5312 36H27.125C33.6859 36 39 30.8857 39 24.5714V7.42857C39 5.53571 37.4043 4 35.4375 4ZM14.0625 4H4.5625C2.5957 4 1 5.53571 1 7.42857V16.5714C1 18.4643 2.5957 20 4.5625 20H10.5V24.5714C10.5 27.0929 8.36992 29.1429 5.75 29.1429H5.15625C4.16914 29.1429 3.375 29.9071 3.375 30.8571V34.2857C3.375 35.2357 4.16914 36 5.15625 36H5.75C12.3109 36 17.625 30.8857 17.625 24.5714V7.42857C17.625 5.53571 16.0293 4 14.0625 4Z", fill: fill }, void 0) }), void 0));
886
+ };
887
+
888
+ var Light = function (_a) {
889
+ var height = _a.height, width = _a.width, fill = _a.fill;
890
+ return (jsx$1(IconWrapper$1, __assign$1({ width: width, height: height, viewBoxX: 40, viewBoxY: 40, title: "light" }, { children: jsx$1("path", { d: "M2.68692 18.3131C2.24299 18.3131 1.88785 18.4907 1.53271 18.757C1.17757 19.0234 1 19.5561 1 20C1 20.4439 1.17757 20.7991 1.44393 21.1542C1.71028 21.5093 2.15421 21.5981 2.59813 21.5981H9.70093C10.1449 21.5981 10.5888 21.4206 10.8551 21.1542C11.2103 20.7991 11.2991 20.4439 11.2991 20C11.2991 19.5561 11.1215 19.1121 10.8551 18.8458C10.5 18.4907 10.1449 18.4019 9.70093 18.4019H2.68692V18.3131ZM14.5841 27.8131C14.9393 27.4579 15.028 27.1028 15.028 26.6589C15.028 26.215 14.8505 25.771 14.5841 25.5047C14.229 25.2383 13.8738 25.0607 13.4299 25.0607C12.986 25.0607 12.6308 25.2383 12.2757 25.5047L6.68224 31.0981C6.3271 31.4533 6.23832 31.8084 6.23832 32.2523C6.23832 32.6963 6.41589 33.0514 6.68224 33.4065C7.03738 33.7617 7.39252 33.8505 7.83645 33.8505C8.28037 33.8505 8.7243 33.6729 8.99065 33.4065L14.5841 27.8131ZM21.1542 29.1449C20.7991 28.7897 20.4439 28.7009 20 28.7009C19.5561 28.7009 19.2009 28.8785 18.8458 29.1449C18.4907 29.5 18.4019 29.8551 18.4019 30.2991V37.4019C18.4019 37.8458 18.5794 38.2897 18.8458 38.5561C19.2009 38.9112 19.5561 39 20 39C20.4439 39 20.7991 38.8224 21.1542 38.5561C21.5093 38.2009 21.5981 37.8458 21.5981 37.4019V30.2991C21.6869 29.8551 21.5093 29.4112 21.1542 29.1449ZM38.5561 18.8458C38.2009 18.4907 37.8458 18.4019 37.4019 18.4019H30.2991C29.8551 18.4019 29.4112 18.5794 29.1449 18.8458C28.7897 19.2009 28.7009 19.5561 28.7009 20C28.7009 20.4439 28.8785 20.7991 29.1449 21.1542C29.5 21.5093 29.8551 21.5981 30.2991 21.5981H37.4019C37.8458 21.5981 38.2009 21.4206 38.5561 21.1542C38.9112 20.7991 39 20.4439 39 20C39 19.5561 38.9112 19.1121 38.5561 18.8458ZM33.4953 33.4953C33.8505 33.1402 33.9393 32.785 33.9393 32.3411C33.9393 31.8972 33.7617 31.4533 33.4953 31.1869L27.9019 25.5935C27.6355 25.3271 27.1916 25.1495 26.7477 25.1495C26.3037 25.1495 25.8598 25.3271 25.5935 25.5935C25.3271 25.9486 25.1495 26.3037 25.1495 26.7477C25.1495 27.1916 25.3271 27.5467 25.5935 27.9019L31.2757 33.4953C31.5421 33.8505 31.986 33.9393 32.4299 33.9393C32.6963 33.9393 33.1402 33.7617 33.4953 33.4953ZM33.9393 7.74766C33.9393 7.30374 33.7617 6.85981 33.4953 6.59346C33.1402 6.23832 32.785 6.14953 32.3411 6.14953C31.8972 6.14953 31.4533 6.3271 31.1869 6.59346L25.5047 12.1869C25.2383 12.5421 25.0607 12.8972 25.0607 13.3411C25.0607 13.785 25.2383 14.1402 25.5047 14.4953C25.8598 14.8505 26.215 14.9393 26.6589 14.9393C27.1028 14.9393 27.5467 14.7617 27.8131 14.4953L33.4065 8.90187C33.7617 8.54673 33.9393 8.19159 33.9393 7.74766ZM21.6869 2.68692C21.6869 2.24299 21.5093 1.88785 21.243 1.53271C20.9766 1.17757 20.4439 1 20 1C19.5561 1 19.2009 1.17757 18.8458 1.44393C18.4907 1.79907 18.4019 2.15421 18.4019 2.59813V9.70093C18.4019 10.1449 18.5794 10.5 18.8458 10.8551C19.2009 11.2103 19.5561 11.2991 20 11.2991C20.4439 11.2991 20.7991 11.1215 21.1542 10.8551C21.5093 10.5888 21.5981 10.1449 21.5981 9.70093V2.68692H21.6869ZM8.90187 6.59346C8.63551 6.23832 8.19159 6.06075 7.74766 6.06075C7.30374 6.06075 6.9486 6.23832 6.59346 6.50467C6.23832 6.85981 6.06075 7.30374 6.06075 7.74766C6.06075 8.19159 6.23832 8.54673 6.50467 8.90187L12.0981 14.4953C12.4533 14.8505 12.8084 14.9393 13.2523 14.9393C13.6963 14.9393 14.1402 14.7617 14.4065 14.4953C14.7617 14.1402 14.8505 13.785 14.8505 13.3411C14.8505 12.8972 14.6729 12.4533 14.4065 12.1869L8.90187 6.59346Z", fill: fill }, void 0) }), void 0));
891
+ };
892
+
893
+ var LightBulb = function (_a) {
894
+ var height = _a.height, width = _a.width, fill = _a.fill;
895
+ return (jsx$1(IconWrapper$1, __assign$1({ width: width, height: height, viewBoxX: 40, viewBoxY: 40, title: "light bulb" }, { children: jsx$1("path", { d: "M7 16C7 15.6022 6.84196 15.2206 6.56066 14.9393C6.27936 14.658 5.89782 14.5 5.5 14.5H1.5C1.10218 14.5 0.720644 14.658 0.43934 14.9393C0.158035 15.2206 0 15.6022 0 16C0 16.3978 0.158035 16.7794 0.43934 17.0607C0.720644 17.342 1.10218 17.5 1.5 17.5H5.5C5.89782 17.5 6.27936 17.342 6.56066 17.0607C6.84196 16.7794 7 16.3978 7 16V16ZM6.6925 21.9513L3.22875 23.9513C3.05438 24.0477 2.901 24.178 2.77754 24.3345C2.65409 24.4909 2.56305 24.6704 2.50973 24.8624C2.45642 25.0544 2.4419 25.2551 2.46703 25.4528C2.49216 25.6505 2.55643 25.8412 2.65609 26.0138C2.75575 26.1864 2.8888 26.3374 3.04747 26.458C3.20613 26.5785 3.38724 26.6663 3.5802 26.7161C3.77316 26.7659 3.97411 26.7767 4.17132 26.748C4.36852 26.7193 4.55802 26.6515 4.72875 26.5487L8.1925 24.5487C8.52926 24.346 8.77298 24.0192 8.87121 23.6385C8.96945 23.2579 8.91435 22.854 8.71778 22.5136C8.5212 22.1732 8.19886 21.9235 7.8201 21.8184C7.44134 21.7132 7.03643 21.7609 6.6925 21.9513V21.9513ZM8.1925 7.45125L4.72875 5.45125C4.55802 5.34846 4.36852 5.28072 4.17132 5.25199C3.97411 5.22326 3.77316 5.23411 3.5802 5.28391C3.38724 5.33372 3.20613 5.42147 3.04747 5.54205C2.8888 5.66263 2.75575 5.81362 2.65609 5.98619C2.55643 6.15877 2.49216 6.34948 2.46703 6.54717C2.4419 6.74487 2.45642 6.94559 2.50973 7.13761C2.56305 7.32963 2.65409 7.5091 2.77754 7.66554C2.901 7.82198 3.05438 7.95226 3.22875 8.04875L6.6925 10.0488C6.86323 10.1515 7.05273 10.2193 7.24993 10.248C7.44714 10.2767 7.64809 10.2659 7.84105 10.2161C8.03401 10.1663 8.21512 10.0785 8.37378 9.95795C8.53245 9.83737 8.6655 9.68638 8.76516 9.51381C8.86482 9.34123 8.92909 9.15053 8.95422 8.95283C8.97935 8.75514 8.96483 8.55442 8.91152 8.3624C8.8582 8.17037 8.76716 7.9909 8.64371 7.83446C8.52025 7.67802 8.36687 7.54775 8.1925 7.45125V7.45125ZM32.5588 10.25C32.8222 10.2505 33.081 10.1811 33.3088 10.0488L36.7725 8.04875C37.1093 7.846 37.353 7.51916 37.4512 7.13854C37.5494 6.75793 37.4944 6.35396 37.2978 6.01356C37.1012 5.67315 36.7789 5.42352 36.4001 5.31836C36.0213 5.21319 35.6164 5.26092 35.2725 5.45125L31.8088 7.45125C31.5229 7.61642 31.2996 7.87125 31.1733 8.17626C31.047 8.48127 31.0249 8.81941 31.1104 9.13827C31.1958 9.45713 31.3841 9.73889 31.6459 9.93989C31.9078 10.1409 32.2286 10.2499 32.5588 10.25ZM38.5 14.5H34.5C34.1022 14.5 33.7206 14.658 33.4393 14.9393C33.158 15.2206 33 15.6022 33 16C33 16.3978 33.158 16.7794 33.4393 17.0607C33.7206 17.342 34.1022 17.5 34.5 17.5H38.5C38.8978 17.5 39.2794 17.342 39.5607 17.0607C39.842 16.7794 40 16.3978 40 16C40 15.6022 39.842 15.2206 39.5607 14.9393C39.2794 14.658 38.8978 14.5 38.5 14.5ZM36.7713 23.9519L33.3075 21.9519C33.1368 21.8491 32.9473 21.7813 32.7501 21.7526C32.5529 21.7239 32.3519 21.7347 32.159 21.7845C31.966 21.8343 31.7849 21.9221 31.6262 22.0427C31.4676 22.1633 31.3345 22.3142 31.2348 22.4868C31.1352 22.6594 31.0709 22.8501 31.0458 23.0478C31.0207 23.2455 31.0352 23.4462 31.0885 23.6382C31.1418 23.8303 31.2328 24.0097 31.3563 24.1662C31.4797 24.3226 31.6331 24.4529 31.8075 24.5494L35.2713 26.5494C35.6152 26.7397 36.0201 26.7874 36.3988 26.6823C36.7776 26.5771 37.0999 26.3275 37.2965 25.9871C37.4931 25.6467 37.5482 25.2427 37.45 24.8621C37.3517 24.4815 37.108 24.1546 36.7713 23.9519ZM20 4C13.6075 4 9 9.1875 9 15C8.99629 17.6631 9.96431 20.236 11.7225 22.2362C12.7619 23.4237 14.3944 25.9113 14.9981 27.9963V28H17.9981V27.9925C17.998 27.6944 17.9531 27.3979 17.865 27.1131C17.5156 26 16.4375 23.0662 13.9788 20.2594C12.7037 18.8042 12.0017 16.9348 12.0037 15C11.99 10.3975 15.7325 7 20 7C21.5364 6.99895 23.0405 7.44064 24.3324 8.27221C25.6243 9.10377 26.6492 10.29 27.2845 11.6889C27.9197 13.0878 28.1384 14.6401 27.9144 16.1601C27.6904 17.68 27.0331 19.1032 26.0212 20.2594C23.5781 23.0475 22.4963 25.9762 22.1406 27.1006C22.0558 27.3915 22.0085 27.6921 22 27.995V28H25C25.6056 25.9144 27.2363 23.4263 28.2756 22.2406C29.6681 20.6509 30.5729 18.6937 30.8819 16.6031C31.1908 14.5125 30.8908 12.3772 30.0176 10.4527C29.1445 8.5282 27.7353 6.89609 25.9587 5.75171C24.1821 4.60733 22.1133 3.99916 20 4V4ZM20 9C18.4093 9.00182 16.8842 9.63455 15.7594 10.7594C14.6345 11.8842 14.0018 13.4093 14 15C14 15.2652 14.1054 15.5196 14.2929 15.7071C14.4804 15.8946 14.7348 16 15 16C15.2652 16 15.5196 15.8946 15.7071 15.7071C15.8946 15.5196 16 15.2652 16 15C16.0013 13.9395 16.4232 12.9229 17.173 12.173C17.9229 11.4232 18.9395 11.0013 20 11C20.2652 11 20.5196 10.8946 20.7071 10.7071C20.8946 10.5196 21 10.2652 21 10C21 9.73478 20.8946 9.48043 20.7071 9.29289C20.5196 9.10536 20.2652 9 20 9ZM15.0037 32.6994C15.0042 32.8961 15.0627 33.0883 15.1719 33.2519L16.7031 35.5537C16.7943 35.6909 16.918 35.8034 17.0631 35.8812C17.2082 35.9591 17.3703 35.9999 17.535 36H22.4631C22.6281 36.0002 22.7906 35.9595 22.9361 35.8817C23.0816 35.8038 23.2055 35.6911 23.2969 35.5537L24.8281 33.25C24.9366 33.0861 24.995 32.8941 24.9963 32.6975L25 30H15L15.0037 32.6994Z", fill: fill }, void 0) }), void 0));
896
+ };
897
+
898
+ var LightBulbSolid = function (_a) {
899
+ var height = _a.height, width = _a.width, fill = _a.fill;
900
+ return (jsx$1(IconWrapper$1, __assign$1({ width: width, height: height, viewBoxX: 40, viewBoxY: 40, title: "light bulb solid" }, { children: jsx$1("path", { d: "M15.0037 32.3963C15.0046 32.7891 15.1211 33.173 15.3387 33.5001L16.4075 35.1057C16.7344 35.6001 17.4806 35.9982 18.0725 35.9982H21.9287C22.5206 35.9982 23.2669 35.6001 23.5938 35.1057L24.6619 33.5001C24.8649 33.1661 24.9812 32.7867 25 32.3963V30.0001H15L15.0037 32.3963ZM19.9656 4.00006C13.59 4.01943 9 9.18756 9 15.0001C8.99629 17.6631 9.96431 20.2361 11.7225 22.2363C12.755 23.4144 14.37 25.8751 14.9856 27.9513C14.9856 27.9688 14.99 27.9844 14.9925 28.0001H25.0075C25.0075 27.9844 25.0119 27.9688 25.0144 27.9513C25.63 25.8751 27.245 23.4144 28.2775 22.2363C30.0357 20.2361 31.0037 17.6631 31 15.0001C31 8.91443 26.0569 3.98068 19.9656 4.00006ZM20 10.0001C18.6744 10.0015 17.4035 10.5288 16.4661 11.4662C15.5288 12.4035 15.0015 13.6744 15 15.0001C15 15.2653 14.8946 15.5196 14.7071 15.7072C14.5196 15.8947 14.2652 16.0001 14 16.0001C13.7348 16.0001 13.4804 15.8947 13.2929 15.7072C13.1054 15.5196 13 15.2653 13 15.0001C13.002 13.1442 13.7401 11.3648 15.0524 10.0525C16.3648 8.74018 18.1441 8.00204 20 8.00006C20.2652 8.00006 20.5196 8.10541 20.7071 8.29295C20.8946 8.48049 21 8.73484 21 9.00006C21 9.26527 20.8946 9.51963 20.7071 9.70716C20.5196 9.8947 20.2652 10.0001 20 10.0001ZM7 16.0001C7 15.6022 6.84196 15.2207 6.56066 14.9394C6.27936 14.6581 5.89782 14.5001 5.5 14.5001H1.5C1.10218 14.5001 0.720644 14.6581 0.43934 14.9394C0.158035 15.2207 0 15.6022 0 16.0001C0 16.3979 0.158035 16.7794 0.43934 17.0607C0.720644 17.342 1.10218 17.5001 1.5 17.5001H5.5C5.89782 17.5001 6.27936 17.342 6.56066 17.0607C6.84196 16.7794 7 16.3979 7 16.0001V16.0001ZM38.5 14.5001H34.5C34.1022 14.5001 33.7206 14.6581 33.4393 14.9394C33.158 15.2207 33 15.6022 33 16.0001C33 16.3979 33.158 16.7794 33.4393 17.0607C33.7206 17.342 34.1022 17.5001 34.5 17.5001H38.5C38.8978 17.5001 39.2794 17.342 39.5607 17.0607C39.842 16.7794 40 16.3979 40 16.0001C40 15.6022 39.842 15.2207 39.5607 14.9394C39.2794 14.6581 38.8978 14.5001 38.5 14.5001ZM8.1925 7.45131L4.72875 5.45131C4.55802 5.34852 4.36852 5.28078 4.17132 5.25205C3.97411 5.22332 3.77316 5.23417 3.5802 5.28397C3.38724 5.33377 3.20613 5.42153 3.04747 5.54211C2.8888 5.66269 2.75575 5.81367 2.65609 5.98625C2.55643 6.15883 2.49216 6.34953 2.46703 6.54723C2.4419 6.74492 2.45642 6.94564 2.50973 7.13766C2.56305 7.32968 2.65409 7.50916 2.77754 7.6656C2.901 7.82204 3.05438 7.95231 3.22875 8.04881L6.6925 10.0488C6.86323 10.1516 7.05273 10.2193 7.24993 10.2481C7.44714 10.2768 7.64809 10.2659 7.84105 10.2161C8.03401 10.1663 8.21512 10.0786 8.37378 9.95801C8.53245 9.83743 8.6655 9.68644 8.76516 9.51386C8.86482 9.34129 8.92909 9.15058 8.95422 8.95289C8.97935 8.75519 8.96483 8.55447 8.91152 8.36245C8.8582 8.17043 8.76716 7.99096 8.64371 7.83452C8.52025 7.67807 8.36687 7.5478 8.1925 7.45131V7.45131ZM36.7713 23.9513L33.3075 21.9513C33.1368 21.8485 32.9473 21.7808 32.7501 21.752C32.5529 21.7233 32.3519 21.7342 32.159 21.784C31.966 21.8338 31.7849 21.9215 31.6262 22.0421C31.4676 22.1627 31.3345 22.3137 31.2348 22.4863C31.1352 22.6588 31.0709 22.8495 31.0458 23.0472C31.0207 23.2449 31.0352 23.4456 31.0885 23.6377C31.1418 23.8297 31.2328 24.0092 31.3563 24.1656C31.4797 24.322 31.6331 24.4523 31.8075 24.5488L35.2713 26.5488C35.6152 26.7391 36.0201 26.7869 36.3988 26.6817C36.7776 26.5765 37.0999 26.3269 37.2965 25.9865C37.4931 25.6461 37.5482 25.2421 37.45 24.8615C37.3517 24.4809 37.108 24.1541 36.7713 23.9513ZM6.6925 21.9513L3.22875 23.9513C3.05438 24.0478 2.901 24.1781 2.77754 24.3345C2.65409 24.491 2.56305 24.6704 2.50973 24.8625C2.45642 25.0545 2.4419 25.2552 2.46703 25.4529C2.49216 25.6506 2.55643 25.8413 2.65609 26.0139C2.75575 26.1864 2.8888 26.3374 3.04747 26.458C3.20613 26.5786 3.38724 26.6663 3.5802 26.7161C3.77316 26.7659 3.97411 26.7768 4.17132 26.7481C4.36852 26.7193 4.55802 26.6516 4.72875 26.5488L8.1925 24.5488C8.52926 24.3461 8.77298 24.0192 8.87121 23.6386C8.96945 23.258 8.91435 22.854 8.71778 22.5136C8.5212 22.1732 8.19886 21.9236 7.8201 21.8184C7.44134 21.7132 7.03643 21.761 6.6925 21.9513V21.9513ZM32.5588 10.2501C32.8222 10.2506 33.081 10.1811 33.3088 10.0488L36.7725 8.04881C37.1093 7.84605 37.353 7.51921 37.4512 7.1386C37.5494 6.75798 37.4944 6.35402 37.2978 6.01361C37.1012 5.67321 36.7789 5.42357 36.4001 5.31841C36.0213 5.21325 35.6164 5.26097 35.2725 5.45131L31.8088 7.45131C31.5229 7.61647 31.2996 7.87131 31.1733 8.17632C31.047 8.48132 31.0249 8.81946 31.1104 9.13832C31.1958 9.45718 31.3841 9.73895 31.6459 9.93995C31.9078 10.1409 32.2286 10.2499 32.5588 10.2501Z", fill: fill }, void 0) }), void 0));
901
+ };
902
+
903
+ var CommentDots = function (_a) {
904
+ var height = _a.height, width = _a.width, fill = _a.fill;
905
+ return (jsxs$1(IconWrapper$1, __assign$1({ width: width, height: height, viewBoxX: 40, viewBoxY: 40, title: "Comment dots" }, { children: [jsx$1("path", { d: "M39.5652 32.3019C39.5305 32.2743 37.9963 30.6278 36.9341 28.5039C38.8432 26.6291 39.9887 24.2769 39.9887 21.7103C39.9887 16.1759 34.6778 11.603 27.7562 10.7867C25.5763 6.80183 20.432 4 14.4407 4C6.46385 4 0.000467582 8.95336 0.000467582 15.069C0.000467582 17.6287 1.14596 19.9808 3.05513 21.8625C1.99294 23.9864 0.465609 25.6329 0.437839 25.6606C0.000467594 26.1241 -0.124496 26.8021 0.132373 27.3901C0.3823 27.9781 0.965462 28.3586 1.60416 28.3586C5.31835 28.3586 8.31747 26.9612 10.2961 25.6744C10.9278 25.8197 11.5735 25.9304 12.2399 26.0065C14.4268 29.9844 19.5642 32.7862 25.5555 32.7862C26.9995 32.7862 28.388 32.6202 29.707 32.3158C31.6856 33.5956 34.6778 35 38.3989 35C39.0376 35 39.6138 34.6195 39.8707 34.0315C40.1206 33.4434 40.0026 32.7655 39.5652 32.3019ZM10.789 23.509L9.87257 23.3015L9.08114 23.8134C7.68571 24.7197 5.57522 25.7643 2.99265 26.0618C3.60358 25.2801 4.39501 24.1524 5.04066 22.8518L5.76267 21.4129L4.61717 20.2852C3.52027 19.2129 2.22204 17.4349 2.22204 15.069C2.22204 10.1848 7.70654 6.21379 14.4407 6.21379C21.1748 6.21379 26.6593 10.1848 26.6593 15.069C26.6593 19.9531 21.1748 23.9241 14.4407 23.9241C13.2119 23.9241 11.9831 23.7858 10.789 23.509ZM30.9081 30.4548L30.1166 29.9429L29.2002 30.1573C28.0061 30.4341 26.7773 30.5724 25.5485 30.5724C21.029 30.5724 17.0788 28.7806 14.9683 26.1241C22.6952 25.9027 28.8809 21.0462 28.8809 15.069C28.8809 14.4117 28.7906 13.7753 28.6518 13.1526C33.8864 14.1558 37.7672 17.6079 37.7672 21.7103C37.7672 24.0763 36.4689 25.8543 35.372 26.9266L34.2265 28.0542L34.9416 29.4863C35.5942 30.7938 36.3856 31.9214 36.9896 32.6963C34.414 32.4057 32.3035 31.3542 30.9081 30.4548Z", fill: fill }, void 0), jsx$1("path", { d: "M14.5 17C15.3284 17 16 16.3284 16 15.5C16 14.6716 15.3284 14 14.5 14C13.6716 14 13 14.6716 13 15.5C13 16.3284 13.6716 17 14.5 17Z", fill: fill }, void 0), jsx$1("path", { d: "M8.5 17C9.32843 17 10 16.3284 10 15.5C10 14.6716 9.32843 14 8.5 14C7.67157 14 7 14.6716 7 15.5C7 16.3284 7.67157 17 8.5 17Z", fill: fill }, void 0), jsx$1("path", { d: "M20.5 17C21.3284 17 22 16.3284 22 15.5C22 14.6716 21.3284 14 20.5 14C19.6716 14 19 14.6716 19 15.5C19 16.3284 19.6716 17 20.5 17Z", fill: fill }, void 0)] }), void 0));
906
+ };
907
+
908
+ var CommentLight = function (_a) {
909
+ var height = _a.height, width = _a.width, fill = _a.fill;
910
+ return (jsx$1(IconWrapper$1, __assign$1({ width: width, height: height, viewBoxX: 40, viewBoxY: 40, title: "Comment Light" }, { children: jsx$1("path", { d: "M39.5652 32.3019C39.5305 32.2743 37.9963 30.6278 36.9341 28.5039C38.8432 26.6291 39.9887 24.2769 39.9887 21.7103C39.9887 16.1759 34.6778 11.603 27.7562 10.7867C25.5763 6.80183 20.432 4 14.4407 4C6.46385 4 0.000467581 8.95336 0.000467581 15.069C0.000467581 17.6287 1.14596 19.9808 3.05513 21.8625C1.99294 23.9864 0.465609 25.6329 0.437839 25.6606C0.000467594 26.1241 -0.124496 26.8021 0.132373 27.3901C0.3823 27.9781 0.965462 28.3586 1.60416 28.3586C5.31835 28.3586 8.31747 26.9612 10.2961 25.6744C10.9278 25.8197 11.5735 25.9304 12.2399 26.0065C14.4268 29.9844 19.5642 32.7862 25.5555 32.7862C26.9995 32.7862 28.388 32.6202 29.707 32.3158C31.6856 33.5956 34.6778 35 38.3989 35C39.0376 35 39.6138 34.6195 39.8707 34.0315C40.1206 33.4434 40.0026 32.7655 39.5652 32.3019V32.3019ZM10.789 23.509L9.87257 23.3015L9.08114 23.8134C7.68571 24.7197 5.57522 25.7643 2.99265 26.0618C3.60358 25.2801 4.39501 24.1524 5.04066 22.8518L5.76267 21.4129L4.61717 20.2852C3.52027 19.2129 2.22204 17.4349 2.22204 15.069C2.22204 10.1848 7.70654 6.21379 14.4407 6.21379C21.1748 6.21379 26.6593 10.1848 26.6593 15.069C26.6593 19.9531 21.1748 23.9241 14.4407 23.9241C13.2119 23.9241 11.9831 23.7858 10.789 23.509ZM30.9081 30.4548L30.1166 29.9429L29.2002 30.1573C28.0061 30.4341 26.7773 30.5724 25.5485 30.5724C21.029 30.5724 17.0788 28.7806 14.9683 26.1241C22.6952 25.9027 28.8809 21.0462 28.8809 15.069C28.8809 14.4117 28.7906 13.7753 28.6518 13.1526C33.8864 14.1558 37.7672 17.6079 37.7672 21.7103C37.7672 24.0763 36.4689 25.8543 35.372 26.9266L34.2265 28.0542L34.9416 29.4863C35.5942 30.7938 36.3856 31.9214 36.9896 32.6963C34.414 32.4057 32.3035 31.3542 30.9081 30.4548V30.4548Z", fill: fill }, void 0) }), void 0));
911
+ };
912
+
913
+ var CommentMoney = function (_a) {
914
+ var height = _a.height, width = _a.width, fill = _a.fill;
915
+ return (jsx$1(IconWrapper$1, __assign$1({ width: width, height: height, viewBoxX: 40, viewBoxY: 40, title: "Comment money" }, { children: jsx$1("path", { d: "M36.9452 28.5073C38.8528 26.6307 40 24.2773 40 21.7143C40 16.1772 34.691 11.6026 27.7653 10.7854C27.7653 10.7861 27.766 10.7868 27.766 10.7875C25.5813 6.80038 20.4404 4 14.4446 4C6.46681 4 0.000171293 8.95654 0.000171293 15.0714C0.000171293 17.6345 1.14739 19.9878 3.05502 21.8644C1.99252 23.9915 0.461975 25.6377 0.436975 25.6626C-0.00121759 26.1256 -0.12205 26.8064 0.130032 27.3919C0.253921 27.6783 0.459289 27.9224 0.720789 28.094C0.982289 28.2655 1.28847 28.357 1.60155 28.3571C5.31959 28.3571 8.31472 26.9566 10.2939 25.6737C10.9244 25.8183 11.5751 25.9283 12.2383 26.0072C14.4265 29.9895 19.5647 32.7857 25.5556 32.7857C26.9994 32.7857 28.391 32.6189 29.7063 32.3166C31.6855 33.5995 34.6806 35 38.3986 35C39.0389 35 39.6174 34.6194 39.8694 34.034C40.1222 33.4486 40.0007 32.7677 39.5625 32.3048C39.5382 32.2799 38.0076 30.6344 36.9452 28.5073ZM10.7932 23.5162L9.87374 23.3051L9.08277 23.8179C7.68903 24.7216 5.57654 25.7727 2.99391 26.0647C3.60293 25.2827 4.3946 24.1542 5.04529 22.8512L5.76195 21.4154L4.61682 20.2888C3.52446 19.2142 2.22238 17.4373 2.22238 15.0714C2.22238 10.1875 7.705 6.21429 14.4446 6.21429C21.1841 6.21429 26.6667 10.1875 26.6667 15.0714C26.6667 19.9553 21.1841 23.9286 14.4446 23.9286C13.2133 23.9286 11.9848 23.7895 10.7932 23.5162ZM30.9181 30.46L30.1271 29.9473L29.2077 30.1583C28.0099 30.433 26.7847 30.5716 25.5556 30.5714C21.032 30.5714 17.0834 28.7765 14.9702 26.1228C22.7022 25.909 28.8889 21.05 28.8889 15.0714C28.8889 14.4175 28.8007 13.7802 28.6584 13.1575C33.8972 14.1567 37.7778 17.6089 37.7778 21.7143C37.7778 24.0801 36.4757 25.8571 35.384 26.931L34.2389 28.0575L34.9556 29.4933C35.607 30.7984 36.4007 31.9284 37.0063 32.7068C34.4236 32.4148 32.3118 31.3637 30.9181 30.46V30.46ZM16.207 14.4424L13.3209 13.5796C13.0279 13.4917 12.8216 13.1907 12.8216 12.8475C12.8216 12.4302 13.123 12.0904 13.4925 12.0904H15.2939C15.5647 12.0904 15.8251 12.1652 16.055 12.305C16.2751 12.4385 16.5626 12.3845 16.7494 12.2081L17.5438 11.4559C17.789 11.2234 17.7786 10.8179 17.5063 10.6179C16.9383 10.2007 16.2584 9.95504 15.5564 9.90384V8.98214C15.5564 8.67629 15.3077 8.42857 15.0008 8.42857H13.8897C13.5828 8.42857 13.3341 8.67629 13.3341 8.98214V9.90937C11.8168 9.99864 10.5994 11.267 10.5994 12.8475C10.5994 14.1608 11.4564 15.3344 12.6828 15.7004L15.5689 16.5633C15.8619 16.6512 16.0682 16.9522 16.0682 17.2954C16.0682 17.7127 15.7668 18.0524 15.3973 18.0524H13.5959C13.3251 18.0524 13.0647 17.9777 12.8348 17.8379C12.6147 17.7037 12.3272 17.7583 12.1404 17.9348L11.346 18.6869C11.1008 18.9194 11.1112 19.3249 11.3835 19.5249C11.9515 19.9422 12.6314 20.1878 13.3334 20.239V21.1607C13.3334 21.4666 13.5821 21.7143 13.889 21.7143H15.0001C15.3071 21.7143 15.5557 21.4666 15.5557 21.1607V20.2335C17.073 20.1442 18.2904 18.8758 18.2904 17.2954C18.2904 15.9821 17.4327 14.8085 16.207 14.4424V14.4424Z", fill: fill }, void 0) }), void 0));
916
+ };
917
+
538
918
  var Messaging = /*#__PURE__*/Object.freeze({
539
919
  __proto__: null,
540
920
  QuestionCircle: QuestionCircle,
541
921
  Messenger: Messenger,
542
922
  Comment: Comment$1,
543
923
  Mail: Mail,
544
- Community: Community$1
924
+ Community: Community$1,
925
+ QuoteLeft: QuoteLeft,
926
+ QuoteRight: QuoteRight,
927
+ QuoteSolidLeft: QuoteSolidLeft,
928
+ QuoteSolidRight: QuoteSolidRight,
929
+ Light: Light,
930
+ LightBulb: LightBulb,
931
+ LightBulbSolid: LightBulbSolid,
932
+ CommentDots: CommentDots,
933
+ CommentLight: CommentLight,
934
+ CommentMoney: CommentMoney
545
935
  });
546
936
 
547
937
  var AppleStore = function (_a) {
@@ -621,9 +1011,45 @@ var Thinking = function (_a) {
621
1011
  return (jsxs$1(IconWrapper$1, __assign$1({ width: width, height: height, viewBoxX: 36, viewBoxY: 36, fill: "none" }, { children: [jsx$1("path", { d: "M18.1177 34.1177C26.9542 34.1177 34.1177 26.9542 34.1177 18.1177C34.1177 9.28112 26.9542 2.11768 18.1177 2.11768C9.28112 2.11768 2.11768 9.28112 2.11767 18.1177C2.11767 26.9542 9.28112 34.1177 18.1177 34.1177Z", fill: "#D1D1D1" }, void 0), jsx$1("path", { d: "M33.8824 18.0157C33.8858 15.627 33.3399 13.2685 32.2858 11.1177C31.749 16.3687 30.9035 21.0215 25.9749 25.7664C21.085 30.4741 13.7607 30.4384 4.76477 26.5069C7.6498 30.7724 12.1983 33.8824 17.7887 33.8824C22.057 33.8824 26.1505 32.2107 29.1687 29.2351C32.1868 26.2596 33.8824 22.2238 33.8824 18.0157Z", fill: "#BBBBBB" }, void 0), jsx$1("path", { d: "M18 34C26.8366 34 34 26.8366 34 18C34 9.16345 26.8366 2 18 2C9.16344 2 2 9.16344 2 18C2 26.8366 9.16344 34 18 34Z", stroke: "#292929", strokeLinejoin: "round" }, void 0), jsx$1("path", { d: "M4.82728 27.412L4.82637 27.4132L4.40553 27.9299C4.40553 27.9299 4.40552 27.9299 4.40552 27.9299C3.81861 28.6494 3.5 29.5474 3.5 30.4704V32.3339C3.5 34.0936 4.9458 35.5 6.70703 35.5H11.2297C11.9963 35.5 12.632 34.8847 12.632 34.1113C12.632 33.8823 12.5763 33.6672 12.478 33.4779C12.8437 33.2285 13.0859 32.8113 13.0859 32.3339C13.0859 32.105 13.0302 31.8899 12.9319 31.7005C13.2976 31.4511 13.5398 31.034 13.5398 30.5566C13.5398 30.4213 13.5204 30.291 13.4843 30.1679H17.0977C17.8642 30.1679 18.5 29.5526 18.5 28.7792C18.5 28.0057 17.8642 27.3905 17.0977 27.3905H8.97109C8.4908 27.3905 8.11484 27.0093 8.11484 26.5548V23.8887C8.11484 23.1153 7.47908 22.5 6.7125 22.5C5.94592 22.5 5.31016 23.1153 5.31016 23.8887V26.0592C5.31016 26.553 5.14192 27.028 4.82728 27.412Z", fill: "#E5E5E5", stroke: "#292929" }, void 0), jsx$1("path", { d: "M20.3556 25C20.2562 25 20.163 24.9768 20.0698 24.9362C20.0325 24.9188 16.5164 23.2887 12.6275 23.2016C12.2734 23.1958 11.9939 22.9174 12.0001 22.5867C12.0063 22.256 12.3045 21.9834 12.6586 22.0008C16.8456 22.0878 20.4922 23.7876 20.6475 23.863C20.9644 24.0138 21.0886 24.3735 20.9333 24.6693C20.8153 24.884 20.5916 25 20.3556 25Z", fill: "#292929" }, void 0), jsx$1("path", { d: "M12.4403 10C12.3219 10 12.1981 9.96334 12.0958 9.88478C12.0097 9.82193 10.0989 8.39216 7.80058 9.51293C7.52607 9.6491 7.19236 9.53912 7.0578 9.27202C6.92324 9.00492 7.03089 8.68021 7.30539 8.54404C10.255 7.10902 12.6879 8.95778 12.7902 9.03634C13.0324 9.22488 13.0701 9.56531 12.8763 9.79575C12.7686 9.93192 12.6072 10 12.4403 10Z", fill: "#292929" }, void 0), jsx$1("path", { d: "M21.4989 13C21.2664 13 21.058 12.8167 21.0096 12.5525C20.9563 12.2506 21.1307 11.9595 21.402 11.9002L25.4042 11.0107C25.6755 10.9514 25.9371 11.1454 25.9904 11.4473C26.0437 11.7492 25.8693 12.0404 25.598 12.0997L21.5958 12.9892C21.5668 12.9946 21.5329 13 21.4989 13Z", fill: "#292929" }, void 0), jsx$1("path", { d: "M11.8037 16.0101C11.8037 16.6111 11.3164 17.0983 10.7154 17.0983C10.1144 17.0983 9.6272 16.6111 9.6272 16.0101C9.6272 15.4091 10.1144 14.9219 10.7154 14.9219C11.3164 14.9219 11.8037 15.4091 11.8037 16.0101Z", fill: "#292929", stroke: "#292929" }, void 0), jsx$1("path", { d: "M24.5096 16.0101C24.5096 16.6111 24.0224 17.0983 23.4214 17.0983C22.8203 17.0983 22.3331 16.6111 22.3331 16.0101C22.3331 15.4091 22.8203 14.9219 23.4214 14.9219C24.0224 14.9219 24.5096 15.4091 24.5096 16.0101Z", fill: "#292929", stroke: "#292929" }, void 0)] }), void 0));
622
1012
  };
623
1013
 
1014
+ var SmilingV2 = function (_a) {
1015
+ var height = _a.height, width = _a.width;
1016
+ return (jsxs$1(IconWrapper$1, __assign$1({ width: width, height: height, viewBoxX: 70, viewBoxY: 70, fill: "none", title: "Smiling V2" }, { children: [jsx$1("path", { d: "M68.5789 43.2059C72.9092 24.8588 61.5464 6.47522 43.1993 2.14492C24.8523 -2.18538 6.46866 9.17743 2.13837 27.5245C-2.19193 45.8715 9.17089 64.2551 27.5179 68.5854C45.865 72.9157 64.2486 61.5529 68.5789 43.2059Z", stroke: "#292929", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round" }, void 0), jsx$1("path", { d: "M16.9706 27.4261C16.9706 26.8296 17.1475 26.2464 17.479 25.7503C17.8104 25.2543 18.2815 24.8677 18.8327 24.6394C19.3838 24.4111 19.9903 24.3514 20.5755 24.4678C21.1606 24.5841 21.698 24.8714 22.1199 25.2933C22.5417 25.7151 22.829 26.2526 22.9454 26.8377C23.0618 27.4228 23.002 28.0293 22.7737 28.5805C22.5454 29.1316 22.1588 29.6027 21.6628 29.9341C21.1667 30.2656 20.5836 30.4425 19.987 30.4425C19.187 30.4425 18.4198 30.1247 17.8541 29.559C17.2884 28.9934 16.9706 28.2261 16.9706 27.4261Z", fill: "#292929" }, void 0), jsx$1("path", { d: "M47.7386 27.4261C47.7386 26.8296 47.9155 26.2464 48.247 25.7503C48.5784 25.2543 49.0495 24.8677 49.6007 24.6394C50.1518 24.4111 50.7583 24.3514 51.3435 24.4678C51.9286 24.5841 52.466 24.8714 52.8879 25.2933C53.3097 25.7151 53.597 26.2526 53.7134 26.8377C53.8298 27.4228 53.77 28.0293 53.5417 28.5805C53.3134 29.1316 52.9268 29.6027 52.4308 29.9341C51.9347 30.2656 51.3516 30.4425 50.755 30.4425C49.955 30.4425 49.1878 30.1247 48.6221 29.559C48.0564 28.9934 47.7386 28.2261 47.7386 27.4261V27.4261Z", fill: "#292929" }, void 0), jsx$1("path", { d: "M53.7248 41.084C52.5044 44.9972 50.0653 48.4179 46.7635 50.8469C43.4617 53.2758 39.47 54.5859 35.3709 54.5859C31.2719 54.5859 27.2802 53.2758 23.9783 50.8469C20.6765 48.4179 18.2374 44.9972 17.0171 41.084", stroke: "#292929", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round" }, void 0)] }), void 0));
1017
+ };
1018
+
1019
+ var Grinning = function (_a) {
1020
+ var height = _a.height, width = _a.width;
1021
+ return (jsxs$1(IconWrapper$1, __assign$1({ width: width, height: height, viewBoxX: 70, viewBoxY: 70, fill: "none", title: "Grinning" }, { children: [jsx$1("path", { d: "M16.9706 27.4261C16.9706 26.8293 17.1476 26.2459 17.4793 25.7497C17.811 25.2536 18.2825 24.867 18.834 24.6388C19.3855 24.4107 19.9923 24.3513 20.5775 24.4682C21.1628 24.585 21.7003 24.8729 22.1219 25.2953C22.5435 25.7177 22.8303 26.2558 22.946 26.8412C23.0618 27.4267 23.0012 28.0334 22.772 28.5845C22.5428 29.1355 22.1553 29.6062 21.6585 29.937C21.1617 30.2677 20.5779 30.4436 19.9811 30.4425C19.5853 30.4425 19.1933 30.3644 18.8277 30.2128C18.4621 30.0611 18.1299 29.8388 17.8503 29.5587C17.5707 29.2785 17.349 28.9459 17.1981 28.58C17.0471 28.2141 16.9698 27.822 16.9706 27.4261V27.4261Z", fill: "#292929" }, void 0), jsx$1("path", { d: "M47.7386 27.4261C47.7386 26.8293 47.9156 26.2459 48.2473 25.7497C48.579 25.2536 49.0505 24.867 49.602 24.6388C50.1535 24.4107 50.7603 24.3513 51.3455 24.4682C51.9308 24.585 52.4683 24.8729 52.8899 25.2953C53.3115 25.7177 53.5983 26.2558 53.714 26.8412C53.8298 27.4267 53.7692 28.0334 53.54 28.5845C53.3108 29.1355 52.9233 29.6062 52.4265 29.937C51.9297 30.2677 51.346 30.4436 50.7491 30.4425C50.3533 30.4425 49.9613 30.3644 49.5957 30.2128C49.2301 30.0611 48.8979 29.8388 48.6183 29.5587C48.3387 29.2785 48.117 28.9459 47.9661 28.58C47.8151 28.2141 47.7378 27.822 47.7386 27.4261V27.4261Z", fill: "#292929" }, void 0), jsx$1("path", { d: "M59.5046 59.5093C72.8344 46.1796 72.8344 24.5677 59.5046 11.238C46.1748 -2.09181 24.563 -2.09181 11.2332 11.238C-2.09654 24.5677 -2.09655 46.1796 11.2332 59.5093C24.563 72.8391 46.1748 72.8391 59.5046 59.5093Z", stroke: "#292929", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round" }, void 0), jsx$1("path", { d: "M53.719 41.084C52.5004 44.998 50.0623 48.4199 46.7608 50.8498C43.4593 53.2797 39.4674 54.5903 35.368 54.5903C31.2687 54.5903 27.2768 53.2797 23.9753 50.8498C20.6738 48.4199 18.2358 44.998 17.0172 41.084H53.719Z", stroke: "#292929", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round" }, void 0)] }), void 0));
1022
+ };
1023
+
1024
+ var GrinningWithSweat = function (_a) {
1025
+ var height = _a.height, width = _a.width;
1026
+ return (jsxs$1(IconWrapper$1, __assign$1({ width: width, height: height, viewBoxX: 70, viewBoxY: 70, fill: "none", title: "Grinning With Sweat" }, { children: [jsx$1("path", { d: "M64.3431 17.3426C68.8555 24.5868 70.4904 33.2586 68.9253 41.6486C67.3602 50.0385 62.7088 57.5377 55.8881 62.6678C49.0673 67.7979 40.5721 70.1867 32.0773 69.3631C23.5824 68.5395 15.7044 64.5634 9.9961 58.2186C4.28785 51.8738 1.16363 43.6206 1.23941 35.0863C1.31518 26.552 4.58545 18.3557 10.4055 12.1132C16.2255 5.87075 24.1729 2.03514 32.6811 1.36251C41.1892 0.689893 49.6406 3.22908 56.3692 8.47948", stroke: "#292929", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round" }, void 0), jsx$1("path", { d: "M53.7249 41.084C52.5045 44.9971 50.0654 48.4178 46.7636 50.8468C43.4618 53.2758 39.4701 54.5859 35.371 54.5859C31.272 54.5859 27.2803 53.2758 23.9784 50.8468C20.6766 48.4178 18.2375 44.9971 17.0172 41.084H53.7249Z", stroke: "#292929", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round" }, void 0), jsx$1("path", { d: "M16.2965 29.1639C16.6563 28.5415 17.1686 28.0209 17.7851 27.6512C18.4016 27.2814 19.1021 27.0745 19.8205 27.0501C20.539 27.0257 21.2519 27.1845 21.8921 27.5116C22.5323 27.8387 23.0787 28.3233 23.4799 28.9198", stroke: "#292929", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round" }, void 0), jsx$1("path", { d: "M54.463 29.1639C54.1032 28.5415 53.5909 28.0209 52.9744 27.6512C52.3579 27.2814 51.6574 27.0745 50.9389 27.0501C50.2205 27.0257 49.5075 27.1845 48.8674 27.5116C48.2272 27.8387 47.6808 28.3233 47.2795 28.9198", stroke: "#292929", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round" }, void 0), jsx$1("path", { d: "M63.9189 11.3389L59.374 2.80713L54.8291 11.3389C54.091 12.6989 53.7248 13.4312 53.7248 14.6866C53.7248 16.1848 54.32 17.6217 55.3794 18.6811C56.4389 19.7405 57.8757 20.3357 59.374 20.3357C60.8722 20.3357 62.3091 19.7405 63.3685 18.6811C64.4279 17.6217 65.0231 16.1848 65.0231 14.6866C65.0231 13.4312 64.7325 12.9023 63.9189 11.3389Z", stroke: "#292929", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round" }, void 0)] }), void 0));
1027
+ };
1028
+
1029
+ var BlowingKiss = function (_a) {
1030
+ var height = _a.height, width = _a.width;
1031
+ return (jsxs$1(IconWrapper$1, __assign$1({ width: width, height: height, viewBoxX: 75, viewBoxY: 71, fill: "none", title: "Blowing a Kiss" }, { children: [jsx$1("path", { d: "M5.56782 38.3931C5.48064 37.3935 5.43416 36.388 5.43416 35.3651C5.43494 27.2318 8.34098 19.3662 13.6285 13.1861C18.916 7.00598 26.2371 2.91784 34.2724 1.65852C42.3076 0.399193 50.5284 2.05151 57.4531 6.31767C64.3778 10.5838 69.5509 17.1832 72.0399 24.9263C74.5289 32.6695 74.1702 41.047 71.0284 48.5491C67.8866 56.0511 62.1683 62.1841 54.9043 65.8427C47.6403 69.5013 39.3083 70.4449 31.4101 68.5033C23.5119 66.5617 16.5671 61.8628 11.8272 55.2533", stroke: "#292929", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round" }, void 0), jsx$1("path", { d: "M20.4927 29.1638C20.8531 28.5424 21.3654 28.0227 21.9815 27.6534C22.5976 27.284 23.2974 27.0772 24.0153 27.0522C24.7333 27.0272 25.4458 27.1849 26.0861 27.5106C26.7264 27.8362 27.2735 28.3191 27.6762 28.9139", stroke: "#292929", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round" }, void 0), jsx$1("path", { d: "M58.6418 29.1638C58.2814 28.5424 57.7692 28.0227 57.153 27.6534C56.5369 27.284 55.8371 27.0772 55.1192 27.0522C54.4013 27.0272 53.6888 27.1849 53.0485 27.5106C52.4082 27.8362 51.8611 28.3191 51.4584 28.9139", stroke: "#292929", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round" }, void 0), jsx$1("path", { d: "M42.4499 54.3001C41.4567 54.9956 40.2389 55.2937 39.0368 55.1354C37.8346 54.9771 36.7355 54.374 35.9562 53.4451C35.1769 52.5162 34.774 51.329 34.8271 50.1176C34.8801 48.9063 35.3853 47.7588 36.2428 46.9016C36.6627 46.4791 37.1573 46.1382 37.7016 45.8962V45.8962C36.849 45.5136 36.1252 44.8924 35.6178 44.1076C35.1104 43.3228 34.841 42.4079 34.8422 41.4734C34.8407 40.5881 35.082 39.7194 35.5398 38.9616C35.9976 38.2039 36.6544 37.5863 37.4388 37.1758C38.2231 36.7653 39.105 36.5778 39.9885 36.6336C40.8721 36.6894 41.7234 36.9864 42.4499 37.4922", stroke: "#292929", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round" }, void 0), jsx$1("path", { d: "M19.8011 38.8929C18.5355 38.2215 17.0551 38.0801 15.6852 38.4996C14.3154 38.9192 13.1681 39.8655 12.4956 41.1305C12.1439 41.7593 11.9579 42.4673 11.9551 43.1879C11.9503 42.4669 11.7623 41.7589 11.4088 41.1305C10.8647 40.1082 10.0068 39.2878 8.96124 38.7899C7.91573 38.2921 6.73797 38.1432 5.60144 38.3651C4.46492 38.5871 3.42974 39.1682 2.64837 40.0229C1.86701 40.8775 1.38079 41.9605 1.26132 43.1123C0.906796 46.5646 4.36482 48.7033 6.64888 50.6677C8.39244 52.1788 10.1651 53.6725 11.9667 55.1487C13.5476 53.8352 15.1168 52.5081 16.6743 51.1675C17.8367 50.1911 18.941 49.209 20.051 48.1977C21.5447 46.8319 22.7593 45.5882 22.6663 43.4262C22.6194 42.4878 22.3309 41.5775 21.829 40.7833C21.327 39.9891 20.6285 39.338 19.8011 38.8929V38.8929Z", stroke: "#292929", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round" }, void 0)] }), void 0));
1032
+ };
1033
+
1034
+ var Frowning = function (_a) {
1035
+ var height = _a.height, width = _a.width;
1036
+ return (jsxs$1(IconWrapper$1, __assign$1({ width: width, height: height, viewBoxX: 70, viewBoxY: 70, fill: "none", title: "Frowning" }, { children: [jsx$1("path", { d: "M59.5014 59.5068C72.8311 46.177 72.8312 24.5652 59.5014 11.2354C46.1716 -2.09437 24.5598 -2.09436 11.23 11.2354C-2.09976 24.5652 -2.09976 46.177 11.23 59.5068C24.5598 72.8366 46.1716 72.8365 59.5014 59.5068Z", stroke: "#292929", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round" }, void 0), jsx$1("path", { d: "M16.9707 27.4261C16.9707 26.8293 17.1477 26.2459 17.4794 25.7497C17.8111 25.2536 18.2826 24.867 18.8341 24.6388C19.3856 24.4107 19.9924 24.3513 20.5776 24.4682C21.1629 24.585 21.7004 24.8729 22.122 25.2953C22.5436 25.7177 22.8304 26.2558 22.9461 26.8412C23.0619 27.4267 23.0013 28.0334 22.7721 28.5845C22.5429 29.1355 22.1554 29.6062 21.6586 29.937C21.1618 30.2677 20.578 30.4436 19.9812 30.4425C19.5854 30.4425 19.1934 30.3644 18.8278 30.2128C18.4622 30.0611 18.13 29.8388 17.8504 29.5587C17.5708 29.2785 17.3491 28.9459 17.1982 28.58C17.0472 28.2141 16.9699 27.822 16.9707 27.4261Z", fill: "#292929" }, void 0), jsx$1("path", { d: "M47.7387 27.4261C47.7387 26.8293 47.9157 26.2459 48.2474 25.7497C48.5791 25.2536 49.0506 24.867 49.6021 24.6388C50.1536 24.4107 50.7604 24.3513 51.3456 24.4682C51.9309 24.585 52.4684 24.8729 52.89 25.2953C53.3116 25.7177 53.5984 26.2558 53.7141 26.8412C53.8299 27.4267 53.7693 28.0334 53.5401 28.5845C53.3109 29.1355 52.9234 29.6062 52.4266 29.937C51.9298 30.2677 51.346 30.4436 50.7492 30.4425C50.3534 30.4425 49.9614 30.3644 49.5958 30.2128C49.2302 30.0611 48.898 29.8388 48.6184 29.5587C48.3388 29.2785 48.1171 28.9459 47.9662 28.58C47.8152 28.2141 47.7379 27.822 47.7387 27.4261Z", fill: "#292929" }, void 0), jsx$1("path", { d: "M18.8362 49.3369C20.2332 46.1126 22.5424 43.3673 25.4797 41.4387C28.4171 39.5102 31.8542 38.4827 35.3681 38.4827C38.8819 38.4827 42.319 39.5102 45.2564 41.4387C48.1937 43.3673 50.5029 46.1126 51.8999 49.3369", stroke: "#292929", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round" }, void 0)] }), void 0));
1037
+ };
1038
+
1039
+ var Relieved = function (_a) {
1040
+ var height = _a.height, width = _a.width;
1041
+ return (jsxs$1(IconWrapper$1, __assign$1({ width: width, height: height, viewBoxX: 70, viewBoxY: 70, fill: "none", title: "Relieved" }, { children: [jsx$1("path", { d: "M69.0624 40.8658C72.0828 22.2582 59.4469 4.72517 40.8393 1.70473C22.2318 -1.31571 4.69878 11.3202 1.67834 29.9278C-1.3421 48.5354 11.2938 66.0684 29.9014 69.0888C48.509 72.1092 66.0419 59.4733 69.0624 40.8658Z", stroke: "#292929", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round" }, void 0), jsx$1("path", { d: "M53.7249 41.0782C52.5045 44.9913 50.0655 48.4121 46.7636 50.841C43.4618 53.27 39.4701 54.5801 35.371 54.5801C31.272 54.5801 27.2803 53.27 23.9785 50.841C20.6766 48.4121 18.2375 44.9913 17.0172 41.0782", stroke: "#292929", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round" }, void 0), jsx$1("path", { d: "M16.2965 27.1472C16.6569 27.7686 17.1692 28.2883 17.7853 28.6577C18.4014 29.027 19.1012 29.2339 19.8191 29.2588C20.537 29.2838 21.2495 29.1261 21.8898 28.8005C22.5301 28.4748 23.0773 27.992 23.48 27.3971", stroke: "#292929", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round" }, void 0), jsx$1("path", { d: "M54.4455 27.1472C54.0851 27.7686 53.5728 28.2883 52.9567 28.6577C52.3406 29.027 51.6408 29.2339 50.9229 29.2588C50.205 29.2838 49.4925 29.1261 48.8522 28.8005C48.2119 28.4748 47.6647 27.992 47.262 27.3971", stroke: "#292929", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round" }, void 0)] }), void 0));
1042
+ };
1043
+
624
1044
  var Emoji = /*#__PURE__*/Object.freeze({
625
1045
  __proto__: null,
626
- Thinking: Thinking
1046
+ Thinking: Thinking,
1047
+ SmilingV2: SmilingV2,
1048
+ Grinning: Grinning,
1049
+ GrinningWithSweat: GrinningWithSweat,
1050
+ BlowingKiss: BlowingKiss,
1051
+ Frowning: Frowning,
1052
+ Relieved: Relieved
627
1053
  });
628
1054
 
629
1055
  var FreeShipping$1 = function (_a) {
@@ -3584,7 +4010,7 @@ var InputValidationType;
3584
4010
  InputValidationType[InputValidationType["Empty"] = 2] = "Empty";
3585
4011
  })(InputValidationType || (InputValidationType = {}));
3586
4012
 
3587
- var Section = newStyled.div(templateObject_1$1f || (templateObject_1$1f = __makeTemplateObject(["\n font-weight: 600;\n display: flex;\n flex-direction: row;\n align-items: center;\n align-text: left;\n width: 100%;\n box-sizing: border-box;\n align-self: flex-start;\n padding: ", ";\n"], ["\n font-weight: 600;\n display: flex;\n flex-direction: row;\n align-items: center;\n align-text: left;\n width: 100%;\n box-sizing: border-box;\n align-self: flex-start;\n padding: ", ";\n"])), function (props) {
4013
+ var Section = newStyled.div(templateObject_1$1i || (templateObject_1$1i = __makeTemplateObject(["\n font-weight: 600;\n display: flex;\n flex-direction: row;\n align-items: center;\n align-text: left;\n width: 100%;\n box-sizing: border-box;\n align-self: flex-start;\n padding: ", ";\n"], ["\n font-weight: 600;\n display: flex;\n flex-direction: row;\n align-items: center;\n align-text: left;\n width: 100%;\n box-sizing: border-box;\n align-self: flex-start;\n padding: ", ";\n"])), function (props) {
3588
4014
  return props.type === CardSectionType.Header ? '1.5rem 1.5rem 0' : '0 1.5rem 1.5rem';
3589
4015
  });
3590
4016
  var CardHeader = function (_a) {
@@ -3595,14 +4021,14 @@ var CardFooter = function (_a) {
3595
4021
  var children = _a.children;
3596
4022
  return (jsx$1(Section, __assign$1({ type: CardSectionType.Footer }, { children: children }), void 0));
3597
4023
  };
3598
- var templateObject_1$1f;
4024
+ var templateObject_1$1i;
3599
4025
 
3600
- var Body = newStyled.div(templateObject_1$1e || (templateObject_1$1e = __makeTemplateObject(["\n display: flex;\n align-items: center;\n padding: 0.5rem 1.5rem;\n align-self: flex-start;\n"], ["\n display: flex;\n align-items: center;\n padding: 0.5rem 1.5rem;\n align-self: flex-start;\n"])));
4026
+ var Body = newStyled.div(templateObject_1$1h || (templateObject_1$1h = __makeTemplateObject(["\n display: flex;\n align-items: center;\n padding: 0.5rem 1.5rem;\n align-self: flex-start;\n"], ["\n display: flex;\n align-items: center;\n padding: 0.5rem 1.5rem;\n align-self: flex-start;\n"])));
3601
4027
  var CardBody = function (_a) {
3602
4028
  var children = _a.children;
3603
4029
  return jsx$1(Body, { children: children }, void 0);
3604
4030
  };
3605
- var templateObject_1$1e;
4031
+ var templateObject_1$1h;
3606
4032
 
3607
4033
  var IGNORED_KEYS = ['typography', 'fonts'];
3608
4034
  var applyVariablesIntoTheme = function (theme) {
@@ -3747,7 +4173,7 @@ var AssetsProvider = function (_a) {
3747
4173
  };
3748
4174
  var useThemeAssets = function () { return useContext(AssetsContext); };
3749
4175
 
3750
- var Container$L = newStyled.div(templateObject_1$1d || (templateObject_1$1d = __makeTemplateObject(["\n ", "\n width: ", ";\n background: ", ";\n border-radius: ", ";\n border: ", ";\n"], ["\n ", "\n width: ", ";\n background: ", ";\n border-radius: ", ";\n border: ", ";\n"])), function (_a) {
4176
+ var Container$O = newStyled.div(templateObject_1$1g || (templateObject_1$1g = __makeTemplateObject(["\n ", "\n width: ", ";\n background: ", ";\n border-radius: ", ";\n border: ", ";\n"], ["\n ", "\n width: ", ";\n background: ", ";\n border-radius: ", ";\n border: ", ";\n"])), function (_a) {
3751
4177
  var flex = _a.flex;
3752
4178
  return flex &&
3753
4179
  "display: flex;\n flex-direction: column;\n justify-content: center;\n align-items: center;";
@@ -3760,14 +4186,14 @@ var Container$L = newStyled.div(templateObject_1$1d || (templateObject_1$1d = __
3760
4186
  var Card$1 = function (_a) {
3761
4187
  var children = _a.children, backgroundColor = _a.backgroundColor, _b = _a.widthAuto, widthAuto = _b === void 0 ? true : _b, border = _a.border, _c = _a.flex, flex = _c === void 0 ? true : _c;
3762
4188
  var theme = useTheme();
3763
- return (jsx$1(Container$L, __assign$1({ backgroundColor: backgroundColor, widthAuto: widthAuto, border: border, flex: flex, "data-testid": "CardContainer", theme: theme }, { children: children }), void 0));
4189
+ return (jsx$1(Container$O, __assign$1({ backgroundColor: backgroundColor, widthAuto: widthAuto, border: border, flex: flex, "data-testid": "CardContainer", theme: theme }, { children: children }), void 0));
3764
4190
  };
3765
4191
  var Card$2 = Object.assign(Card$1, {
3766
4192
  Header: CardHeader,
3767
4193
  Footer: CardFooter,
3768
4194
  Body: CardBody,
3769
4195
  });
3770
- var templateObject_1$1d;
4196
+ var templateObject_1$1g;
3771
4197
 
3772
4198
  var Fragment = Fragment$1;
3773
4199
  function jsx(type, props, key) {
@@ -3909,7 +4335,7 @@ function BaseSelectOption(_a) {
3909
4335
  return (jsx$1(Ee.Option, __assign$1({ className: className, as: as, value: value, disabled: disabled }, { children: children }), void 0));
3910
4336
  }
3911
4337
 
3912
- var CustomListBox = newStyled(Ee)(templateObject_1$1c || (templateObject_1$1c = __makeTemplateObject(["\n position: relative;\n"], ["\n position: relative;\n"])));
4338
+ var CustomListBox = newStyled(Ee)(templateObject_1$1f || (templateObject_1$1f = __makeTemplateObject(["\n position: relative;\n"], ["\n position: relative;\n"])));
3913
4339
  function BaseSelect(_a) {
3914
4340
  var value = _a.value, onChange = _a.onChange, disabled = _a.disabled, children = _a.children, className = _a.className;
3915
4341
  return (jsx$1(CustomListBox, __assign$1({ disabled: disabled, as: "div", value: value, onChange: onChange, className: className }, { children: children }), void 0));
@@ -3919,7 +4345,7 @@ var BaseSelect$1 = Object.assign(BaseSelect, {
3919
4345
  Options: BaseSelectOptions,
3920
4346
  Option: BaseSelectOption,
3921
4347
  });
3922
- var templateObject_1$1c;
4348
+ var templateObject_1$1f;
3923
4349
 
3924
4350
  var CustomButton = newStyled.button(function (_a) {
3925
4351
  var theme = _a.theme, wide = _a.wide, isSortOrFilter = _a.isSortOrFilter;
@@ -4132,12 +4558,12 @@ var CustomCheckboxStyles = {
4132
4558
  },
4133
4559
  };
4134
4560
 
4135
- var Container$K = newStyled.div(templateObject_1$1b || (templateObject_1$1b = __makeTemplateObject(["\n display: flex;\n align-items: center;\n justify-content: center;\n width: fit-content;\n user-select: none;\n position: relative;\n"], ["\n display: flex;\n align-items: center;\n justify-content: center;\n width: fit-content;\n user-select: none;\n position: relative;\n"])));
4561
+ var Container$N = newStyled.div(templateObject_1$1e || (templateObject_1$1e = __makeTemplateObject(["\n display: flex;\n align-items: center;\n justify-content: center;\n width: fit-content;\n user-select: none;\n position: relative;\n"], ["\n display: flex;\n align-items: center;\n justify-content: center;\n width: fit-content;\n user-select: none;\n position: relative;\n"])));
4136
4562
  var CustomCheckbox = newStyled.div(CustomCheckboxStyles.baseStyles, function (props) { return [
4137
4563
  CustomCheckboxStyles[props.size](props.theme),
4138
4564
  CustomCheckboxStyles[props.variant](props.theme, props.isChecked, props.disabled),
4139
4565
  ]; });
4140
- var Input$3 = newStyled.input(templateObject_2$L || (templateObject_2$L = __makeTemplateObject(["\n position: absolute;\n height: 100%;\n width: 100%;\n margin: 0;\n opacity: 0;\n cursor: ", ";\n"], ["\n position: absolute;\n height: 100%;\n width: 100%;\n margin: 0;\n opacity: 0;\n cursor: ", ";\n"])), function (_a) {
4566
+ var Input$3 = newStyled.input(templateObject_2$O || (templateObject_2$O = __makeTemplateObject(["\n position: absolute;\n height: 100%;\n width: 100%;\n margin: 0;\n opacity: 0;\n cursor: ", ";\n"], ["\n position: absolute;\n height: 100%;\n width: 100%;\n margin: 0;\n opacity: 0;\n cursor: ", ";\n"])), function (_a) {
4141
4567
  var disabled = _a.disabled;
4142
4568
  return (disabled ? 'not-allowed' : 'pointer');
4143
4569
  });
@@ -4166,9 +4592,9 @@ var Checkbox = function (_a) {
4166
4592
  useEffect(function () {
4167
4593
  mounted.current = true;
4168
4594
  }, []);
4169
- return (jsxs$1(Container$K, { children: [jsx$1(Input$3, { type: "checkbox", checked: isChecked, disabled: disabled, onChange: handleChange, id: id }, void 0), jsx$1(CustomCheckbox, __assign$1({ theme: theme, size: size, disabled: disabled, isChecked: isChecked, "data-testid": "checkbox", variant: variant }, { children: isChecked && jsx$1(Icon.Actions.Check, { fill: "#fff" }, void 0) }), void 0), jsx$1(Label$3, __assign$1({ "data-testid": "checkbox-text", size: size, variant: isChecked ? 'demi' : 'regular', htmlFor: id, disabled: disabled }, { children: text }), void 0)] }, void 0));
4595
+ return (jsxs$1(Container$N, { children: [jsx$1(Input$3, { type: "checkbox", checked: isChecked, disabled: disabled, onChange: handleChange, id: id }, void 0), jsx$1(CustomCheckbox, __assign$1({ theme: theme, size: size, disabled: disabled, isChecked: isChecked, "data-testid": "checkbox", variant: variant }, { children: isChecked && jsx$1(Icon.Actions.Check, { fill: "#fff" }, void 0) }), void 0), jsx$1(Label$3, __assign$1({ "data-testid": "checkbox-text", size: size, variant: isChecked ? 'demi' : 'regular', htmlFor: id, disabled: disabled }, { children: text }), void 0)] }, void 0));
4170
4596
  };
4171
- var templateObject_1$1b, templateObject_2$L;
4597
+ var templateObject_1$1e, templateObject_2$O;
4172
4598
 
4173
4599
  var CustomOption = newStyled.li(function (_a) {
4174
4600
  var theme = _a.theme, selected = _a.selected, active = _a.active;
@@ -4305,11 +4731,11 @@ var SelectorSecondary = function (_a) {
4305
4731
  // This defines which HTML tag to render for each `variant`, it also defines
4306
4732
  // `variants` styles that are consistent through all themes.
4307
4733
  var TAGS = {
4308
- hero1: newStyled.h1(templateObject_1$1a || (templateObject_1$1a = __makeTemplateObject([""], [""]))),
4309
- hero2: newStyled.h2(templateObject_2$K || (templateObject_2$K = __makeTemplateObject([""], [""]))),
4310
- hero3: newStyled.h3(templateObject_3$x || (templateObject_3$x = __makeTemplateObject([""], [""]))),
4734
+ hero1: newStyled.h1(templateObject_1$1d || (templateObject_1$1d = __makeTemplateObject([""], [""]))),
4735
+ hero2: newStyled.h2(templateObject_2$N || (templateObject_2$N = __makeTemplateObject([""], [""]))),
4736
+ hero3: newStyled.h3(templateObject_3$A || (templateObject_3$A = __makeTemplateObject([""], [""]))),
4311
4737
  display1: newStyled.h1(templateObject_4$n || (templateObject_4$n = __makeTemplateObject([""], [""]))),
4312
- display2: newStyled.h2(templateObject_5$d || (templateObject_5$d = __makeTemplateObject([""], [""]))),
4738
+ display2: newStyled.h2(templateObject_5$e || (templateObject_5$e = __makeTemplateObject([""], [""]))),
4313
4739
  heading1: newStyled.h1(templateObject_6$8 || (templateObject_6$8 = __makeTemplateObject([""], [""]))),
4314
4740
  heading2: newStyled.h2(templateObject_7$5 || (templateObject_7$5 = __makeTemplateObject([""], [""]))),
4315
4741
  heading3: newStyled.h3(templateObject_8$3 || (templateObject_8$3 = __makeTemplateObject([""], [""]))),
@@ -4428,9 +4854,9 @@ var DEFAULTS = {
4428
4854
  size: 'regular',
4429
4855
  },
4430
4856
  };
4431
- var templateObject_1$1a, templateObject_2$K, templateObject_3$x, templateObject_4$n, templateObject_5$d, templateObject_6$8, templateObject_7$5, templateObject_8$3, templateObject_9$1, templateObject_10$1, templateObject_11, templateObject_12, templateObject_13, templateObject_14, templateObject_15, templateObject_16, templateObject_17;
4857
+ var templateObject_1$1d, templateObject_2$N, templateObject_3$A, templateObject_4$n, templateObject_5$e, templateObject_6$8, templateObject_7$5, templateObject_8$3, templateObject_9$1, templateObject_10$1, templateObject_11, templateObject_12, templateObject_13, templateObject_14, templateObject_15, templateObject_16, templateObject_17;
4432
4858
 
4433
- var ButtonsContainer = newStyled.div(templateObject_1$19 || (templateObject_1$19 = __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) {
4859
+ var ButtonsContainer = newStyled.div(templateObject_1$1c || (templateObject_1$1c = __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) {
4434
4860
  var inline = _a.inline;
4435
4861
  return (inline ? '0 0 0 10px' : '8px 0 0 0');
4436
4862
  });
@@ -4448,7 +4874,7 @@ var SizeSelector = function (_a) {
4448
4874
  }, size: ComponentSize.Medium, text: size.label, active: active, disabled: size.disabled, onClick: function () { return onChange(size); }, testId: "size-variant-".concat(size.label.split('/')[0]), width: width }, size.label));
4449
4875
  }) }), void 0)] }), void 0));
4450
4876
  };
4451
- var templateObject_1$19;
4877
+ var templateObject_1$1c;
4452
4878
 
4453
4879
  var getStylesBySize$7 = function (size) {
4454
4880
  switch (size) {
@@ -4475,7 +4901,7 @@ var textButtonStyles$1 = function (theme, size) {
4475
4901
  } });
4476
4902
  };
4477
4903
  var withContainer = function (iconFill, isLeading, Icon) {
4478
- return Icon && (jsx("span", __assign$1({ css: css(templateObject_1$18 || (templateObject_1$18 = __makeTemplateObject(["\n display: flex;\n align-items: center;\n ", "\n "], ["\n display: flex;\n align-items: center;\n ", "\n "])), isLeading ? 'margin-right: 5px' : 'margin-left: 5px') }, { children: jsx(Icon, { width: 1.25, height: 1.25, fill: iconFill }, void 0) }), void 0));
4904
+ return Icon && (jsx("span", __assign$1({ css: css(templateObject_1$1b || (templateObject_1$1b = __makeTemplateObject(["\n display: flex;\n align-items: center;\n ", "\n "], ["\n display: flex;\n align-items: center;\n ", "\n "])), isLeading ? 'margin-right: 5px' : 'margin-left: 5px') }, { children: jsx(Icon, { width: 1.25, height: 1.25, fill: iconFill }, void 0) }), void 0));
4479
4905
  };
4480
4906
  var getIconFill = function (theme, disabled, iconColor) {
4481
4907
  if (disabled)
@@ -4491,16 +4917,16 @@ var TextButton = function (_a) {
4491
4917
  var iconFill = getIconFill(theme, disabled, iconColor);
4492
4918
  return (jsx(BaseButton, __assign$1({ renderLeading: withContainer(iconFill, true, LeadingIcon), renderTrailing: withContainer(iconFill, false, TrailingIcon), disabled: disabled, type: type, onClick: onClick, css: textButtonStyles$1(theme, size), uppercase: uppercase }, { children: text }), void 0));
4493
4919
  };
4494
- var templateObject_1$18;
4920
+ var templateObject_1$1b;
4495
4921
 
4496
- var Container$J = newStyled.div(templateObject_1$17 || (templateObject_1$17 = __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"])));
4497
- var P$3 = newStyled.p(templateObject_2$J || (templateObject_2$J = __makeTemplateObject(["\n margin: 0;\n"], ["\n margin: 0;\n"])));
4498
- var PercentageSpan = newStyled.span(templateObject_3$w || (templateObject_3$w = __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"])));
4922
+ var Container$M = newStyled.div(templateObject_1$1a || (templateObject_1$1a = __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"])));
4923
+ var P$3 = newStyled.p(templateObject_2$M || (templateObject_2$M = __makeTemplateObject(["\n margin: 0;\n"], ["\n margin: 0;\n"])));
4924
+ var PercentageSpan = newStyled.span(templateObject_3$z || (templateObject_3$z = __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"])));
4499
4925
  var SizeFitGuide = function (_a) {
4500
4926
  var title = _a.title, fitPercentage = _a.fitPercentage, onClick = _a.onClick, onClickFitPercentage = _a.onClickFitPercentage;
4501
- return (jsxs$1(Container$J, { children: [jsx$1(TextButton, { LeadingIcon: Icon.PDP.Rule, size: ComponentSize.Small, text: title, onClick: onClick, uppercase: false }, void 0), !!fitPercentage && (jsxs$1(P$3, { children: ["Fit As Expected:", ' ', jsxs$1(PercentageSpan, __assign$1({ onClick: onClickFitPercentage, role: "button" }, { children: [fitPercentage, "%"] }), void 0)] }, void 0))] }, void 0));
4927
+ return (jsxs$1(Container$M, { children: [jsx$1(TextButton, { LeadingIcon: Icon.PDP.Rule, size: ComponentSize.Small, text: title, onClick: onClick, uppercase: false }, void 0), !!fitPercentage && (jsxs$1(P$3, { children: ["Fit As Expected:", ' ', jsxs$1(PercentageSpan, __assign$1({ onClick: onClickFitPercentage, role: "button" }, { children: [fitPercentage, "%"] }), void 0)] }, void 0))] }, void 0));
4502
4928
  };
4503
- var templateObject_1$17, templateObject_2$J, templateObject_3$w;
4929
+ var templateObject_1$1a, templateObject_2$M, templateObject_3$z;
4504
4930
 
4505
4931
  var getStylesBySize$6 = function (size) {
4506
4932
  switch (size) {
@@ -4530,7 +4956,7 @@ var getStylesBySize$6 = function (size) {
4530
4956
  };
4531
4957
  }
4532
4958
  };
4533
- var Container$I = newStyled.div(templateObject_1$16 || (templateObject_1$16 = __makeTemplateObject(["\n background-color: ", ";\n border: 1px solid ", ";\n border-radius: ", ";\n padding: ", ";\n display: inline-flex;\n flex-direction: row;\n justify-content: center;\n align-items: center;\n width: ", ";\n height: ", ";\n text-align: center;\n cursor: default;\n"], ["\n background-color: ", ";\n border: 1px solid ", ";\n border-radius: ", ";\n padding: ", ";\n display: inline-flex;\n flex-direction: row;\n justify-content: center;\n align-items: center;\n width: ", ";\n height: ", ";\n text-align: center;\n cursor: default;\n"])), function (_a) {
4959
+ var Container$L = newStyled.div(templateObject_1$19 || (templateObject_1$19 = __makeTemplateObject(["\n background-color: ", ";\n border: 1px solid ", ";\n border-radius: ", ";\n padding: ", ";\n display: inline-flex;\n flex-direction: row;\n justify-content: center;\n align-items: center;\n width: ", ";\n height: ", ";\n text-align: center;\n cursor: default;\n"], ["\n background-color: ", ";\n border: 1px solid ", ";\n border-radius: ", ";\n padding: ", ";\n display: inline-flex;\n flex-direction: row;\n justify-content: center;\n align-items: center;\n width: ", ";\n height: ", ";\n text-align: center;\n cursor: default;\n"])), function (_a) {
4534
4960
  var backgroundColor = _a.backgroundColor;
4535
4961
  return backgroundColor;
4536
4962
  }, function (_a) {
@@ -4552,7 +4978,7 @@ var Container$I = newStyled.div(templateObject_1$16 || (templateObject_1$16 = __
4552
4978
  var size = _a.size;
4553
4979
  return (_b = getStylesBySize$6(size)) === null || _b === void 0 ? void 0 : _b.height;
4554
4980
  });
4555
- var H3$2 = newStyled.h3(templateObject_2$I || (templateObject_2$I = __makeTemplateObject(["\n color: ", ";\n font-weight: bold;\n margin: 0;\n font-size: ", ";\n line-height: ", ";\n"], ["\n color: ", ";\n font-weight: bold;\n margin: 0;\n font-size: ", ";\n line-height: ", ";\n"])), function (_a) {
4981
+ var H3$2 = newStyled.h3(templateObject_2$L || (templateObject_2$L = __makeTemplateObject(["\n color: ", ";\n font-weight: bold;\n margin: 0;\n font-size: ", ";\n line-height: ", ";\n"], ["\n color: ", ";\n font-weight: bold;\n margin: 0;\n font-size: ", ";\n line-height: ", ";\n"])), function (_a) {
4556
4982
  var textColor = _a.textColor;
4557
4983
  return textColor;
4558
4984
  }, function (_a) {
@@ -4567,9 +4993,9 @@ var H3$2 = newStyled.h3(templateObject_2$I || (templateObject_2$I = __makeTempla
4567
4993
  var DiscountTag = function (_a) {
4568
4994
  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 ? ComponentSize.Medium : _e, style = _a.style;
4569
4995
  var theme = useTheme();
4570
- return (jsx$1(Container$I, __assign$1({ backgroundColor: disabled ? theme.colors.shades['50'].color : backgroundColor, borderColor: disabled ? theme.colors.shades['50'].color : borderColor, size: size, "data-testid": "discount-container" }, { children: jsxs$1(H3$2, __assign$1({ textColor: disabled ? theme.colors.shades['250'].color : textColor, size: size, style: style }, { children: [discount, "% ", offText] }), void 0) }), void 0));
4996
+ return (jsx$1(Container$L, __assign$1({ backgroundColor: disabled ? theme.colors.shades['50'].color : backgroundColor, borderColor: disabled ? theme.colors.shades['50'].color : borderColor, size: size, "data-testid": "discount-container" }, { children: jsxs$1(H3$2, __assign$1({ textColor: disabled ? theme.colors.shades['250'].color : textColor, size: size, style: style }, { children: [discount, "% ", offText] }), void 0) }), void 0));
4571
4997
  };
4572
- var templateObject_1$16, templateObject_2$I;
4998
+ var templateObject_1$19, templateObject_2$L;
4573
4999
 
4574
5000
  var getStylesBySize$5 = function (size) {
4575
5001
  switch (size) {
@@ -4599,8 +5025,8 @@ var getStylesBySize$5 = function (size) {
4599
5025
  };
4600
5026
  }
4601
5027
  };
4602
- var Container$H = newStyled.div(templateObject_1$15 || (templateObject_1$15 = __makeTemplateObject(["\n display: flex;\n align-items: center;\n"], ["\n display: flex;\n align-items: center;\n"])));
4603
- var Price = newStyled.p(templateObject_2$H || (templateObject_2$H = __makeTemplateObject(["\n font-weight: ", ";\n font-size: ", ";\n line-height: ", ";\n color: ", ";\n text-decoration: ", ";\n margin: ", ";\n margin-top: ", ";\n"], ["\n font-weight: ", ";\n font-size: ", ";\n line-height: ", ";\n color: ", ";\n text-decoration: ", ";\n margin: ", ";\n margin-top: ", ";\n"])), function (_a) {
5028
+ var Container$K = newStyled.div(templateObject_1$18 || (templateObject_1$18 = __makeTemplateObject(["\n display: flex;\n align-items: center;\n"], ["\n display: flex;\n align-items: center;\n"])));
5029
+ var Price = newStyled.p(templateObject_2$K || (templateObject_2$K = __makeTemplateObject(["\n font-weight: ", ";\n font-size: ", ";\n line-height: ", ";\n color: ", ";\n text-decoration: ", ";\n margin: ", ";\n margin-top: ", ";\n"], ["\n font-weight: ", ";\n font-size: ", ";\n line-height: ", ";\n color: ", ";\n text-decoration: ", ";\n margin: ", ";\n margin-top: ", ";\n"])), function (_a) {
4604
5030
  var weight = _a.weight;
4605
5031
  return (weight ? weight : '400');
4606
5032
  }, function (_a) {
@@ -4629,7 +5055,7 @@ var Price = newStyled.p(templateObject_2$H || (templateObject_2$H = __makeTempla
4629
5055
  var finalPriceStyledSmall = _a.finalPriceStyledSmall, size = _a.size;
4630
5056
  return finalPriceStyledSmall ? (size === 'large' ? '-10px' : '-7px') : '0';
4631
5057
  });
4632
- var TagContainer = newStyled.p(templateObject_3$v || (templateObject_3$v = __makeTemplateObject(["\n margin: ", ";\n display: flex;\n align-items: center;\n"], ["\n margin: ", ";\n display: flex;\n align-items: center;\n"])), function (_a) {
5058
+ var TagContainer = newStyled.p(templateObject_3$y || (templateObject_3$y = __makeTemplateObject(["\n margin: ", ";\n display: flex;\n align-items: center;\n"], ["\n margin: ", ";\n display: flex;\n align-items: center;\n"])), function (_a) {
4633
5059
  var _b;
4634
5060
  var size = _a.size;
4635
5061
  return (_b = getStylesBySize$5(size)) === null || _b === void 0 ? void 0 : _b.margin;
@@ -4650,11 +5076,11 @@ var PriceLabel = function (_a) {
4650
5076
  weight: 700,
4651
5077
  };
4652
5078
  var OriginalPrice = function () { return (jsx$1(Price, __assign$1({ size: originalPriceStyled ? size : ComponentSize.Small, color: theme.colors.shades['300'].color, margin: true, underlined: originalPriceUnderlined, "data-testid": getTestId(testId, 'original-product-price') }, { children: originalPrice }), void 0)); };
4653
- return (jsxs$1(Container$H, { children: [jsx$1(Price, __assign$1({ margin: true, "data-testid": getTestId(testId, 'final-product-price') }, priceCommonProps, { style: finalPriceStyle }, { children: finalPrice }), void 0), originalPrice && jsx$1(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));
5079
+ return (jsxs$1(Container$K, { children: [jsx$1(Price, __assign$1({ margin: true, "data-testid": getTestId(testId, 'final-product-price') }, priceCommonProps, { style: finalPriceStyle }, { children: finalPrice }), void 0), originalPrice && jsx$1(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));
4654
5080
  };
4655
- var templateObject_1$15, templateObject_2$H, templateObject_3$v;
5081
+ var templateObject_1$18, templateObject_2$K, templateObject_3$y;
4656
5082
 
4657
- var FinalPriceStyledContainer = newStyled.div(templateObject_1$14 || (templateObject_1$14 = __makeTemplateObject(["\n display: flex;\n"], ["\n display: flex;\n"])));
5083
+ var FinalPriceStyledContainer = newStyled.div(templateObject_1$17 || (templateObject_1$17 = __makeTemplateObject(["\n display: flex;\n"], ["\n display: flex;\n"])));
4658
5084
  var PriceLabelV2 = function (_a) {
4659
5085
  var _b;
4660
5086
  var finalPrice = _a.finalPrice, originalPrice = _a.originalPrice, discount = _a.discount, color = _a.color, testId = _a.testId, _c = _a.originalPriceStyled, originalPriceStyled = _c === void 0 ? false : _c, _d = _a.originalPriceUnderlined, originalPriceUnderlined = _d === void 0 ? true : _d, _e = _a.size, size = _e === void 0 ? ComponentSize.Medium : _e;
@@ -4671,9 +5097,9 @@ var PriceLabelV2 = function (_a) {
4671
5097
  weight: 700,
4672
5098
  };
4673
5099
  var OriginalPrice = function () { return (jsx$1(Price, __assign$1({ size: originalPriceStyled ? size : ComponentSize.Small, color: theme.colors.shades['300'].color, margin: true, underlined: originalPriceUnderlined, "data-testid": getTestId(testId, 'original-product-price') }, { children: originalPrice }), void 0)); };
4674
- return (jsxs$1(Container$H, { children: [isOriginalPrice && jsx$1(OriginalPrice, {}, void 0), jsxs$1(FinalPriceStyledContainer, __assign$1({ "data-testid": getTestId(testId, 'final-product-price') }, { children: [jsx$1(Price, __assign$1({ margin: true, finalPriceStyledSmall: true, style: { fontSize: '14px', marginTop: '-5px' } }, priceCommonProps, { children: "$" }), void 0), jsx$1(Price, __assign$1({ finalPriceStyled: true }, priceCommonProps, { children: finalPriceArray[0] ? finalPriceArray[0] : (_b = "".concat(finalPrice)) === null || _b === void 0 ? void 0 : _b.split('$')[1] }), void 0), jsx$1(Price, __assign$1({ finalPriceStyledSmall: true, style: { fontSize: '14px', marginTop: '-6px' } }, priceCommonProps, { children: finalPriceArray[1] ? finalPriceArray[1] : '00' }), void 0)] }), void 0), isDiscount && (jsx$1(TagContainer, __assign$1({ size: ComponentSize.Small }, { children: discount && (jsx$1(DiscountTag, __assign$1({}, discount, { size: ComponentSize.Medium, style: { fontSize: '14px', letterSpacing: '-0.05rem' } }), void 0)) }), void 0))] }, void 0));
5100
+ return (jsxs$1(Container$K, { children: [isOriginalPrice && jsx$1(OriginalPrice, {}, void 0), jsxs$1(FinalPriceStyledContainer, __assign$1({ "data-testid": getTestId(testId, 'final-product-price') }, { children: [jsx$1(Price, __assign$1({ margin: true, finalPriceStyledSmall: true, style: { fontSize: '14px', marginTop: '-5px' } }, priceCommonProps, { children: "$" }), void 0), jsx$1(Price, __assign$1({ finalPriceStyled: true }, priceCommonProps, { children: finalPriceArray[0] ? finalPriceArray[0] : (_b = "".concat(finalPrice)) === null || _b === void 0 ? void 0 : _b.split('$')[1] }), void 0), jsx$1(Price, __assign$1({ finalPriceStyledSmall: true, style: { fontSize: '14px', marginTop: '-6px' } }, priceCommonProps, { children: finalPriceArray[1] ? finalPriceArray[1] : '00' }), void 0)] }), void 0), isDiscount && (jsx$1(TagContainer, __assign$1({ size: ComponentSize.Small }, { children: discount && (jsx$1(DiscountTag, __assign$1({}, discount, { size: ComponentSize.Medium, style: { fontSize: '14px', letterSpacing: '-0.05rem' } }), void 0)) }), void 0))] }, void 0));
4675
5101
  };
4676
- var templateObject_1$14;
5102
+ var templateObject_1$17;
4677
5103
 
4678
5104
  var OneColorSelector = function (_a) {
4679
5105
  var color = _a.color, selected = _a.selected, testId = _a.testId;
@@ -4714,11 +5140,11 @@ var OutOfStock = function (_a) {
4714
5140
  return (jsxs$1("svg", __assign$1({ width: "32", height: "33", viewBox: "0 0 32 33", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, { children: [jsx$1("title", { children: title }, void 0), jsx$1("mask", __assign$1({ id: "path-1-inside-1", fill: "white" }, { children: jsx$1("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M8.89435 9.60565C8.40619 10.0938 8.40619 10.8853 8.89435 11.3734L14.0209 16.5L8.89433 21.6266C8.40617 22.1147 8.40617 22.9062 8.89433 23.3943C9.38248 23.8825 10.1739 23.8825 10.6621 23.3943L15.7887 18.2677L21.2687 23.7478C21.7569 24.2359 22.5483 24.2359 23.0365 23.7478C23.5246 23.2596 23.5246 22.4682 23.0365 21.98L17.5564 16.5L23.0365 11.02C23.5246 10.5318 23.5246 9.74035 23.0365 9.25219C22.5483 8.76404 21.7568 8.76404 21.2687 9.25219L15.7887 14.7322L10.6621 9.60565C10.174 9.1175 9.3825 9.1175 8.89435 9.60565Z" }, void 0) }), void 0), jsx$1("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M8.89435 9.60565C8.40619 10.0938 8.40619 10.8853 8.89435 11.3734L14.0209 16.5L8.89433 21.6266C8.40617 22.1147 8.40617 22.9062 8.89433 23.3943C9.38248 23.8825 10.1739 23.8825 10.6621 23.3943L15.7887 18.2677L21.2687 23.7478C21.7569 24.2359 22.5483 24.2359 23.0365 23.7478C23.5246 23.2596 23.5246 22.4682 23.0365 21.98L17.5564 16.5L23.0365 11.02C23.5246 10.5318 23.5246 9.74035 23.0365 9.25219C22.5483 8.76404 21.7568 8.76404 21.2687 9.25219L15.7887 14.7322L10.6621 9.60565C10.174 9.1175 9.3825 9.1175 8.89435 9.60565Z", fill: theme.colors.shades['300'].color }, void 0), jsx$1("path", { d: "M14.0209 16.5L14.5866 17.0657L15.1523 16.5L14.5866 15.9343L14.0209 16.5ZM8.89433 21.6266L9.46001 22.1922L8.89433 21.6266ZM10.6621 23.3943L11.2278 23.96L10.6621 23.3943ZM15.7887 18.2677L16.3544 17.7021L15.7887 17.1364L15.223 17.7021L15.7887 18.2677ZM17.5564 16.5L16.9908 15.9343L16.4251 16.5L16.9908 17.0657L17.5564 16.5ZM23.0365 11.02L23.6021 11.5856L23.0365 11.02ZM21.2687 9.25219L21.8344 9.81788L21.2687 9.25219ZM15.7887 14.7322L15.223 15.2979L15.7887 15.8636L16.3544 15.2979L15.7887 14.7322ZM9.46003 10.8077C9.2843 10.632 9.2843 10.3471 9.46003 10.1713L8.32866 9.03997C7.52809 9.84054 7.52809 11.1385 8.32866 11.9391L9.46003 10.8077ZM14.5866 15.9343L9.46003 10.8077L8.32866 11.9391L13.4552 17.0657L14.5866 15.9343ZM9.46001 22.1922L14.5866 17.0657L13.4552 15.9343L8.32864 21.0609L9.46001 22.1922ZM9.46001 22.8286C9.28428 22.6529 9.28428 22.368 9.46001 22.1922L8.32864 21.0609C7.52807 21.8614 7.52807 23.1594 8.32864 23.96L9.46001 22.8286ZM10.0964 22.8286C9.92067 23.0044 9.63575 23.0044 9.46001 22.8286L8.32864 23.96C9.12922 24.7606 10.4272 24.7606 11.2278 23.96L10.0964 22.8286ZM15.223 17.7021L10.0964 22.8286L11.2278 23.96L16.3544 18.8334L15.223 17.7021ZM21.8344 23.1821L16.3544 17.7021L15.223 18.8334L20.703 24.3135L21.8344 23.1821ZM22.4708 23.1821C22.2951 23.3578 22.0101 23.3578 21.8344 23.1821L20.703 24.3135C21.5036 25.114 22.8016 25.114 23.6022 24.3135L22.4708 23.1821ZM22.4708 22.5457C22.6465 22.7214 22.6465 23.0064 22.4708 23.1821L23.6022 24.3135C24.4027 23.5129 24.4027 22.2149 23.6022 21.4143L22.4708 22.5457ZM16.9908 17.0657L22.4708 22.5457L23.6022 21.4143L18.1221 15.9343L16.9908 17.0657ZM22.4708 10.4543L16.9908 15.9343L18.1221 17.0657L23.6021 11.5856L22.4708 10.4543ZM22.4708 9.81788C22.6465 9.99361 22.6465 10.2785 22.4708 10.4543L23.6021 11.5856C24.4027 10.7851 24.4027 9.48708 23.6021 8.68651L22.4708 9.81788ZM21.8344 9.81788C22.0101 9.64214 22.295 9.64214 22.4708 9.81788L23.6021 8.68651C22.8016 7.88593 21.5036 7.88593 20.703 8.68651L21.8344 9.81788ZM16.3544 15.2979L21.8344 9.81788L20.703 8.68651L15.223 14.1665L16.3544 15.2979ZM10.0964 10.1713L15.223 15.2979L16.3544 14.1665L11.2278 9.03997L10.0964 10.1713ZM9.46003 10.1713C9.63577 9.9956 9.92069 9.9956 10.0964 10.1713L11.2278 9.03997C10.4272 8.23939 9.12924 8.23939 8.32866 9.03997L9.46003 10.1713Z", fill: "white", mask: "url(#path-1-inside-1)" }, void 0), jsx$1("circle", { cx: "16", cy: "16.5", r: "12", stroke: theme.colors.shades['300'].color, strokeWidth: "0.5" }, void 0)] }), void 0));
4715
5141
  };
4716
5142
 
4717
- var CustomRadioGroup = newStyled(lt)(templateObject_1$13 || (templateObject_1$13 = __makeTemplateObject(["\n display: flex;\n flex-direction: column;\n"], ["\n display: flex;\n flex-direction: column;\n"])));
4718
- newStyled(lt.Label)(templateObject_2$G || (templateObject_2$G = __makeTemplateObject(["\n font-size: 0.88rem;\n"], ["\n font-size: 0.88rem;\n"])));
4719
- var CustomRadioGroupOption = newStyled(lt.Option)(templateObject_3$u || (templateObject_3$u = __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"])));
5143
+ var CustomRadioGroup = newStyled(lt)(templateObject_1$16 || (templateObject_1$16 = __makeTemplateObject(["\n display: flex;\n flex-direction: column;\n"], ["\n display: flex;\n flex-direction: column;\n"])));
5144
+ newStyled(lt.Label)(templateObject_2$J || (templateObject_2$J = __makeTemplateObject(["\n font-size: 0.88rem;\n"], ["\n font-size: 0.88rem;\n"])));
5145
+ var CustomRadioGroupOption = newStyled(lt.Option)(templateObject_3$x || (templateObject_3$x = __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"])));
4720
5146
  var Span = newStyled.span(templateObject_4$m || (templateObject_4$m = __makeTemplateObject(["\n font-weight: 600;\n"], ["\n font-weight: 600;\n"])));
4721
- var OptionsContainer = newStyled.div(templateObject_5$c || (templateObject_5$c = __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"])));
5147
+ var OptionsContainer = newStyled.div(templateObject_5$d || (templateObject_5$d = __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"])));
4722
5148
  var Label$2 = function (_a) {
4723
5149
  var label = _a.label, values = _a.values;
4724
5150
  return (jsxs$1(Text$6, __assign$1({ variant: "body", weight: "regular", size: "small" }, { children: [label, " ", jsx$1(Span, { children: values }, void 0)] }), void 0));
@@ -4736,20 +5162,20 @@ var ColorRadioGroup$1 = Object.assign(ColorRadioGroup, {
4736
5162
  Option: Option,
4737
5163
  OptionsContainer: OptionsContainer,
4738
5164
  });
4739
- var templateObject_1$13, templateObject_2$G, templateObject_3$u, templateObject_4$m, templateObject_5$c;
5165
+ var templateObject_1$16, templateObject_2$J, templateObject_3$x, templateObject_4$m, templateObject_5$d;
4740
5166
 
4741
- var Container$G = newStyled.div(templateObject_1$12 || (templateObject_1$12 = __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) {
5167
+ var Container$J = newStyled.div(templateObject_1$15 || (templateObject_1$15 = __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) {
4742
5168
  var borderColor = _a.borderColor;
4743
5169
  return borderColor;
4744
5170
  });
4745
- var Image$3 = newStyled.img(templateObject_2$F || (templateObject_2$F = __makeTemplateObject(["\n width: 100%;\n height: 100%;\n border-radius: 50%;\n"], ["\n width: 100%;\n height: 100%;\n border-radius: 50%;\n"])));
5171
+ var Image$3 = newStyled.img(templateObject_2$I || (templateObject_2$I = __makeTemplateObject(["\n width: 100%;\n height: 100%;\n border-radius: 50%;\n"], ["\n width: 100%;\n height: 100%;\n border-radius: 50%;\n"])));
4746
5172
  var PatternSelector = function (_a) {
4747
5173
  var url = _a.url, selected = _a.selected, testId = _a.testId;
4748
5174
  var theme = useTheme();
4749
5175
  var outerBorder = selected ? theme.colors.shades['550'].color : 'transparent';
4750
- return (jsx$1(Container$G, __assign$1({ "data-testid": testId, borderColor: outerBorder }, { children: jsx$1(Image$3, { src: url, alt: "pattern" }, void 0) }), void 0));
5176
+ return (jsx$1(Container$J, __assign$1({ "data-testid": testId, borderColor: outerBorder }, { children: jsx$1(Image$3, { src: url, alt: "pattern" }, void 0) }), void 0));
4751
5177
  };
4752
- var templateObject_1$12, templateObject_2$F;
5178
+ var templateObject_1$15, templateObject_2$I;
4753
5179
 
4754
5180
  var renderOptions$1 = function (options) {
4755
5181
  if (options.length === 0) {
@@ -4807,7 +5233,7 @@ var MultiColorPicker = function (_a) {
4807
5233
  return (jsxs$1(ColorRadioGroup$1, __assign$1({ value: selectedColor, onChange: onChangeHandler }, { children: [jsx$1(ColorRadioGroup$1.Label, { label: label, values: valueLabels }, void 0), jsx$1(ColorRadioGroup$1.OptionsContainer, { children: renderOptions(selectedColor, options) }, void 0)] }), void 0));
4808
5234
  };
4809
5235
 
4810
- var Image$2 = newStyled.img(templateObject_1$11 || (templateObject_1$11 = __makeTemplateObject(["\n ", "\n\n width: 4.063rem;\n height: 5.375rem;\n box-sizing: border-box;\n cursor: pointer;\n border: ", ";\n"], ["\n ", "\n\n width: 4.063rem;\n height: 5.375rem;\n box-sizing: border-box;\n cursor: pointer;\n border: ", ";\n"])), function (_a) {
5236
+ var Image$2 = newStyled.img(templateObject_1$14 || (templateObject_1$14 = __makeTemplateObject(["\n ", "\n\n width: 4.063rem;\n height: 5.375rem;\n box-sizing: border-box;\n cursor: pointer;\n border: ", ";\n"], ["\n ", "\n\n width: 4.063rem;\n height: 5.375rem;\n box-sizing: border-box;\n cursor: pointer;\n border: ", ";\n"])), function (_a) {
4811
5237
  var borderRadiusVariant = _a.borderRadiusVariant;
4812
5238
  return borderRadiusVariant &&
4813
5239
  "\nborder-radius: 20px;\n";
@@ -4820,7 +5246,7 @@ var ImageSmallPreview = function (_a) {
4820
5246
  var theme = useTheme();
4821
5247
  return (jsx$1(Image$2, { className: className, src: imageUrl, alt: alt, selected: selected, theme: theme, borderRadiusVariant: borderRadiusVariant }, void 0));
4822
5248
  };
4823
- var templateObject_1$11;
5249
+ var templateObject_1$14;
4824
5250
 
4825
5251
  var Button$4 = newStyled.button(function () { return ({
4826
5252
  background: 'transparent',
@@ -9063,14 +9489,14 @@ var Slider = /*#__PURE__*/function (_React$Component) {
9063
9489
  return Slider;
9064
9490
  }(React__default.Component);
9065
9491
 
9066
- var StyledSlider = newStyled(Slider)(templateObject_1$10 || (templateObject_1$10 = __makeTemplateObject(["\n .slick-dots {\n position: static;\n display: flex !important;\n justify-content: center;\n column-gap: ", ";\n margin-top: ", ";\n }\n .slick-prev {\n left: ", ";\n }\n .slick-next {\n right: ", ";\n }\n .slick-prev,\n .slick-next {\n width: fit-content;\n height: fit-content;\n }\n .slick-prev:before,\n .slick-next:before {\n content: none;\n }\n .slick-dots li {\n margin: 0;\n width: auto;\n line-height: 0;\n height: auto;\n }\n"], ["\n .slick-dots {\n position: static;\n display: flex !important;\n justify-content: center;\n column-gap: ", ";\n margin-top: ", ";\n }\n .slick-prev {\n left: ", ";\n }\n .slick-next {\n right: ", ";\n }\n .slick-prev,\n .slick-next {\n width: fit-content;\n height: fit-content;\n }\n .slick-prev:before,\n .slick-next:before {\n content: none;\n }\n .slick-dots li {\n margin: 0;\n width: auto;\n line-height: 0;\n height: auto;\n }\n"])), function (props) { return "".concat(props.dotsSpacing, "rem"); }, function (props) { return "".concat(props.dotListMarginTop, "rem"); }, function (_a) {
9492
+ var StyledSlider = newStyled(Slider)(templateObject_1$13 || (templateObject_1$13 = __makeTemplateObject(["\n .slick-dots {\n position: static;\n display: flex !important;\n justify-content: center;\n column-gap: ", ";\n margin-top: ", ";\n }\n .slick-prev {\n left: ", ";\n }\n .slick-next {\n right: ", ";\n }\n .slick-prev,\n .slick-next {\n width: fit-content;\n height: fit-content;\n }\n .slick-prev:before,\n .slick-next:before {\n content: none;\n }\n .slick-dots li {\n margin: 0;\n width: auto;\n line-height: 0;\n height: auto;\n }\n"], ["\n .slick-dots {\n position: static;\n display: flex !important;\n justify-content: center;\n column-gap: ", ";\n margin-top: ", ";\n }\n .slick-prev {\n left: ", ";\n }\n .slick-next {\n right: ", ";\n }\n .slick-prev,\n .slick-next {\n width: fit-content;\n height: fit-content;\n }\n .slick-prev:before,\n .slick-next:before {\n content: none;\n }\n .slick-dots li {\n margin: 0;\n width: auto;\n line-height: 0;\n height: auto;\n }\n"])), function (props) { return "".concat(props.dotsSpacing, "rem"); }, function (props) { return "".concat(props.dotListMarginTop, "rem"); }, function (_a) {
9067
9493
  var arrowPaddingOffset = _a.arrowPaddingOffset, _b = _a.arrowPadding, arrowPadding = _b === void 0 ? 0 : _b;
9068
9494
  return "-".concat(arrowPaddingOffset + arrowPadding, "rem");
9069
9495
  }, function (_a) {
9070
9496
  var arrowPaddingOffset = _a.arrowPaddingOffset, _b = _a.arrowPadding, arrowPadding = _b === void 0 ? 0 : _b;
9071
9497
  return "-".concat(arrowPaddingOffset + arrowPadding, "rem");
9072
9498
  });
9073
- var templateObject_1$10;
9499
+ var templateObject_1$13;
9074
9500
 
9075
9501
  var getStylesBySize$4 = function (size) {
9076
9502
  // rem units
@@ -9129,22 +9555,22 @@ var SliderNavigation = function (_a) {
9129
9555
  } }, { children: jsx(StyledSlider, __assign$1({}, settings, { arrowPadding: arrows && arrows.arrowPadding, dotListMarginTop: dotListMarginTop && dotListMarginTop, arrowPaddingOffset: arrows ? arrows.arrowWidth : 0, dotsSpacing: styles && styles.dotsSpacing }, { children: children }), void 0) }), void 0));
9130
9556
  };
9131
9557
 
9132
- var horizontalStyles = css(templateObject_1$$ || (templateObject_1$$ = __makeTemplateObject(["\n grid-row: 2;\n grid-auto-flow: column;\n grid-column-gap: 6px;\n margin-top: 20px;\n max-width: 360px;\n overflow: auto;\n"], ["\n grid-row: 2;\n grid-auto-flow: column;\n grid-column-gap: 6px;\n margin-top: 20px;\n max-width: 360px;\n overflow: auto;\n"])));
9133
- var verticalStyles = css(templateObject_2$E || (templateObject_2$E = __makeTemplateObject(["\n grid-row-gap: 20px;\n overflow: auto;\n grid-area: 1/1;\n"], ["\n grid-row-gap: 20px;\n overflow: auto;\n grid-area: 1/1;\n"])));
9134
- var Container$F = newStyled.div(templateObject_3$t || (templateObject_3$t = __makeTemplateObject(["\n display: grid;\n max-height: 45rem;\n height: min-content;\n align-items: flex-start;\n ", "\n"], ["\n display: grid;\n max-height: 45rem;\n height: min-content;\n align-items: flex-start;\n ", "\n"])), function (_a) {
9558
+ var horizontalStyles = css(templateObject_1$12 || (templateObject_1$12 = __makeTemplateObject(["\n grid-row: 2;\n grid-auto-flow: column;\n grid-column-gap: 6px;\n margin-top: 20px;\n max-width: 360px;\n overflow: auto;\n"], ["\n grid-row: 2;\n grid-auto-flow: column;\n grid-column-gap: 6px;\n margin-top: 20px;\n max-width: 360px;\n overflow: auto;\n"])));
9559
+ var verticalStyles = css(templateObject_2$H || (templateObject_2$H = __makeTemplateObject(["\n grid-row-gap: 20px;\n overflow: auto;\n grid-area: 1/1;\n"], ["\n grid-row-gap: 20px;\n overflow: auto;\n grid-area: 1/1;\n"])));
9560
+ var Container$I = newStyled.div(templateObject_3$w || (templateObject_3$w = __makeTemplateObject(["\n display: grid;\n max-height: 45rem;\n height: min-content;\n align-items: flex-start;\n ", "\n"], ["\n display: grid;\n max-height: 45rem;\n height: min-content;\n align-items: flex-start;\n ", "\n"])), function (_a) {
9135
9561
  var position = _a.position;
9136
9562
  return (position == 'horizontal' ? horizontalStyles : verticalStyles);
9137
9563
  });
9138
9564
  var Button$3 = newStyled.button(templateObject_4$l || (templateObject_4$l = __makeTemplateObject(["\n padding: 0;\n border: none;\n text-decoration: none;\n background: transparent;\n outline: none;\n"], ["\n padding: 0;\n border: none;\n text-decoration: none;\n background: transparent;\n outline: none;\n"])));
9139
9565
  var ImagePreviewList = function (_a) {
9140
9566
  var images = _a.images, selectedImage = _a.selectedImage, onClick = _a.onClick, dataTestId = _a.dataTestId, position = _a.position, borderRadiusVariant = _a.borderRadiusVariant;
9141
- return (jsx$1(Container$F, __assign$1({ "data-testid": dataTestId, position: position, className: position }, { children: position == 'horizontal' ? (jsx$1("div", __assign$1({ style: { maxWidth: '360px' } }, { children: jsx$1(SliderNavigation, __assign$1({ speed: 200, infinite: false, arrows: {
9567
+ return (jsx$1(Container$I, __assign$1({ "data-testid": dataTestId, position: position, className: position }, { children: position == 'horizontal' ? (jsx$1("div", __assign$1({ style: { maxWidth: '360px' } }, { children: jsx$1(SliderNavigation, __assign$1({ speed: 200, infinite: false, arrows: {
9142
9568
  arrowWidth: 0.75,
9143
9569
  arrowHeight: 1.25,
9144
9570
  arrowPadding: 1.625,
9145
9571
  }, adaptiveHeight: true, dots: false, slidesToShow: 4 }, { children: images.map(function (item) { return (jsx$1(Button$3, __assign$1({ onClick: function () { return onClick(item); } }, { children: jsx$1(ImageSmallPreview, { imageUrl: item.imageUrl, alt: item.alt, selected: item.key === selectedImage.key, borderRadiusVariant: borderRadiusVariant }, void 0) }), item.key)); }) }), void 0) }), void 0)) : (images.map(function (item) { return (jsx$1(Button$3, __assign$1({ onClick: function () { return onClick(item); } }, { children: jsx$1(ImageSmallPreview, { imageUrl: item.imageUrl, alt: item.alt, selected: item.key === selectedImage.key, borderRadiusVariant: borderRadiusVariant }, void 0) }), item.key)); })) }), void 0));
9146
9572
  };
9147
- var templateObject_1$$, templateObject_2$E, templateObject_3$t, templateObject_4$l;
9573
+ var templateObject_1$12, templateObject_2$H, templateObject_3$w, templateObject_4$l;
9148
9574
 
9149
9575
  var propTypes = {exports: {}};
9150
9576
 
@@ -10730,23 +11156,23 @@ InnerImageZoom.propTypes = process.env.NODE_ENV !== "production" ? {
10730
11156
  afterZoomOut: PropTypes.func
10731
11157
  } : {};
10732
11158
 
10733
- var Container$E = newStyled.div(templateObject_1$_ || (templateObject_1$_ = __makeTemplateObject(["\n ", "\n position: relative;\n height: '45rem' &.styleforhorizontal {\n height: '30rem';\n }\n display: block;\n height: fit-content;\n overflow: hidden;\n white-space: nowrap;\n grid-area: 1/2;\n"], ["\n ", "\n position: relative;\n height: '45rem' &.styleforhorizontal {\n height: '30rem';\n }\n display: block;\n height: fit-content;\n overflow: hidden;\n white-space: nowrap;\n grid-area: 1/2;\n"])), function (_a) {
11159
+ var Container$H = newStyled.div(templateObject_1$11 || (templateObject_1$11 = __makeTemplateObject(["\n ", "\n position: relative;\n height: '45rem' &.styleforhorizontal {\n height: '30rem';\n }\n display: block;\n height: fit-content;\n overflow: hidden;\n white-space: nowrap;\n grid-area: 1/2;\n"], ["\n ", "\n position: relative;\n height: '45rem' &.styleforhorizontal {\n height: '30rem';\n }\n display: block;\n height: fit-content;\n overflow: hidden;\n white-space: nowrap;\n grid-area: 1/2;\n"])), function (_a) {
10734
11160
  var borderRadiusVariant = _a.borderRadiusVariant;
10735
11161
  return borderRadiusVariant &&
10736
11162
  "\n border-radius: 40px;\n ";
10737
11163
  });
10738
- var TopTagContainer$2 = newStyled.div(templateObject_2$D || (templateObject_2$D = __makeTemplateObject(["\n position: absolute;\n left: ", ";\n top: ", ";\n"], ["\n position: absolute;\n left: ", ";\n top: ", ";\n"])), function (props) { return (props.borderRadiusVariant ? '50px' : '0'); }, function (props) { return (props.borderRadiusVariant ? '10px' : '0'); });
10739
- var BottomTagContainer$2 = newStyled.div(templateObject_3$s || (templateObject_3$s = __makeTemplateObject(["\n position: absolute;\n bottom: 3.75rem;\n left: 0;\n"], ["\n position: absolute;\n bottom: 3.75rem;\n left: 0;\n"])));
11164
+ var TopTagContainer$2 = newStyled.div(templateObject_2$G || (templateObject_2$G = __makeTemplateObject(["\n position: absolute;\n left: ", ";\n top: ", ";\n"], ["\n position: absolute;\n left: ", ";\n top: ", ";\n"])), function (props) { return (props.borderRadiusVariant ? '50px' : '0'); }, function (props) { return (props.borderRadiusVariant ? '10px' : '0'); });
11165
+ var BottomTagContainer$2 = newStyled.div(templateObject_3$v || (templateObject_3$v = __makeTemplateObject(["\n position: absolute;\n bottom: 3.75rem;\n left: 0;\n"], ["\n position: absolute;\n bottom: 3.75rem;\n left: 0;\n"])));
10740
11166
  var ImageProductWithTags$1 = function (_a) {
10741
11167
  var image = _a.image, topTag = _a.topTag, bottomTag = _a.bottomTag, testId = _a.testId, position = _a.position, borderRadiusVariant = _a.borderRadiusVariant;
10742
- return (jsxs$1(Container$E, __assign$1({ "data-testid": testId, className: "stylefor".concat(position), borderRadiusVariant: borderRadiusVariant }, { children: [jsx$1(InnerImageZoom, { src: image.imageUrl, zoomSrc: image.imageUrl, zoomType: "hover", imgAttributes: {
11168
+ return (jsxs$1(Container$H, __assign$1({ "data-testid": testId, className: "stylefor".concat(position), borderRadiusVariant: borderRadiusVariant }, { children: [jsx$1(InnerImageZoom, { src: image.imageUrl, zoomSrc: image.imageUrl, zoomType: "hover", imgAttributes: {
10743
11169
  alt: image.alt,
10744
11170
  style: { objectFit: 'cover', objectPosition: 'center' },
10745
11171
  }, width: position == 'horizontal' ? 360 : 530, height: position == 'horizontal' ? 480 : 720, hideHint: true }, void 0), jsx$1(TopTagContainer$2, __assign$1({ borderRadiusVariant: borderRadiusVariant }, { children: topTag }), void 0), jsx$1(BottomTagContainer$2, { children: bottomTag }, void 0)] }), void 0));
10746
11172
  };
10747
- var templateObject_1$_, templateObject_2$D, templateObject_3$s;
11173
+ var templateObject_1$11, templateObject_2$G, templateObject_3$v;
10748
11174
 
10749
- var Container$D = newStyled.div(templateObject_1$Z || (templateObject_1$Z = __makeTemplateObject(["\n display: grid;\n grid-template-columns: max-content 1fr;\n grid-column-gap: 20px;\n max-height: 45rem;\n width: fit-content;\n"], ["\n display: grid;\n grid-template-columns: max-content 1fr;\n grid-column-gap: 20px;\n max-height: 45rem;\n width: fit-content;\n"])));
11175
+ var Container$G = newStyled.div(templateObject_1$10 || (templateObject_1$10 = __makeTemplateObject(["\n display: grid;\n grid-template-columns: max-content 1fr;\n grid-column-gap: 20px;\n max-height: 45rem;\n width: fit-content;\n"], ["\n display: grid;\n grid-template-columns: max-content 1fr;\n grid-column-gap: 20px;\n max-height: 45rem;\n width: fit-content;\n"])));
10750
11176
  var ProductGallery = function (_a) {
10751
11177
  var images = _a.images, selectedValue = _a.selectedValue, topTag = _a.topTag, bottomTag = _a.bottomTag, productImageDataTestId = _a.productImageDataTestId, previewListDataTestId = _a.previewListDataTestId, thumbnailPosition = _a.thumbnailPosition, _b = _a.borderRadiusVariant, borderRadiusVariant = _b === void 0 ? false : _b;
10752
11178
  var initialValue = selectedValue && images.includes(selectedValue) ? selectedValue : images[0];
@@ -10754,11 +11180,11 @@ var ProductGallery = function (_a) {
10754
11180
  useEffect(function () {
10755
11181
  setSelectedImage(initialValue);
10756
11182
  }, [initialValue]);
10757
- return (jsxs$1(Container$D, { children: [jsx$1(ImagePreviewList, { images: images, selectedImage: selectedImage, dataTestId: previewListDataTestId, onClick: function (value) {
11183
+ return (jsxs$1(Container$G, { children: [jsx$1(ImagePreviewList, { images: images, selectedImage: selectedImage, dataTestId: previewListDataTestId, onClick: function (value) {
10758
11184
  setSelectedImage(value);
10759
11185
  }, position: thumbnailPosition, borderRadiusVariant: borderRadiusVariant }, void 0), jsx$1(ImageProductWithTags$1, { image: selectedImage, topTag: topTag, bottomTag: bottomTag, testId: productImageDataTestId, position: thumbnailPosition, borderRadiusVariant: borderRadiusVariant }, void 0)] }, void 0));
10760
11186
  };
10761
- var templateObject_1$Z;
11187
+ var templateObject_1$10;
10762
11188
 
10763
11189
  /* base styles & size variants */
10764
11190
  var StarStyles = {
@@ -10804,8 +11230,8 @@ var StarStyles = {
10804
11230
  });
10805
11231
  },
10806
11232
  };
10807
- var Container$C = newStyled.div(templateObject_1$Y || (templateObject_1$Y = __makeTemplateObject(["\n display: flex;\n align-items: center;\n"], ["\n display: flex;\n align-items: center;\n"])));
10808
- var templateObject_1$Y;
11233
+ var Container$F = newStyled.div(templateObject_1$$ || (templateObject_1$$ = __makeTemplateObject(["\n display: flex;\n align-items: center;\n"], ["\n display: flex;\n align-items: center;\n"])));
11234
+ var templateObject_1$$;
10809
11235
 
10810
11236
  var StarContainer = newStyled.div(function (_a) {
10811
11237
  var size = _a.size, theme = _a.theme;
@@ -10823,7 +11249,7 @@ var sizes = {
10823
11249
  var StarList = function (_a) {
10824
11250
  var rating = _a.rating, starsNumber = _a.starsNumber, fill = _a.fill, _b = _a.size, size = _b === void 0 ? ComponentSize.Medium : _b;
10825
11251
  var theme = useTheme();
10826
- return (jsx$1(Container$C, { children: __spreadArray([], new Array(starsNumber), true).map(function (_, index) {
11252
+ return (jsx$1(Container$F, { children: __spreadArray([], new Array(starsNumber), true).map(function (_, index) {
10827
11253
  return (jsx$1(StarContainer, __assign$1({ "data-testid": "star-container", size: size, theme: theme }, { children: index < Math.floor(rating) ? (jsx$1(Icon.PDP.Star, __assign$1({}, sizes[size], { fill: fill }), void 0)) : index === Math.floor(rating) && rating % 1 != 0 ? (jsx$1(Icon.PDP.StarHalf, __assign$1({}, sizes[size], { fill: fill }), void 0)) : (jsx$1(Icon.PDP.StarEmpty, __assign$1({}, sizes[size], { fill: fill }), void 0)) }), index));
10828
11254
  }) }, void 0));
10829
11255
  };
@@ -10867,8 +11293,8 @@ var LabelStyles = {
10867
11293
  });
10868
11294
  },
10869
11295
  };
10870
- var Container$B = newStyled.a(templateObject_1$X || (templateObject_1$X = __makeTemplateObject(["\n display: flex;\n align-items: center;\n"], ["\n display: flex;\n align-items: center;\n"])));
10871
- var templateObject_1$X;
11296
+ var Container$E = newStyled.a(templateObject_1$_ || (templateObject_1$_ = __makeTemplateObject(["\n display: flex;\n align-items: center;\n"], ["\n display: flex;\n align-items: center;\n"])));
11297
+ var templateObject_1$_;
10872
11298
 
10873
11299
  var CustomLabel = newStyled.div(function (_a) {
10874
11300
  var theme = _a.theme, size = _a.size, wrapWithParenthesis = _a.wrapWithParenthesis, underline = _a.underline;
@@ -10906,11 +11332,11 @@ var Rating = function (_a) {
10906
11332
  href: reviewsContainerId,
10907
11333
  }
10908
11334
  : {};
10909
- return (jsxs$1(Container$B, __assign$1({ as: reviewsContainerId ? 'a' : 'div' }, containerAttributes, { "data-testid": "Container", onClick: handleAnchorClick }, { children: [jsx$1(StarList, { rating: rating, size: size, starsNumber: starsNumber, fill: theme.component.stars.element.color }, void 0), jsxs$1(CustomLabel, __assign$1({ theme: theme, size: size, wrapWithParenthesis: wrapWithParenthesis, underline: underline, "data-testid": "CustomLabel" }, { children: [reviews, " ", reviewsText] }), void 0)] }), void 0));
11335
+ return (jsxs$1(Container$E, __assign$1({ as: reviewsContainerId ? 'a' : 'div' }, containerAttributes, { "data-testid": "Container", onClick: handleAnchorClick }, { children: [jsx$1(StarList, { rating: rating, size: size, starsNumber: starsNumber, fill: theme.component.stars.element.color }, void 0), jsxs$1(CustomLabel, __assign$1({ theme: theme, size: size, wrapWithParenthesis: wrapWithParenthesis, underline: underline, "data-testid": "CustomLabel" }, { children: [reviews, " ", reviewsText] }), void 0)] }), void 0));
10910
11336
  };
10911
11337
 
10912
- var Container$A = newStyled.div(templateObject_1$W || (templateObject_1$W = __makeTemplateObject(["\n display: flex;\n align-items: center;\n font-size: 0.88rem;\n"], ["\n display: flex;\n align-items: center;\n font-size: 0.88rem;\n"])));
10913
- var P$2 = newStyled.p(templateObject_2$C || (templateObject_2$C = __makeTemplateObject(["\n margin: 0 0.25rem;\n font-weight: 700;\n color: ", ";\n"], ["\n margin: 0 0.25rem;\n font-weight: 700;\n color: ", ";\n"])), function (props) { return props.theme.colors.shades['550'].color; });
11338
+ var Container$D = newStyled.div(templateObject_1$Z || (templateObject_1$Z = __makeTemplateObject(["\n display: flex;\n align-items: center;\n font-size: 0.88rem;\n"], ["\n display: flex;\n align-items: center;\n font-size: 0.88rem;\n"])));
11339
+ var P$2 = newStyled.p(templateObject_2$F || (templateObject_2$F = __makeTemplateObject(["\n margin: 0 0.25rem;\n font-weight: 700;\n color: ", ";\n"], ["\n margin: 0 0.25rem;\n font-weight: 700;\n color: ", ";\n"])), function (props) { return props.theme.colors.shades['550'].color; });
10914
11340
  var textButtonStyles = function (theme) { return ({
10915
11341
  border: 'none',
10916
11342
  background: 'transparent',
@@ -10923,9 +11349,9 @@ var textButtonStyles = function (theme) { return ({
10923
11349
  var FitPredictor = function (_a) {
10924
11350
  var onClick = _a.onClick;
10925
11351
  var theme = useTheme();
10926
- return (jsxs(Container$A, __assign$1({ theme: theme }, { children: [jsx(Container$A, { children: jsx(Icon.Other.FitPredictor, { width: 1.125, height: 1.125, fill: theme.colors.shades['550'].color }, void 0) }, void 0), jsx(P$2, __assign$1({ theme: theme }, { children: "FIT PREDICTOR" }), void 0), jsx(BaseButton, __assign$1({ css: textButtonStyles(theme), onClick: onClick }, { children: "Calculate your size" }), void 0)] }), void 0));
11352
+ return (jsxs(Container$D, __assign$1({ theme: theme }, { children: [jsx(Container$D, { children: jsx(Icon.Other.FitPredictor, { width: 1.125, height: 1.125, fill: theme.colors.shades['550'].color }, void 0) }, void 0), jsx(P$2, __assign$1({ theme: theme }, { children: "FIT PREDICTOR" }), void 0), jsx(BaseButton, __assign$1({ css: textButtonStyles(theme), onClick: onClick }, { children: "Calculate your size" }), void 0)] }), void 0));
10927
11353
  };
10928
- var templateObject_1$W, templateObject_2$C;
11354
+ var templateObject_1$Z, templateObject_2$F;
10929
11355
 
10930
11356
  var H2$2 = newStyled.h2(function (_a) {
10931
11357
  var color = _a.color;
@@ -10939,7 +11365,7 @@ var H2$2 = newStyled.h2(function (_a) {
10939
11365
  margin: '0.938rem 4.188rem',
10940
11366
  });
10941
11367
  });
10942
- var Bar = newStyled.div(templateObject_1$V || (templateObject_1$V = __makeTemplateObject(["\n @keyframes loading {\n 0% {\n transform: translateX(0);\n }\n to {\n transform: translateX(400%);\n }\n }\n\n height: 0.5rem;\n background-color: ", ";\n width: ", ";\n border-radius: 0.25rem;\n position: absolute;\n left: ", ";\n animation: ", ";\n"], ["\n @keyframes loading {\n 0% {\n transform: translateX(0);\n }\n to {\n transform: translateX(400%);\n }\n }\n\n height: 0.5rem;\n background-color: ", ";\n width: ", ";\n border-radius: 0.25rem;\n position: absolute;\n left: ", ";\n animation: ", ";\n"])), function (_a) {
11368
+ var Bar = newStyled.div(templateObject_1$Y || (templateObject_1$Y = __makeTemplateObject(["\n @keyframes loading {\n 0% {\n transform: translateX(0);\n }\n to {\n transform: translateX(400%);\n }\n }\n\n height: 0.5rem;\n background-color: ", ";\n width: ", ";\n border-radius: 0.25rem;\n position: absolute;\n left: ", ";\n animation: ", ";\n"], ["\n @keyframes loading {\n 0% {\n transform: translateX(0);\n }\n to {\n transform: translateX(400%);\n }\n }\n\n height: 0.5rem;\n background-color: ", ";\n width: ", ";\n border-radius: 0.25rem;\n position: absolute;\n left: ", ";\n animation: ", ";\n"])), function (_a) {
10943
11369
  var backgroundColor = _a.backgroundColor;
10944
11370
  return backgroundColor;
10945
11371
  }, function (_a) {
@@ -10962,7 +11388,7 @@ var Background = newStyled.div(function (_a) {
10962
11388
  position: 'absolute',
10963
11389
  });
10964
11390
  });
10965
- var Container$z = newStyled.div(function (_a) {
11391
+ var Container$C = newStyled.div(function (_a) {
10966
11392
  var widthAuto = _a.widthAuto;
10967
11393
  return ({
10968
11394
  width: widthAuto ? 'auto' : 'fit-content',
@@ -10976,9 +11402,9 @@ var getBarWithBasedOnPercent = function (percent) {
10976
11402
  var ProgressBar = function (_a) {
10977
11403
  var description = _a.description, fillColor = _a.fillColor, _b = _a.widthAuto, widthAuto = _b === void 0 ? true : _b, percent = _a.percent;
10978
11404
  var theme = useTheme();
10979
- return (jsxs$1(Container$z, __assign$1({ "data-testid": "PBContainer", widthAuto: widthAuto }, { children: [jsx$1(Background, __assign$1({ backgroundColor: theme.colors.shades['100'].color }, { children: jsx$1(Bar, { "data-testid": "PBBar", backgroundColor: fillColor, percent: percent }, void 0) }), void 0), description && jsx$1(H2$2, __assign$1({ color: theme.colors.pallete.secondary.color }, { children: description }), void 0)] }), void 0));
11405
+ return (jsxs$1(Container$C, __assign$1({ "data-testid": "PBContainer", widthAuto: widthAuto }, { children: [jsx$1(Background, __assign$1({ backgroundColor: theme.colors.shades['100'].color }, { children: jsx$1(Bar, { "data-testid": "PBBar", backgroundColor: fillColor, percent: percent }, void 0) }), void 0), description && jsx$1(H2$2, __assign$1({ color: theme.colors.pallete.secondary.color }, { children: description }), void 0)] }), void 0));
10980
11406
  };
10981
- var templateObject_1$V;
11407
+ var templateObject_1$Y;
10982
11408
 
10983
11409
  var getStylesBySize$3 = function (size) {
10984
11410
  switch (size) {
@@ -10999,7 +11425,7 @@ var getStylesBySize$3 = function (size) {
10999
11425
  };
11000
11426
  }
11001
11427
  };
11002
- var Container$y = newStyled.div(templateObject_1$U || (templateObject_1$U = __makeTemplateObject(["\n background-color: ", ";\n width: ", ";\n height: ", ";\n border-radius: 50%;\n display: flex;\n justify-content: center;\n align-items: center;\n transition: background-color 0.1s ease;\n\n svg {\n margin: ", ";\n }\n\n &:hover {\n background-color: ", ";\n cursor: pointer;\n }\n\n &.disabled {\n background-color: ", ";\n cursor: not-allowed;\n\n svg path {\n fill: ", ";\n }\n }\n"], ["\n background-color: ", ";\n width: ", ";\n height: ", ";\n border-radius: 50%;\n display: flex;\n justify-content: center;\n align-items: center;\n transition: background-color 0.1s ease;\n\n svg {\n margin: ", ";\n }\n\n &:hover {\n background-color: ", ";\n cursor: pointer;\n }\n\n &.disabled {\n background-color: ", ";\n cursor: not-allowed;\n\n svg path {\n fill: ", ";\n }\n }\n"])), function (_a) {
11428
+ var Container$B = newStyled.div(templateObject_1$X || (templateObject_1$X = __makeTemplateObject(["\n background-color: ", ";\n width: ", ";\n height: ", ";\n border-radius: 50%;\n display: flex;\n justify-content: center;\n align-items: center;\n transition: background-color 0.1s ease;\n\n svg {\n margin: ", ";\n }\n\n &:hover {\n background-color: ", ";\n cursor: pointer;\n }\n\n &.disabled {\n background-color: ", ";\n cursor: not-allowed;\n\n svg path {\n fill: ", ";\n }\n }\n"], ["\n background-color: ", ";\n width: ", ";\n height: ", ";\n border-radius: 50%;\n display: flex;\n justify-content: center;\n align-items: center;\n transition: background-color 0.1s ease;\n\n svg {\n margin: ", ";\n }\n\n &:hover {\n background-color: ", ";\n cursor: pointer;\n }\n\n &.disabled {\n background-color: ", ";\n cursor: not-allowed;\n\n svg path {\n fill: ", ";\n }\n }\n"])), function (_a) {
11003
11429
  var backgroundColor = _a.backgroundColor;
11004
11430
  return backgroundColor;
11005
11431
  }, function (_a) {
@@ -11027,9 +11453,9 @@ var Container$y = newStyled.div(templateObject_1$U || (templateObject_1$U = __ma
11027
11453
  var IconButton = function (_a) {
11028
11454
  var children = _a.children, disabled = _a.disabled, _b = _a.size, size = _b === void 0 ? ComponentSize.Medium : _b, onClick = _a.onClick;
11029
11455
  var theme = useTheme();
11030
- return (jsx$1(Container$y, __assign$1({ className: disabled ? 'disabled' : '', backgroundColor: theme.component.button.primary.active.backgroundColor, hoverBackgroundColor: theme.component.button.secondary.active.backgroundColor, disabledColor: theme.colors.shades['50'].color, disabledIconColor: theme.colors.shades['200'].color, size: size, "data-testid": "Container", onClick: disabled ? function () { } : onClick }, { children: children }), void 0));
11456
+ return (jsx$1(Container$B, __assign$1({ className: disabled ? 'disabled' : '', backgroundColor: theme.component.button.primary.active.backgroundColor, hoverBackgroundColor: theme.component.button.secondary.active.backgroundColor, disabledColor: theme.colors.shades['50'].color, disabledIconColor: theme.colors.shades['200'].color, size: size, "data-testid": "Container", onClick: disabled ? function () { } : onClick }, { children: children }), void 0));
11031
11457
  };
11032
- var templateObject_1$U;
11458
+ var templateObject_1$X;
11033
11459
 
11034
11460
  var TooltipArrow = function (_a) {
11035
11461
  var height = _a.height, width = _a.width, fill = _a.fill, stroke = _a.stroke;
@@ -11109,7 +11535,7 @@ var getTooltipAlignItems = function (position, align) {
11109
11535
  }
11110
11536
  };
11111
11537
 
11112
- var Wrapper$5 = newStyled.div(templateObject_1$T || (templateObject_1$T = __makeTemplateObject(["\n display: flex;\n flex-direction: ", ";\n align-items: center;\n cursor: pointer;\n\n &:hover {\n .tooltip-container {\n visibility: visible;\n opacity: 1;\n }\n }\n"], ["\n display: flex;\n flex-direction: ", ";\n align-items: center;\n cursor: pointer;\n\n &:hover {\n .tooltip-container {\n visibility: visible;\n opacity: 1;\n }\n }\n"])), function (_a) {
11538
+ var Wrapper$5 = newStyled.div(templateObject_1$W || (templateObject_1$W = __makeTemplateObject(["\n display: flex;\n flex-direction: ", ";\n align-items: center;\n cursor: pointer;\n\n &:hover {\n .tooltip-container {\n visibility: visible;\n opacity: 1;\n }\n }\n"], ["\n display: flex;\n flex-direction: ", ";\n align-items: center;\n cursor: pointer;\n\n &:hover {\n .tooltip-container {\n visibility: visible;\n opacity: 1;\n }\n }\n"])), function (_a) {
11113
11539
  var position = _a.position;
11114
11540
  return getWrapperFlexDirection(position);
11115
11541
  });
@@ -11133,11 +11559,11 @@ var TooltipContainer = newStyled.div(function (_a) {
11133
11559
  var getTooltipMargin = function (actual, expected, margin) {
11134
11560
  return actual === expected ? margin : '0';
11135
11561
  };
11136
- var ContentWrapper = newStyled.div(templateObject_2$B || (templateObject_2$B = __makeTemplateObject(["\n border: 0.063rem solid ", ";\n padding: 0.563rem 0.75rem;\n border-radius: 0.5rem;\n background-color: #fff;\n"], ["\n border: 0.063rem solid ", ";\n padding: 0.563rem 0.75rem;\n border-radius: 0.5rem;\n background-color: #fff;\n"])), function (_a) {
11562
+ var ContentWrapper = newStyled.div(templateObject_2$E || (templateObject_2$E = __makeTemplateObject(["\n border: 0.063rem solid ", ";\n padding: 0.563rem 0.75rem;\n border-radius: 0.5rem;\n background-color: #fff;\n"], ["\n border: 0.063rem solid ", ";\n padding: 0.563rem 0.75rem;\n border-radius: 0.5rem;\n background-color: #fff;\n"])), function (_a) {
11137
11563
  var borderColor = _a.borderColor;
11138
11564
  return borderColor;
11139
11565
  });
11140
- var TooltipArrowContainer = newStyled.div(templateObject_3$r || (templateObject_3$r = __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) {
11566
+ var TooltipArrowContainer = newStyled.div(templateObject_3$u || (templateObject_3$u = __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) {
11141
11567
  var position = _a.position;
11142
11568
  return getArrowRotation(position);
11143
11569
  }, function (_a) {
@@ -11151,13 +11577,13 @@ var TooltipText = newStyled.div(templateObject_4$k || (templateObject_4$k = __ma
11151
11577
  var color = _a.color;
11152
11578
  return color;
11153
11579
  });
11154
- var TopSection = newStyled.div(templateObject_5$b || (templateObject_5$b = __makeTemplateObject(["\n display: flex;\n align-items: center;\n justify-content: center;\n margin-bottom: 0.688rem;\n"], ["\n display: flex;\n align-items: center;\n justify-content: center;\n margin-bottom: 0.688rem;\n"])));
11580
+ var TopSection = newStyled.div(templateObject_5$c || (templateObject_5$c = __makeTemplateObject(["\n display: flex;\n align-items: center;\n justify-content: center;\n margin-bottom: 0.688rem;\n"], ["\n display: flex;\n align-items: center;\n justify-content: center;\n margin-bottom: 0.688rem;\n"])));
11155
11581
  var Title$6 = newStyled.h1(templateObject_6$7 || (templateObject_6$7 = __makeTemplateObject(["\n font-size: 0.875rem;\n font-weight: 600;\n line-height: 1.375rem;\n margin: 0;\n color: ", ";\n"], ["\n font-size: 0.875rem;\n font-weight: 600;\n line-height: 1.375rem;\n margin: 0;\n color: ", ";\n"])), function (_a) {
11156
11582
  var color = _a.color;
11157
11583
  return color;
11158
11584
  });
11159
11585
  var IconContainer$5 = newStyled.div(templateObject_7$4 || (templateObject_7$4 = __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"])));
11160
- var templateObject_1$T, templateObject_2$B, templateObject_3$r, templateObject_4$k, templateObject_5$b, templateObject_6$7, templateObject_7$4;
11586
+ var templateObject_1$W, templateObject_2$E, templateObject_3$u, templateObject_4$k, templateObject_5$c, templateObject_6$7, templateObject_7$4;
11161
11587
 
11162
11588
  var Tooltip = function (_a) {
11163
11589
  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;
@@ -11315,9 +11741,9 @@ var ContainerStyles = {
11315
11741
  },
11316
11742
  };
11317
11743
 
11318
- var Wrapper$4 = newStyled.div(templateObject_1$S || (templateObject_1$S = __makeTemplateObject(["\n display: flex;\n align-items: center;\n"], ["\n display: flex;\n align-items: center;\n"])));
11319
- var Container$x = newStyled.div(__assign$1({}, ContainerStyles.baseStyles), function (props) { return [ContainerStyles[props.size](props.theme)]; });
11320
- var Input$2 = newStyled.input(templateObject_2$A || (templateObject_2$A = __makeTemplateObject(["\n position: absolute;\n opacity: 0;\n cursor: ", ";\n height: 100%;\n width: 100%;\n margin: 0;\n"], ["\n position: absolute;\n opacity: 0;\n cursor: ", ";\n height: 100%;\n width: 100%;\n margin: 0;\n"])), function (_a) {
11744
+ var Wrapper$4 = newStyled.div(templateObject_1$V || (templateObject_1$V = __makeTemplateObject(["\n display: flex;\n align-items: center;\n"], ["\n display: flex;\n align-items: center;\n"])));
11745
+ var Container$A = newStyled.div(__assign$1({}, ContainerStyles.baseStyles), function (props) { return [ContainerStyles[props.size](props.theme)]; });
11746
+ var Input$2 = newStyled.input(templateObject_2$D || (templateObject_2$D = __makeTemplateObject(["\n position: absolute;\n opacity: 0;\n cursor: ", ";\n height: 100%;\n width: 100%;\n margin: 0;\n"], ["\n position: absolute;\n opacity: 0;\n cursor: ", ";\n height: 100%;\n width: 100%;\n margin: 0;\n"])), function (_a) {
11321
11747
  var disabled = _a.disabled;
11322
11748
  return (disabled ? 'not-allowed' : 'pointer');
11323
11749
  });
@@ -11332,9 +11758,9 @@ var RadioInput = function (_a) {
11332
11758
  var value = event.currentTarget.value;
11333
11759
  onChange({ value: value, label: label });
11334
11760
  };
11335
- return (jsxs$1(Wrapper$4, { children: [jsxs$1(Container$x, __assign$1({ theme: theme, size: size, "data-testid": "container" }, { children: [jsx$1(Input$2, { id: "".concat(name, "-").concat(id), type: "radio", name: name, value: value, checked: checked, onChange: function (e) { return (disabled ? null : handleChange(e, label)); }, disabled: disabled }, void 0), jsx$1(CustomRadio, { size: size, isChecked: checked, disabled: disabled, theme: theme, "data-testid": "custom-radio" }, void 0)] }), void 0), jsx$1(Label$3, __assign$1({ htmlFor: "".concat(name, "-").concat(id), "data-testid": "label", variant: "regular", size: size, disabled: disabled }, { children: label }), void 0)] }, void 0));
11761
+ return (jsxs$1(Wrapper$4, { children: [jsxs$1(Container$A, __assign$1({ theme: theme, size: size, "data-testid": "container" }, { children: [jsx$1(Input$2, { id: "".concat(name, "-").concat(id), type: "radio", name: name, value: value, checked: checked, onChange: function (e) { return (disabled ? null : handleChange(e, label)); }, disabled: disabled }, void 0), jsx$1(CustomRadio, { size: size, isChecked: checked, disabled: disabled, theme: theme, "data-testid": "custom-radio" }, void 0)] }), void 0), jsx$1(Label$3, __assign$1({ htmlFor: "".concat(name, "-").concat(id), "data-testid": "label", variant: "regular", size: size, disabled: disabled }, { children: label }), void 0)] }, void 0));
11336
11762
  };
11337
- var templateObject_1$S, templateObject_2$A;
11763
+ var templateObject_1$V, templateObject_2$D;
11338
11764
 
11339
11765
  var RadioGroupInput = function (_a) {
11340
11766
  var name = _a.name, _b = _a.options, options = _b === void 0 ? [] : _b, value = _a.value, onChange = _a.onChange, _c = _a.size, size = _c === void 0 ? ComponentSize.Medium : _c, _d = _a.disabled, disabled = _d === void 0 ? false : _d;
@@ -11348,37 +11774,37 @@ var RadioGroupInput = function (_a) {
11348
11774
  }) }), void 0));
11349
11775
  };
11350
11776
 
11351
- var Wrapper$3 = newStyled.div(templateObject_1$R || (templateObject_1$R = __makeTemplateObject(["\n padding: 12px 58px;\n @media (max-width: 768px) {\n padding: 0.625rem 1.5rem;\n }\n"], ["\n padding: 12px 58px;\n @media (max-width: 768px) {\n padding: 0.625rem 1.5rem;\n }\n"])));
11352
- var Container$w = newStyled.div(templateObject_2$z || (templateObject_2$z = __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"])));
11777
+ var Wrapper$3 = newStyled.div(templateObject_1$U || (templateObject_1$U = __makeTemplateObject(["\n padding: 12px 58px;\n @media (max-width: 768px) {\n padding: 0.625rem 1.5rem;\n }\n"], ["\n padding: 12px 58px;\n @media (max-width: 768px) {\n padding: 0.625rem 1.5rem;\n }\n"])));
11778
+ var Container$z = newStyled.div(templateObject_2$C || (templateObject_2$C = __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"])));
11353
11779
  var Minimalistic = function (_a) {
11354
11780
  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;
11355
11781
  var theme = useTheme();
11356
- 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$w, __assign$1({ "data-testid": "".concat(testId, "-section") }, { children: [jsx$1(Text$6, __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$w, __assign$1({ "data-testid": "".concat(testId, "-section-bottom") }, { children: [jsxs$1(Text$6, __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$6, __assign$1({ variant: "body", weight: "regular", size: "small" }, { children: [youAreSavingText, ": ", savingPrice] }), void 0)] }), void 0)] }, void 0) }), void 0));
11782
+ 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$z, __assign$1({ "data-testid": "".concat(testId, "-section") }, { children: [jsx$1(Text$6, __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$z, __assign$1({ "data-testid": "".concat(testId, "-section-bottom") }, { children: [jsxs$1(Text$6, __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$6, __assign$1({ variant: "body", weight: "regular", size: "small" }, { children: [youAreSavingText, ": ", savingPrice] }), void 0)] }), void 0)] }, void 0) }), void 0));
11357
11783
  };
11358
- var templateObject_1$R, templateObject_2$z;
11784
+ var templateObject_1$U, templateObject_2$C;
11359
11785
 
11360
- var Container$v = newStyled.div(templateObject_1$Q || (templateObject_1$Q = __makeTemplateObject(["\n padding: 0.625rem 1.5rem;\n"], ["\n padding: 0.625rem 1.5rem;\n"])));
11361
- var Title$5 = newStyled.h1(templateObject_2$y || (templateObject_2$y = __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; });
11362
- var Details$1 = newStyled.span(templateObject_3$q || (templateObject_3$q = __makeTemplateObject(["\n display: flex;\n align-items: center;\n font-weight: 400;\n font-size: 1rem;\n margin: 0;\n line-height: 1.5rem;\n justify-content: center;\n color: ", ";\n"], ["\n display: flex;\n align-items: center;\n font-weight: 400;\n font-size: 1rem;\n margin: 0;\n line-height: 1.5rem;\n justify-content: center;\n color: ", ";\n"])), function (props) { return props.color; });
11786
+ var Container$y = newStyled.div(templateObject_1$T || (templateObject_1$T = __makeTemplateObject(["\n padding: 0.625rem 1.5rem;\n"], ["\n padding: 0.625rem 1.5rem;\n"])));
11787
+ var Title$5 = newStyled.h1(templateObject_2$B || (templateObject_2$B = __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; });
11788
+ var Details$1 = newStyled.span(templateObject_3$t || (templateObject_3$t = __makeTemplateObject(["\n display: flex;\n align-items: center;\n font-weight: 400;\n font-size: 1rem;\n margin: 0;\n line-height: 1.5rem;\n justify-content: center;\n color: ", ";\n"], ["\n display: flex;\n align-items: center;\n font-weight: 400;\n font-size: 1rem;\n margin: 0;\n line-height: 1.5rem;\n justify-content: center;\n color: ", ";\n"])), function (props) { return props.color; });
11363
11789
  var PriceContainer$1 = newStyled.span(templateObject_4$j || (templateObject_4$j = __makeTemplateObject(["\n margin: 0 0.313rem;\n display: flex;\n align-items: center;\n"], ["\n margin: 0 0.313rem;\n display: flex;\n align-items: center;\n"])));
11364
11790
  var Simple = function (_a) {
11365
11791
  var title = _a.title, freeShippingText = _a.freeShippingText, price = _a.price, anyQtyForText = _a.anyQtyForText, backgroundColor = _a.backgroundColor, _b = _a.widthAuto, widthAuto = _b === void 0 ? false : _b;
11366
11792
  var theme = useTheme();
11367
- return (jsx$1(Card$2, __assign$1({ backgroundColor: backgroundColor, widthAuto: widthAuto }, { children: jsxs$1(Container$v, { children: [jsx$1(Title$5, __assign$1({ color: theme.colors.pallete.secondary.color, "data-testid": "Title" }, { children: title }), void 0), jsxs$1(Details$1, __assign$1({ color: theme.colors.pallete.secondary.color, "data-testid": "Details" }, { children: [anyQtyForText, jsx$1(PriceContainer$1, __assign$1({ "data-testid": "Price" }, { children: jsx$1(PriceLabel, { finalPrice: price, color: "#d3373c", size: ComponentSize.Small }, void 0) }), void 0), "+ ", freeShippingText] }), void 0)] }, void 0) }), void 0));
11793
+ return (jsx$1(Card$2, __assign$1({ backgroundColor: backgroundColor, widthAuto: widthAuto }, { children: jsxs$1(Container$y, { children: [jsx$1(Title$5, __assign$1({ color: theme.colors.pallete.secondary.color, "data-testid": "Title" }, { children: title }), void 0), jsxs$1(Details$1, __assign$1({ color: theme.colors.pallete.secondary.color, "data-testid": "Details" }, { children: [anyQtyForText, jsx$1(PriceContainer$1, __assign$1({ "data-testid": "Price" }, { children: jsx$1(PriceLabel, { finalPrice: price, color: "#d3373c", size: ComponentSize.Small }, void 0) }), void 0), "+ ", freeShippingText] }), void 0)] }, void 0) }), void 0));
11368
11794
  };
11369
- var templateObject_1$Q, templateObject_2$y, templateObject_3$q, templateObject_4$j;
11795
+ var templateObject_1$T, templateObject_2$B, templateObject_3$t, templateObject_4$j;
11370
11796
 
11371
11797
  var Bundle = {
11372
11798
  Minimalistic: Minimalistic,
11373
11799
  Simple: Simple,
11374
11800
  };
11375
11801
 
11376
- var Container$u = newStyled.div(templateObject_1$P || (templateObject_1$P = __makeTemplateObject(["\n display: flex;\n align-items: center;\n justify-content: center;\n width: fit-content;\n"], ["\n display: flex;\n align-items: center;\n justify-content: center;\n width: fit-content;\n"])));
11802
+ var Container$x = newStyled.div(templateObject_1$S || (templateObject_1$S = __makeTemplateObject(["\n display: flex;\n align-items: center;\n justify-content: center;\n width: fit-content;\n"], ["\n display: flex;\n align-items: center;\n justify-content: center;\n width: fit-content;\n"])));
11377
11803
  var Tag$1 = function (_a) {
11378
11804
  var text = _a.text, className = _a.className;
11379
- return jsx$1(Container$u, __assign$1({ className: className }, { children: text }), void 0);
11805
+ return jsx$1(Container$x, __assign$1({ className: className }, { children: text }), void 0);
11380
11806
  };
11381
- var templateObject_1$P;
11807
+ var templateObject_1$S;
11382
11808
 
11383
11809
  var getStylesBySize$2 = function (size, styledBorder) {
11384
11810
  switch (size) {
@@ -11481,11 +11907,11 @@ var Timer = function (_a) {
11481
11907
  return (jsxs$1("div", __assign$1({ "data-testid": "Time" }, { children: [(hours || displayZeroValues) && "".concat(hours, "h "), (minutes || displayZeroValues) && "".concat(minutes, "m "), seconds, "s"] }), void 0));
11482
11908
  };
11483
11909
 
11484
- var Label$1 = newStyled.span(templateObject_1$O || (templateObject_1$O = __makeTemplateObject(["\n font-weight: 600;\n color: ", ";\n font-size: 1.125rem;\n line-height: 1.75rem;\n"], ["\n font-weight: 600;\n color: ", ";\n font-size: 1.125rem;\n line-height: 1.75rem;\n"])), function (_a) {
11910
+ var Label$1 = newStyled.span(templateObject_1$R || (templateObject_1$R = __makeTemplateObject(["\n font-weight: 600;\n color: ", ";\n font-size: 1.125rem;\n line-height: 1.75rem;\n"], ["\n font-weight: 600;\n color: ", ";\n font-size: 1.125rem;\n line-height: 1.75rem;\n"])), function (_a) {
11485
11911
  var color = _a.color;
11486
11912
  return color;
11487
11913
  });
11488
- var MandatoryIcon = newStyled.span(templateObject_2$x || (templateObject_2$x = __makeTemplateObject(["\n color: ", ";\n margin-left: 0.25rem;\n"], ["\n color: ", ";\n margin-left: 0.25rem;\n"])), function (_a) {
11914
+ var MandatoryIcon = newStyled.span(templateObject_2$A || (templateObject_2$A = __makeTemplateObject(["\n color: ", ";\n margin-left: 0.25rem;\n"], ["\n color: ", ";\n margin-left: 0.25rem;\n"])), function (_a) {
11489
11915
  var color = _a.color;
11490
11916
  return color;
11491
11917
  });
@@ -11494,7 +11920,7 @@ var InputLabel = function (_a) {
11494
11920
  var theme = useTheme();
11495
11921
  return (jsxs$1(Label$1, __assign$1({ color: isDisabled ? theme.colors.shades['250'].color : theme.colors.shades['700'].color }, { children: [label, isRequired && jsx$1(MandatoryIcon, __assign$1({ color: theme.colors.semantic.urgent.color }, { children: "*" }), void 0)] }), void 0));
11496
11922
  };
11497
- var templateObject_1$O, templateObject_2$x;
11923
+ var templateObject_1$R, templateObject_2$A;
11498
11924
 
11499
11925
  /**
11500
11926
  * @returns number formatted with "," and 2 decimals as string
@@ -11548,99 +11974,94 @@ var formatPrice = function (value, _a) {
11548
11974
  }).format(valueToFormat);
11549
11975
  };
11550
11976
 
11551
- var ErrorText = newStyled.h3(templateObject_1$N || (templateObject_1$N = __makeTemplateObject(["\n color: ", " !important;\n font-size: 0.75rem;\n font-weight: 600;\n margin: 0;\n font-height: 1rem;\n margin-left: 0.313rem;\n"], ["\n color: ", " !important;\n font-size: 0.75rem;\n font-weight: 600;\n margin: 0;\n font-height: 1rem;\n margin-left: 0.313rem;\n"])), function (props) { return props.color; });
11552
- var ErrorContainer = newStyled.div(templateObject_2$w || (templateObject_2$w = __makeTemplateObject(["\n display: flex;\n align-items: center;\n margin-top: 12px;\n"], ["\n display: flex;\n align-items: center;\n margin-top: 12px;\n"])));
11977
+ var ErrorText = newStyled.h3(templateObject_1$Q || (templateObject_1$Q = __makeTemplateObject(["\n color: ", " !important;\n font-size: 0.75rem;\n font-weight: 600;\n margin: 0;\n font-height: 1rem;\n margin-left: 0.313rem;\n"], ["\n color: ", " !important;\n font-size: 0.75rem;\n font-weight: 600;\n margin: 0;\n font-height: 1rem;\n margin-left: 0.313rem;\n"])), function (props) { return props.color; });
11978
+ var ErrorContainer = newStyled.div(templateObject_2$z || (templateObject_2$z = __makeTemplateObject(["\n display: flex;\n align-items: center;\n margin-top: 12px;\n"], ["\n display: flex;\n align-items: center;\n margin-top: 12px;\n"])));
11553
11979
  var Error$1 = function (_a) {
11554
11980
  var error = _a.error;
11555
11981
  var theme = useTheme();
11556
11982
  return (jsxs$1(ErrorContainer, { children: [jsx$1(Icon.Actions.LightExclamation, { fill: theme.colors.semantic.urgent.color, width: 0.875, height: 0.875 }, void 0), jsx$1(ErrorText, __assign$1({ color: theme.colors.semantic.urgent.color }, { children: error }), void 0)] }, void 0));
11557
11983
  };
11558
- var templateObject_1$N, templateObject_2$w;
11559
-
11560
- var Container$t = newStyled.div(templateObject_1$M || (templateObject_1$M = __makeTemplateObject(["\n position: relative;\n input {\n border-color: ", ";\n }\n"], ["\n position: relative;\n input {\n border-color: ", ";\n }\n"])), function (_a) {
11561
- var color = _a.color, hasError = _a.hasError;
11562
- return (!hasError ? color : '');
11984
+ var templateObject_1$Q, templateObject_2$z;
11985
+
11986
+ var containerByStatus = function (theme, status) {
11987
+ if (status === InputValidationType.Valid)
11988
+ return theme.colors.shades[700].color;
11989
+ if (status === InputValidationType.Error)
11990
+ return theme.colors.semantic.urgent.color;
11991
+ return '';
11992
+ };
11993
+ var Container$w = newStyled.div(templateObject_1$P || (templateObject_1$P = __makeTemplateObject(["\n position: relative;\n input {\n border-color: ", ";\n }\n"], ["\n position: relative;\n input {\n border-color: ", ";\n }\n"])), function (_a) {
11994
+ var theme = _a.theme, status = _a.status, hasError = _a.hasError;
11995
+ return hasError ? '' : containerByStatus(theme, status);
11563
11996
  });
11564
- var StyledInput = newStyled.input(templateObject_2$v || (templateObject_2$v = __makeTemplateObject(["\n padding: ", ";\n font-size: ", ";\n border-radius: ", ";\n border: ", ";\n line-height: ", ";\n color: ", ";\n font-weight: ", ";\n flex: 1 1 50%;\n height: 100%;\n width: 100%;\n box-sizing: border-box;\n\n &::placeholder {\n color: ", ";\n }\n\n &:focus {\n outline: none;\n border-color: ", ";\n ", ";\n box-shadow: ", ";\n\n ", ";\n }\n\n &:disabled {\n background-color: ", ";\n border: 0.063rem solid ", ";\n color: ", ";\n\n &::placeholder {\n color: ", ";\n }\n }\n\n ", ";\n"], ["\n padding: ", ";\n font-size: ", ";\n border-radius: ", ";\n border: ", ";\n line-height: ", ";\n color: ", ";\n font-weight: ", ";\n flex: 1 1 50%;\n height: 100%;\n width: 100%;\n box-sizing: border-box;\n\n &::placeholder {\n color: ", ";\n }\n\n &:focus {\n outline: none;\n border-color: ", ";\n ", ";\n box-shadow: ", ";\n\n ", ";\n }\n\n &:disabled {\n background-color: ", ";\n border: 0.063rem solid ", ";\n color: ", ";\n\n &::placeholder {\n color: ", ";\n }\n }\n\n ", ";\n"])), function (_a) {
11565
- var padding = _a.padding;
11566
- return padding;
11997
+ var StyledInput = newStyled.input(templateObject_2$y || (templateObject_2$y = __makeTemplateObject(["\n padding: ", ";\n font-size: ", ";\n border-radius: ", ";\n border: ", ";\n line-height: ", ";\n color: ", ";\n font-weight: ", ";\n flex: 1 1 50%;\n height: 100%;\n width: 100%;\n box-sizing: border-box;\n\n &::placeholder {\n color: ", ";\n }\n\n &:focus {\n outline: none;\n border-color: ", ";\n ", ";\n box-shadow: ", ";\n\n ", ";\n }\n\n &:disabled {\n background-color: ", ";\n border: 0.063rem solid ", ";\n color: ", ";\n\n &::placeholder {\n color: ", ";\n }\n }\n\n ", ";\n"], ["\n padding: ", ";\n font-size: ", ";\n border-radius: ", ";\n border: ", ";\n line-height: ", ";\n color: ", ";\n font-weight: ", ";\n flex: 1 1 50%;\n height: 100%;\n width: 100%;\n box-sizing: border-box;\n\n &::placeholder {\n color: ", ";\n }\n\n &:focus {\n outline: none;\n border-color: ", ";\n ", ";\n box-shadow: ", ";\n\n ", ";\n }\n\n &:disabled {\n background-color: ", ";\n border: 0.063rem solid ", ";\n color: ", ";\n\n &::placeholder {\n color: ", ";\n }\n }\n\n ", ";\n"])), function (_a) {
11998
+ var inlinePlaceholder = _a.inlinePlaceholder, theme = _a.theme;
11999
+ return theme.component[inlinePlaceholder ? 'inputPlaceholder' : 'input'].padding;
11567
12000
  }, function (_a) {
11568
- var fontSize = _a.fontSize;
11569
- return fontSize;
12001
+ var theme = _a.theme;
12002
+ return theme.component.input.fontSize;
11570
12003
  }, function (_a) {
11571
- var borderRadius = _a.borderRadius;
11572
- return borderRadius;
12004
+ var theme = _a.theme;
12005
+ return theme.component.input.borderRadius;
11573
12006
  }, function (_a) {
11574
- var border = _a.border, hasError = _a.hasError;
11575
- return (hasError ? hasError : border);
12007
+ var theme = _a.theme, hasError = _a.hasError;
12008
+ return theme.component.input[hasError ? 'errorBorder' : 'border'];
11576
12009
  }, function (_a) {
11577
- var lineHeight = _a.lineHeight;
11578
- return lineHeight;
12010
+ var theme = _a.theme;
12011
+ return theme.component.input.lineHeight;
11579
12012
  }, function (_a) {
11580
- var color = _a.color;
11581
- return color;
12013
+ var theme = _a.theme;
12014
+ return theme.component.input.color;
11582
12015
  }, function (_a) {
11583
- var fontWeight = _a.fontWeight;
11584
- return fontWeight;
12016
+ var theme = _a.theme;
12017
+ return theme.component.input.fontWeight;
11585
12018
  }, function (_a) {
11586
- var placeholderColor = _a.placeholderColor;
11587
- return placeholderColor;
12019
+ var theme = _a.theme;
12020
+ return theme.component.input.placeholderColor;
11588
12021
  }, function (_a) {
11589
- var highlight = _a.highlight, hasError = _a.hasError;
11590
- return (!hasError ? highlight : '');
12022
+ var theme = _a.theme, hasError = _a.hasError;
12023
+ return (hasError ? '' : theme.colors.border.highlight);
11591
12024
  }, function (_a) {
11592
- var focusBorder = _a.focusBorder, hasError = _a.hasError;
11593
- return (focusBorder && !hasError ? "border: ".concat(focusBorder) : '');
12025
+ var inlinePlaceholder = _a.inlinePlaceholder, hasError = _a.hasError, theme = _a.theme;
12026
+ return inlinePlaceholder && !hasError && "border: ".concat(theme.component.inputPlaceholder.focusBorder);
11594
12027
  }, function (_a) {
11595
- var boxShadow = _a.boxShadow;
11596
- return boxShadow;
12028
+ var theme = _a.theme;
12029
+ return theme.component.input.boxShadow;
11597
12030
  }, function (_a) {
11598
12031
  var inlinePlaceholder = _a.inlinePlaceholder;
11599
12032
  return inlinePlaceholder
11600
12033
  ? "& ~ span {\n bottom: 1.625rem;\n font-size: 0.75rem;\n opacity: 1;\n }"
11601
12034
  : '';
11602
12035
  }, function (_a) {
11603
- var disabledBackgroundColor = _a.disabledBackgroundColor;
11604
- return disabledBackgroundColor;
12036
+ var theme = _a.theme;
12037
+ return theme.colors.background.disabled;
11605
12038
  }, function (_a) {
11606
- var disabledBackgroundColor = _a.disabledBackgroundColor;
11607
- return disabledBackgroundColor;
12039
+ var theme = _a.theme;
12040
+ return theme.colors.background.disabled;
11608
12041
  }, function (_a) {
11609
- var disabledColor = _a.disabledColor;
11610
- return disabledColor;
12042
+ var theme = _a.theme;
12043
+ return theme.colors.text.disabled;
11611
12044
  }, function (_a) {
11612
- var disabledColor = _a.disabledColor;
11613
- return disabledColor;
12045
+ var theme = _a.theme;
12046
+ return theme.colors.text.disabled;
11614
12047
  }, function (_a) {
11615
- var internalValue = _a.internalValue;
11616
- return internalValue
11617
- ? "& ~ span {\n bottom: 1.625rem;\n font-size: 0.75rem;\n opacity: 1;\n }"
11618
- : '';
12048
+ var hasValue = _a.hasValue;
12049
+ return hasValue &&
12050
+ "& ~ span {\n bottom: 1.625rem;\n font-size: 0.75rem;\n opacity: 1;\n }";
11619
12051
  });
11620
- var InputWrapper = newStyled.div(templateObject_3$p || (templateObject_3$p = __makeTemplateObject(["\n position: relative;\n display: flex;\n height: ", ";\n"], ["\n position: relative;\n display: flex;\n height: ", ";\n"])), function (_a) {
12052
+ var InputWrapper = newStyled.div(templateObject_3$s || (templateObject_3$s = __makeTemplateObject(["\n position: relative;\n display: flex;\n height: ", ";\n"], ["\n position: relative;\n display: flex;\n height: ", ";\n"])), function (_a) {
11621
12053
  var size = _a.size, inlinePlaceholder = _a.inlinePlaceholder;
11622
12054
  return !inlinePlaceholder ? (size === 'small' ? '36px' : '40px') : '48px';
11623
12055
  });
11624
12056
  var AnimatedPlaceholder = newStyled.span(templateObject_4$i || (templateObject_4$i = __makeTemplateObject(["\n color: #8b8b8b;\n font-weight: 400;\n left: 0.9375rem;\n bottom: 0.9375rem;\n transition: all 0.2s ease;\n position: absolute;\n pointer-events: none;\n font-size: 0.875rem;\n"], ["\n color: #8b8b8b;\n font-weight: 400;\n left: 0.9375rem;\n bottom: 0.9375rem;\n transition: all 0.2s ease;\n position: absolute;\n pointer-events: none;\n font-size: 0.875rem;\n"])));
11625
- var ClearInput = newStyled.div(templateObject_5$a || (templateObject_5$a = __makeTemplateObject(["\n right: 0.75rem;\n top: 1rem;\n position: absolute;\n cursor: pointer;\n"], ["\n right: 0.75rem;\n top: 1rem;\n position: absolute;\n cursor: pointer;\n"])));
11626
- var templateObject_1$M, templateObject_2$v, templateObject_3$p, templateObject_4$i, templateObject_5$a;
12057
+ var ClearInput = newStyled.div(templateObject_5$b || (templateObject_5$b = __makeTemplateObject(["\n right: 0.75rem;\n top: 1rem;\n position: absolute;\n cursor: pointer;\n"], ["\n right: 0.75rem;\n top: 1rem;\n position: absolute;\n cursor: pointer;\n"])));
12058
+ var templateObject_1$P, templateObject_2$y, templateObject_3$s, templateObject_4$i, templateObject_5$b;
11627
12059
 
11628
12060
  var BaseInput = function (_a) {
11629
- var _b;
11630
- var value = _a.value, onChange = _a.onChange, _c = _a.defaultValue, defaultValue = _c === void 0 ? '' : _c, label = _a.label, children = _a.children, required = _a.required, onValidation = _a.onValidation, size = _a.size, placeholder = _a.placeholder, inlinePlaceholder = _a.inlinePlaceholder, hasError = _a.hasError, _d = _a.inputType, inputType = _d === void 0 ? 'text' : _d, hideClear = _a.hideClear, innerRef = _a.innerRef, rest = __rest(_a, ["value", "onChange", "defaultValue", "label", "children", "required", "onValidation", "size", "placeholder", "inlinePlaceholder", "hasError", "inputType", "hideClear", "innerRef"]);
12061
+ var value = _a.value, _b = _a.onChange, onChange = _b === void 0 ? function () { } : _b, label = _a.label, children = _a.children, required = _a.required, onValidation = _a.onValidation, size = _a.size, placeholder = _a.placeholder, inlinePlaceholder = _a.inlinePlaceholder, hasError = _a.hasError, _c = _a.inputType, inputType = _c === void 0 ? 'text' : _c, hideClear = _a.hideClear, innerRef = _a.innerRef, rest = __rest(_a, ["value", "onChange", "label", "children", "required", "onValidation", "size", "placeholder", "inlinePlaceholder", "hasError", "inputType", "hideClear", "innerRef"]);
11631
12062
  var theme = useTheme();
11632
- var _e = useState((_b = value !== null && value !== void 0 ? value : defaultValue) !== null && _b !== void 0 ? _b : ''), internalValue = _e[0], setInternalValue = _e[1];
11633
- var _f = useState(InputValidationType.Empty), status = _f[0], setStatus = _f[1];
11634
- var handleChange = function (_a) {
11635
- var target = _a.target;
11636
- if (onChange) {
11637
- onChange(target.value);
11638
- }
11639
- if (value == null) {
11640
- setInternalValue(target.value);
11641
- }
11642
- };
11643
- var validate = function (_a) {
12063
+ var _d = useState(InputValidationType.Empty), status = _d[0], setStatus = _d[1];
12064
+ var onBlur = function (_a) {
11644
12065
  var value = _a.target.value;
11645
12066
  var status = InputValidationType.Valid;
11646
12067
  if (required && isEmpty(value)) {
@@ -11652,48 +12073,15 @@ var BaseInput = function (_a) {
11652
12073
  setStatus(status);
11653
12074
  };
11654
12075
  useEffect(function () {
11655
- if (value == null) {
11656
- return;
11657
- }
11658
- setInternalValue(value);
11659
- }, [value]);
11660
- useEffect(function () {
11661
- if (onValidation != null) {
12076
+ if (onValidation)
11662
12077
  onValidation(status);
11663
- }
11664
- }, [onValidation, status]);
11665
- var styling = {
11666
- border: theme.component.input.border,
11667
- borderRadius: theme.component.input.borderRadius,
11668
- color: theme.component.input.color,
11669
- placeholderColor: theme.component.input.placeholderColor,
11670
- disabledBackgroundColor: theme.colors.background.disabled,
11671
- disabledColor: theme.colors.text.disabled,
11672
- fontFamily: theme.fonts.config[0].family,
11673
- fontSize: inlinePlaceholder
11674
- ? theme.component.inputPlaceholder.fontSize
11675
- : theme.component.input.fontSize,
11676
- fontWeight: theme.component.input.fontWeight,
11677
- padding: inlinePlaceholder
11678
- ? theme.component.inputPlaceholder.padding
11679
- : theme.component.input.padding,
11680
- lineHeight: theme.component.input.lineHeight,
11681
- highlight: theme.colors.border.highlight,
11682
- boxShadow: theme.component.input.boxShadow,
11683
- internalValue: internalValue,
11684
- inlinePlaceholder: inlinePlaceholder,
11685
- focusBorder: inlinePlaceholder ? theme.component.inputPlaceholder.focusBorder : '',
11686
- hasError: hasError ? theme.component.input.errorBorder : '',
11687
- };
11688
- return (jsxs$1(Container$t, __assign$1({ color: status === InputValidationType.Valid
11689
- ? theme.colors.shades['700'].color
11690
- : status === InputValidationType.Error
11691
- ? theme.colors.semantic.urgent.color
11692
- : '', hasError: hasError }, { children: [label && (jsx$1(InputLabel, { label: label, isDisabled: rest.disabled, isRequired: Boolean(required) }, void 0)), jsxs$1(InputWrapper, __assign$1({ className: "inputWrapper", size: size, inlinePlaceholder: inlinePlaceholder }, { children: [jsx$1(StyledInput, __assign$1({ ref: innerRef, "data-testid": "base-input", type: inputType, onChange: handleChange, onBlur: validate, required: Boolean(required), value: internalValue, placeholder: inlinePlaceholder ? '' : placeholder }, rest, styling), void 0), inlinePlaceholder && (jsx$1(AnimatedPlaceholder, __assign$1({ "data-testid": "input-placeholder" }, { children: placeholder }), void 0)), children] }), void 0), !hideClear && !rest.disabled && inlinePlaceholder && internalValue && (jsx$1(ClearInput, __assign$1({ onClick: function () {
11693
- if (onChange) {
11694
- onChange('');
11695
- }
11696
- setInternalValue('');
12078
+ // eslint-disable-next-line react-hooks/exhaustive-deps
12079
+ }, [status]);
12080
+ var hasValue = Boolean(value);
12081
+ return (jsxs$1(Container$w, __assign$1({ status: status, hasError: hasError }, { children: [label && (jsx$1(InputLabel, { label: label, isDisabled: rest.disabled, isRequired: Boolean(required) }, void 0)), jsxs$1(InputWrapper, __assign$1({ className: "inputWrapper", size: size, inlinePlaceholder: inlinePlaceholder }, { children: [jsx$1(StyledInput, __assign$1({ hasValue: hasValue, inlinePlaceholder: inlinePlaceholder, hasError: hasError, ref: innerRef, "data-testid": "base-input", type: inputType, onChange: function (event) {
12082
+ onChange(event.target.value, event);
12083
+ }, onBlur: onBlur, required: Boolean(required), value: value, placeholder: inlinePlaceholder ? '' : placeholder }, rest), void 0), inlinePlaceholder && (jsx$1(AnimatedPlaceholder, __assign$1({ "data-testid": "input-placeholder" }, { children: placeholder }), void 0)), children] }), void 0), !hideClear && !rest.disabled && inlinePlaceholder && hasValue && (jsx$1(ClearInput, __assign$1({ onClick: function () {
12084
+ onChange('', { target: { value: '' } });
11697
12085
  }, "data-testid": "clear-value" }, { children: jsx$1(Icon.Actions.ClearLight, { width: 0.75, height: 0.75, fill: theme.colors.shades[550].color }, void 0) }), void 0)), required && status === InputValidationType.Error && jsx$1(Error$1, { error: required }, void 0)] }), void 0));
11698
12086
  };
11699
12087
 
@@ -11711,11 +12099,11 @@ var Button$2 = function (_a) {
11711
12099
  throw new Error("Invalid button variant ".concat(variant));
11712
12100
  };
11713
12101
 
11714
- var Container$s = newStyled.div(templateObject_1$L || (templateObject_1$L = __makeTemplateObject(["\n overflow: hidden;\n\n input {\n border-radius: ", ";\n border-top-right-radius: 0;\n border-bottom-right-radius: 0;\n border-right: none;\n width: 100%;\n }\n"], ["\n overflow: hidden;\n\n input {\n border-radius: ", ";\n border-top-right-radius: 0;\n border-bottom-right-radius: 0;\n border-right: none;\n width: 100%;\n }\n"])), function (_a) {
12102
+ var Container$v = newStyled.div(templateObject_1$O || (templateObject_1$O = __makeTemplateObject(["\n overflow: hidden;\n\n input {\n border-radius: ", ";\n border-top-right-radius: 0;\n border-bottom-right-radius: 0;\n border-right: none;\n width: 100%;\n }\n"], ["\n overflow: hidden;\n\n input {\n border-radius: ", ";\n border-top-right-radius: 0;\n border-bottom-right-radius: 0;\n border-right: none;\n width: 100%;\n }\n"])), function (_a) {
11715
12103
  var theme = _a.theme;
11716
12104
  return theme.component.inputCustom.input.borderRadius;
11717
12105
  });
11718
- var ButtonContainer$1 = newStyled.div(templateObject_2$u || (templateObject_2$u = __makeTemplateObject(["\n max-width: 50%;\n\n button {\n width: 100%;\n height: 100%;\n border-radius: ", ";\n }\n"], ["\n max-width: 50%;\n\n button {\n width: 100%;\n height: 100%;\n border-radius: ", ";\n }\n"])), function (_a) {
12106
+ var ButtonContainer$1 = newStyled.div(templateObject_2$x || (templateObject_2$x = __makeTemplateObject(["\n max-width: 50%;\n\n button {\n width: 100%;\n height: 100%;\n border-radius: ", ";\n }\n"], ["\n max-width: 50%;\n\n button {\n width: 100%;\n height: 100%;\n border-radius: ", ";\n }\n"])), function (_a) {
11719
12107
  var theme = _a.theme;
11720
12108
  return theme.component.inputCustom.button.borderRadius;
11721
12109
  });
@@ -11728,23 +12116,23 @@ var Custom = function (_a) {
11728
12116
  text: text,
11729
12117
  disabled: rest.disabled,
11730
12118
  }); }, [variant, onClick, text, rest.disabled]);
11731
- return (jsx$1(Container$s, __assign$1({ theme: theme }, { children: jsx$1(BaseInput, __assign$1({}, rest, { children: jsx$1(ButtonContainer$1, __assign$1({ theme: theme }, { children: jsx$1(Button$2, __assign$1({}, props), void 0) }), void 0) }), void 0) }), void 0));
12119
+ return (jsx$1(Container$v, __assign$1({ theme: theme }, { children: jsx$1(BaseInput, __assign$1({}, rest, { children: jsx$1(ButtonContainer$1, __assign$1({ theme: theme }, { children: jsx$1(Button$2, __assign$1({}, props), void 0) }), void 0) }), void 0) }), void 0));
11732
12120
  };
11733
- var templateObject_1$L, templateObject_2$u;
12121
+ var templateObject_1$O, templateObject_2$x;
11734
12122
 
11735
- var SuccessContainer = newStyled.div(templateObject_1$K || (templateObject_1$K = __makeTemplateObject(["\n height: ", ";\n display: flex;\n"], ["\n height: ", ";\n display: flex;\n"])), function (_a) {
12123
+ var SuccessContainer = newStyled.div(templateObject_1$N || (templateObject_1$N = __makeTemplateObject(["\n height: ", ";\n display: flex;\n"], ["\n height: ", ";\n display: flex;\n"])), function (_a) {
11736
12124
  var size = _a.size;
11737
12125
  return (size === 'small' ? '36px' : '');
11738
12126
  });
11739
- var SuccessMessage = newStyled.div(templateObject_2$t || (templateObject_2$t = __makeTemplateObject(["\n background-color: #dfefe0;\n border: 0.063rem solid #5ead63;\n border-radius: 0.5rem;\n width: 100%;\n flex: 1;\n display: flex;\n align-items: center;\n padding: 0 1rem;\n box-sizing: border-box;\n"], ["\n background-color: #dfefe0;\n border: 0.063rem solid #5ead63;\n border-radius: 0.5rem;\n width: 100%;\n flex: 1;\n display: flex;\n align-items: center;\n padding: 0 1rem;\n box-sizing: border-box;\n"])));
11740
- var SuccessText = newStyled.span(templateObject_3$o || (templateObject_3$o = __makeTemplateObject(["\n margin: 0;\n font-size: 1rem;\n line-height: 1.5rem;\n font-weight: 600;\n margin-left: 0.313rem;\n"], ["\n margin: 0;\n font-size: 1rem;\n line-height: 1.5rem;\n font-weight: 600;\n margin-left: 0.313rem;\n"])));
12127
+ var SuccessMessage = newStyled.div(templateObject_2$w || (templateObject_2$w = __makeTemplateObject(["\n background-color: #dfefe0;\n border: 0.063rem solid #5ead63;\n border-radius: 0.5rem;\n width: 100%;\n flex: 1;\n display: flex;\n align-items: center;\n padding: 0 1rem;\n box-sizing: border-box;\n"], ["\n background-color: #dfefe0;\n border: 0.063rem solid #5ead63;\n border-radius: 0.5rem;\n width: 100%;\n flex: 1;\n display: flex;\n align-items: center;\n padding: 0 1rem;\n box-sizing: border-box;\n"])));
12128
+ var SuccessText = newStyled.span(templateObject_3$r || (templateObject_3$r = __makeTemplateObject(["\n margin: 0;\n font-size: 1rem;\n line-height: 1.5rem;\n font-weight: 600;\n margin-left: 0.313rem;\n"], ["\n margin: 0;\n font-size: 1rem;\n line-height: 1.5rem;\n font-weight: 600;\n margin-left: 0.313rem;\n"])));
11741
12129
  var Success = function (_a) {
11742
12130
  var children = _a.children, successText = _a.successText, size = _a.size;
11743
12131
  return (jsxs$1(SuccessContainer, __assign$1({ size: size }, { children: [jsxs$1(SuccessMessage, { children: [jsx$1(Icon.Actions.Check, { fill: "#5EAD63", width: 1.375, height: 1.063 }, void 0), jsx$1(SuccessText, { children: successText }, void 0)] }, void 0), children] }), void 0));
11744
12132
  };
11745
- var templateObject_1$K, templateObject_2$t, templateObject_3$o;
12133
+ var templateObject_1$N, templateObject_2$w, templateObject_3$r;
11746
12134
 
11747
- var ButtonContainer = newStyled.div(templateObject_1$J || (templateObject_1$J = __makeTemplateObject(["\n margin-left: 0.625rem;\n\n button {\n width: 100%;\n height: 100%;\n background-color: ", ";\n }\n"], ["\n margin-left: 0.625rem;\n\n button {\n width: 100%;\n height: 100%;\n background-color: ", ";\n }\n"])), function (_a) {
12135
+ var ButtonContainer = newStyled.div(templateObject_1$M || (templateObject_1$M = __makeTemplateObject(["\n margin-left: 0.625rem;\n\n button {\n width: 100%;\n height: 100%;\n background-color: ", ";\n }\n"], ["\n margin-left: 0.625rem;\n\n button {\n width: 100%;\n height: 100%;\n background-color: ", ";\n }\n"])), function (_a) {
11748
12136
  var status = _a.status, type = _a.type, theme = _a.theme;
11749
12137
  return status === InputValidationType.Empty &&
11750
12138
  type === 'primary' &&
@@ -11761,21 +12149,21 @@ var BasePlusButton = function (_a) {
11761
12149
  }
11762
12150
  return (jsx$1(BaseInput, __assign$1({ onValidation: setStatus, onChange: onChangeInput }, rest, { children: jsx$1(ButtonContainer, __assign$1({ status: status, type: "primary", theme: theme }, { children: jsx$1(ButtonSecondary, { text: text, onClick: function () { return onClick(inputValue); }, disabled: rest.disabled || status === InputValidationType.Error }, void 0) }), void 0) }), void 0));
11763
12151
  };
11764
- var templateObject_1$J;
12152
+ var templateObject_1$M;
11765
12153
 
11766
- var Container$r = newStyled.div(templateObject_1$I || (templateObject_1$I = __makeTemplateObject(["\n input {\n padding-right: 2.688rem;\n }\n"], ["\n input {\n padding-right: 2.688rem;\n }\n"])));
11767
- var IconContainer$4 = newStyled.div(templateObject_2$s || (templateObject_2$s = __makeTemplateObject(["\n position: absolute;\n right: 0.875rem;\n width: 1.125rem;\n height: 100%;\n display: flex;\n align-items: center;\n\n svg path {\n fill: ", ";\n }\n"], ["\n position: absolute;\n right: 0.875rem;\n width: 1.125rem;\n height: 100%;\n display: flex;\n align-items: center;\n\n svg path {\n fill: ", ";\n }\n"])), function (props) { return props.color; });
12154
+ var Container$u = newStyled.div(templateObject_1$L || (templateObject_1$L = __makeTemplateObject(["\n input {\n padding-right: 2.688rem;\n }\n"], ["\n input {\n padding-right: 2.688rem;\n }\n"])));
12155
+ var IconContainer$4 = newStyled.div(templateObject_2$v || (templateObject_2$v = __makeTemplateObject(["\n position: absolute;\n right: 0.875rem;\n width: 1.125rem;\n height: 100%;\n display: flex;\n align-items: center;\n\n svg path {\n fill: ", ";\n }\n"], ["\n position: absolute;\n right: 0.875rem;\n width: 1.125rem;\n height: 100%;\n display: flex;\n align-items: center;\n\n svg path {\n fill: ", ";\n }\n"])), function (props) { return props.color; });
11768
12156
  var BasePlusIcon = function (_a) {
11769
12157
  var Icon = _a.Icon, rest = __rest(_a, ["Icon"]);
11770
12158
  var theme = useTheme();
11771
12159
  var _b = useState(InputValidationType.Empty), status = _b[0], setStatus = _b[1];
11772
- return (jsx$1(Container$r, { children: jsx$1(BaseInput, __assign$1({}, rest, { onValidation: setStatus }, { children: jsx$1(IconContainer$4, __assign$1({ color: status === InputValidationType.Valid
12160
+ return (jsx$1(Container$u, { children: jsx$1(BaseInput, __assign$1({}, rest, { onValidation: setStatus }, { children: jsx$1(IconContainer$4, __assign$1({ color: status === InputValidationType.Valid
11773
12161
  ? theme.colors.shades['700'].color
11774
12162
  : status === InputValidationType.Error
11775
12163
  ? theme.colors.semantic.urgent.color
11776
12164
  : '' }, { children: createElement(Icon, { fill: theme.colors.shades['250'].color }) }), void 0) }), void 0) }, void 0));
11777
12165
  };
11778
- var templateObject_1$I, templateObject_2$s;
12166
+ var templateObject_1$L, templateObject_2$v;
11779
12167
 
11780
12168
  var Input$1 = {
11781
12169
  Simple: BaseInput,
@@ -11784,7 +12172,7 @@ var Input$1 = {
11784
12172
  SimplePlusIcon: BasePlusIcon,
11785
12173
  };
11786
12174
 
11787
- var Container$q = newStyled.div(templateObject_1$H || (templateObject_1$H = __makeTemplateObject(["\n width: ", ";\n height: ", ";\n border: 0.063rem solid ", ";\n border-radius: 0.25rem;\n padding: 0.375rem;\n cursor: ", ";\n"], ["\n width: ", ";\n height: ", ";\n border: 0.063rem solid ", ";\n border-radius: 0.25rem;\n padding: 0.375rem;\n cursor: ", ";\n"])), function (_a) {
12175
+ var Container$t = newStyled.div(templateObject_1$K || (templateObject_1$K = __makeTemplateObject(["\n width: ", ";\n height: ", ";\n border: 0.063rem solid ", ";\n border-radius: 0.25rem;\n padding: 0.375rem;\n cursor: ", ";\n"], ["\n width: ", ";\n height: ", ";\n border: 0.063rem solid ", ";\n border-radius: 0.25rem;\n padding: 0.375rem;\n cursor: ", ";\n"])), function (_a) {
11788
12176
  var width = _a.width;
11789
12177
  return width;
11790
12178
  }, function (_a) {
@@ -11800,11 +12188,11 @@ var Container$q = newStyled.div(templateObject_1$H || (templateObject_1$H = __ma
11800
12188
  var PaymentMethod = function (_a) {
11801
12189
  var Icon = _a.Icon, width = _a.width, height = _a.height, onClick = _a.onClick;
11802
12190
  var theme = useTheme();
11803
- return (jsx$1(Container$q, __assign$1({ width: width, height: height, borderColor: theme.colors.shades['100'].color, isClickable: Boolean(onClick), onClick: onClick, "data-testid": "payment-method-container" }, { children: createElement(Icon) }), void 0));
12191
+ return (jsx$1(Container$t, __assign$1({ width: width, height: height, borderColor: theme.colors.shades['100'].color, isClickable: Boolean(onClick), onClick: onClick, "data-testid": "payment-method-container" }, { children: createElement(Icon) }), void 0));
11804
12192
  };
11805
- var templateObject_1$H;
12193
+ var templateObject_1$K;
11806
12194
 
11807
- var Text$5 = newStyled.h3(templateObject_1$G || (templateObject_1$G = __makeTemplateObject(["\n background-color: ", ";\n margin: 0;\n padding: 0.25rem 0.5rem;\n font-size: 0.625rem;\n font-weight: 700;\n line-height: 0.875rem;\n border-radius: 0.125rem;\n display: initial;\n color: ", ";\n"], ["\n background-color: ", ";\n margin: 0;\n padding: 0.25rem 0.5rem;\n font-size: 0.625rem;\n font-weight: 700;\n line-height: 0.875rem;\n border-radius: 0.125rem;\n display: initial;\n color: ", ";\n"])), function (_a) {
12195
+ var Text$5 = newStyled.h3(templateObject_1$J || (templateObject_1$J = __makeTemplateObject(["\n background-color: ", ";\n margin: 0;\n padding: 0.25rem 0.5rem;\n font-size: 0.625rem;\n font-weight: 700;\n line-height: 0.875rem;\n border-radius: 0.125rem;\n display: initial;\n color: ", ";\n"], ["\n background-color: ", ";\n margin: 0;\n padding: 0.25rem 0.5rem;\n font-size: 0.625rem;\n font-weight: 700;\n line-height: 0.875rem;\n border-radius: 0.125rem;\n display: initial;\n color: ", ";\n"])), function (_a) {
11808
12196
  var backgroundColor = _a.backgroundColor;
11809
12197
  return backgroundColor;
11810
12198
  }, function (_a) {
@@ -11816,26 +12204,26 @@ var OfferBanner = function (_a) {
11816
12204
  var theme = useTheme();
11817
12205
  return (jsx$1(Text$5, __assign$1({ backgroundColor: backgroundColor, color: theme.colors.shades['700'].color, "data-testid": "OfferBanner" }, { children: discountAppliedText }), void 0));
11818
12206
  };
11819
- var templateObject_1$G;
12207
+ var templateObject_1$J;
11820
12208
 
11821
- var Wrapper$2 = newStyled.div(templateObject_1$F || (templateObject_1$F = __makeTemplateObject(["\n display: flex;\n flex-direction: column;\n align-items: flex-end;\n"], ["\n display: flex;\n flex-direction: column;\n align-items: flex-end;\n"])));
11822
- var GrandTotal = newStyled.h1(templateObject_2$r || (templateObject_2$r = __makeTemplateObject(["\n margin: 0;\n font-size: 1.5rem;\n line-height: 2rem;\n font-weight: 700;\n color: ", ";\n display: flex;\n align-items: center;\n"], ["\n margin: 0;\n font-size: 1.5rem;\n line-height: 2rem;\n font-weight: 700;\n color: ", ";\n display: flex;\n align-items: center;\n"])), function (props) { return props.color; });
11823
- var Currency = newStyled.span(templateObject_3$n || (templateObject_3$n = __makeTemplateObject(["\n margin: 0;\n margin-right: 0.625rem;\n font-size: 0.875rem;\n line-height: 1.375rem;\n font-weight: 600;\n"], ["\n margin: 0;\n margin-right: 0.625rem;\n font-size: 0.875rem;\n line-height: 1.375rem;\n font-weight: 600;\n"])));
11824
- var Container$p = newStyled.div(templateObject_4$h || (templateObject_4$h = __makeTemplateObject(["\n display: flex;\n justify-content: space-between;\n width: 100%;\n margin-top: 0.625rem;\n color: ", ";\n"], ["\n display: flex;\n justify-content: space-between;\n width: 100%;\n margin-top: 0.625rem;\n color: ", ";\n"])), function (props) { return props.highlightColor; });
11825
- var Discount = newStyled.h3(templateObject_5$9 || (templateObject_5$9 = __makeTemplateObject(["\n margin: 0;\n font-size: 1rem;\n line-height: 1.5rem;\n font-weight: 600;\n"], ["\n margin: 0;\n font-size: 1rem;\n line-height: 1.5rem;\n font-weight: 600;\n"])));
12209
+ var Wrapper$2 = newStyled.div(templateObject_1$I || (templateObject_1$I = __makeTemplateObject(["\n display: flex;\n flex-direction: column;\n align-items: flex-end;\n"], ["\n display: flex;\n flex-direction: column;\n align-items: flex-end;\n"])));
12210
+ var GrandTotal = newStyled.h1(templateObject_2$u || (templateObject_2$u = __makeTemplateObject(["\n margin: 0;\n font-size: 1.5rem;\n line-height: 2rem;\n font-weight: 700;\n color: ", ";\n display: flex;\n align-items: center;\n"], ["\n margin: 0;\n font-size: 1.5rem;\n line-height: 2rem;\n font-weight: 700;\n color: ", ";\n display: flex;\n align-items: center;\n"])), function (props) { return props.color; });
12211
+ var Currency = newStyled.span(templateObject_3$q || (templateObject_3$q = __makeTemplateObject(["\n margin: 0;\n margin-right: 0.625rem;\n font-size: 0.875rem;\n line-height: 1.375rem;\n font-weight: 600;\n"], ["\n margin: 0;\n margin-right: 0.625rem;\n font-size: 0.875rem;\n line-height: 1.375rem;\n font-weight: 600;\n"])));
12212
+ var Container$s = newStyled.div(templateObject_4$h || (templateObject_4$h = __makeTemplateObject(["\n display: flex;\n justify-content: space-between;\n width: 100%;\n margin-top: 0.625rem;\n color: ", ";\n"], ["\n display: flex;\n justify-content: space-between;\n width: 100%;\n margin-top: 0.625rem;\n color: ", ";\n"])), function (props) { return props.highlightColor; });
12213
+ var Discount = newStyled.h3(templateObject_5$a || (templateObject_5$a = __makeTemplateObject(["\n margin: 0;\n font-size: 1rem;\n line-height: 1.5rem;\n font-weight: 600;\n"], ["\n margin: 0;\n font-size: 1rem;\n line-height: 1.5rem;\n font-weight: 600;\n"])));
11826
12214
  var Total = function (_a) {
11827
12215
  var total = _a.total, currency = _a.currency, saving = _a.saving, _b = _a.highlightColor, highlightColor = _b === void 0 ? '#2f806a' : _b;
11828
12216
  var theme = useTheme();
11829
- return (jsxs$1(Wrapper$2, __assign$1({ "data-testid": "total-wrapper" }, { children: [jsxs$1(GrandTotal, __assign$1({ color: theme.colors.shades['550'].color, "data-testid": "total-price" }, { children: [jsx$1(Currency, { children: currency }, void 0), total] }), void 0), saving && (jsxs$1(Container$p, __assign$1({ "data-testid": "subtotal-container", highlightColor: highlightColor }, { children: [jsx$1(Discount, __assign$1({ "data-testid": "saving-title" }, { children: saving.savingText }), void 0), jsx$1(Discount, __assign$1({ "data-testid": "saving-price" }, { children: saving.amount }), void 0)] }), void 0))] }), void 0));
12217
+ return (jsxs$1(Wrapper$2, __assign$1({ "data-testid": "total-wrapper" }, { children: [jsxs$1(GrandTotal, __assign$1({ color: theme.colors.shades['550'].color, "data-testid": "total-price" }, { children: [jsx$1(Currency, { children: currency }, void 0), total] }), void 0), saving && (jsxs$1(Container$s, __assign$1({ "data-testid": "subtotal-container", highlightColor: highlightColor }, { children: [jsx$1(Discount, __assign$1({ "data-testid": "saving-title" }, { children: saving.savingText }), void 0), jsx$1(Discount, __assign$1({ "data-testid": "saving-price" }, { children: saving.amount }), void 0)] }), void 0))] }), void 0));
11830
12218
  };
11831
- var templateObject_1$F, templateObject_2$r, templateObject_3$n, templateObject_4$h, templateObject_5$9;
12219
+ var templateObject_1$I, templateObject_2$u, templateObject_3$q, templateObject_4$h, templateObject_5$a;
11832
12220
 
11833
- var Wrapper$1 = newStyled.div(templateObject_1$E || (templateObject_1$E = __makeTemplateObject(["\n color: ", ";\n"], ["\n color: ", ";\n"])), function (_a) {
12221
+ var Wrapper$1 = newStyled.div(templateObject_1$H || (templateObject_1$H = __makeTemplateObject(["\n color: ", ";\n"], ["\n color: ", ";\n"])), function (_a) {
11834
12222
  var color = _a.color;
11835
12223
  return color;
11836
12224
  });
11837
- var ItemContainer = newStyled.div(templateObject_2$q || (templateObject_2$q = __makeTemplateObject(["\n display: flex;\n justify-content: space-between;\n margin-bottom: 0.625rem;\n\n &:last-child {\n margin-bottom: 0;\n }\n"], ["\n display: flex;\n justify-content: space-between;\n margin-bottom: 0.625rem;\n\n &:last-child {\n margin-bottom: 0;\n }\n"])));
11838
- var Item$2 = newStyled.h4(templateObject_3$m || (templateObject_3$m = __makeTemplateObject(["\n margin: 0;\n font-size: 0.875rem;\n line-height: 1.375rem;\n font-weight: 600;\n"], ["\n margin: 0;\n font-size: 0.875rem;\n line-height: 1.375rem;\n font-weight: 600;\n"])));
12225
+ var ItemContainer = newStyled.div(templateObject_2$t || (templateObject_2$t = __makeTemplateObject(["\n display: flex;\n justify-content: space-between;\n margin-bottom: 0.625rem;\n\n &:last-child {\n margin-bottom: 0;\n }\n"], ["\n display: flex;\n justify-content: space-between;\n margin-bottom: 0.625rem;\n\n &:last-child {\n margin-bottom: 0;\n }\n"])));
12226
+ var Item$2 = newStyled.h4(templateObject_3$p || (templateObject_3$p = __makeTemplateObject(["\n margin: 0;\n font-size: 0.875rem;\n line-height: 1.375rem;\n font-weight: 600;\n"], ["\n margin: 0;\n font-size: 0.875rem;\n line-height: 1.375rem;\n font-weight: 600;\n"])));
11839
12227
  var CouponItem = newStyled(Item$2)(templateObject_4$g || (templateObject_4$g = __makeTemplateObject(["\n color: ", ";\n"], ["\n color: ", ";\n"])), function (_a) {
11840
12228
  var color = _a.color;
11841
12229
  return color;
@@ -11849,22 +12237,22 @@ var Subtotal = function (_a) {
11849
12237
  return (jsxs$1(ItemContainer, { children: [jsxs$1(CouponItem, __assign$1({ color: highlightColor, "data-testid": "discount-title" }, { children: [coupon.couponText, " ", code, " ", coupon.appliedText] }), void 0), jsx$1(CouponItem, __assign$1({ color: highlightColor, "data-testid": "discount-price" }, { children: amount }), void 0)] }, code));
11850
12238
  })] }), void 0));
11851
12239
  };
11852
- var templateObject_1$E, templateObject_2$q, templateObject_3$m, templateObject_4$g;
12240
+ var templateObject_1$H, templateObject_2$t, templateObject_3$p, templateObject_4$g;
11853
12241
 
11854
12242
  var Totals = {
11855
12243
  Total: Total,
11856
12244
  Subtotal: Subtotal,
11857
12245
  };
11858
12246
 
11859
- var Container$o = newStyled.div(templateObject_1$D || (templateObject_1$D = __makeTemplateObject(["\n padding: 0.625rem 1.25rem;\n background-color: ", ";\n border-radius: 0.313rem;\n display: flex;\n margin-bottom: 0.938rem;\n"], ["\n padding: 0.625rem 1.25rem;\n background-color: ", ";\n border-radius: 0.313rem;\n display: flex;\n margin-bottom: 0.938rem;\n"])), function (props) { return props.color; });
11860
- var IconContainer$3 = newStyled.div(templateObject_2$p || (templateObject_2$p = __makeTemplateObject(["\n width: 1rem;\n height: 0.875rem;\n margin-right: 0.5rem;\n margin-top: 0.125rem;\n"], ["\n width: 1rem;\n height: 0.875rem;\n margin-right: 0.5rem;\n margin-top: 0.125rem;\n"])));
11861
- var Text$4 = newStyled.p(templateObject_3$l || (templateObject_3$l = __makeTemplateObject(["\n font-size: 0.875rem;\n line-height: 1.375rem;\n font-weight: 400;\n margin: 0;\n color: ", ";\n"], ["\n font-size: 0.875rem;\n line-height: 1.375rem;\n font-weight: 400;\n margin: 0;\n color: ", ";\n"])), function (props) { return props.color; });
12247
+ var Container$r = newStyled.div(templateObject_1$G || (templateObject_1$G = __makeTemplateObject(["\n padding: 0.625rem 1.25rem;\n background-color: ", ";\n border-radius: 0.313rem;\n display: flex;\n margin-bottom: 0.938rem;\n"], ["\n padding: 0.625rem 1.25rem;\n background-color: ", ";\n border-radius: 0.313rem;\n display: flex;\n margin-bottom: 0.938rem;\n"])), function (props) { return props.color; });
12248
+ var IconContainer$3 = newStyled.div(templateObject_2$s || (templateObject_2$s = __makeTemplateObject(["\n width: 1rem;\n height: 0.875rem;\n margin-right: 0.5rem;\n margin-top: 0.125rem;\n"], ["\n width: 1rem;\n height: 0.875rem;\n margin-right: 0.5rem;\n margin-top: 0.125rem;\n"])));
12249
+ var Text$4 = newStyled.p(templateObject_3$o || (templateObject_3$o = __makeTemplateObject(["\n font-size: 0.875rem;\n line-height: 1.375rem;\n font-weight: 400;\n margin: 0;\n color: ", ";\n"], ["\n font-size: 0.875rem;\n line-height: 1.375rem;\n font-weight: 400;\n margin: 0;\n color: ", ";\n"])), function (props) { return props.color; });
11862
12250
  var Details = newStyled.span(templateObject_4$f || (templateObject_4$f = __makeTemplateObject(["\n color: ", ";\n font-weight: 700;\n"], ["\n color: ", ";\n font-weight: 700;\n"])), function (props) { return props.color; });
11863
12251
  var Note = function (_a) {
11864
12252
  var accentColor = _a.accentColor, color = _a.color, backgroundColor = _a.backgroundColor, importantNoteText = _a.importantNoteText, text = _a.text;
11865
- return (jsxs$1(Container$o, __assign$1({ color: backgroundColor, "data-testid": "Container" }, { children: [jsx$1(IconContainer$3, { children: jsx$1(Icon.Actions.LightExclamation, { fill: accentColor }, void 0) }, void 0), jsx$1("div", { children: jsxs$1(Text$4, __assign$1({ color: color }, { children: [importantNoteText && jsxs$1(Details, __assign$1({ color: accentColor }, { children: [importantNoteText, ":"] }), void 0), " ", text] }), void 0) }, void 0)] }), void 0));
12253
+ return (jsxs$1(Container$r, __assign$1({ color: backgroundColor, "data-testid": "Container" }, { children: [jsx$1(IconContainer$3, { children: jsx$1(Icon.Actions.LightExclamation, { fill: accentColor }, void 0) }, void 0), jsx$1("div", { children: jsxs$1(Text$4, __assign$1({ color: color }, { children: [importantNoteText && jsxs$1(Details, __assign$1({ color: accentColor }, { children: [importantNoteText, ":"] }), void 0), " ", text] }), void 0) }, void 0)] }), void 0));
11866
12254
  };
11867
- var templateObject_1$D, templateObject_2$p, templateObject_3$l, templateObject_4$f;
12255
+ var templateObject_1$G, templateObject_2$s, templateObject_3$o, templateObject_4$f;
11868
12256
 
11869
12257
  /* eslint-disable no-param-reassign */
11870
12258
  var index$1 = function (breakpoints) {
@@ -11950,9 +12338,9 @@ var mediaQueries = index$1(["@media(max-width: 900px)", "@media(min-width: 900px
11950
12338
  literal: true,
11951
12339
  });
11952
12340
 
11953
- var Title$4 = newStyled.h1(templateObject_1$C || (templateObject_1$C = __makeTemplateObject(["\n color: ", ";\n font-size: 1.25rem;\n line-height: 1.75rem;\n font-weight: 600;\n margin: 0;\n text-align: center;\n"], ["\n color: ", ";\n font-size: 1.25rem;\n line-height: 1.75rem;\n font-weight: 600;\n margin: 0;\n text-align: center;\n"])), function (props) { return props.color; });
11954
- var Line = newStyled.div(templateObject_2$o || (templateObject_2$o = __makeTemplateObject(["\n width: 100%;\n height: 0.063rem;\n background-color: ", ";\n margin: 0.938rem 0;\n"], ["\n width: 100%;\n height: 0.063rem;\n background-color: ", ";\n margin: 0.938rem 0;\n"])), function (props) { return props.backgroundColor; });
11955
- var Row$1 = newStyled.div(templateObject_3$k || (templateObject_3$k = __makeTemplateObject(["\n display: flex;\n ", "\n justify-content: space-between;\n align-items: flex-start;\n"], ["\n display: flex;\n ", "\n justify-content: space-between;\n align-items: flex-start;\n"])), mediaQueries({
12341
+ var Title$4 = newStyled.h1(templateObject_1$F || (templateObject_1$F = __makeTemplateObject(["\n color: ", ";\n font-size: 1.25rem;\n line-height: 1.75rem;\n font-weight: 600;\n margin: 0;\n text-align: center;\n"], ["\n color: ", ";\n font-size: 1.25rem;\n line-height: 1.75rem;\n font-weight: 600;\n margin: 0;\n text-align: center;\n"])), function (props) { return props.color; });
12342
+ var Line = newStyled.div(templateObject_2$r || (templateObject_2$r = __makeTemplateObject(["\n width: 100%;\n height: 0.063rem;\n background-color: ", ";\n margin: 0.938rem 0;\n"], ["\n width: 100%;\n height: 0.063rem;\n background-color: ", ";\n margin: 0.938rem 0;\n"])), function (props) { return props.backgroundColor; });
12343
+ var Row$1 = newStyled.div(templateObject_3$n || (templateObject_3$n = __makeTemplateObject(["\n display: flex;\n ", "\n justify-content: space-between;\n align-items: flex-start;\n"], ["\n display: flex;\n ", "\n justify-content: space-between;\n align-items: flex-start;\n"])), mediaQueries({
11956
12344
  flexDirection: ['column', 'row'],
11957
12345
  }));
11958
12346
  var Col$1 = newStyled.div(templateObject_4$e || (templateObject_4$e = __makeTemplateObject(["\n display: flex;\n flex-direction: column;\n justify-content: center;\n flex: 1;\n ", "\n"], ["\n display: flex;\n flex-direction: column;\n justify-content: center;\n flex: 1;\n ", "\n"])), mediaQueries({
@@ -11962,7 +12350,7 @@ var Col$1 = newStyled.div(templateObject_4$e || (templateObject_4$e = __makeTemp
11962
12350
  textAlign: ['center', 'inherit'],
11963
12351
  width: ['100%', 'inherit'],
11964
12352
  }));
11965
- var IconContainer$2 = newStyled.div(templateObject_5$8 || (templateObject_5$8 = __makeTemplateObject(["\n width: 1.375rem;\n height: 1.375rem;\n margin-right: 0.438rem;\n ", "\n"], ["\n width: 1.375rem;\n height: 1.375rem;\n margin-right: 0.438rem;\n ", "\n"])), mediaQueries({
12353
+ var IconContainer$2 = newStyled.div(templateObject_5$9 || (templateObject_5$9 = __makeTemplateObject(["\n width: 1.375rem;\n height: 1.375rem;\n margin-right: 0.438rem;\n ", "\n"], ["\n width: 1.375rem;\n height: 1.375rem;\n margin-right: 0.438rem;\n ", "\n"])), mediaQueries({
11966
12354
  marginBottom: ['1.875rem', '0'],
11967
12355
  width: ['auto', '1.375rem'],
11968
12356
  }));
@@ -11979,47 +12367,47 @@ var DeliveryDetails = function (_a) {
11979
12367
  var theme = useTheme();
11980
12368
  return (jsxs$1("div", __assign$1({ "data-testid": "DeliveryDetails" }, { children: [jsx$1(Title$4, __assign$1({ color: theme.colors.pallete.secondary.color }, { children: deliveryDetailsText }), void 0), jsx$1(Line, { backgroundColor: theme.colors.shades['100'].color }, void 0), note && jsx$1(Note, __assign$1({}, note), void 0), jsxs$1(Row$1, __assign$1({ "data-testid": "DD-row", theme: theme }, { children: [jsxs$1(Col$1, __assign$1({ theme: theme }, { children: [jsxs$1(SectionTitle, __assign$1({ theme: theme }, { children: [jsx$1(IconContainer$2, __assign$1({ theme: theme }, { children: jsx$1(Icon.PDP.Clock, {}, void 0) }), void 0), arrivingBy.title] }), void 0), jsx$1(SectionDetails, __assign$1({ color: theme.colors.shades['700'].color }, { children: arrivingBy.details }), void 0)] }), void 0), jsxs$1(Col$1, __assign$1({ theme: theme }, { children: [jsxs$1(SectionTitle, __assign$1({ theme: theme }, { children: [jsx$1(IconContainer$2, __assign$1({ theme: theme }, { children: jsx$1(Icon.Navigation.MapMarker, {}, void 0) }), void 0), shippingTo.title] }), void 0), jsx$1(SectionDetails, __assign$1({ color: theme.colors.shades['700'].color }, { children: shippingTo.details }), void 0)] }), void 0), jsxs$1(Col$1, __assign$1({ theme: theme }, { children: [jsxs$1(SectionTitle, __assign$1({ theme: theme }, { children: [jsx$1(IconContainer$2, __assign$1({ theme: theme }, { children: jsx$1(Icon.Messaging.Messenger, {}, void 0) }), void 0), instantOrderUpdate.title] }), void 0), jsx$1(SectionDetails, __assign$1({ color: theme.colors.shades['700'].color }, { children: instantOrderUpdate.details }), void 0), jsxs$1(KeepMeUpdated, __assign$1({ onClick: instantOrderUpdate.keepMeUpdated.onClick, borderColor: theme.colors.shades['150'].color }, { children: [jsx$1(Icon.Messaging.Messenger, { width: 1, height: 1, fill: "#0078FF" }, void 0), instantOrderUpdate.keepMeUpdated.title] }), void 0)] }), void 0)] }), void 0)] }), void 0));
11981
12369
  };
11982
- var templateObject_1$C, templateObject_2$o, templateObject_3$k, templateObject_4$e, templateObject_5$8, templateObject_6$6, templateObject_7$3, templateObject_8$2;
12370
+ var templateObject_1$F, templateObject_2$r, templateObject_3$n, templateObject_4$e, templateObject_5$9, templateObject_6$6, templateObject_7$3, templateObject_8$2;
11983
12371
 
11984
- var Container$n = newStyled.div(templateObject_1$B || (templateObject_1$B = __makeTemplateObject(["\n display: inline-flex;\n align-items: center;\n cursor: pointer;\n user-select: none;\n"], ["\n display: inline-flex;\n align-items: center;\n cursor: pointer;\n user-select: none;\n"])));
11985
- var Text$3 = newStyled.p(templateObject_2$n || (templateObject_2$n = __makeTemplateObject(["\n margin: 0;\n font-size: 1rem;\n line-height: 1.5rem;\n font-weight: 700;\n color: ", ";\n margin-right: 0.313rem;\n"], ["\n margin: 0;\n font-size: 1rem;\n line-height: 1.5rem;\n font-weight: 700;\n color: ", ";\n margin-right: 0.313rem;\n"])), function (props) { return props.color; });
12372
+ var Container$q = newStyled.div(templateObject_1$E || (templateObject_1$E = __makeTemplateObject(["\n display: inline-flex;\n align-items: center;\n cursor: pointer;\n user-select: none;\n"], ["\n display: inline-flex;\n align-items: center;\n cursor: pointer;\n user-select: none;\n"])));
12373
+ var Text$3 = newStyled.p(templateObject_2$q || (templateObject_2$q = __makeTemplateObject(["\n margin: 0;\n font-size: 1rem;\n line-height: 1.5rem;\n font-weight: 700;\n color: ", ";\n margin-right: 0.313rem;\n"], ["\n margin: 0;\n font-size: 1rem;\n line-height: 1.5rem;\n font-weight: 700;\n color: ", ";\n margin-right: 0.313rem;\n"])), function (props) { return props.color; });
11986
12374
  var ScrollToTop = function (_a) {
11987
12375
  var scrollToTopText = _a.scrollToTopText, onClick = _a.onClick;
11988
12376
  var theme = useTheme();
11989
- return (jsxs$1(Container$n, __assign$1({ onClick: onClick, "data-testid": "Container" }, { children: [jsx$1(Text$3, __assign$1({ color: theme.colors.shades['700'].color }, { children: scrollToTopText }), void 0), jsx$1(Icon.Arrows.ChevronUpSolid, { width: 1.375, height: 1.375, fill: theme.colors.pallete.primary.color }, void 0)] }), void 0));
12377
+ return (jsxs$1(Container$q, __assign$1({ onClick: onClick, "data-testid": "Container" }, { children: [jsx$1(Text$3, __assign$1({ color: theme.colors.shades['700'].color }, { children: scrollToTopText }), void 0), jsx$1(Icon.Arrows.ChevronUpSolid, { width: 1.375, height: 1.375, fill: theme.colors.pallete.primary.color }, void 0)] }), void 0));
11990
12378
  };
11991
- var templateObject_1$B, templateObject_2$n;
12379
+ var templateObject_1$E, templateObject_2$q;
11992
12380
 
11993
- var Container$m = newStyled.div(templateObject_1$A || (templateObject_1$A = __makeTemplateObject(["\n display: flex;\n align-items: center;\n justify-content: center;\n background-color: #dfefeb;\n padding: 0.75rem 0;\n"], ["\n display: flex;\n align-items: center;\n justify-content: center;\n background-color: #dfefeb;\n padding: 0.75rem 0;\n"])));
11994
- var H1 = newStyled.h1(templateObject_2$m || (templateObject_2$m = __makeTemplateObject(["\n margin: 0;\n font-size: 1rem;\n line-height: 1.5rem;\n font-weight: 600;\n color: ", ";\n margin-left: 0.625rem;\n"], ["\n margin: 0;\n font-size: 1rem;\n line-height: 1.5rem;\n font-weight: 600;\n color: ", ";\n margin-left: 0.625rem;\n"])), function (props) { return props.color; });
12381
+ var Container$p = newStyled.div(templateObject_1$D || (templateObject_1$D = __makeTemplateObject(["\n display: flex;\n align-items: center;\n justify-content: center;\n background-color: #dfefeb;\n padding: 0.75rem 0;\n"], ["\n display: flex;\n align-items: center;\n justify-content: center;\n background-color: #dfefeb;\n padding: 0.75rem 0;\n"])));
12382
+ var H1 = newStyled.h1(templateObject_2$p || (templateObject_2$p = __makeTemplateObject(["\n margin: 0;\n font-size: 1rem;\n line-height: 1.5rem;\n font-weight: 600;\n color: ", ";\n margin-left: 0.625rem;\n"], ["\n margin: 0;\n font-size: 1rem;\n line-height: 1.5rem;\n font-weight: 600;\n color: ", ";\n margin-left: 0.625rem;\n"])), function (props) { return props.color; });
11995
12383
  var OrderBar = function (_a) {
11996
12384
  var message = _a.message;
11997
12385
  var theme = useTheme();
11998
- return (jsxs$1(Container$m, { children: [jsx$1(Icon.Actions.Check, { width: 1.25, height: 0.875, fill: "#2F806A" }, void 0), jsx$1(H1, __assign$1({ color: theme.colors.shades['700'].color }, { children: message }), void 0)] }, void 0));
12386
+ return (jsxs$1(Container$p, { children: [jsx$1(Icon.Actions.Check, { width: 1.25, height: 0.875, fill: "#2F806A" }, void 0), jsx$1(H1, __assign$1({ color: theme.colors.shades['700'].color }, { children: message }), void 0)] }, void 0));
11999
12387
  };
12000
- var templateObject_1$A, templateObject_2$m;
12388
+ var templateObject_1$D, templateObject_2$p;
12001
12389
 
12002
- var TableElement = newStyled.table(templateObject_1$z || (templateObject_1$z = __makeTemplateObject(["\n box-sizing: border-box;\n border-radius: 0.5rem;\n border: 0.063rem solid ", ";\n border-spacing: 0;\n font-size: 0.875rem;\n line-height: 3.125rem;\n width: 100%;\n color: ", ";\n"], ["\n box-sizing: border-box;\n border-radius: 0.5rem;\n border: 0.063rem solid ", ";\n border-spacing: 0;\n font-size: 0.875rem;\n line-height: 3.125rem;\n width: 100%;\n color: ", ";\n"])), function (props) { return props.borderColor; }, function (props) { return props.color; });
12003
- var TableCell = newStyled.td(templateObject_2$l || (templateObject_2$l = __makeTemplateObject(["\n border-bottom: 0.063rem solid ", ";\n border-right: 0.063rem solid ", ";\n padding: 0 1.25rem;\n text-align: center;\n\n &:last-child {\n border-right: none;\n }\n\n &:first-of-type {\n font-weight: 700;\n }\n"], ["\n border-bottom: 0.063rem solid ", ";\n border-right: 0.063rem solid ", ";\n padding: 0 1.25rem;\n text-align: center;\n\n &:last-child {\n border-right: none;\n }\n\n &:first-of-type {\n font-weight: 700;\n }\n"])), function (props) { return props.borderColor; }, function (props) { return props.borderColor; });
12004
- var TableHead = newStyled.th(templateObject_3$j || (templateObject_3$j = __makeTemplateObject(["\n border-bottom: 0.063rem solid ", ";\n border-right: 0.063rem solid ", ";\n font-weight: 700;\n\n &:last-child {\n border-right: none;\n }\n"], ["\n border-bottom: 0.063rem solid ", ";\n border-right: 0.063rem solid ", ";\n font-weight: 700;\n\n &:last-child {\n border-right: none;\n }\n"])), function (props) { return props.borderColor; }, function (props) { return props.borderColor; });
12390
+ var TableElement = newStyled.table(templateObject_1$C || (templateObject_1$C = __makeTemplateObject(["\n box-sizing: border-box;\n border-radius: 0.5rem;\n border: 0.063rem solid ", ";\n border-spacing: 0;\n font-size: 0.875rem;\n line-height: 3.125rem;\n width: 100%;\n color: ", ";\n"], ["\n box-sizing: border-box;\n border-radius: 0.5rem;\n border: 0.063rem solid ", ";\n border-spacing: 0;\n font-size: 0.875rem;\n line-height: 3.125rem;\n width: 100%;\n color: ", ";\n"])), function (props) { return props.borderColor; }, function (props) { return props.color; });
12391
+ var TableCell = newStyled.td(templateObject_2$o || (templateObject_2$o = __makeTemplateObject(["\n border-bottom: 0.063rem solid ", ";\n border-right: 0.063rem solid ", ";\n padding: 0 1.25rem;\n text-align: center;\n\n &:last-child {\n border-right: none;\n }\n\n &:first-of-type {\n font-weight: 700;\n }\n"], ["\n border-bottom: 0.063rem solid ", ";\n border-right: 0.063rem solid ", ";\n padding: 0 1.25rem;\n text-align: center;\n\n &:last-child {\n border-right: none;\n }\n\n &:first-of-type {\n font-weight: 700;\n }\n"])), function (props) { return props.borderColor; }, function (props) { return props.borderColor; });
12392
+ var TableHead = newStyled.th(templateObject_3$m || (templateObject_3$m = __makeTemplateObject(["\n border-bottom: 0.063rem solid ", ";\n border-right: 0.063rem solid ", ";\n font-weight: 700;\n\n &:last-child {\n border-right: none;\n }\n"], ["\n border-bottom: 0.063rem solid ", ";\n border-right: 0.063rem solid ", ";\n font-weight: 700;\n\n &:last-child {\n border-right: none;\n }\n"])), function (props) { return props.borderColor; }, function (props) { return props.borderColor; });
12005
12393
  var TableRow = newStyled.tr(templateObject_4$d || (templateObject_4$d = __makeTemplateObject(["\n &:last-child {\n td {\n border-bottom: none;\n }\n }\n\n &.background {\n background-color: ", ";\n }\n"], ["\n &:last-child {\n td {\n border-bottom: none;\n }\n }\n\n &.background {\n background-color: ", ";\n }\n"])), function (props) { return props.backgroundColor; });
12006
12394
  var SizeTable = function (_a) {
12007
12395
  var headers = _a.headers, data = _a.data;
12008
12396
  var theme = useTheme();
12009
12397
  return (jsxs$1(TableElement, __assign$1({ color: theme.colors.shades['700'].color, borderColor: theme.colors.shades['100'].color }, { children: [jsx$1("thead", { children: jsx$1(TableRow, __assign$1({ backgroundColor: theme.colors.shades['10'].color }, { children: headers.map(function (header, index) { return (jsx$1(TableHead, __assign$1({ borderColor: theme.colors.shades['100'].color }, { children: header }), index)); }) }), void 0) }, void 0), jsx$1("tbody", { children: data.map(function (row, index) { return (jsx$1(TableRow, __assign$1({ className: index % 2 !== 0 ? '' : 'background', backgroundColor: theme.colors.shades['10'].color }, { children: row.map(function (cell, index) { return (jsx$1(TableCell, __assign$1({ borderColor: theme.colors.shades['100'].color }, { children: cell }), index)); }) }), index)); }) }, void 0)] }), void 0));
12010
12398
  };
12011
- var templateObject_1$z, templateObject_2$l, templateObject_3$j, templateObject_4$d;
12399
+ var templateObject_1$C, templateObject_2$o, templateObject_3$m, templateObject_4$d;
12012
12400
 
12013
- var Img = newStyled.img(templateObject_1$y || (templateObject_1$y = __makeTemplateObject(["\n height: ", ";\n width: ", ";\n border-radius: ", ";\n object-fit: ", ";\n object-position: ", ";\n"], ["\n height: ", ";\n width: ", ";\n border-radius: ", ";\n object-fit: ", ";\n object-position: ", ";\n"])), function (props) { return props.height; }, function (props) { return props.width; }, function (props) { return props.borderRadius; }, function (props) { return props.objectFit; }, function (props) { return props.objectPosition; });
12401
+ var Img = newStyled.img(templateObject_1$B || (templateObject_1$B = __makeTemplateObject(["\n height: ", ";\n width: ", ";\n border-radius: ", ";\n object-fit: ", ";\n object-position: ", ";\n"], ["\n height: ", ";\n width: ", ";\n border-radius: ", ";\n object-fit: ", ";\n object-position: ", ";\n"])), function (props) { return props.height; }, function (props) { return props.width; }, function (props) { return props.borderRadius; }, function (props) { return props.objectFit; }, function (props) { return props.objectPosition; });
12014
12402
  var Image = function (_a) {
12015
12403
  var src = _a.src, alt = _a.alt, height = _a.height, width = _a.width, borderRadius = _a.borderRadius, objectFit = _a.objectFit, objectPosition = _a.objectPosition, className = _a.className;
12016
12404
  return (jsx$1(Img, { src: src, alt: alt, height: height, width: width, borderRadius: borderRadius, objectFit: objectFit, objectPosition: objectPosition, className: className }, void 0));
12017
12405
  };
12018
- var templateObject_1$y;
12406
+ var templateObject_1$B;
12019
12407
 
12020
- var Container$l = newStyled.div(templateObject_1$x || (templateObject_1$x = __makeTemplateObject(["\n display: flex;\n flex-direction: row;\n width: auto;\n"], ["\n display: flex;\n flex-direction: row;\n width: auto;\n"])));
12021
- var ImageContainer$1 = newStyled.div(templateObject_2$k || (templateObject_2$k = __makeTemplateObject(["\n position: relative;\n"], ["\n position: relative;\n"])));
12022
- var DescriptionContainer = newStyled.div(templateObject_3$i || (templateObject_3$i = __makeTemplateObject(["\n display: flex;\n flex-direction: column;\n ", ";\n width: 100%;\n"], ["\n display: flex;\n flex-direction: column;\n ", ";\n width: 100%;\n"])), mediaQueries({
12408
+ var Container$o = newStyled.div(templateObject_1$A || (templateObject_1$A = __makeTemplateObject(["\n display: flex;\n flex-direction: row;\n width: auto;\n"], ["\n display: flex;\n flex-direction: row;\n width: auto;\n"])));
12409
+ var ImageContainer$3 = newStyled.div(templateObject_2$n || (templateObject_2$n = __makeTemplateObject(["\n position: relative;\n"], ["\n position: relative;\n"])));
12410
+ var DescriptionContainer = newStyled.div(templateObject_3$l || (templateObject_3$l = __makeTemplateObject(["\n display: flex;\n flex-direction: column;\n ", ";\n width: 100%;\n"], ["\n display: flex;\n flex-direction: column;\n ", ";\n width: 100%;\n"])), mediaQueries({
12023
12411
  marginLeft: ['0.938rem', '1.875rem'],
12024
12412
  }));
12025
12413
  var Title$3 = newStyled.h2(function (_a) {
@@ -12051,13 +12439,13 @@ var PriceContainer = newStyled.div(templateObject_4$c || (templateObject_4$c = _
12051
12439
  })
12052
12440
  : 'justify-content: end';
12053
12441
  });
12054
- var Quantity = newStyled.div(templateObject_5$7 || (templateObject_5$7 = __makeTemplateObject(["\n position: absolute;\n right: 0;\n top: 0;\n transform: translate(30%, -30%);\n border-radius: 50%;\n width: 1.4rem;\n height: 1.4rem;\n display: flex;\n align-items: center;\n justify-content: center;\n background-color: var(--colors-shades-450-color);\n color: var(--colors-shades-450-contrast);\n font-size: 0.8rem;\n"], ["\n position: absolute;\n right: 0;\n top: 0;\n transform: translate(30%, -30%);\n border-radius: 50%;\n width: 1.4rem;\n height: 1.4rem;\n display: flex;\n align-items: center;\n justify-content: center;\n background-color: var(--colors-shades-450-color);\n color: var(--colors-shades-450-contrast);\n font-size: 0.8rem;\n"])));
12442
+ var Quantity = newStyled.div(templateObject_5$8 || (templateObject_5$8 = __makeTemplateObject(["\n position: absolute;\n right: 0;\n top: 0;\n transform: translate(30%, -30%);\n border-radius: 50%;\n width: 1.4rem;\n height: 1.4rem;\n display: flex;\n align-items: center;\n justify-content: center;\n background-color: var(--colors-shades-450-color);\n color: var(--colors-shades-450-contrast);\n font-size: 0.8rem;\n"], ["\n position: absolute;\n right: 0;\n top: 0;\n transform: translate(30%, -30%);\n border-radius: 50%;\n width: 1.4rem;\n height: 1.4rem;\n display: flex;\n align-items: center;\n justify-content: center;\n background-color: var(--colors-shades-450-color);\n color: var(--colors-shades-450-contrast);\n font-size: 0.8rem;\n"])));
12055
12443
  var SimpleOrderItem = function (_a) {
12056
12444
  var title = _a.title, subtitle = _a.subtitle, image = _a.image, price = _a.price, tag = _a.tag, quantity = _a.quantity, finalPriceStyle = _a.finalPriceStyle;
12057
12445
  var theme = useTheme();
12058
- return (jsxs$1(Container$l, { children: [jsxs$1(ImageContainer$1, { children: [jsx$1(Image, { src: image.src, alt: image.alt, width: "4.063rem", height: "5.375rem", objectFit: "cover", objectPosition: "center" }, void 0), quantity ? jsx$1(Quantity, __assign$1({ "data-testid": "order-item-quantity" }, { children: quantity }), void 0) : null] }, void 0), jsxs$1(DescriptionContainer, __assign$1({ "data-testid": "order-item-description-container", theme: theme }, { children: [jsx$1(Title$3, __assign$1({ color: theme.colors.shades['700'].color, "data-testid": "product-title" }, { children: title }), void 0), jsx$1(Subtitle, __assign$1({ color: theme.colors.shades['700'].color, "data-testid": "product-variant-title" }, { children: subtitle }), void 0), jsxs$1(PriceContainer, __assign$1({ "data-testid": "order-item-price-container", withTag: !!tag, theme: theme }, { children: [tag && (jsx$1(OfferBanner, { discountAppliedText: tag === null || tag === void 0 ? void 0 : tag.text, backgroundColor: tag === null || tag === void 0 ? void 0 : tag.backgroundColor }, void 0)), jsx$1(PriceLabel, { finalPrice: price.finalPrice, originalPrice: price.originalPrice, color: price.color || theme.colors.shades['700'].color, size: ComponentSize.Small, finalPriceStyle: finalPriceStyle }, void 0)] }), void 0)] }), void 0)] }, void 0));
12446
+ return (jsxs$1(Container$o, { children: [jsxs$1(ImageContainer$3, { children: [jsx$1(Image, { src: image.src, alt: image.alt, width: "4.063rem", height: "5.375rem", objectFit: "cover", objectPosition: "center" }, void 0), quantity ? jsx$1(Quantity, __assign$1({ "data-testid": "order-item-quantity" }, { children: quantity }), void 0) : null] }, void 0), jsxs$1(DescriptionContainer, __assign$1({ "data-testid": "order-item-description-container", theme: theme }, { children: [jsx$1(Title$3, __assign$1({ color: theme.colors.shades['700'].color, "data-testid": "product-title" }, { children: title }), void 0), jsx$1(Subtitle, __assign$1({ color: theme.colors.shades['700'].color, "data-testid": "product-variant-title" }, { children: subtitle }), void 0), jsxs$1(PriceContainer, __assign$1({ "data-testid": "order-item-price-container", withTag: !!tag, theme: theme }, { children: [tag && (jsx$1(OfferBanner, { discountAppliedText: tag === null || tag === void 0 ? void 0 : tag.text, backgroundColor: tag === null || tag === void 0 ? void 0 : tag.backgroundColor }, void 0)), jsx$1(PriceLabel, { finalPrice: price.finalPrice, originalPrice: price.originalPrice, color: price.color || theme.colors.shades['700'].color, size: ComponentSize.Small, finalPriceStyle: finalPriceStyle }, void 0)] }), void 0)] }), void 0)] }, void 0));
12059
12447
  };
12060
- var templateObject_1$x, templateObject_2$k, templateObject_3$i, templateObject_4$c, templateObject_5$7;
12448
+ var templateObject_1$A, templateObject_2$n, templateObject_3$l, templateObject_4$c, templateObject_5$8;
12061
12449
 
12062
12450
  function formatDate(date) {
12063
12451
  var day = date.getDate();
@@ -12066,18 +12454,18 @@ function formatDate(date) {
12066
12454
  return month < 10 ? "".concat(day, "/0").concat(month, "/").concat(year) : "".concat(day, "/").concat(month, "/").concat(year);
12067
12455
  }
12068
12456
 
12069
- var Container$k = newStyled.div(templateObject_1$w || (templateObject_1$w = __makeTemplateObject(["\n display: flex;\n flex-direction: column;\n width: auto;\n color: #292929;\n"], ["\n display: flex;\n flex-direction: column;\n width: auto;\n color: #292929;\n"])));
12070
- var Heading = newStyled.div(templateObject_2$j || (templateObject_2$j = __makeTemplateObject(["\n display: flex;\n flex-direction: row;\n justify-content: space-between;\n width: 100%;\n ", ";\n text-align: right;\n margin-bottom: 10px;\n"], ["\n display: flex;\n flex-direction: row;\n justify-content: space-between;\n width: 100%;\n ", ";\n text-align: right;\n margin-bottom: 10px;\n"])), mediaQueries({
12457
+ var Container$n = newStyled.div(templateObject_1$z || (templateObject_1$z = __makeTemplateObject(["\n display: flex;\n flex-direction: column;\n width: auto;\n color: #292929;\n"], ["\n display: flex;\n flex-direction: column;\n width: auto;\n color: #292929;\n"])));
12458
+ var Heading = newStyled.div(templateObject_2$m || (templateObject_2$m = __makeTemplateObject(["\n display: flex;\n flex-direction: row;\n justify-content: space-between;\n width: 100%;\n ", ";\n text-align: right;\n margin-bottom: 10px;\n"], ["\n display: flex;\n flex-direction: row;\n justify-content: space-between;\n width: 100%;\n ", ";\n text-align: right;\n margin-bottom: 10px;\n"])), mediaQueries({
12071
12459
  fontSize: ['14px', '16px'],
12072
12460
  lineHeight: ['22px', '24px'],
12073
12461
  }));
12074
- var Content = newStyled.div(templateObject_3$h || (templateObject_3$h = __makeTemplateObject(["\n display: flex;\n justify-content: space-between;\n ", ";\n"], ["\n display: flex;\n justify-content: space-between;\n ", ";\n"])), mediaQueries({
12462
+ var Content = newStyled.div(templateObject_3$k || (templateObject_3$k = __makeTemplateObject(["\n display: flex;\n justify-content: space-between;\n ", ";\n"], ["\n display: flex;\n justify-content: space-between;\n ", ";\n"])), mediaQueries({
12075
12463
  flexDirection: ['column', 'row'],
12076
12464
  }));
12077
12465
  var ReviewContainer = newStyled.div(templateObject_4$b || (templateObject_4$b = __makeTemplateObject(["\n display: flex;\n flex-direction: column;\n ", ";\n"], ["\n display: flex;\n flex-direction: column;\n ", ";\n"])), mediaQueries({
12078
12466
  margin: ['0 0 8px 0', '0 50px 0 0'],
12079
12467
  }));
12080
- var H2$1 = newStyled.h2(templateObject_5$6 || (templateObject_5$6 = __makeTemplateObject(["\n font-weight: 600;\n ", ";\n margin: 0;\n"], ["\n font-weight: 600;\n ", ";\n margin: 0;\n"])), mediaQueries({
12468
+ var H2$1 = newStyled.h2(templateObject_5$7 || (templateObject_5$7 = __makeTemplateObject(["\n font-weight: 600;\n ", ";\n margin: 0;\n"], ["\n font-weight: 600;\n ", ";\n margin: 0;\n"])), mediaQueries({
12081
12469
  fontSize: ['16px', '18px'],
12082
12470
  lineHeight: ['24px', '28px'],
12083
12471
  }));
@@ -12089,17 +12477,17 @@ var P$1 = newStyled.p(templateObject_7$2 || (templateObject_7$2 = __makeTemplate
12089
12477
  var Review = function (_a) {
12090
12478
  var reviewerName = _a.reviewerName, date = _a.date, rating = _a.rating, stars = _a.stars, title = _a.title, description = _a.description, image = _a.image;
12091
12479
  var theme = useTheme();
12092
- return (jsxs$1(Container$k, { children: [jsxs$1(Heading, __assign$1({ theme: theme }, { children: [jsx$1(H2$1, __assign$1({ theme: theme }, { children: reviewerName }), void 0), formatDate(date)] }), void 0), jsx$1(StarList, { starsNumber: 5, rating: rating, fill: stars.color, size: stars.size }, void 0), jsxs$1(Content, __assign$1({ "data-testid": "review-content", theme: theme }, { children: [jsxs$1(ReviewContainer, __assign$1({ theme: theme }, { children: [jsx$1(H3$1, __assign$1({ theme: theme }, { children: title }), void 0), jsx$1(P$1, { children: description }, void 0)] }), void 0), jsx$1(Image, { src: image.src, alt: image.alt, width: "7.5rem", height: "10rem" }, void 0)] }), void 0)] }, void 0));
12480
+ return (jsxs$1(Container$n, { children: [jsxs$1(Heading, __assign$1({ theme: theme }, { children: [jsx$1(H2$1, __assign$1({ theme: theme }, { children: reviewerName }), void 0), formatDate(date)] }), void 0), jsx$1(StarList, { starsNumber: 5, rating: rating, fill: stars.color, size: stars.size }, void 0), jsxs$1(Content, __assign$1({ "data-testid": "review-content", theme: theme }, { children: [jsxs$1(ReviewContainer, __assign$1({ theme: theme }, { children: [jsx$1(H3$1, __assign$1({ theme: theme }, { children: title }), void 0), jsx$1(P$1, { children: description }, void 0)] }), void 0), jsx$1(Image, { src: image.src, alt: image.alt, width: "7.5rem", height: "10rem" }, void 0)] }), void 0)] }, void 0));
12093
12481
  };
12094
- var templateObject_1$w, templateObject_2$j, templateObject_3$h, templateObject_4$b, templateObject_5$6, templateObject_6$5, templateObject_7$2;
12482
+ var templateObject_1$z, templateObject_2$m, templateObject_3$k, templateObject_4$b, templateObject_5$7, templateObject_6$5, templateObject_7$2;
12095
12483
 
12096
- var List = newStyled.ul(templateObject_1$v || (templateObject_1$v = __makeTemplateObject(["\n display: flex;\n margin: 0;\n padding: 0;\n"], ["\n display: flex;\n margin: 0;\n padding: 0;\n"])));
12097
- var Item$1 = newStyled.li(templateObject_2$i || (templateObject_2$i = __makeTemplateObject(["\n width: 1.25rem;\n list-style: none;\n margin-right: 1.5rem;\n position: relative;\n line-height: 0;\n\n &:last-child {\n margin-right: 0;\n }\n\n &:hover {\n .dropdownWrapper {\n visibility: visible;\n }\n }\n"], ["\n width: 1.25rem;\n list-style: none;\n margin-right: 1.5rem;\n position: relative;\n line-height: 0;\n\n &:last-child {\n margin-right: 0;\n }\n\n &:hover {\n .dropdownWrapper {\n visibility: visible;\n }\n }\n"])));
12098
- var DropdownWrapper = newStyled.div(templateObject_3$g || (templateObject_3$g = __makeTemplateObject(["\n right: -0.938rem;\n min-width: 9.375rem;\n position: absolute;\n padding-top: 0.625rem;\n margin-top: -0.188rem;\n width: max-content;\n visibility: hidden;\n"], ["\n right: -0.938rem;\n min-width: 9.375rem;\n position: absolute;\n padding-top: 0.625rem;\n margin-top: -0.188rem;\n width: max-content;\n visibility: hidden;\n"])));
12484
+ var List = newStyled.ul(templateObject_1$y || (templateObject_1$y = __makeTemplateObject(["\n display: flex;\n margin: 0;\n padding: 0;\n"], ["\n display: flex;\n margin: 0;\n padding: 0;\n"])));
12485
+ var Item$1 = newStyled.li(templateObject_2$l || (templateObject_2$l = __makeTemplateObject(["\n width: 1.25rem;\n list-style: none;\n margin-right: 1.5rem;\n position: relative;\n line-height: 0;\n\n &:last-child {\n margin-right: 0;\n }\n\n &:hover {\n .dropdownWrapper {\n visibility: visible;\n }\n }\n"], ["\n width: 1.25rem;\n list-style: none;\n margin-right: 1.5rem;\n position: relative;\n line-height: 0;\n\n &:last-child {\n margin-right: 0;\n }\n\n &:hover {\n .dropdownWrapper {\n visibility: visible;\n }\n }\n"])));
12486
+ var DropdownWrapper = newStyled.div(templateObject_3$j || (templateObject_3$j = __makeTemplateObject(["\n right: -0.938rem;\n min-width: 9.375rem;\n position: absolute;\n padding-top: 0.625rem;\n margin-top: -0.188rem;\n width: max-content;\n visibility: hidden;\n"], ["\n right: -0.938rem;\n min-width: 9.375rem;\n position: absolute;\n padding-top: 0.625rem;\n margin-top: -0.188rem;\n width: max-content;\n visibility: hidden;\n"])));
12099
12487
  var ArrowContainer$1 = newStyled.div(templateObject_4$a || (templateObject_4$a = __makeTemplateObject(["\n transform: rotate(180deg);\n display: flex;\n justify-content: flex-start;\n margin-bottom: -0.063rem;\n padding-left: 0.938rem;\n"], ["\n transform: rotate(180deg);\n display: flex;\n justify-content: flex-start;\n margin-bottom: -0.063rem;\n padding-left: 0.938rem;\n"])));
12100
- var StyledDropdown = newStyled.ul(templateObject_5$5 || (templateObject_5$5 = __makeTemplateObject(["\n margin: 0;\n padding: 0;\n border: 0.063rem solid ", ";\n border-radius: 0.5rem;\n display: flex;\n flex-direction: column;\n background-color: #ffffff;\n"], ["\n margin: 0;\n padding: 0;\n border: 0.063rem solid ", ";\n border-radius: 0.5rem;\n display: flex;\n flex-direction: column;\n background-color: #ffffff;\n"])), function (props) { return props.borderColor; });
12488
+ var StyledDropdown = newStyled.ul(templateObject_5$6 || (templateObject_5$6 = __makeTemplateObject(["\n margin: 0;\n padding: 0;\n border: 0.063rem solid ", ";\n border-radius: 0.5rem;\n display: flex;\n flex-direction: column;\n background-color: #ffffff;\n"], ["\n margin: 0;\n padding: 0;\n border: 0.063rem solid ", ";\n border-radius: 0.5rem;\n display: flex;\n flex-direction: column;\n background-color: #ffffff;\n"])), function (props) { return props.borderColor; });
12101
12489
  var DropdownItem = newStyled.li(templateObject_6$4 || (templateObject_6$4 = __makeTemplateObject(["\n list-style: none;\n padding: 0.813rem;\n border-bottom: 0.063rem solid ", ";\n font-size: 0.875rem;\n line-height: 1.125rem;\n font-weight: 400;\n color: ", ";\n cursor: pointer;\n user-select: none;\n\n &:hover {\n background-color: ", ";\n }\n\n &:last-child {\n border-bottom: none;\n border-radius: 0 0 0.5rem 0.5rem;\n }\n\n &:first-of-type {\n border-radius: 0.5rem 0.5rem 0 0;\n }\n\n &:only-child {\n border-radius: 0.5rem;\n }\n"], ["\n list-style: none;\n padding: 0.813rem;\n border-bottom: 0.063rem solid ", ";\n font-size: 0.875rem;\n line-height: 1.125rem;\n font-weight: 400;\n color: ", ";\n cursor: pointer;\n user-select: none;\n\n &:hover {\n background-color: ", ";\n }\n\n &:last-child {\n border-bottom: none;\n border-radius: 0 0 0.5rem 0.5rem;\n }\n\n &:first-of-type {\n border-radius: 0.5rem 0.5rem 0 0;\n }\n\n &:only-child {\n border-radius: 0.5rem;\n }\n"])), function (props) { return props.borderColor; }, function (props) { return props.color; }, function (props) { return props.hoverColor; });
12102
- var templateObject_1$v, templateObject_2$i, templateObject_3$g, templateObject_4$a, templateObject_5$5, templateObject_6$4;
12490
+ var templateObject_1$y, templateObject_2$l, templateObject_3$j, templateObject_4$a, templateObject_5$6, templateObject_6$4;
12103
12491
 
12104
12492
  var DropdownListIcons = function (_a) {
12105
12493
  var items = _a.items;
@@ -12112,7 +12500,7 @@ var Dropdown = function (_a) {
12112
12500
  return (jsxs$1(DropdownWrapper, __assign$1({ className: "dropdownWrapper", "data-testid": "Dropdown-wrapper" }, { children: [jsx$1(ArrowContainer$1, { children: jsx$1(TooltipArrow, { stroke: theme.colors.shades['200'].color, fill: "#fff", width: 1.25, height: 0.75 }, void 0) }, void 0), jsx$1(StyledDropdown, __assign$1({ borderColor: theme.colors.shades['200'].color }, { children: items.map(function (item, index) { return (jsx$1(DropdownItem, __assign$1({ onClick: item.callback, borderColor: theme.colors.shades['200'].color, color: theme.colors.shades['550'].color, hoverColor: theme.colors.shades['10'].color }, { children: item.description }), index)); }) }), void 0)] }), void 0));
12113
12501
  };
12114
12502
 
12115
- var StyledButton = newStyled(BaseButton)(templateObject_1$u || (templateObject_1$u = __makeTemplateObject(["\n width: 12.5rem;\n height: 2.5rem;\n background-color: ", ";\n cursor: pointer;\n border: none;\n\n &:hover {\n background-color: ", ";\n }\n"], ["\n width: 12.5rem;\n height: 2.5rem;\n background-color: ", ";\n cursor: pointer;\n border: none;\n\n &:hover {\n background-color: ", ";\n }\n"])), function (props) { return props.backgroundColor; }, function (props) { return props.hoverBackgroundColor; });
12503
+ var StyledButton = newStyled(BaseButton)(templateObject_1$x || (templateObject_1$x = __makeTemplateObject(["\n width: 12.5rem;\n height: 2.5rem;\n background-color: ", ";\n cursor: pointer;\n border: none;\n\n &:hover {\n background-color: ", ";\n }\n"], ["\n width: 12.5rem;\n height: 2.5rem;\n background-color: ", ";\n cursor: pointer;\n border: none;\n\n &:hover {\n background-color: ", ";\n }\n"])), function (props) { return props.backgroundColor; }, function (props) { return props.hoverBackgroundColor; });
12116
12504
  var AmazonButton = function (_a) {
12117
12505
  var onClick = _a.onClick;
12118
12506
  return (jsx$1(StyledButton, __assign$1({ backgroundColor: "#FED865", hoverBackgroundColor: "#F1CB58", onClick: onClick }, { children: jsx$1(Icon.Payment.Amazon, { width: 5.375, height: 1.25 }, void 0) }), void 0));
@@ -12121,23 +12509,23 @@ var PaypalButton = function (_a) {
12121
12509
  var onClick = _a.onClick;
12122
12510
  return (jsx$1(StyledButton, __assign$1({ backgroundColor: "#ffc439", hoverBackgroundColor: "#F4BF41", onClick: onClick }, { children: jsx$1(Icon.Payment.Paypal, { width: 4.938, height: 1.25 }, void 0) }), void 0));
12123
12511
  };
12124
- var templateObject_1$u;
12512
+ var templateObject_1$x;
12125
12513
 
12126
- var Wrapper = newStyled.div(templateObject_1$t || (templateObject_1$t = __makeTemplateObject(["\n display: flex;\n align-items: center;\n padding: 0.625rem 1.25rem;\n background-color: ", ";\n width: 36.875rem;\n max-width: 100%;\n border-radius: 0.5rem;\n\n img {\n margin-right: ", ";\n }\n"], ["\n display: flex;\n align-items: center;\n padding: 0.625rem 1.25rem;\n background-color: ", ";\n width: 36.875rem;\n max-width: 100%;\n border-radius: 0.5rem;\n\n img {\n margin-right: ", ";\n }\n"])), function (props) { return props.backgroundColor; }, function (props) { return (props.rightToLeft ? '0' : '1.25rem'); });
12127
- var Col = newStyled.div(templateObject_2$h || (templateObject_2$h = __makeTemplateObject(["\n display: flex;\n flex-direction: column;\n"], ["\n display: flex;\n flex-direction: column;\n"])));
12128
- var Row = newStyled.div(templateObject_3$f || (templateObject_3$f = __makeTemplateObject(["\n display: flex;\n align-items: center;\n width: 100%;\n margin-left: 10px;\n\n ", "};\n"], ["\n display: flex;\n align-items: center;\n width: 100%;\n margin-left: 10px;\n\n ", "};\n"])), function (props) {
12514
+ var Wrapper = newStyled.div(templateObject_1$w || (templateObject_1$w = __makeTemplateObject(["\n display: flex;\n align-items: center;\n padding: 0.625rem 1.25rem;\n background-color: ", ";\n width: 36.875rem;\n max-width: 100%;\n border-radius: 0.5rem;\n\n img {\n margin-right: ", ";\n }\n"], ["\n display: flex;\n align-items: center;\n padding: 0.625rem 1.25rem;\n background-color: ", ";\n width: 36.875rem;\n max-width: 100%;\n border-radius: 0.5rem;\n\n img {\n margin-right: ", ";\n }\n"])), function (props) { return props.backgroundColor; }, function (props) { return (props.rightToLeft ? '0' : '1.25rem'); });
12515
+ var Col = newStyled.div(templateObject_2$k || (templateObject_2$k = __makeTemplateObject(["\n display: flex;\n flex-direction: column;\n"], ["\n display: flex;\n flex-direction: column;\n"])));
12516
+ var Row = newStyled.div(templateObject_3$i || (templateObject_3$i = __makeTemplateObject(["\n display: flex;\n align-items: center;\n width: 100%;\n margin-left: 10px;\n\n ", "};\n"], ["\n display: flex;\n align-items: center;\n width: 100%;\n margin-left: 10px;\n\n ", "};\n"])), function (props) {
12129
12517
  return props.rightToLeft &&
12130
12518
  "\n flex-direction: row-reverse;\n justify-content: space-between;\n ";
12131
12519
  });
12132
12520
  var H5 = newStyled.h5(templateObject_4$9 || (templateObject_4$9 = __makeTemplateObject(["\n font-size: 0.875rem;\n line-height: 1.375rem;\n font-weight: 500;\n margin-bottom: 0.125rem;\n margin: 0;\n color: ", ";\n"], ["\n font-size: 0.875rem;\n line-height: 1.375rem;\n font-weight: 500;\n margin-bottom: 0.125rem;\n margin: 0;\n color: ", ";\n"])), function (props) { return props.color; });
12133
- var H3 = newStyled.h3(templateObject_5$4 || (templateObject_5$4 = __makeTemplateObject(["\n font-size: 1.125rem;\n line-height: 1.75rem;\n font-weight: 700;\n margin: 0;\n color: ", ";\n"], ["\n font-size: 1.125rem;\n line-height: 1.75rem;\n font-weight: 700;\n margin: 0;\n color: ", ";\n"])), function (props) { return props.color; });
12521
+ var H3 = newStyled.h3(templateObject_5$5 || (templateObject_5$5 = __makeTemplateObject(["\n font-size: 1.125rem;\n line-height: 1.75rem;\n font-weight: 700;\n margin: 0;\n color: ", ";\n"], ["\n font-size: 1.125rem;\n line-height: 1.75rem;\n font-weight: 700;\n margin: 0;\n color: ", ";\n"])), function (props) { return props.color; });
12134
12522
  var FreeShipping = newStyled.span(templateObject_6$3 || (templateObject_6$3 = __makeTemplateObject(["\n font-weight: 600;\n color: ", ";\n"], ["\n font-weight: 600;\n color: ", ";\n"])), function (props) { return props.color; });
12135
12523
  var CrossSellCheckbox = function (_a) {
12136
12524
  var imageURL = _a.imageURL, title = _a.title, description = _a.description, freeShippingText = _a.freeShippingText, rightToLeft = _a.rightToLeft, onChange = _a.onChange;
12137
12525
  var theme = useTheme();
12138
12526
  return (jsxs$1(Wrapper, __assign$1({ backgroundColor: theme.colors.shades['10'].color, rightToLeft: Boolean(rightToLeft) }, { children: [jsx$1(Checkbox, { text: "", id: "checkbox", onChange: onChange, size: ComponentSize.Small, variant: "secondary" }, void 0), jsxs$1(Row, __assign$1({ rightToLeft: Boolean(rightToLeft) }, { children: [jsx$1(Image, { src: imageURL, alt: "Cross sell image", borderRadius: "0.5rem" }, void 0), jsxs$1(Col, { children: [jsx$1(H5, __assign$1({ color: theme.colors.shades['700'].color }, { children: title }), void 0), jsxs$1(H3, __assign$1({ color: theme.colors.semantic.urgent.color }, { children: [description, jsxs$1(FreeShipping, __assign$1({ color: theme.colors.shades['700'].color }, { children: [' ', "+ ", freeShippingText] }), void 0)] }), void 0)] }, void 0)] }), void 0)] }), void 0));
12139
12527
  };
12140
- var templateObject_1$t, templateObject_2$h, templateObject_3$f, templateObject_4$9, templateObject_5$4, templateObject_6$3;
12528
+ var templateObject_1$w, templateObject_2$k, templateObject_3$i, templateObject_4$9, templateObject_5$5, templateObject_6$3;
12141
12529
 
12142
12530
  var index = /*#__PURE__*/Object.freeze({
12143
12531
  __proto__: null,
@@ -12150,7 +12538,7 @@ var Spacing = function (_a) {
12150
12538
  return jsx$1("div", __assign$1({ style: style }, { children: children }), void 0);
12151
12539
  };
12152
12540
 
12153
- var ImageContainer = newStyled.div(function (_a) {
12541
+ var ImageContainer$2 = newStyled.div(function (_a) {
12154
12542
  var width = _a.width, height = _a.height;
12155
12543
  return ({
12156
12544
  position: 'relative',
@@ -12158,8 +12546,9 @@ var ImageContainer = newStyled.div(function (_a) {
12158
12546
  height: height,
12159
12547
  });
12160
12548
  });
12161
- var Container$j = newStyled.a(templateObject_1$s || (templateObject_1$s = __makeTemplateObject(["\n display: flex;\n flex-direction: column;\n align-items: center;\n width: min-content;\n text-decoration: none;\n"], ["\n display: flex;\n flex-direction: column;\n align-items: center;\n width: min-content;\n text-decoration: none;\n"])));
12162
- var Title$2 = newStyled.p(templateObject_2$g || (templateObject_2$g = __makeTemplateObject(["\n font-size: 0.83rem;\n font-weight: normal;\n line-height: 1.375rem;\n min-height: 2.75rem;\n text-align: center;\n color: ", ";\n margin: 0.25rem 0;\n text-align: ", ";\n"], ["\n font-size: 0.83rem;\n font-weight: normal;\n line-height: 1.375rem;\n min-height: 2.75rem;\n text-align: center;\n color: ", ";\n margin: 0.25rem 0;\n text-align: ", ";\n"])), function (props) { return props.theme.colors.pallete.secondary.color; }, function (props) { return props.align; });
12549
+ var ImageHoverContainer = newStyled.img(templateObject_1$v || (templateObject_1$v = __makeTemplateObject(["\n opacity: 0;\n position: absolute;\n transition: all 0.4s ease-in-out;\n"], ["\n opacity: 0;\n position: absolute;\n transition: all 0.4s ease-in-out;\n"])));
12550
+ var Container$m = newStyled.a(templateObject_2$j || (templateObject_2$j = __makeTemplateObject(["\n display: flex;\n flex-direction: column;\n align-items: center;\n width: min-content;\n text-decoration: none;\n\n &:hover .hover__image {\n opacity: 1;\n }\n"], ["\n display: flex;\n flex-direction: column;\n align-items: center;\n width: min-content;\n text-decoration: none;\n\n &:hover .hover__image {\n opacity: 1;\n }\n"])));
12551
+ var Title$2 = newStyled.p(templateObject_3$h || (templateObject_3$h = __makeTemplateObject(["\n font-size: 0.83rem;\n font-weight: normal;\n line-height: 1.375rem;\n min-height: 2.75rem;\n text-align: center;\n color: ", ";\n margin: 0.25rem 0;\n text-align: ", ";\n"], ["\n font-size: 0.83rem;\n font-weight: normal;\n line-height: 1.375rem;\n min-height: 2.75rem;\n text-align: center;\n color: ", ";\n margin: 0.25rem 0;\n text-align: ", ";\n"])), function (props) { return props.theme.colors.pallete.secondary.color; }, function (props) { return props.align; });
12163
12552
  var getStylesBySize = function (size) {
12164
12553
  switch (size) {
12165
12554
  case ComponentSize.Medium:
@@ -12185,10 +12574,10 @@ var getStylesBySize = function (size) {
12185
12574
  };
12186
12575
  }
12187
12576
  };
12188
- var TopTagContainer$1 = newStyled.div(templateObject_3$e || (templateObject_3$e = __makeTemplateObject(["\n position: absolute;\n left: 0;\n top: 0;\n width: inherit;\n"], ["\n position: absolute;\n left: 0;\n top: 0;\n width: inherit;\n"])));
12189
- var BottomTagContainer$1 = newStyled.div(templateObject_4$8 || (templateObject_4$8 = __makeTemplateObject(["\n position: absolute;\n bottom: 15%;\n left: 0;\n width: inherit;\n"], ["\n position: absolute;\n bottom: 15%;\n left: 0;\n width: inherit;\n"])));
12577
+ var TopTagContainer$1 = newStyled.div(templateObject_4$8 || (templateObject_4$8 = __makeTemplateObject(["\n position: absolute;\n left: 0;\n top: 0;\n width: inherit;\n"], ["\n position: absolute;\n left: 0;\n top: 0;\n width: inherit;\n"])));
12578
+ var BottomTagContainer$1 = newStyled.div(templateObject_5$4 || (templateObject_5$4 = __makeTemplateObject(["\n position: absolute;\n bottom: 15%;\n left: 0;\n width: inherit;\n"], ["\n position: absolute;\n bottom: 15%;\n left: 0;\n width: inherit;\n"])));
12190
12579
  var ProductItemMobile = function (_a) {
12191
- var title = _a.title, image = _a.image, price = _a.price, rating = _a.rating, size = _a.size, _b = _a.alignName, alignName = _b === void 0 ? 'center' : _b, url = _a.url, className = _a.className, topTag = _a.topTag, bottomTag = _a.bottomTag, onClick = _a.onClick, _c = _a.priceDisplayType, priceDisplayType = _c === void 0 ? 'default' : _c;
12580
+ var title = _a.title, image = _a.image, imageHover = _a.imageHover, price = _a.price, rating = _a.rating, size = _a.size, _b = _a.alignName, alignName = _b === void 0 ? 'center' : _b, url = _a.url, className = _a.className, topTag = _a.topTag, bottomTag = _a.bottomTag, onClick = _a.onClick, _c = _a.priceDisplayType, priceDisplayType = _c === void 0 ? 'default' : _c;
12192
12581
  var theme = useTheme();
12193
12582
  var styles = getStylesBySize(size);
12194
12583
  var space = useMemo(function () {
@@ -12199,32 +12588,32 @@ var ProductItemMobile = function (_a) {
12199
12588
  _a[ComponentSize.Small] = 2,
12200
12589
  _a)[size];
12201
12590
  }, [size]);
12202
- return (jsxs(Container$j, __assign$1({ as: url ? 'a' : 'div', href: url, className: className, onClick: onClick }, { children: [!!topTag || !!bottomTag ? (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(TopTagContainer$1, { children: topTag }, void 0), jsx(BottomTagContainer$1, { children: bottomTag }, 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(Title$2, __assign$1({ theme: theme, align: alignName }, { children: title }), void 0), jsx(Spacing, { size: space }, void 0), priceDisplayType === 'styled' ? (jsx(PriceLabelV2, { finalPrice: price.finalPrice, originalPrice: price.originalPrice, finalPriceStyled: false, color: price.color, size: ComponentSize.Large, testId: "volume-discount" }, void 0)) : (jsx(PriceLabel, { finalPrice: price.finalPrice, originalPrice: price.originalPrice, finalPriceStyled: false, color: price.color, size: ComponentSize.Medium, 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));
12591
+ return (jsxs(Container$m, __assign$1({ as: url ? 'a' : 'div', href: url, className: className, onClick: onClick }, { children: [!!topTag || !!bottomTag ? (jsxs(ImageContainer$2, __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(TopTagContainer$1, { children: topTag }, void 0), jsx(BottomTagContainer$1, { children: bottomTag }, 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)), imageHover ? (jsx(ImageHoverContainer, { className: "hover__image", src: imageHover.src, alt: imageHover.alt, width: styles === null || styles === void 0 ? void 0 : styles.width, height: styles === null || styles === void 0 ? void 0 : styles.height }, void 0)) : null, jsx(Spacing, { size: space }, void 0), jsx(Title$2, __assign$1({ theme: theme, align: alignName }, { children: title }), void 0), jsx(Spacing, { size: space }, void 0), priceDisplayType === 'styled' ? (jsx(PriceLabelV2, { finalPrice: price.finalPrice, originalPrice: price.originalPrice, finalPriceStyled: false, color: price.color, size: ComponentSize.Large, testId: "volume-discount" }, void 0)) : (jsx(PriceLabel, { finalPrice: price.finalPrice, originalPrice: price.originalPrice, finalPriceStyled: false, color: price.color, size: ComponentSize.Medium, 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));
12203
12592
  };
12204
- var templateObject_1$s, templateObject_2$g, templateObject_3$e, templateObject_4$8;
12593
+ var templateObject_1$v, templateObject_2$j, templateObject_3$h, templateObject_4$8, templateObject_5$4;
12205
12594
 
12206
- var Container$i = newStyled.div(templateObject_1$r || (templateObject_1$r = __makeTemplateObject(["\n display: flex;\n row-gap: 1.875rem;\n column-gap: 1.875rem;\n flex-wrap: wrap;\n"], ["\n display: flex;\n row-gap: 1.875rem;\n column-gap: 1.875rem;\n flex-wrap: wrap;\n"])));
12595
+ var Container$l = newStyled.div(templateObject_1$u || (templateObject_1$u = __makeTemplateObject(["\n display: flex;\n row-gap: 1.875rem;\n column-gap: 1.875rem;\n flex-wrap: wrap;\n"], ["\n display: flex;\n row-gap: 1.875rem;\n column-gap: 1.875rem;\n flex-wrap: wrap;\n"])));
12207
12596
  function withProductGrid(ProductItemComponent, data) {
12208
12597
  function WithProductGrid(props) {
12209
- return (jsx$1(Container$i, __assign$1({ "data-testid": "product-grid-container" }, { children: data.map(function (product, index) { return (jsx$1(ProductItemComponent, __assign$1({}, product, props), index)); }) }), void 0));
12598
+ return (jsx$1(Container$l, __assign$1({ "data-testid": "product-grid-container" }, { children: data.map(function (product, index) { return (jsx$1(ProductItemComponent, __assign$1({}, product, props), index)); }) }), void 0));
12210
12599
  }
12211
12600
  /* istanbul ignore next */
12212
12601
  var wrappedComponentName = ProductItemComponent.displayName || ProductItemComponent.name || 'Component';
12213
12602
  WithProductGrid.displayName = "withGrid(".concat(wrappedComponentName, ")");
12214
12603
  return WithProductGrid;
12215
12604
  }
12216
- var templateObject_1$r;
12605
+ var templateObject_1$u;
12217
12606
 
12218
12607
  var Collection = {
12219
12608
  ProductItemMobile: ProductItemMobile,
12220
12609
  withProductGrid: withProductGrid,
12221
12610
  };
12222
12611
 
12223
- var Backdrop = newStyled.div(templateObject_1$q || (templateObject_1$q = __makeTemplateObject(["\n position: fixed;\n z-index: 2;\n left: 0;\n top: 0;\n width: 100%;\n height: 100%;\n overflow: auto;\n transition: background-color 0.3s ease-out;\n\n ", "\n"], ["\n position: fixed;\n z-index: 2;\n left: 0;\n top: 0;\n width: 100%;\n height: 100%;\n overflow: auto;\n transition: background-color 0.3s ease-out;\n\n ", "\n"])), function (_a) {
12612
+ var Backdrop = newStyled.div(templateObject_1$t || (templateObject_1$t = __makeTemplateObject(["\n position: fixed;\n z-index: 2;\n left: 0;\n top: 0;\n width: 100%;\n height: 100%;\n overflow: auto;\n transition: background-color 0.3s ease-out;\n\n ", "\n"], ["\n position: fixed;\n z-index: 2;\n left: 0;\n top: 0;\n width: 100%;\n height: 100%;\n overflow: auto;\n transition: background-color 0.3s ease-out;\n\n ", "\n"])), function (_a) {
12224
12613
  var isOpen = _a.isOpen, backgroundColor = _a.backgroundColor;
12225
12614
  return isOpen ? "background-color: ".concat(backgroundColor, ";") : 'transparent';
12226
12615
  });
12227
- var Sidebar = newStyled.div(templateObject_2$f || (templateObject_2$f = __makeTemplateObject(["\n height: 100%;\n width: ", ";\n position: fixed;\n z-index: 30;\n ", ": 0;\n top: 0;\n background-color: ", ";\n overflow-x: hidden;\n transition: transform 0.3s ease-in-out;\n\n ", "\n"], ["\n height: 100%;\n width: ", ";\n position: fixed;\n z-index: 30;\n ", ": 0;\n top: 0;\n background-color: ", ";\n overflow-x: hidden;\n transition: transform 0.3s ease-in-out;\n\n ", "\n"])), function (_a) {
12616
+ var Sidebar = newStyled.div(templateObject_2$i || (templateObject_2$i = __makeTemplateObject(["\n height: 100%;\n width: ", ";\n position: fixed;\n z-index: 30;\n ", ": 0;\n top: 0;\n background-color: ", ";\n overflow-x: hidden;\n transition: transform 0.3s ease-in-out;\n\n ", "\n"], ["\n height: 100%;\n width: ", ";\n position: fixed;\n z-index: 30;\n ", ": 0;\n top: 0;\n background-color: ", ";\n overflow-x: hidden;\n transition: transform 0.3s ease-in-out;\n\n ", "\n"])), function (_a) {
12228
12617
  var width = _a.width;
12229
12618
  return width;
12230
12619
  }, function (_a) {
@@ -12265,28 +12654,28 @@ var Drawer = function (_a) {
12265
12654
  }, [isOpen, onClose, onOpen]);
12266
12655
  return isMounted ? (jsxs$1("div", { children: [jsx$1(Backdrop, { backgroundColor: backdropColor, isOpen: isOpenState, "data-testid": "Drawer-Backdrop", onClick: onClickOutside && onClickOutside }, void 0), jsx$1(Sidebar, __assign$1({ position: position, width: width, backgroundColor: backgroundColor, isOpen: isOpenState, "data-testid": "Drawer-Sidebar" }, { children: children }), void 0)] }, void 0)) : null;
12267
12656
  };
12268
- var templateObject_1$q, templateObject_2$f;
12657
+ var templateObject_1$t, templateObject_2$i;
12269
12658
 
12270
- var Container$h = newStyled.div(templateObject_1$p || (templateObject_1$p = __makeTemplateObject(["\n width: ", ";\n height: ", ";\n"], ["\n width: ", ";\n height: ", ";\n"])), function (_a) {
12659
+ var Container$k = newStyled.div(templateObject_1$s || (templateObject_1$s = __makeTemplateObject(["\n width: ", ";\n height: ", ";\n"], ["\n width: ", ";\n height: ", ";\n"])), function (_a) {
12271
12660
  var size = _a.size;
12272
12661
  return (size ? size : '100%');
12273
12662
  }, function (_a) {
12274
12663
  var size = _a.size;
12275
12664
  return (size ? size : '100%');
12276
12665
  });
12277
- var Animation = newStyled.div(templateObject_2$e || (templateObject_2$e = __makeTemplateObject(["\n @keyframes svg--animation {\n 0% {\n transform: rotateZ(0deg);\n }\n 100% {\n transform: rotateZ(360deg);\n }\n }\n width: 100%;\n height: 100%;\n animation: linear infinite svg--animation;\n animation-duration: ", "s;\n"], ["\n @keyframes svg--animation {\n 0% {\n transform: rotateZ(0deg);\n }\n 100% {\n transform: rotateZ(360deg);\n }\n }\n width: 100%;\n height: 100%;\n animation: linear infinite svg--animation;\n animation-duration: ", "s;\n"])), function (_a) {
12666
+ var Animation = newStyled.div(templateObject_2$h || (templateObject_2$h = __makeTemplateObject(["\n @keyframes svg--animation {\n 0% {\n transform: rotateZ(0deg);\n }\n 100% {\n transform: rotateZ(360deg);\n }\n }\n width: 100%;\n height: 100%;\n animation: linear infinite svg--animation;\n animation-duration: ", "s;\n"], ["\n @keyframes svg--animation {\n 0% {\n transform: rotateZ(0deg);\n }\n 100% {\n transform: rotateZ(360deg);\n }\n }\n width: 100%;\n height: 100%;\n animation: linear infinite svg--animation;\n animation-duration: ", "s;\n"])), function (_a) {
12278
12667
  var animationDuration = _a.animationDuration;
12279
12668
  return animationDuration;
12280
12669
  });
12281
12670
  var Spinner = function (_a) {
12282
12671
  var fill = _a.fill, background = _a.background, _b = _a.animationDuration, animationDuration = _b === void 0 ? 1 : _b, _c = _a.complete, complete = _c === void 0 ? false : _c, completeIconStroke = _a.completeIconStroke, size = _a.size;
12283
- return (jsx$1(Container$h, __assign$1({ size: size, "data-testid": "Container" }, { children: complete ? (jsx$1(Icon.Actions.LightCheck, { fill: fill, strokeWidth: completeIconStroke }, void 0)) : (jsx$1(Animation, __assign$1({ animationDuration: animationDuration, "data-testid": "Animation" }, { children: jsx$1(Icon.Other.Loading, { fill: fill, backgroundColor: background }, void 0) }), void 0)) }), void 0));
12672
+ return (jsx$1(Container$k, __assign$1({ size: size, "data-testid": "Container" }, { children: complete ? (jsx$1(Icon.Actions.LightCheck, { fill: fill, strokeWidth: completeIconStroke }, void 0)) : (jsx$1(Animation, __assign$1({ animationDuration: animationDuration, "data-testid": "Animation" }, { children: jsx$1(Icon.Other.Loading, { fill: fill, backgroundColor: background }, void 0) }), void 0)) }), void 0));
12284
12673
  };
12285
- var templateObject_1$p, templateObject_2$e;
12674
+ var templateObject_1$s, templateObject_2$h;
12286
12675
 
12287
- var UL = newStyled.ul(templateObject_1$o || (templateObject_1$o = __makeTemplateObject(["\n margin: 0;\n padding: 0;\n flex-wrap: wrap;\n display: flex;\n max-width: 100%;\n"], ["\n margin: 0;\n padding: 0;\n flex-wrap: wrap;\n display: flex;\n max-width: 100%;\n"])));
12288
- var LI = newStyled.li(templateObject_2$d || (templateObject_2$d = __makeTemplateObject(["\n list-style: none;\n background-color: ", ";\n padding: 0.375rem 0.625rem;\n border-radius: 0.5rem;\n font-size: 0.875rem;\n line-height: 1.125rem;\n color: ", ";\n font-weight: 400;\n margin-right: 0.5rem;\n margin-bottom: 0.5rem;\n display: flex;\n align-items: center;\n"], ["\n list-style: none;\n background-color: ", ";\n padding: 0.375rem 0.625rem;\n border-radius: 0.5rem;\n font-size: 0.875rem;\n line-height: 1.125rem;\n color: ", ";\n font-weight: 400;\n margin-right: 0.5rem;\n margin-bottom: 0.5rem;\n display: flex;\n align-items: center;\n"])), function (props) { return props.backgroundColor; }, function (props) { return props.color; });
12289
- var CloseIconContainer = newStyled.div(templateObject_3$d || (templateObject_3$d = __makeTemplateObject(["\n width: 0.656rem;\n height: 0.656rem;\n display: flex;\n align-items: center;\n margin-left: 0.5rem;\n cursor: pointer;\n"], ["\n width: 0.656rem;\n height: 0.656rem;\n display: flex;\n align-items: center;\n margin-left: 0.5rem;\n cursor: pointer;\n"])));
12676
+ var UL = newStyled.ul(templateObject_1$r || (templateObject_1$r = __makeTemplateObject(["\n margin: 0;\n padding: 0;\n flex-wrap: wrap;\n display: flex;\n max-width: 100%;\n"], ["\n margin: 0;\n padding: 0;\n flex-wrap: wrap;\n display: flex;\n max-width: 100%;\n"])));
12677
+ var LI = newStyled.li(templateObject_2$g || (templateObject_2$g = __makeTemplateObject(["\n list-style: none;\n background-color: ", ";\n padding: 0.375rem 0.625rem;\n border-radius: 0.5rem;\n font-size: 0.875rem;\n line-height: 1.125rem;\n color: ", ";\n font-weight: 400;\n margin-right: 0.5rem;\n margin-bottom: 0.5rem;\n display: flex;\n align-items: center;\n"], ["\n list-style: none;\n background-color: ", ";\n padding: 0.375rem 0.625rem;\n border-radius: 0.5rem;\n font-size: 0.875rem;\n line-height: 1.125rem;\n color: ", ";\n font-weight: 400;\n margin-right: 0.5rem;\n margin-bottom: 0.5rem;\n display: flex;\n align-items: center;\n"])), function (props) { return props.backgroundColor; }, function (props) { return props.color; });
12678
+ var CloseIconContainer = newStyled.div(templateObject_3$g || (templateObject_3$g = __makeTemplateObject(["\n width: 0.656rem;\n height: 0.656rem;\n display: flex;\n align-items: center;\n margin-left: 0.5rem;\n cursor: pointer;\n"], ["\n width: 0.656rem;\n height: 0.656rem;\n display: flex;\n align-items: center;\n margin-left: 0.5rem;\n cursor: pointer;\n"])));
12290
12679
  var Tags = function (_a) {
12291
12680
  var _b = _a.color, color = _b === void 0 ? '#fff6ef' : _b, items = _a.items, onCloseClick = _a.onCloseClick;
12292
12681
  var theme = useTheme();
@@ -12294,7 +12683,7 @@ var Tags = function (_a) {
12294
12683
  return (jsxs$1(LI, __assign$1({ color: theme.colors.shades['700'].color, backgroundColor: color }, { children: [item, jsx$1(CloseIconContainer, __assign$1({ "data-testid": "li-close-icon", onClick: function () { return onCloseClick(index); } }, { children: jsx$1(Icon.Actions.Close, { fill: theme.colors.shades['700'].color }, void 0) }), void 0)] }), index));
12295
12684
  }) }), void 0));
12296
12685
  };
12297
- var templateObject_1$o, templateObject_2$d, templateObject_3$d;
12686
+ var templateObject_1$r, templateObject_2$g, templateObject_3$g;
12298
12687
 
12299
12688
  function FilteringDropdown(_a) {
12300
12689
  var options = _a.options, _b = _a.disabled, disabled = _b === void 0 ? false : _b, placeHolder = _a.placeHolder, _c = _a.wide, wide = _c === void 0 ? false : _c, _d = _a.sliceAfter, sliceAfter = _d === void 0 ? 100 : _d, _e = _a.filter, filter = _e === void 0 ? false : _e, onChange = _a.onChange;
@@ -12327,9 +12716,9 @@ function FilteringDropdown(_a) {
12327
12716
  }) }, void 0)] }), void 0));
12328
12717
  }
12329
12718
 
12330
- var Container$g = newStyled.div(templateObject_1$n || (templateObject_1$n = __makeTemplateObject(["\n display: flex;\n align-items: center;\n justify-content: center;\n user-select: none;\n"], ["\n display: flex;\n align-items: center;\n justify-content: center;\n user-select: none;\n"])));
12331
- var IconContainer$1 = newStyled.div(templateObject_2$c || (templateObject_2$c = __makeTemplateObject(["\n width: 0.531rem;\n height: 0.875rem;\n display: flex;\n align-items: center;\n cursor: pointer;\n"], ["\n width: 0.531rem;\n height: 0.875rem;\n display: flex;\n align-items: center;\n cursor: pointer;\n"])));
12332
- var PageNumbersContainer = newStyled.div(templateObject_3$c || (templateObject_3$c = __makeTemplateObject(["\n display: flex;\n ", ";\n"], ["\n display: flex;\n ", ";\n"])), mediaQueries({
12719
+ var Container$j = newStyled.div(templateObject_1$q || (templateObject_1$q = __makeTemplateObject(["\n display: flex;\n align-items: center;\n justify-content: center;\n user-select: none;\n"], ["\n display: flex;\n align-items: center;\n justify-content: center;\n user-select: none;\n"])));
12720
+ var IconContainer$1 = newStyled.div(templateObject_2$f || (templateObject_2$f = __makeTemplateObject(["\n width: 0.531rem;\n height: 0.875rem;\n display: flex;\n align-items: center;\n cursor: pointer;\n"], ["\n width: 0.531rem;\n height: 0.875rem;\n display: flex;\n align-items: center;\n cursor: pointer;\n"])));
12721
+ var PageNumbersContainer = newStyled.div(templateObject_3$f || (templateObject_3$f = __makeTemplateObject(["\n display: flex;\n ", ";\n"], ["\n display: flex;\n ", ";\n"])), mediaQueries({
12333
12722
  margin: ['0 0.75rem', '0 1.25rem'],
12334
12723
  }));
12335
12724
  var PageNumber = newStyled.span(templateObject_4$7 || (templateObject_4$7 = __makeTemplateObject(["\n font-weight: ", ";\n color: ", ";\n text-align: center;\n cursor: pointer;\n border-bottom: ", ";\n ", ";\n background: ", ";\n"], ["\n font-weight: ", ";\n color: ", ";\n text-align: center;\n cursor: pointer;\n border-bottom: ", ";\n ", ";\n background: ", ";\n"])), function (_a) {
@@ -12349,7 +12738,7 @@ var PageNumber = newStyled.span(templateObject_4$7 || (templateObject_4$7 = __ma
12349
12738
  var background = _a.background;
12350
12739
  return background || 'unset';
12351
12740
  });
12352
- var templateObject_1$n, templateObject_2$c, templateObject_3$c, templateObject_4$7;
12741
+ var templateObject_1$q, templateObject_2$f, templateObject_3$f, templateObject_4$7;
12353
12742
 
12354
12743
  var Pagination = function (_a) {
12355
12744
  var from = _a.from, to = _a.to, _b = _a.currentPage, currentPage = _b === void 0 ? from : _b, onChange = _a.onChange, _c = _a.underlineActive, underlineActive = _c === void 0 ? true : _c, _d = _a.boldActive, boldActive = _d === void 0 ? true : _d, _e = _a.disabled, disabled = _e === void 0 ? false : _e;
@@ -12362,7 +12751,7 @@ var Pagination = function (_a) {
12362
12751
  setPage(page);
12363
12752
  onChange(page);
12364
12753
  };
12365
- return (jsxs$1(Container$g, __assign$1({ "data-testid": "PaginationContainer" }, { children: [jsx$1(IconContainer$1, __assign$1({ onClick: function () { return handlePageChange(page - 1); }, "data-testid": "LeftChevron" }, { children: jsx$1(Icon.Arrows.ChevronLeft, { fill: disabled ? theme.colors.shades['250'].color : theme.colors.shades['700'].color }, void 0) }), void 0), jsx$1(PageNumbersContainer, __assign$1({ "data-testid": "PageNumbersContainer", theme: theme }, { children: new Array(to - from + 1).fill(0).map(function (_, i) { return (jsx$1(PageNumber, __assign$1({ onClick: function () { return handlePageChange(i + from); }, bold: boldActive && page === i + from, underline: underlineActive && page === i + from, role: 'button', color: disabled ? theme.colors.shades['250'].color : theme.colors.shades['700'].color, borderColor: disabled ? theme.colors.shades['250'].color : theme.colors.shades['700'].color, theme: theme }, { children: i + from }), i)); }) }), void 0), jsx$1(IconContainer$1, __assign$1({ onClick: function () { return handlePageChange(page + 1); }, "data-testid": "RightChevron" }, { children: jsx$1(Icon.Arrows.ChevronRight, { fill: disabled ? theme.colors.shades['250'].color : theme.colors.shades['700'].color }, void 0) }), void 0)] }), void 0));
12754
+ return (jsxs$1(Container$j, __assign$1({ "data-testid": "PaginationContainer" }, { children: [jsx$1(IconContainer$1, __assign$1({ onClick: function () { return handlePageChange(page - 1); }, "data-testid": "LeftChevron" }, { children: jsx$1(Icon.Arrows.ChevronLeft, { fill: disabled ? theme.colors.shades['250'].color : theme.colors.shades['700'].color }, void 0) }), void 0), jsx$1(PageNumbersContainer, __assign$1({ "data-testid": "PageNumbersContainer", theme: theme }, { children: new Array(to - from + 1).fill(0).map(function (_, i) { return (jsx$1(PageNumber, __assign$1({ onClick: function () { return handlePageChange(i + from); }, bold: boldActive && page === i + from, underline: underlineActive && page === i + from, role: 'button', color: disabled ? theme.colors.shades['250'].color : theme.colors.shades['700'].color, borderColor: disabled ? theme.colors.shades['250'].color : theme.colors.shades['700'].color, theme: theme }, { children: i + from }), i)); }) }), void 0), jsx$1(IconContainer$1, __assign$1({ onClick: function () { return handlePageChange(page + 1); }, "data-testid": "RightChevron" }, { children: jsx$1(Icon.Arrows.ChevronRight, { fill: disabled ? theme.colors.shades['250'].color : theme.colors.shades['700'].color }, void 0) }), void 0)] }), void 0));
12366
12755
  };
12367
12756
 
12368
12757
  var PaginatorBlog = function (_a) {
@@ -12376,12 +12765,12 @@ var PaginatorBlog = function (_a) {
12376
12765
  setPage(page);
12377
12766
  onChange(page);
12378
12767
  };
12379
- return (jsxs$1(Container$g, __assign$1({ "data-testid": "PaginatorBlogContainer" }, { children: [jsx$1(IconContainer$1, __assign$1({ onClick: function () { return handlePageChange(page - 1); }, "data-testid": "PaginatorBlogLeftChevron" }, { children: jsx$1(Icon.Arrows.ChevronLeft, { fill: page === 1 ? theme.colors.shades['white'].color : theme.colors.shades['700'].color }, void 0) }), void 0), jsx$1(PageNumbersContainer, __assign$1({ "data-testid": "PaginatorBlogPageNumbersContainer", theme: theme }, { children: new Array(to - from + 1).fill(0).map(function (_, i) { return (jsx$1(PageNumber, __assign$1({ onClick: function () { return handlePageChange(i + from); }, background: page === i + from ? 'black' : '', role: 'button', color: page === i + from
12768
+ return (jsxs$1(Container$j, __assign$1({ "data-testid": "PaginatorBlogContainer" }, { children: [jsx$1(IconContainer$1, __assign$1({ onClick: function () { return handlePageChange(page - 1); }, "data-testid": "PaginatorBlogLeftChevron" }, { children: jsx$1(Icon.Arrows.ChevronLeft, { fill: page === 1 ? theme.colors.shades['white'].color : theme.colors.shades['700'].color }, void 0) }), void 0), jsx$1(PageNumbersContainer, __assign$1({ "data-testid": "PaginatorBlogPageNumbersContainer", theme: theme }, { children: new Array(to - from + 1).fill(0).map(function (_, i) { return (jsx$1(PageNumber, __assign$1({ onClick: function () { return handlePageChange(i + from); }, background: page === i + from ? 'black' : '', role: 'button', color: page === i + from
12380
12769
  ? theme.colors.shades['white'].color
12381
12770
  : theme.colors.shades['700'].color, borderColor: theme.colors.shades['700'].color, theme: theme, bold: false, underline: false }, { children: i + from }), i)); }) }), void 0), jsx$1(IconContainer$1, __assign$1({ onClick: function () { return handlePageChange(page + 1); }, "data-testid": "PaginatorBlogRightChevron" }, { children: jsx$1(Icon.Arrows.ChevronRight, { fill: page === to ? theme.colors.shades['white'].color : theme.colors.shades['700'].color }, void 0) }), void 0)] }), void 0));
12382
12771
  };
12383
12772
 
12384
- var Container$f = newStyled.div(templateObject_1$m || (templateObject_1$m = __makeTemplateObject(["\n display: flex;\n flex-direction: row;\n width: auto;\n padding: 0.688rem 0rem;\n ", ",\n"], ["\n display: flex;\n flex-direction: row;\n width: auto;\n padding: 0.688rem 0rem;\n ", ",\n"])), mediaQueries({
12773
+ var Container$i = newStyled.div(templateObject_1$p || (templateObject_1$p = __makeTemplateObject(["\n display: flex;\n flex-direction: row;\n width: auto;\n padding: 0.688rem 0rem;\n ", ",\n"], ["\n display: flex;\n flex-direction: row;\n width: auto;\n padding: 0.688rem 0rem;\n ", ",\n"])), mediaQueries({
12385
12774
  borderTop: ['0.063rem solid var(--colors-shades-100-color)', 'none'],
12386
12775
  }));
12387
12776
  var Description$1 = newStyled.div({
@@ -12398,25 +12787,25 @@ var Description$1 = newStyled.div({
12398
12787
  var ProductItem = function (_a) {
12399
12788
  var src = _a.src, title = _a.title, price = _a.price;
12400
12789
  var theme = useTheme();
12401
- return (jsxs$1(Container$f, __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$6, __assign$1({ variant: "body", weight: "regular", size: "regular" }, { children: jsx$1("div", { dangerouslySetInnerHTML: { __html: title } }, void 0) }), void 0), jsx$1(PriceLabel, { finalPrice: price, color: "#C64844", size: ComponentSize.Small }, void 0)] }, void 0)] }), void 0));
12790
+ return (jsxs$1(Container$i, __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$6, __assign$1({ variant: "body", weight: "regular", size: "regular" }, { children: jsx$1("div", { dangerouslySetInnerHTML: { __html: title } }, void 0) }), void 0), jsx$1(PriceLabel, { finalPrice: price, color: "#C64844", size: ComponentSize.Small }, void 0)] }, void 0)] }), void 0));
12402
12791
  };
12403
- var templateObject_1$m;
12792
+ var templateObject_1$p;
12404
12793
 
12405
- var Container$e = newStyled.div({
12794
+ var Container$h = newStyled.div({
12406
12795
  display: 'flex',
12407
12796
  justifyContent: 'center',
12408
12797
  padding: '1rem',
12409
12798
  });
12410
12799
  var Footer = function (_a) {
12411
12800
  var text = _a.text, onClick = _a.onClick;
12412
- return (jsx$1(Container$e, { children: jsx$1(Text$6, __assign$1({ variant: "link", size: "regular", underline: true, onClick: onClick }, { children: text }), void 0) }, void 0));
12801
+ return (jsx$1(Container$h, { children: jsx$1(Text$6, __assign$1({ variant: "link", size: "regular", underline: true, onClick: onClick }, { children: text }), void 0) }, void 0));
12413
12802
  };
12414
12803
 
12415
12804
  var Ul = newStyled.ul({
12416
12805
  margin: '0px',
12417
12806
  padding: '0px',
12418
12807
  });
12419
- var Li = newStyled.li(templateObject_1$l || (templateObject_1$l = __makeTemplateObject(["\n width: 100%;\n cursor: pointer;\n list-style-type: none;\n box-sizing: border-box;\n &:hover {\n background-color: ", ";\n }\n ", ",\n"], ["\n width: 100%;\n cursor: pointer;\n list-style-type: none;\n box-sizing: border-box;\n &:hover {\n background-color: ", ";\n }\n ", ",\n"])), function (props) { return props.theme.colors.shades['100'].color; }, mediaQueries({
12808
+ var Li = newStyled.li(templateObject_1$o || (templateObject_1$o = __makeTemplateObject(["\n width: 100%;\n cursor: pointer;\n list-style-type: none;\n box-sizing: border-box;\n &:hover {\n background-color: ", ";\n }\n ", ",\n"], ["\n width: 100%;\n cursor: pointer;\n list-style-type: none;\n box-sizing: border-box;\n &:hover {\n background-color: ", ";\n }\n ", ",\n"])), function (props) { return props.theme.colors.shades['100'].color; }, mediaQueries({
12420
12809
  padding: [0, '0rem 1rem'],
12421
12810
  borderRadius: [0, '0.5rem'],
12422
12811
  }));
@@ -12428,20 +12817,20 @@ var Anchor = newStyled.a({
12428
12817
  padding: 0,
12429
12818
  textDecoration: 'none',
12430
12819
  });
12431
- var Container$d = newStyled.div(templateObject_2$b || (templateObject_2$b = __makeTemplateObject(["\n display: flex;\n flex-direction: column;\n margin: 0rem;\n padding: 0rem;\n position: absolute;\n width: 100%;\n background-color: white;\n box-sizing: border-box;\n z-index: 2;\n ", ",\n"], ["\n display: flex;\n flex-direction: column;\n margin: 0rem;\n padding: 0rem;\n position: absolute;\n width: 100%;\n background-color: white;\n box-sizing: border-box;\n z-index: 2;\n ", ",\n"])), mediaQueries({
12820
+ var Container$g = newStyled.div(templateObject_2$e || (templateObject_2$e = __makeTemplateObject(["\n display: flex;\n flex-direction: column;\n margin: 0rem;\n padding: 0rem;\n position: absolute;\n width: 100%;\n background-color: white;\n box-sizing: border-box;\n z-index: 2;\n ", ",\n"], ["\n display: flex;\n flex-direction: column;\n margin: 0rem;\n padding: 0rem;\n position: absolute;\n width: 100%;\n background-color: white;\n box-sizing: border-box;\n z-index: 2;\n ", ",\n"])), mediaQueries({
12432
12821
  border: ['none', '0.063rem solid var(--colors-pallete-secondary-color)'],
12433
12822
  marginTop: ['1.25rem', '0.125rem'],
12434
12823
  borderRadius: ['0', '0.5rem'],
12435
12824
  }));
12436
- var Header$1 = newStyled.div(templateObject_3$b || (templateObject_3$b = __makeTemplateObject(["\n ", ",\n"], ["\n ", ",\n"])), mediaQueries({
12825
+ var Header$1 = newStyled.div(templateObject_3$e || (templateObject_3$e = __makeTemplateObject(["\n ", ",\n"], ["\n ", ",\n"])), mediaQueries({
12437
12826
  margin: ['0rem 0rem 1rem 0rem', '1rem'],
12438
12827
  }));
12439
12828
  var ResultsPanel = function (_a) {
12440
12829
  var options = _a.options, header = _a.header, footer = _a.footer, onViewAll = _a.onViewAll, testId = _a.testId;
12441
12830
  var theme = useTheme();
12442
- return (jsxs$1(Container$d, __assign$1({ "data-testid": testId, theme: theme }, { children: [header && (jsx$1(Header$1, __assign$1({ theme: theme }, { children: jsx$1(Text$6, __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(Anchor, __assign$1({ href: item.optionUrl }, { 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));
12831
+ return (jsxs$1(Container$g, __assign$1({ "data-testid": testId, theme: theme }, { children: [header && (jsx$1(Header$1, __assign$1({ theme: theme }, { children: jsx$1(Text$6, __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(Anchor, __assign$1({ href: item.optionUrl }, { 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));
12443
12832
  };
12444
- var templateObject_1$l, templateObject_2$b, templateObject_3$b;
12833
+ var templateObject_1$o, templateObject_2$e, templateObject_3$e;
12445
12834
 
12446
12835
  var Input = newStyled.input(function (props) { return ({
12447
12836
  padding: props.theme.component.input.padding,
@@ -12472,7 +12861,7 @@ var Input = newStyled.input(function (props) { return ({
12472
12861
  },
12473
12862
  }); });
12474
12863
 
12475
- var Button$1 = newStyled.button(templateObject_1$k || (templateObject_1$k = __makeTemplateObject(["\n position: absolute;\n right: 1rem;\n background: white;\n border: none;\n align-self: center;\n padding: 0;\n ", ",\n"], ["\n position: absolute;\n right: 1rem;\n background: white;\n border: none;\n align-self: center;\n padding: 0;\n ", ",\n"])), mediaQueries({
12864
+ var Button$1 = newStyled.button(templateObject_1$n || (templateObject_1$n = __makeTemplateObject(["\n position: absolute;\n right: 1rem;\n background: white;\n border: none;\n align-self: center;\n padding: 0;\n ", ",\n"], ["\n position: absolute;\n right: 1rem;\n background: white;\n border: none;\n align-self: center;\n padding: 0;\n ", ",\n"])), mediaQueries({
12476
12865
  right: ['1rem', '7.75rem'],
12477
12866
  top: ['0.75rem', '0.75rem'],
12478
12867
  }));
@@ -12481,7 +12870,7 @@ var ClearButton = function (_a) {
12481
12870
  var theme = useTheme();
12482
12871
  return (jsx$1(Button$1, __assign$1({ onClick: onClick, theme: theme }, { children: jsx$1(Icon.Actions.Close, { height: 1.25, width: 1.25 }, void 0) }), void 0));
12483
12872
  };
12484
- var templateObject_1$k;
12873
+ var templateObject_1$n;
12485
12874
 
12486
12875
  var useOnClickOutside = function (ref, handler) {
12487
12876
  useEffect(function () {
@@ -12570,7 +12959,7 @@ var reducer = function (state, action) {
12570
12959
  }
12571
12960
  }
12572
12961
  };
12573
- var Container$c = newStyled.div({
12962
+ var Container$f = newStyled.div({
12574
12963
  position: 'relative',
12575
12964
  display: 'flex',
12576
12965
  });
@@ -12606,7 +12995,7 @@ var SearchBar = function (_a) {
12606
12995
  onClose();
12607
12996
  }
12608
12997
  };
12609
- return (jsxs$1("form", __assign$1({ role: "search", onSubmit: function (e) { return e.preventDefault(); }, ref: ref, style: { position: 'relative' } }, { children: [jsxs$1(Container$c, __assign$1({ theme: theme }, { children: [jsx$1(Input, { value: state.term, placeholder: "Search for products", onChange: function (e) { return dispatch({ type: 'UPDATE_TERM', payload: { term: e.target.value } }); }, onFocus: function () { return dispatch({ type: 'TOGGLE_PANEL', payload: { open: true } }); }, id: "search", autoComplete: "off", theme: theme, "aria-label": "Search for products", onKeyDown: function (e) {
12998
+ return (jsxs$1("form", __assign$1({ role: "search", onSubmit: function (e) { return e.preventDefault(); }, ref: ref, style: { position: 'relative' } }, { children: [jsxs$1(Container$f, __assign$1({ theme: theme }, { children: [jsx$1(Input, { value: state.term, placeholder: "Search for products", onChange: function (e) { return dispatch({ type: 'UPDATE_TERM', payload: { term: e.target.value } }); }, onFocus: function () { return dispatch({ type: 'TOGGLE_PANEL', payload: { open: true } }); }, id: "search", autoComplete: "off", theme: theme, "aria-label": "Search for products", onKeyDown: function (e) {
12610
12999
  if (e.key === 'Enter') {
12611
13000
  e.preventDefault();
12612
13001
  e.stopPropagation();
@@ -12880,40 +13269,40 @@ function useSwipeable(options) {
12880
13269
  return handlers;
12881
13270
  }
12882
13271
 
12883
- var Container$b = newStyled.div(templateObject_1$j || (templateObject_1$j = __makeTemplateObject(["\n ", "\n position: relative;\n max-height: 31.875rem;\n overflow: hidden;\n"], ["\n ", "\n position: relative;\n max-height: 31.875rem;\n overflow: hidden;\n"])), function (_a) {
13272
+ var Container$e = newStyled.div(templateObject_1$m || (templateObject_1$m = __makeTemplateObject(["\n ", "\n position: relative;\n max-height: 31.875rem;\n overflow: hidden;\n"], ["\n ", "\n position: relative;\n max-height: 31.875rem;\n overflow: hidden;\n"])), function (_a) {
12884
13273
  var borderRadiusVariant = _a.borderRadiusVariant;
12885
13274
  return borderRadiusVariant &&
12886
13275
  "\n border-radius: 40px;\n ";
12887
13276
  });
12888
- var TopTagContainer = newStyled.div(templateObject_2$a || (templateObject_2$a = __makeTemplateObject(["\n position: absolute;\n left: ", ";\n top: ", ";\n"], ["\n position: absolute;\n left: ", ";\n top: ", ";\n"])), function (props) { return (props.borderRadiusVariant ? '13px' : '0'); }, function (props) { return (props.borderRadiusVariant ? '11px' : '0'); });
12889
- var BottomTagContainer = newStyled.div(templateObject_3$a || (templateObject_3$a = __makeTemplateObject(["\n position: absolute;\n bottom: 3.75rem;\n left: 0;\n"], ["\n position: absolute;\n bottom: 3.75rem;\n left: 0;\n"])));
13277
+ var TopTagContainer = newStyled.div(templateObject_2$d || (templateObject_2$d = __makeTemplateObject(["\n position: absolute;\n left: ", ";\n top: ", ";\n"], ["\n position: absolute;\n left: ", ";\n top: ", ";\n"])), function (props) { return (props.borderRadiusVariant ? '13px' : '0'); }, function (props) { return (props.borderRadiusVariant ? '11px' : '0'); });
13278
+ var BottomTagContainer = newStyled.div(templateObject_3$d || (templateObject_3$d = __makeTemplateObject(["\n position: absolute;\n bottom: 3.75rem;\n left: 0;\n"], ["\n position: absolute;\n bottom: 3.75rem;\n left: 0;\n"])));
12890
13279
  var ImageProductWithTags = forwardRef(function ImageProductWithTags(_a, ref) {
12891
13280
  var image = _a.image, topTag = _a.topTag, bottomTag = _a.bottomTag, testId = _a.testId, borderRadiusVariant = _a.borderRadiusVariant;
12892
- return (jsxs$1(Container$b, __assign$1({ "data-testid": testId, ref: ref, borderRadiusVariant: borderRadiusVariant }, { children: [jsx$1(InnerImageZoom, { src: image.imageUrl, zoomSrc: image.imageUrl, zoomType: "hover", imgAttributes: { alt: image.alt, width: '100%', height: '510px' }, height: 510, fullscreenOnMobile: true, className: "zoomWrapper" }, void 0), jsx$1(TopTagContainer, __assign$1({ borderRadiusVariant: borderRadiusVariant }, { children: topTag }), void 0), jsx$1(BottomTagContainer, { children: bottomTag }, void 0)] }), void 0));
13281
+ return (jsxs$1(Container$e, __assign$1({ "data-testid": testId, ref: ref, borderRadiusVariant: borderRadiusVariant }, { children: [jsx$1(InnerImageZoom, { src: image.imageUrl, zoomSrc: image.imageUrl, zoomType: "hover", imgAttributes: { alt: image.alt, width: '100%', height: '510px' }, height: 510, fullscreenOnMobile: true, className: "zoomWrapper" }, void 0), jsx$1(TopTagContainer, __assign$1({ borderRadiusVariant: borderRadiusVariant }, { children: topTag }), void 0), jsx$1(BottomTagContainer, { children: bottomTag }, void 0)] }), void 0));
12893
13282
  });
12894
- var templateObject_1$j, templateObject_2$a, templateObject_3$a;
13283
+ var templateObject_1$m, templateObject_2$d, templateObject_3$d;
12895
13284
 
12896
- var Button = newStyled.button(templateObject_1$i || (templateObject_1$i = __makeTemplateObject(["\n background: transparent;\n border: none;\n padding: 0.188rem 0.625rem;\n z-index: 5;\n top: calc(50% - 40px);\n height: 40px !important;\n"], ["\n background: transparent;\n border: none;\n padding: 0.188rem 0.625rem;\n z-index: 5;\n top: calc(50% - 40px);\n height: 40px !important;\n"])));
13285
+ var Button = newStyled.button(templateObject_1$l || (templateObject_1$l = __makeTemplateObject(["\n background: transparent;\n border: none;\n padding: 0.188rem 0.625rem;\n z-index: 5;\n top: calc(50% - 40px);\n height: 40px !important;\n"], ["\n background: transparent;\n border: none;\n padding: 0.188rem 0.625rem;\n z-index: 5;\n top: calc(50% - 40px);\n height: 40px !important;\n"])));
12897
13286
  var ArrowButton = function (_a) {
12898
13287
  var Icon = _a.Icon, onClick = _a.onClick, className = _a.className;
12899
13288
  return (jsx$1(Button, __assign$1({ className: className, type: "button", onClick: onClick }, { children: Icon }), void 0));
12900
13289
  };
12901
- var templateObject_1$i;
13290
+ var templateObject_1$l;
12902
13291
 
12903
- var Container$a = newStyled.div(templateObject_1$h || (templateObject_1$h = __makeTemplateObject(["\n position: absolute;\n bottom: 15px;\n display: flex;\n justify-content: center;\n width: 100%;\n svg {\n padding: 0.125rem;\n margin-left: 0.25rem;\n }\n"], ["\n position: absolute;\n bottom: 15px;\n display: flex;\n justify-content: center;\n width: 100%;\n svg {\n padding: 0.125rem;\n margin-left: 0.25rem;\n }\n"])));
13292
+ var Container$d = newStyled.div(templateObject_1$k || (templateObject_1$k = __makeTemplateObject(["\n position: absolute;\n bottom: 15px;\n display: flex;\n justify-content: center;\n width: 100%;\n svg {\n padding: 0.125rem;\n margin-left: 0.25rem;\n }\n"], ["\n position: absolute;\n bottom: 15px;\n display: flex;\n justify-content: center;\n width: 100%;\n svg {\n padding: 0.125rem;\n margin-left: 0.25rem;\n }\n"])));
12904
13293
  var range = function (limit) { return __spreadArray([], new Array(limit), true).map(function (_, index) { return index; }); };
12905
13294
  var SlideDots = function (_a) {
12906
13295
  var quantity = _a.quantity, selectedIndex = _a.selectedIndex, containerDataTestId = _a.containerDataTestId;
12907
13296
  var theme = useTheme();
12908
- return (jsx$1(Container$a, __assign$1({ "data-testid": containerDataTestId }, { children: range(quantity).map(function (index) { return (jsx$1(Icon.SlideDots.SlideDot, { height: 0.75, width: 0.75, fill: index === selectedIndex
13297
+ return (jsx$1(Container$d, __assign$1({ "data-testid": containerDataTestId }, { children: range(quantity).map(function (index) { return (jsx$1(Icon.SlideDots.SlideDot, { height: 0.75, width: 0.75, fill: index === selectedIndex
12909
13298
  ? theme.colors.shades.white.color
12910
13299
  : theme.colors.shades['700'].color, opacity: 0.6, testId: "slide-dot-".concat(index) }, index)); }) }), void 0));
12911
13300
  };
12912
- var templateObject_1$h;
13301
+ var templateObject_1$k;
12913
13302
 
12914
- var NavigationButton = newStyled(ArrowButton)(templateObject_1$g || (templateObject_1$g = __makeTemplateObject(["\n position: absolute;\n height: 100%;\n display: flex;\n align-items: center;\n cursor: pointer;\n"], ["\n position: absolute;\n height: 100%;\n display: flex;\n align-items: center;\n cursor: pointer;\n"])));
12915
- var RightButton = newStyled(NavigationButton)(templateObject_2$9 || (templateObject_2$9 = __makeTemplateObject(["\n right: 0;\n"], ["\n right: 0;\n"])));
12916
- var LeftButton = newStyled(NavigationButton)(templateObject_3$9 || (templateObject_3$9 = __makeTemplateObject(["\n left: 0;\n"], ["\n left: 0;\n"])));
13303
+ var NavigationButton = newStyled(ArrowButton)(templateObject_1$j || (templateObject_1$j = __makeTemplateObject(["\n position: absolute;\n height: 100%;\n display: flex;\n align-items: center;\n cursor: pointer;\n"], ["\n position: absolute;\n height: 100%;\n display: flex;\n align-items: center;\n cursor: pointer;\n"])));
13304
+ var RightButton = newStyled(NavigationButton)(templateObject_2$c || (templateObject_2$c = __makeTemplateObject(["\n right: 0;\n"], ["\n right: 0;\n"])));
13305
+ var LeftButton = newStyled(NavigationButton)(templateObject_3$c || (templateObject_3$c = __makeTemplateObject(["\n left: 0;\n"], ["\n left: 0;\n"])));
12917
13306
  var SlideNavigation = function (_a) {
12918
13307
  var quantity = _a.quantity, selectedIndex = _a.selectedIndex, onNavigate = _a.onNavigate, testId = _a.testId;
12919
13308
  var theme = useTheme();
@@ -12925,9 +13314,9 @@ var SlideNavigation = function (_a) {
12925
13314
  onNavigate(selectedIndex + 1);
12926
13315
  } }, void 0)), jsx$1(SlideDots, { quantity: quantity, selectedIndex: selectedIndex, containerDataTestId: testId }, void 0)] }, void 0));
12927
13316
  };
12928
- var templateObject_1$g, templateObject_2$9, templateObject_3$9;
13317
+ var templateObject_1$j, templateObject_2$c, templateObject_3$c;
12929
13318
 
12930
- var Container$9 = newStyled.div(templateObject_1$f || (templateObject_1$f = __makeTemplateObject(["\n display: flex;\n flex-direction: column;\n height: fit-content;\n position: relative;\n max-width: 450px;\n"], ["\n display: flex;\n flex-direction: column;\n height: fit-content;\n position: relative;\n max-width: 450px;\n"])));
13319
+ var Container$c = newStyled.div(templateObject_1$i || (templateObject_1$i = __makeTemplateObject(["\n display: flex;\n flex-direction: column;\n height: fit-content;\n position: relative;\n max-width: 450px;\n"], ["\n display: flex;\n flex-direction: column;\n height: fit-content;\n position: relative;\n max-width: 450px;\n"])));
12931
13320
  var ProductGalleryMobile = function (_a) {
12932
13321
  var images = _a.images, selectedValue = _a.selectedValue, topTag = _a.topTag, bottomTag = _a.bottomTag, productImageDataTestId = _a.productImageDataTestId, slideDotsDataTestId = _a.slideDotsDataTestId, _b = _a.borderRadiusVariant, borderRadiusVariant = _b === void 0 ? false : _b;
12933
13322
  var _c = useState(0), index = _c[0], setIndex = _c[1];
@@ -12949,9 +13338,9 @@ var ProductGalleryMobile = function (_a) {
12949
13338
  useEffect(function () {
12950
13339
  setSelectedImage(images[index]);
12951
13340
  }, [index, images]);
12952
- return (jsxs$1(Container$9, { children: [jsx$1(ImageProductWithTags, __assign$1({}, handlers, { image: selectedImage, topTag: topTag, bottomTag: bottomTag, testId: productImageDataTestId, borderRadiusVariant: borderRadiusVariant }), void 0), jsx$1(SlideNavigation, { quantity: images.length, selectedIndex: images.indexOf(selectedImage), onNavigate: setIndex, testId: slideDotsDataTestId }, void 0)] }, void 0));
13341
+ return (jsxs$1(Container$c, { children: [jsx$1(ImageProductWithTags, __assign$1({}, handlers, { image: selectedImage, topTag: topTag, bottomTag: bottomTag, testId: productImageDataTestId, borderRadiusVariant: borderRadiusVariant }), void 0), jsx$1(SlideNavigation, { quantity: images.length, selectedIndex: images.indexOf(selectedImage), onNavigate: setIndex, testId: slideDotsDataTestId }, void 0)] }, void 0));
12953
13342
  };
12954
- var templateObject_1$f;
13343
+ var templateObject_1$i;
12955
13344
 
12956
13345
  var Portal = function (_a) {
12957
13346
  var id = _a.id, className = _a.className, children = _a.children, overflow = _a.overflow, style = _a.style;
@@ -13084,14 +13473,14 @@ var react = __toCommonJS(react_exports);
13084
13473
  var visibleStyle = function (_a) {
13085
13474
  var opened = _a.opened;
13086
13475
  return opened
13087
- ? css(templateObject_1$e || (templateObject_1$e = __makeTemplateObject(["\n opacity: 1;\n pointer-events: all;\n "], ["\n opacity: 1;\n pointer-events: all;\n "]))) : css(templateObject_2$8 || (templateObject_2$8 = __makeTemplateObject(["\n opacity: 0;\n pointer-events: none;\n "], ["\n opacity: 0;\n pointer-events: none;\n "])));
13476
+ ? css(templateObject_1$h || (templateObject_1$h = __makeTemplateObject(["\n opacity: 1;\n pointer-events: all;\n "], ["\n opacity: 1;\n pointer-events: all;\n "]))) : css(templateObject_2$b || (templateObject_2$b = __makeTemplateObject(["\n opacity: 0;\n pointer-events: none;\n "], ["\n opacity: 0;\n pointer-events: none;\n "])));
13088
13477
  };
13089
13478
  var transformStyle = function (_a) {
13090
13479
  var opened = _a.opened, maxFullScreen = _a.maxFullScreen;
13091
13480
  return opened
13092
- ? css(templateObject_3$8 || (templateObject_3$8 = __makeTemplateObject(["\n transform: ", ";\n "], ["\n transform: ", ";\n "])), maxFullScreen ? 'translateY(0)' : 'translate(-50%, -50%)') : css(templateObject_4$6 || (templateObject_4$6 = __makeTemplateObject(["\n transform: ", ";\n "], ["\n transform: ", ";\n "])), maxFullScreen ? 'translateY(10%)' : 'translate(-50%, -40%)');
13481
+ ? css(templateObject_3$b || (templateObject_3$b = __makeTemplateObject(["\n transform: ", ";\n "], ["\n transform: ", ";\n "])), maxFullScreen ? 'translateY(0)' : 'translate(-50%, -50%)') : css(templateObject_4$6 || (templateObject_4$6 = __makeTemplateObject(["\n transform: ", ";\n "], ["\n transform: ", ";\n "])), maxFullScreen ? 'translateY(10%)' : 'translate(-50%, -40%)');
13093
13482
  };
13094
- var Container$8 = newStyled.div(templateObject_5$3 || (templateObject_5$3 = __makeTemplateObject(["\n border: 1px solid var(--colors-pallete-primary-color);\n border-radius: ", ";\n padding: 20px;\n position: fixed;\n left: ", ";\n top: ", ";\n z-index: var(--zIndex-modal);\n background-color: var(--colors-background-color);\n transition: transform 0.3s, opacity 0.3s;\n overflow-y: auto;\n max-width: ", ";\n max-height: ", ";\n width: ", ";\n height: ", ";\n ", "\n\n ", "\n ", "\n"], ["\n border: 1px solid var(--colors-pallete-primary-color);\n border-radius: ", ";\n padding: 20px;\n position: fixed;\n left: ", ";\n top: ", ";\n z-index: var(--zIndex-modal);\n background-color: var(--colors-background-color);\n transition: transform 0.3s, opacity 0.3s;\n overflow-y: auto;\n max-width: ", ";\n max-height: ", ";\n width: ", ";\n height: ", ";\n ", "\n\n ", "\n ", "\n"])), function (props) { return "".concat(props.maxFullScreen ? '0' : 'var(--radius-regular)'); }, function (props) { return "".concat(props.maxFullScreen ? '0' : '50%'); }, function (props) { return "".concat(props.maxFullScreen ? '0' : '50%'); }, function (props) { return "".concat(props.maxFullScreen ? '100%' : '90vw'); }, function (props) { return "".concat(props.maxFullScreen ? '100%' : '90vh'); }, function (props) { return "".concat(props.maxFullScreen ? '100%' : 'auto'); }, function (props) { return "".concat(props.maxFullScreen ? '100%' : 'inherit'); }, mediaQueries({
13483
+ var Container$b = newStyled.div(templateObject_5$3 || (templateObject_5$3 = __makeTemplateObject(["\n border: 1px solid var(--colors-pallete-primary-color);\n border-radius: ", ";\n padding: 20px;\n position: fixed;\n left: ", ";\n top: ", ";\n z-index: var(--zIndex-modal);\n background-color: var(--colors-background-color);\n transition: transform 0.3s, opacity 0.3s;\n overflow-y: auto;\n max-width: ", ";\n max-height: ", ";\n width: ", ";\n height: ", ";\n ", "\n\n ", "\n ", "\n"], ["\n border: 1px solid var(--colors-pallete-primary-color);\n border-radius: ", ";\n padding: 20px;\n position: fixed;\n left: ", ";\n top: ", ";\n z-index: var(--zIndex-modal);\n background-color: var(--colors-background-color);\n transition: transform 0.3s, opacity 0.3s;\n overflow-y: auto;\n max-width: ", ";\n max-height: ", ";\n width: ", ";\n height: ", ";\n ", "\n\n ", "\n ", "\n"])), function (props) { return "".concat(props.maxFullScreen ? '0' : 'var(--radius-regular)'); }, function (props) { return "".concat(props.maxFullScreen ? '0' : '50%'); }, function (props) { return "".concat(props.maxFullScreen ? '0' : '50%'); }, function (props) { return "".concat(props.maxFullScreen ? '100%' : '90vw'); }, function (props) { return "".concat(props.maxFullScreen ? '100%' : '90vh'); }, function (props) { return "".concat(props.maxFullScreen ? '100%' : 'auto'); }, function (props) { return "".concat(props.maxFullScreen ? '100%' : 'inherit'); }, mediaQueries({
13095
13484
  minWidth: ['90%', 'var(--component-modal-minWidth)'],
13096
13485
  }), visibleStyle, transformStyle);
13097
13486
  var Overlay = newStyled.div(templateObject_6$2 || (templateObject_6$2 = __makeTemplateObject(["\n position: fixed;\n left: 0;\n top: 0;\n width: 100%;\n height: 100%;\n background-color: rgba(0, 0, 0, 0.75);\n z-index: var(--zIndex-overlay);\n transition: opacity 0.3s;\n\n ", "\n"], ["\n position: fixed;\n left: 0;\n top: 0;\n width: 100%;\n height: 100%;\n background-color: rgba(0, 0, 0, 0.75);\n z-index: var(--zIndex-overlay);\n transition: opacity 0.3s;\n\n ", "\n"])), visibleStyle);
@@ -13104,7 +13493,7 @@ var Modal = function (_a) {
13104
13493
  }
13105
13494
  close();
13106
13495
  };
13107
- return (jsxs(Portal, __assign$1({ id: id }, { children: [jsx(Container$8, __assign$1({ opened: opened, maxFullScreen: maxFullScreen }, { children: children }), void 0), jsx(Overlay, { opened: opened, onClick: onDismiss }, void 0)] }), void 0));
13496
+ return (jsxs(Portal, __assign$1({ id: id }, { children: [jsx(Container$b, __assign$1({ opened: opened, maxFullScreen: maxFullScreen }, { children: children }), void 0), jsx(Overlay, { opened: opened, onClick: onDismiss }, void 0)] }), void 0));
13108
13497
  };
13109
13498
  var modalEvent = function (id, detail) {
13110
13499
  events.dispatchCustomEvent('modal', __assign$1({ id: id }, detail));
@@ -13132,39 +13521,39 @@ var useModal = function (id) {
13132
13521
  close: close,
13133
13522
  }); }, [close, open, opened]);
13134
13523
  };
13135
- var templateObject_1$e, templateObject_2$8, templateObject_3$8, templateObject_4$6, templateObject_5$3, templateObject_6$2;
13524
+ var templateObject_1$h, templateObject_2$b, templateObject_3$b, templateObject_4$6, templateObject_5$3, templateObject_6$2;
13136
13525
 
13137
- var Text$2 = newStyled.span(templateObject_1$d || (templateObject_1$d = __makeTemplateObject(["\n font-size: 0.875rem;\n font-weight: 600;\n line-height: 1.375rem;\n color: ", ";\n margin: 0;\n padding: 0;\n"], ["\n font-size: 0.875rem;\n font-weight: 600;\n line-height: 1.375rem;\n color: ", ";\n margin: 0;\n padding: 0;\n"])), function (props) { return props.color; });
13526
+ var Text$2 = newStyled.span(templateObject_1$g || (templateObject_1$g = __makeTemplateObject(["\n font-size: 0.875rem;\n font-weight: 600;\n line-height: 1.375rem;\n color: ", ";\n margin: 0;\n padding: 0;\n"], ["\n font-size: 0.875rem;\n font-weight: 600;\n line-height: 1.375rem;\n color: ", ";\n margin: 0;\n padding: 0;\n"])), function (props) { return props.color; });
13138
13527
  var Title$1 = function (_a) {
13139
13528
  var title = _a.title;
13140
13529
  var theme = useTheme();
13141
13530
  return jsx$1(Text$2, __assign$1({ color: theme.colors.shades['700'].color }, { children: title }), void 0);
13142
13531
  };
13143
- var templateObject_1$d;
13532
+ var templateObject_1$g;
13144
13533
 
13145
- var P = newStyled.p(templateObject_1$c || (templateObject_1$c = __makeTemplateObject(["\n font-size: 0.75rem;\n font-weight: 400;\n line-height: 1.125rem;\n color: ", ";\n margin: 0;\n padding: 0;\n"], ["\n font-size: 0.75rem;\n font-weight: 400;\n line-height: 1.125rem;\n color: ", ";\n margin: 0;\n padding: 0;\n"])), function (props) { return props.color; });
13534
+ var P = newStyled.p(templateObject_1$f || (templateObject_1$f = __makeTemplateObject(["\n font-size: 0.75rem;\n font-weight: 400;\n line-height: 1.125rem;\n color: ", ";\n margin: 0;\n padding: 0;\n"], ["\n font-size: 0.75rem;\n font-weight: 400;\n line-height: 1.125rem;\n color: ", ";\n margin: 0;\n padding: 0;\n"])), function (props) { return props.color; });
13146
13535
  var Promo = function (_a) {
13147
13536
  var text = _a.text;
13148
13537
  var theme = useTheme();
13149
13538
  return (jsx$1(P, __assign$1({ color: theme.colors.shades['700'].color, "data-testid": "CartProductItemPromo" }, { children: text }), void 0));
13150
13539
  };
13151
- var templateObject_1$c;
13540
+ var templateObject_1$f;
13152
13541
 
13153
- var Text$1 = newStyled.span(templateObject_1$b || (templateObject_1$b = __makeTemplateObject(["\n font-size: 0.875rem;\n font-weight: 400;\n line-height: 1.125rem;\n color: ", ";\n margin: 0;\n padding: 0;\n"], ["\n font-size: 0.875rem;\n font-weight: 400;\n line-height: 1.125rem;\n color: ", ";\n margin: 0;\n padding: 0;\n"])), function (props) { return props.color; });
13542
+ var Text$1 = newStyled.span(templateObject_1$e || (templateObject_1$e = __makeTemplateObject(["\n font-size: 0.875rem;\n font-weight: 400;\n line-height: 1.125rem;\n color: ", ";\n margin: 0;\n padding: 0;\n"], ["\n font-size: 0.875rem;\n font-weight: 400;\n line-height: 1.125rem;\n color: ", ";\n margin: 0;\n padding: 0;\n"])), function (props) { return props.color; });
13154
13543
  var Description = function (_a) {
13155
13544
  var text = _a.text;
13156
13545
  var theme = useTheme();
13157
13546
  return jsx$1(Text$1, __assign$1({ color: theme.colors.shades['400'].color }, { children: text }), void 0);
13158
13547
  };
13159
- var templateObject_1$b;
13548
+ var templateObject_1$e;
13160
13549
 
13161
- var Container$7 = newStyled.div(templateObject_1$a || (templateObject_1$a = __makeTemplateObject(["\n margin: 0;\n padding: 0.25rem;\n background-color: ", ";\n display: inline-flex;\n border-radius: 50%;\n cursor: pointer;\n width: ", ";\n height: ", ";\n justify-content: center;\n align-items: center;\n"], ["\n margin: 0;\n padding: 0.25rem;\n background-color: ", ";\n display: inline-flex;\n border-radius: 50%;\n cursor: pointer;\n width: ", ";\n height: ", ";\n justify-content: center;\n align-items: center;\n"])), function (props) { return props.backgroundColor; }, function (props) { return "".concat(props.size, "em"); }, function (props) { return "".concat(props.size, "em"); });
13550
+ var Container$a = newStyled.div(templateObject_1$d || (templateObject_1$d = __makeTemplateObject(["\n margin: 0;\n padding: 0.25rem;\n background-color: ", ";\n display: inline-flex;\n border-radius: 50%;\n cursor: pointer;\n width: ", ";\n height: ", ";\n justify-content: center;\n align-items: center;\n"], ["\n margin: 0;\n padding: 0.25rem;\n background-color: ", ";\n display: inline-flex;\n border-radius: 50%;\n cursor: pointer;\n width: ", ";\n height: ", ";\n justify-content: center;\n align-items: center;\n"])), function (props) { return props.backgroundColor; }, function (props) { return "".concat(props.size, "em"); }, function (props) { return "".concat(props.size, "em"); });
13162
13551
  var CloseButton = function (_a) {
13163
13552
  var onClick = _a.onClick, size = _a.size;
13164
13553
  var theme = useTheme();
13165
- return (jsx$1(Container$7, __assign$1({ backgroundColor: theme.colors.shades['700'].color, onClick: onClick, "data-testid": "CartProductItemCloseBtn", size: size }, { children: jsx$1(Icon.Actions.Close, { width: size - 1, height: size - 1, fill: "#fff" }, void 0) }), void 0));
13554
+ return (jsx$1(Container$a, __assign$1({ backgroundColor: theme.colors.shades['700'].color, onClick: onClick, "data-testid": "CartProductItemCloseBtn", size: size }, { children: jsx$1(Icon.Actions.Close, { width: size - 1, height: size - 1, fill: "#fff" }, void 0) }), void 0));
13166
13555
  };
13167
- var templateObject_1$a;
13556
+ var templateObject_1$d;
13168
13557
 
13169
13558
  var CartProductItem = {
13170
13559
  Title: Title$1,
@@ -13174,9 +13563,9 @@ var CartProductItem = {
13174
13563
  CloseButton: CloseButton,
13175
13564
  };
13176
13565
 
13177
- var Container$6 = newStyled.div(templateObject_1$9 || (templateObject_1$9 = __makeTemplateObject(["\n padding: 0.625rem 0;\n border: 0.063rem solid ", ";\n border-radius: 0.5rem;\n display: inline-flex;\n align-items: center;\n justify-content: space-around;\n width: 100%;\n max-width: 3.75rem;\n\n * {\n color: ", ";\n }\n"], ["\n padding: 0.625rem 0;\n border: 0.063rem solid ", ";\n border-radius: 0.5rem;\n display: inline-flex;\n align-items: center;\n justify-content: space-around;\n width: 100%;\n max-width: 3.75rem;\n\n * {\n color: ", ";\n }\n"])), function (props) { return props.borderColor; }, function (props) { return props.color; });
13178
- var Item = newStyled.span(templateObject_2$7 || (templateObject_2$7 = __makeTemplateObject(["\n font-size: 0.875rem;\n line-height: 1.125rem;\n margin: 0;\n padding: 0;\n"], ["\n font-size: 0.875rem;\n line-height: 1.125rem;\n margin: 0;\n padding: 0;\n"])));
13179
- var Number$1 = newStyled(Item)(templateObject_3$7 || (templateObject_3$7 = __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"])));
13566
+ var Container$9 = newStyled.div(templateObject_1$c || (templateObject_1$c = __makeTemplateObject(["\n padding: 0.625rem 0;\n border: 0.063rem solid ", ";\n border-radius: 0.5rem;\n display: inline-flex;\n align-items: center;\n justify-content: space-around;\n width: 100%;\n max-width: 3.75rem;\n\n * {\n color: ", ";\n }\n"], ["\n padding: 0.625rem 0;\n border: 0.063rem solid ", ";\n border-radius: 0.5rem;\n display: inline-flex;\n align-items: center;\n justify-content: space-around;\n width: 100%;\n max-width: 3.75rem;\n\n * {\n color: ", ";\n }\n"])), function (props) { return props.borderColor; }, function (props) { return props.color; });
13567
+ var Item = newStyled.span(templateObject_2$a || (templateObject_2$a = __makeTemplateObject(["\n font-size: 0.875rem;\n line-height: 1.125rem;\n margin: 0;\n padding: 0;\n"], ["\n font-size: 0.875rem;\n line-height: 1.125rem;\n margin: 0;\n padding: 0;\n"])));
13568
+ var Number$1 = newStyled(Item)(templateObject_3$a || (templateObject_3$a = __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"])));
13180
13569
  var IncreaseDecrease = newStyled(Item)(templateObject_4$5 || (templateObject_4$5 = __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"])));
13181
13570
  var QuantityPicker = function (_a) {
13182
13571
  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;
@@ -13200,9 +13589,9 @@ var QuantityPicker = function (_a) {
13200
13589
  return clamp(value);
13201
13590
  });
13202
13591
  }, [value, clamp]);
13203
- return (jsxs$1(Container$6, __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));
13592
+ return (jsxs$1(Container$9, __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));
13204
13593
  };
13205
- var templateObject_1$9, templateObject_2$7, templateObject_3$7, templateObject_4$5;
13594
+ var templateObject_1$c, templateObject_2$a, templateObject_3$a, templateObject_4$5;
13206
13595
 
13207
13596
  var htmlReactParser = {exports: {}};
13208
13597
 
@@ -16983,9 +17372,9 @@ HTMLReactParser$1.htmlToDOM;
16983
17372
  HTMLReactParser$1.attributesToProps;
16984
17373
  HTMLReactParser$1.Element;
16985
17374
 
16986
- var Container$5 = newStyled.div(templateObject_1$8 || (templateObject_1$8 = __makeTemplateObject(["\n position: relative;\n display: flex;\n border-radius: 6px;\n gap: 6px;\n"], ["\n position: relative;\n display: flex;\n border-radius: 6px;\n gap: 6px;\n"])));
16987
- var Card = newStyled.div(templateObject_2$6 || (templateObject_2$6 = __makeTemplateObject(["\n --background: var(--colors-background-color);\n\n flex: 1;\n position: relative;\n overflow: hidden;\n cursor: pointer;\n border: 2px solid var(--component-packSelector-borderColor);\n padding: 20px 7px 7px;\n text-align: center;\n background-color: var(--background);\n border-radius: var(--component-packSelector-borderRadius);\n\n &[aria-checked='true'] {\n --color: var(--component-packSelector-selectedColor);\n\n border-color: var(--color);\n\n & * {\n color: var(--color);\n }\n }\n"], ["\n --background: var(--colors-background-color);\n\n flex: 1;\n position: relative;\n overflow: hidden;\n cursor: pointer;\n border: 2px solid var(--component-packSelector-borderColor);\n padding: 20px 7px 7px;\n text-align: center;\n background-color: var(--background);\n border-radius: var(--component-packSelector-borderRadius);\n\n &[aria-checked='true'] {\n --color: var(--component-packSelector-selectedColor);\n\n border-color: var(--color);\n\n & * {\n color: var(--color);\n }\n }\n"])));
16988
- var Tag = newStyled.div(templateObject_3$6 || (templateObject_3$6 = __makeTemplateObject(["\n position: absolute;\n width: 100%;\n left: 50%;\n top: 0;\n transform: translateX(-50%);\n background-color: var(--component-packSelector-tagColor);\n display: flex;\n align-items: center;\n justify-content: center;\n padding: 1px 0;\n\n [aria-checked='true'] & {\n background-color: var(--component-packSelector-selectedColor);\n\n & * {\n color: var(--component-packSelector-selectedContrast) !important;\n }\n }\n"], ["\n position: absolute;\n width: 100%;\n left: 50%;\n top: 0;\n transform: translateX(-50%);\n background-color: var(--component-packSelector-tagColor);\n display: flex;\n align-items: center;\n justify-content: center;\n padding: 1px 0;\n\n [aria-checked='true'] & {\n background-color: var(--component-packSelector-selectedColor);\n\n & * {\n color: var(--component-packSelector-selectedContrast) !important;\n }\n }\n"])));
17375
+ var Container$8 = newStyled.div(templateObject_1$b || (templateObject_1$b = __makeTemplateObject(["\n position: relative;\n display: flex;\n border-radius: 6px;\n gap: 6px;\n"], ["\n position: relative;\n display: flex;\n border-radius: 6px;\n gap: 6px;\n"])));
17376
+ var Card = newStyled.div(templateObject_2$9 || (templateObject_2$9 = __makeTemplateObject(["\n --background: var(--colors-background-color);\n\n flex: 1;\n position: relative;\n overflow: hidden;\n cursor: pointer;\n border: 2px solid var(--component-packSelector-borderColor);\n padding: 20px 7px 7px;\n text-align: center;\n background-color: var(--background);\n border-radius: var(--component-packSelector-borderRadius);\n\n &[aria-checked='true'] {\n --color: var(--component-packSelector-selectedColor);\n\n border-color: var(--color);\n\n & * {\n color: var(--color);\n }\n }\n"], ["\n --background: var(--colors-background-color);\n\n flex: 1;\n position: relative;\n overflow: hidden;\n cursor: pointer;\n border: 2px solid var(--component-packSelector-borderColor);\n padding: 20px 7px 7px;\n text-align: center;\n background-color: var(--background);\n border-radius: var(--component-packSelector-borderRadius);\n\n &[aria-checked='true'] {\n --color: var(--component-packSelector-selectedColor);\n\n border-color: var(--color);\n\n & * {\n color: var(--color);\n }\n }\n"])));
17377
+ var Tag = newStyled.div(templateObject_3$9 || (templateObject_3$9 = __makeTemplateObject(["\n position: absolute;\n width: 100%;\n left: 50%;\n top: 0;\n transform: translateX(-50%);\n background-color: var(--component-packSelector-tagColor);\n display: flex;\n align-items: center;\n justify-content: center;\n padding: 1px 0;\n\n [aria-checked='true'] & {\n background-color: var(--component-packSelector-selectedColor);\n\n & * {\n color: var(--component-packSelector-selectedContrast) !important;\n }\n }\n"], ["\n position: absolute;\n width: 100%;\n left: 50%;\n top: 0;\n transform: translateX(-50%);\n background-color: var(--component-packSelector-tagColor);\n display: flex;\n align-items: center;\n justify-content: center;\n padding: 1px 0;\n\n [aria-checked='true'] & {\n background-color: var(--component-packSelector-selectedColor);\n\n & * {\n color: var(--component-packSelector-selectedContrast) !important;\n }\n }\n"])));
16989
17378
  var Label = newStyled.div(templateObject_4$4 || (templateObject_4$4 = __makeTemplateObject(["\n position: relative;\n width: fit-content;\n margin: 0 auto;\n"], ["\n position: relative;\n width: fit-content;\n margin: 0 auto;\n"])));
16990
17379
  var Check = newStyled.div(templateObject_5$2 || (templateObject_5$2 = __makeTemplateObject(["\n position: absolute;\n width: 20px;\n height: 20px;\n background-color: var(--color);\n border-radius: 50%;\n left: 100%;\n top: 50%;\n transform: translate(6px, -50%) scale(0.5);\n opacity: 0;\n transition: opacity 0.3s, transform 0.3s;\n\n &[data-visible='true'] {\n transform: translate(6px, -50%) scale(1);\n opacity: 1;\n }\n"], ["\n position: absolute;\n width: 20px;\n height: 20px;\n background-color: var(--color);\n border-radius: 50%;\n left: 100%;\n top: 50%;\n transform: translate(6px, -50%) scale(0.5);\n opacity: 0;\n transition: opacity 0.3s, transform 0.3s;\n\n &[data-visible='true'] {\n transform: translate(6px, -50%) scale(1);\n opacity: 1;\n }\n"])));
16991
17380
  var IconContainer = newStyled.div(templateObject_6$1 || (templateObject_6$1 = __makeTemplateObject(["\n height: 56px;\n display: flex;\n align-items: center;\n justify-content: center;\n\n [aria-checked='true'] & * {\n fill: var(--color);\n }\n"], ["\n height: 56px;\n display: flex;\n align-items: center;\n justify-content: center;\n\n [aria-checked='true'] & * {\n fill: var(--color);\n }\n"])));
@@ -16993,7 +17382,7 @@ var IconPlaceholder = newStyled.div(templateObject_7$1 || (templateObject_7$1 =
16993
17382
  var DiscountContainer = newStyled.div(templateObject_8$1 || (templateObject_8$1 = __makeTemplateObject(["\n display: flex,\n flex-direction: row,\n align-items: center;\n justify-content: center;\n"], ["\n display: flex,\n flex-direction: row,\n align-items: center;\n justify-content: center;\n"])));
16994
17383
  var PackSelector = function (_a) {
16995
17384
  var packs = _a.packs, selectedValue = _a.selectedValue, onChange = _a.onChange;
16996
- return (jsx$1(Container$5, __assign$1({ role: "radiogroup" }, { children: packs.map(function (pack) {
17385
+ return (jsx$1(Container$8, __assign$1({ role: "radiogroup" }, { children: packs.map(function (pack) {
16997
17386
  return (jsx$1(PackCard, { pack: pack, onChange: onChange, selected: selectedValue === pack }, pack.label));
16998
17387
  }) }), void 0));
16999
17388
  };
@@ -17010,22 +17399,22 @@ var PackCard = function (_a) {
17010
17399
  color: 'var(--colors-semantic-urgent-color)',
17011
17400
  } }, { 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(DiscountContainer, { children: [jsx$1(Text$6, __assign$1({ variant: "label", size: "small", style: { textDecoration: 'line-through' } }, { children: formatPrice(pack.meta.originalPrice) }), void 0), jsxs$1(Text$6, __assign$1({ variant: "label", size: "small" }, { children: [' - ', " ", formatPrice(pack.meta.price)] }), void 0)] }, void 0), jsxs$1(Text$6, __assign$1({ variant: "body", weight: "demi", size: "small" }, { children: [formatPrice(pack.meta.price / pack.meta.quantity), " each"] }), void 0)] }), void 0));
17012
17401
  };
17013
- var templateObject_1$8, templateObject_2$6, templateObject_3$6, templateObject_4$4, templateObject_5$2, templateObject_6$1, templateObject_7$1, templateObject_8$1;
17402
+ var templateObject_1$b, templateObject_2$9, templateObject_3$9, templateObject_4$4, templateObject_5$2, templateObject_6$1, templateObject_7$1, templateObject_8$1;
17014
17403
 
17015
- var Title = newStyled.div(templateObject_1$7 || (templateObject_1$7 = __makeTemplateObject(["\n display: flex;\n align-items: center;\n justify-content: space-between;\n border-bottom: 0.063rem solid ", ";\n user-select: none;\n cursor: pointer;\n"], ["\n display: flex;\n align-items: center;\n justify-content: space-between;\n border-bottom: 0.063rem solid ", ";\n user-select: none;\n cursor: pointer;\n"])), function (props) { return props.borderColor; });
17016
- var H2 = newStyled.h2(templateObject_2$5 || (templateObject_2$5 = __makeTemplateObject(["\n font-size: 1rem;\n font-weight: 700;\n line-height: 1.5rem;\n color: ", ";\n margin: 0.75rem 0;\n"], ["\n font-size: 1rem;\n font-weight: 700;\n line-height: 1.5rem;\n color: ", ";\n margin: 0.75rem 0;\n"])), function (props) { return props.color; });
17017
- var ArrowContainer = newStyled.div(templateObject_3$5 || (templateObject_3$5 = __makeTemplateObject(["\n width: 1rem;\n height: 1rem;\n"], ["\n width: 1rem;\n height: 1rem;\n"])));
17404
+ var Title = newStyled.div(templateObject_1$a || (templateObject_1$a = __makeTemplateObject(["\n display: flex;\n align-items: center;\n justify-content: space-between;\n border-bottom: 0.063rem solid ", ";\n user-select: none;\n cursor: pointer;\n"], ["\n display: flex;\n align-items: center;\n justify-content: space-between;\n border-bottom: 0.063rem solid ", ";\n user-select: none;\n cursor: pointer;\n"])), function (props) { return props.borderColor; });
17405
+ var H2 = newStyled.h2(templateObject_2$8 || (templateObject_2$8 = __makeTemplateObject(["\n font-size: 1rem;\n font-weight: 700;\n line-height: 1.5rem;\n color: ", ";\n margin: 0.75rem 0;\n"], ["\n font-size: 1rem;\n font-weight: 700;\n line-height: 1.5rem;\n color: ", ";\n margin: 0.75rem 0;\n"])), function (props) { return props.color; });
17406
+ var ArrowContainer = newStyled.div(templateObject_3$8 || (templateObject_3$8 = __makeTemplateObject(["\n width: 1rem;\n height: 1rem;\n"], ["\n width: 1rem;\n height: 1rem;\n"])));
17018
17407
  var Accordion = function (_a) {
17019
17408
  var title = _a.title, children = _a.children, _b = _a.isOpenByDefault, isOpenByDefault = _b === void 0 ? false : _b;
17020
17409
  var theme = useTheme();
17021
17410
  var _c = React__default.useState(isOpenByDefault), isOpen = _c[0], setIsOpen = _c[1];
17022
17411
  return (jsxs$1("div", __assign$1({ "data-testid": "FiltersAccordion" }, { children: [jsxs$1(Title, __assign$1({ onClick: function () { return setIsOpen(function (state) { return !state; }); }, borderColor: theme.colors.shades['100'].color, "data-testid": "accordion-title" }, { children: [jsx$1(H2, __assign$1({ color: theme.colors.shades['550'].color }, { children: title }), void 0), jsx$1(ArrowContainer, { children: isOpen ? (jsx$1(Icon.Arrows.ChevronUp, { fill: theme.colors.shades['700'].color }, void 0)) : (jsx$1(Icon.Arrows.ChevronDown, { fill: theme.colors.shades['700'].color }, void 0)) }, void 0)] }), void 0), jsx$1("div", __assign$1({ style: { display: isOpen ? 'block' : 'none' }, "data-testid": "accordion-children-container" }, { children: children }), void 0)] }), void 0));
17023
17412
  };
17024
- var templateObject_1$7, templateObject_2$5, templateObject_3$5;
17413
+ var templateObject_1$a, templateObject_2$8, templateObject_3$8;
17025
17414
 
17026
- var SectionContent = newStyled.div(templateObject_1$6 || (templateObject_1$6 = __makeTemplateObject(["\n display: grid;\n grid-template-columns: repeat(", ", 1fr);\n grid-gap: 1.125rem;\n margin: 1.25rem 0;\n"], ["\n display: grid;\n grid-template-columns: repeat(", ", 1fr);\n grid-gap: 1.125rem;\n margin: 1.25rem 0;\n"])), function (props) { return props.cols; });
17027
- var Header = newStyled.div(templateObject_2$4 || (templateObject_2$4 = __makeTemplateObject(["\n display: flex;\n align-items: center;\n justify-content: space-between;\n margin-bottom: 1.063rem;\n"], ["\n display: flex;\n align-items: center;\n justify-content: space-between;\n margin-bottom: 1.063rem;\n"])));
17028
- var MobileHeader = newStyled.div(templateObject_3$4 || (templateObject_3$4 = __makeTemplateObject(["\n display: flex;\n align-items: center;\n justify-content: space-between;\n margin-bottom: 2.25rem;\n margin-top: 1.063rem;\n"], ["\n display: flex;\n align-items: center;\n justify-content: space-between;\n margin-bottom: 2.25rem;\n margin-top: 1.063rem;\n"])));
17415
+ var SectionContent = newStyled.div(templateObject_1$9 || (templateObject_1$9 = __makeTemplateObject(["\n display: grid;\n grid-template-columns: repeat(", ", 1fr);\n grid-gap: 1.125rem;\n margin: 1.25rem 0;\n"], ["\n display: grid;\n grid-template-columns: repeat(", ", 1fr);\n grid-gap: 1.125rem;\n margin: 1.25rem 0;\n"])), function (props) { return props.cols; });
17416
+ var Header = newStyled.div(templateObject_2$7 || (templateObject_2$7 = __makeTemplateObject(["\n display: flex;\n align-items: center;\n justify-content: space-between;\n margin-bottom: 1.063rem;\n"], ["\n display: flex;\n align-items: center;\n justify-content: space-between;\n margin-bottom: 1.063rem;\n"])));
17417
+ var MobileHeader = newStyled.div(templateObject_3$7 || (templateObject_3$7 = __makeTemplateObject(["\n display: flex;\n align-items: center;\n justify-content: space-between;\n margin-bottom: 2.25rem;\n margin-top: 1.063rem;\n"], ["\n display: flex;\n align-items: center;\n justify-content: space-between;\n margin-bottom: 2.25rem;\n margin-top: 1.063rem;\n"])));
17029
17418
  var MobileIconsContainer = newStyled.div(templateObject_4$3 || (templateObject_4$3 = __makeTemplateObject(["\n width: 1.5rem;\n height: 1.5rem;\n cursor: pointer;\n"], ["\n width: 1.5rem;\n height: 1.5rem;\n cursor: pointer;\n"])));
17030
17419
  var H4 = newStyled.h4(templateObject_5$1 || (templateObject_5$1 = __makeTemplateObject(["\n font-size: 0.875rem;\n font-weight: 400;\n line-height: 1.375rem;\n margin: 0;\n color: ", ";\n"], ["\n font-size: 0.875rem;\n font-weight: 400;\n line-height: 1.375rem;\n margin: 0;\n color: ", ";\n"])), function (props) { return props.color; });
17031
17420
  var FilterLink = newStyled.a(templateObject_6 || (templateObject_6 = __makeTemplateObject(["\n font-size: 1rem;\n font-weight: 700;\n line-height: 1.5rem;\n color: ", ";\n text-decoration: none;\n"], ["\n font-size: 1rem;\n font-weight: 700;\n line-height: 1.5rem;\n color: ", ";\n text-decoration: none;\n"])), function (props) { return props.color; });
@@ -17033,7 +17422,7 @@ var OptionContainer = newStyled.div(templateObject_7 || (templateObject_7 = __ma
17033
17422
  var ClearAll = newStyled.span(templateObject_8 || (templateObject_8 = __makeTemplateObject(["\n font-size: 0.875rem;\n font-weight: 600;\n line-height: 1.375rem;\n margin: 0;\n color: ", ";\n text-decoration: underline;\n cursor: pointer;\n"], ["\n font-size: 0.875rem;\n font-weight: 600;\n line-height: 1.375rem;\n margin: 0;\n color: ", ";\n text-decoration: underline;\n cursor: pointer;\n"])), function (props) { return props.color; });
17034
17423
  var MobileFooter = newStyled.div(templateObject_9 || (templateObject_9 = __makeTemplateObject(["\n background-color: #fff;\n padding: 0.75rem 0.938rem;\n position: sticky;\n bottom: 0;\n z-index: 1;\n margin-top: 5.625rem;\n display: flex;\n justify-content: space-between;\n align-items: center;\n"], ["\n background-color: #fff;\n padding: 0.75rem 0.938rem;\n position: sticky;\n bottom: 0;\n z-index: 1;\n margin-top: 5.625rem;\n display: flex;\n justify-content: space-between;\n align-items: center;\n"])));
17035
17424
  var MobileClearContainer = newStyled.div(templateObject_10 || (templateObject_10 = __makeTemplateObject(["\n display: flex;\n align-items: center;\n cursor: pointer;\n\n span {\n margin-left: 0.5rem;\n user-select: none;\n }\n"], ["\n display: flex;\n align-items: center;\n cursor: pointer;\n\n span {\n margin-left: 0.5rem;\n user-select: none;\n }\n"])));
17036
- var templateObject_1$6, templateObject_2$4, templateObject_3$4, templateObject_4$3, templateObject_5$1, templateObject_6, templateObject_7, templateObject_8, templateObject_9, templateObject_10;
17425
+ var templateObject_1$9, templateObject_2$7, templateObject_3$7, templateObject_4$3, templateObject_5$1, templateObject_6, templateObject_7, templateObject_8, templateObject_9, templateObject_10;
17037
17426
 
17038
17427
  var Filters = function (_a) {
17039
17428
  var values = _a.values, 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;
@@ -17121,11 +17510,13 @@ var Filters = function (_a) {
17121
17510
  });
17122
17511
  onResetValues();
17123
17512
  };
17124
- 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
17513
+ 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) {
17514
+ return item.label === '$75 And Above' ? '+$75' : item.label;
17515
+ }), 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
17125
17516
  .filter(function (filter) { return filter.isLinkOption; })
17126
17517
  .map(function (option, index) { return (jsx$1(OptionContainer, { children: jsx$1(FilterLink, __assign$1({ color: option.color || theme.colors.shades['550'].color, href: option.link }, { children: option.title }), void 0) }, index)); }), filters
17127
17518
  .filter(function (filter) { return !filter.isLinkOption; })
17128
- .map(function (filter) { 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.label, checked: item.checked, itemIndex: itemIndex, sectionIndex: filters.findIndex(function (filt) { return filt.title === filter.title; }) }, "".concat(item.checked, "-").concat(item.label))); }) }), void 0) }), filters.findIndex(function (filt) { return filt.title === filter.title; }))); }), 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));
17519
+ .map(function (filter) { 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.label === '$75 And Above' ? '+$75' : item.label, checked: item.checked, itemIndex: itemIndex, sectionIndex: filters.findIndex(function (filt) { return filt.title === filter.title; }) }, "".concat(item.checked, "-").concat(item.label))); }) }), void 0) }), filters.findIndex(function (filt) { return filt.title === filter.title; }))); }), 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));
17129
17520
  };
17130
17521
  var FilterCheckbox = function (_a) {
17131
17522
  var sectionIndex = _a.sectionIndex, text = _a.text, itemIndex = _a.itemIndex, onChangeProp = _a.onChange, checked = _a.checked;
@@ -17135,20 +17526,20 @@ var FilterCheckbox = function (_a) {
17135
17526
  return (jsx$1(Checkbox, { onChange: onChange, checked: checked, text: text, id: "filter[".concat(sectionIndex, ",").concat(itemIndex, "]"), size: ComponentSize.Small, variant: "secondary" }, itemIndex));
17136
17527
  };
17137
17528
 
17138
- var Container$4 = newStyled.div(templateObject_1$5 || (templateObject_1$5 = __makeTemplateObject(["\n display: flex;\n flex-wrap: wrap;\n padding: 0 1rem 1rem;\n"], ["\n display: flex;\n flex-wrap: wrap;\n padding: 0 1rem 1rem;\n"])));
17139
- var BackArrow = newStyled.div(templateObject_2$3 || (templateObject_2$3 = __makeTemplateObject(["\n transform: rotate(180deg);\n margin-right: 0.5rem;\n"], ["\n transform: rotate(180deg);\n margin-right: 0.5rem;\n"])));
17140
- var BoldSpan = newStyled.span(templateObject_3$3 || (templateObject_3$3 = __makeTemplateObject(["\n font-size: 0.875rem;\n line-height: 1.375rem;\n font-weight: 600;\n"], ["\n font-size: 0.875rem;\n line-height: 1.375rem;\n font-weight: 600;\n"])));
17529
+ var Container$7 = newStyled.div(templateObject_1$8 || (templateObject_1$8 = __makeTemplateObject(["\n display: flex;\n flex-wrap: wrap;\n padding: 0 1rem 1rem;\n"], ["\n display: flex;\n flex-wrap: wrap;\n padding: 0 1rem 1rem;\n"])));
17530
+ var BackArrow = newStyled.div(templateObject_2$6 || (templateObject_2$6 = __makeTemplateObject(["\n transform: rotate(180deg);\n margin-right: 0.5rem;\n"], ["\n transform: rotate(180deg);\n margin-right: 0.5rem;\n"])));
17531
+ var BoldSpan = newStyled.span(templateObject_3$6 || (templateObject_3$6 = __makeTemplateObject(["\n font-size: 0.875rem;\n line-height: 1.375rem;\n font-weight: 600;\n"], ["\n font-size: 0.875rem;\n line-height: 1.375rem;\n font-weight: 600;\n"])));
17141
17532
  var NormalSpan = newStyled.span(templateObject_4$2 || (templateObject_4$2 = __makeTemplateObject(["\n font-size: 0.875rem;\n line-height: 1.375rem;\n white-space: pre;\n"], ["\n font-size: 0.875rem;\n line-height: 1.375rem;\n white-space: pre;\n"])));
17142
17533
  var SearchNavigationParents = newStyled.div(templateObject_5 || (templateObject_5 = __makeTemplateObject(["\n display: flex;\n flex-wrap: wrap;\n padding-left: 1.25rem;\n padding-right: 1rem;\n"], ["\n display: flex;\n flex-wrap: wrap;\n padding-left: 1.25rem;\n padding-right: 1rem;\n"])));
17143
17534
  var SearchNavigation = function (_a) {
17144
17535
  var returnText = _a.returnText, returnUrl = _a.returnUrl, _b = _a.steps, steps = _b === void 0 ? [] : _b, returnAction = _a.returnAction;
17145
- return (jsxs$1(Container$4, { children: [jsxs$1(Text$6, __assign$1({ variant: "link", style: { display: 'flex', justifyContent: 'center' }, href: returnUrl || '/', onClick: returnAction }, { children: [jsx$1(BackArrow, { children: jsx$1(Icon.Arrows.ChevronRightVariant, { width: 1.375, height: 1.375 }, void 0) }, void 0), returnText && jsx$1(BoldSpan, { children: returnText }, void 0)] }), void 0), jsx$1(SearchNavigationParents, { children: steps.map(function (step, index) {
17536
+ return (jsxs$1(Container$7, { children: [jsxs$1(Text$6, __assign$1({ variant: "link", style: { display: 'flex', justifyContent: 'center' }, href: returnUrl || '/', onClick: returnAction }, { children: [jsx$1(BackArrow, { children: jsx$1(Icon.Arrows.ChevronRightVariant, { width: 1.375, height: 1.375 }, void 0) }, void 0), returnText && jsx$1(BoldSpan, { children: returnText }, void 0)] }), void 0), jsx$1(SearchNavigationParents, { children: steps.map(function (step, index) {
17146
17537
  return index === steps.length - 1 ? (jsx$1(BoldSpan, { children: step }, void 0)) : (jsx$1(NormalSpan, { children: "".concat(step, " / ") }, step));
17147
17538
  }) }, void 0)] }, void 0));
17148
17539
  };
17149
- var templateObject_1$5, templateObject_2$3, templateObject_3$3, templateObject_4$2, templateObject_5;
17540
+ var templateObject_1$8, templateObject_2$6, templateObject_3$6, templateObject_4$2, templateObject_5;
17150
17541
 
17151
- var TabContainer = newStyled.div(templateObject_1$4 || (templateObject_1$4 = __makeTemplateObject(["\n display: flex;\n justify-content: center;\n align-content: center;\n flex-direction: column;\n flex: 1 1 0;\n font-size: ", ";\n height: ", ";\n margin: 0 auto;\n text-align: center;\n cursor: pointer;\n transition: all 0.2s;\n max-width: ", ";\n border: none;\n\n ", "\n"], ["\n display: flex;\n justify-content: center;\n align-content: center;\n flex-direction: column;\n flex: 1 1 0;\n font-size: ", ";\n height: ", ";\n margin: 0 auto;\n text-align: center;\n cursor: pointer;\n transition: all 0.2s;\n max-width: ", ";\n border: none;\n\n ", "\n"])), function (_a) {
17542
+ var TabContainer = newStyled.div(templateObject_1$7 || (templateObject_1$7 = __makeTemplateObject(["\n display: flex;\n justify-content: center;\n align-content: center;\n flex-direction: column;\n flex: 1 1 0;\n font-size: ", ";\n height: ", ";\n margin: 0 auto;\n text-align: center;\n cursor: pointer;\n transition: all 0.2s;\n max-width: ", ";\n border: none;\n\n ", "\n"], ["\n display: flex;\n justify-content: center;\n align-content: center;\n flex-direction: column;\n flex: 1 1 0;\n font-size: ", ";\n height: ", ";\n margin: 0 auto;\n text-align: center;\n cursor: pointer;\n transition: all 0.2s;\n max-width: ", ";\n border: none;\n\n ", "\n"])), function (_a) {
17152
17543
  var titleSize = _a.titleSize;
17153
17544
  return titleSize;
17154
17545
  }, function (_a) {
@@ -17165,14 +17556,14 @@ var Tab = function (_a) {
17165
17556
  var title = _a.title, _b = _a.titleSize, titleSize = _b === void 0 ? '14px' : _b, _c = _a.height, height = _c === void 0 ? '4.5rem' : _c, _d = _a.selectedTitleWeight, selectedTitleWeight = _d === void 0 ? 700 : _d, selected = _a.selected, onClick = _a.onClick, _e = _a.color, color = _e === void 0 ? 'var(--colors-pallete-primary-color)' : _e, _f = _a.tabsMaxWidth, tabsMaxWidth = _f === void 0 ? '11rem' : _f;
17166
17557
  return (jsx$1(Fragment$1, { children: jsx$1(TabContainer, __assign$1({ selected: selected, onClick: function () { return onClick(title); }, color: color, titleSize: titleSize, height: height, selectedTitleWeight: selectedTitleWeight, tabsMaxWidth: tabsMaxWidth }, { children: title }), title) }, void 0));
17167
17558
  };
17168
- var templateObject_1$4;
17559
+ var templateObject_1$7;
17169
17560
 
17170
- var Container$3 = newStyled.div(templateObject_1$3 || (templateObject_1$3 = __makeTemplateObject(["\n width: 100%;\n"], ["\n width: 100%;\n"])));
17171
- var TabList = newStyled.div(templateObject_2$2 || (templateObject_2$2 = __makeTemplateObject(["\n background-color: ", ";\n display: flex;\n flex-direction: row;\n flex-wrap: wrap;\n padding: 0 25px;\n"], ["\n background-color: ", ";\n display: flex;\n flex-direction: row;\n flex-wrap: wrap;\n padding: 0 25px;\n"])), function (_a) {
17561
+ var Container$6 = newStyled.div(templateObject_1$6 || (templateObject_1$6 = __makeTemplateObject(["\n width: 100%;\n"], ["\n width: 100%;\n"])));
17562
+ var TabList = newStyled.div(templateObject_2$5 || (templateObject_2$5 = __makeTemplateObject(["\n background-color: ", ";\n display: flex;\n flex-direction: row;\n flex-wrap: wrap;\n padding: 0 25px;\n"], ["\n background-color: ", ";\n display: flex;\n flex-direction: row;\n flex-wrap: wrap;\n padding: 0 25px;\n"])), function (_a) {
17172
17563
  var backgroundColor = _a.backgroundColor;
17173
17564
  return backgroundColor;
17174
17565
  });
17175
- var TabContent = newStyled.div(templateObject_3$2 || (templateObject_3$2 = __makeTemplateObject(["\n display: block;\n"], ["\n display: block;\n"])));
17566
+ var TabContent = newStyled.div(templateObject_3$5 || (templateObject_3$5 = __makeTemplateObject(["\n display: block;\n"], ["\n display: block;\n"])));
17176
17567
  var TabSeparator = newStyled.div(templateObject_4$1 || (templateObject_4$1 = __makeTemplateObject(["\n color: var(--colors-shades-white-color);\n font-family: initial;\n font-size: 40px;\n line-height: 69px;\n padding: 0 25px;\n"], ["\n color: var(--colors-shades-white-color);\n font-family: initial;\n font-size: 40px;\n line-height: 69px;\n padding: 0 25px;\n"])));
17177
17568
  var Tabs = function (_a) {
17178
17569
  var _b;
@@ -17182,11 +17573,11 @@ var Tabs = function (_a) {
17182
17573
  return null;
17183
17574
  }
17184
17575
  var selectedContent = (_b = tabs.find(function (tab) { return tab.title === selectedTab; })) === null || _b === void 0 ? void 0 : _b.content;
17185
- return (jsxs$1(Container$3, __assign$1({ "data-testid": "tabs-container" }, { children: [jsx$1(TabList, __assign$1({ backgroundColor: backgroundColor }, { children: tabs.map(function (tab, index) { return (jsxs$1(Fragment$1, { children: [jsx$1(Tab, { title: tab.title, selected: selectedTab === tab.title, onClick: setSelectedTab, tabsMaxWidth: tabsMaxWidth }, tab.title), index + 1 < tabs.length && jsx$1(TabSeparator, { children: "|" }, void 0)] }, void 0)); }) }), void 0), jsx$1(TabContent, __assign$1({ "data-testid": "tab-content" }, { children: selectedContent }), void 0)] }), void 0));
17576
+ return (jsxs$1(Container$6, __assign$1({ "data-testid": "tabs-container" }, { children: [jsx$1(TabList, __assign$1({ backgroundColor: backgroundColor }, { children: tabs.map(function (tab, index) { return (jsxs$1(Fragment$1, { children: [jsx$1(Tab, { title: tab.title, selected: selectedTab === tab.title, onClick: setSelectedTab, tabsMaxWidth: tabsMaxWidth }, tab.title), index + 1 < tabs.length && jsx$1(TabSeparator, { children: "|" }, void 0)] }, void 0)); }) }), void 0), jsx$1(TabContent, __assign$1({ "data-testid": "tab-content" }, { children: selectedContent }), void 0)] }), void 0));
17186
17577
  };
17187
- var templateObject_1$3, templateObject_2$2, templateObject_3$2, templateObject_4$1;
17578
+ var templateObject_1$6, templateObject_2$5, templateObject_3$5, templateObject_4$1;
17188
17579
 
17189
- var Container$2 = newStyled.div(function (props) { return ({
17580
+ var Container$5 = newStyled.div(function (props) { return ({
17190
17581
  height: 'auto',
17191
17582
  textAlign: 'center',
17192
17583
  justifyContent: 'center',
@@ -17236,12 +17627,12 @@ var IconsWithTitle = function (_a) {
17236
17627
  textAlign: 'center',
17237
17628
  lineHeight: '18px',
17238
17629
  };
17239
- return (jsx$1(Fragment$1, { children: jsxs$1(Container$2, __assign$1({ textPosition: iconTitlePosition }, { children: [jsx$1(IconWrapper, __assign$1({ backgroundColor: backgroundColor, style: iconStyles, iconSize: isMobile ? iconSizeMobile : iconSizeDesktop }, { children: jsx$1(IconComponent, { width: isMobile ? iconSizeMobile : iconSizeDesktop, height: isMobile ? iconSizeMobile : iconSizeDesktop, fill: iconColor }, void 0) }), void 0), jsx$1(Text$6, { variant: "heading6", weight: "demi", style: titleStyles ? titleStyles : defaultTitleStyle, dangerouslySetInnerHTML: isTitleInnerHtml ? { __html: iconTitle } : { __html: "<span>".concat(iconTitle, "</span>") } }, void 0)] }), void 0) }, void 0));
17630
+ return (jsx$1(Fragment$1, { children: jsxs$1(Container$5, __assign$1({ textPosition: iconTitlePosition }, { children: [jsx$1(IconWrapper, __assign$1({ backgroundColor: backgroundColor, style: iconStyles, iconSize: isMobile ? iconSizeMobile : iconSizeDesktop }, { children: jsx$1(IconComponent, { width: isMobile ? iconSizeMobile : iconSizeDesktop, height: isMobile ? iconSizeMobile : iconSizeDesktop, fill: iconColor }, void 0) }), void 0), jsx$1(Text$6, { variant: "heading6", weight: "demi", style: titleStyles ? titleStyles : defaultTitleStyle, dangerouslySetInnerHTML: isTitleInnerHtml ? { __html: iconTitle } : { __html: "<span>".concat(iconTitle, "</span>") } }, void 0)] }), void 0) }, void 0));
17240
17631
  };
17241
17632
 
17242
- var ImageWrapper = newStyled.div(templateObject_1$2 || (templateObject_1$2 = __makeTemplateObject(["\n position: relative;\n display: flex;\n max-height: fit-content;\n"], ["\n position: relative;\n display: flex;\n max-height: fit-content;\n"])));
17243
- var VideoOverlay = newStyled.div(templateObject_2$1 || (templateObject_2$1 = __makeTemplateObject(["\n position: absolute;\n width: 100%;\n height: 100%;\n background-color: rgba(247, 160, 139, 0.1);\n display: flex;\n justify-content: center;\n align-items: center;\n flex-direction: column;\n top: 0;\n left: 0;\n border-radius: 25px;\n color: #ffffff;\n gap: 15px;\n cursor: pointer;\n text-align: center;\n @media (max-width: 768px) {\n justify-content: end;\n gap: 10px;\n padding-bottom: 20px;\n text-align: center;\n }\n"], ["\n position: absolute;\n width: 100%;\n height: 100%;\n background-color: rgba(247, 160, 139, 0.1);\n display: flex;\n justify-content: center;\n align-items: center;\n flex-direction: column;\n top: 0;\n left: 0;\n border-radius: 25px;\n color: #ffffff;\n gap: 15px;\n cursor: pointer;\n text-align: center;\n @media (max-width: 768px) {\n justify-content: end;\n gap: 10px;\n padding-bottom: 20px;\n text-align: center;\n }\n"])));
17244
- var FullscreenVideo = newStyled.div(templateObject_3$1 || (templateObject_3$1 = __makeTemplateObject(["\n position: fixed;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n background-color: rgba(0, 0, 0, 0.7);\n z-index: 9999;\n"], ["\n position: fixed;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n background-color: rgba(0, 0, 0, 0.7);\n z-index: 9999;\n"])));
17633
+ var ImageWrapper = newStyled.div(templateObject_1$5 || (templateObject_1$5 = __makeTemplateObject(["\n position: relative;\n display: flex;\n max-height: fit-content;\n"], ["\n position: relative;\n display: flex;\n max-height: fit-content;\n"])));
17634
+ var VideoOverlay = newStyled.div(templateObject_2$4 || (templateObject_2$4 = __makeTemplateObject(["\n position: absolute;\n width: 100%;\n height: 100%;\n background-color: rgba(247, 160, 139, 0.1);\n display: flex;\n justify-content: center;\n align-items: center;\n flex-direction: column;\n top: 0;\n left: 0;\n border-radius: 25px;\n color: #ffffff;\n gap: 15px;\n cursor: pointer;\n text-align: center;\n @media (max-width: 768px) {\n justify-content: end;\n gap: 10px;\n padding-bottom: 20px;\n text-align: center;\n }\n"], ["\n position: absolute;\n width: 100%;\n height: 100%;\n background-color: rgba(247, 160, 139, 0.1);\n display: flex;\n justify-content: center;\n align-items: center;\n flex-direction: column;\n top: 0;\n left: 0;\n border-radius: 25px;\n color: #ffffff;\n gap: 15px;\n cursor: pointer;\n text-align: center;\n @media (max-width: 768px) {\n justify-content: end;\n gap: 10px;\n padding-bottom: 20px;\n text-align: center;\n }\n"])));
17635
+ var FullscreenVideo = newStyled.div(templateObject_3$4 || (templateObject_3$4 = __makeTemplateObject(["\n position: fixed;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n background-color: rgba(0, 0, 0, 0.7);\n z-index: 9999;\n"], ["\n position: fixed;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n background-color: rgba(0, 0, 0, 0.7);\n z-index: 9999;\n"])));
17245
17636
  var ImageVideo = function (_a) {
17246
17637
  var imageLink = _a.imageLink, isVideo = _a.isVideo, isMobile = _a.isMobile;
17247
17638
  var video = useRef(null);
@@ -17261,11 +17652,11 @@ var ImageVideo = function (_a) {
17261
17652
  height: '100%',
17262
17653
  } }, void 0)] }, void 0))] }, void 0));
17263
17654
  };
17264
- var templateObject_1$2, templateObject_2$1, templateObject_3$1;
17655
+ var templateObject_1$5, templateObject_2$4, templateObject_3$4;
17265
17656
 
17266
- var ContainerDesktop = css(templateObject_1$1 || (templateObject_1$1 = __makeTemplateObject(["\n flex: 0 0 50%;\n justify-content: space-around;\n height: 574px;\n"], ["\n flex: 0 0 50%;\n justify-content: space-around;\n height: 574px;\n"])));
17267
- var ContainerMobile = css(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n flex-direction: column;\n align-items: center;\n justify-content: center;\n gap: 16px;\n height: auto;\n @media (max-width: 768px) {\n max-height: fit-content;\n padding: 50px 15px;\n }\n"], ["\n flex-direction: column;\n align-items: center;\n justify-content: center;\n gap: 16px;\n height: auto;\n @media (max-width: 768px) {\n max-height: fit-content;\n padding: 50px 15px;\n }\n"])));
17268
- var Container$1 = newStyled.div(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n padding: 60px 34px 40px 34px;\n display: flex;\n @media (min-width: 769px) {\n ", "\n }\n @media (max-width: 768px) {\n ", "\n }\n"], ["\n padding: 60px 34px 40px 34px;\n display: flex;\n @media (min-width: 769px) {\n ", "\n }\n @media (max-width: 768px) {\n ", "\n }\n"])), ContainerDesktop, ContainerMobile);
17657
+ var ContainerDesktop = css(templateObject_1$4 || (templateObject_1$4 = __makeTemplateObject(["\n flex: 0 0 50%;\n justify-content: space-around;\n height: 574px;\n"], ["\n flex: 0 0 50%;\n justify-content: space-around;\n height: 574px;\n"])));
17658
+ var ContainerMobile = css(templateObject_2$3 || (templateObject_2$3 = __makeTemplateObject(["\n flex-direction: column;\n align-items: center;\n justify-content: center;\n gap: 16px;\n height: auto;\n @media (max-width: 768px) {\n max-height: fit-content;\n padding: 50px 15px;\n }\n"], ["\n flex-direction: column;\n align-items: center;\n justify-content: center;\n gap: 16px;\n height: auto;\n @media (max-width: 768px) {\n max-height: fit-content;\n padding: 50px 15px;\n }\n"])));
17659
+ var Container$4 = newStyled.div(templateObject_3$3 || (templateObject_3$3 = __makeTemplateObject(["\n padding: 60px 34px 40px 34px;\n display: flex;\n @media (min-width: 769px) {\n ", "\n }\n @media (max-width: 768px) {\n ", "\n }\n"], ["\n padding: 60px 34px 40px 34px;\n display: flex;\n @media (min-width: 769px) {\n ", "\n }\n @media (max-width: 768px) {\n ", "\n }\n"])), ContainerDesktop, ContainerMobile);
17269
17660
  var TextContainer = newStyled.div(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n padding: 0 15px;\n gap: 24px;\n text-align: center;\n"], ["\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n padding: 0 15px;\n gap: 24px;\n text-align: center;\n"])));
17270
17661
  var TextWithImage = function (_a) {
17271
17662
  var _b, _c, _d, _e;
@@ -17286,7 +17677,7 @@ var TextWithImage = function (_a) {
17286
17677
  // @ts-ignore
17287
17678
  props.isRedirectionURL ? (window.location.href = props.URLLink) : props.onButtonClick;
17288
17679
  };
17289
- return (jsxs(Container$1, __assign$1({ style: { backgroundColor: backgroundColor } }, { children: [isMobile && jsx(ImageTitle, {}, void 0), (imageLeftSide || isMobile) && (jsx(ImageVideo, { imageLink: (_b = props.imgVideo) === null || _b === void 0 ? void 0 : _b.imageLink, isMobile: isMobile, isVideo: (_c = props.imgVideo) === null || _c === void 0 ? void 0 : _c.isVideo }, void 0)), jsxs(TextContainer, { children: [!isMobile && jsx(ImageTitle, {}, void 0), jsx(Text$6, __assign$1({ variant: "body", weight: "regular", style: textStyle ? textStyle : { maxWidth: '450px' } }, { children: text }), void 0), jsx(BaseCTA, { text: buttomText, size: ComponentSize.Medium, wide: isMobile && buttonWideOnMobile ? true : false, onClick: buttonAction, testId: buttomText, css: {
17680
+ return (jsxs(Container$4, __assign$1({ style: { backgroundColor: backgroundColor } }, { children: [isMobile && jsx(ImageTitle, {}, void 0), (imageLeftSide || isMobile) && (jsx(ImageVideo, { imageLink: (_b = props.imgVideo) === null || _b === void 0 ? void 0 : _b.imageLink, isMobile: isMobile, isVideo: (_c = props.imgVideo) === null || _c === void 0 ? void 0 : _c.isVideo }, void 0)), jsxs(TextContainer, { children: [!isMobile && jsx(ImageTitle, {}, void 0), jsx(Text$6, __assign$1({ variant: "body", weight: "regular", style: textStyle ? textStyle : { maxWidth: '450px' } }, { children: text }), void 0), jsx(BaseCTA, { text: buttomText, size: ComponentSize.Medium, wide: isMobile && buttonWideOnMobile ? true : false, onClick: buttonAction, testId: buttomText, css: {
17290
17681
  backgroundColor: props.btnBGColor,
17291
17682
  color: '#ffffff',
17292
17683
  border: props.btnBGColor,
@@ -17296,9 +17687,9 @@ var TextWithImage = function (_a) {
17296
17687
  },
17297
17688
  } }, void 0), jsx("div", { children: props.contentAfterButton }, void 0)] }, void 0), !imageLeftSide && !isMobile && (jsx(ImageVideo, { imageLink: (_d = props.imgVideo) === null || _d === void 0 ? void 0 : _d.imageLink, isMobile: isMobile, isVideo: (_e = props.imgVideo) === null || _e === void 0 ? void 0 : _e.isVideo }, void 0))] }), void 0));
17298
17689
  };
17299
- var templateObject_1$1, templateObject_2, templateObject_3, templateObject_4;
17690
+ var templateObject_1$4, templateObject_2$3, templateObject_3$3, templateObject_4;
17300
17691
 
17301
- var Container = newStyled.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n display: flex;\n flex-direction: column;\n gap: 16px;\n"], ["\n display: flex;\n flex-direction: column;\n gap: 16px;\n"])));
17692
+ var Container$3 = newStyled.div(templateObject_1$3 || (templateObject_1$3 = __makeTemplateObject(["\n display: flex;\n flex-direction: column;\n gap: 16px;\n"], ["\n display: flex;\n flex-direction: column;\n gap: 16px;\n"])));
17302
17693
  var AccordionOptions = function (_a) {
17303
17694
  var titleColor = _a.titleColor, accordions = _a.accordions;
17304
17695
  var _b = useState({
@@ -17311,7 +17702,7 @@ var AccordionOptions = function (_a) {
17311
17702
  }
17312
17703
  return false;
17313
17704
  };
17314
- return (jsx$1(Container, { children: accordions.map(function (accordion, index) {
17705
+ return (jsx$1(Container$3, { children: accordions.map(function (accordion, index) {
17315
17706
  var forceOpenValue = getForceOpen(index);
17316
17707
  var accordionTitleColor = forceOpenValue && openAccordionIndex.open ? titleColor : undefined;
17317
17708
  return (jsx$1(Accordion$1, __assign$1({ onClick: function () {
@@ -17322,7 +17713,71 @@ var AccordionOptions = function (_a) {
17322
17713
  } }, accordion, { forceOpenHandler: true, forceOpenValue: getForceOpen(index), titleColor: accordionTitleColor }), "accordion-".concat(index)));
17323
17714
  }) }, void 0));
17324
17715
  };
17325
- var templateObject_1;
17716
+ var templateObject_1$3;
17717
+
17718
+ var Container$2 = newStyled.div(templateObject_1$2 || (templateObject_1$2 = __makeTemplateObject(["\n ", "\n display: flex;\n flex-direction: column;\n padding: 0px 0px 5px;\n width: ", ";\n background: ", ";\n color: ", ";\n border: ", ";\n"], ["\n ", "\n display: flex;\n flex-direction: column;\n padding: 0px 0px 5px;\n width: ", ";\n background: ", ";\n color: ", ";\n border: ", ";\n"])), function (_a) {
17719
+ var alignCenter = _a.alignCenter;
17720
+ return alignCenter &&
17721
+ "\n justify-content: center;\n align-items: center;\n text-align: center;\n ";
17722
+ }, function (_a) {
17723
+ var widthAuto = _a.widthAuto;
17724
+ return (widthAuto ? 'auto' : 'fit-content');
17725
+ }, function (props) { return props.backgroundColor; }, function (props) { return props.textColor; }, function (props) {
17726
+ return props.border ? "".concat(props.border.borderWidth, " solid ").concat(props.border.borderColor) : 'none';
17727
+ });
17728
+ var TitleText = newStyled.div(templateObject_2$2 || (templateObject_2$2 = __makeTemplateObject(["\n font-style: normal;\n font-weight: 700;\n line-height: 267%;\n margin: 0px 20px 0px;\n font-size: 30px;\n @media (max-width: 768px) {\n font-size: 24px;\n }\n"], ["\n font-style: normal;\n font-weight: 700;\n line-height: 267%;\n margin: 0px 20px 0px;\n font-size: 30px;\n @media (max-width: 768px) {\n font-size: 24px;\n }\n"])));
17729
+ var BannerText = newStyled.div(templateObject_3$2 || (templateObject_3$2 = __makeTemplateObject(["\n font-style: normal;\n font-weight: 400;\n line-height: 120%;\n font-size: 20px;\n letter-spacing: -0.02em;\n margin: 0px 20px 20px;\n width: 70%;\n @media (max-width: 768px) {\n font-size: 16px;\n width: 80%;\n }\n"], ["\n font-style: normal;\n font-weight: 400;\n line-height: 120%;\n font-size: 20px;\n letter-spacing: -0.02em;\n margin: 0px 20px 20px;\n width: 70%;\n @media (max-width: 768px) {\n font-size: 16px;\n width: 80%;\n }\n"])));
17730
+ var ShortBanner = function (_a) {
17731
+ var textColor = _a.textColor, title = _a.title, bannerText = _a.bannerText, backgroundColor = _a.backgroundColor, _b = _a.alignCenter, alignCenter = _b === void 0 ? false : _b, _c = _a.widthAuto, widthAuto = _c === void 0 ? true : _c;
17732
+ var theme = useTheme();
17733
+ return (jsxs$1(Container$2, __assign$1({ backgroundColor: backgroundColor, alignCenter: alignCenter, widthAuto: widthAuto, "data-testid": "BannerContainer", theme: theme, textColor: textColor }, { children: [jsx$1(TitleText, { children: title }, void 0), jsx$1(BannerText, { children: bannerText }, void 0)] }), void 0));
17734
+ };
17735
+ var templateObject_1$2, templateObject_2$2, templateObject_3$2;
17736
+
17737
+ /* base styles & size variants */
17738
+ var UserInfoTextStyles = {
17739
+ baseStyles: function (theme, isMobile, alignCenter) {
17740
+ return css({
17741
+ margin: '0',
17742
+ color: theme.colors.pallete.secondary.color,
17743
+ fontWeight: '600',
17744
+ fontSize: isMobile ? '16px' : '24px',
17745
+ lineHeight: '130%',
17746
+ textAlign: alignCenter ? 'center' : 'left',
17747
+ });
17748
+ },
17749
+ };
17750
+
17751
+ var Container$1 = newStyled.div(templateObject_1$1 || (templateObject_1$1 = __makeTemplateObject(["\n display: flex;\n flex-direction: column;\n row-gap: ", ";\n background: var(--colors-shades-white-color);\n border: 1px solid var(--colors-shades-50-color);\n box-sizing: border-box;\n filter: drop-shadow(2px 2px 4px rgba(0, 0, 0, 0.25));\n border-radius: 10px;\n max-width: ", ";\n width: 100%;\n height: 100%;\n padding: ", ";\n flex-wrap: wrap;\n"], ["\n display: flex;\n flex-direction: column;\n row-gap: ", ";\n background: var(--colors-shades-white-color);\n border: 1px solid var(--colors-shades-50-color);\n box-sizing: border-box;\n filter: drop-shadow(2px 2px 4px rgba(0, 0, 0, 0.25));\n border-radius: 10px;\n max-width: ", ";\n width: 100%;\n height: 100%;\n padding: ", ";\n flex-wrap: wrap;\n"])), function (props) { return (props.isMobile ? '12px' : '15px'); }, function (props) { return (props.isMobile ? '241px' : '378px'); }, function (props) { return (props.isMobile ? '20px 20px 18px;' : '35px 35px 25px;'); });
17752
+ var ImageContainer$1 = newStyled.div(templateObject_2$1 || (templateObject_2$1 = __makeTemplateObject(["\n display: flex;\n flex-direction: row;\n max-height: ", ";\n max-width: ", ";\n width: 100%;\n height: 100%;\n column-gap: 4px;\n"], ["\n display: flex;\n flex-direction: row;\n max-height: ", ";\n max-width: ", ";\n width: 100%;\n height: 100%;\n column-gap: 4px;\n"])), function (props) { return (props.isMobile ? '120px' : '180px'); }, function (props) { return (props.isMobile ? '200px' : '320px'); });
17753
+ var ImageCard = newStyled.div(templateObject_3$1 || (templateObject_3$1 = __makeTemplateObject(["\n display: flex;\n min-height: ", ";\n width: ", ";\n flex-wrap: wrap;\n"], ["\n display: flex;\n min-height: ", ";\n width: ", ";\n flex-wrap: wrap;\n"])), function (props) { return (props.isMobile ? '120px' : '180px'); }, function (props) { return (props.isMobile ? '100px' : '160px'); });
17754
+ var UserInfoText = newStyled.div(function (_a) {
17755
+ var theme = _a.theme, isMobile = _a.isMobile, alignCenter = _a.alignCenter;
17756
+ return [
17757
+ UserInfoTextStyles.baseStyles(theme, isMobile, alignCenter),
17758
+ ];
17759
+ });
17760
+ var BeforeAfterCard = function (_a) {
17761
+ var name = _a.name, age = _a.age, months = _a.months, beforeImage = _a.beforeImage, afterImage = _a.afterImage, _b = _a.alignCenter, alignCenter = _b === void 0 ? true : _b;
17762
+ var theme = useTheme();
17763
+ var isMobile = useWindowDimensions({ desktop: 768, mobile: 0 }).isMobile;
17764
+ return (jsxs$1(Container$1, __assign$1({ "data-testid": "Container", isMobile: isMobile }, { children: [jsxs$1(ImageContainer$1, __assign$1({ "data-testid": "ImageContainer", isMobile: isMobile }, { children: [jsx$1(ImageCard, __assign$1({ "data-testid": "ImageCard", isMobile: isMobile }, { children: jsx$1(Image, { borderRadius: "20px", src: beforeImage, alt: "before", height: "100%", width: "100%" }, void 0) }), void 0), jsx$1(ImageCard, __assign$1({ isMobile: isMobile }, { children: jsx$1(Image, { borderRadius: "20px", src: afterImage, alt: "after", height: "100%", width: "100%" }, void 0) }), void 0)] }), void 0), jsx$1(UserInfoText, __assign$1({ "data-testid": "UserInfoText", theme: theme, isMobile: isMobile, alignCenter: alignCenter }, { children: "".concat(name, ", ").concat(age, " | ").concat(months, " months") }), void 0)] }), void 0));
17765
+ };
17766
+ var templateObject_1$1, templateObject_2$1, templateObject_3$1;
17767
+
17768
+ var Container = newStyled.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n display: flex;\n flex-direction: column;\n box-sizing: border-box;\n border-radius: 10px;\n max-width: ", ";\n width: 100%;\n height: 100%;\n flex-wrap: wrap;\n row-gap: 15px;\n"], ["\n display: flex;\n flex-direction: column;\n box-sizing: border-box;\n border-radius: 10px;\n max-width: ", ";\n width: 100%;\n height: 100%;\n flex-wrap: wrap;\n row-gap: 15px;\n"])), function (props) { return (props.isMobile ? '200px' : '207px'); });
17769
+ var ImageContainer = newStyled.div(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n display: flex;\n max-width: ", ";\n height: ", ";\n"], ["\n display: flex;\n max-width: ", ";\n height: ", ";\n"])), function (props) { return (props.isMobile ? '200px' : '207px'); }, function (props) { return (props.isMobile ? '200px' : '207px'); });
17770
+ var StyledTitle = newStyled.div(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n display: flex;\n ", "\n"], ["\n display: flex;\n ", "\n"])), function (_a) {
17771
+ var titlePosition = _a.titlePosition;
17772
+ return titlePosition == 'center' &&
17773
+ "\nalign-items:center;\njustify-content:center;\n";
17774
+ });
17775
+ var ImageCardWithDescription = function (_a) {
17776
+ var image = _a.image, title = _a.title, description = _a.description, _b = _a.titlePosition, titlePosition = _b === void 0 ? 'left' : _b;
17777
+ var isMobile = useWindowDimensions({ desktop: 768, mobile: 0 }).isMobile;
17778
+ return (jsxs$1(Container, __assign$1({ "data-testid": "Container", isMobile: isMobile }, { children: [jsx$1(ImageContainer, __assign$1({ "data-testid": "ImageContainer", isMobile: isMobile }, { children: jsx$1(Image, { src: image, borderRadius: "40px", alt: "before", height: "100%", width: "100%" }, void 0) }), void 0), jsx$1(StyledTitle, __assign$1({ titlePosition: titlePosition, "data-testid": "StyledTitle" }, { children: isMobile ? (jsx$1(Text$6, __assign$1({ variant: "link", weight: "demi" }, { children: title }), void 0)) : (jsx$1(Text$6, __assign$1({ variant: "heading6", weight: "demi" }, { children: title }), void 0)) }), void 0), jsx$1(Text$6, __assign$1({ variant: "link", weight: "regular" }, { children: description }), void 0)] }), void 0));
17779
+ };
17780
+ var templateObject_1, templateObject_2, templateObject_3;
17326
17781
 
17327
- export { Accordion$1 as Accordion, AccordionOptions, 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, Filters, FitPredictor, Icon, IconButton, IconsWithTitle, Image, Input$1 as Input, InputValidationType, Modal, MultiColorPicker, Note, OfferBanner, OrderBar, Overlay, PackSelector, Pagination, PaginatorBlog, PaymentMethod, PaypalButton, Portal, PriceLabel, PriceLabelV2, ProductGallery, ProductGalleryMobile, ProgressBar, QuantityPicker, RadioGroupInput, RadioInput, Rating, Review, ScrollToTop, SearchBar, SearchNavigation, SeasonOfferTag, SimpleDropdown, SimpleOrderItem, SingleColorPicker, SizeFitGuide, SizeSelector, SizeTable, SliderNavigation, Spacing, Spinner, StarList, Tab, Tabs, Text$6 as Text, TextButton, TextWithImage, ThemeProvider, ThemeVariables, Timer, Tooltip, Totals, decimalFormat, formatPrice, isEmail, isEmpty, isNumber$1 as isNumber, isPhoneNumber, isValidDate, modalEvent, simulateMouseClick, sliceString, useModal, useModalEvent, useOnClickOutside, useTheme, useThemeAssets, useWindowDimensions };
17782
+ export { Accordion$1 as Accordion, AccordionOptions, AmazonButton, AssetsProvider, BeforeAfterCard, 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, Filters, FitPredictor, Icon, IconButton, IconsWithTitle, Image, ImageCardWithDescription, Input$1 as Input, InputValidationType, Modal, MultiColorPicker, Note, OfferBanner, OrderBar, Overlay, PackSelector, Pagination, PaginatorBlog, PaymentMethod, PaypalButton, Portal, PriceLabel, PriceLabelV2, ProductGallery, ProductGalleryMobile, ProgressBar, QuantityPicker, RadioGroupInput, RadioInput, Rating, Review, ScrollToTop, SearchBar, SearchNavigation, SeasonOfferTag, ShortBanner, SimpleDropdown, SimpleOrderItem, SingleColorPicker, SizeFitGuide, SizeSelector, SizeTable, SliderNavigation, Spacing, Spinner, StarList, Tab, Tabs, Text$6 as Text, TextButton, TextWithImage, ThemeProvider, ThemeVariables, Timer, Tooltip, Totals, decimalFormat, formatPrice, isEmail, isEmpty, isNumber$1 as isNumber, isPhoneNumber, isValidDate, modalEvent, simulateMouseClick, sliceString, newStyled as styled, useModal, useModalEvent, useOnClickOutside, useTheme, useThemeAssets, useWindowDimensions };
17328
17783
  //# sourceMappingURL=index.esm.js.map