@micromag/screen-urbania-trivia 0.3.100 → 0.3.106

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 (3) hide show
  1. package/es/index.js +17 -23
  2. package/lib/index.js +17 -24
  3. package/package.json +16 -16
package/es/index.js CHANGED
@@ -13,7 +13,7 @@ import { useScreenSize, useScreenRenderContext, useViewerNavigation } from '@mic
13
13
  import { useTrackScreenMedia, useLongPress, useResizeObserver } from '@micromag/core/hooks';
14
14
  import { isTextFilled } from '@micromag/core/utils';
15
15
  import Background from '@micromag/element-background';
16
- import CallToAction from '@micromag/element-call-to-action';
16
+ import '@micromag/element-call-to-action';
17
17
  import ClosedCaptions from '@micromag/element-closed-captions';
18
18
  import Container from '@micromag/element-container';
19
19
  import Heading from '@micromag/element-heading';
@@ -83,9 +83,9 @@ var UrbaniaTrivia = function UrbaniaTrivia(_ref) {
83
83
  title = _ref.title,
84
84
  video = _ref.video,
85
85
  gotoNextScreenOnEnd = _ref.gotoNextScreenOnEnd,
86
- background = _ref.background,
87
- callToAction = _ref.callToAction,
88
- current = _ref.current,
86
+ background = _ref.background;
87
+ _ref.callToAction;
88
+ var current = _ref.current,
89
89
  active = _ref.active,
90
90
  transitions = _ref.transitions,
91
91
  spacing = _ref.spacing,
@@ -112,8 +112,8 @@ var UrbaniaTrivia = function UrbaniaTrivia(_ref) {
112
112
 
113
113
  var hasTitle = isTextFilled(title);
114
114
  var backgroundPlaying = current && (isView || isEdit);
115
- var backgroundShouldLoad = current || active || !isView;
116
- var videoShouldLoad = current || active || !isView;
115
+ var backgroundShouldLoad = current || active;
116
+ var videoShouldLoad = current || active;
117
117
  var shouldGotoNextScreenOnEnd = gotoNextScreenOnEnd && isView && current;
118
118
 
119
119
  var _ref2 = title || {};
@@ -255,7 +255,6 @@ var UrbaniaTrivia = function UrbaniaTrivia(_ref) {
255
255
  onClick: onMouseMove
256
256
  });
257
257
  var fullscreen = layout === 'full';
258
- var hasCallToAction = callToAction !== null && callToAction.active === true;
259
258
 
260
259
  var _ref7 = background || {},
261
260
  _ref7$image = _ref7.image,
@@ -315,6 +314,7 @@ var UrbaniaTrivia = function UrbaniaTrivia(_ref) {
315
314
 
316
315
  var resizedVideoLeft = -(resizedVideoWidth - width) / 2; // const resizedVideoTop = -(resizedVideoHeight - videoMaxHeight) / 2;
317
316
 
317
+ var verticalVideo = resizedVideoHeight > resizedVideoWidth;
318
318
  var finalBackground = useMemo(function () {
319
319
  if (isArray(background) && background.length > 0) {
320
320
  return background;
@@ -350,7 +350,10 @@ var UrbaniaTrivia = function UrbaniaTrivia(_ref) {
350
350
  }, [setReady]);
351
351
  var visibleControls = !autoPlay && !playing || muted || showMediaControls;
352
352
  var items = [/*#__PURE__*/React.createElement(Container, {
353
- className: styles.itemsContainer
353
+ className: styles.itemsContainer,
354
+ style: {
355
+ marginTop: -spacing / 2
356
+ }
354
357
  }, /*#__PURE__*/React.createElement(ScreenElement, {
355
358
  key: "heading",
356
359
  className: styles.headingScreenElement,
@@ -454,20 +457,7 @@ var UrbaniaTrivia = function UrbaniaTrivia(_ref) {
454
457
  onToggleMute: onToggleMute,
455
458
  onSeek: onSeek,
456
459
  focusable: current && isView
457
- }) : null, hasCallToAction ? /*#__PURE__*/React.createElement("div", {
458
- style: {
459
- marginTop: -spacing / 2
460
- }
461
- }, /*#__PURE__*/React.createElement(CallToAction, {
462
- className: styles.callToAction,
463
- callToAction: callToAction,
464
- animationDisabled: isPreview,
465
- focusable: current && isView,
466
- screenSize: {
467
- width: width,
468
- height: height
469
- }
470
- })) : null))) : null) : null))];
460
+ }) : null))) : null) : null))];
471
461
  return /*#__PURE__*/React.createElement("div", Object.assign({
472
462
  className: classNames([styles.container, (_ref14 = {}, _defineProperty(_ref14, className, className !== null), _defineProperty(_ref14, styles.fullscreen, fullscreen), _ref14)]),
473
463
  "data-screen-ready": isStatic || isCapture || ready
@@ -491,7 +481,11 @@ var UrbaniaTrivia = function UrbaniaTrivia(_ref) {
491
481
  width: width,
492
482
  height: height
493
483
  }, /*#__PURE__*/React.createElement("div", {
494
- className: styles.content
484
+ className: styles.content,
485
+ style: verticalVideo ? {
486
+ justifyContent: 'flex-start',
487
+ marginTop: spacing * 2
488
+ } : null
495
489
  }, items)));
496
490
  };
497
491
 
package/lib/index.js CHANGED
@@ -17,7 +17,7 @@ var contexts = require('@micromag/core/contexts');
17
17
  var hooks = require('@micromag/core/hooks');
18
18
  var utils = require('@micromag/core/utils');
19
19
  var Background = require('@micromag/element-background');
20
- var CallToAction = require('@micromag/element-call-to-action');
20
+ require('@micromag/element-call-to-action');
21
21
  var ClosedCaptions = require('@micromag/element-closed-captions');
22
22
  var Container = require('@micromag/element-container');
23
23
  var Heading = require('@micromag/element-heading');
@@ -35,7 +35,6 @@ var isArray__default = /*#__PURE__*/_interopDefaultLegacy(isArray);
35
35
  var PropTypes__default = /*#__PURE__*/_interopDefaultLegacy(PropTypes);
36
36
  var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
37
37
  var Background__default = /*#__PURE__*/_interopDefaultLegacy(Background);
38
- var CallToAction__default = /*#__PURE__*/_interopDefaultLegacy(CallToAction);
39
38
  var ClosedCaptions__default = /*#__PURE__*/_interopDefaultLegacy(ClosedCaptions);
40
39
  var Container__default = /*#__PURE__*/_interopDefaultLegacy(Container);
41
40
  var Heading__default = /*#__PURE__*/_interopDefaultLegacy(Heading);
@@ -105,9 +104,9 @@ var UrbaniaTrivia = function UrbaniaTrivia(_ref) {
105
104
  title = _ref.title,
106
105
  video = _ref.video,
107
106
  gotoNextScreenOnEnd = _ref.gotoNextScreenOnEnd,
108
- background = _ref.background,
109
- callToAction = _ref.callToAction,
110
- current = _ref.current,
107
+ background = _ref.background;
108
+ _ref.callToAction;
109
+ var current = _ref.current,
111
110
  active = _ref.active,
112
111
  transitions = _ref.transitions,
113
112
  spacing = _ref.spacing,
@@ -134,8 +133,8 @@ var UrbaniaTrivia = function UrbaniaTrivia(_ref) {
134
133
 
135
134
  var hasTitle = utils.isTextFilled(title);
136
135
  var backgroundPlaying = current && (isView || isEdit);
137
- var backgroundShouldLoad = current || active || !isView;
138
- var videoShouldLoad = current || active || !isView;
136
+ var backgroundShouldLoad = current || active;
137
+ var videoShouldLoad = current || active;
139
138
  var shouldGotoNextScreenOnEnd = gotoNextScreenOnEnd && isView && current;
140
139
 
141
140
  var _ref2 = title || {};
@@ -277,7 +276,6 @@ var UrbaniaTrivia = function UrbaniaTrivia(_ref) {
277
276
  onClick: onMouseMove
278
277
  });
279
278
  var fullscreen = layout === 'full';
280
- var hasCallToAction = callToAction !== null && callToAction.active === true;
281
279
 
282
280
  var _ref7 = background || {},
283
281
  _ref7$image = _ref7.image,
@@ -337,6 +335,7 @@ var UrbaniaTrivia = function UrbaniaTrivia(_ref) {
337
335
 
338
336
  var resizedVideoLeft = -(resizedVideoWidth - width) / 2; // const resizedVideoTop = -(resizedVideoHeight - videoMaxHeight) / 2;
339
337
 
338
+ var verticalVideo = resizedVideoHeight > resizedVideoWidth;
340
339
  var finalBackground = React.useMemo(function () {
341
340
  if (isArray__default["default"](background) && background.length > 0) {
342
341
  return background;
@@ -372,7 +371,10 @@ var UrbaniaTrivia = function UrbaniaTrivia(_ref) {
372
371
  }, [setReady]);
373
372
  var visibleControls = !autoPlay && !playing || muted || showMediaControls;
374
373
  var items = [/*#__PURE__*/React__default["default"].createElement(Container__default["default"], {
375
- className: styles.itemsContainer
374
+ className: styles.itemsContainer,
375
+ style: {
376
+ marginTop: -spacing / 2
377
+ }
376
378
  }, /*#__PURE__*/React__default["default"].createElement(components.ScreenElement, {
377
379
  key: "heading",
378
380
  className: styles.headingScreenElement,
@@ -476,20 +478,7 @@ var UrbaniaTrivia = function UrbaniaTrivia(_ref) {
476
478
  onToggleMute: onToggleMute,
477
479
  onSeek: onSeek,
478
480
  focusable: current && isView
479
- }) : null, hasCallToAction ? /*#__PURE__*/React__default["default"].createElement("div", {
480
- style: {
481
- marginTop: -spacing / 2
482
- }
483
- }, /*#__PURE__*/React__default["default"].createElement(CallToAction__default["default"], {
484
- className: styles.callToAction,
485
- callToAction: callToAction,
486
- animationDisabled: isPreview,
487
- focusable: current && isView,
488
- screenSize: {
489
- width: width,
490
- height: height
491
- }
492
- })) : null))) : null) : null))];
481
+ }) : null))) : null) : null))];
493
482
  return /*#__PURE__*/React__default["default"].createElement("div", Object.assign({
494
483
  className: classNames__default["default"]([styles.container, (_ref14 = {}, _defineProperty__default["default"](_ref14, className, className !== null), _defineProperty__default["default"](_ref14, styles.fullscreen, fullscreen), _ref14)]),
495
484
  "data-screen-ready": isStatic || isCapture || ready
@@ -513,7 +502,11 @@ var UrbaniaTrivia = function UrbaniaTrivia(_ref) {
513
502
  width: width,
514
503
  height: height
515
504
  }, /*#__PURE__*/React__default["default"].createElement("div", {
516
- className: styles.content
505
+ className: styles.content,
506
+ style: verticalVideo ? {
507
+ justifyContent: 'flex-start',
508
+ marginTop: spacing * 2
509
+ } : null
517
510
  }, items)));
518
511
  };
519
512
 
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@micromag/screen-urbania-trivia",
3
- "version": "0.3.100",
3
+ "version": "0.3.106",
4
4
  "description": "",
5
5
  "keywords": [
6
6
  "javascript"
@@ -40,26 +40,26 @@
40
40
  "prepare": "../../scripts/prepare-package.sh"
41
41
  },
42
42
  "devDependencies": {
43
- "react": "^16.8.0 || ^17.0.0",
44
- "react-dom": "^16.8.0 || ^17.0.0"
43
+ "react": "^16.8.0 || ^17.0.0 || ^18.0.0",
44
+ "react-dom": "^16.8.0 || ^17.0.0 || ^18.0.0"
45
45
  },
46
46
  "peerDependencies": {
47
- "react": "^16.8.0 || ^17.0.0",
48
- "react-dom": "^16.8.0 || ^17.0.0"
47
+ "react": "^16.8.0 || ^17.0.0 || ^18.0.0",
48
+ "react-dom": "^16.8.0 || ^17.0.0 || ^18.0.0"
49
49
  },
50
50
  "dependencies": {
51
51
  "@babel/runtime": "^7.13.10",
52
52
  "@folklore/size": "^0.1.20",
53
- "@micromag/core": "^0.3.91",
54
- "@micromag/element-background": "^0.3.91",
55
- "@micromag/element-call-to-action": "^0.3.100",
56
- "@micromag/element-closed-captions": "^0.3.91",
57
- "@micromag/element-container": "^0.3.91",
58
- "@micromag/element-heading": "^0.3.91",
59
- "@micromag/element-image": "^0.3.91",
60
- "@micromag/element-media-controls": "^0.3.91",
61
- "@micromag/element-video": "^0.3.91",
62
- "@micromag/transforms": "^0.3.91",
53
+ "@micromag/core": "^0.3.106",
54
+ "@micromag/element-background": "^0.3.106",
55
+ "@micromag/element-call-to-action": "^0.3.106",
56
+ "@micromag/element-closed-captions": "^0.3.106",
57
+ "@micromag/element-container": "^0.3.106",
58
+ "@micromag/element-heading": "^0.3.106",
59
+ "@micromag/element-image": "^0.3.106",
60
+ "@micromag/element-media-controls": "^0.3.106",
61
+ "@micromag/element-video": "^0.3.106",
62
+ "@micromag/transforms": "^0.3.106",
63
63
  "classnames": "^2.2.6",
64
64
  "lodash": "^4.17.21",
65
65
  "prop-types": "^15.7.2",
@@ -69,5 +69,5 @@
69
69
  "publishConfig": {
70
70
  "access": "public"
71
71
  },
72
- "gitHead": "bd594780d88fcd716c2d7d3c0e735e29c14c64ce"
72
+ "gitHead": "865842ef7fbdc41f89dd0891857989ded63d44c4"
73
73
  }