@trafilea/afrodita-components 5.0.0-beta.5 → 5.0.0-beta.52
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/build/index.css +3 -1
- package/build/index.d.ts +230 -43
- package/build/index.esm.css +3 -1
- package/build/index.esm.js +5298 -3355
- package/build/index.esm.js.map +1 -1
- package/build/index.js +5303 -3355
- package/build/index.js.map +1 -1
- package/build/theme/shapermint.theme.d.ts +10 -2
- package/build/theme/shapermint.theme.js +10 -2
- package/build/theme/truekind.theme.d.ts +10 -2
- package/build/theme/truekind.theme.js +10 -2
- package/package.json +4 -1
package/build/index.css
CHANGED
|
@@ -1,2 +1,4 @@
|
|
|
1
1
|
.slick-slider{position:relative;display:block;box-sizing:border-box;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;-webkit-touch-callout:none;-khtml-user-select:none;-ms-touch-action:pan-y;touch-action:pan-y;-webkit-tap-highlight-color:transparent;}.slick-list{position:relative;display:block;overflow:hidden;margin:0;padding:0;}.slick-list:focus{outline:none;}.slick-list.dragging{cursor:pointer;cursor:hand;}.slick-slider .slick-track,.slick-slider .slick-list{-webkit-transform:translate3d(0,0,0);-moz-transform:translate3d(0,0,0);-ms-transform:translate3d(0,0,0);-o-transform:translate3d(0,0,0);transform:translate3d(0,0,0);}.slick-track{position:relative;top:0;left:0;display:block;margin-left:auto;margin-right:auto;}.slick-track:before,.slick-track:after{display:table;content:'';}.slick-track:after{clear:both;}.slick-loading .slick-track{visibility:hidden;}.slick-slide{display:none;float:left;height:100%;min-height:0.063rem;}[dir='rtl'] .slick-slide{float:right;}.slick-slide img{display:block;}.slick-slide.slick-loading img{display:none;}.slick-slide.dragging img{pointer-events:none;}.slick-initialized .slick-slide{display:block;}.slick-loading .slick-slide{visibility:hidden;}.slick-vertical .slick-slide{display:block;height:auto;border:0.063rem solid transparent;}.slick-arrow.slick-hidden{display:none;}
|
|
2
|
-
.slick-prev,.slick-next{font-size:0;line-height:0;position:absolute;top:50%;display:block;width:1.25rem;height:1.25rem;padding:0;-webkit-transform:translate(0,-50%);-ms-transform:translate(0,-50%);transform:translate(0,-50%);cursor:pointer;color:transparent;border:none;outline:none;background:transparent;}.slick-prev:hover,.slick-prev:focus,.slick-next:hover,.slick-next:focus{color:transparent;outline:none;background:transparent;}.slick-prev:hover:before,.slick-prev:focus:before,.slick-next:hover:before,.slick-next:focus:before{opacity:1;}.slick-prev.slick-disabled:before,.slick-next.slick-disabled:before{opacity:0.25;}.slick-prev:before,.slick-next:before{font-family:'slick';font-size:1.25rem;line-height:1;opacity:0.75;color:white;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;}.slick-prev{left:-1.5rem;}[dir='rtl'] .slick-prev{right:-1.5rem;left:auto;}.slick-prev:before{content:'←';}[dir='rtl'] .slick-prev:before{content:'→';}.slick-next{right:-1.5rem;}[dir='rtl'] .slick-next{right:auto;left:-1.5rem;}.slick-next:before{content:'→';}[dir='rtl'] .slick-next:before{content:'←';}.slick-dotted.slick-slider{margin-bottom:1.875rem;}.slick-dots{position:absolute;bottom:-1.5rem;display:block;width:100%;padding:0;margin:0;list-style:none;text-align:center;}.slick-dots li{position:relative;display:inline-block;width:1.25rem;height:1.25rem;margin:0 0.313rem;padding:0;cursor:pointer;}.slick-dots li button{font-size:0;line-height:0;display:block;width:1.25rem;height:1.25rem;padding:0.313rem;cursor:pointer;color:transparent;border:0;outline:none;background:transparent;}.slick-dots li button:hover,.slick-dots li button:focus{outline:none;}.slick-dots li button:hover:before,.slick-dots li button:focus:before{opacity:1;}.slick-dots li button:before{font-family:'slick';font-size:0.375rem;line-height:1.25rem;position:absolute;top:0;left:0;width:1.25rem;height:1.25rem;content:'•';text-align:center;opacity:0.25;color:black;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;}.slick-dots li.slick-active button:before{opacity:0.75;color:black;}
|
|
2
|
+
.slick-prev,.slick-next{font-size:0;line-height:0;position:absolute;top:50%;display:block;width:1.25rem;height:1.25rem;padding:0;-webkit-transform:translate(0,-50%);-ms-transform:translate(0,-50%);transform:translate(0,-50%);cursor:pointer;color:transparent;border:none;outline:none;background:transparent;}.slick-prev:hover,.slick-prev:focus,.slick-next:hover,.slick-next:focus{color:transparent;outline:none;background:transparent;}.slick-prev:hover:before,.slick-prev:focus:before,.slick-next:hover:before,.slick-next:focus:before{opacity:1;}.slick-prev.slick-disabled:before,.slick-next.slick-disabled:before{opacity:0.25;}.slick-prev:before,.slick-next:before{font-family:'slick';font-size:1.25rem;line-height:1;opacity:0.75;color:white;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;}.slick-prev{left:-1.5rem;}[dir='rtl'] .slick-prev{right:-1.5rem;left:auto;}.slick-prev:before{content:'←';}[dir='rtl'] .slick-prev:before{content:'→';}.slick-next{right:-1.5rem;}[dir='rtl'] .slick-next{right:auto;left:-1.5rem;}.slick-next:before{content:'→';}[dir='rtl'] .slick-next:before{content:'←';}.slick-dotted.slick-slider{margin-bottom:1.875rem;}.slick-dots{position:absolute;bottom:-1.5rem;display:block;width:100%;padding:0;margin:0;list-style:none;text-align:center;}.slick-dots li{position:relative;display:inline-block;width:1.25rem;height:1.25rem;margin:0 0.313rem;padding:0;cursor:pointer;}.slick-dots li button{font-size:0;line-height:0;display:block;width:1.25rem;height:1.25rem;padding:0.313rem;cursor:pointer;color:transparent;border:0;outline:none;background:transparent;}.slick-dots li button:hover,.slick-dots li button:focus{outline:none;}.slick-dots li button:hover:before,.slick-dots li button:focus:before{opacity:1;}.slick-dots li button:before{font-family:'slick';font-size:0.375rem;line-height:1.25rem;position:absolute;top:0;left:0;width:1.25rem;height:1.25rem;content:'•';text-align:center;opacity:0.25;color:black;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;}.slick-dots li.slick-active button:before{opacity:0.75;color:black;}
|
|
3
|
+
.iiz{max-width:100%;margin:0;position:relative;overflow:hidden;display:inline-block;cursor:-webkit-zoom-in;cursor:zoom-in}.iiz--drag .iiz__zoom-img--visible{cursor:-webkit-grab;cursor:grab}.iiz__img{max-width:100%;height:auto;display:block;pointer-events:none;visibility:visible;opacity:1}.iiz__img--hidden{visibility:hidden;opacity:0}.iiz__img--abs{width:100%;height:100%;position:absolute;top:0;left:0;display:block}.iiz__zoom-img{width:auto!important;max-width:none!important;position:absolute;visibility:hidden;opacity:0;pointer-events:none;display:block}.iiz__zoom-img--visible{visibility:visible;opacity:1;pointer-events:auto;cursor:-webkit-zoom-out;cursor:zoom-out;-ms-touch-action:none;touch-action:none}.iiz__zoom-portal{position:fixed;top:0;right:0;bottom:0;left:0;z-index:10000}.iiz__btn{background:rgba(255,255,255,.8);width:40px;height:40px;border:none;outline:0;padding:0;position:absolute;text-decoration:none;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-moz-appearance:none;-webkit-appearance:none;appearance:none}.iiz__btn:before{content:" ";background-position:center;background-repeat:no-repeat;display:block}.iiz__hint{bottom:10px;right:10px;pointer-events:none}.iiz__hint:before{content:" ";background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 19.9 19.9'%3E%3Cpath d='M13.9 7.4C13.9 3.8 11 .9 7.4.9S.9 3.8.9 7.4s2.9 6.5 6.5 6.5 6.5-2.9 6.5-6.5zm5.3 12.5l-6.7-7.2c-1.4 1.3-3.2 2.1-5.1 2.1-4.1 0-7.4-3.3-7.4-7.4S3.3 0 7.4 0s7.4 3.3 7.4 7.4c0 1.7-.6 3.4-1.7 4.7l6.8 7.2-.7.6z' fill='%23000222'/%3E%3C/svg%3E");width:20px;height:20px}.iiz__close{top:10px;right:10px;visibility:hidden;opacity:0}.iiz__close--visible{visibility:visible;opacity:1;cursor:pointer}.iiz__close::before{content:" ";width:29px;height:29px;background-image:-webkit-gradient(linear,left top,left bottom,from(#222),to(#222)),-webkit-gradient(linear,left top,left bottom,from(#222),to(#222));background-image:linear-gradient(#222,#222),linear-gradient(#222,#222);background-size:100% 1px,1px 100%;-webkit-transform:rotate(45deg);transform:rotate(45deg)}
|
|
4
|
+
.iiz{max-width:100%;margin:0;position:relative;overflow:hidden;display:inline-block;cursor:-webkit-zoom-in;cursor:zoom-in;}.zoomWrapper.iiz{max-height:510px;}.iiz--drag .iiz__zoom-img--visible{cursor:-webkit-grab;cursor:grab;}.iiz__img{max-width:100%;height:auto;display:block;pointer-events:none;visibility:visible;opacity:1;}.iiz__img--hidden{visibility:hidden;opacity:0;}.iiz__img--abs{width:100%;height:100%;position:absolute;top:0;left:0;display:block;}.iiz__zoom-img{width:auto!important;max-width:none!important;position:absolute;visibility:hidden;opacity:0;pointer-events:none;display:block;}.iiz__zoom-img--visible{visibility:visible;opacity:1;pointer-events:auto;cursor:-webkit-zoom-out;cursor:zoom-out;-ms-touch-action:none;touch-action:none;zoom:1.2;}.iiz__zoom-portal{position:fixed;top:0;right:0;bottom:0;left:0;z-index:5;}.iiz__btn{background:rgba(255,255,255,0.8);max-width:95px;min-width:fit-content;height:32px;border:none;outline:none;padding:0 8px;position:absolute;z-index:5;text-decoration:none;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-moz-appearance:none;-webkit-appearance:none;appearance:none;}.iiz__btn:before{content:' ';background-position:center;background-repeat:no-repeat;display:block;}.iiz__hint{bottom:10%;right:0;pointer-events:none;border-radius:150px 0 0 150px;}.iiz__hint:before{content:'+';background-image:none;width:17px;height:17px;font-size:19px;border-radius:500px;border:2px solid #292929;display:inline-block;position:relative;text-align:center;line-height:17px;font-weight:600;}.iiz__hint:after{content:'Zoom in';font-size:14px;font-weight:600;display:inline-block;margin-left:5px;}.iiz__close{border-radius:150px;top:auto;right:0;left:0;margin:auto;bottom:20px;visibility:hidden;opacity:0;color:#292929;}.iiz__close--visible{visibility:visible;opacity:1;cursor:pointer;}.iiz__close::before{content:' ';width:16px;height:16px;background-image:-webkit-gradient(linear,left top,left bottom,from(#222),to(#222)),-webkit-gradient(linear,left top,left bottom,from(#222),to(#222));background-image:linear-gradient(#222,#222),linear-gradient(#222,#222);background-size:65% 2px,2px 65%;transform:rotate(45deg);border-radius:500px;border:2px solid #292929;}.iiz__close::after{content:'Close';font-size:14px;font-weight:600;display:inline-block;margin-left:5px;}
|
package/build/index.d.ts
CHANGED
|
@@ -2,8 +2,9 @@
|
|
|
2
2
|
import { IconProps as IconProps$1 } from 'src/types/types';
|
|
3
3
|
import React, { FC, ReactNode, ElementType, CSSProperties, AriaAttributes, AnchorHTMLAttributes, LabelHTMLAttributes, RefObject } from 'react';
|
|
4
4
|
import * as _emotion_react_jsx_runtime from '@emotion/react/jsx-runtime';
|
|
5
|
-
import * as _emotion_react_types_jsx_namespace from '@emotion/react/types/jsx-namespace';
|
|
6
5
|
import * as _emotion_styled from '@emotion/styled';
|
|
6
|
+
import { StyledComponent } from '@emotion/styled';
|
|
7
|
+
import * as _emotion_react_types_jsx_namespace from '@emotion/react/types/jsx-namespace';
|
|
7
8
|
import * as _emotion_react from '@emotion/react';
|
|
8
9
|
|
|
9
10
|
declare enum CardSectionType {
|
|
@@ -33,6 +34,7 @@ interface IconProps {
|
|
|
33
34
|
height?: number;
|
|
34
35
|
fill?: string;
|
|
35
36
|
title?: string;
|
|
37
|
+
testId?: string;
|
|
36
38
|
}
|
|
37
39
|
declare type ButtonType = 'button' | 'submit' | 'reset';
|
|
38
40
|
interface CTAProps {
|
|
@@ -57,11 +59,6 @@ declare type SizeOption = {
|
|
|
57
59
|
description: string;
|
|
58
60
|
disabled?: boolean;
|
|
59
61
|
};
|
|
60
|
-
declare type Color = {
|
|
61
|
-
primaryColor: string;
|
|
62
|
-
secondaryColor?: string;
|
|
63
|
-
tertiaryColor?: string;
|
|
64
|
-
};
|
|
65
62
|
declare type Pattern = {
|
|
66
63
|
url: string;
|
|
67
64
|
};
|
|
@@ -69,7 +66,7 @@ declare type ColorPickerOption = {
|
|
|
69
66
|
label: string;
|
|
70
67
|
description: string;
|
|
71
68
|
meta: {
|
|
72
|
-
color?:
|
|
69
|
+
color?: string[];
|
|
73
70
|
pattern?: Pattern;
|
|
74
71
|
};
|
|
75
72
|
};
|
|
@@ -100,7 +97,11 @@ declare type Filter = {
|
|
|
100
97
|
title: string;
|
|
101
98
|
columns: number;
|
|
102
99
|
isOpenByDefault?: boolean;
|
|
103
|
-
|
|
100
|
+
isMultiselect: boolean;
|
|
101
|
+
items: Array<{
|
|
102
|
+
label: string;
|
|
103
|
+
checked?: boolean;
|
|
104
|
+
}>;
|
|
104
105
|
};
|
|
105
106
|
declare type FilterChange = {
|
|
106
107
|
sectionIndex: number;
|
|
@@ -111,6 +112,7 @@ interface SearchBarOptionItem {
|
|
|
111
112
|
src: string;
|
|
112
113
|
price: string;
|
|
113
114
|
title: string;
|
|
115
|
+
optionUrl: string;
|
|
114
116
|
}
|
|
115
117
|
|
|
116
118
|
declare const SixtyDaysGuarantee: ({ height, width, fill, title }: IconProps) => JSX.Element;
|
|
@@ -143,6 +145,12 @@ declare const Close: ({ height, width, fill }: IconProps) => JSX.Element;
|
|
|
143
145
|
|
|
144
146
|
declare const Trash: ({ height, width, fill }: IconProps) => JSX.Element;
|
|
145
147
|
|
|
148
|
+
declare const Warning: ({ height, width, fill }: IconProps) => JSX.Element;
|
|
149
|
+
|
|
150
|
+
declare const Edit: ({ height, width, fill }: IconProps) => JSX.Element;
|
|
151
|
+
|
|
152
|
+
declare const SignOut: ({ height, width, fill }: IconProps) => JSX.Element;
|
|
153
|
+
|
|
146
154
|
declare const Actions_Check: typeof Check;
|
|
147
155
|
declare const Actions_ClearLight: typeof ClearLight;
|
|
148
156
|
declare const Actions_LightExclamation: typeof LightExclamation;
|
|
@@ -151,6 +159,9 @@ declare const Actions_LightCheck: typeof LightCheck;
|
|
|
151
159
|
declare const Actions_Question: typeof Question;
|
|
152
160
|
declare const Actions_Close: typeof Close;
|
|
153
161
|
declare const Actions_Trash: typeof Trash;
|
|
162
|
+
declare const Actions_Warning: typeof Warning;
|
|
163
|
+
declare const Actions_Edit: typeof Edit;
|
|
164
|
+
declare const Actions_SignOut: typeof SignOut;
|
|
154
165
|
declare namespace Actions {
|
|
155
166
|
export {
|
|
156
167
|
Actions_Check as Check,
|
|
@@ -161,6 +172,9 @@ declare namespace Actions {
|
|
|
161
172
|
Actions_Question as Question,
|
|
162
173
|
Actions_Close as Close,
|
|
163
174
|
Actions_Trash as Trash,
|
|
175
|
+
Actions_Warning as Warning,
|
|
176
|
+
Actions_Edit as Edit,
|
|
177
|
+
Actions_SignOut as SignOut,
|
|
164
178
|
};
|
|
165
179
|
}
|
|
166
180
|
|
|
@@ -175,10 +189,25 @@ declare const Shapermint: ({ height, width }: IconProps) => JSX.Element;
|
|
|
175
189
|
|
|
176
190
|
declare const McAfee: ({ height, width }: IconProps) => JSX.Element;
|
|
177
191
|
|
|
192
|
+
declare const GetDiscount: ({ height, width }: IconProps) => JSX.Element;
|
|
193
|
+
|
|
194
|
+
declare const ShapermintLogo: ({ height, width, fill }: IconProps) => JSX.Element;
|
|
195
|
+
|
|
196
|
+
declare const Chat: ({ height, width, fill, testId }: IconProps) => JSX.Element;
|
|
197
|
+
|
|
198
|
+
declare const Email: ({ height, width, fill, testId }: IconProps) => JSX.Element;
|
|
199
|
+
|
|
200
|
+
declare const CallUs: ({ height, width, fill, testId }: IconProps) => JSX.Element;
|
|
201
|
+
|
|
178
202
|
type Other_LoadingProps = LoadingProps;
|
|
179
203
|
declare const Other_Loading: typeof Loading;
|
|
180
204
|
declare const Other_Shapermint: typeof Shapermint;
|
|
181
205
|
declare const Other_McAfee: typeof McAfee;
|
|
206
|
+
declare const Other_GetDiscount: typeof GetDiscount;
|
|
207
|
+
declare const Other_ShapermintLogo: typeof ShapermintLogo;
|
|
208
|
+
declare const Other_Chat: typeof Chat;
|
|
209
|
+
declare const Other_Email: typeof Email;
|
|
210
|
+
declare const Other_CallUs: typeof CallUs;
|
|
182
211
|
declare namespace Other {
|
|
183
212
|
export {
|
|
184
213
|
FitPredictor$1 as FitPredictor,
|
|
@@ -186,14 +215,19 @@ declare namespace Other {
|
|
|
186
215
|
Other_Loading as Loading,
|
|
187
216
|
Other_Shapermint as Shapermint,
|
|
188
217
|
Other_McAfee as McAfee,
|
|
218
|
+
Other_GetDiscount as GetDiscount,
|
|
219
|
+
Other_ShapermintLogo as ShapermintLogo,
|
|
220
|
+
Other_Chat as Chat,
|
|
221
|
+
Other_Email as Email,
|
|
222
|
+
Other_CallUs as CallUs,
|
|
189
223
|
};
|
|
190
224
|
}
|
|
191
225
|
|
|
192
226
|
declare const ChevronDown: ({ height, width, fill }: IconProps) => JSX.Element;
|
|
193
227
|
|
|
194
|
-
declare const ChevronLeft: ({ height, width, fill, opacity }: IconWithOpacityProps) => JSX.Element;
|
|
228
|
+
declare const ChevronLeft: ({ height, width, fill, opacity, testId }: IconWithOpacityProps) => JSX.Element;
|
|
195
229
|
|
|
196
|
-
declare const ChevronRight: ({ height, width, fill, opacity }: IconWithOpacityProps) => JSX.Element;
|
|
230
|
+
declare const ChevronRight: ({ height, width, fill, opacity, testId }: IconWithOpacityProps) => JSX.Element;
|
|
197
231
|
|
|
198
232
|
declare const ChevronRightVariant: ({ height, width, fill }: IconProps) => JSX.Element;
|
|
199
233
|
|
|
@@ -242,6 +276,10 @@ declare const Stopwatch: ({ height, width, fill, title }: IconProps) => JSX.Elem
|
|
|
242
276
|
|
|
243
277
|
declare const Shipping: ({ height, width, fill }: IconProps) => JSX.Element;
|
|
244
278
|
|
|
279
|
+
declare const LightBulb: ({ height, width, fill }: IconProps) => JSX.Element;
|
|
280
|
+
|
|
281
|
+
declare const ErrorCross: ({ height, width, fill }: IconProps) => JSX.Element;
|
|
282
|
+
|
|
245
283
|
declare const PDP_Clock: typeof Clock;
|
|
246
284
|
declare const PDP_FlagUSA: typeof FlagUSA;
|
|
247
285
|
declare const PDP_Minus: typeof Minus;
|
|
@@ -252,6 +290,8 @@ declare const PDP_StarEmpty: typeof StarEmpty;
|
|
|
252
290
|
declare const PDP_StarHalf: typeof StarHalf;
|
|
253
291
|
declare const PDP_Stopwatch: typeof Stopwatch;
|
|
254
292
|
declare const PDP_Shipping: typeof Shipping;
|
|
293
|
+
declare const PDP_LightBulb: typeof LightBulb;
|
|
294
|
+
declare const PDP_ErrorCross: typeof ErrorCross;
|
|
255
295
|
declare namespace PDP {
|
|
256
296
|
export {
|
|
257
297
|
PDP_Clock as Clock,
|
|
@@ -264,6 +304,8 @@ declare namespace PDP {
|
|
|
264
304
|
PDP_StarHalf as StarHalf,
|
|
265
305
|
PDP_Stopwatch as Stopwatch,
|
|
266
306
|
PDP_Shipping as Shipping,
|
|
307
|
+
PDP_LightBulb as LightBulb,
|
|
308
|
+
PDP_ErrorCross as ErrorCross,
|
|
267
309
|
};
|
|
268
310
|
}
|
|
269
311
|
|
|
@@ -300,11 +342,11 @@ declare namespace SocialMedia {
|
|
|
300
342
|
};
|
|
301
343
|
}
|
|
302
344
|
|
|
303
|
-
declare const Search: ({ height, width, fill }: IconProps) => JSX.Element;
|
|
345
|
+
declare const Search: ({ height, width, fill, testId }: IconProps) => JSX.Element;
|
|
304
346
|
|
|
305
347
|
declare const User: ({ height, width, fill }: IconProps) => JSX.Element;
|
|
306
348
|
|
|
307
|
-
declare const ShoppingBag: ({ height, width, fill }: IconProps) => JSX.Element;
|
|
349
|
+
declare const ShoppingBag: ({ height, width, fill, testId }: IconProps) => JSX.Element;
|
|
308
350
|
|
|
309
351
|
declare const ShoppingCart: FC<IconProps>;
|
|
310
352
|
|
|
@@ -312,12 +354,21 @@ declare const MapMarker: ({ height, width, fill }: IconProps) => JSX.Element;
|
|
|
312
354
|
|
|
313
355
|
declare const Hamburger: FC<IconProps>;
|
|
314
356
|
|
|
357
|
+
declare const AddressInformation: ({ height, width, fill }: IconProps) => JSX.Element;
|
|
358
|
+
|
|
359
|
+
declare const ClubMembership: ({ height, width, fill }: IconProps) => JSX.Element;
|
|
360
|
+
|
|
361
|
+
declare const Benefits: ({ height, width, fill }: IconProps) => JSX.Element;
|
|
362
|
+
|
|
315
363
|
declare const Navigation_Search: typeof Search;
|
|
316
364
|
declare const Navigation_User: typeof User;
|
|
317
365
|
declare const Navigation_ShoppingBag: typeof ShoppingBag;
|
|
318
366
|
declare const Navigation_ShoppingCart: typeof ShoppingCart;
|
|
319
367
|
declare const Navigation_MapMarker: typeof MapMarker;
|
|
320
368
|
declare const Navigation_Hamburger: typeof Hamburger;
|
|
369
|
+
declare const Navigation_AddressInformation: typeof AddressInformation;
|
|
370
|
+
declare const Navigation_ClubMembership: typeof ClubMembership;
|
|
371
|
+
declare const Navigation_Benefits: typeof Benefits;
|
|
321
372
|
declare namespace Navigation {
|
|
322
373
|
export {
|
|
323
374
|
Navigation_Search as Search,
|
|
@@ -326,6 +377,9 @@ declare namespace Navigation {
|
|
|
326
377
|
Navigation_ShoppingCart as ShoppingCart,
|
|
327
378
|
Navigation_MapMarker as MapMarker,
|
|
328
379
|
Navigation_Hamburger as Hamburger,
|
|
380
|
+
Navigation_AddressInformation as AddressInformation,
|
|
381
|
+
Navigation_ClubMembership as ClubMembership,
|
|
382
|
+
Navigation_Benefits as Benefits,
|
|
329
383
|
};
|
|
330
384
|
}
|
|
331
385
|
|
|
@@ -342,11 +396,11 @@ interface IconWrapperProps {
|
|
|
342
396
|
viewBoxX: number;
|
|
343
397
|
viewBoxY: number;
|
|
344
398
|
children: React.ReactNode;
|
|
345
|
-
|
|
399
|
+
testId?: string;
|
|
346
400
|
fill?: string;
|
|
347
401
|
}
|
|
348
402
|
|
|
349
|
-
declare const Mail: ({ height, width }: IconWrapperProps) => JSX.Element;
|
|
403
|
+
declare const Mail: ({ height, width, }: Pick<IconWrapperProps, 'width' | 'height'>) => JSX.Element;
|
|
350
404
|
|
|
351
405
|
declare const Messaging_QuestionCircle: typeof QuestionCircle;
|
|
352
406
|
declare const Messaging_Messenger: typeof Messenger;
|
|
@@ -416,7 +470,49 @@ declare namespace SlideDots {
|
|
|
416
470
|
};
|
|
417
471
|
}
|
|
418
472
|
|
|
419
|
-
declare
|
|
473
|
+
declare const Thinking: ({ height, width }: IconProps$1) => JSX.Element;
|
|
474
|
+
|
|
475
|
+
declare const Emoji_Thinking: typeof Thinking;
|
|
476
|
+
declare namespace Emoji {
|
|
477
|
+
export {
|
|
478
|
+
Emoji_Thinking as Thinking,
|
|
479
|
+
};
|
|
480
|
+
}
|
|
481
|
+
|
|
482
|
+
declare const FreeShipping: ({ height, width, fill }: IconProps) => JSX.Element;
|
|
483
|
+
|
|
484
|
+
declare const PersonalStylist: ({ height, width, fill }: IconProps) => JSX.Element;
|
|
485
|
+
|
|
486
|
+
declare const Community: ({ height, width, fill }: IconProps) => JSX.Element;
|
|
487
|
+
|
|
488
|
+
declare const VIP: ({ height, width, fill }: IconProps) => JSX.Element;
|
|
489
|
+
|
|
490
|
+
declare const DealsOffers: ({ height, width, fill }: IconProps) => JSX.Element;
|
|
491
|
+
|
|
492
|
+
declare const StyleFashionContent: ({ height, width, fill }: IconProps) => JSX.Element;
|
|
493
|
+
|
|
494
|
+
declare const MembersOnlyDiscount: ({ height, width, fill }: IconProps) => JSX.Element;
|
|
495
|
+
|
|
496
|
+
declare const MyAccount_FreeShipping: typeof FreeShipping;
|
|
497
|
+
declare const MyAccount_PersonalStylist: typeof PersonalStylist;
|
|
498
|
+
declare const MyAccount_Community: typeof Community;
|
|
499
|
+
declare const MyAccount_VIP: typeof VIP;
|
|
500
|
+
declare const MyAccount_DealsOffers: typeof DealsOffers;
|
|
501
|
+
declare const MyAccount_StyleFashionContent: typeof StyleFashionContent;
|
|
502
|
+
declare const MyAccount_MembersOnlyDiscount: typeof MembersOnlyDiscount;
|
|
503
|
+
declare namespace MyAccount {
|
|
504
|
+
export {
|
|
505
|
+
MyAccount_FreeShipping as FreeShipping,
|
|
506
|
+
MyAccount_PersonalStylist as PersonalStylist,
|
|
507
|
+
MyAccount_Community as Community,
|
|
508
|
+
MyAccount_VIP as VIP,
|
|
509
|
+
MyAccount_DealsOffers as DealsOffers,
|
|
510
|
+
MyAccount_StyleFashionContent as StyleFashionContent,
|
|
511
|
+
MyAccount_MembersOnlyDiscount as MembersOnlyDiscount,
|
|
512
|
+
};
|
|
513
|
+
}
|
|
514
|
+
|
|
515
|
+
declare type IconType = ({ height, width, fill, testId }: IconProps) => JSX.Element;
|
|
420
516
|
declare const Icon: {
|
|
421
517
|
Custom: typeof Custom;
|
|
422
518
|
Arrows: typeof Arrows;
|
|
@@ -429,6 +525,8 @@ declare const Icon: {
|
|
|
429
525
|
Download: typeof Download;
|
|
430
526
|
Payment: typeof Payment;
|
|
431
527
|
SlideDots: typeof SlideDots;
|
|
528
|
+
Emoji: typeof Emoji;
|
|
529
|
+
MyAccount: typeof MyAccount;
|
|
432
530
|
};
|
|
433
531
|
|
|
434
532
|
interface CardBodyProps {
|
|
@@ -499,8 +597,9 @@ interface SizeFitGuideProps {
|
|
|
499
597
|
title: string;
|
|
500
598
|
fitPercentage?: number;
|
|
501
599
|
onClick: () => void;
|
|
600
|
+
onClickFitPercentage?: () => void;
|
|
502
601
|
}
|
|
503
|
-
declare const SizeFitGuide: ({ title, fitPercentage, onClick }: SizeFitGuideProps) => JSX.Element;
|
|
602
|
+
declare const SizeFitGuide: ({ title, fitPercentage, onClick, onClickFitPercentage, }: SizeFitGuideProps) => JSX.Element;
|
|
504
603
|
|
|
505
604
|
interface BaseButtonProps {
|
|
506
605
|
children: React.ReactNode;
|
|
@@ -511,6 +610,7 @@ interface BaseButtonProps {
|
|
|
511
610
|
onClick: () => void;
|
|
512
611
|
className?: string;
|
|
513
612
|
inline?: boolean;
|
|
613
|
+
uppercase?: boolean;
|
|
514
614
|
testId?: string;
|
|
515
615
|
}
|
|
516
616
|
|
|
@@ -521,8 +621,9 @@ interface TextButtonProps$1 extends BaseProps {
|
|
|
521
621
|
TrailingIcon?: IconType;
|
|
522
622
|
iconColor?: string;
|
|
523
623
|
size?: ComponentSize;
|
|
624
|
+
uppercase?: boolean;
|
|
524
625
|
}
|
|
525
|
-
declare const TextButton: ({ text, LeadingIcon, TrailingIcon, iconColor, disabled, type, size, onClick, }: TextButtonProps$1) => _emotion_react_jsx_runtime.JSX.Element;
|
|
626
|
+
declare const TextButton: ({ text, LeadingIcon, TrailingIcon, iconColor, disabled, type, size, uppercase, onClick, }: TextButtonProps$1) => _emotion_react_jsx_runtime.JSX.Element;
|
|
526
627
|
|
|
527
628
|
interface DiscountTagProps {
|
|
528
629
|
discount: number;
|
|
@@ -541,8 +642,9 @@ interface PriceLabelProps {
|
|
|
541
642
|
color?: string;
|
|
542
643
|
size?: ComponentSize.Small | ComponentSize.Medium | ComponentSize.Large;
|
|
543
644
|
discount?: DiscountTagProps;
|
|
645
|
+
testId?: string;
|
|
544
646
|
}
|
|
545
|
-
declare const PriceLabel: ({ finalPrice, originalPrice, discount, color, size, }: PriceLabelProps) => JSX.Element;
|
|
647
|
+
declare const PriceLabel: ({ finalPrice, originalPrice, discount, color, testId, size, }: PriceLabelProps) => JSX.Element;
|
|
546
648
|
|
|
547
649
|
interface ColorPickerProps {
|
|
548
650
|
options: ColorPickerOption[];
|
|
@@ -564,12 +666,13 @@ declare const MultiColorPicker: ({ options, label, selectedValue, onChange, }: M
|
|
|
564
666
|
interface ProductGalleryProps {
|
|
565
667
|
images: ImageType[];
|
|
566
668
|
selectedValue?: ImageType;
|
|
567
|
-
|
|
568
|
-
|
|
669
|
+
topTag?: JSX.Element;
|
|
670
|
+
bottomTag?: JSX.Element;
|
|
569
671
|
productImageDataTestId?: string;
|
|
570
672
|
previewListDataTestId?: string;
|
|
673
|
+
thumbnailPosition?: 'vertical' | 'horizontal';
|
|
571
674
|
}
|
|
572
|
-
declare const ProductGallery: ({ images, selectedValue,
|
|
675
|
+
declare const ProductGallery: ({ images, selectedValue, topTag, bottomTag, productImageDataTestId, previewListDataTestId, thumbnailPosition, }: ProductGalleryProps) => JSX.Element;
|
|
573
676
|
|
|
574
677
|
interface RatingProps {
|
|
575
678
|
rating: number;
|
|
@@ -577,8 +680,10 @@ interface RatingProps {
|
|
|
577
680
|
reviews: number;
|
|
578
681
|
reviewsText: string;
|
|
579
682
|
wrapWithParenthesis?: boolean;
|
|
683
|
+
underline?: boolean;
|
|
684
|
+
reviewsContainerId?: string;
|
|
580
685
|
}
|
|
581
|
-
declare const Rating: ({ size, reviews, reviewsText, rating, wrapWithParenthesis, }: RatingProps) => JSX.Element;
|
|
686
|
+
declare const Rating: ({ size, reviews, reviewsText, rating, wrapWithParenthesis, underline, reviewsContainerId, }: RatingProps) => JSX.Element;
|
|
582
687
|
|
|
583
688
|
interface FitPredictorProps {
|
|
584
689
|
onClick: () => void;
|
|
@@ -776,6 +881,12 @@ declare type ThemeComponent = {
|
|
|
776
881
|
lineHeight: string;
|
|
777
882
|
border: string;
|
|
778
883
|
boxShadow: string;
|
|
884
|
+
errorBorder: string;
|
|
885
|
+
};
|
|
886
|
+
inputPlaceholder: {
|
|
887
|
+
fontSize: string;
|
|
888
|
+
padding: string;
|
|
889
|
+
focusBorder: string;
|
|
779
890
|
};
|
|
780
891
|
inputCustom: {
|
|
781
892
|
button: {
|
|
@@ -1014,8 +1125,10 @@ declare type ThemeComponent = {
|
|
|
1014
1125
|
packSelector: {
|
|
1015
1126
|
borderRadius: string;
|
|
1016
1127
|
borderColor: string;
|
|
1017
|
-
|
|
1018
|
-
|
|
1128
|
+
highlightColor: string;
|
|
1129
|
+
selectedColor: string;
|
|
1130
|
+
selectedContrast: string;
|
|
1131
|
+
tagColor: string;
|
|
1019
1132
|
};
|
|
1020
1133
|
};
|
|
1021
1134
|
declare type ThemeTypography = {
|
|
@@ -1090,10 +1203,11 @@ interface MinimalisticProps {
|
|
|
1090
1203
|
discount: number;
|
|
1091
1204
|
offText: string;
|
|
1092
1205
|
widthAuto?: boolean;
|
|
1206
|
+
testId?: string;
|
|
1093
1207
|
}
|
|
1094
1208
|
|
|
1095
1209
|
declare const Bundle: {
|
|
1096
|
-
Minimalistic: ({ backgroundColor, borderColor, originalPrice, price, savingPrice, getMorePayLessText, youAreSavingText, getQtyForText, discount, offText, widthAuto, }: MinimalisticProps) => JSX.Element;
|
|
1210
|
+
Minimalistic: ({ backgroundColor, borderColor, originalPrice, price, savingPrice, getMorePayLessText, youAreSavingText, getQtyForText, discount, offText, widthAuto, testId, }: MinimalisticProps) => JSX.Element;
|
|
1097
1211
|
Simple: ({ title, freeShippingText, price, anyQtyForText, backgroundColor, widthAuto, }: SimpleProps) => JSX.Element;
|
|
1098
1212
|
};
|
|
1099
1213
|
|
|
@@ -1133,6 +1247,9 @@ interface BaseInputCommmonProps {
|
|
|
1133
1247
|
required?: string;
|
|
1134
1248
|
children?: React.ReactNode;
|
|
1135
1249
|
size?: 'regular' | 'small';
|
|
1250
|
+
inlinePlaceholder?: boolean;
|
|
1251
|
+
hasError?: boolean;
|
|
1252
|
+
inputType?: 'text' | 'email' | 'password' | 'url';
|
|
1136
1253
|
}
|
|
1137
1254
|
interface BaseInputControlled extends BaseInputCommmonProps {
|
|
1138
1255
|
value: string;
|
|
@@ -1166,6 +1283,7 @@ interface BaseCTAProps {
|
|
|
1166
1283
|
size?: ComponentSize;
|
|
1167
1284
|
text: string;
|
|
1168
1285
|
type?: ButtonType;
|
|
1286
|
+
inline?: boolean;
|
|
1169
1287
|
testId?: string;
|
|
1170
1288
|
}
|
|
1171
1289
|
|
|
@@ -1180,7 +1298,7 @@ declare type CustomProps = BaseInputProps & {
|
|
|
1180
1298
|
};
|
|
1181
1299
|
|
|
1182
1300
|
declare const Input: {
|
|
1183
|
-
Simple: ({ value, onChange, defaultValue, label, children, required, onValidation, size, ...rest }: BaseInputProps) => JSX.Element;
|
|
1301
|
+
Simple: ({ value, onChange, defaultValue, label, children, required, onValidation, size, placeholder, inlinePlaceholder, hasError, inputType, ...rest }: BaseInputProps) => JSX.Element;
|
|
1184
1302
|
Custom: ({ onClick, text, variant, ...rest }: CustomProps) => JSX.Element;
|
|
1185
1303
|
SimplePlusButton: ({ onClick, onClickEdit, text, success, editText, successText, ...rest }: BasePlusButtonProps) => JSX.Element;
|
|
1186
1304
|
SimplePlusIcon: ({ Icon, ...rest }: BasePlusIconProps) => JSX.Element;
|
|
@@ -1314,19 +1432,22 @@ interface ReviewProps {
|
|
|
1314
1432
|
declare const Review: ({ reviewerName, date, rating, stars, title, description, image }: ReviewProps) => JSX.Element;
|
|
1315
1433
|
|
|
1316
1434
|
interface SliderNavigationProps {
|
|
1317
|
-
children: JSX.Element[]
|
|
1435
|
+
children: JSX.Element | JSX.Element[] | StyledComponent<any>;
|
|
1318
1436
|
infinite: boolean;
|
|
1319
1437
|
adaptiveHeight: boolean;
|
|
1320
|
-
dotsSize
|
|
1321
|
-
dotListMarginTop
|
|
1438
|
+
dotsSize?: ComponentSize.Large | ComponentSize.Medium | ComponentSize.Small;
|
|
1439
|
+
dotListMarginTop?: number;
|
|
1322
1440
|
initialSlide?: number;
|
|
1323
1441
|
arrows?: {
|
|
1324
1442
|
arrowWidth: number;
|
|
1325
1443
|
arrowHeight: number;
|
|
1326
1444
|
arrowPadding: number;
|
|
1327
1445
|
};
|
|
1446
|
+
dots?: boolean;
|
|
1447
|
+
slidesToShow?: number;
|
|
1448
|
+
speed?: number;
|
|
1328
1449
|
}
|
|
1329
|
-
declare const SliderNavigation: ({ children, infinite, arrows, adaptiveHeight, dotsSize, dotListMarginTop, initialSlide, }: SliderNavigationProps) => _emotion_react_jsx_runtime.JSX.Element;
|
|
1450
|
+
declare const SliderNavigation: ({ children, infinite, arrows, adaptiveHeight, dotsSize, dotListMarginTop, initialSlide, dots, slidesToShow, speed, }: SliderNavigationProps) => _emotion_react_jsx_runtime.JSX.Element;
|
|
1330
1451
|
|
|
1331
1452
|
interface DropdownListIconsProps {
|
|
1332
1453
|
items: DropdownListIconsItem[];
|
|
@@ -1380,8 +1501,8 @@ interface ProductItemProps {
|
|
|
1380
1501
|
price: Pick<PriceLabelProps, 'finalPrice' | 'originalPrice' | 'color'>;
|
|
1381
1502
|
rating: Pick<RatingProps, 'rating' | 'reviews'>;
|
|
1382
1503
|
tags?: {
|
|
1383
|
-
categoryTagText
|
|
1384
|
-
seasonOfferTagText
|
|
1504
|
+
categoryTagText?: string;
|
|
1505
|
+
seasonOfferTagText?: string;
|
|
1385
1506
|
};
|
|
1386
1507
|
alignName?: 'left' | 'center';
|
|
1387
1508
|
url?: string;
|
|
@@ -1390,6 +1511,9 @@ interface ProductItemProps {
|
|
|
1390
1511
|
|
|
1391
1512
|
interface ProductItemSmallMobileProps extends ProductItemProps {
|
|
1392
1513
|
size: ComponentSize.Medium | ComponentSize.Small | ComponentSize.Large;
|
|
1514
|
+
topTag?: JSX.Element;
|
|
1515
|
+
bottomTag?: JSX.Element;
|
|
1516
|
+
onClick?: () => void;
|
|
1393
1517
|
}
|
|
1394
1518
|
|
|
1395
1519
|
declare function withProductGrid<P extends ProductItemProps>(ProductItemComponent: React.FC<P>, data: ProductItemProps[]): {
|
|
@@ -1398,7 +1522,7 @@ declare function withProductGrid<P extends ProductItemProps>(ProductItemComponen
|
|
|
1398
1522
|
};
|
|
1399
1523
|
|
|
1400
1524
|
declare const Collection: {
|
|
1401
|
-
ProductItemMobile: ({ title, image, price, rating, size,
|
|
1525
|
+
ProductItemMobile: ({ title, image, price, rating, size, alignName, url, className, topTag, bottomTag, onClick, }: ProductItemSmallMobileProps) => _emotion_react_types_jsx_namespace.EmotionJSX.Element;
|
|
1402
1526
|
withProductGrid: typeof withProductGrid;
|
|
1403
1527
|
};
|
|
1404
1528
|
|
|
@@ -1556,6 +1680,7 @@ declare type TextTagProps = {
|
|
|
1556
1680
|
declare type TextProps = AriaAttributes & {
|
|
1557
1681
|
style?: CSSProperties;
|
|
1558
1682
|
className?: string;
|
|
1683
|
+
testId?: string;
|
|
1559
1684
|
} & (TextHeroProps | TextDisplayProps | TextHeadingProps | TextBodyProps | TextLinkProps | TextButtonProps | TextPricingProps | TextLabelProps | TextTagProps);
|
|
1560
1685
|
|
|
1561
1686
|
interface SearchBarProps {
|
|
@@ -1563,19 +1688,23 @@ interface SearchBarProps {
|
|
|
1563
1688
|
resultOptions: SearchBarOptionItem[];
|
|
1564
1689
|
onChange: (text: string) => void;
|
|
1565
1690
|
onSearch: (term: string) => void;
|
|
1691
|
+
onClose: () => void;
|
|
1566
1692
|
resultsPanelDataTestId?: string;
|
|
1693
|
+
allResults?: number;
|
|
1694
|
+
initialTerm?: string;
|
|
1695
|
+
shouldClear?: boolean;
|
|
1567
1696
|
}
|
|
1568
|
-
declare const SearchBar: ({ suggestions, resultOptions, onChange, onSearch, resultsPanelDataTestId, }: SearchBarProps) => JSX.Element;
|
|
1697
|
+
declare const SearchBar: ({ suggestions, resultOptions, onChange, onSearch, onClose, resultsPanelDataTestId, allResults, initialTerm, shouldClear, }: SearchBarProps) => JSX.Element;
|
|
1569
1698
|
|
|
1570
1699
|
interface ProductGalleryMobileProps {
|
|
1571
1700
|
images: ImageType[];
|
|
1572
1701
|
selectedValue?: ImageType;
|
|
1573
|
-
|
|
1574
|
-
|
|
1702
|
+
topTag?: JSX.Element;
|
|
1703
|
+
bottomTag?: JSX.Element;
|
|
1575
1704
|
productImageDataTestId?: string;
|
|
1576
1705
|
slideDotsDataTestId?: string;
|
|
1577
1706
|
}
|
|
1578
|
-
declare const ProductGalleryMobile: ({ images, selectedValue,
|
|
1707
|
+
declare const ProductGalleryMobile: ({ images, selectedValue, topTag, bottomTag, productImageDataTestId, slideDotsDataTestId, }: ProductGalleryMobileProps) => JSX.Element;
|
|
1579
1708
|
|
|
1580
1709
|
interface RadioProps {
|
|
1581
1710
|
name: string;
|
|
@@ -1592,22 +1721,32 @@ declare const RadioInput: ({ name, value, id, label, checked, disabled, onChange
|
|
|
1592
1721
|
declare type PortalProps = {
|
|
1593
1722
|
id: string;
|
|
1594
1723
|
className?: string;
|
|
1724
|
+
overflow?: boolean;
|
|
1725
|
+
style?: CSSProperties;
|
|
1595
1726
|
};
|
|
1596
1727
|
declare const Portal: FC<PortalProps>;
|
|
1597
1728
|
|
|
1598
1729
|
declare type ModalProps = {
|
|
1599
1730
|
id: string;
|
|
1600
1731
|
dismissable?: boolean;
|
|
1732
|
+
maxFullScreen?: boolean;
|
|
1601
1733
|
};
|
|
1734
|
+
interface ContainerProps {
|
|
1735
|
+
maxFullScreen: boolean;
|
|
1736
|
+
opened?: boolean;
|
|
1737
|
+
}
|
|
1602
1738
|
declare const Overlay: _emotion_styled.StyledComponent<{
|
|
1603
1739
|
theme?: _emotion_react.Theme | undefined;
|
|
1604
1740
|
as?: React.ElementType<any> | undefined;
|
|
1605
|
-
} & {
|
|
1606
|
-
opened?: boolean | undefined;
|
|
1607
|
-
}, React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
|
|
1741
|
+
} & Pick<ContainerProps, "opened">, React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
|
|
1608
1742
|
declare const Modal: FC<ModalProps>;
|
|
1609
1743
|
declare const modalEvent: (id: string, detail: Omit<Events['modal'], 'id'>) => void;
|
|
1610
|
-
declare const useModalEvent: (id: string, cb: (event: CustomEvent<Events['modal']>) => void) => void;
|
|
1744
|
+
declare const useModalEvent: (id: string, cb: (event: CustomEvent<Events['modal']>) => void) => void;
|
|
1745
|
+
declare const useModal: (id: string) => {
|
|
1746
|
+
opened: boolean;
|
|
1747
|
+
open: () => void;
|
|
1748
|
+
close: () => void;
|
|
1749
|
+
};
|
|
1611
1750
|
|
|
1612
1751
|
interface CloseButtonProps {
|
|
1613
1752
|
onClick: () => void;
|
|
@@ -1646,8 +1785,9 @@ declare type QuantityPickerPropsUncontrolled = {
|
|
|
1646
1785
|
declare type QuantityPickerProps = {
|
|
1647
1786
|
initialValue?: number;
|
|
1648
1787
|
maxValue?: number;
|
|
1788
|
+
testId?: string;
|
|
1649
1789
|
} & (QuantityPickerPropsControlled | QuantityPickerPropsUncontrolled);
|
|
1650
|
-
declare const QuantityPicker: ({ initialValue, maxValue, value, onChange, }: QuantityPickerProps) => JSX.Element;
|
|
1790
|
+
declare const QuantityPicker: ({ initialValue, maxValue, value, testId, onChange, }: QuantityPickerProps) => JSX.Element;
|
|
1651
1791
|
|
|
1652
1792
|
declare type SpacingProps = {
|
|
1653
1793
|
size: number;
|
|
@@ -1675,6 +1815,53 @@ interface PackSelectorProps {
|
|
|
1675
1815
|
}
|
|
1676
1816
|
declare const PackSelector: FC<PackSelectorProps>;
|
|
1677
1817
|
|
|
1818
|
+
interface FiltersProps {
|
|
1819
|
+
values: Filter[];
|
|
1820
|
+
onChange: (newValues: Filter[], filtersState?: FilterChange) => void;
|
|
1821
|
+
tagsColor?: string;
|
|
1822
|
+
filterByText: string;
|
|
1823
|
+
clearAllText: string;
|
|
1824
|
+
filtersSelectText: string;
|
|
1825
|
+
isMobile: boolean;
|
|
1826
|
+
applyText: string;
|
|
1827
|
+
mobileBackArrowClick: () => void;
|
|
1828
|
+
mobileApplyButtonClick: () => void;
|
|
1829
|
+
onResetValues: () => void;
|
|
1830
|
+
}
|
|
1831
|
+
declare const Filters: ({ values, onChange, tagsColor, filterByText, clearAllText, isMobile, filtersSelectText, applyText, mobileApplyButtonClick, mobileBackArrowClick, onResetValues, }: FiltersProps) => JSX.Element;
|
|
1832
|
+
|
|
1833
|
+
interface SearchNavigationProps {
|
|
1834
|
+
returnText?: string;
|
|
1835
|
+
returnUrl?: string;
|
|
1836
|
+
steps?: string[];
|
|
1837
|
+
returnAction?: () => void;
|
|
1838
|
+
}
|
|
1839
|
+
declare const SearchNavigation: ({ returnText, returnUrl, steps, returnAction, }: SearchNavigationProps) => JSX.Element;
|
|
1840
|
+
|
|
1841
|
+
interface TabProps$1 {
|
|
1842
|
+
title: string;
|
|
1843
|
+
content: ReactNode;
|
|
1844
|
+
}
|
|
1845
|
+
interface TabsProps {
|
|
1846
|
+
backgroundColor?: string;
|
|
1847
|
+
initialSelected?: string;
|
|
1848
|
+
tabsMaxWidth?: string;
|
|
1849
|
+
tabs: TabProps$1[];
|
|
1850
|
+
}
|
|
1851
|
+
declare const Tabs: ({ backgroundColor, tabs, initialSelected, tabsMaxWidth, }: TabsProps) => JSX.Element | null;
|
|
1852
|
+
|
|
1853
|
+
interface TabProps {
|
|
1854
|
+
title: string;
|
|
1855
|
+
titleSize?: string;
|
|
1856
|
+
selectedTitleWeight?: number;
|
|
1857
|
+
height?: string;
|
|
1858
|
+
selected?: boolean;
|
|
1859
|
+
color?: string;
|
|
1860
|
+
tabsMaxWidth?: string;
|
|
1861
|
+
onClick: (clickedTab: string) => void;
|
|
1862
|
+
}
|
|
1863
|
+
declare const Tab: ({ title, titleSize, height, selectedTitleWeight, selected, onClick, color, tabsMaxWidth, }: TabProps) => JSX.Element;
|
|
1864
|
+
|
|
1678
1865
|
declare global {
|
|
1679
1866
|
interface Events {
|
|
1680
1867
|
modal: {
|
|
@@ -1714,4 +1901,4 @@ declare const formatPrice: (value: number, { locale, currency }?: {
|
|
|
1714
1901
|
currency?: string | undefined;
|
|
1715
1902
|
}) => string;
|
|
1716
1903
|
|
|
1717
|
-
export { Accordion, AmazonButton, AssetsProvider, Bundle, ButtonPrimary, ButtonSecondary, ButtonSecondaryOutline, ButtonType, CTAProps, _default as Card, CardSectionType, CartProductItem, CategoryTag, Checkbox, Collection,
|
|
1904
|
+
export { Accordion, AmazonButton, AssetsProvider, Bundle, ButtonPrimary, ButtonSecondary, ButtonSecondaryOutline, ButtonType, CTAProps, _default as Card, CardSectionType, CartProductItem, CategoryTag, Checkbox, Collection, ColorPickerOption, ComponentPosition, ComponentSize, index_d as CrossSell, DeliveryDetails, DiscountTag, Drawer, DropdownListIcons, DropdownListIconsItem, DropdownListIconsSubItem, DropdownOption, Filter, FilterChange, FilteringDropdown, Tags as FilteringTags, Filters, FitPredictor, Icon, IconButton, IconProps, IconWithOpacityProps, Image, ImageType, Input, InputValidationType, Modal, MultiColorPicker, OfferBanner, OrderBar, Overlay, PackSelector, Pagination, Pattern, PaymentMethod, PaypalButton, Portal, PriceLabel, ProductGallery, ProductGalleryMobile, ProgressBar, QuantityPicker, RadioGroupInput, RadioGroupOption, RadioInput, Rating, Review, ScrollToTop, SearchBar, SearchBarOptionItem, SearchNavigation, SeasonOfferTag, SimpleDropdown, SimpleOrderItem, SingleColorPicker, SizeFitGuide, SizeOption, SizeSelector, SizeTable, SliderNavigation, Spacing, Spinner, StarList, Tab, Tabs, Text, TextButton, Theme, ThemeAssets, ThemeBasicPallete, ThemeBreakpoints, ThemeColorPallete, ThemeColors, ThemeComponent, ThemeFonts, ThemeProvider, ThemeTypography, ThemeVariables, Timer, Tooltip, Totals, WithTestId, decimalFormat, formatPrice, isEmail, isEmpty, isNumber, isPhoneNumber, isValidDate, modalEvent, simulateMouseClick, sliceString, useModal, useModalEvent, useOnClickOutside, useTheme, useThemeAssets, useWindowDimensions };
|
package/build/index.esm.css
CHANGED
|
@@ -1,2 +1,4 @@
|
|
|
1
1
|
.slick-slider{position:relative;display:block;box-sizing:border-box;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;-webkit-touch-callout:none;-khtml-user-select:none;-ms-touch-action:pan-y;touch-action:pan-y;-webkit-tap-highlight-color:transparent;}.slick-list{position:relative;display:block;overflow:hidden;margin:0;padding:0;}.slick-list:focus{outline:none;}.slick-list.dragging{cursor:pointer;cursor:hand;}.slick-slider .slick-track,.slick-slider .slick-list{-webkit-transform:translate3d(0,0,0);-moz-transform:translate3d(0,0,0);-ms-transform:translate3d(0,0,0);-o-transform:translate3d(0,0,0);transform:translate3d(0,0,0);}.slick-track{position:relative;top:0;left:0;display:block;margin-left:auto;margin-right:auto;}.slick-track:before,.slick-track:after{display:table;content:'';}.slick-track:after{clear:both;}.slick-loading .slick-track{visibility:hidden;}.slick-slide{display:none;float:left;height:100%;min-height:0.063rem;}[dir='rtl'] .slick-slide{float:right;}.slick-slide img{display:block;}.slick-slide.slick-loading img{display:none;}.slick-slide.dragging img{pointer-events:none;}.slick-initialized .slick-slide{display:block;}.slick-loading .slick-slide{visibility:hidden;}.slick-vertical .slick-slide{display:block;height:auto;border:0.063rem solid transparent;}.slick-arrow.slick-hidden{display:none;}
|
|
2
|
-
.slick-prev,.slick-next{font-size:0;line-height:0;position:absolute;top:50%;display:block;width:1.25rem;height:1.25rem;padding:0;-webkit-transform:translate(0,-50%);-ms-transform:translate(0,-50%);transform:translate(0,-50%);cursor:pointer;color:transparent;border:none;outline:none;background:transparent;}.slick-prev:hover,.slick-prev:focus,.slick-next:hover,.slick-next:focus{color:transparent;outline:none;background:transparent;}.slick-prev:hover:before,.slick-prev:focus:before,.slick-next:hover:before,.slick-next:focus:before{opacity:1;}.slick-prev.slick-disabled:before,.slick-next.slick-disabled:before{opacity:0.25;}.slick-prev:before,.slick-next:before{font-family:'slick';font-size:1.25rem;line-height:1;opacity:0.75;color:white;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;}.slick-prev{left:-1.5rem;}[dir='rtl'] .slick-prev{right:-1.5rem;left:auto;}.slick-prev:before{content:'←';}[dir='rtl'] .slick-prev:before{content:'→';}.slick-next{right:-1.5rem;}[dir='rtl'] .slick-next{right:auto;left:-1.5rem;}.slick-next:before{content:'→';}[dir='rtl'] .slick-next:before{content:'←';}.slick-dotted.slick-slider{margin-bottom:1.875rem;}.slick-dots{position:absolute;bottom:-1.5rem;display:block;width:100%;padding:0;margin:0;list-style:none;text-align:center;}.slick-dots li{position:relative;display:inline-block;width:1.25rem;height:1.25rem;margin:0 0.313rem;padding:0;cursor:pointer;}.slick-dots li button{font-size:0;line-height:0;display:block;width:1.25rem;height:1.25rem;padding:0.313rem;cursor:pointer;color:transparent;border:0;outline:none;background:transparent;}.slick-dots li button:hover,.slick-dots li button:focus{outline:none;}.slick-dots li button:hover:before,.slick-dots li button:focus:before{opacity:1;}.slick-dots li button:before{font-family:'slick';font-size:0.375rem;line-height:1.25rem;position:absolute;top:0;left:0;width:1.25rem;height:1.25rem;content:'•';text-align:center;opacity:0.25;color:black;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;}.slick-dots li.slick-active button:before{opacity:0.75;color:black;}
|
|
2
|
+
.slick-prev,.slick-next{font-size:0;line-height:0;position:absolute;top:50%;display:block;width:1.25rem;height:1.25rem;padding:0;-webkit-transform:translate(0,-50%);-ms-transform:translate(0,-50%);transform:translate(0,-50%);cursor:pointer;color:transparent;border:none;outline:none;background:transparent;}.slick-prev:hover,.slick-prev:focus,.slick-next:hover,.slick-next:focus{color:transparent;outline:none;background:transparent;}.slick-prev:hover:before,.slick-prev:focus:before,.slick-next:hover:before,.slick-next:focus:before{opacity:1;}.slick-prev.slick-disabled:before,.slick-next.slick-disabled:before{opacity:0.25;}.slick-prev:before,.slick-next:before{font-family:'slick';font-size:1.25rem;line-height:1;opacity:0.75;color:white;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;}.slick-prev{left:-1.5rem;}[dir='rtl'] .slick-prev{right:-1.5rem;left:auto;}.slick-prev:before{content:'←';}[dir='rtl'] .slick-prev:before{content:'→';}.slick-next{right:-1.5rem;}[dir='rtl'] .slick-next{right:auto;left:-1.5rem;}.slick-next:before{content:'→';}[dir='rtl'] .slick-next:before{content:'←';}.slick-dotted.slick-slider{margin-bottom:1.875rem;}.slick-dots{position:absolute;bottom:-1.5rem;display:block;width:100%;padding:0;margin:0;list-style:none;text-align:center;}.slick-dots li{position:relative;display:inline-block;width:1.25rem;height:1.25rem;margin:0 0.313rem;padding:0;cursor:pointer;}.slick-dots li button{font-size:0;line-height:0;display:block;width:1.25rem;height:1.25rem;padding:0.313rem;cursor:pointer;color:transparent;border:0;outline:none;background:transparent;}.slick-dots li button:hover,.slick-dots li button:focus{outline:none;}.slick-dots li button:hover:before,.slick-dots li button:focus:before{opacity:1;}.slick-dots li button:before{font-family:'slick';font-size:0.375rem;line-height:1.25rem;position:absolute;top:0;left:0;width:1.25rem;height:1.25rem;content:'•';text-align:center;opacity:0.25;color:black;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;}.slick-dots li.slick-active button:before{opacity:0.75;color:black;}
|
|
3
|
+
.iiz{max-width:100%;margin:0;position:relative;overflow:hidden;display:inline-block;cursor:-webkit-zoom-in;cursor:zoom-in}.iiz--drag .iiz__zoom-img--visible{cursor:-webkit-grab;cursor:grab}.iiz__img{max-width:100%;height:auto;display:block;pointer-events:none;visibility:visible;opacity:1}.iiz__img--hidden{visibility:hidden;opacity:0}.iiz__img--abs{width:100%;height:100%;position:absolute;top:0;left:0;display:block}.iiz__zoom-img{width:auto!important;max-width:none!important;position:absolute;visibility:hidden;opacity:0;pointer-events:none;display:block}.iiz__zoom-img--visible{visibility:visible;opacity:1;pointer-events:auto;cursor:-webkit-zoom-out;cursor:zoom-out;-ms-touch-action:none;touch-action:none}.iiz__zoom-portal{position:fixed;top:0;right:0;bottom:0;left:0;z-index:10000}.iiz__btn{background:rgba(255,255,255,.8);width:40px;height:40px;border:none;outline:0;padding:0;position:absolute;text-decoration:none;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-moz-appearance:none;-webkit-appearance:none;appearance:none}.iiz__btn:before{content:" ";background-position:center;background-repeat:no-repeat;display:block}.iiz__hint{bottom:10px;right:10px;pointer-events:none}.iiz__hint:before{content:" ";background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 19.9 19.9'%3E%3Cpath d='M13.9 7.4C13.9 3.8 11 .9 7.4.9S.9 3.8.9 7.4s2.9 6.5 6.5 6.5 6.5-2.9 6.5-6.5zm5.3 12.5l-6.7-7.2c-1.4 1.3-3.2 2.1-5.1 2.1-4.1 0-7.4-3.3-7.4-7.4S3.3 0 7.4 0s7.4 3.3 7.4 7.4c0 1.7-.6 3.4-1.7 4.7l6.8 7.2-.7.6z' fill='%23000222'/%3E%3C/svg%3E");width:20px;height:20px}.iiz__close{top:10px;right:10px;visibility:hidden;opacity:0}.iiz__close--visible{visibility:visible;opacity:1;cursor:pointer}.iiz__close::before{content:" ";width:29px;height:29px;background-image:-webkit-gradient(linear,left top,left bottom,from(#222),to(#222)),-webkit-gradient(linear,left top,left bottom,from(#222),to(#222));background-image:linear-gradient(#222,#222),linear-gradient(#222,#222);background-size:100% 1px,1px 100%;-webkit-transform:rotate(45deg);transform:rotate(45deg)}
|
|
4
|
+
.iiz{max-width:100%;margin:0;position:relative;overflow:hidden;display:inline-block;cursor:-webkit-zoom-in;cursor:zoom-in;}.zoomWrapper.iiz{max-height:510px;}.iiz--drag .iiz__zoom-img--visible{cursor:-webkit-grab;cursor:grab;}.iiz__img{max-width:100%;height:auto;display:block;pointer-events:none;visibility:visible;opacity:1;}.iiz__img--hidden{visibility:hidden;opacity:0;}.iiz__img--abs{width:100%;height:100%;position:absolute;top:0;left:0;display:block;}.iiz__zoom-img{width:auto!important;max-width:none!important;position:absolute;visibility:hidden;opacity:0;pointer-events:none;display:block;}.iiz__zoom-img--visible{visibility:visible;opacity:1;pointer-events:auto;cursor:-webkit-zoom-out;cursor:zoom-out;-ms-touch-action:none;touch-action:none;zoom:1.2;}.iiz__zoom-portal{position:fixed;top:0;right:0;bottom:0;left:0;z-index:5;}.iiz__btn{background:rgba(255,255,255,0.8);max-width:95px;min-width:fit-content;height:32px;border:none;outline:none;padding:0 8px;position:absolute;z-index:5;text-decoration:none;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-moz-appearance:none;-webkit-appearance:none;appearance:none;}.iiz__btn:before{content:' ';background-position:center;background-repeat:no-repeat;display:block;}.iiz__hint{bottom:10%;right:0;pointer-events:none;border-radius:150px 0 0 150px;}.iiz__hint:before{content:'+';background-image:none;width:17px;height:17px;font-size:19px;border-radius:500px;border:2px solid #292929;display:inline-block;position:relative;text-align:center;line-height:17px;font-weight:600;}.iiz__hint:after{content:'Zoom in';font-size:14px;font-weight:600;display:inline-block;margin-left:5px;}.iiz__close{border-radius:150px;top:auto;right:0;left:0;margin:auto;bottom:20px;visibility:hidden;opacity:0;color:#292929;}.iiz__close--visible{visibility:visible;opacity:1;cursor:pointer;}.iiz__close::before{content:' ';width:16px;height:16px;background-image:-webkit-gradient(linear,left top,left bottom,from(#222),to(#222)),-webkit-gradient(linear,left top,left bottom,from(#222),to(#222));background-image:linear-gradient(#222,#222),linear-gradient(#222,#222);background-size:65% 2px,2px 65%;transform:rotate(45deg);border-radius:500px;border:2px solid #292929;}.iiz__close::after{content:'Close';font-size:14px;font-weight:600;display:inline-block;margin-left:5px;}
|