@micromag/screen-keypad 0.3.700 → 0.3.703

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 (2) hide show
  1. package/es/index.js +81 -67
  2. package/package.json +18 -18
package/es/index.js CHANGED
@@ -4,7 +4,8 @@ import _slicedToArray from '@babel/runtime/helpers/slicedToArray';
4
4
  import _objectSpread from '@babel/runtime/helpers/objectSpread2';
5
5
  import { animated } from '@react-spring/web';
6
6
  import classNames from 'classnames';
7
- import { isString } from 'lodash';
7
+ import isEmpty from 'lodash/isEmpty';
8
+ import isString from 'lodash/isString';
8
9
  import PropTypes from 'prop-types';
9
10
  import React, { useRef, useMemo, useState, useCallback, useEffect } from 'react';
10
11
  import { PropTypes as PropTypes$1 } from '@micromag/core';
@@ -277,34 +278,47 @@ var KeypadScreen = function KeypadScreen(_ref) {
277
278
  _ref9$textStyle = _ref9.textStyle,
278
279
  popupHeadingTextStyle = _ref9$textStyle === void 0 ? null : _ref9$textStyle;
279
280
  var hasPopupContent = isTextFilled(popupContent);
280
- var _ref10 = popupContent || {},
281
- _ref10$textStyle = _ref10.textStyle,
282
- popupContentTextStyle = _ref10$textStyle === void 0 ? null : _ref10$textStyle;
283
- var _ref11 = popupButton || {},
284
- _ref11$label = _ref11.label,
285
- buttonLabel = _ref11$label === void 0 ? null : _ref11$label,
286
- _ref11$url = _ref11.url,
287
- buttonUrl = _ref11$url === void 0 ? null : _ref11$url,
288
- _ref11$inWebView = _ref11.inWebView,
289
- popupInWebView = _ref11$inWebView === void 0 ? false : _ref11$inWebView,
290
- _ref11$boxStyle = _ref11.boxStyle,
291
- popupButtonBoxStyle = _ref11$boxStyle === void 0 ? null : _ref11$boxStyle;
292
- var onItemClick = useCallback(function (e, item) {
281
+ var _ref0 = popupContent || {},
282
+ _ref0$textStyle = _ref0.textStyle,
283
+ popupContentTextStyle = _ref0$textStyle === void 0 ? null : _ref0$textStyle;
284
+ var _ref1 = popupButton || {},
285
+ _ref1$label = _ref1.label,
286
+ buttonLabel = _ref1$label === void 0 ? null : _ref1$label,
287
+ _ref1$url = _ref1.url,
288
+ buttonUrl = _ref1$url === void 0 ? null : _ref1$url,
289
+ _ref1$inWebView = _ref1.inWebView,
290
+ popupInWebView = _ref1$inWebView === void 0 ? false : _ref1$inWebView,
291
+ _ref1$boxStyle = _ref1.boxStyle,
292
+ popupButtonBoxStyle = _ref1$boxStyle === void 0 ? null : _ref1$boxStyle;
293
+ var onItemClick = useCallback(function (e, item, index) {
293
294
  e.stopPropagation();
294
- trackScreenEvent('click_item', item);
295
- var _ref12 = item || {},
296
- _ref12$inWebView = _ref12.inWebView,
297
- inWebView = _ref12$inWebView === void 0 ? false : _ref12$inWebView,
298
- _ref12$url = _ref12.url,
299
- url = _ref12$url === void 0 ? null : _ref12$url;
295
+ var _ref10 = item || {},
296
+ _ref10$label = _ref10.label,
297
+ itemLabel = _ref10$label === void 0 ? null : _ref10$label,
298
+ _ref10$heading = _ref10.heading,
299
+ heading = _ref10$heading === void 0 ? null : _ref10$heading,
300
+ _ref10$inWebView = _ref10.inWebView,
301
+ inWebView = _ref10$inWebView === void 0 ? false : _ref10$inWebView,
302
+ _ref10$url = _ref10.url,
303
+ url = _ref10$url === void 0 ? null : _ref10$url;
300
304
  if (inWebView && url !== null) {
301
305
  openWebView({
302
306
  url: url
303
307
  });
304
- return;
308
+ } else {
309
+ setPopup(item);
310
+ setShowPopup(true);
305
311
  }
306
- setPopup(item);
307
- setShowPopup(true);
312
+ var _ref11 = heading || {},
313
+ _ref11$body = _ref11.body,
314
+ headingBody = _ref11$body === void 0 ? null : _ref11$body;
315
+ var finalLabel = isString(itemLabel) ? itemLabel : (itemLabel || {}).body || null;
316
+ trackScreenEvent('click_item', ["#".concat(index + 1), finalLabel || headingBody || ''].filter(function (it) {
317
+ return !isEmpty(it);
318
+ }).join(' '), {
319
+ linkType: 'keypad_item',
320
+ linkUrl: url || null
321
+ });
308
322
  }, [setPopup, setShowPopup, trackScreenEvent, openWebView]);
309
323
  var onCloseModal = useCallback(function () {
310
324
  setShowPopup(false);
@@ -325,21 +339,21 @@ var KeypadScreen = function KeypadScreen(_ref) {
325
339
  _useState6 = _slicedToArray(_useState5, 2),
326
340
  popupDragDirection = _useState6[0],
327
341
  setPopupDragDirection = _useState6[1];
328
- var onPopupScrollHeightChange = useCallback(function (_ref13) {
329
- var _ref13$scrolleeHeight = _ref13.scrolleeHeight,
330
- scrolleeHeight = _ref13$scrolleeHeight === void 0 ? 0 : _ref13$scrolleeHeight;
342
+ var onPopupScrollHeightChange = useCallback(function (_ref12) {
343
+ var _ref12$scrolleeHeight = _ref12.scrolleeHeight,
344
+ scrolleeHeight = _ref12$scrolleeHeight === void 0 ? 0 : _ref12$scrolleeHeight;
331
345
  if (Math.floor(scrolleeHeight) >= Math.floor(height)) {
332
346
  setPopupDragDirection('top');
333
347
  } else {
334
348
  setPopupDragDirection('bottom');
335
349
  }
336
350
  }, [height]);
337
- var computePopupProgress = useCallback(function (_ref14) {
338
- var dragActive = _ref14.active,
339
- _ref14$movement = _slicedToArray(_ref14.movement, 2),
340
- my = _ref14$movement[1],
341
- _ref14$velocity = _slicedToArray(_ref14.velocity, 2),
342
- vy = _ref14$velocity[1];
351
+ var computePopupProgress = useCallback(function (_ref13) {
352
+ var dragActive = _ref13.active,
353
+ _ref13$movement = _slicedToArray(_ref13.movement, 2),
354
+ my = _ref13$movement[1],
355
+ _ref13$velocity = _slicedToArray(_ref13.velocity, 2),
356
+ vy = _ref13$velocity[1];
343
357
  var damper = 0.5;
344
358
  var delta = Math.abs(my) / window.innerHeight;
345
359
  var reachedThreshold = vy > 1 || delta > 0.3;
@@ -424,45 +438,45 @@ var KeypadScreen = function KeypadScreen(_ref) {
424
438
  };
425
439
  }, [showPopup, onCloseModal]);
426
440
  var gridItems = useMemo(function () {
427
- return (items === null || items.length === 0 ? placeholders : items).map(function (item) {
428
- var _ref15 = item || {},
429
- _ref15$id = _ref15.id,
430
- id = _ref15$id === void 0 ? null : _ref15$id,
431
- _ref15$label = _ref15.label,
432
- itemLabel = _ref15$label === void 0 ? null : _ref15$label,
433
- _ref15$visual = _ref15.visual,
434
- visual = _ref15$visual === void 0 ? null : _ref15$visual,
435
- _ref15$boxStyle = _ref15.boxStyle,
436
- boxStyle = _ref15$boxStyle === void 0 ? null : _ref15$boxStyle,
437
- _ref15$alignment = _ref15.alignment,
438
- alignment = _ref15$alignment === void 0 ? null : _ref15$alignment,
439
- _ref15$heading = _ref15.heading,
440
- heading = _ref15$heading === void 0 ? null : _ref15$heading,
441
- _ref15$content = _ref15.content,
442
- content = _ref15$content === void 0 ? null : _ref15$content,
441
+ return (items === null || items.length === 0 ? placeholders : items).map(function (item, index) {
442
+ var _ref14 = item || {},
443
+ _ref14$id = _ref14.id,
444
+ id = _ref14$id === void 0 ? null : _ref14$id,
445
+ _ref14$label = _ref14.label,
446
+ itemLabel = _ref14$label === void 0 ? null : _ref14$label,
447
+ _ref14$visual = _ref14.visual,
448
+ visual = _ref14$visual === void 0 ? null : _ref14$visual,
449
+ _ref14$boxStyle = _ref14.boxStyle,
450
+ boxStyle = _ref14$boxStyle === void 0 ? null : _ref14$boxStyle,
451
+ _ref14$alignment = _ref14.alignment,
452
+ alignment = _ref14$alignment === void 0 ? null : _ref14$alignment,
453
+ _ref14$heading = _ref14.heading,
454
+ heading = _ref14$heading === void 0 ? null : _ref14$heading,
455
+ _ref14$content = _ref14.content,
456
+ content = _ref14$content === void 0 ? null : _ref14$content,
457
+ _ref14$url = _ref14.url,
458
+ url = _ref14$url === void 0 ? null : _ref14$url,
459
+ _ref14$inWebView = _ref14.inWebView,
460
+ inWebView = _ref14$inWebView === void 0 ? false : _ref14$inWebView,
461
+ _ref14$largeVisual = _ref14.largeVisual,
462
+ popupLargeVisual = _ref14$largeVisual === void 0 ? null : _ref14$largeVisual;
463
+ var _ref15 = visual || {},
443
464
  _ref15$url = _ref15.url,
444
- url = _ref15$url === void 0 ? null : _ref15$url,
445
- _ref15$inWebView = _ref15.inWebView,
446
- inWebView = _ref15$inWebView === void 0 ? false : _ref15$inWebView,
447
- _ref15$largeVisual = _ref15.largeVisual,
448
- popupLargeVisual = _ref15$largeVisual === void 0 ? null : _ref15$largeVisual;
449
- var _ref16 = visual || {},
450
- _ref16$url = _ref16.url,
451
- visualUrl = _ref16$url === void 0 ? null : _ref16$url;
452
- var _ref17 = heading || {},
465
+ visualUrl = _ref15$url === void 0 ? null : _ref15$url;
466
+ var _ref16 = heading || {},
467
+ _ref16$body = _ref16.body,
468
+ headingBody = _ref16$body === void 0 ? null : _ref16$body;
469
+ var _ref17 = content || {},
453
470
  _ref17$body = _ref17.body,
454
- headingBody = _ref17$body === void 0 ? null : _ref17$body;
455
- var _ref18 = content || {},
456
- _ref18$body = _ref18.body,
457
- contentBody = _ref18$body === void 0 ? null : _ref18$body;
471
+ contentBody = _ref17$body === void 0 ? null : _ref17$body;
458
472
  var finalLabel = isString(itemLabel) ? {
459
473
  body: itemLabel
460
474
  } : itemLabel || {};
461
- var _ref19 = finalLabel || {},
462
- _ref19$body = _ref19.body,
463
- label = _ref19$body === void 0 ? null : _ref19$body,
464
- _ref19$textStyle = _ref19.textStyle,
465
- textStyle = _ref19$textStyle === void 0 ? null : _ref19$textStyle;
475
+ var _ref18 = finalLabel || {},
476
+ _ref18$body = _ref18.body,
477
+ label = _ref18$body === void 0 ? null : _ref18$body,
478
+ _ref18$textStyle = _ref18.textStyle,
479
+ textStyle = _ref18$textStyle === void 0 ? null : _ref18$textStyle;
466
480
  var key = label || visualUrl || id;
467
481
  var isEmpty = label === null && visual === null;
468
482
  var isExternalLink = url !== null && !inWebView;
@@ -477,7 +491,7 @@ var KeypadScreen = function KeypadScreen(_ref) {
477
491
  href: isExternalLink ? url : null,
478
492
  focusable: current,
479
493
  onClick: !isPopupEmpty || url !== null && !isExternalLink ? function (e) {
480
- return onItemClick(e, item);
494
+ return onItemClick(e, item, index);
481
495
  } : null
482
496
  }, /*#__PURE__*/React.createElement(ScreenElement, {
483
497
  emptyLabel: /*#__PURE__*/React.createElement(FormattedMessage, {
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@micromag/screen-keypad",
3
- "version": "0.3.700",
3
+ "version": "0.3.703",
4
4
  "private": false,
5
5
  "description": "",
6
6
  "keywords": [
@@ -65,22 +65,22 @@
65
65
  },
66
66
  "dependencies": {
67
67
  "@babel/runtime": "^7.13.10",
68
- "@micromag/core": "^0.3.679",
69
- "@micromag/element-background": "^0.3.700",
70
- "@micromag/element-button": "^0.3.679",
71
- "@micromag/element-call-to-action": "^0.3.679",
72
- "@micromag/element-container": "^0.3.679",
73
- "@micromag/element-footer": "^0.3.679",
74
- "@micromag/element-grid": "^0.3.679",
75
- "@micromag/element-header": "^0.3.679",
76
- "@micromag/element-heading": "^0.3.679",
77
- "@micromag/element-keypad": "^0.3.679",
78
- "@micromag/element-layout": "^0.3.679",
79
- "@micromag/element-scroll": "^0.3.679",
80
- "@micromag/element-text": "^0.3.679",
81
- "@micromag/element-urbania-author": "^0.3.679",
82
- "@micromag/element-visual": "^0.3.700",
83
- "@micromag/transforms": "^0.3.679",
68
+ "@micromag/core": "^0.3.703",
69
+ "@micromag/element-background": "^0.3.703",
70
+ "@micromag/element-button": "^0.3.703",
71
+ "@micromag/element-call-to-action": "^0.3.703",
72
+ "@micromag/element-container": "^0.3.703",
73
+ "@micromag/element-footer": "^0.3.703",
74
+ "@micromag/element-grid": "^0.3.703",
75
+ "@micromag/element-header": "^0.3.703",
76
+ "@micromag/element-heading": "^0.3.703",
77
+ "@micromag/element-keypad": "^0.3.703",
78
+ "@micromag/element-layout": "^0.3.703",
79
+ "@micromag/element-scroll": "^0.3.703",
80
+ "@micromag/element-text": "^0.3.703",
81
+ "@micromag/element-urbania-author": "^0.3.703",
82
+ "@micromag/element-visual": "^0.3.703",
83
+ "@micromag/transforms": "^0.3.703",
84
84
  "@react-spring/core": "^9.6.1",
85
85
  "@react-spring/web": "^9.6.1",
86
86
  "@use-gesture/react": "^10.3.0",
@@ -95,5 +95,5 @@
95
95
  "access": "public",
96
96
  "registry": "https://registry.npmjs.org/"
97
97
  },
98
- "gitHead": "b335d7d45cc5a556a4b4bb9c68e52809501cc6e1"
98
+ "gitHead": "15a0df01ed9d05f47a056fb2ff078aded803d33d"
99
99
  }