@ably/ui 8.7.0-dev.fa55b85 → 8.7.0-dev.fba161a

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 (150) hide show
  1. package/README.md +15 -4
  2. package/core/.DS_Store +0 -0
  3. package/core/Code/component.css +2 -0
  4. package/core/Code/component.js +1 -1
  5. package/core/Code.jsx +108 -88
  6. package/core/CompanyAutocomplete/component.js +1 -1
  7. package/core/ConnectStateWrapper/component.js +1 -1
  8. package/core/ConnectStateWrapper.jsx +7 -7
  9. package/core/ContactFooter/component.js +1 -1
  10. package/core/ContactFooter.jsx +12 -12
  11. package/core/CookieMessage/component.js +1 -1
  12. package/core/CookieMessage.jsx +10 -10
  13. package/core/CustomerLogos/component.js +1 -1
  14. package/core/CustomerLogos.jsx +7 -7
  15. package/core/DropdownMenu/component.js +1 -1
  16. package/core/DropdownMenu.jsx +11 -15
  17. package/core/FeatureFooter/component.js +1 -1
  18. package/core/FeaturedLink/component.css +1 -1
  19. package/core/FeaturedLink/component.js +1 -1
  20. package/core/FeaturedLink.jsx +10 -10
  21. package/core/Flash/component.js +1 -1
  22. package/core/Flash.jsx +142 -70
  23. package/core/Footer/component.css +23 -3
  24. package/core/Footer/component.js +1 -1
  25. package/core/Footer.jsx +156 -65
  26. package/core/Icon/component.js +1 -1
  27. package/core/Icon.jsx +7 -7
  28. package/core/Loader/component.js +1 -1
  29. package/core/Loader.jsx +7 -7
  30. package/core/Logo/component.js +1 -1
  31. package/core/Logo.jsx +33 -118
  32. package/core/Meganav/component.css +8 -10
  33. package/core/Meganav/component.js +1 -1
  34. package/core/Meganav/component.json +1 -1
  35. package/core/Meganav.jsx +387 -365
  36. package/core/MeganavBlogPostsList/component.js +1 -1
  37. package/core/MeganavBlogPostsList.jsx +13 -13
  38. package/core/MeganavContentCompany/component.js +1 -1
  39. package/core/MeganavContentCompany.jsx +39 -27
  40. package/core/MeganavContentDevelopers/component.js +1 -1
  41. package/core/MeganavContentDevelopers.jsx +41 -28
  42. package/core/MeganavContentPlatform/component.js +1 -1
  43. package/core/MeganavContentPlatform.jsx +23 -23
  44. package/core/MeganavContentUseCases/component.js +1 -1
  45. package/core/MeganavContentUseCases.jsx +62 -54
  46. package/core/MeganavContentWhyAbly/component.js +1 -22
  47. package/core/MeganavContentWhyAbly.jsx +333 -2141
  48. package/core/MeganavControl/component.js +1 -1
  49. package/core/MeganavControl.jsx +10 -10
  50. package/core/MeganavControlMobileDropdown/component.js +1 -1
  51. package/core/MeganavControlMobileDropdown.jsx +11 -11
  52. package/core/MeganavControlMobilePanelClose/component.js +1 -1
  53. package/core/MeganavControlMobilePanelClose.jsx +10 -10
  54. package/core/MeganavControlMobilePanelOpen/component.js +1 -1
  55. package/core/MeganavControlMobilePanelOpen.jsx +10 -10
  56. package/core/MeganavItemsDesktop/component.js +1 -1
  57. package/core/MeganavItemsDesktop.jsx +16 -16
  58. package/core/MeganavItemsMobile/component.js +1 -1
  59. package/core/MeganavItemsMobile.jsx +39 -39
  60. package/core/MeganavItemsSignedIn/component.js +1 -1
  61. package/core/MeganavItemsSignedIn.jsx +33 -33
  62. package/core/MeganavSearch/component.js +1 -1
  63. package/core/MeganavSearch.jsx +23 -23
  64. package/core/MeganavSearchAutocomplete/component.js +1 -1
  65. package/core/MeganavSearchAutocomplete.jsx +4 -4
  66. package/core/MeganavSearchPanel/component.js +1 -1
  67. package/core/MeganavSearchPanel.jsx +19 -19
  68. package/core/MeganavSearchSuggestions/component.js +1 -1
  69. package/core/MeganavSearchSuggestions.jsx +13 -13
  70. package/core/Notice/component.css +1 -1
  71. package/core/Notice/component.js +1 -1
  72. package/core/Notice.jsx +154 -82
  73. package/core/Showcase/component.js +1 -1
  74. package/core/Showcase.jsx +1 -1
  75. package/core/SignOutLink/component.js +1 -1
  76. package/core/SignOutLink.jsx +7 -7
  77. package/core/Slider/component.js +1 -1
  78. package/core/Slider.jsx +14 -14
  79. package/core/Uptime/component.js +1 -1
  80. package/core/Uptime.jsx +15 -15
  81. package/core/fonts/jetBrains-mono.css +3 -0
  82. package/core/fonts/manrope.css +3 -0
  83. package/core/images/ably-logo.png +0 -0
  84. package/core/images/high-performer-2022.png +0 -0
  85. package/core/images/highest-user-adoption-2022.png +0 -0
  86. package/core/images/users-love-us-2022.png +0 -0
  87. package/core/scripts.js +1 -1
  88. package/core/sprites.svg +87 -3
  89. package/core/styles.css +222 -101
  90. package/package.json +1 -1
  91. package/reset/scripts.js +1 -1
  92. package/reset/styles.css +1 -11
  93. package/src/.DS_Store +0 -0
  94. package/src/core/DropdownMenu/component.jsx +0 -2
  95. package/src/core/FeaturedLink/component.css +1 -1
  96. package/src/core/Flash/component.jsx +40 -14
  97. package/src/core/Footer/component.css +23 -3
  98. package/src/core/Footer/component.html.erb +120 -58
  99. package/src/core/Footer/component.jsx +127 -52
  100. package/src/core/Logo/component.html.erb +2 -27
  101. package/src/core/Logo/component.jsx +7 -40
  102. package/src/core/Logo/component.rb +15 -6
  103. package/src/core/Meganav/component.css +8 -8
  104. package/src/core/Meganav/component.html.erb +1 -1
  105. package/src/core/Meganav/component.json +1 -1
  106. package/src/core/Meganav/component.jsx +1 -1
  107. package/src/core/Meganav/component.rb +3 -2
  108. package/src/core/MeganavContentCompany/component.html.erb +9 -0
  109. package/src/core/MeganavContentCompany/component.jsx +9 -0
  110. package/src/core/MeganavContentDevelopers/component.html.erb +21 -14
  111. package/src/core/MeganavContentDevelopers/component.jsx +23 -13
  112. package/src/core/MeganavContentPlatform/component.html.erb +7 -7
  113. package/src/core/MeganavContentPlatform/component.jsx +7 -7
  114. package/src/core/MeganavContentUseCases/component.html.erb +42 -38
  115. package/src/core/MeganavContentUseCases/component.jsx +41 -38
  116. package/src/core/Notice/component.css +1 -1
  117. package/src/core/Notice/component.html.erb +2 -2
  118. package/src/core/Notice/component.jsx +2 -2
  119. package/src/core/core.rb +12 -4
  120. package/src/core/fonts/jetBrains-mono.css +3 -0
  121. package/src/core/fonts/manrope.css +3 -0
  122. package/src/core/icons/github.svg +1 -1
  123. package/src/core/icons/icon-display-chat-col.svg +4 -0
  124. package/src/core/icons/icon-display-data-broadcast-col.svg +26 -0
  125. package/src/core/icons/icon-display-data-synchronization-col.svg +14 -0
  126. package/src/core/icons/icon-display-events-col.svg +13 -0
  127. package/src/core/icons/icon-display-kafka-at-the-edge-col.svg +8 -0
  128. package/src/core/icons/icon-display-push-notifications-col.svg +6 -0
  129. package/src/core/icons/icon-gui-check-circled-fill-black.svg +4 -0
  130. package/src/core/icons/icon-gui-filter-flow-step-1.svg +5 -0
  131. package/src/core/icons/icon-gui-filter-flow-step-2.svg +5 -0
  132. package/src/core/icons/icon-gui-filter-flow-step-3.svg +5 -0
  133. package/src/core/icons/icon-gui-resources.svg +3 -0
  134. package/src/core/icons/icon-tech-apachekafka.svg +3 -0
  135. package/src/core/icons/stackoverflow.svg +1 -1
  136. package/src/core/icons/youtube.svg +1 -1
  137. package/src/core/images/ably-logo.png +0 -0
  138. package/src/core/images/high-performer-2022.png +0 -0
  139. package/src/core/images/highest-user-adoption-2022.png +0 -0
  140. package/src/core/images/users-love-us-2022.png +0 -0
  141. package/src/core/styles/buttons.css +5 -5
  142. package/src/core/styles/forms.css +5 -5
  143. package/src/core/styles/properties.css +153 -45
  144. package/src/core/styles/text.css +59 -40
  145. package/src/core/utils/syntax-highlighter-registry.js +2 -0
  146. package/src/core/utils/syntax-highlighter.css +2 -0
  147. package/src/core/utils/syntax-highlighter.js +5 -0
  148. package/tailwind.config.js +61 -44
  149. package/core/Meganav/component.js.LICENSE.txt +0 -7
  150. package/core/MeganavSearchAutocomplete/component.js.LICENSE.txt +0 -7
package/core/Notice.jsx CHANGED
@@ -7,7 +7,7 @@
7
7
  var a = typeof exports === 'object' ? factory(require("react"), require("prop-types"), require("js-cookie"), require("lodash.throttle"), require("dompurify"), require("redux")) : factory(root[undefined], root[undefined], root[undefined], root[undefined], root[undefined], root[undefined]);
8
8
  for(var i in a) (typeof exports === 'object' ? exports : root)[i] = a[i];
9
9
  }
10
- })(this, function(__WEBPACK_EXTERNAL_MODULE__9281__, __WEBPACK_EXTERNAL_MODULE__3474__, __WEBPACK_EXTERNAL_MODULE__9349__, __WEBPACK_EXTERNAL_MODULE__2040__, __WEBPACK_EXTERNAL_MODULE__6357__, __WEBPACK_EXTERNAL_MODULE__5044__) {
10
+ })(this, (__WEBPACK_EXTERNAL_MODULE__5225__, __WEBPACK_EXTERNAL_MODULE__6073__, __WEBPACK_EXTERNAL_MODULE__4360__, __WEBPACK_EXTERNAL_MODULE__7326__, __WEBPACK_EXTERNAL_MODULE__710__, __WEBPACK_EXTERNAL_MODULE__5293__) => {
11
11
  return /******/ (() => { // webpackBootstrap
12
12
  /******/ "use strict";
13
13
  /******/ var __webpack_modules__ = ({
@@ -19,7 +19,7 @@ return /******/ (() => { // webpackBootstrap
19
19
  /* harmony export */ "default": () => (__WEBPACK_DEFAULT_EXPORT__)
20
20
  /* harmony export */ });
21
21
  /* unused harmony export ConnectStateWrapper */
22
- /* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(9281);
22
+ /* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(5225);
23
23
  /* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
24
24
  /* harmony import */ var _remote_data_store__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(3511);
25
25
  function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
@@ -92,22 +92,55 @@ var ConnectStateWrapper = function ConnectStateWrapper(Component, selectors) {
92
92
 
93
93
  /***/ }),
94
94
 
95
- /***/ 4935:
95
+ /***/ 2139:
96
96
  /***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
97
97
 
98
- /* harmony export */ __webpack_require__.d(__webpack_exports__, {
99
- /* harmony export */ "FLASH_DATA_ID": () => (/* binding */ FLASH_DATA_ID)
100
- /* harmony export */ });
101
- /* unused harmony exports reducerFlashes, Flashes */
102
- /* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(9281);
103
- /* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
104
- /* harmony import */ var dompurify__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(6357);
105
- /* harmony import */ var dompurify__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(dompurify__WEBPACK_IMPORTED_MODULE_1__);
106
- /* harmony import */ var prop_types__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(3474);
107
- /* harmony import */ var prop_types__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(prop_types__WEBPACK_IMPORTED_MODULE_2__);
108
- /* harmony import */ var _remote_data_store__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(3511);
109
- /* harmony import */ var _ConnectStateWrapper_component_jsx__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(9787);
110
- /* harmony import */ var _Icon_component_jsx__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(9008);
98
+
99
+ // EXPORTS
100
+ __webpack_require__.d(__webpack_exports__, {
101
+ "FLASH_DATA_ID": () => (/* binding */ FLASH_DATA_ID)
102
+ });
103
+
104
+ // UNUSED EXPORTS: Flashes, default, reducerFlashes
105
+
106
+ // EXTERNAL MODULE: external {"commonjs":"react","commonjs2":"react"}
107
+ var external_commonjs_react_commonjs2_react_ = __webpack_require__(5225);
108
+ var external_commonjs_react_commonjs2_react_default = /*#__PURE__*/__webpack_require__.n(external_commonjs_react_commonjs2_react_);
109
+ // EXTERNAL MODULE: external {"commonjs":"dompurify","commonjs2":"dompurify"}
110
+ var external_commonjs_dompurify_commonjs2_dompurify_ = __webpack_require__(710);
111
+ var external_commonjs_dompurify_commonjs2_dompurify_default = /*#__PURE__*/__webpack_require__.n(external_commonjs_dompurify_commonjs2_dompurify_);
112
+ // EXTERNAL MODULE: external {"commonjs":"prop-types","commonjs2":"prop-types"}
113
+ var external_commonjs_prop_types_commonjs2_prop_types_ = __webpack_require__(6073);
114
+ var external_commonjs_prop_types_commonjs2_prop_types_default = /*#__PURE__*/__webpack_require__.n(external_commonjs_prop_types_commonjs2_prop_types_);
115
+ ;// CONCATENATED MODULE: ./node_modules/nanoid/non-secure/index.js
116
+ let urlAlphabet =
117
+ 'useandom-26T198340PX75pxJACKVERYMINDBUSHWOLF_GQZbfghjklqvwyzrict'
118
+ let customAlphabet = (alphabet, defaultSize = 21) => {
119
+ return (size = defaultSize) => {
120
+ let id = ''
121
+ let i = size
122
+ while (i--) {
123
+ id += alphabet[(Math.random() * alphabet.length) | 0]
124
+ }
125
+ return id
126
+ }
127
+ }
128
+ let nanoid = (size = 21) => {
129
+ let id = ''
130
+ let i = size
131
+ while (i--) {
132
+ id += urlAlphabet[(Math.random() * 64) | 0]
133
+ }
134
+ return id
135
+ }
136
+
137
+ // EXTERNAL MODULE: ./src/core/remote-data-store.js
138
+ var remote_data_store = __webpack_require__(3511);
139
+ // EXTERNAL MODULE: ./src/core/ConnectStateWrapper/component.jsx
140
+ var component = __webpack_require__(9787);
141
+ // EXTERNAL MODULE: ./src/core/Icon/component.jsx
142
+ var Icon_component = __webpack_require__(9008);
143
+ ;// CONCATENATED MODULE: ./src/core/Flash/component.jsx
111
144
  function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
112
145
 
113
146
  function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) { symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
@@ -142,6 +175,7 @@ function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len
142
175
 
143
176
 
144
177
 
178
+
145
179
  var REDUCER_KEY = "flashes";
146
180
  var FLASH_DATA_ID = "ui-flashes";
147
181
  var initialState = {
@@ -171,8 +205,8 @@ var selectFlashes = function selectFlashes(store) {
171
205
  };
172
206
 
173
207
  var FlashT = {
174
- type: prop_types__WEBPACK_IMPORTED_MODULE_2___default().oneOf(["error", "success", "notice", "info", "alert"]),
175
- content: (prop_types__WEBPACK_IMPORTED_MODULE_2___default().string)
208
+ type: external_commonjs_prop_types_commonjs2_prop_types_default().oneOf(["error", "success", "notice", "info", "alert"]),
209
+ content: (external_commonjs_prop_types_commonjs2_prop_types_default()).string
176
210
  };
177
211
  var FLASH_BG_COLOR = {
178
212
  error: "bg-gui-error",
@@ -191,48 +225,60 @@ var FLASH_TEXT_COLOR = {
191
225
  var AUTO_HIDE = ["success", "info", "notice"];
192
226
  var AUTO_HIDE_TIME = 8000;
193
227
 
228
+ var useAutoHide = function useAutoHide(type, closeFlash) {
229
+ var timeoutId = (0,external_commonjs_react_commonjs2_react_.useRef)(null);
230
+ (0,external_commonjs_react_commonjs2_react_.useEffect)(function () {
231
+ if (AUTO_HIDE.includes(type)) {
232
+ timeoutId.current = setTimeout(function () {
233
+ closeFlash();
234
+ }, AUTO_HIDE_TIME);
235
+ }
236
+
237
+ return function () {
238
+ if (timeoutId.current) {
239
+ clearTimeout(timeoutId.current);
240
+ }
241
+ };
242
+ }, []);
243
+ };
244
+
194
245
  var Flash = function Flash(_ref) {
195
- var type = _ref.type,
196
- content = _ref.content;
197
- var ref = (0,react__WEBPACK_IMPORTED_MODULE_0__.useRef)(null);
246
+ var id = _ref.id,
247
+ type = _ref.type,
248
+ content = _ref.content,
249
+ removeFlash = _ref.removeFlash;
250
+ var ref = (0,external_commonjs_react_commonjs2_react_.useRef)(null);
198
251
 
199
- var _useState = (0,react__WEBPACK_IMPORTED_MODULE_0__.useState)(false),
252
+ var _useState = (0,external_commonjs_react_commonjs2_react_.useState)(false),
200
253
  _useState2 = _slicedToArray(_useState, 2),
201
254
  closed = _useState2[0],
202
255
  setClosed = _useState2[1];
203
256
 
204
- var _useState3 = (0,react__WEBPACK_IMPORTED_MODULE_0__.useState)(0),
257
+ var _useState3 = (0,external_commonjs_react_commonjs2_react_.useState)(0),
205
258
  _useState4 = _slicedToArray(_useState3, 2),
206
259
  flashHeight = _useState4[0],
207
260
  setFlashHeight = _useState4[1];
208
261
 
209
- var _useState5 = (0,react__WEBPACK_IMPORTED_MODULE_0__.useState)(false),
262
+ var _useState5 = (0,external_commonjs_react_commonjs2_react_.useState)(false),
210
263
  _useState6 = _slicedToArray(_useState5, 2),
211
264
  triggerEntryAnimation = _useState6[0],
212
265
  setTriggerEntryAnimation = _useState6[1];
213
266
 
214
- (0,react__WEBPACK_IMPORTED_MODULE_0__.useEffect)(function () {
215
- return setTriggerEntryAnimation(true);
216
- }, []);
217
- (0,react__WEBPACK_IMPORTED_MODULE_0__.useEffect)(function () {
218
- if (AUTO_HIDE.includes(type)) {
219
- setTimeout(function () {
220
- // closeFlash is idempotent, we can call it even if the flash has been already closed
221
- closeFlash();
222
- }, AUTO_HIDE_TIME);
223
- }
224
- }, [closed]);
225
-
226
267
  var closeFlash = function closeFlash() {
227
268
  if (ref.current) {
228
269
  setFlashHeight(ref.current.getBoundingClientRect().height);
229
270
  }
230
271
 
272
+ setClosed(true);
231
273
  setTimeout(function () {
232
- return setClosed(true);
233
- }, 0);
274
+ removeFlash(id);
275
+ }, 100);
234
276
  };
235
277
 
278
+ (0,external_commonjs_react_commonjs2_react_.useEffect)(function () {
279
+ return setTriggerEntryAnimation(true);
280
+ }, []);
281
+ useAutoHide(type, closeFlash);
236
282
  var animateEntry = triggerEntryAnimation && !closed;
237
283
  var style;
238
284
 
@@ -250,7 +296,7 @@ var Flash = function Flash(_ref) {
250
296
  style = {};
251
297
  }
252
298
 
253
- var safeContent = dompurify__WEBPACK_IMPORTED_MODULE_1___default().sanitize(content, {
299
+ var safeContent = external_commonjs_dompurify_commonjs2_dompurify_default().sanitize(content, {
254
300
  ALLOWED_TAGS: ["a"],
255
301
  ALLOWED_ATTR: ["href", "data-method", "rel"]
256
302
  });
@@ -266,28 +312,28 @@ var Flash = function Flash(_ref) {
266
312
  error: "text-white",
267
313
  alert: "text-white"
268
314
  };
269
- return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("div", {
315
+ return /*#__PURE__*/external_commonjs_react_commonjs2_react_default().createElement("div", {
270
316
  className: "ui-flash-message ui-grid-px ".concat(animateEntry ? "ui-flash-message-enter" : ""),
271
317
  style: style,
272
318
  ref: ref,
273
319
  "data-id": "ui-flash"
274
- }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("div", {
320
+ }, /*#__PURE__*/external_commonjs_react_commonjs2_react_default().createElement("div", {
275
321
  className: "".concat(FLASH_BG_COLOR[type], " p-32 flex align-center rounded shadow-container-subtle")
276
- }, withIcons[type] && /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_Icon_component_jsx__WEBPACK_IMPORTED_MODULE_5__.default, {
322
+ }, withIcons[type] && /*#__PURE__*/external_commonjs_react_commonjs2_react_default().createElement(Icon_component["default"], {
277
323
  name: withIcons[type],
278
324
  color: iconColor[type],
279
325
  size: "1.5rem",
280
326
  additionalCSS: "mr-16 self-baseline"
281
- }), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("p", {
327
+ }), /*#__PURE__*/external_commonjs_react_commonjs2_react_default().createElement("p", {
282
328
  className: "ui-flash-text ".concat(FLASH_TEXT_COLOR[type]),
283
329
  dangerouslySetInnerHTML: {
284
330
  __html: safeContent
285
331
  }
286
- }), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("button", {
332
+ }), /*#__PURE__*/external_commonjs_react_commonjs2_react_default().createElement("button", {
287
333
  type: "button",
288
334
  className: "p-0 ml-auto self-start focus:outline-none",
289
335
  onClick: closeFlash
290
- }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_Icon_component_jsx__WEBPACK_IMPORTED_MODULE_5__.default, {
336
+ }, /*#__PURE__*/external_commonjs_react_commonjs2_react_default().createElement(Icon_component["default"], {
291
337
  name: "icon-gui-close",
292
338
  color: iconColor[type],
293
339
  size: "1.5rem",
@@ -299,26 +345,52 @@ Flash.propTypes = _objectSpread({}, FlashT);
299
345
 
300
346
  var Flashes = function Flashes(_ref2) {
301
347
  var flashes = _ref2.flashes;
302
- var items = (flashes === null || flashes === void 0 ? void 0 : flashes.items) || [];
303
- return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("div", {
348
+
349
+ var _useState7 = (0,external_commonjs_react_commonjs2_react_.useState)([]),
350
+ _useState8 = _slicedToArray(_useState7, 2),
351
+ flashesWithIds = _useState8[0],
352
+ setFlashesWithIds = _useState8[1];
353
+
354
+ var removeFlash = function removeFlash(flashId) {
355
+ return setFlashesWithIds(function (items) {
356
+ return items.filter(function (item) {
357
+ return item.id !== flashId;
358
+ });
359
+ });
360
+ };
361
+
362
+ (0,external_commonjs_react_commonjs2_react_.useEffect)(function () {
363
+ setFlashesWithIds(function (state) {
364
+ return [].concat(_toConsumableArray(state), _toConsumableArray(((flashes === null || flashes === void 0 ? void 0 : flashes.items) || []).map(function (flash) {
365
+ return _objectSpread(_objectSpread({}, flash), {}, {
366
+ id: nanoid(),
367
+ removed: false
368
+ });
369
+ })));
370
+ });
371
+ }, [flashes]);
372
+ return /*#__PURE__*/external_commonjs_react_commonjs2_react_default().createElement("div", {
304
373
  className: "ui-flash",
305
374
  "data-id": FLASH_DATA_ID
306
- }, items.map(function (flash) {
307
- return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(Flash, _extends({
308
- key: flash.type
375
+ }, flashesWithIds.filter(function (item) {
376
+ return !item.removed;
377
+ }).map(function (flash) {
378
+ return /*#__PURE__*/external_commonjs_react_commonjs2_react_default().createElement(Flash, _extends({
379
+ removeFlash: removeFlash,
380
+ key: flash.id
309
381
  }, flash));
310
382
  }));
311
383
  };
312
384
 
313
385
  Flashes.propTypes = {
314
- flashes: prop_types__WEBPACK_IMPORTED_MODULE_2___default().shape({
315
- items: prop_types__WEBPACK_IMPORTED_MODULE_2___default().arrayOf(prop_types__WEBPACK_IMPORTED_MODULE_2___default().shape(FlashT))
386
+ flashes: external_commonjs_prop_types_commonjs2_prop_types_default().shape({
387
+ items: external_commonjs_prop_types_commonjs2_prop_types_default().arrayOf(external_commonjs_prop_types_commonjs2_prop_types_default().shape(FlashT))
316
388
  })
317
389
  };
318
390
 
319
391
  var BackendFlashes = function BackendFlashes(_ref3) {
320
392
  var flashes = _ref3.flashes;
321
- (0,react__WEBPACK_IMPORTED_MODULE_0__.useEffect)(function () {
393
+ (0,external_commonjs_react_commonjs2_react_.useEffect)(function () {
322
394
  var transformedFlashes = flashes.map(function (flash) {
323
395
  var _flash = _slicedToArray(flash, 2),
324
396
  type = _flash[0],
@@ -331,24 +403,24 @@ var BackendFlashes = function BackendFlashes(_ref3) {
331
403
  }) || [];
332
404
 
333
405
  if (transformedFlashes.length > 0) {
334
- var store = (0,_remote_data_store__WEBPACK_IMPORTED_MODULE_3__/* .getRemoteDataStore */ .cO)();
406
+ var store = (0,remote_data_store/* getRemoteDataStore */.cO)();
335
407
  store.dispatch({
336
408
  type: "flash/push",
337
409
  payload: transformedFlashes
338
410
  });
339
411
  }
340
412
  }, []);
341
- var WrappedFlashes = (0,_ConnectStateWrapper_component_jsx__WEBPACK_IMPORTED_MODULE_4__.default)(Flashes, {
413
+ var WrappedFlashes = (0,component["default"])(Flashes, {
342
414
  flashes: selectFlashes
343
415
  });
344
- return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(WrappedFlashes, null);
416
+ return /*#__PURE__*/external_commonjs_react_commonjs2_react_default().createElement(WrappedFlashes, null);
345
417
  };
346
418
 
347
419
  BackendFlashes.propTypes = {
348
- flashes: prop_types__WEBPACK_IMPORTED_MODULE_2___default().arrayOf(prop_types__WEBPACK_IMPORTED_MODULE_2___default().arrayOf((prop_types__WEBPACK_IMPORTED_MODULE_2___default().string)))
420
+ flashes: external_commonjs_prop_types_commonjs2_prop_types_default().arrayOf(external_commonjs_prop_types_commonjs2_prop_types_default().arrayOf((external_commonjs_prop_types_commonjs2_prop_types_default()).string))
349
421
  };
350
422
 
351
- /* unused harmony default export */ var __WEBPACK_DEFAULT_EXPORT__ = ((/* unused pure expression or super */ null && (BackendFlashes)));
423
+ /* harmony default export */ const Flash_component = ((/* unused pure expression or super */ null && (BackendFlashes)));
352
424
 
353
425
  /***/ }),
354
426
 
@@ -358,9 +430,9 @@ BackendFlashes.propTypes = {
358
430
  /* harmony export */ __webpack_require__.d(__webpack_exports__, {
359
431
  /* harmony export */ "default": () => (__WEBPACK_DEFAULT_EXPORT__)
360
432
  /* harmony export */ });
361
- /* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(9281);
433
+ /* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(5225);
362
434
  /* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
363
- /* harmony import */ var prop_types__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(3474);
435
+ /* harmony import */ var prop_types__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(6073);
364
436
  /* harmony import */ var prop_types__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(prop_types__WEBPACK_IMPORTED_MODULE_1__);
365
437
  var _excluded = ["name", "size", "color", "additionalCSS"];
366
438
 
@@ -430,7 +502,7 @@ var queryIdAll = function queryIdAll(val) {
430
502
  /* harmony export */ "kZ": () => (/* binding */ connectState)
431
503
  /* harmony export */ });
432
504
  /* unused harmony exports attachStoreToWindow, createRemoteDataStore */
433
- /* harmony import */ var redux__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(5044);
505
+ /* harmony import */ var redux__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(5293);
434
506
  /* harmony import */ var redux__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(redux__WEBPACK_IMPORTED_MODULE_0__);
435
507
 
436
508
  var attachStoreToWindow = function attachStoreToWindow(store) {
@@ -464,45 +536,45 @@ var createRemoteDataStore = function createRemoteDataStore(reducers) {
464
536
 
465
537
  /***/ }),
466
538
 
467
- /***/ 6357:
539
+ /***/ 710:
468
540
  /***/ ((module) => {
469
541
 
470
- module.exports = __WEBPACK_EXTERNAL_MODULE__6357__;
542
+ module.exports = __WEBPACK_EXTERNAL_MODULE__710__;
471
543
 
472
544
  /***/ }),
473
545
 
474
- /***/ 9349:
546
+ /***/ 4360:
475
547
  /***/ ((module) => {
476
548
 
477
- module.exports = __WEBPACK_EXTERNAL_MODULE__9349__;
549
+ module.exports = __WEBPACK_EXTERNAL_MODULE__4360__;
478
550
 
479
551
  /***/ }),
480
552
 
481
- /***/ 2040:
553
+ /***/ 7326:
482
554
  /***/ ((module) => {
483
555
 
484
- module.exports = __WEBPACK_EXTERNAL_MODULE__2040__;
556
+ module.exports = __WEBPACK_EXTERNAL_MODULE__7326__;
485
557
 
486
558
  /***/ }),
487
559
 
488
- /***/ 3474:
560
+ /***/ 6073:
489
561
  /***/ ((module) => {
490
562
 
491
- module.exports = __WEBPACK_EXTERNAL_MODULE__3474__;
563
+ module.exports = __WEBPACK_EXTERNAL_MODULE__6073__;
492
564
 
493
565
  /***/ }),
494
566
 
495
- /***/ 9281:
567
+ /***/ 5225:
496
568
  /***/ ((module) => {
497
569
 
498
- module.exports = __WEBPACK_EXTERNAL_MODULE__9281__;
570
+ module.exports = __WEBPACK_EXTERNAL_MODULE__5225__;
499
571
 
500
572
  /***/ }),
501
573
 
502
- /***/ 5044:
574
+ /***/ 5293:
503
575
  /***/ ((module) => {
504
576
 
505
- module.exports = __WEBPACK_EXTERNAL_MODULE__5044__;
577
+ module.exports = __WEBPACK_EXTERNAL_MODULE__5293__;
506
578
 
507
579
  /***/ })
508
580
 
@@ -586,21 +658,21 @@ __webpack_require__.d(__webpack_exports__, {
586
658
  });
587
659
 
588
660
  // EXTERNAL MODULE: external {"commonjs":"react","commonjs2":"react"}
589
- var external_commonjs_react_commonjs2_react_ = __webpack_require__(9281);
661
+ var external_commonjs_react_commonjs2_react_ = __webpack_require__(5225);
590
662
  var external_commonjs_react_commonjs2_react_default = /*#__PURE__*/__webpack_require__.n(external_commonjs_react_commonjs2_react_);
591
663
  // EXTERNAL MODULE: external {"commonjs":"prop-types","commonjs2":"prop-types"}
592
- var external_commonjs_prop_types_commonjs2_prop_types_ = __webpack_require__(3474);
664
+ var external_commonjs_prop_types_commonjs2_prop_types_ = __webpack_require__(6073);
593
665
  var external_commonjs_prop_types_commonjs2_prop_types_default = /*#__PURE__*/__webpack_require__.n(external_commonjs_prop_types_commonjs2_prop_types_);
594
666
  // EXTERNAL MODULE: external {"commonjs":"js-cookie","commonjs2":"js-cookie"}
595
- var external_commonjs_js_cookie_commonjs2_js_cookie_ = __webpack_require__(9349);
667
+ var external_commonjs_js_cookie_commonjs2_js_cookie_ = __webpack_require__(4360);
596
668
  var external_commonjs_js_cookie_commonjs2_js_cookie_default = /*#__PURE__*/__webpack_require__.n(external_commonjs_js_cookie_commonjs2_js_cookie_);
597
669
  // EXTERNAL MODULE: external {"commonjs":"lodash.throttle","commonjs2":"lodash.throttle"}
598
- var external_commonjs_lodash_throttle_commonjs2_lodash_throttle_ = __webpack_require__(2040);
670
+ var external_commonjs_lodash_throttle_commonjs2_lodash_throttle_ = __webpack_require__(7326);
599
671
  var external_commonjs_lodash_throttle_commonjs2_lodash_throttle_default = /*#__PURE__*/__webpack_require__.n(external_commonjs_lodash_throttle_commonjs2_lodash_throttle_);
600
672
  // EXTERNAL MODULE: ./src/core/dom-query.js
601
673
  var dom_query = __webpack_require__(9581);
602
- // EXTERNAL MODULE: ./src/core/Flash/component.jsx
603
- var component = __webpack_require__(4935);
674
+ // EXTERNAL MODULE: ./src/core/Flash/component.jsx + 1 modules
675
+ var component = __webpack_require__(2139);
604
676
  ;// CONCATENATED MODULE: ./src/core/Notice/component.js
605
677
  function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) { symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
606
678
 
@@ -750,7 +822,7 @@ var Icon_component = __webpack_require__(9008);
750
822
  ;// CONCATENATED MODULE: ./src/core/Notice/component.jsx
751
823
 
752
824
 
753
- var contentWrapperClasses = "font-light w-full pr-8 text-p3 self-center";
825
+ var contentWrapperClasses = "font-medium w-full pr-8 text-p3 self-center";
754
826
 
755
827
 
756
828
 
@@ -804,7 +876,7 @@ var component_Notice = function Notice(_ref2) {
804
876
  }, /*#__PURE__*/external_commonjs_react_commonjs2_react_default().createElement(ContentWrapper, {
805
877
  buttonLink: buttonLink
806
878
  }, /*#__PURE__*/external_commonjs_react_commonjs2_react_default().createElement("strong", {
807
- className: "font-medium whitespace-nowrap pr-4"
879
+ className: "font-bold whitespace-nowrap pr-4"
808
880
  }, title), /*#__PURE__*/external_commonjs_react_commonjs2_react_default().createElement("span", {
809
881
  className: "pr-4"
810
882
  }, bodyText), buttonLabel && /*#__PURE__*/external_commonjs_react_commonjs2_react_default().createElement("span", {
@@ -812,7 +884,7 @@ var component_Notice = function Notice(_ref2) {
812
884
  }, buttonLabel)), closeBtn && /*#__PURE__*/external_commonjs_react_commonjs2_react_default().createElement("button", {
813
885
  type: "button",
814
886
  className: "ml-auto h-20 w-20 border-none bg-none self-baseline"
815
- }, /*#__PURE__*/external_commonjs_react_commonjs2_react_default().createElement(Icon_component.default, {
887
+ }, /*#__PURE__*/external_commonjs_react_commonjs2_react_default().createElement(Icon_component["default"], {
816
888
  name: "icon-gui-close",
817
889
  size: "1.25rem",
818
890
  color: "text-white"
@@ -1 +1 @@
1
- !function(e,t){"object"==typeof exports&&"object"==typeof module?module.exports=t():"function"==typeof define&&define.amd?define([],t):"object"==typeof exports?exports.AblyUi=t():(e.AblyUi=e.AblyUi||{},e.AblyUi.Core=e.AblyUi.Core||{},e.AblyUi.Core.Showcase=t())}(this,(function(){return(()=>{"use strict";var e={d:(t,n)=>{for(var r in n)e.o(n,r)&&!e.o(t,r)&&Object.defineProperty(t,r,{enumerable:!0,get:n[r]})},o:(e,t)=>Object.prototype.hasOwnProperty.call(e,t)},t={};e.d(t,{default:()=>c});var n=function(e){var t=arguments.length>1&&void 0!==arguments[1]?arguments[1]:document;return t.querySelector("[data-id=".concat(e,"]"))};function r(e,t){(null==t||t>e.length)&&(t=e.length);for(var n=0,r=new Array(t);n<t;n++)r[n]=e[n];return r}var o=function(e,t){var n=arguments.length>2&&void 0!==arguments[2]?arguments[2]:1,r=100*t*n;e.style.transform="translateX(".concat(r,"%)")},i=function(e){if("undefined"==typeof window)return!1;var t="".concat(e+64,"px");return!window.matchMedia("(min-width: ".concat(t,")")).matches};const c=function(e,t){var c=e||n("showcase"),u=Array.from(function(e){return(arguments.length>1&&void 0!==arguments[1]?arguments[1]:document).querySelectorAll("[data-id=".concat(e,"]"))}("showcase-control",c)),a=u.map((function(e){return e.querySelector("img")})),l=n("showcase-controls",c),f=n("showcase-index-bar",c),s=n("showcase-slides",c),d=s.children.length,m=("--ui-showcase-client-logo-min-width",window.getComputedStyle(document.documentElement).getPropertyValue("--ui-showcase-client-logo-min-width")),v=parseFloat(m)*parseFloat(getComputedStyle(document.documentElement).fontSize)*d;[".ui-showcase-logo-wrapper",".ui-showcase-index-bar"].forEach((function(e){var t=c.querySelector(e),n="".concat(v,"px");t.style.minWidth=n}));var p,h,y,w=0,b=!1,g=function(e){o(s,e,-1),o(f,e,1),function(e,t){var n=["filter-grayscale","filter-none"],o=[].concat(n).reverse();e.forEach((function(e,i){var c,u;(c=e.classList).replace.apply(c,function(e){if(Array.isArray(e))return r(e)}(u=i===t?n:o)||function(e){if("undefined"!=typeof Symbol&&null!=e[Symbol.iterator]||null!=e["@@iterator"])return Array.from(e)}(u)||function(e,t){if(e){if("string"==typeof e)return r(e,t);var n=Object.prototype.toString.call(e).slice(8,-1);return"Object"===n&&e.constructor&&(n=e.constructor.name),"Map"===n||"Set"===n?Array.from(e):"Arguments"===n||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)?r(e,t):void 0}}(u)||function(){throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}())}))}(a,e),i(v)&&function(e,t){var n=e.parentNode,r=e.children,o=n.clientWidth/2,i=r.length,c=Array.from(r).map((function(e){return e.clientWidth})).reduce((function(e,t){return e+t}))/i,u=t*c-((t&&i-t-1?o-c/2:0)>>0);n.scrollTo({left:u,behavior:"smooth"})}(l,e)},A=function e(){return p=setTimeout((function(){b||i(v)||(w=(w+1)%u.length,g(w),e())}),5e3)},E=function(){var e=function(){b=!0,clearTimeout(p)};return c.addEventListener("mouseover",e),function(){return c.removeEventListener("mouseover",e)}},S=function(){var e=function(){b=!1,A()};return c.addEventListener("mouseleave",e),function(){return c.removeEventListener("mouseleave",e)}},L=function(){var e=function(){clearTimeout(p),A()};return document.addEventListener("resize",e),function(){return document.removeEventListener("resize",e)}},j=(h=u.map((function(e,t){var n=function(e){return function(){g(w=e)}}(t);return e.addEventListener("click",n),n})),function(){h.forEach((function(e,t){return u[t].removeEventListener("click",e)}))}),x=(y=function(e){return e.preventDefault()},l.parentNode.addEventListener("wheel",y),function(){return l.parentNode.removeEventListener("wheel",y)}),U=function(){if(t){A(),c.setAttribute("aria-live","polite");var e=[E(),S(),L()];return function(){return e.forEach((function(e){return e()}))}}return function(){}}();return function(){g(0),clearTimeout(p),j(),U(),x()}};return t.default})()}));
1
+ !function(e,t){"object"==typeof exports&&"object"==typeof module?module.exports=t():"function"==typeof define&&define.amd?define([],t):"object"==typeof exports?exports.AblyUi=t():(e.AblyUi=e.AblyUi||{},e.AblyUi.Core=e.AblyUi.Core||{},e.AblyUi.Core.Showcase=t())}(this,(()=>(()=>{"use strict";var e={d:(t,n)=>{for(var r in n)e.o(n,r)&&!e.o(t,r)&&Object.defineProperty(t,r,{enumerable:!0,get:n[r]})},o:(e,t)=>Object.prototype.hasOwnProperty.call(e,t)},t={};e.d(t,{default:()=>c});var n=function(e){return(arguments.length>1&&void 0!==arguments[1]?arguments[1]:document).querySelector("[data-id=".concat(e,"]"))};function r(e,t){(null==t||t>e.length)&&(t=e.length);for(var n=0,r=new Array(t);n<t;n++)r[n]=e[n];return r}var o=function(e,t){var n=100*t*(arguments.length>2&&void 0!==arguments[2]?arguments[2]:1);e.style.transform="translateX(".concat(n,"%)")},i=function(e){if("undefined"==typeof window)return!1;var t="".concat(e+64,"px");return!window.matchMedia("(min-width: ".concat(t,")")).matches};const c=function(e,t){var c=e||n("showcase"),u=Array.from(function(e){return(arguments.length>1&&void 0!==arguments[1]?arguments[1]:document).querySelectorAll("[data-id=".concat(e,"]"))}("showcase-control",c)),a=u.map((function(e){return e.querySelector("img")})),l=n("showcase-controls",c),f=n("showcase-index-bar",c),s=n("showcase-slides",c),d=s.children.length,m=("--ui-showcase-client-logo-min-width",window.getComputedStyle(document.documentElement).getPropertyValue("--ui-showcase-client-logo-min-width")),v=parseFloat(m)*parseFloat(getComputedStyle(document.documentElement).fontSize)*d;[".ui-showcase-logo-wrapper",".ui-showcase-index-bar"].forEach((function(e){var t=c.querySelector(e),n="".concat(v,"px");t.style.minWidth=n}));var p,h,y,w=0,b=!1,g=function(e){o(s,e,-1),o(f,e,1),function(e,t){var n=["filter-grayscale","filter-none"],o=[].concat(n).reverse();e.forEach((function(e,i){var c,u;(c=e.classList).replace.apply(c,function(e){if(Array.isArray(e))return r(e)}(u=i===t?n:o)||function(e){if("undefined"!=typeof Symbol&&null!=e[Symbol.iterator]||null!=e["@@iterator"])return Array.from(e)}(u)||function(e,t){if(e){if("string"==typeof e)return r(e,t);var n=Object.prototype.toString.call(e).slice(8,-1);return"Object"===n&&e.constructor&&(n=e.constructor.name),"Map"===n||"Set"===n?Array.from(e):"Arguments"===n||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)?r(e,t):void 0}}(u)||function(){throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}())}))}(a,e),i(v)&&function(e,t){var n=e.parentNode,r=e.children,o=n.clientWidth/2,i=r.length,c=Array.from(r).map((function(e){return e.clientWidth})).reduce((function(e,t){return e+t}))/i,u=t*c-((t&&i-t-1?o-c/2:0)>>0);n.scrollTo({left:u,behavior:"smooth"})}(l,e)},A=function e(){return p=setTimeout((function(){b||i(v)||(w=(w+1)%u.length,g(w),e())}),5e3)},E=function(){var e=function(){b=!0,clearTimeout(p)};return c.addEventListener("mouseover",e),function(){return c.removeEventListener("mouseover",e)}},S=function(){var e=function(){b=!1,A()};return c.addEventListener("mouseleave",e),function(){return c.removeEventListener("mouseleave",e)}},L=function(){var e=function(){clearTimeout(p),A()};return document.addEventListener("resize",e),function(){return document.removeEventListener("resize",e)}},j=(h=u.map((function(e,t){var n=function(e){return function(){g(w=e)}}(t);return e.addEventListener("click",n),n})),function(){h.forEach((function(e,t){return u[t].removeEventListener("click",e)}))}),x=(y=function(e){return e.preventDefault()},l.parentNode.addEventListener("wheel",y),function(){return l.parentNode.removeEventListener("wheel",y)}),U=function(){if(t){A(),c.setAttribute("aria-live","polite");var e=[E(),S(),L()];return function(){return e.forEach((function(e){return e()}))}}return function(){}}();return function(){g(0),clearTimeout(p),j(),U(),x()}};return t.default})()));
package/core/Showcase.jsx CHANGED
@@ -7,7 +7,7 @@
7
7
  var a = factory();
8
8
  for(var i in a) (typeof exports === 'object' ? exports : root)[i] = a[i];
9
9
  }
10
- })(this, function() {
10
+ })(this, () => {
11
11
  return /******/ (() => { // webpackBootstrap
12
12
  var __webpack_exports__ = {};
13
13
 
@@ -1 +1 @@
1
- !function(e,o){"object"==typeof exports&&"object"==typeof module?module.exports=o():"function"==typeof define&&define.amd?define([],o):"object"==typeof exports?exports.AblyUi=o():(e.AblyUi=e.AblyUi||{},e.AblyUi.Core=e.AblyUi.Core||{},e.AblyUi.Core.SignOutLink=o())}(this,(function(){return{}.default}));
1
+ !function(e,o){"object"==typeof exports&&"object"==typeof module?module.exports=o():"function"==typeof define&&define.amd?define([],o):"object"==typeof exports?exports.AblyUi=o():(e.AblyUi=e.AblyUi||{},e.AblyUi.Core=e.AblyUi.Core||{},e.AblyUi.Core.SignOutLink=o())}(this,(()=>({}.default)));
@@ -7,22 +7,22 @@
7
7
  var a = typeof exports === 'object' ? factory(require("react"), require("prop-types")) : factory(root[undefined], root[undefined]);
8
8
  for(var i in a) (typeof exports === 'object' ? exports : root)[i] = a[i];
9
9
  }
10
- })(this, function(__WEBPACK_EXTERNAL_MODULE__9281__, __WEBPACK_EXTERNAL_MODULE__3474__) {
10
+ })(this, (__WEBPACK_EXTERNAL_MODULE__5225__, __WEBPACK_EXTERNAL_MODULE__6073__) => {
11
11
  return /******/ (() => { // webpackBootstrap
12
12
  /******/ "use strict";
13
13
  /******/ var __webpack_modules__ = ({
14
14
 
15
- /***/ 3474:
15
+ /***/ 6073:
16
16
  /***/ ((module) => {
17
17
 
18
- module.exports = __WEBPACK_EXTERNAL_MODULE__3474__;
18
+ module.exports = __WEBPACK_EXTERNAL_MODULE__6073__;
19
19
 
20
20
  /***/ }),
21
21
 
22
- /***/ 9281:
22
+ /***/ 5225:
23
23
  /***/ ((module) => {
24
24
 
25
- module.exports = __WEBPACK_EXTERNAL_MODULE__9281__;
25
+ module.exports = __WEBPACK_EXTERNAL_MODULE__5225__;
26
26
 
27
27
  /***/ })
28
28
 
@@ -101,9 +101,9 @@ __webpack_require__.r(__webpack_exports__);
101
101
  /* harmony export */ __webpack_require__.d(__webpack_exports__, {
102
102
  /* harmony export */ "default": () => (__WEBPACK_DEFAULT_EXPORT__)
103
103
  /* harmony export */ });
104
- /* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(9281);
104
+ /* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(5225);
105
105
  /* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
106
- /* harmony import */ var prop_types__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(3474);
106
+ /* harmony import */ var prop_types__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(6073);
107
107
  /* harmony import */ var prop_types__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(prop_types__WEBPACK_IMPORTED_MODULE_1__);
108
108
 
109
109
 
@@ -1 +1 @@
1
- !function(e,t){"object"==typeof exports&&"object"==typeof module?module.exports=t(require("lodash.throttle")):"function"==typeof define&&define.amd?define([],t):"object"==typeof exports?exports.AblyUi=t(require("lodash.throttle")):(e.AblyUi=e.AblyUi||{},e.AblyUi.Core=e.AblyUi.Core||{},e.AblyUi.Core.Slider=t(e[void 0]))}(this,(function(e){return(()=>{"use strict";var t={2040:t=>{t.exports=e}},n={};function r(e){var o=n[e];if(void 0!==o)return o.exports;var i=n[e]={exports:{}};return t[e](i,i.exports,r),i.exports}r.n=e=>{var t=e&&e.__esModule?()=>e.default:()=>e;return r.d(t,{a:t}),t},r.d=(e,t)=>{for(var n in t)r.o(t,n)&&!r.o(e,n)&&Object.defineProperty(e,n,{enumerable:!0,get:t[n]})},r.o=(e,t)=>Object.prototype.hasOwnProperty.call(e,t);var o={};return(()=>{r.d(o,{default:()=>a});var e=r(2040),t=r.n(e),n=function(e){var t=arguments.length>1&&void 0!==arguments[1]?arguments[1]:document;return t.querySelector("[data-id=".concat(e,"]"))},i=function(e){var t=arguments.length>1&&void 0!==arguments[1]?arguments[1]:document;return t.querySelectorAll("[data-id=".concat(e,"]"))},c=function(e){var t=n("slider-strip",e),r=Array.from(i("slider-slide",e)),o=n("slider-previous",e),c=n("slider-next",e),a=Array.from(i("slider-marker",e)),d=n("slider-controls",e);d.classList.replace("hidden","flex");var l=r.length,s=e.getBoundingClientRect().width,u=r[0].getBoundingClientRect(),f=u.width,v=u.left,h=r[1].getBoundingClientRect().left-v-f,p=(s-f)/2,y=0,m=0,x=function(e){return t.style.transform="translateX(".concat(function(e){return e*-f+p+e*-h}(e),"px)")},b=function(e){a.forEach((function(e){return e.classList.remove("text-active-orange")})),a[e].classList.remove("text-cool-black"),a[e].classList.add("text-active-orange")},g=function(){x(y=y-1<=0?0:y-1),b(y)},L=function(){x(y=y+1>=l?y:y+1),b(y)};return x(0),b(0),o.addEventListener("click",g),t.addEventListener("touchstart",(function(e){var t;m=null===(t=e.touches[0])||void 0===t?void 0:t.clientX})),t.addEventListener("touchend",(function(e){var t,n=(null===(t=e.changedTouches[0])||void 0===t?void 0:t.clientX)-m;Math.abs(n)<20||(n>0?g:L)()})),c.addEventListener("click",L),function(){t.style.transform=null,d.classList.replace("flex","hidden")}};const a=function(e){var n=e.container,r=e.mqEnableThreshold;if(n){var o=r||function(){return!window.matchMedia("(min-width: 48rem)").matches},i=function(){};o()&&(i=c(n)),window.addEventListener("resize",t()((function(){o()?i=c(n):i()}),100))}}})(),o.default})()}));
1
+ !function(e,t){"object"==typeof exports&&"object"==typeof module?module.exports=t(require("lodash.throttle")):"function"==typeof define&&define.amd?define([],t):"object"==typeof exports?exports.AblyUi=t(require("lodash.throttle")):(e.AblyUi=e.AblyUi||{},e.AblyUi.Core=e.AblyUi.Core||{},e.AblyUi.Core.Slider=t(e[void 0]))}(this,(e=>(()=>{"use strict";var t={7326:t=>{t.exports=e}},n={};function r(e){var o=n[e];if(void 0!==o)return o.exports;var i=n[e]={exports:{}};return t[e](i,i.exports,r),i.exports}r.n=e=>{var t=e&&e.__esModule?()=>e.default:()=>e;return r.d(t,{a:t}),t},r.d=(e,t)=>{for(var n in t)r.o(t,n)&&!r.o(e,n)&&Object.defineProperty(e,n,{enumerable:!0,get:t[n]})},r.o=(e,t)=>Object.prototype.hasOwnProperty.call(e,t);var o={};return(()=>{r.d(o,{default:()=>d});var e=r(7326),t=r.n(e),n=function(e){return(arguments.length>1&&void 0!==arguments[1]?arguments[1]:document).querySelector("[data-id=".concat(e,"]"))},i=function(e){return(arguments.length>1&&void 0!==arguments[1]?arguments[1]:document).querySelectorAll("[data-id=".concat(e,"]"))},c=function(e){var t=n("slider-strip",e),r=Array.from(i("slider-slide",e)),o=n("slider-previous",e),c=n("slider-next",e),d=Array.from(i("slider-marker",e)),l=n("slider-controls",e);l.classList.replace("hidden","flex");var a=r.length,s=e.getBoundingClientRect().width,u=r[0].getBoundingClientRect(),f=u.width,v=u.left,h=r[1].getBoundingClientRect().left-v-f,p=(s-f)/2,y=0,m=0,x=function(e){return t.style.transform="translateX(".concat(function(e){return e*-f+p+e*-h}(e),"px)")},b=function(e){d.forEach((function(e){return e.classList.remove("text-active-orange")})),d[e].classList.remove("text-cool-black"),d[e].classList.add("text-active-orange")},g=function(){x(y=y-1<=0?0:y-1),b(y)},L=function(){x(y=y+1>=a?y:y+1),b(y)};return x(0),b(0),o.addEventListener("click",g),t.addEventListener("touchstart",(function(e){var t;m=null===(t=e.touches[0])||void 0===t?void 0:t.clientX})),t.addEventListener("touchend",(function(e){var t,n=(null===(t=e.changedTouches[0])||void 0===t?void 0:t.clientX)-m;Math.abs(n)<20||(n>0?g:L)()})),c.addEventListener("click",L),function(){t.style.transform=null,l.classList.replace("flex","hidden")}};const d=function(e){var n=e.container,r=e.mqEnableThreshold;if(n){var o=r||function(){return!window.matchMedia("(min-width: 48rem)").matches},i=function(){};o()&&(i=c(n)),window.addEventListener("resize",t()((function(){o()?i=c(n):i()}),100))}}})(),o.default})()));
package/core/Slider.jsx CHANGED
@@ -7,7 +7,7 @@
7
7
  var a = typeof exports === 'object' ? factory(require("react"), require("prop-types"), require("lodash.throttle")) : factory(root[undefined], root[undefined], root[undefined]);
8
8
  for(var i in a) (typeof exports === 'object' ? exports : root)[i] = a[i];
9
9
  }
10
- })(this, function(__WEBPACK_EXTERNAL_MODULE__9281__, __WEBPACK_EXTERNAL_MODULE__3474__, __WEBPACK_EXTERNAL_MODULE__2040__) {
10
+ })(this, (__WEBPACK_EXTERNAL_MODULE__5225__, __WEBPACK_EXTERNAL_MODULE__6073__, __WEBPACK_EXTERNAL_MODULE__7326__) => {
11
11
  return /******/ (() => { // webpackBootstrap
12
12
  /******/ "use strict";
13
13
  /******/ var __webpack_modules__ = ({
@@ -18,9 +18,9 @@ return /******/ (() => { // webpackBootstrap
18
18
  /* harmony export */ __webpack_require__.d(__webpack_exports__, {
19
19
  /* harmony export */ "default": () => (__WEBPACK_DEFAULT_EXPORT__)
20
20
  /* harmony export */ });
21
- /* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(9281);
21
+ /* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(5225);
22
22
  /* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
23
- /* harmony import */ var prop_types__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(3474);
23
+ /* harmony import */ var prop_types__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(6073);
24
24
  /* harmony import */ var prop_types__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(prop_types__WEBPACK_IMPORTED_MODULE_1__);
25
25
  var _excluded = ["name", "size", "color", "additionalCSS"];
26
26
 
@@ -64,24 +64,24 @@ Icon.propTypes = {
64
64
 
65
65
  /***/ }),
66
66
 
67
- /***/ 2040:
67
+ /***/ 7326:
68
68
  /***/ ((module) => {
69
69
 
70
- module.exports = __WEBPACK_EXTERNAL_MODULE__2040__;
70
+ module.exports = __WEBPACK_EXTERNAL_MODULE__7326__;
71
71
 
72
72
  /***/ }),
73
73
 
74
- /***/ 3474:
74
+ /***/ 6073:
75
75
  /***/ ((module) => {
76
76
 
77
- module.exports = __WEBPACK_EXTERNAL_MODULE__3474__;
77
+ module.exports = __WEBPACK_EXTERNAL_MODULE__6073__;
78
78
 
79
79
  /***/ }),
80
80
 
81
- /***/ 9281:
81
+ /***/ 5225:
82
82
  /***/ ((module) => {
83
83
 
84
- module.exports = __WEBPACK_EXTERNAL_MODULE__9281__;
84
+ module.exports = __WEBPACK_EXTERNAL_MODULE__5225__;
85
85
 
86
86
  /***/ })
87
87
 
@@ -165,15 +165,15 @@ __webpack_require__.d(__webpack_exports__, {
165
165
  });
166
166
 
167
167
  // EXTERNAL MODULE: external {"commonjs":"react","commonjs2":"react"}
168
- var external_commonjs_react_commonjs2_react_ = __webpack_require__(9281);
168
+ var external_commonjs_react_commonjs2_react_ = __webpack_require__(5225);
169
169
  var external_commonjs_react_commonjs2_react_default = /*#__PURE__*/__webpack_require__.n(external_commonjs_react_commonjs2_react_);
170
170
  // EXTERNAL MODULE: external {"commonjs":"prop-types","commonjs2":"prop-types"}
171
- var external_commonjs_prop_types_commonjs2_prop_types_ = __webpack_require__(3474);
171
+ var external_commonjs_prop_types_commonjs2_prop_types_ = __webpack_require__(6073);
172
172
  var external_commonjs_prop_types_commonjs2_prop_types_default = /*#__PURE__*/__webpack_require__.n(external_commonjs_prop_types_commonjs2_prop_types_);
173
173
  // EXTERNAL MODULE: ./src/core/Icon/component.jsx
174
174
  var component = __webpack_require__(9008);
175
175
  // EXTERNAL MODULE: external {"commonjs":"lodash.throttle","commonjs2":"lodash.throttle"}
176
- var external_commonjs_lodash_throttle_commonjs2_lodash_throttle_ = __webpack_require__(2040);
176
+ var external_commonjs_lodash_throttle_commonjs2_lodash_throttle_ = __webpack_require__(7326);
177
177
  var external_commonjs_lodash_throttle_commonjs2_lodash_throttle_default = /*#__PURE__*/__webpack_require__.n(external_commonjs_lodash_throttle_commonjs2_lodash_throttle_);
178
178
  ;// CONCATENATED MODULE: ./src/core/dom-query.js
179
179
  var queryId = function queryId(val) {
@@ -356,7 +356,7 @@ var component_Slider = function Slider(_ref) {
356
356
  type: "button",
357
357
  className: "p-0 w-24 h-24 flex items-center focus:outline-gui-focus",
358
358
  "data-id": "slider-previous"
359
- }, /*#__PURE__*/external_commonjs_react_commonjs2_react_default().createElement(component.default, {
359
+ }, /*#__PURE__*/external_commonjs_react_commonjs2_react_default().createElement(component["default"], {
360
360
  name: "icon-gui-disclosure-arrow",
361
361
  size: "1.5rem",
362
362
  color: "text-cool-black",
@@ -375,7 +375,7 @@ var component_Slider = function Slider(_ref) {
375
375
  type: "button",
376
376
  className: "p-0 w-24 h-24 flex items-center focus:outline-gui-focus",
377
377
  "data-id": "slider-next"
378
- }, /*#__PURE__*/external_commonjs_react_commonjs2_react_default().createElement(component.default, {
378
+ }, /*#__PURE__*/external_commonjs_react_commonjs2_react_default().createElement(component["default"], {
379
379
  name: "icon-gui-disclosure-arrow",
380
380
  size: "1.5rem",
381
381
  color: "text-cool-black",
@@ -1 +1 @@
1
- !function(e,t){"object"==typeof exports&&"object"==typeof module?module.exports=t():"function"==typeof define&&define.amd?define([],t):"object"==typeof exports?exports.AblyUi=t():(e.AblyUi=e.AblyUi||{},e.AblyUi.Core=e.AblyUi.Core||{},e.AblyUi.Core.Uptime=t())}(this,(function(){return(()=>{"use strict";var e={};return e.default})()}));
1
+ !function(e,t){"object"==typeof exports&&"object"==typeof module?module.exports=t():"function"==typeof define&&define.amd?define([],t):"object"==typeof exports?exports.AblyUi=t():(e.AblyUi=e.AblyUi||{},e.AblyUi.Core=e.AblyUi.Core||{},e.AblyUi.Core.Uptime=t())}(this,(()=>(()=>{"use strict";var e={};return e.default})()));