@micromag/screen-video 0.3.38 → 0.3.42

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 (4) hide show
  1. package/assets/css/styles.css +1 -1
  2. package/es/index.js +38 -6
  3. package/lib/index.js +38 -6
  4. package/package.json +11 -11
package/assets/css/styles.css CHANGED
@@ -1 +1 @@
1
- .micromag-screen-video-container .micromag-screen-video-content,.micromag-screen-video-container .micromag-screen-video-empty,.micromag-screen-video-container .micromag-screen-video-emptyContainer,.micromag-screen-video-container.micromag-screen-video-fullscreen .micromag-screen-video-image,.micromag-screen-video-container.micromag-screen-video-fullscreen .micromag-screen-video-placeholder,.micromag-screen-video-container.micromag-screen-video-fullscreen .micromag-screen-video-video{position:absolute;top:0;left:0;width:100%;height:100%}.micromag-screen-video-container{position:relative;width:100%;height:100%;overflow:hidden}.micromag-screen-video-disabled.micromag-screen-video-container{overflow:hidden;pointer-events:none}.micromag-screen-video-hidden.micromag-screen-video-container{display:none;visibility:hidden}.micromag-screen-video-placeholder.micromag-screen-video-container .micromag-screen-video-content{position:relative;padding:6px}.micromag-screen-video-container .micromag-screen-video-empty{margin:5px auto;border:2px dashed #343434;color:#343434}.micromag-screen-video-container .micromag-screen-video-emptyContainer{top:50%;height:0;padding-bottom:56.25%;-webkit-transform:translateY(-50%);-ms-transform:translateY(-50%);transform:translateY(-50%)}.micromag-screen-video-container .micromag-screen-video-empty{margin:0}.micromag-screen-video-container .micromag-screen-video-content{overflow:hidden}.micromag-screen-video-container .micromag-screen-video-bottom{-webkit-transition:opacity .15s linear;-o-transition:opacity .15s linear;transition:opacity .15s linear;opacity:0;background:-webkit-gradient(linear,left top, left bottom,from(rgba(0,0,0,0)),to(rgba(0,0,0,.4)));background:-o-linear-gradient(rgba(0,0,0,0),rgba(0,0,0,.4));background:linear-gradient(rgba(0,0,0,0),rgba(0,0,0,.4))}.micromag-screen-video-container .micromag-screen-video-bottom.micromag-screen-video-visible{opacity:1}.micromag-screen-video-container .micromag-screen-video-mediaControls{padding:10px 20px 20px}.micromag-screen-video-container .micromag-screen-video-placeholder{display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;-webkit-justify-content:center;-ms-flex-pack:center;justify-content:center;height:100%}.micromag-screen-video-container .micromag-screen-video-videoContainer{position:absolute}.micromag-screen-video-container .micromag-screen-video-bottomContent{position:absolute;bottom:0;width:100%}.micromag-screen-video-container.micromag-screen-video-fullscreen .micromag-screen-video-emptyContainer{top:0;height:100%;padding-bottom:0;-webkit-transform:none;-ms-transform:none;transform:none}
1
+ .micromag-screen-video-container .micromag-screen-video-content,.micromag-screen-video-container .micromag-screen-video-empty,.micromag-screen-video-container .micromag-screen-video-emptyContainer,.micromag-screen-video-container.micromag-screen-video-fullscreen .micromag-screen-video-image,.micromag-screen-video-container.micromag-screen-video-fullscreen .micromag-screen-video-placeholder,.micromag-screen-video-container.micromag-screen-video-fullscreen .micromag-screen-video-video{position:absolute;top:0;left:0;width:100%;height:100%}.micromag-screen-video-container{position:relative;width:100%;height:100%;overflow:hidden}.micromag-screen-video-disabled.micromag-screen-video-container{overflow:hidden;pointer-events:none}.micromag-screen-video-hidden.micromag-screen-video-container{display:none;visibility:hidden}.micromag-screen-video-placeholder.micromag-screen-video-container .micromag-screen-video-content{position:relative;padding:6px}.micromag-screen-video-container .micromag-screen-video-empty{margin:5px auto;border:2px dashed #343434;color:#343434}.micromag-screen-video-container .micromag-screen-video-emptyContainer{top:50%;height:0;padding-bottom:56.25%;-webkit-transform:translateY(-50%);-ms-transform:translateY(-50%);transform:translateY(-50%)}.micromag-screen-video-container .micromag-screen-video-empty{margin:0}.micromag-screen-video-container .micromag-screen-video-content{overflow:hidden}.micromag-screen-video-container .micromag-screen-video-callToAction{padding-bottom:5px}.micromag-screen-video-container .micromag-screen-video-bottom{-webkit-transition:opacity .15s linear;-o-transition:opacity .15s linear;transition:opacity .15s linear;opacity:0}.micromag-screen-video-container .micromag-screen-video-bottom.micromag-screen-video-visible{opacity:1}.micromag-screen-video-container .micromag-screen-video-bottom.micromag-screen-video-withGradient{background:-webkit-gradient(linear,left top, left bottom,from(rgba(0,0,0,0)),to(rgba(0,0,0,.4)));background:-o-linear-gradient(rgba(0,0,0,0),rgba(0,0,0,.4));background:linear-gradient(rgba(0,0,0,0),rgba(0,0,0,.4))}.micromag-screen-video-container .micromag-screen-video-mediaControls{padding:10px 20px 20px}.micromag-screen-video-container .micromag-screen-video-placeholder{display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;-webkit-justify-content:center;-ms-flex-pack:center;justify-content:center;height:100%}.micromag-screen-video-container .micromag-screen-video-videoContainer{position:absolute}.micromag-screen-video-container .micromag-screen-video-bottomContent{position:absolute;bottom:0;width:100%}.micromag-screen-video-container.micromag-screen-video-fullscreen .micromag-screen-video-emptyContainer{top:0;height:100%;padding-bottom:0;-webkit-transform:none;-ms-transform:none;transform:none}
package/es/index.js CHANGED
@@ -20,7 +20,7 @@ import Video from '@micromag/element-video';
20
20
  import _toConsumableArray from '@babel/runtime/helpers/toConsumableArray';
21
21
  import { Video as Video$1, Container as Container$1 } from '@micromag/transforms/apple-news';
22
22
 
23
- var styles = {"container":"micromag-screen-video-container","content":"micromag-screen-video-content","empty":"micromag-screen-video-empty","emptyContainer":"micromag-screen-video-emptyContainer","fullscreen":"micromag-screen-video-fullscreen","image":"micromag-screen-video-image","placeholder":"micromag-screen-video-placeholder","video":"micromag-screen-video-video","disabled":"micromag-screen-video-disabled","hidden":"micromag-screen-video-hidden","bottom":"micromag-screen-video-bottom","visible":"micromag-screen-video-visible","mediaControls":"micromag-screen-video-mediaControls","videoContainer":"micromag-screen-video-videoContainer","bottomContent":"micromag-screen-video-bottomContent"};
23
+ var styles = {"container":"micromag-screen-video-container","content":"micromag-screen-video-content","empty":"micromag-screen-video-empty","emptyContainer":"micromag-screen-video-emptyContainer","fullscreen":"micromag-screen-video-fullscreen","image":"micromag-screen-video-image","placeholder":"micromag-screen-video-placeholder","video":"micromag-screen-video-video","disabled":"micromag-screen-video-disabled","hidden":"micromag-screen-video-hidden","callToAction":"micromag-screen-video-callToAction","bottom":"micromag-screen-video-bottom","visible":"micromag-screen-video-visible","withGradient":"micromag-screen-video-withGradient","mediaControls":"micromag-screen-video-mediaControls","videoContainer":"micromag-screen-video-videoContainer","bottomContent":"micromag-screen-video-bottomContent"};
24
24
 
25
25
  var propTypes = {
26
26
  layout: PropTypes.oneOf(['middle', 'full']),
@@ -50,7 +50,7 @@ var defaultProps = {
50
50
  };
51
51
 
52
52
  var VideoScreen = function VideoScreen(_ref) {
53
- var _ref10;
53
+ var _ref8, _ref10;
54
54
 
55
55
  var layout = _ref.layout,
56
56
  video = _ref.video,
@@ -343,7 +343,7 @@ var VideoScreen = function VideoScreen(_ref) {
343
343
  media: closedCaptions,
344
344
  currentTime: currentTime
345
345
  }) : null, /*#__PURE__*/React.createElement("div", {
346
- className: classNames([styles.bottom, _defineProperty({}, styles.visible, visibleControls)])
346
+ className: classNames([styles.bottom, (_ref8 = {}, _defineProperty(_ref8, styles.visible, visibleControls), _defineProperty(_ref8, styles.withGradient, withSeekBar || withPlayPause || muted), _ref8)])
347
347
  }, hasVideoUrl ? /*#__PURE__*/React.createElement(MediaControls, {
348
348
  className: classNames([styles.mediaControls, _defineProperty({}, styles.visible, visibleControls)]),
349
349
  withSeekBar: withSeekBar,
@@ -359,12 +359,17 @@ var VideoScreen = function VideoScreen(_ref) {
359
359
  focusable: current && isView
360
360
  }) : null, hasCallToAction ? /*#__PURE__*/React.createElement("div", {
361
361
  style: {
362
- marginTop: -spacing
362
+ marginTop: -spacing / 2
363
363
  }
364
364
  }, /*#__PURE__*/React.createElement(CallToAction, {
365
+ className: styles.callToAction,
365
366
  callToAction: callToAction,
366
367
  animationDisabled: isPreview,
367
- focusable: current && isView
368
+ focusable: current && isView,
369
+ screenSize: {
370
+ width: width,
371
+ height: height
372
+ }
368
373
  })) : null))) : null];
369
374
  return /*#__PURE__*/React.createElement("div", Object.assign({
370
375
  className: classNames([styles.container, (_ref10 = {}, _defineProperty(_ref10, className, className !== null), _defineProperty(_ref10, styles.fullscreen, fullscreen), _ref10)]),
@@ -497,7 +502,34 @@ var definition = {
497
502
  textStyle: 'heading2'
498
503
  }
499
504
  }
500
- }]
505
+ } // {
506
+ // type: 'fields',
507
+ // isList: true,
508
+ // label: defineMessage({
509
+ // defaultMessage: 'Addons',
510
+ // description: 'Addons field label',
511
+ // }),
512
+ // fields: [
513
+ // {
514
+ // name: 'callToAction',
515
+ // type: 'call-to-action-form',
516
+ // label: defineMessage({
517
+ // defaultMessage: 'Call to action',
518
+ // description: 'Cta field label',
519
+ // }),
520
+ // isHorizontal: true,
521
+ // // isList: true,
522
+ // // isFlushList: true,
523
+ // // defaultValue: null,
524
+ // // theme: {
525
+ // // label: {
526
+ // // textStyle: 'heading2',
527
+ // // },
528
+ // // },
529
+ // },
530
+ // ],
531
+ // },
532
+ ]
501
533
  };
502
534
 
503
535
  export { VideoScreen$1 as VideoScreen, definition as default };
package/lib/index.js CHANGED
@@ -41,7 +41,7 @@ var MediaControls__default = /*#__PURE__*/_interopDefaultLegacy(MediaControls);
41
41
  var Video__default = /*#__PURE__*/_interopDefaultLegacy(Video);
42
42
  var _toConsumableArray__default = /*#__PURE__*/_interopDefaultLegacy(_toConsumableArray);
43
43
 
44
- var styles = {"container":"micromag-screen-video-container","content":"micromag-screen-video-content","empty":"micromag-screen-video-empty","emptyContainer":"micromag-screen-video-emptyContainer","fullscreen":"micromag-screen-video-fullscreen","image":"micromag-screen-video-image","placeholder":"micromag-screen-video-placeholder","video":"micromag-screen-video-video","disabled":"micromag-screen-video-disabled","hidden":"micromag-screen-video-hidden","bottom":"micromag-screen-video-bottom","visible":"micromag-screen-video-visible","mediaControls":"micromag-screen-video-mediaControls","videoContainer":"micromag-screen-video-videoContainer","bottomContent":"micromag-screen-video-bottomContent"};
44
+ var styles = {"container":"micromag-screen-video-container","content":"micromag-screen-video-content","empty":"micromag-screen-video-empty","emptyContainer":"micromag-screen-video-emptyContainer","fullscreen":"micromag-screen-video-fullscreen","image":"micromag-screen-video-image","placeholder":"micromag-screen-video-placeholder","video":"micromag-screen-video-video","disabled":"micromag-screen-video-disabled","hidden":"micromag-screen-video-hidden","callToAction":"micromag-screen-video-callToAction","bottom":"micromag-screen-video-bottom","visible":"micromag-screen-video-visible","withGradient":"micromag-screen-video-withGradient","mediaControls":"micromag-screen-video-mediaControls","videoContainer":"micromag-screen-video-videoContainer","bottomContent":"micromag-screen-video-bottomContent"};
45
45
 
46
46
  var propTypes = {
47
47
  layout: PropTypes__default["default"].oneOf(['middle', 'full']),
@@ -71,7 +71,7 @@ var defaultProps = {
71
71
  };
72
72
 
73
73
  var VideoScreen = function VideoScreen(_ref) {
74
- var _ref10;
74
+ var _ref8, _ref10;
75
75
 
76
76
  var layout = _ref.layout,
77
77
  video = _ref.video,
@@ -364,7 +364,7 @@ var VideoScreen = function VideoScreen(_ref) {
364
364
  media: closedCaptions,
365
365
  currentTime: currentTime
366
366
  }) : null, /*#__PURE__*/React__default["default"].createElement("div", {
367
- className: classNames__default["default"]([styles.bottom, _defineProperty__default["default"]({}, styles.visible, visibleControls)])
367
+ className: classNames__default["default"]([styles.bottom, (_ref8 = {}, _defineProperty__default["default"](_ref8, styles.visible, visibleControls), _defineProperty__default["default"](_ref8, styles.withGradient, withSeekBar || withPlayPause || muted), _ref8)])
368
368
  }, hasVideoUrl ? /*#__PURE__*/React__default["default"].createElement(MediaControls__default["default"], {
369
369
  className: classNames__default["default"]([styles.mediaControls, _defineProperty__default["default"]({}, styles.visible, visibleControls)]),
370
370
  withSeekBar: withSeekBar,
@@ -380,12 +380,17 @@ var VideoScreen = function VideoScreen(_ref) {
380
380
  focusable: current && isView
381
381
  }) : null, hasCallToAction ? /*#__PURE__*/React__default["default"].createElement("div", {
382
382
  style: {
383
- marginTop: -spacing
383
+ marginTop: -spacing / 2
384
384
  }
385
385
  }, /*#__PURE__*/React__default["default"].createElement(CallToAction__default["default"], {
386
+ className: styles.callToAction,
386
387
  callToAction: callToAction,
387
388
  animationDisabled: isPreview,
388
- focusable: current && isView
389
+ focusable: current && isView,
390
+ screenSize: {
391
+ width: width,
392
+ height: height
393
+ }
389
394
  })) : null))) : null];
390
395
  return /*#__PURE__*/React__default["default"].createElement("div", Object.assign({
391
396
  className: classNames__default["default"]([styles.container, (_ref10 = {}, _defineProperty__default["default"](_ref10, className, className !== null), _defineProperty__default["default"](_ref10, styles.fullscreen, fullscreen), _ref10)]),
@@ -518,7 +523,34 @@ var definition = {
518
523
  textStyle: 'heading2'
519
524
  }
520
525
  }
521
- }]
526
+ } // {
527
+ // type: 'fields',
528
+ // isList: true,
529
+ // label: defineMessage({
530
+ // defaultMessage: 'Addons',
531
+ // description: 'Addons field label',
532
+ // }),
533
+ // fields: [
534
+ // {
535
+ // name: 'callToAction',
536
+ // type: 'call-to-action-form',
537
+ // label: defineMessage({
538
+ // defaultMessage: 'Call to action',
539
+ // description: 'Cta field label',
540
+ // }),
541
+ // isHorizontal: true,
542
+ // // isList: true,
543
+ // // isFlushList: true,
544
+ // // defaultValue: null,
545
+ // // theme: {
546
+ // // label: {
547
+ // // textStyle: 'heading2',
548
+ // // },
549
+ // // },
550
+ // },
551
+ // ],
552
+ // },
553
+ ]
522
554
  };
523
555
 
524
556
  exports.VideoScreen = VideoScreen$1;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@micromag/screen-video",
3
- "version": "0.3.38",
3
+ "version": "0.3.42",
4
4
  "description": "",
5
5
  "keywords": [
6
6
  "javascript"
@@ -50,15 +50,15 @@
50
50
  "dependencies": {
51
51
  "@babel/runtime": "^7.13.10",
52
52
  "@folklore/size": "^0.1.15",
53
- "@micromag/core": "^0.3.36",
54
- "@micromag/element-background": "^0.3.38",
55
- "@micromag/element-call-to-action": "^0.3.36",
56
- "@micromag/element-closed-captions": "^0.3.36",
57
- "@micromag/element-container": "^0.3.36",
58
- "@micromag/element-image": "^0.3.36",
59
- "@micromag/element-media-controls": "^0.3.36",
60
- "@micromag/element-video": "^0.3.38",
61
- "@micromag/transforms": "^0.3.36",
53
+ "@micromag/core": "^0.3.42",
54
+ "@micromag/element-background": "^0.3.42",
55
+ "@micromag/element-call-to-action": "^0.3.42",
56
+ "@micromag/element-closed-captions": "^0.3.42",
57
+ "@micromag/element-container": "^0.3.42",
58
+ "@micromag/element-image": "^0.3.42",
59
+ "@micromag/element-media-controls": "^0.3.42",
60
+ "@micromag/element-video": "^0.3.42",
61
+ "@micromag/transforms": "^0.3.42",
62
62
  "classnames": "^2.2.6",
63
63
  "lodash": "^4.17.21",
64
64
  "prop-types": "^15.7.2",
@@ -68,5 +68,5 @@
68
68
  "publishConfig": {
69
69
  "access": "public"
70
70
  },
71
- "gitHead": "baf0eaac0b23e2b24d43d3518d64be1072538962"
71
+ "gitHead": "a80c775c071fffda13172464ce19db2c46c520a2"
72
72
  }