@bonlineza/luxity-lib 2.36.1-uk-platform.1 → 2.36.2
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/Accordion.js +116 -76
- package/AddInterest.js +777 -440
- package/AddProductInterest.js +644 -485
- package/BrandSelector.js +336 -176
- package/Checkbox.js +101 -68
- package/CheckboxButton.js +124 -79
- package/CommunicationPreferenceOptionsRenderer.js +169 -159
- package/CommunicationPreferenceSection.js +178 -166
- package/CommunicationPreferences.js +427 -549
- package/ConditionSelector.js +336 -174
- package/CountryCodeSelect.js +10 -7
- package/CurrencyInputFormatter.js +56 -29
- package/CurrencySelect.js +49 -23
- package/DropdownSelector.js +92 -68
- package/GALink.js +16 -6
- package/GenderSelector.js +142 -88
- package/GraphQLDropdownSelector.js +1508 -929
- package/GraphQLMultiSelector.js +274 -141
- package/IconHeader.js +25 -11
- package/IconWrapper.js +7 -3
- package/InterestCatSelector.js +74 -34
- package/InterestItem.js +187 -103
- package/Interests.js +1463 -913
- package/InterestsSubheading.js +10 -5
- package/InvertedTextButton.js +63 -27
- package/LuxityAppSideNav.js +21 -18
- package/LuxityDesktopHeader.js +451 -298
- package/LuxityFooter.js +321 -430
- package/LuxityGraphQLDropdownSelector.js +1540 -945
- package/LuxityGraphQLMultiselector.js +321 -167
- package/LuxityMobileHeader.js +544 -353
- package/LuxityPageReady.js +136 -74
- package/LuxityProductInterestItem.js +175 -97
- package/LuxitySideNav.js +244 -176
- package/MaterialSelector.js +1547 -951
- package/ModelSelector.js +1547 -951
- package/NotificationDropDown.js +218 -118
- package/Notify.js +1 -0
- package/OutlinePrimaryButton.js +58 -26
- package/PriceRangeSelector.js +281 -168
- package/PrimaryButton.js +58 -26
- package/RadioButtons.js +140 -114
- package/RangeSlider.js +242 -152
- package/RareStepFooter.js +41 -27
- package/RareStepHeader.js +190 -139
- package/ReactSelectWrapper.js +1 -0
- package/SecondaryButton.js +58 -26
- package/ShoeSizeRangeSelector.js +260 -162
- package/ShoeSizeSelector.js +263 -158
- package/SimpleErrorBoundary.js +106 -59
- package/StyleSelector.js +336 -176
- package/TestComponent.js +15 -0
- package/TextButton.js +58 -26
- package/Tooltip.js +39 -17
- package/Tracking.js +1 -0
- package/WrapperButton.js +43 -20
- package/build/CountryCodeSelect/index.js +18 -0
- package/build/ReactSelectWrapper/index.js +34 -0
- package/build/bundle.css +1 -1
- package/build/bundle.js +2616 -1974
- package/package.json +1 -1
- package/postcss.config.js +6 -0
- package/svg/Accessories.js +13 -6
- package/svg/Account.js +13 -6
- package/svg/Add.js +13 -6
- package/svg/ArrowRight.js +13 -6
- package/svg/Bags.js +13 -6
- package/svg/BurgerMenu.js +13 -6
- package/svg/Calendar.js +13 -6
- package/svg/CalendarCircled.js +13 -6
- package/svg/CheckCircled.js +13 -6
- package/svg/Close.js +13 -6
- package/svg/Clothing.js +13 -6
- package/svg/Dot.js +13 -6
- package/svg/Edit.js +13 -6
- package/svg/Eye.js +13 -6
- package/svg/FileAttach.js +13 -6
- package/svg/FileAttachCircled.js +13 -6
- package/svg/LightBulb.js +13 -6
- package/svg/Logo.js +13 -6
- package/svg/LuxityMenu.js +13 -6
- package/svg/Minus.js +13 -6
- package/svg/MobileAvatar.js +13 -6
- package/svg/MyOrder.js +13 -6
- package/svg/MyPayment.js +13 -6
- package/svg/MyProfile.js +14 -8
- package/svg/MySale.js +13 -6
- package/svg/Notification.js +13 -6
- package/svg/PointerDown.js +13 -6
- package/svg/Search.js +13 -6
- package/svg/Shoes.js +13 -6
- package/svg/SvgWrapper.js +7 -3
- package/svg/Trash.js +13 -6
- package/svg/Watches.js +13 -6
package/BrandSelector.js
CHANGED
|
@@ -9,143 +9,225 @@
|
|
|
9
9
|
EllipsisLoader = EllipsisLoader && Object.prototype.hasOwnProperty.call(EllipsisLoader, 'default') ? EllipsisLoader['default'] : EllipsisLoader;
|
|
10
10
|
PageReady = PageReady && Object.prototype.hasOwnProperty.call(PageReady, 'default') ? PageReady['default'] : PageReady;
|
|
11
11
|
|
|
12
|
-
function
|
|
13
|
-
(
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
}
|
|
17
|
-
function _arrayWithoutHoles(r) {
|
|
18
|
-
if (Array.isArray(r)) return _arrayLikeToArray(r);
|
|
19
|
-
}
|
|
20
|
-
function _assertThisInitialized(e) {
|
|
21
|
-
if (void 0 === e) throw new ReferenceError("this hasn't been initialised - super() hasn't been called");
|
|
22
|
-
return e;
|
|
23
|
-
}
|
|
24
|
-
function _callSuper(t, o, e) {
|
|
25
|
-
return o = _getPrototypeOf(o), _possibleConstructorReturn(t, _isNativeReflectConstruct() ? Reflect.construct(o, e || [], _getPrototypeOf(t).constructor) : o.apply(t, e));
|
|
26
|
-
}
|
|
27
|
-
function _classCallCheck(a, n) {
|
|
28
|
-
if (!(a instanceof n)) throw new TypeError("Cannot call a class as a function");
|
|
12
|
+
function _classCallCheck(instance, Constructor) {
|
|
13
|
+
if (!(instance instanceof Constructor)) {
|
|
14
|
+
throw new TypeError("Cannot call a class as a function");
|
|
15
|
+
}
|
|
29
16
|
}
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
17
|
+
|
|
18
|
+
function _defineProperties(target, props) {
|
|
19
|
+
for (var i = 0; i < props.length; i++) {
|
|
20
|
+
var descriptor = props[i];
|
|
21
|
+
descriptor.enumerable = descriptor.enumerable || false;
|
|
22
|
+
descriptor.configurable = true;
|
|
23
|
+
if ("value" in descriptor) descriptor.writable = true;
|
|
24
|
+
Object.defineProperty(target, descriptor.key, descriptor);
|
|
34
25
|
}
|
|
35
26
|
}
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
27
|
+
|
|
28
|
+
function _createClass(Constructor, protoProps, staticProps) {
|
|
29
|
+
if (protoProps) _defineProperties(Constructor.prototype, protoProps);
|
|
30
|
+
if (staticProps) _defineProperties(Constructor, staticProps);
|
|
31
|
+
Object.defineProperty(Constructor, "prototype", {
|
|
32
|
+
writable: false
|
|
33
|
+
});
|
|
34
|
+
return Constructor;
|
|
40
35
|
}
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
36
|
+
|
|
37
|
+
function _defineProperty(obj, key, value) {
|
|
38
|
+
if (key in obj) {
|
|
39
|
+
Object.defineProperty(obj, key, {
|
|
40
|
+
value: value,
|
|
41
|
+
enumerable: true,
|
|
42
|
+
configurable: true,
|
|
43
|
+
writable: true
|
|
44
|
+
});
|
|
45
|
+
} else {
|
|
46
|
+
obj[key] = value;
|
|
47
|
+
}
|
|
48
|
+
|
|
49
|
+
return obj;
|
|
48
50
|
}
|
|
51
|
+
|
|
49
52
|
function _extends() {
|
|
50
|
-
|
|
51
|
-
for (var
|
|
52
|
-
var
|
|
53
|
-
|
|
53
|
+
_extends = Object.assign ? Object.assign.bind() : function (target) {
|
|
54
|
+
for (var i = 1; i < arguments.length; i++) {
|
|
55
|
+
var source = arguments[i];
|
|
56
|
+
|
|
57
|
+
for (var key in source) {
|
|
58
|
+
if (Object.prototype.hasOwnProperty.call(source, key)) {
|
|
59
|
+
target[key] = source[key];
|
|
60
|
+
}
|
|
61
|
+
}
|
|
54
62
|
}
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
return _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf.bind() : function (t) {
|
|
60
|
-
return t.__proto__ || Object.getPrototypeOf(t);
|
|
61
|
-
}, _getPrototypeOf(t);
|
|
63
|
+
|
|
64
|
+
return target;
|
|
65
|
+
};
|
|
66
|
+
return _extends.apply(this, arguments);
|
|
62
67
|
}
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
68
|
+
|
|
69
|
+
function _inherits(subClass, superClass) {
|
|
70
|
+
if (typeof superClass !== "function" && superClass !== null) {
|
|
71
|
+
throw new TypeError("Super expression must either be null or a function");
|
|
72
|
+
}
|
|
73
|
+
|
|
74
|
+
subClass.prototype = Object.create(superClass && superClass.prototype, {
|
|
66
75
|
constructor: {
|
|
67
|
-
value:
|
|
68
|
-
writable:
|
|
69
|
-
configurable:
|
|
76
|
+
value: subClass,
|
|
77
|
+
writable: true,
|
|
78
|
+
configurable: true
|
|
70
79
|
}
|
|
71
|
-
})
|
|
72
|
-
|
|
73
|
-
|
|
80
|
+
});
|
|
81
|
+
Object.defineProperty(subClass, "prototype", {
|
|
82
|
+
writable: false
|
|
83
|
+
});
|
|
84
|
+
if (superClass) _setPrototypeOf(subClass, superClass);
|
|
85
|
+
}
|
|
86
|
+
|
|
87
|
+
function _getPrototypeOf(o) {
|
|
88
|
+
_getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf.bind() : function _getPrototypeOf(o) {
|
|
89
|
+
return o.__proto__ || Object.getPrototypeOf(o);
|
|
90
|
+
};
|
|
91
|
+
return _getPrototypeOf(o);
|
|
92
|
+
}
|
|
93
|
+
|
|
94
|
+
function _setPrototypeOf(o, p) {
|
|
95
|
+
_setPrototypeOf = Object.setPrototypeOf ? Object.setPrototypeOf.bind() : function _setPrototypeOf(o, p) {
|
|
96
|
+
o.__proto__ = p;
|
|
97
|
+
return o;
|
|
98
|
+
};
|
|
99
|
+
return _setPrototypeOf(o, p);
|
|
74
100
|
}
|
|
101
|
+
|
|
75
102
|
function _isNativeReflectConstruct() {
|
|
103
|
+
if (typeof Reflect === "undefined" || !Reflect.construct) return false;
|
|
104
|
+
if (Reflect.construct.sham) return false;
|
|
105
|
+
if (typeof Proxy === "function") return true;
|
|
106
|
+
|
|
76
107
|
try {
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
return
|
|
81
|
-
}
|
|
82
|
-
}
|
|
83
|
-
function _iterableToArray(r) {
|
|
84
|
-
if ("undefined" != typeof Symbol && null != r[Symbol.iterator] || null != r["@@iterator"]) return Array.from(r);
|
|
108
|
+
Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {}));
|
|
109
|
+
return true;
|
|
110
|
+
} catch (e) {
|
|
111
|
+
return false;
|
|
112
|
+
}
|
|
85
113
|
}
|
|
86
|
-
|
|
87
|
-
|
|
114
|
+
|
|
115
|
+
function _objectWithoutPropertiesLoose(source, excluded) {
|
|
116
|
+
if (source == null) return {};
|
|
117
|
+
var target = {};
|
|
118
|
+
var sourceKeys = Object.keys(source);
|
|
119
|
+
var key, i;
|
|
120
|
+
|
|
121
|
+
for (i = 0; i < sourceKeys.length; i++) {
|
|
122
|
+
key = sourceKeys[i];
|
|
123
|
+
if (excluded.indexOf(key) >= 0) continue;
|
|
124
|
+
target[key] = source[key];
|
|
125
|
+
}
|
|
126
|
+
|
|
127
|
+
return target;
|
|
88
128
|
}
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
|
|
129
|
+
|
|
130
|
+
function _objectWithoutProperties(source, excluded) {
|
|
131
|
+
if (source == null) return {};
|
|
132
|
+
|
|
133
|
+
var target = _objectWithoutPropertiesLoose(source, excluded);
|
|
134
|
+
|
|
135
|
+
var key, i;
|
|
136
|
+
|
|
94
137
|
if (Object.getOwnPropertySymbols) {
|
|
95
|
-
var
|
|
96
|
-
|
|
138
|
+
var sourceSymbolKeys = Object.getOwnPropertySymbols(source);
|
|
139
|
+
|
|
140
|
+
for (i = 0; i < sourceSymbolKeys.length; i++) {
|
|
141
|
+
key = sourceSymbolKeys[i];
|
|
142
|
+
if (excluded.indexOf(key) >= 0) continue;
|
|
143
|
+
if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue;
|
|
144
|
+
target[key] = source[key];
|
|
145
|
+
}
|
|
97
146
|
}
|
|
98
|
-
|
|
147
|
+
|
|
148
|
+
return target;
|
|
99
149
|
}
|
|
100
|
-
|
|
101
|
-
|
|
102
|
-
|
|
103
|
-
|
|
104
|
-
if (-1 !== e.indexOf(n)) continue;
|
|
105
|
-
t[n] = r[n];
|
|
150
|
+
|
|
151
|
+
function _assertThisInitialized(self) {
|
|
152
|
+
if (self === void 0) {
|
|
153
|
+
throw new ReferenceError("this hasn't been initialised - super() hasn't been called");
|
|
106
154
|
}
|
|
107
|
-
|
|
155
|
+
|
|
156
|
+
return self;
|
|
108
157
|
}
|
|
109
|
-
|
|
110
|
-
|
|
111
|
-
if (
|
|
112
|
-
|
|
158
|
+
|
|
159
|
+
function _possibleConstructorReturn(self, call) {
|
|
160
|
+
if (call && (typeof call === "object" || typeof call === "function")) {
|
|
161
|
+
return call;
|
|
162
|
+
} else if (call !== void 0) {
|
|
163
|
+
throw new TypeError("Derived constructors may only return object or undefined");
|
|
164
|
+
}
|
|
165
|
+
|
|
166
|
+
return _assertThisInitialized(self);
|
|
113
167
|
}
|
|
114
|
-
|
|
115
|
-
|
|
116
|
-
|
|
117
|
-
|
|
168
|
+
|
|
169
|
+
function _createSuper(Derived) {
|
|
170
|
+
var hasNativeReflectConstruct = _isNativeReflectConstruct();
|
|
171
|
+
|
|
172
|
+
return function _createSuperInternal() {
|
|
173
|
+
var Super = _getPrototypeOf(Derived),
|
|
174
|
+
result;
|
|
175
|
+
|
|
176
|
+
if (hasNativeReflectConstruct) {
|
|
177
|
+
var NewTarget = _getPrototypeOf(this).constructor;
|
|
178
|
+
|
|
179
|
+
result = Reflect.construct(Super, arguments, NewTarget);
|
|
180
|
+
} else {
|
|
181
|
+
result = Super.apply(this, arguments);
|
|
182
|
+
}
|
|
183
|
+
|
|
184
|
+
return _possibleConstructorReturn(this, result);
|
|
185
|
+
};
|
|
118
186
|
}
|
|
119
|
-
|
|
120
|
-
|
|
187
|
+
|
|
188
|
+
function _taggedTemplateLiteral(strings, raw) {
|
|
189
|
+
if (!raw) {
|
|
190
|
+
raw = strings.slice(0);
|
|
191
|
+
}
|
|
192
|
+
|
|
193
|
+
return Object.freeze(Object.defineProperties(strings, {
|
|
121
194
|
raw: {
|
|
122
|
-
value: Object.freeze(
|
|
195
|
+
value: Object.freeze(raw)
|
|
123
196
|
}
|
|
124
197
|
}));
|
|
125
198
|
}
|
|
126
|
-
|
|
127
|
-
|
|
199
|
+
|
|
200
|
+
function _toConsumableArray(arr) {
|
|
201
|
+
return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _unsupportedIterableToArray(arr) || _nonIterableSpread();
|
|
128
202
|
}
|
|
129
|
-
|
|
130
|
-
|
|
131
|
-
|
|
132
|
-
if (void 0 !== e) {
|
|
133
|
-
var i = e.call(t, r || "default");
|
|
134
|
-
if ("object" != typeof i) return i;
|
|
135
|
-
throw new TypeError("@@toPrimitive must return a primitive value.");
|
|
136
|
-
}
|
|
137
|
-
return ("string" === r ? String : Number)(t);
|
|
203
|
+
|
|
204
|
+
function _arrayWithoutHoles(arr) {
|
|
205
|
+
if (Array.isArray(arr)) return _arrayLikeToArray(arr);
|
|
138
206
|
}
|
|
139
|
-
|
|
140
|
-
|
|
141
|
-
|
|
207
|
+
|
|
208
|
+
function _iterableToArray(iter) {
|
|
209
|
+
if (typeof Symbol !== "undefined" && iter[Symbol.iterator] != null || iter["@@iterator"] != null) return Array.from(iter);
|
|
142
210
|
}
|
|
143
|
-
|
|
144
|
-
|
|
145
|
-
|
|
146
|
-
|
|
147
|
-
|
|
148
|
-
|
|
211
|
+
|
|
212
|
+
function _unsupportedIterableToArray(o, minLen) {
|
|
213
|
+
if (!o) return;
|
|
214
|
+
if (typeof o === "string") return _arrayLikeToArray(o, minLen);
|
|
215
|
+
var n = Object.prototype.toString.call(o).slice(8, -1);
|
|
216
|
+
if (n === "Object" && o.constructor) n = o.constructor.name;
|
|
217
|
+
if (n === "Map" || n === "Set") return Array.from(o);
|
|
218
|
+
if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen);
|
|
219
|
+
}
|
|
220
|
+
|
|
221
|
+
function _arrayLikeToArray(arr, len) {
|
|
222
|
+
if (len == null || len > arr.length) len = arr.length;
|
|
223
|
+
|
|
224
|
+
for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i];
|
|
225
|
+
|
|
226
|
+
return arr2;
|
|
227
|
+
}
|
|
228
|
+
|
|
229
|
+
function _nonIterableSpread() {
|
|
230
|
+
throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");
|
|
149
231
|
}
|
|
150
232
|
|
|
151
233
|
var interpretErrorMessage = function interpretErrorMessage(error) {
|
|
@@ -157,39 +239,50 @@
|
|
|
157
239
|
var LuxityPageReadyContext = /*#__PURE__*/React__default.createContext({
|
|
158
240
|
data: null
|
|
159
241
|
});
|
|
160
|
-
|
|
161
242
|
/**
|
|
162
243
|
* A flavour of PageReady with Luxity customisations
|
|
163
244
|
* 1. the onIsLoading callback is useful to parent components that have more complex data interactions
|
|
164
245
|
* 2. an error message interpreter is supplied from the local helper library
|
|
165
246
|
*/
|
|
247
|
+
|
|
166
248
|
var LuxityPageReady = /*#__PURE__*/function (_React$Component) {
|
|
249
|
+
_inherits(LuxityPageReady, _React$Component);
|
|
250
|
+
|
|
251
|
+
var _super = _createSuper(LuxityPageReady);
|
|
252
|
+
|
|
167
253
|
function LuxityPageReady() {
|
|
168
254
|
var _this;
|
|
255
|
+
|
|
169
256
|
_classCallCheck(this, LuxityPageReady);
|
|
257
|
+
|
|
170
258
|
for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
|
|
171
259
|
args[_key] = arguments[_key];
|
|
172
260
|
}
|
|
173
|
-
|
|
174
|
-
|
|
261
|
+
|
|
262
|
+
_this = _super.call.apply(_super, [this].concat(args));
|
|
263
|
+
|
|
264
|
+
_defineProperty(_assertThisInitialized(_this), "state", {
|
|
175
265
|
data: null
|
|
176
266
|
});
|
|
177
|
-
|
|
267
|
+
|
|
268
|
+
_defineProperty(_assertThisInitialized(_this), "refreshPage", function () {
|
|
178
269
|
return _this.pageReadyInstance.initRequest();
|
|
179
270
|
});
|
|
271
|
+
|
|
180
272
|
return _this;
|
|
181
273
|
}
|
|
182
|
-
|
|
183
|
-
|
|
274
|
+
|
|
275
|
+
_createClass(LuxityPageReady, [{
|
|
184
276
|
key: "render",
|
|
185
277
|
value: function render() {
|
|
186
278
|
var _this2 = this;
|
|
279
|
+
|
|
187
280
|
var _this$props = this.props,
|
|
188
|
-
|
|
189
|
-
|
|
190
|
-
|
|
191
|
-
|
|
192
|
-
|
|
281
|
+
customErrorMessage = _this$props.customErrorMessage,
|
|
282
|
+
customErrorHandler = _this$props.customErrorHandler,
|
|
283
|
+
getRequestPromise = _this$props.getRequestPromise,
|
|
284
|
+
_onData = _this$props.onData,
|
|
285
|
+
children = _this$props.children;
|
|
193
286
|
var data = this.state.data;
|
|
194
287
|
return /*#__PURE__*/React__default.createElement(PageReady, {
|
|
195
288
|
ref: function ref(inst) {
|
|
@@ -199,15 +292,19 @@
|
|
|
199
292
|
_this2.setState({
|
|
200
293
|
data: res.data
|
|
201
294
|
});
|
|
295
|
+
|
|
202
296
|
_onData(res);
|
|
203
297
|
},
|
|
204
298
|
getRequestInstance: function getRequestInstance() {
|
|
205
299
|
_this2.props.onIsLoading(true);
|
|
300
|
+
|
|
206
301
|
return getRequestPromise().then(function (out) {
|
|
207
302
|
_this2.props.onIsLoading(false);
|
|
303
|
+
|
|
208
304
|
return out;
|
|
209
305
|
}).catch(function (oops) {
|
|
210
306
|
_this2.props.onIsLoading(false);
|
|
307
|
+
|
|
211
308
|
return oops;
|
|
212
309
|
});
|
|
213
310
|
},
|
|
@@ -224,7 +321,10 @@
|
|
|
224
321
|
}, children));
|
|
225
322
|
}
|
|
226
323
|
}]);
|
|
324
|
+
|
|
325
|
+
return LuxityPageReady;
|
|
227
326
|
}(React__default.Component);
|
|
327
|
+
|
|
228
328
|
LuxityPageReady.defaultProps = {
|
|
229
329
|
onIsLoading: function onIsLoading() {
|
|
230
330
|
return null;
|
|
@@ -307,6 +407,7 @@
|
|
|
307
407
|
});
|
|
308
408
|
|
|
309
409
|
var _excluded = ["children"];
|
|
410
|
+
|
|
310
411
|
var _templateObject$1;
|
|
311
412
|
var Button = styled__default.button(_templateObject$1 || (_templateObject$1 = _taggedTemplateLiteral(["\n ", ";\n background-color: transparent;\n color: ", ";\n &:hover {\n color: ", ";\n }\n &:disabled {\n ", ";\n color: ", ";\n }\n"])), baseButtonStyle, function (props) {
|
|
312
413
|
return props.theme.colors.base;
|
|
@@ -315,17 +416,21 @@
|
|
|
315
416
|
}, disabledButtonStyle, function (props) {
|
|
316
417
|
return props.theme.colors.base;
|
|
317
418
|
});
|
|
419
|
+
|
|
318
420
|
var TextButton = function TextButton(_ref) {
|
|
319
421
|
var children = _ref.children,
|
|
320
|
-
|
|
422
|
+
restProps = _objectWithoutProperties(_ref, _excluded);
|
|
423
|
+
|
|
321
424
|
return /*#__PURE__*/React__default.createElement(Button, restProps, children);
|
|
322
425
|
};
|
|
426
|
+
|
|
323
427
|
TextButton.defaultProps = {
|
|
324
428
|
type: 'button'
|
|
325
429
|
};
|
|
326
430
|
var TextButton$1 = themed(TextButton);
|
|
327
431
|
|
|
328
432
|
var _excluded$1 = ["children"];
|
|
433
|
+
|
|
329
434
|
var _templateObject$2;
|
|
330
435
|
var Button$1 = styled__default(TextButton$1)(_templateObject$2 || (_templateObject$2 = _taggedTemplateLiteral(["\n color: ", ";\n background-color: ", ";\n &:hover {\n color: ", ";\n background-color: ", ";\n }\n &:disabled {\n background-color: ", ";\n color: ", ";\n }\n"])), function (props) {
|
|
331
436
|
return props.theme.colors.ntrlMin;
|
|
@@ -340,11 +445,14 @@
|
|
|
340
445
|
}, function (props) {
|
|
341
446
|
return props.theme.colors.primary;
|
|
342
447
|
});
|
|
448
|
+
|
|
343
449
|
var InvertedTextButton = function InvertedTextButton(_ref) {
|
|
344
450
|
var children = _ref.children,
|
|
345
|
-
|
|
451
|
+
restProps = _objectWithoutProperties(_ref, _excluded$1);
|
|
452
|
+
|
|
346
453
|
return /*#__PURE__*/React__default.createElement(Button$1, restProps, children);
|
|
347
454
|
};
|
|
455
|
+
|
|
348
456
|
var InvertedTextButton$1 = themed(InvertedTextButton);
|
|
349
457
|
|
|
350
458
|
var media = {
|
|
@@ -393,49 +501,65 @@
|
|
|
393
501
|
}, function (props) {
|
|
394
502
|
return props.theme.colors.ntrlMin;
|
|
395
503
|
});
|
|
396
|
-
|
|
397
504
|
/**
|
|
398
505
|
* Multiselector with a GraphQL flavour (TODO: to be revised to make it remote api agnostic)
|
|
399
506
|
*/
|
|
507
|
+
|
|
400
508
|
var GraphQLMultiSelector = /*#__PURE__*/function (_React$Component) {
|
|
509
|
+
_inherits(GraphQLMultiSelector, _React$Component);
|
|
510
|
+
|
|
511
|
+
var _super = _createSuper(GraphQLMultiSelector);
|
|
512
|
+
|
|
401
513
|
function GraphQLMultiSelector(props) {
|
|
402
514
|
var _this;
|
|
515
|
+
|
|
403
516
|
_classCallCheck(this, GraphQLMultiSelector);
|
|
404
|
-
|
|
405
|
-
|
|
517
|
+
|
|
518
|
+
_this = _super.call(this, props);
|
|
519
|
+
|
|
520
|
+
_defineProperty(_assertThisInitialized(_this), "componentDidUpdate", function (prevProps) {
|
|
406
521
|
if (prevProps.graphQuery !== _this.props.graphQuery) {
|
|
407
522
|
_this.makeRequest();
|
|
408
523
|
}
|
|
409
524
|
});
|
|
410
|
-
|
|
525
|
+
|
|
526
|
+
_defineProperty(_assertThisInitialized(_this), "makeRequest", function () {
|
|
411
527
|
_this.pageReady.refreshPage();
|
|
412
528
|
});
|
|
413
|
-
|
|
529
|
+
|
|
530
|
+
_defineProperty(_assertThisInitialized(_this), "emptySelected", function () {
|
|
414
531
|
return _this.setState({
|
|
415
532
|
selected: [ALL_ITEM]
|
|
416
533
|
});
|
|
417
534
|
});
|
|
418
|
-
|
|
535
|
+
|
|
536
|
+
_defineProperty(_assertThisInitialized(_this), "setNewResults", function (res) {
|
|
419
537
|
var selectedIds = _this.state.selected.map(function (sel) {
|
|
420
538
|
return sel.id;
|
|
421
539
|
});
|
|
540
|
+
|
|
422
541
|
var pagination = _this.props.resultProcessor(res);
|
|
542
|
+
|
|
423
543
|
var allSelected = _this.state.selected.some(function (item) {
|
|
424
544
|
return item.id === ALL_ITEM.id;
|
|
425
545
|
});
|
|
546
|
+
|
|
426
547
|
var newList = pagination.data.filter(function (newItem) {
|
|
427
548
|
return !selectedIds.includes(newItem.id);
|
|
428
549
|
});
|
|
429
550
|
newList = allSelected ? newList : [ALL_ITEM].concat(_toConsumableArray(newList));
|
|
551
|
+
|
|
430
552
|
_this.setState({
|
|
431
553
|
list: newList,
|
|
432
554
|
pagination: pagination
|
|
433
555
|
});
|
|
434
556
|
});
|
|
435
|
-
|
|
557
|
+
|
|
558
|
+
_defineProperty(_assertThisInitialized(_this), "onAddItem", function (addSelectedItem) {
|
|
436
559
|
_this.setState(function (prevState) {
|
|
437
560
|
var newSelectedList;
|
|
438
561
|
var newList;
|
|
562
|
+
|
|
439
563
|
if (addSelectedItem.id === ALL_ITEM.id) {
|
|
440
564
|
// Clear Selected List
|
|
441
565
|
// and move previous Selected items to list
|
|
@@ -455,6 +579,7 @@
|
|
|
455
579
|
return item.id !== addSelectedItem.id;
|
|
456
580
|
})));
|
|
457
581
|
}
|
|
582
|
+
|
|
458
583
|
return {
|
|
459
584
|
selected: newSelectedList,
|
|
460
585
|
list: newList
|
|
@@ -465,20 +590,24 @@
|
|
|
465
590
|
}));
|
|
466
591
|
});
|
|
467
592
|
});
|
|
468
|
-
|
|
593
|
+
|
|
594
|
+
_defineProperty(_assertThisInitialized(_this), "onRemoveItem", function (removeSelectedItem) {
|
|
469
595
|
_this.setState(function (prevState) {
|
|
470
596
|
// Cannot remove ALL from selection by unselecting it
|
|
471
597
|
if ((removeSelectedItem === null || removeSelectedItem === void 0 ? void 0 : removeSelectedItem.id) === ALL_ITEM.id) {
|
|
472
598
|
return {};
|
|
473
599
|
}
|
|
600
|
+
|
|
474
601
|
var newSelectedList = prevState.selected.filter(function (item) {
|
|
475
602
|
return item.id !== removeSelectedItem.id;
|
|
476
603
|
});
|
|
604
|
+
|
|
477
605
|
var newList = _toConsumableArray(prevState.list).concat(removeSelectedItem).filter(function (item) {
|
|
478
606
|
return item.id !== ALL_ITEM.id;
|
|
479
607
|
}).sort(function (a, b) {
|
|
480
608
|
return a.id - b.id;
|
|
481
609
|
});
|
|
610
|
+
|
|
482
611
|
return {
|
|
483
612
|
list: newList,
|
|
484
613
|
selected: newSelectedList.length ? newSelectedList : [ALL_ITEM]
|
|
@@ -489,23 +618,25 @@
|
|
|
489
618
|
}));
|
|
490
619
|
});
|
|
491
620
|
});
|
|
492
|
-
|
|
621
|
+
|
|
622
|
+
_defineProperty(_assertThisInitialized(_this), "onIsLoading", function (flag) {
|
|
493
623
|
_this.setState({
|
|
494
624
|
isLoading: flag
|
|
495
625
|
});
|
|
496
626
|
});
|
|
497
|
-
|
|
627
|
+
|
|
628
|
+
_defineProperty(_assertThisInitialized(_this), "render", function () {
|
|
498
629
|
var _this$props = _this.props,
|
|
499
|
-
|
|
500
|
-
|
|
501
|
-
|
|
502
|
-
|
|
503
|
-
|
|
630
|
+
baseClass = _this$props.baseClass,
|
|
631
|
+
ItemRenderer = _this$props.itemRenderer,
|
|
632
|
+
identifier = _this$props.identifier,
|
|
633
|
+
triggerRequest = _this$props.triggerRequest,
|
|
634
|
+
className = _this$props.className;
|
|
504
635
|
var _this$state = _this.state,
|
|
505
|
-
|
|
506
|
-
|
|
507
|
-
|
|
508
|
-
|
|
636
|
+
list = _this$state.list,
|
|
637
|
+
selected = _this$state.selected,
|
|
638
|
+
pagination = _this$state.pagination,
|
|
639
|
+
isLoading = _this$state.isLoading;
|
|
509
640
|
return /*#__PURE__*/React__default.createElement(StyledMultiselector, null, /*#__PURE__*/React__default.createElement("div", {
|
|
510
641
|
"data-qe-id": identifier,
|
|
511
642
|
className: "".concat(className, " ").concat(baseClass)
|
|
@@ -544,6 +675,7 @@
|
|
|
544
675
|
type: "button"
|
|
545
676
|
}, "SHOW MORE"))));
|
|
546
677
|
});
|
|
678
|
+
|
|
547
679
|
_this.state = {
|
|
548
680
|
selected: [ALL_ITEM],
|
|
549
681
|
list: [],
|
|
@@ -552,9 +684,10 @@
|
|
|
552
684
|
};
|
|
553
685
|
return _this;
|
|
554
686
|
}
|
|
555
|
-
|
|
687
|
+
|
|
556
688
|
return _createClass(GraphQLMultiSelector);
|
|
557
689
|
}(React__default.Component);
|
|
690
|
+
|
|
558
691
|
GraphQLMultiSelector.defaultProps = {
|
|
559
692
|
baseClass: 'multiselector'
|
|
560
693
|
};
|
|
@@ -587,22 +720,24 @@
|
|
|
587
720
|
}, function (props) {
|
|
588
721
|
return props.theme.marginPaddings[3];
|
|
589
722
|
});
|
|
723
|
+
|
|
590
724
|
var InterestsSubheading = function InterestsSubheading(_ref) {
|
|
591
725
|
var title = _ref.title,
|
|
592
|
-
|
|
593
|
-
|
|
726
|
+
children = _ref.children,
|
|
727
|
+
className = _ref.className;
|
|
594
728
|
return /*#__PURE__*/React__default.createElement(InterestsSubheadingContainer, {
|
|
595
729
|
className: className
|
|
596
730
|
}, /*#__PURE__*/React__default.createElement(Title, null, title), /*#__PURE__*/React__default.createElement("div", null, children));
|
|
597
731
|
};
|
|
598
732
|
|
|
599
733
|
var _templateObject$5;
|
|
734
|
+
|
|
600
735
|
var Title$1 = function Title(_ref) {
|
|
601
736
|
var baseClass = _ref.baseClass,
|
|
602
|
-
|
|
603
|
-
|
|
604
|
-
|
|
605
|
-
|
|
737
|
+
className = _ref.className,
|
|
738
|
+
title = _ref.title,
|
|
739
|
+
searchPlaceHolder = _ref.searchPlaceHolder,
|
|
740
|
+
onSearchChanged = _ref.onSearchChanged;
|
|
606
741
|
return /*#__PURE__*/React__default.createElement(InterestsSubheading, {
|
|
607
742
|
className: "".concat(className, " ").concat(baseClass, "__title"),
|
|
608
743
|
title: title
|
|
@@ -615,6 +750,7 @@
|
|
|
615
750
|
onChange: onSearchChanged
|
|
616
751
|
})));
|
|
617
752
|
};
|
|
753
|
+
|
|
618
754
|
var StyledTitle = styled__default(Title$1)(_templateObject$5 || (_templateObject$5 = _taggedTemplateLiteral(["\n margin-bottom: ", ";\n font-weight: bold;\n display: flex;\n align-items: center;\n font-size: ", ";\n\n .title__search,\n .title__search {\n display: flex;\n justify-content: center;\n align-items: center;\n min-height: 30px;\n margin-bottom: ", ";\n\n svg {\n margin-left: ", ";\n fill: ", ";\n stroke: ", ";\n }\n\n input {\n width: 140px;\n border: none;\n font-size: ", ";\n transition: 0.2s border-color ease-in-out;\n margin-left: ", ";\n padding: 0;\n\n :focus {\n border-color: ", ";\n border-bottom: none;\n }\n }\n }\n"])), function (props) {
|
|
619
755
|
return props.theme.marginPaddings[2];
|
|
620
756
|
}, function (props) {
|
|
@@ -637,26 +773,37 @@
|
|
|
637
773
|
var Title$2 = themed(StyledTitle);
|
|
638
774
|
|
|
639
775
|
var debounceBuilder = functions.debounced(200);
|
|
776
|
+
|
|
640
777
|
/**
|
|
641
778
|
* Luxity flavoured GraphQLMultiselector with text Search, category and limit controls
|
|
642
779
|
*/
|
|
643
780
|
var LuxityGraphQLMultiselector = /*#__PURE__*/function (_React$Component) {
|
|
781
|
+
_inherits(LuxityGraphQLMultiselector, _React$Component);
|
|
782
|
+
|
|
783
|
+
var _super = _createSuper(LuxityGraphQLMultiselector);
|
|
784
|
+
|
|
644
785
|
function LuxityGraphQLMultiselector(props) {
|
|
645
786
|
var _this;
|
|
787
|
+
|
|
646
788
|
_classCallCheck(this, LuxityGraphQLMultiselector);
|
|
647
|
-
|
|
648
|
-
|
|
649
|
-
|
|
789
|
+
|
|
790
|
+
_this = _super.call(this, props);
|
|
791
|
+
|
|
792
|
+
_defineProperty(_assertThisInitialized(_this), "multiSelectorRef", /*#__PURE__*/React__default.createRef());
|
|
793
|
+
|
|
794
|
+
_defineProperty(_assertThisInitialized(_this), "increaseLimit", function () {
|
|
650
795
|
_this.setState(function (prevState) {
|
|
651
796
|
return {
|
|
652
797
|
limit: prevState.limit + _this.props.queryLimitIncrement
|
|
653
798
|
};
|
|
654
799
|
});
|
|
655
800
|
});
|
|
656
|
-
|
|
801
|
+
|
|
802
|
+
_defineProperty(_assertThisInitialized(_this), "onChange", function (selection) {
|
|
657
803
|
_this.props.onChange(selection);
|
|
658
804
|
});
|
|
659
|
-
|
|
805
|
+
|
|
806
|
+
_defineProperty(_assertThisInitialized(_this), "onSearchChanged", function (event) {
|
|
660
807
|
event.preventDefault();
|
|
661
808
|
var searchText = event.target.value;
|
|
662
809
|
debounceBuilder(function () {
|
|
@@ -665,21 +812,22 @@
|
|
|
665
812
|
});
|
|
666
813
|
});
|
|
667
814
|
});
|
|
668
|
-
|
|
815
|
+
|
|
816
|
+
_defineProperty(_assertThisInitialized(_this), "render", function () {
|
|
669
817
|
var _this$state = _this.state,
|
|
670
|
-
|
|
671
|
-
|
|
672
|
-
|
|
818
|
+
limit = _this$state.limit,
|
|
819
|
+
category = _this$state.category,
|
|
820
|
+
nameFilter = _this$state.nameFilter;
|
|
673
821
|
var _this$props = _this.props,
|
|
674
|
-
|
|
675
|
-
|
|
676
|
-
|
|
677
|
-
|
|
678
|
-
|
|
679
|
-
|
|
680
|
-
|
|
681
|
-
|
|
682
|
-
|
|
822
|
+
title = _this$props.title,
|
|
823
|
+
baseClass = _this$props.baseClass,
|
|
824
|
+
getGraphQuery = _this$props.getGraphQuery,
|
|
825
|
+
resultProcessor = _this$props.resultProcessor,
|
|
826
|
+
itemRenderer = _this$props.itemRenderer,
|
|
827
|
+
searchPlaceHolder = _this$props.searchPlaceHolder,
|
|
828
|
+
graphApi = _this$props.graphApi,
|
|
829
|
+
identifier = _this$props.identifier,
|
|
830
|
+
requestInstance = _this$props.requestInstance;
|
|
683
831
|
return /*#__PURE__*/React__default.createElement("div", {
|
|
684
832
|
className: baseClass
|
|
685
833
|
}, /*#__PURE__*/React__default.createElement(Title$2, {
|
|
@@ -702,6 +850,7 @@
|
|
|
702
850
|
itemRenderer: itemRenderer
|
|
703
851
|
})));
|
|
704
852
|
});
|
|
853
|
+
|
|
705
854
|
_this.state = {
|
|
706
855
|
limit: props.baseQueryLimit,
|
|
707
856
|
category: props.category,
|
|
@@ -709,11 +858,12 @@
|
|
|
709
858
|
};
|
|
710
859
|
return _this;
|
|
711
860
|
}
|
|
712
|
-
|
|
713
|
-
|
|
861
|
+
|
|
862
|
+
_createClass(LuxityGraphQLMultiselector, [{
|
|
714
863
|
key: "componentDidUpdate",
|
|
715
864
|
value: function componentDidUpdate(prevProps) {
|
|
716
865
|
var _this$multiSelectorRe;
|
|
866
|
+
|
|
717
867
|
if (prevProps.category !== this.props.category && (_this$multiSelectorRe = this.multiSelectorRef) !== null && _this$multiSelectorRe !== void 0 && _this$multiSelectorRe.current) {
|
|
718
868
|
this.multiSelectorRef.current.emptySelected();
|
|
719
869
|
}
|
|
@@ -726,10 +876,14 @@
|
|
|
726
876
|
category: props.category
|
|
727
877
|
};
|
|
728
878
|
}
|
|
879
|
+
|
|
729
880
|
return null;
|
|
730
881
|
}
|
|
731
882
|
}]);
|
|
883
|
+
|
|
884
|
+
return LuxityGraphQLMultiselector;
|
|
732
885
|
}(React__default.Component);
|
|
886
|
+
|
|
733
887
|
LuxityGraphQLMultiselector.defaultProps = {
|
|
734
888
|
baseClass: '',
|
|
735
889
|
searchPlaceHolder: '',
|
|
@@ -738,17 +892,21 @@
|
|
|
738
892
|
};
|
|
739
893
|
|
|
740
894
|
var _excluded$2 = ["children"];
|
|
895
|
+
|
|
741
896
|
var _templateObject$6;
|
|
742
897
|
var Button$2 = styled__default.button(_templateObject$6 || (_templateObject$6 = _taggedTemplateLiteral(["\n ", ";\n background-color: #fff;\n color: ", ";\n border: 1px solid ", ";\n\n &:disabled {\n ", "\n }\n"])), baseButtonStyle, function (props) {
|
|
743
898
|
return props.theme.colors.primary;
|
|
744
899
|
}, function (props) {
|
|
745
900
|
return props.theme.colors.primary;
|
|
746
901
|
}, disabledButtonStyle);
|
|
902
|
+
|
|
747
903
|
var PrimaryButton = function PrimaryButton(_ref) {
|
|
748
904
|
var children = _ref.children,
|
|
749
|
-
|
|
905
|
+
restProps = _objectWithoutProperties(_ref, _excluded$2);
|
|
906
|
+
|
|
750
907
|
return /*#__PURE__*/React__default.createElement(Button$2, restProps, children);
|
|
751
908
|
};
|
|
909
|
+
|
|
752
910
|
var PrimaryButton$1 = themed(PrimaryButton);
|
|
753
911
|
|
|
754
912
|
var _templateObject$7;
|
|
@@ -764,10 +922,11 @@
|
|
|
764
922
|
return props.theme.colors.ntrlMin;
|
|
765
923
|
});
|
|
766
924
|
var UnselectedButton = themed(BaseButton);
|
|
925
|
+
|
|
767
926
|
var ItemRenderer = function ItemRenderer(_ref) {
|
|
768
927
|
var item = _ref.item,
|
|
769
|
-
|
|
770
|
-
|
|
928
|
+
onSelect = _ref.onSelect,
|
|
929
|
+
selected = _ref.selected;
|
|
771
930
|
var props = {
|
|
772
931
|
onClick: function onClick(e) {
|
|
773
932
|
e.preventDefault();
|
|
@@ -779,12 +938,12 @@
|
|
|
779
938
|
|
|
780
939
|
var BrandSelector = function BrandSelector(_ref) {
|
|
781
940
|
var onChange = _ref.onChange,
|
|
782
|
-
|
|
783
|
-
|
|
784
|
-
|
|
785
|
-
|
|
786
|
-
|
|
787
|
-
|
|
941
|
+
category = _ref.category,
|
|
942
|
+
graphApi = _ref.graphApi,
|
|
943
|
+
itemRenderer = _ref.itemRenderer,
|
|
944
|
+
getGraphQuery = _ref.getGraphQuery,
|
|
945
|
+
resultProcessor = _ref.resultProcessor,
|
|
946
|
+
requestInstance = _ref.requestInstance;
|
|
788
947
|
return /*#__PURE__*/React__default.createElement(LuxityGraphQLMultiselector, {
|
|
789
948
|
baseQueryLimit: 16,
|
|
790
949
|
title: "Brands",
|
|
@@ -801,6 +960,7 @@
|
|
|
801
960
|
requestInstance: requestInstance
|
|
802
961
|
});
|
|
803
962
|
};
|
|
963
|
+
|
|
804
964
|
BrandSelector.defaultProps = {
|
|
805
965
|
itemRenderer: ItemRenderer,
|
|
806
966
|
resultProcessor: function resultProcessor(result) {
|