@bonlineza/luxity-lib 2.30.2 → 2.31.0

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 (20) hide show
  1. package/CHANGELOG.md +12 -2
  2. package/CommunicationPreferenceOptionsRenderer.js +40 -28
  3. package/CommunicationPreferenceSection.js +44 -32
  4. package/CommunicationPreferences.js +48 -37
  5. package/CreateRarestepInterest.js +85 -0
  6. package/GALink.js +60 -0
  7. package/GraphQLDropdownSelector.js +4 -7
  8. package/LuxityDesktopHeader.js +373 -0
  9. package/LuxityFooter.js +2026 -0
  10. package/LuxityGraphQLDropdownSelector.js +10 -8
  11. package/LuxityHeader.js +369 -0
  12. package/LuxityMobileHeader.js +567 -0
  13. package/LuxitySideNav.js +424 -0
  14. package/MaterialSelector.js +10 -8
  15. package/ModelSelector.js +10 -8
  16. package/Tracking.js +27 -0
  17. package/build/assets/.DS_Store +0 -0
  18. package/build/bundle.css +1 -0
  19. package/build/bundle.js +1018 -33
  20. package/package.json +5 -5
package/LuxityDesktopHeader.js ADDED
@@ -0,0 +1,373 @@
1
+ (function (global, factory) {
2
+ typeof exports === 'object' && typeof module !== 'undefined' ? module.exports = factory(require('react')) :
3
+ typeof define === 'function' && define.amd ? define(['react'], factory) :
4
+ (global = global || self, global.LuxityDesktopHeader = factory(global.React));
5
+ }(this, (function (React) { 'use strict';
6
+
7
+ var React__default = 'default' in React ? React['default'] : React;
8
+
9
+ function _slicedToArray(arr, i) {
10
+ return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest();
11
+ }
12
+
13
+ function _arrayWithHoles(arr) {
14
+ if (Array.isArray(arr)) return arr;
15
+ }
16
+
17
+ function _iterableToArrayLimit(arr, i) {
18
+ var _i = arr == null ? null : typeof Symbol !== "undefined" && arr[Symbol.iterator] || arr["@@iterator"];
19
+
20
+ if (_i == null) return;
21
+ var _arr = [];
22
+ var _n = true;
23
+ var _d = false;
24
+
25
+ var _s, _e;
26
+
27
+ try {
28
+ for (_i = _i.call(arr); !(_n = (_s = _i.next()).done); _n = true) {
29
+ _arr.push(_s.value);
30
+
31
+ if (i && _arr.length === i) break;
32
+ }
33
+ } catch (err) {
34
+ _d = true;
35
+ _e = err;
36
+ } finally {
37
+ try {
38
+ if (!_n && _i["return"] != null) _i["return"]();
39
+ } finally {
40
+ if (_d) throw _e;
41
+ }
42
+ }
43
+
44
+ return _arr;
45
+ }
46
+
47
+ function _unsupportedIterableToArray(o, minLen) {
48
+ if (!o) return;
49
+ if (typeof o === "string") return _arrayLikeToArray(o, minLen);
50
+ var n = Object.prototype.toString.call(o).slice(8, -1);
51
+ if (n === "Object" && o.constructor) n = o.constructor.name;
52
+ if (n === "Map" || n === "Set") return Array.from(o);
53
+ if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen);
54
+ }
55
+
56
+ function _arrayLikeToArray(arr, len) {
57
+ if (len == null || len > arr.length) len = arr.length;
58
+
59
+ for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i];
60
+
61
+ return arr2;
62
+ }
63
+
64
+ function _nonIterableRest() {
65
+ throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");
66
+ }
67
+
68
+ var Dropdown = function Dropdown(_ref) {
69
+ var title = _ref.title,
70
+ imageSrc = _ref.imageSrc,
71
+ _ref$categoryElements = _ref.categoryElements,
72
+ categoryElements = _ref$categoryElements === void 0 ? [] : _ref$categoryElements,
73
+ _ref$brandElements = _ref.brandElements,
74
+ brandElements = _ref$brandElements === void 0 ? [] : _ref$brandElements,
75
+ productsUrl = _ref.productsUrl;
76
+ return /*#__PURE__*/React__default.createElement("div", {
77
+ className: "dropdown"
78
+ }, /*#__PURE__*/React__default.createElement("div", {
79
+ className: "dropdown__column"
80
+ }, /*#__PURE__*/React__default.createElement("div", {
81
+ className: "dropdown__title"
82
+ }, title), /*#__PURE__*/React__default.createElement("div", {
83
+ className: "dropdown__elements dropdown__elements--column"
84
+ }, !!categoryElements.length && categoryElements.map(function (category) {
85
+ return /*#__PURE__*/React__default.createElement("a", {
86
+ href: "".concat(productsUrl, "/").concat(category === null || category === void 0 ? void 0 : category.slug),
87
+ className: "dropdown__element",
88
+ key: category.name
89
+ }, category === null || category === void 0 ? void 0 : category.name);
90
+ }))), /*#__PURE__*/React__default.createElement("div", {
91
+ className: "dropdown__column"
92
+ }, /*#__PURE__*/React__default.createElement("div", {
93
+ className: "dropdown__title"
94
+ }, "Brands"), /*#__PURE__*/React__default.createElement("div", {
95
+ className: "dropdown__elements dropdown__elements--row"
96
+ }, !!brandElements.length && brandElements.map(function (brand) {
97
+ return /*#__PURE__*/React__default.createElement("a", {
98
+ href: "".concat(productsUrl, "/").concat(brand === null || brand === void 0 ? void 0 : brand.slug),
99
+ className: "dropdown__element",
100
+ key: brand.name
101
+ }, brand === null || brand === void 0 ? void 0 : brand.name);
102
+ }))), /*#__PURE__*/React__default.createElement("div", {
103
+ className: "dropdown__column"
104
+ }, /*#__PURE__*/React__default.createElement("img", {
105
+ src: imageSrc,
106
+ alt: "".concat(title)
107
+ })));
108
+ };
109
+
110
+ var StoresDropdown = function StoresDropdown(_ref) {
111
+ var _ref$stores = _ref.stores,
112
+ stores = _ref$stores === void 0 ? [] : _ref$stores,
113
+ contactNumber = _ref.contactNumber;
114
+ return /*#__PURE__*/React__default.createElement("div", {
115
+ className: "stores-dropdown"
116
+ }, !!stores.length && stores.map(function (store) {
117
+ return /*#__PURE__*/React__default.createElement("div", {
118
+ className: "stores-dropdown__store-details",
119
+ key: store.name
120
+ }, /*#__PURE__*/React__default.createElement("div", {
121
+ className: "stores-dropdown__store-image"
122
+ }, /*#__PURE__*/React__default.createElement("img", {
123
+ className: "stores-dropdown__image",
124
+ src: store.image,
125
+ alt: store.name
126
+ })), /*#__PURE__*/React__default.createElement("div", {
127
+ className: "stores-dropdown__store-info"
128
+ }, /*#__PURE__*/React__default.createElement("h4", {
129
+ className: "stores-dropdown__title"
130
+ }, store.title, " ", /*#__PURE__*/React__default.createElement("br", null), " ", store.location), /*#__PURE__*/React__default.createElement("div", {
131
+ className: "stores-dropdown__open-days"
132
+ }, store.regularOpenDays), /*#__PURE__*/React__default.createElement("div", {
133
+ className: "stores-dropdown__open-hours"
134
+ }, store.regularOpenHours), /*#__PURE__*/React__default.createElement("div", {
135
+ className: "stores-dropdown__open-days"
136
+ }, store.holidayOpenDays), /*#__PURE__*/React__default.createElement("div", {
137
+ className: "stores-dropdown__open-hours"
138
+ }, store.holidayOpenHours), (store === null || store === void 0 ? void 0 : store.weekendOpenDays) && /*#__PURE__*/React__default.createElement(React__default.Fragment, null, /*#__PURE__*/React__default.createElement("div", {
139
+ className: "stores-dropdown__open-days"
140
+ }, store.weekendOpenDays), /*#__PURE__*/React__default.createElement("div", {
141
+ className: "stores-dropdown__open-hours"
142
+ }, store.weekendOpenHours))));
143
+ }), /*#__PURE__*/React__default.createElement("div", {
144
+ className: "stores-dropdown__queries"
145
+ }, /*#__PURE__*/React__default.createElement("h4", {
146
+ className: "stores-dropdown__queries-title"
147
+ }, "Customer Queries: "), /*#__PURE__*/React__default.createElement("a", {
148
+ className: "stores-dropdown__contact-details",
149
+ href: "tel:".concat(contactNumber)
150
+ }, contactNumber)));
151
+ };
152
+
153
+ var LuxityDesktopHeader = function LuxityDesktopHeader(_ref) {
154
+ var accountIcon = _ref.accountIcon,
155
+ cartIcon = _ref.cartIcon,
156
+ interestIcon = _ref.interestIcon,
157
+ cartCount = _ref.cartCount,
158
+ logoSrc = _ref.logoSrc,
159
+ categoryElements = _ref.categoryElements,
160
+ newBrandElements = _ref.newBrandElements,
161
+ bagsElements = _ref.bagsElements,
162
+ shoesElement = _ref.shoesElement,
163
+ clothingElements = _ref.clothingElements,
164
+ accessoriesElements = _ref.accessoriesElements,
165
+ accessoriesCategoryElements = _ref.accessoriesCategoryElements,
166
+ watchesElements = _ref.watchesElements,
167
+ newBrandsImage = _ref.newBrandsImage,
168
+ bagsImage = _ref.bagsImage,
169
+ shoesImage = _ref.shoesImage,
170
+ clothingImage = _ref.clothingImage,
171
+ accessoriesImage = _ref.accessoriesImage,
172
+ watchesImage = _ref.watchesImage,
173
+ productsUrl = _ref.productsUrl,
174
+ stores = _ref.stores,
175
+ contactNumber = _ref.contactNumber,
176
+ onInterestClick = _ref.onInterestClick,
177
+ onCartClick = _ref.onCartClick,
178
+ onAccountClick = _ref.onAccountClick,
179
+ inputSearchIcon = _ref.inputSearchIcon,
180
+ onSearch = _ref.onSearch,
181
+ ourStoryLink = _ref.ourStoryLink,
182
+ blogLink = _ref.blogLink,
183
+ contactUsLink = _ref.contactUsLink,
184
+ sellToUsLink = _ref.sellToUsLink;
185
+
186
+ var _useState = React.useState(''),
187
+ _useState2 = _slicedToArray(_useState, 2),
188
+ searchValue = _useState2[0],
189
+ setSearchValue = _useState2[1];
190
+
191
+ var handleChange = function handleChange(event) {
192
+ setSearchValue(event.target.value);
193
+ };
194
+
195
+ var handleKeyDown = function handleKeyDown(event) {
196
+ if (event.key === 'Enter') {
197
+ onSearch(searchValue);
198
+ }
199
+ };
200
+
201
+ return /*#__PURE__*/React__default.createElement("div", {
202
+ className: "navbar"
203
+ }, /*#__PURE__*/React__default.createElement("div", {
204
+ className: "navbar__container"
205
+ }, /*#__PURE__*/React__default.createElement("div", {
206
+ className: "navbar__logo-wrapper"
207
+ }, /*#__PURE__*/React__default.createElement("div", {
208
+ className: "navbar__logo"
209
+ }, /*#__PURE__*/React__default.createElement("img", {
210
+ src: logoSrc,
211
+ alt: "luxity-logo"
212
+ }))), /*#__PURE__*/React__default.createElement("div", {
213
+ className: "navbar__section"
214
+ }, /*#__PURE__*/React__default.createElement("div", {
215
+ className: "navbar__body"
216
+ }, /*#__PURE__*/React__default.createElement("div", {
217
+ className: "navbar__product-search"
218
+ }, /*#__PURE__*/React__default.createElement("img", {
219
+ src: inputSearchIcon,
220
+ alt: "search-icon",
221
+ className: "navbar__input-search-icon"
222
+ }), /*#__PURE__*/React__default.createElement("input", {
223
+ className: "navbar__form-input",
224
+ type: "text",
225
+ placeholder: "Search for items and designs",
226
+ value: searchValue,
227
+ onChange: handleChange,
228
+ onKeyDown: handleKeyDown
229
+ })), /*#__PURE__*/React__default.createElement("nav", {
230
+ className: "navbar__nav-links navbar__nav-links--wrap"
231
+ }, /*#__PURE__*/React__default.createElement("li", {
232
+ className: "navbar__link"
233
+ }, /*#__PURE__*/React__default.createElement("a", {
234
+ href: "#",
235
+ className: "navbar__link-item"
236
+ }, "New"), /*#__PURE__*/React__default.createElement("div", {
237
+ className: "navbar__dropdown"
238
+ }, /*#__PURE__*/React__default.createElement(Dropdown, {
239
+ title: "Department",
240
+ imageSrc: newBrandsImage,
241
+ categoryElements: categoryElements,
242
+ brandElements: newBrandElements,
243
+ productsUrl: productsUrl
244
+ }))), /*#__PURE__*/React__default.createElement("li", {
245
+ className: "navbar__link"
246
+ }, /*#__PURE__*/React__default.createElement("a", {
247
+ href: "#",
248
+ className: "navbar__link-item"
249
+ }, "Bags"), /*#__PURE__*/React__default.createElement("div", {
250
+ className: "navbar__dropdown"
251
+ }, /*#__PURE__*/React__default.createElement(Dropdown, {
252
+ title: "Department",
253
+ imageSrc: bagsImage,
254
+ categoryElements: categoryElements,
255
+ brandElements: bagsElements,
256
+ productsUrl: productsUrl
257
+ }))), /*#__PURE__*/React__default.createElement("li", {
258
+ className: "navbar__link"
259
+ }, /*#__PURE__*/React__default.createElement("a", {
260
+ href: "#",
261
+ className: "navbar__link-item"
262
+ }, "Shoes"), /*#__PURE__*/React__default.createElement("div", {
263
+ className: "navbar__dropdown"
264
+ }, /*#__PURE__*/React__default.createElement(Dropdown, {
265
+ title: "Department",
266
+ imageSrc: shoesImage,
267
+ categoryElements: categoryElements,
268
+ brandElements: shoesElement,
269
+ productsUrl: productsUrl
270
+ }))), /*#__PURE__*/React__default.createElement("li", {
271
+ className: "navbar__link"
272
+ }, /*#__PURE__*/React__default.createElement("a", {
273
+ href: "#",
274
+ className: "navbar__link-item"
275
+ }, "Clothing"), /*#__PURE__*/React__default.createElement("div", {
276
+ className: "navbar__dropdown"
277
+ }, /*#__PURE__*/React__default.createElement(Dropdown, {
278
+ title: "Department",
279
+ imageSrc: clothingImage,
280
+ categoryElements: categoryElements,
281
+ brandElements: clothingElements,
282
+ productsUrl: productsUrl
283
+ }))), /*#__PURE__*/React__default.createElement("li", {
284
+ className: "navbar__link"
285
+ }, /*#__PURE__*/React__default.createElement("a", {
286
+ href: "#",
287
+ className: "navbar__link-item"
288
+ }, "Accessories"), /*#__PURE__*/React__default.createElement("div", {
289
+ className: "navbar__dropdown"
290
+ }, /*#__PURE__*/React__default.createElement(Dropdown, {
291
+ title: "Department",
292
+ imageSrc: accessoriesImage,
293
+ categoryElements: accessoriesCategoryElements,
294
+ brandElements: accessoriesElements,
295
+ productsUrl: productsUrl
296
+ }))), /*#__PURE__*/React__default.createElement("li", {
297
+ className: "navbar__link"
298
+ }, /*#__PURE__*/React__default.createElement("a", {
299
+ href: "#",
300
+ className: "navbar__link-item"
301
+ }, "Watches"), /*#__PURE__*/React__default.createElement("div", {
302
+ className: "navbar__dropdown"
303
+ }, /*#__PURE__*/React__default.createElement(Dropdown, {
304
+ title: "Department",
305
+ imageSrc: watchesImage,
306
+ categoryElements: categoryElements,
307
+ brandElements: watchesElements,
308
+ productsUrl: productsUrl
309
+ }))), /*#__PURE__*/React__default.createElement("li", {
310
+ className: "navbar__link"
311
+ }, /*#__PURE__*/React__default.createElement("a", {
312
+ href: "#",
313
+ className: "navbar__link-item"
314
+ }, "Stores"), /*#__PURE__*/React__default.createElement("div", {
315
+ className: "navbar__dropdown"
316
+ }, /*#__PURE__*/React__default.createElement(StoresDropdown, {
317
+ stores: stores,
318
+ contactNumber: contactNumber
319
+ }))))), /*#__PURE__*/React__default.createElement("div", {
320
+ className: "navbar__icons-wrapper"
321
+ }, /*#__PURE__*/React__default.createElement("div", {
322
+ className: "navbar__icons"
323
+ }, /*#__PURE__*/React__default.createElement("button", {
324
+ type: "button",
325
+ className: "navbar__icon",
326
+ onClick: onInterestClick
327
+ }, /*#__PURE__*/React__default.createElement("img", {
328
+ src: interestIcon,
329
+ alt: "interest-icon"
330
+ })), /*#__PURE__*/React__default.createElement("button", {
331
+ type: "button",
332
+ className: "navbar__icon",
333
+ onClick: onAccountClick
334
+ }, /*#__PURE__*/React__default.createElement("img", {
335
+ src: accountIcon,
336
+ alt: "account-icon"
337
+ })), /*#__PURE__*/React__default.createElement("button", {
338
+ type: "button",
339
+ className: "navbar__cart-icon navbar__icon",
340
+ onClick: onCartClick
341
+ }, /*#__PURE__*/React__default.createElement("img", {
342
+ src: cartIcon,
343
+ alt: "cart-icon"
344
+ }), /*#__PURE__*/React__default.createElement("div", {
345
+ className: "navbar__cart-count"
346
+ }, cartCount))), /*#__PURE__*/React__default.createElement("nav", {
347
+ className: "navbar__nav-links"
348
+ }, /*#__PURE__*/React__default.createElement("li", {
349
+ className: "navbar__company-link"
350
+ }, /*#__PURE__*/React__default.createElement("a", {
351
+ href: ourStoryLink,
352
+ className: "navbar__link-item"
353
+ }, "Our Story")), /*#__PURE__*/React__default.createElement("li", {
354
+ className: "navbar__company-link"
355
+ }, /*#__PURE__*/React__default.createElement("a", {
356
+ href: blogLink,
357
+ className: "navbar__link-item"
358
+ }, "Blog")), /*#__PURE__*/React__default.createElement("li", {
359
+ className: "navbar__company-link"
360
+ }, /*#__PURE__*/React__default.createElement("a", {
361
+ href: contactUsLink,
362
+ className: "navbar__link-item"
363
+ }, "Contact Us")), /*#__PURE__*/React__default.createElement("li", {
364
+ className: "navbar__company-link navbar__company-block"
365
+ }, /*#__PURE__*/React__default.createElement("a", {
366
+ href: sellToUsLink,
367
+ className: "navbar__link-item"
368
+ }, "Sell to us")))))));
369
+ };
370
+
371
+ return LuxityDesktopHeader;
372
+
373
+ })));