@bonlineza/luxity-lib 2.39.6 → 2.39.7

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 (92) hide show
  1. package/Accordion.js +352 -342
  2. package/AddInterest.js +3141 -3135
  3. package/AddProductInterest.js +7584 -1011
  4. package/BrandSelector.js +861 -854
  5. package/Checkbox.js +250 -240
  6. package/CheckboxButton.js +236 -229
  7. package/CommunicationPreferenceOptionsRenderer.js +568 -560
  8. package/CommunicationPreferenceSection.js +659 -651
  9. package/CommunicationPreferences.js +2402 -2394
  10. package/ConditionSelector.js +859 -852
  11. package/CountryCodeSelect.js +6650 -79
  12. package/CurrencyInputFormatter.js +96 -86
  13. package/CurrencySelect.js +227 -219
  14. package/DropdownSelector.js +6820 -211
  15. package/GALink.js +51 -43
  16. package/GenderSelector.js +362 -355
  17. package/GraphQLDropdownSelector.js +11878 -5308
  18. package/GraphQLMultiSelector.js +601 -593
  19. package/IconHeader.js +126 -118
  20. package/IconWrapper.js +25 -17
  21. package/InterestCatSelector.js +432 -424
  22. package/InterestItem.js +470 -462
  23. package/Interests.js +11286 -4716
  24. package/InterestsSubheading.js +41 -33
  25. package/InvertedTextButton.js +175 -167
  26. package/LuxityAppSideNav.js +189 -181
  27. package/LuxityDesktopHeader.js +1363 -1355
  28. package/LuxityFooter.js +2236 -2228
  29. package/LuxityGraphQLDropdownSelector.js +11963 -5393
  30. package/LuxityGraphQLMultiselector.js +785 -778
  31. package/LuxityMobileHeader.js +1794 -1786
  32. package/LuxityPageReady.js +209 -199
  33. package/LuxityProductInterestItem.js +367 -359
  34. package/LuxitySideNav.js +673 -665
  35. package/MaterialSelector.js +11993 -5423
  36. package/ModelSelector.js +11993 -5423
  37. package/NotificationDropDown.js +7029 -459
  38. package/Notify.js +32 -20
  39. package/OutlinePrimaryButton.js +142 -134
  40. package/PriceRangeSelector.js +1270 -1264
  41. package/PrimaryButton.js +137 -129
  42. package/RadioButtons.js +318 -308
  43. package/RangeSlider.js +1039 -1033
  44. package/RareStepFooter.js +264 -257
  45. package/RareStepHeader.js +808 -801
  46. package/ReactSelectWrapper.js +6604 -33
  47. package/SecondaryButton.js +152 -144
  48. package/ShoeSizeRangeSelector.js +1153 -1147
  49. package/ShoeSizeSelector.js +1154 -1146
  50. package/SimpleErrorBoundary.js +138 -130
  51. package/StyleSelector.js +861 -854
  52. package/TextButton.js +143 -135
  53. package/Tooltip.js +184 -176
  54. package/Tracking.js +25 -15
  55. package/WrapperButton.js +58 -50
  56. package/build/bundle.css +1 -1
  57. package/build/bundle.js +17236 -10632
  58. package/build/constants.js +45 -32
  59. package/package.json +2 -2
  60. package/svg/Accessories.js +42 -34
  61. package/svg/Account.js +38 -30
  62. package/svg/Add.js +39 -31
  63. package/svg/ArrowRight.js +36 -28
  64. package/svg/Bags.js +48 -40
  65. package/svg/BurgerMenu.js +32 -24
  66. package/svg/Calendar.js +106 -98
  67. package/svg/CalendarCircled.js +108 -100
  68. package/svg/CheckCircled.js +40 -32
  69. package/svg/Close.js +37 -29
  70. package/svg/Clothing.js +44 -36
  71. package/svg/Dot.js +40 -32
  72. package/svg/Edit.js +35 -27
  73. package/svg/Eye.js +36 -28
  74. package/svg/FileAttach.js +36 -28
  75. package/svg/FileAttachCircled.js +38 -30
  76. package/svg/Jewellery.js +57 -49
  77. package/svg/LightBulb.js +66 -58
  78. package/svg/Logo.js +140 -132
  79. package/svg/LuxityMenu.js +36 -28
  80. package/svg/Minus.js +37 -29
  81. package/svg/MobileAvatar.js +36 -28
  82. package/svg/MyOrder.js +44 -36
  83. package/svg/MyPayment.js +44 -36
  84. package/svg/MyProfile.js +52 -44
  85. package/svg/MySale.js +39 -31
  86. package/svg/Notification.js +38 -30
  87. package/svg/PointerDown.js +36 -28
  88. package/svg/Search.js +35 -27
  89. package/svg/Shoes.js +45 -37
  90. package/svg/SvgWrapper.js +21 -13
  91. package/svg/Trash.js +40 -32
  92. package/svg/Watches.js +55 -47
package/Accordion.js CHANGED
@@ -1,380 +1,390 @@
1
- import React, { forwardRef, useState } from 'react';
2
- import AnimateHeight from 'react-animate-height';
3
- import styled, { ThemeProvider } from 'styled-components';
4
-
5
- function _extends() {
6
- _extends = Object.assign ? Object.assign.bind() : function (target) {
7
- for (var i = 1; i < arguments.length; i++) {
8
- var source = arguments[i];
9
-
10
- for (var key in source) {
11
- if (Object.prototype.hasOwnProperty.call(source, key)) {
12
- target[key] = source[key];
1
+ (function (global, factory) {
2
+ typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('react'), require('react-animate-height'), require('styled-components')) :
3
+ typeof define === 'function' && define.amd ? define(['exports', 'react', 'react-animate-height', 'styled-components'], factory) :
4
+ (global = global || self, factory(global.Accordion = {}, global.React, global.AnimateHeight, global.styled));
5
+ }(this, (function (exports, React, AnimateHeight, styled) { 'use strict';
6
+
7
+ var React__default = 'default' in React ? React['default'] : React;
8
+ AnimateHeight = AnimateHeight && Object.prototype.hasOwnProperty.call(AnimateHeight, 'default') ? AnimateHeight['default'] : AnimateHeight;
9
+ var styled__default = 'default' in styled ? styled['default'] : styled;
10
+
11
+ function _extends() {
12
+ _extends = Object.assign ? Object.assign.bind() : function (target) {
13
+ for (var i = 1; i < arguments.length; i++) {
14
+ var source = arguments[i];
15
+
16
+ for (var key in source) {
17
+ if (Object.prototype.hasOwnProperty.call(source, key)) {
18
+ target[key] = source[key];
19
+ }
13
20
  }
14
21
  }
15
- }
16
-
17
- return target;
18
- };
19
- return _extends.apply(this, arguments);
20
- }
21
22
 
22
- function _taggedTemplateLiteral(strings, raw) {
23
- if (!raw) {
24
- raw = strings.slice(0);
23
+ return target;
24
+ };
25
+ return _extends.apply(this, arguments);
25
26
  }
26
27
 
27
- return Object.freeze(Object.defineProperties(strings, {
28
- raw: {
29
- value: Object.freeze(raw)
28
+ function _taggedTemplateLiteral(strings, raw) {
29
+ if (!raw) {
30
+ raw = strings.slice(0);
30
31
  }
31
- }));
32
- }
33
32
 
34
- function _slicedToArray(arr, i) {
35
- return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest();
36
- }
33
+ return Object.freeze(Object.defineProperties(strings, {
34
+ raw: {
35
+ value: Object.freeze(raw)
36
+ }
37
+ }));
38
+ }
37
39
 
38
- function _arrayWithHoles(arr) {
39
- if (Array.isArray(arr)) return arr;
40
- }
40
+ function _slicedToArray(arr, i) {
41
+ return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest();
42
+ }
41
43
 
42
- function _iterableToArrayLimit(arr, i) {
43
- var _i = arr == null ? null : typeof Symbol !== "undefined" && arr[Symbol.iterator] || arr["@@iterator"];
44
+ function _arrayWithHoles(arr) {
45
+ if (Array.isArray(arr)) return arr;
46
+ }
44
47
 
45
- if (_i == null) return;
46
- var _arr = [];
47
- var _n = true;
48
- var _d = false;
48
+ function _iterableToArrayLimit(arr, i) {
49
+ var _i = arr == null ? null : typeof Symbol !== "undefined" && arr[Symbol.iterator] || arr["@@iterator"];
49
50
 
50
- var _s, _e;
51
+ if (_i == null) return;
52
+ var _arr = [];
53
+ var _n = true;
54
+ var _d = false;
51
55
 
52
- try {
53
- for (_i = _i.call(arr); !(_n = (_s = _i.next()).done); _n = true) {
54
- _arr.push(_s.value);
56
+ var _s, _e;
55
57
 
56
- if (i && _arr.length === i) break;
57
- }
58
- } catch (err) {
59
- _d = true;
60
- _e = err;
61
- } finally {
62
58
  try {
63
- if (!_n && _i["return"] != null) _i["return"]();
59
+ for (_i = _i.call(arr); !(_n = (_s = _i.next()).done); _n = true) {
60
+ _arr.push(_s.value);
61
+
62
+ if (i && _arr.length === i) break;
63
+ }
64
+ } catch (err) {
65
+ _d = true;
66
+ _e = err;
64
67
  } finally {
65
- if (_d) throw _e;
68
+ try {
69
+ if (!_n && _i["return"] != null) _i["return"]();
70
+ } finally {
71
+ if (_d) throw _e;
72
+ }
66
73
  }
74
+
75
+ return _arr;
67
76
  }
68
77
 
69
- return _arr;
70
- }
71
-
72
- function _unsupportedIterableToArray(o, minLen) {
73
- if (!o) return;
74
- if (typeof o === "string") return _arrayLikeToArray(o, minLen);
75
- var n = Object.prototype.toString.call(o).slice(8, -1);
76
- if (n === "Object" && o.constructor) n = o.constructor.name;
77
- if (n === "Map" || n === "Set") return Array.from(o);
78
- if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen);
79
- }
80
-
81
- function _arrayLikeToArray(arr, len) {
82
- if (len == null || len > arr.length) len = arr.length;
83
-
84
- for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i];
85
-
86
- return arr2;
87
- }
88
-
89
- function _nonIterableRest() {
90
- throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");
91
- }
92
-
93
- var _templateObject;
94
- var OuterContainer = styled.div(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n border: 1px solid ", ";\n"])), function (props) {
95
- return props.theme.colors.borderColor;
96
- });
97
-
98
- var _templateObject$1;
99
- var ToggleButton = styled.div(_templateObject$1 || (_templateObject$1 = _taggedTemplateLiteral(["\n padding-left: 3rem;\n padding-right: 3rem;\n display: flex;\n align-items: center;\n min-height: 70px;\n height: 70px;\n cursor: pointer;\n outline: none;\n"])));
100
-
101
- var _templateObject$2;
102
- var Title = styled.div(_templateObject$2 || (_templateObject$2 = _taggedTemplateLiteral(["\n font-size: ", ";\n font-weight: bold;\n flex-grow: 1;\n color: ", ";\n"])), function (props) {
103
- return props.theme.fontSizes[2];
104
- }, function (props) {
105
- return props.theme.colors.primary || '';
106
- });
107
-
108
- var _templateObject$3;
109
- var BodyContent = styled.div(_templateObject$3 || (_templateObject$3 = _taggedTemplateLiteral(["\n margin-bottom: ", ";\n"])), function (props) {
110
- return props.theme.marginPaddings[5];
111
- });
112
-
113
- var _templateObject$4;
114
- var BodyDivider = styled.hr(_templateObject$4 || (_templateObject$4 = _taggedTemplateLiteral(["\n margin-bottom: ", ";\n margin-top: 0;\n border-style: none;\n border-bottom: 1px solid ", ";\n"])), function (props) {
115
- return props.theme.marginPaddings[4];
116
- }, function (props) {
117
- return props.theme.colors.borderColor;
118
- });
119
-
120
- var _templateObject$5;
121
- var Body = styled.div(_templateObject$5 || (_templateObject$5 = _taggedTemplateLiteral(["\n padding-left: ", ";\n padding-right: ", ";\n"])), function (props) {
122
- return props.theme.marginPaddings[6];
123
- }, function (props) {
124
- return props.theme.marginPaddings[6];
125
- });
126
-
127
- var theme = {
128
- breakpoints: ['40em', '52em', '64em'],
129
- space: ['0px', '4px', '8px', '16px', '32px', '64px', '128px', '256px', '512px'],
130
- fontSizes: ['12px', '14px', '16px', '20px', '24px', '32px', '48px', '64px', '72px'],
131
- marginPaddings: ['0.5rem', '1rem', '1.5rem', '2rem', '2.5rem', '3rem', '3.5rem', '4rem', '4.5rem', '5rem', '5.5rem', '6rem'],
132
- letterSpacings: ['-0.5px', '0px', '+0.5px'],
133
- radii: ['0px', '2px', '4px', '8px'],
134
- borderRadius: '6px',
135
- colors: {
136
- primary: '#000',
137
- base: '#4e4949',
138
- baseLt: '#817c7c',
139
- borderColor: '#d8d8d8',
140
- ntrlMin: '#fff',
141
- ntrlMinTen: '#e6e6e6',
142
- gray: '#efefef',
143
- darkerGray: '#454141'
144
- },
145
- rareStepColors: {
146
- primary: '#202b58',
147
- secondary: '#ef5c2d',
148
- ntrlMin: '#ffffff',
149
- ntrl40: '#f4f4f4',
150
- ntrl50: '#808080',
151
- ntrl60: '#e8e8e8',
152
- ntrl70: '#252525',
153
- ntrlMax: '#000000'
154
- },
155
- rareStepFontWeights: {
156
- normal: 400,
157
- medium: 500,
158
- semiBold: 600,
159
- bold: 700
160
- },
161
- rareStepFontSize: {
162
- h1: '36px',
163
- h2: '30px',
164
- h3: '24px',
165
- h4: '20px',
166
- h5: '16px',
167
- h6: '14px',
168
- footerTitle: '16px'
169
- },
170
- rareStepPageSizes: {
171
- mobile: '500px',
172
- tablet: '768px',
173
- desktop: '992px',
174
- screenl: '1280px',
175
- screenxl: '1680px',
176
- screenxxl: '1920px',
177
- container: '1600px'
78
+ function _unsupportedIterableToArray(o, minLen) {
79
+ if (!o) return;
80
+ if (typeof o === "string") return _arrayLikeToArray(o, minLen);
81
+ var n = Object.prototype.toString.call(o).slice(8, -1);
82
+ if (n === "Object" && o.constructor) n = o.constructor.name;
83
+ if (n === "Map" || n === "Set") return Array.from(o);
84
+ if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen);
178
85
  }
179
- };
180
-
181
- var themed = (function (Component) {
182
- return /*#__PURE__*/forwardRef(function (props, ref) {
183
- return /*#__PURE__*/React.createElement(ThemeProvider, {
184
- theme: theme
185
- }, /*#__PURE__*/React.createElement(Component, _extends({}, props, {
186
- ref: ref
187
- })));
188
- });
189
- });
190
-
191
- var SimpleAccordion = function SimpleAccordion(_ref) {
192
- var identifier = _ref.identifier,
193
- wrapperClass = _ref.wrapperClass,
194
- containerClass = _ref.containerClass,
195
- title = _ref.title,
196
- _onClick = _ref.onClick,
197
- openIndicator = _ref.openIndicator;
198
- var OpenIndicator = openIndicator;
199
- return /*#__PURE__*/React.createElement("div", {
200
- className: wrapperClass
201
- }, /*#__PURE__*/React.createElement(OuterContainer, {
202
- "data-qe-id": identifier,
203
- className: containerClass
204
- }, /*#__PURE__*/React.createElement(ToggleButton, {
205
- className: "".concat(containerClass, "__toggle-button"),
206
- "data-qe-id": "".concat(identifier, "-toggle-button"),
207
- onClick: function onClick(e) {
208
- e.preventDefault();
209
-
210
- _onClick();
211
- },
212
- role: "button"
213
- }, /*#__PURE__*/React.createElement(Title, {
214
- className: "".concat(containerClass, "__toggle-button__title")
215
- }, title), /*#__PURE__*/React.createElement("div", {
216
- className: "".concat(containerClass, "__toggle-button__indicator")
217
- }, /*#__PURE__*/React.createElement(OpenIndicator, null)))));
218
- };
219
-
220
- SimpleAccordion.defaultProps = {
221
- identifier: '',
222
- wrapperClass: '',
223
- containerClass: 'luxity-accordion',
224
- title: '',
225
- onClick: function onClick() {
226
- return null;
227
- },
228
- openIndicator: function openIndicator() {
229
- return /*#__PURE__*/React.createElement(React.Fragment, null, "Open");
86
+
87
+ function _arrayLikeToArray(arr, len) {
88
+ if (len == null || len > arr.length) len = arr.length;
89
+
90
+ for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i];
91
+
92
+ return arr2;
230
93
  }
231
- };
232
- var SimpleAccordion$1 = themed(SimpleAccordion);
233
-
234
- var DummyAccordion = SimpleAccordion$1;
235
-
236
- var runAfter = function runAfter(fn, duration) {
237
- setTimeout(fn, duration);
238
- };
239
-
240
- var getInitHeight = function getInitHeight(defaultHeight) {
241
- if (defaultHeight === 'auto') return 'auto';
242
- return 0;
243
- };
244
- /**
245
- * An Expand and Collapsible container which show a Title by default
246
- * and then expands to show the content/children when it is triggered
247
- */
248
-
249
-
250
- var Accordion = function Accordion(_ref) {
251
- var wrapperClass = _ref.wrapperClass,
252
- containerClass = _ref.containerClass,
253
- title = _ref.title,
254
- closeIndicator = _ref.closeIndicator,
255
- openIndicator = _ref.openIndicator,
256
- itemKey = _ref.itemKey,
257
- childRenderer = _ref.children,
258
- duration = _ref.duration,
259
- onAnimationStart = _ref.onAnimationStart,
260
- onAnimationEnd = _ref.onAnimationEnd,
261
- onClose = _ref.onClose,
262
- onOpen = _ref.onOpen,
263
- onToggle = _ref.onToggle,
264
- identifier = _ref.identifier,
265
- defaultHeight = _ref.defaultHeight;
266
-
267
- var _useState = useState(getInitHeight(defaultHeight)),
268
- _useState2 = _slicedToArray(_useState, 2),
269
- height = _useState2[0],
270
- setHeight = _useState2[1];
271
-
272
- var isClosed = height === 0 || false;
273
-
274
- var toggle = function toggle() {
275
- var callback = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : function () {
276
- return null;
277
- };
278
- setHeight(isClosed ? 'auto' : 0); // triggers animation with duration
279
94
 
280
- runAfter(callback, duration);
95
+ function _nonIterableRest() {
96
+ throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");
97
+ }
281
98
 
282
- if (isClosed) {
283
- runAfter(onOpen, duration);
284
- } else {
285
- runAfter(onClose, duration);
99
+ var _templateObject;
100
+ var OuterContainer = styled__default.div(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n border: 1px solid ", ";\n"])), function (props) {
101
+ return props.theme.colors.borderColor;
102
+ });
103
+
104
+ var _templateObject$1;
105
+ var ToggleButton = styled__default.div(_templateObject$1 || (_templateObject$1 = _taggedTemplateLiteral(["\n padding-left: 3rem;\n padding-right: 3rem;\n display: flex;\n align-items: center;\n min-height: 70px;\n height: 70px;\n cursor: pointer;\n outline: none;\n"])));
106
+
107
+ var _templateObject$2;
108
+ var Title = styled__default.div(_templateObject$2 || (_templateObject$2 = _taggedTemplateLiteral(["\n font-size: ", ";\n font-weight: bold;\n flex-grow: 1;\n color: ", ";\n"])), function (props) {
109
+ return props.theme.fontSizes[2];
110
+ }, function (props) {
111
+ return props.theme.colors.primary || '';
112
+ });
113
+
114
+ var _templateObject$3;
115
+ var BodyContent = styled__default.div(_templateObject$3 || (_templateObject$3 = _taggedTemplateLiteral(["\n margin-bottom: ", ";\n"])), function (props) {
116
+ return props.theme.marginPaddings[5];
117
+ });
118
+
119
+ var _templateObject$4;
120
+ var BodyDivider = styled__default.hr(_templateObject$4 || (_templateObject$4 = _taggedTemplateLiteral(["\n margin-bottom: ", ";\n margin-top: 0;\n border-style: none;\n border-bottom: 1px solid ", ";\n"])), function (props) {
121
+ return props.theme.marginPaddings[4];
122
+ }, function (props) {
123
+ return props.theme.colors.borderColor;
124
+ });
125
+
126
+ var _templateObject$5;
127
+ var Body = styled__default.div(_templateObject$5 || (_templateObject$5 = _taggedTemplateLiteral(["\n padding-left: ", ";\n padding-right: ", ";\n"])), function (props) {
128
+ return props.theme.marginPaddings[6];
129
+ }, function (props) {
130
+ return props.theme.marginPaddings[6];
131
+ });
132
+
133
+ var theme = {
134
+ breakpoints: ['40em', '52em', '64em'],
135
+ space: ['0px', '4px', '8px', '16px', '32px', '64px', '128px', '256px', '512px'],
136
+ fontSizes: ['12px', '14px', '16px', '20px', '24px', '32px', '48px', '64px', '72px'],
137
+ marginPaddings: ['0.5rem', '1rem', '1.5rem', '2rem', '2.5rem', '3rem', '3.5rem', '4rem', '4.5rem', '5rem', '5.5rem', '6rem'],
138
+ letterSpacings: ['-0.5px', '0px', '+0.5px'],
139
+ radii: ['0px', '2px', '4px', '8px'],
140
+ borderRadius: '6px',
141
+ colors: {
142
+ primary: '#000',
143
+ base: '#4e4949',
144
+ baseLt: '#817c7c',
145
+ borderColor: '#d8d8d8',
146
+ ntrlMin: '#fff',
147
+ ntrlMinTen: '#e6e6e6',
148
+ gray: '#efefef',
149
+ darkerGray: '#454141'
150
+ },
151
+ rareStepColors: {
152
+ primary: '#202b58',
153
+ secondary: '#ef5c2d',
154
+ ntrlMin: '#ffffff',
155
+ ntrl40: '#f4f4f4',
156
+ ntrl50: '#808080',
157
+ ntrl60: '#e8e8e8',
158
+ ntrl70: '#252525',
159
+ ntrlMax: '#000000'
160
+ },
161
+ rareStepFontWeights: {
162
+ normal: 400,
163
+ medium: 500,
164
+ semiBold: 600,
165
+ bold: 700
166
+ },
167
+ rareStepFontSize: {
168
+ h1: '36px',
169
+ h2: '30px',
170
+ h3: '24px',
171
+ h4: '20px',
172
+ h5: '16px',
173
+ h6: '14px',
174
+ footerTitle: '16px'
175
+ },
176
+ rareStepPageSizes: {
177
+ mobile: '500px',
178
+ tablet: '768px',
179
+ desktop: '992px',
180
+ screenl: '1280px',
181
+ screenxl: '1680px',
182
+ screenxxl: '1920px',
183
+ container: '1600px'
286
184
  }
185
+ };
186
+
187
+ var themed = (function (Component) {
188
+ return /*#__PURE__*/React.forwardRef(function (props, ref) {
189
+ return /*#__PURE__*/React__default.createElement(styled.ThemeProvider, {
190
+ theme: theme
191
+ }, /*#__PURE__*/React__default.createElement(Component, _extends({}, props, {
192
+ ref: ref
193
+ })));
194
+ });
195
+ });
287
196
 
288
- runAfter(onToggle, duration);
197
+ var SimpleAccordion = function SimpleAccordion(_ref) {
198
+ var identifier = _ref.identifier,
199
+ wrapperClass = _ref.wrapperClass,
200
+ containerClass = _ref.containerClass,
201
+ title = _ref.title,
202
+ _onClick = _ref.onClick,
203
+ openIndicator = _ref.openIndicator;
204
+ var OpenIndicator = openIndicator;
205
+ return /*#__PURE__*/React__default.createElement("div", {
206
+ className: wrapperClass
207
+ }, /*#__PURE__*/React__default.createElement(OuterContainer, {
208
+ "data-qe-id": identifier,
209
+ className: containerClass
210
+ }, /*#__PURE__*/React__default.createElement(ToggleButton, {
211
+ className: "".concat(containerClass, "__toggle-button"),
212
+ "data-qe-id": "".concat(identifier, "-toggle-button"),
213
+ onClick: function onClick(e) {
214
+ e.preventDefault();
215
+
216
+ _onClick();
217
+ },
218
+ role: "button"
219
+ }, /*#__PURE__*/React__default.createElement(Title, {
220
+ className: "".concat(containerClass, "__toggle-button__title")
221
+ }, title), /*#__PURE__*/React__default.createElement("div", {
222
+ className: "".concat(containerClass, "__toggle-button__indicator")
223
+ }, /*#__PURE__*/React__default.createElement(OpenIndicator, null)))));
289
224
  };
290
225
 
291
- var close = function close() {
292
- var callback = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : function () {
226
+ SimpleAccordion.defaultProps = {
227
+ identifier: '',
228
+ wrapperClass: '',
229
+ containerClass: 'luxity-accordion',
230
+ title: '',
231
+ onClick: function onClick() {
293
232
  return null;
294
- };
295
- setHeight(0); // triggers animation with duration
233
+ },
234
+ openIndicator: function openIndicator() {
235
+ return /*#__PURE__*/React__default.createElement(React__default.Fragment, null, "Open");
236
+ }
237
+ };
238
+ var SimpleAccordion$1 = themed(SimpleAccordion);
296
239
 
297
- runAfter(callback, duration);
298
- runAfter(onClose, duration);
240
+ var DummyAccordion = SimpleAccordion$1;
241
+
242
+ var runAfter = function runAfter(fn, duration) {
243
+ setTimeout(fn, duration);
299
244
  };
300
245
 
301
- var open = function open() {
302
- var callback = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : function () {
303
- return null;
246
+ var getInitHeight = function getInitHeight(defaultHeight) {
247
+ if (defaultHeight === 'auto') return 'auto';
248
+ return 0;
249
+ };
250
+ /**
251
+ * An Expand and Collapsible container which show a Title by default
252
+ * and then expands to show the content/children when it is triggered
253
+ */
254
+
255
+
256
+ var Accordion = function Accordion(_ref) {
257
+ var wrapperClass = _ref.wrapperClass,
258
+ containerClass = _ref.containerClass,
259
+ title = _ref.title,
260
+ closeIndicator = _ref.closeIndicator,
261
+ openIndicator = _ref.openIndicator,
262
+ itemKey = _ref.itemKey,
263
+ childRenderer = _ref.children,
264
+ duration = _ref.duration,
265
+ onAnimationStart = _ref.onAnimationStart,
266
+ onAnimationEnd = _ref.onAnimationEnd,
267
+ onClose = _ref.onClose,
268
+ onOpen = _ref.onOpen,
269
+ onToggle = _ref.onToggle,
270
+ identifier = _ref.identifier,
271
+ defaultHeight = _ref.defaultHeight;
272
+
273
+ var _useState = React.useState(getInitHeight(defaultHeight)),
274
+ _useState2 = _slicedToArray(_useState, 2),
275
+ height = _useState2[0],
276
+ setHeight = _useState2[1];
277
+
278
+ var isClosed = height === 0 || false;
279
+
280
+ var toggle = function toggle() {
281
+ var callback = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : function () {
282
+ return null;
283
+ };
284
+ setHeight(isClosed ? 'auto' : 0); // triggers animation with duration
285
+
286
+ runAfter(callback, duration);
287
+
288
+ if (isClosed) {
289
+ runAfter(onOpen, duration);
290
+ } else {
291
+ runAfter(onClose, duration);
292
+ }
293
+
294
+ runAfter(onToggle, duration);
295
+ };
296
+
297
+ var close = function close() {
298
+ var callback = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : function () {
299
+ return null;
300
+ };
301
+ setHeight(0); // triggers animation with duration
302
+
303
+ runAfter(callback, duration);
304
+ runAfter(onClose, duration);
304
305
  };
305
- setHeight('auto'); // triggers animation with duration
306
306
 
307
- runAfter(callback, duration);
308
- runAfter(onOpen, duration);
307
+ var open = function open() {
308
+ var callback = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : function () {
309
+ return null;
310
+ };
311
+ setHeight('auto'); // triggers animation with duration
312
+
313
+ runAfter(callback, duration);
314
+ runAfter(onOpen, duration);
315
+ };
316
+
317
+ var CloseIndicator = closeIndicator;
318
+ var OpenIndicator = openIndicator;
319
+ return /*#__PURE__*/React__default.createElement("div", {
320
+ className: wrapperClass
321
+ }, /*#__PURE__*/React__default.createElement(OuterContainer, {
322
+ "data-qe-id": identifier,
323
+ className: containerClass
324
+ }, /*#__PURE__*/React__default.createElement(ToggleButton, {
325
+ className: "".concat(containerClass, "__toggle-button"),
326
+ "data-qe-id": "".concat(identifier, "-toggle-button"),
327
+ onKeyPress: function onKeyPress() {
328
+ return null;
329
+ },
330
+ onClick: function onClick(e) {
331
+ e.preventDefault();
332
+ toggle();
333
+ },
334
+ role: "button",
335
+ tabIndex: itemKey + 1
336
+ }, /*#__PURE__*/React__default.createElement(Title, {
337
+ className: "".concat(containerClass, "__toggle-button__title")
338
+ }, title), /*#__PURE__*/React__default.createElement("div", {
339
+ className: "".concat(containerClass, "__toggle-button__indicator")
340
+ }, isClosed ? /*#__PURE__*/React__default.createElement(OpenIndicator, null) : /*#__PURE__*/React__default.createElement(CloseIndicator, null))), /*#__PURE__*/React__default.createElement(AnimateHeight, {
341
+ height: height,
342
+ duration: duration,
343
+ onAnimationStart: onAnimationStart,
344
+ onAnimationEnd: onAnimationEnd
345
+ }, /*#__PURE__*/React__default.createElement(Body, {
346
+ className: "".concat(containerClass, "__body")
347
+ }, title ? /*#__PURE__*/React__default.createElement(BodyDivider, null) : /*#__PURE__*/React__default.createElement(React__default.Fragment, null), /*#__PURE__*/React__default.createElement(BodyContent, {
348
+ className: "".concat(containerClass, "__body__content")
349
+ }, typeof childRenderer === 'function' ? childRenderer(close, open, toggle) : childRenderer)))));
309
350
  };
310
351
 
311
- var CloseIndicator = closeIndicator;
312
- var OpenIndicator = openIndicator;
313
- return /*#__PURE__*/React.createElement("div", {
314
- className: wrapperClass
315
- }, /*#__PURE__*/React.createElement(OuterContainer, {
316
- "data-qe-id": identifier,
317
- className: containerClass
318
- }, /*#__PURE__*/React.createElement(ToggleButton, {
319
- className: "".concat(containerClass, "__toggle-button"),
320
- "data-qe-id": "".concat(identifier, "-toggle-button"),
321
- onKeyPress: function onKeyPress() {
352
+ Accordion.defaultProps = {
353
+ identifier: '',
354
+ wrapperClass: '',
355
+ containerClass: 'luxity-accordion',
356
+ title: '',
357
+ itemKey: 0,
358
+ children: null,
359
+ duration: 500,
360
+ defaultHeight: '0',
361
+ onAnimationStart: function onAnimationStart() {
322
362
  return null;
323
363
  },
324
- onClick: function onClick(e) {
325
- e.preventDefault();
326
- toggle();
364
+ onAnimationEnd: function onAnimationEnd() {
365
+ return null;
327
366
  },
328
- role: "button",
329
- tabIndex: itemKey + 1
330
- }, /*#__PURE__*/React.createElement(Title, {
331
- className: "".concat(containerClass, "__toggle-button__title")
332
- }, title), /*#__PURE__*/React.createElement("div", {
333
- className: "".concat(containerClass, "__toggle-button__indicator")
334
- }, isClosed ? /*#__PURE__*/React.createElement(OpenIndicator, null) : /*#__PURE__*/React.createElement(CloseIndicator, null))), /*#__PURE__*/React.createElement(AnimateHeight, {
335
- height: height,
336
- duration: duration,
337
- onAnimationStart: onAnimationStart,
338
- onAnimationEnd: onAnimationEnd
339
- }, /*#__PURE__*/React.createElement(Body, {
340
- className: "".concat(containerClass, "__body")
341
- }, title ? /*#__PURE__*/React.createElement(BodyDivider, null) : /*#__PURE__*/React.createElement(React.Fragment, null), /*#__PURE__*/React.createElement(BodyContent, {
342
- className: "".concat(containerClass, "__body__content")
343
- }, typeof childRenderer === 'function' ? childRenderer(close, open, toggle) : childRenderer)))));
344
- };
345
-
346
- Accordion.defaultProps = {
347
- identifier: '',
348
- wrapperClass: '',
349
- containerClass: 'luxity-accordion',
350
- title: '',
351
- itemKey: 0,
352
- children: null,
353
- duration: 500,
354
- defaultHeight: '0',
355
- onAnimationStart: function onAnimationStart() {
356
- return null;
357
- },
358
- onAnimationEnd: function onAnimationEnd() {
359
- return null;
360
- },
361
- onClose: function onClose() {
362
- return null;
363
- },
364
- onOpen: function onOpen() {
365
- return null;
366
- },
367
- onToggle: function onToggle() {
368
- return null;
369
- },
370
- closeIndicator: function closeIndicator() {
371
- return /*#__PURE__*/React.createElement(React.Fragment, null, "Close");
372
- },
373
- openIndicator: function openIndicator() {
374
- return /*#__PURE__*/React.createElement(React.Fragment, null, "Open");
375
- }
376
- };
377
- var index = themed(Accordion);
367
+ onClose: function onClose() {
368
+ return null;
369
+ },
370
+ onOpen: function onOpen() {
371
+ return null;
372
+ },
373
+ onToggle: function onToggle() {
374
+ return null;
375
+ },
376
+ closeIndicator: function closeIndicator() {
377
+ return /*#__PURE__*/React__default.createElement(React__default.Fragment, null, "Close");
378
+ },
379
+ openIndicator: function openIndicator() {
380
+ return /*#__PURE__*/React__default.createElement(React__default.Fragment, null, "Open");
381
+ }
382
+ };
383
+ var index = themed(Accordion);
384
+
385
+ exports.DummyAccordion = DummyAccordion;
386
+ exports.default = index;
387
+
388
+ Object.defineProperty(exports, '__esModule', { value: true });
378
389
 
379
- export default index;
380
- export { DummyAccordion };
390
+ })));