@micromag/screen-urbania-article 0.3.86 → 0.3.90

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 +61 -27
  3. package/lib/index.js +60 -26
  4. package/package.json +14 -14
package/assets/css/styles.css CHANGED
@@ -1 +1 @@
1
- .micromag-screen-urbania-article-container .micromag-screen-urbania-article-empty,.micromag-screen-urbania-article-container.micromag-screen-urbania-article-isVideo .micromag-screen-urbania-article-video,.micromag-screen-urbania-article-container .micromag-screen-urbania-article-video{position:absolute;top:0;left:0;width:100%;height:100%}.micromag-screen-urbania-article-container{position:relative;width:100%;height:100%;overflow:hidden}.micromag-screen-urbania-article-disabled.micromag-screen-urbania-article-container{overflow:hidden;pointer-events:none}.micromag-screen-urbania-article-hidden.micromag-screen-urbania-article-container{display:none;visibility:hidden}.micromag-screen-urbania-article-placeholder.micromag-screen-urbania-article-container .micromag-screen-urbania-article-content{position:relative;padding:6px}.micromag-screen-urbania-article-container .micromag-screen-urbania-article-empty{margin:5px auto;border:2px dashed #343434;color:#343434}.micromag-screen-urbania-article-container .micromag-screen-urbania-article-placeholder{background-color:#6c6c6c}.micromag-screen-urbania-article-container .micromag-screen-urbania-article-emptyContainer{width:100%;height:0;margin-bottom:10px;padding-bottom:20%;-webkit-transform:translateY(0);-ms-transform:translateY(0);transform:translateY(0)}.micromag-screen-urbania-article-container .micromag-screen-urbania-article-emptyContainer.micromag-screen-urbania-article-small{padding-bottom:15%}.micromag-screen-urbania-article-container .micromag-screen-urbania-article-empty{margin:0}.micromag-screen-urbania-article-container .micromag-screen-urbania-article-inner{height:100%}.micromag-screen-urbania-article-container .micromag-screen-urbania-article-content,.micromag-screen-urbania-article-container .micromag-screen-urbania-article-inner{display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;width:100%}.micromag-screen-urbania-article-container .micromag-screen-urbania-article-content{z-index:1;-webkit-align-items:center;-ms-flex-align:center;align-items:center;-webkit-justify-content:center;-ms-flex-pack:center;justify-content:center;color:#222;text-align:center}.micromag-screen-urbania-article-container .micromag-screen-urbania-article-content .micromag-screen-urbania-article-authors,.micromag-screen-urbania-article-container .micromag-screen-urbania-article-content .micromag-screen-urbania-article-overTitle,.micromag-screen-urbania-article-container .micromag-screen-urbania-article-content .micromag-screen-urbania-article-title{padding:10px}.micromag-screen-urbania-article-container .micromag-screen-urbania-article-content .micromag-screen-urbania-article-overTitle{margin-bottom:10px;padding:30px 0 2px;border-bottom:1px solid;font-family:Agrandir Grand;font-size:10px;font-weight:500;letter-spacing:.1em;text-transform:uppercase}.micromag-screen-urbania-article-container .micromag-screen-urbania-article-content .micromag-screen-urbania-article-title{font-family:GarageGothic-Bold;text-transform:uppercase}.micromag-screen-urbania-article-container .micromag-screen-urbania-article-content .micromag-screen-urbania-article-authors{margin-bottom:10px}.micromag-screen-urbania-article-container .micromag-screen-urbania-article-content .micromag-screen-urbania-article-sponsors{display:inline-block;width:100%;margin-top:auto;padding:0 10px 4px;background-color:#222;color:#ff0;letter-spacing:.04em}.micromag-screen-urbania-article-container .micromag-screen-urbania-article-content .micromag-screen-urbania-article-sponsor{display:inline;font-family:Agrandir;font-size:9px;font-weight:400;line-height:1;text-transform:uppercase}.micromag-screen-urbania-article-container .micromag-screen-urbania-article-content.micromag-screen-urbania-article-quatre95{background-color:#fff}.micromag-screen-urbania-article-container .micromag-screen-urbania-article-content.micromag-screen-urbania-article-quatre95 .micromag-screen-urbania-article-author{color:#5e79ff}.micromag-screen-urbania-article-container .micromag-screen-urbania-article-content.micromag-screen-urbania-article-quatre95 .micromag-screen-urbania-article-sponsors,.micromag-screen-urbania-article-container .micromag-screen-urbania-article-content.micromag-screen-urbania-article-urbania{background-color:#ff0;color:#222}.micromag-screen-urbania-article-container .micromag-screen-urbania-article-content.micromag-screen-urbania-article-urbania .micromag-screen-urbania-article-author{color:#222}.micromag-screen-urbania-article-container .micromag-screen-urbania-article-content.micromag-screen-urbania-article-dehors{background-color:#00c693;color:#ffeada}.micromag-screen-urbania-article-container .micromag-screen-urbania-article-content.micromag-screen-urbania-article-dehors .micromag-screen-urbania-article-author{color:#ffeada}.micromag-screen-urbania-article-container .micromag-screen-urbania-article-callToAction{position:absolute;z-index:10;right:0;bottom:0;left:0;padding-bottom:5px;vertical-align:middle}.micromag-screen-urbania-article-container .micromag-screen-urbania-article-callToAction .micromag-screen-urbania-article-arrow{margin-bottom:5px;opacity:.95}.micromag-screen-urbania-article-container .micromag-screen-urbania-article-callToAction .micromag-screen-urbania-article-icon{display:inline-block;margin-top:-3px;margin-right:3px;padding:1px}.micromag-screen-urbania-article-container .micromag-screen-urbania-article-mediaControls{padding:10px 20px 20px}.micromag-screen-urbania-article-container .micromag-screen-urbania-article-placeholder{display:block}.micromag-screen-urbania-article-container .micromag-screen-urbania-article-videoContainer{position:absolute}.micromag-screen-urbania-article-container .micromag-screen-urbania-article-bottomContent{position:absolute;bottom:0;width:100%}.micromag-screen-urbania-article-container .micromag-screen-urbania-article-bottom{-webkit-transition:opacity .15s linear;-o-transition:opacity .15s linear;transition:opacity .15s linear;opacity:0}.micromag-screen-urbania-article-container .micromag-screen-urbania-article-bottom.micromag-screen-urbania-article-visible{opacity:1}.micromag-screen-urbania-article-container .micromag-screen-urbania-article-bottom.micromag-screen-urbania-article-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-urbania-article-container.micromag-screen-urbania-article-isPlaceholder .micromag-screen-urbania-article-content{width:80%;height:35%;margin:5px auto;background-color:rgba(0,0,0,0);background-color:#2b2b2b}.micromag-screen-urbania-article-container.micromag-screen-urbania-article-isPlaceholder .micromag-screen-urbania-article-visual{position:relative;-webkit-flex-grow:1;-ms-flex-positive:1;flex-grow:1;width:80%;height:50%;margin:5px auto}.micromag-screen-urbania-article-container.micromag-screen-urbania-article-isVideo .micromag-screen-urbania-article-content{-webkit-flex-grow:1;-ms-flex-positive:1;flex-grow:1;-webkit-justify-content:flex-end;-ms-flex-pack:end;justify-content:flex-end;margin-bottom:10px;background-color:rgba(0,0,0,0)}.micromag-screen-urbania-article-container.micromag-screen-urbania-article-isVideo .micromag-screen-urbania-article-content .micromag-screen-urbania-article-overTitle{margin-bottom:auto}.micromag-screen-urbania-article-container.micromag-screen-urbania-article-isVideo .micromag-screen-urbania-article-content .micromag-screen-urbania-article-title{color:#fff;text-shadow:2px 2px 0 #222}.micromag-screen-urbania-article-container.micromag-screen-urbania-article-isVideo .micromag-screen-urbania-article-content .micromag-screen-urbania-article-sponsors{margin-top:0}.micromag-screen-urbania-article-container.micromag-screen-urbania-article-isVideo .micromag-screen-urbania-article-emptyContainer{top:0;height:100%;padding-bottom:0;-webkit-transform:none;-ms-transform:none;transform:none}.micromag-screen-urbania-article-container.micromag-screen-urbania-article-isVideo .micromag-screen-urbania-article-callToAction{position:relative}
1
+ .micromag-screen-urbania-article-container .micromag-screen-urbania-article-empty,.micromag-screen-urbania-article-container.micromag-screen-urbania-article-isVideo .micromag-screen-urbania-article-video,.micromag-screen-urbania-article-container .micromag-screen-urbania-article-video{position:absolute;top:0;left:0;width:100%;height:100%}.micromag-screen-urbania-article-container{position:relative;width:100%;height:100%;overflow:hidden}.micromag-screen-urbania-article-disabled.micromag-screen-urbania-article-container{overflow:hidden;pointer-events:none}.micromag-screen-urbania-article-hidden.micromag-screen-urbania-article-container{display:none;visibility:hidden}.micromag-screen-urbania-article-placeholder.micromag-screen-urbania-article-container .micromag-screen-urbania-article-content{position:relative;padding:6px}.micromag-screen-urbania-article-container .micromag-screen-urbania-article-empty{margin:5px auto;border:2px dashed #343434;color:#343434}.micromag-screen-urbania-article-container .micromag-screen-urbania-article-placeholder{background-color:#6c6c6c}.micromag-screen-urbania-article-container .micromag-screen-urbania-article-emptyContainer{width:100%;height:0;margin-bottom:10px;padding-bottom:20%;-webkit-transform:translateY(0);-ms-transform:translateY(0);transform:translateY(0)}.micromag-screen-urbania-article-container .micromag-screen-urbania-article-emptyContainer.micromag-screen-urbania-article-small{padding-bottom:15%}.micromag-screen-urbania-article-container .micromag-screen-urbania-article-empty{margin:0}.micromag-screen-urbania-article-container .micromag-screen-urbania-article-inner{height:100%}.micromag-screen-urbania-article-container .micromag-screen-urbania-article-content,.micromag-screen-urbania-article-container .micromag-screen-urbania-article-inner{display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;width:100%}.micromag-screen-urbania-article-container .micromag-screen-urbania-article-content{z-index:1;-webkit-align-items:center;-ms-flex-align:center;align-items:center;-webkit-justify-content:center;-ms-flex-pack:center;justify-content:center;overflow:hidden;color:#222;text-align:center}.micromag-screen-urbania-article-container .micromag-screen-urbania-article-content .micromag-screen-urbania-article-authors,.micromag-screen-urbania-article-container .micromag-screen-urbania-article-content .micromag-screen-urbania-article-overTitle,.micromag-screen-urbania-article-container .micromag-screen-urbania-article-content .micromag-screen-urbania-article-title{padding:8px 20px}.micromag-screen-urbania-article-container .micromag-screen-urbania-article-content .micromag-screen-urbania-article-overTitle{margin-bottom:10px;padding:30px 0 2px;border-bottom:1px solid;font-family:Agrandir Grand;font-size:10px;font-weight:500;letter-spacing:.1em;text-transform:uppercase}.micromag-screen-urbania-article-container .micromag-screen-urbania-article-content .micromag-screen-urbania-article-title{font-family:GarageGothic-Bold;text-transform:uppercase}.micromag-screen-urbania-article-container .micromag-screen-urbania-article-content .micromag-screen-urbania-article-authors{margin-bottom:8px}.micromag-screen-urbania-article-container .micromag-screen-urbania-article-content .micromag-screen-urbania-article-sponsors{display:inline-block;width:100%;margin-top:auto;padding:0 10px 4px;background-color:#ff0;color:#222;letter-spacing:.04em;line-height:1}.micromag-screen-urbania-article-container .micromag-screen-urbania-article-content .micromag-screen-urbania-article-sponsor{display:inline;font-family:Agrandir;font-size:9px;font-weight:400;line-height:1;text-transform:uppercase}.micromag-screen-urbania-article-container .micromag-screen-urbania-article-content.micromag-screen-urbania-article-quatre95{background-color:#fff}.micromag-screen-urbania-article-container .micromag-screen-urbania-article-content.micromag-screen-urbania-article-quatre95 .micromag-screen-urbania-article-author{color:#5e79ff}.micromag-screen-urbania-article-container .micromag-screen-urbania-article-content.micromag-screen-urbania-article-quatre95 .micromag-screen-urbania-article-sponsors,.micromag-screen-urbania-article-container .micromag-screen-urbania-article-content.micromag-screen-urbania-article-urbania{background-color:#ff0;color:#222}.micromag-screen-urbania-article-container .micromag-screen-urbania-article-content.micromag-screen-urbania-article-urbania .micromag-screen-urbania-article-author{color:#222}.micromag-screen-urbania-article-container .micromag-screen-urbania-article-content.micromag-screen-urbania-article-urbania .micromag-screen-urbania-article-sponsors{background-color:#222;color:#ff0}.micromag-screen-urbania-article-container .micromag-screen-urbania-article-content.micromag-screen-urbania-article-dehors{background-color:#00c693;color:#ffeada}.micromag-screen-urbania-article-container .micromag-screen-urbania-article-content.micromag-screen-urbania-article-dehors .micromag-screen-urbania-article-author{color:#ffeada}.micromag-screen-urbania-article-container .micromag-screen-urbania-article-content.micromag-screen-urbania-article-universities{background-color:#fff;color:#f33}.micromag-screen-urbania-article-container .micromag-screen-urbania-article-content.micromag-screen-urbania-article-universities .micromag-screen-urbania-article-overTitle{color:#222}.micromag-screen-urbania-article-container .micromag-screen-urbania-article-callToAction{position:absolute;z-index:10;right:0;bottom:0;left:0;padding-bottom:5px;vertical-align:middle}.micromag-screen-urbania-article-container .micromag-screen-urbania-article-callToAction .micromag-screen-urbania-article-arrow{margin-bottom:5px;opacity:.95}.micromag-screen-urbania-article-container .micromag-screen-urbania-article-callToAction .micromag-screen-urbania-article-icon{display:inline-block;margin-top:-3px;margin-right:3px;padding:1px}.micromag-screen-urbania-article-container .micromag-screen-urbania-article-mediaControls{padding:10px 20px 20px}.micromag-screen-urbania-article-container .micromag-screen-urbania-article-placeholder{display:block}.micromag-screen-urbania-article-container .micromag-screen-urbania-article-videoContainer{position:absolute}.micromag-screen-urbania-article-container .micromag-screen-urbania-article-bottomContent{position:absolute;bottom:0;width:100%}.micromag-screen-urbania-article-container .micromag-screen-urbania-article-bottom{-webkit-transition:opacity .15s linear;-o-transition:opacity .15s linear;transition:opacity .15s linear;opacity:0}.micromag-screen-urbania-article-container .micromag-screen-urbania-article-bottom.micromag-screen-urbania-article-visible{opacity:1}.micromag-screen-urbania-article-container .micromag-screen-urbania-article-bottom.micromag-screen-urbania-article-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-urbania-article-container.micromag-screen-urbania-article-isPlaceholder .micromag-screen-urbania-article-content{width:80%;height:35%;margin:5px auto;background-color:rgba(0,0,0,0);background-color:#2b2b2b}.micromag-screen-urbania-article-container.micromag-screen-urbania-article-isPlaceholder .micromag-screen-urbania-article-visual{position:relative;-webkit-flex-grow:1;-ms-flex-positive:1;flex-grow:1;width:80%;height:50%;margin:5px auto}.micromag-screen-urbania-article-container.micromag-screen-urbania-article-isVideo .micromag-screen-urbania-article-content{-webkit-flex-grow:1;-ms-flex-positive:1;flex-grow:1;-webkit-justify-content:flex-end;-ms-flex-pack:end;justify-content:flex-end;margin-bottom:10px;background-color:rgba(0,0,0,0)}.micromag-screen-urbania-article-container.micromag-screen-urbania-article-isVideo .micromag-screen-urbania-article-content .micromag-screen-urbania-article-overTitle{margin-bottom:auto}.micromag-screen-urbania-article-container.micromag-screen-urbania-article-isVideo .micromag-screen-urbania-article-content .micromag-screen-urbania-article-title{color:#fff;text-shadow:2px 2px 0 #222}.micromag-screen-urbania-article-container.micromag-screen-urbania-article-isVideo .micromag-screen-urbania-article-content .micromag-screen-urbania-article-sponsors{margin-top:0}.micromag-screen-urbania-article-container.micromag-screen-urbania-article-isVideo .micromag-screen-urbania-article-emptyContainer{top:0;height:100%;padding-bottom:0;-webkit-transform:none;-ms-transform:none;transform:none}.micromag-screen-urbania-article-container.micromag-screen-urbania-article-isVideo .micromag-screen-urbania-article-callToAction{position:relative}
package/es/index.js CHANGED
@@ -5,7 +5,7 @@ import _objectWithoutProperties from '@babel/runtime/helpers/objectWithoutProper
5
5
  import { getJSON } from '@folklore/fetch';
6
6
  import PropTypes from 'prop-types';
7
7
  import React, { useMemo, useState, useEffect } from 'react';
8
- import { isTextFilled } from '@micromag/core/utils';
8
+ import { isTextFilled, getStyleFromColor } from '@micromag/core/utils';
9
9
  import _defineProperty from '@babel/runtime/helpers/defineProperty';
10
10
  import classNames from 'classnames';
11
11
  import { PropTypes as PropTypes$1 } from '@micromag/core';
@@ -95,7 +95,7 @@ var WatchIcon = function WatchIcon(_ref) {
95
95
  WatchIcon.propTypes = propTypes$2;
96
96
  WatchIcon.defaultProps = defaultProps$2;
97
97
 
98
- var styles = {"container":"micromag-screen-urbania-article-container","empty":"micromag-screen-urbania-article-empty","isVideo":"micromag-screen-urbania-article-isVideo","video":"micromag-screen-urbania-article-video","disabled":"micromag-screen-urbania-article-disabled","hidden":"micromag-screen-urbania-article-hidden","placeholder":"micromag-screen-urbania-article-placeholder","content":"micromag-screen-urbania-article-content","emptyContainer":"micromag-screen-urbania-article-emptyContainer","small":"micromag-screen-urbania-article-small","inner":"micromag-screen-urbania-article-inner","authors":"micromag-screen-urbania-article-authors","overTitle":"micromag-screen-urbania-article-overTitle","title":"micromag-screen-urbania-article-title","sponsors":"micromag-screen-urbania-article-sponsors","sponsor":"micromag-screen-urbania-article-sponsor","quatre95":"micromag-screen-urbania-article-quatre95","author":"micromag-screen-urbania-article-author","urbania":"micromag-screen-urbania-article-urbania","dehors":"micromag-screen-urbania-article-dehors","callToAction":"micromag-screen-urbania-article-callToAction","arrow":"micromag-screen-urbania-article-arrow","icon":"micromag-screen-urbania-article-icon","mediaControls":"micromag-screen-urbania-article-mediaControls","videoContainer":"micromag-screen-urbania-article-videoContainer","bottomContent":"micromag-screen-urbania-article-bottomContent","bottom":"micromag-screen-urbania-article-bottom","visible":"micromag-screen-urbania-article-visible","withGradient":"micromag-screen-urbania-article-withGradient","isPlaceholder":"micromag-screen-urbania-article-isPlaceholder","visual":"micromag-screen-urbania-article-visual"};
98
+ var styles = {"container":"micromag-screen-urbania-article-container","empty":"micromag-screen-urbania-article-empty","isVideo":"micromag-screen-urbania-article-isVideo","video":"micromag-screen-urbania-article-video","disabled":"micromag-screen-urbania-article-disabled","hidden":"micromag-screen-urbania-article-hidden","placeholder":"micromag-screen-urbania-article-placeholder","content":"micromag-screen-urbania-article-content","emptyContainer":"micromag-screen-urbania-article-emptyContainer","small":"micromag-screen-urbania-article-small","inner":"micromag-screen-urbania-article-inner","authors":"micromag-screen-urbania-article-authors","overTitle":"micromag-screen-urbania-article-overTitle","title":"micromag-screen-urbania-article-title","sponsors":"micromag-screen-urbania-article-sponsors","sponsor":"micromag-screen-urbania-article-sponsor","quatre95":"micromag-screen-urbania-article-quatre95","author":"micromag-screen-urbania-article-author","urbania":"micromag-screen-urbania-article-urbania","dehors":"micromag-screen-urbania-article-dehors","universities":"micromag-screen-urbania-article-universities","callToAction":"micromag-screen-urbania-article-callToAction","arrow":"micromag-screen-urbania-article-arrow","icon":"micromag-screen-urbania-article-icon","mediaControls":"micromag-screen-urbania-article-mediaControls","videoContainer":"micromag-screen-urbania-article-videoContainer","bottomContent":"micromag-screen-urbania-article-bottomContent","bottom":"micromag-screen-urbania-article-bottom","visible":"micromag-screen-urbania-article-visible","withGradient":"micromag-screen-urbania-article-withGradient","isPlaceholder":"micromag-screen-urbania-article-isPlaceholder","visual":"micromag-screen-urbania-article-visual"};
99
99
 
100
100
  var propTypes$1 = {
101
101
  hasArticle: PropTypes.bool,
@@ -106,6 +106,7 @@ var propTypes$1 = {
106
106
  author: PropTypes$1.authorElement,
107
107
  sponsor: PropTypes.arrayOf(PropTypes.shape({})),
108
108
  sponsorPrefix: PropTypes.oneOfType([PropTypes.node, PropTypes.func]),
109
+ sponsorColor: PropTypes$1.color,
109
110
  site: PropTypes.string,
110
111
  background: PropTypes$1.backgroundElement,
111
112
  callToAction: PropTypes$1.callToAction,
@@ -113,6 +114,8 @@ var propTypes$1 = {
113
114
  active: PropTypes.bool,
114
115
  transitions: PropTypes$1.transitions,
115
116
  spacing: PropTypes.number,
117
+ enableInteraction: PropTypes.func,
118
+ disableInteraction: PropTypes.func,
116
119
  className: PropTypes.string
117
120
  };
118
121
  var defaultProps$1 = {
@@ -124,6 +127,7 @@ var defaultProps$1 = {
124
127
  author: null,
125
128
  sponsor: null,
126
129
  sponsorPrefix: null,
130
+ sponsorColor: null,
127
131
  site: null,
128
132
  background: null,
129
133
  callToAction: null,
@@ -131,11 +135,13 @@ var defaultProps$1 = {
131
135
  active: true,
132
136
  transitions: null,
133
137
  spacing: 20,
138
+ enableInteraction: null,
139
+ disableInteraction: null,
134
140
  className: null
135
141
  };
136
142
 
137
143
  var UrbaniaArticle = function UrbaniaArticle(_ref) {
138
- var _ref5;
144
+ var _ref6;
139
145
 
140
146
  var hasArticle = _ref.hasArticle,
141
147
  type = _ref.type,
@@ -145,6 +151,7 @@ var UrbaniaArticle = function UrbaniaArticle(_ref) {
145
151
  author = _ref.author,
146
152
  sponsor = _ref.sponsor,
147
153
  sponsorPrefix = _ref.sponsorPrefix,
154
+ sponsorColor = _ref.sponsorColor,
148
155
  site = _ref.site,
149
156
  background = _ref.background,
150
157
  callToAction = _ref.callToAction,
@@ -152,6 +159,8 @@ var UrbaniaArticle = function UrbaniaArticle(_ref) {
152
159
  active = _ref.active,
153
160
  transitions = _ref.transitions,
154
161
  spacing = _ref.spacing,
162
+ enableInteraction = _ref.enableInteraction,
163
+ disableInteraction = _ref.disableInteraction,
155
164
  className = _ref.className;
156
165
 
157
166
  var _useScreenSize = useScreenSize(),
@@ -159,31 +168,42 @@ var UrbaniaArticle = function UrbaniaArticle(_ref) {
159
168
  height = _useScreenSize.height,
160
169
  resolution = _useScreenSize.resolution;
161
170
 
171
+ var _ref2 = background || {},
172
+ _ref2$color = _ref2.color,
173
+ backgroundColor = _ref2$color === void 0 ? null : _ref2$color;
174
+
162
175
  var _useResizeObserver = useResizeObserver(),
163
176
  contentRef = _useResizeObserver.ref,
164
177
  contentRect = _useResizeObserver.entry.contentRect;
165
178
 
166
- var _ref2 = contentRect || {},
167
- contentHeight = _ref2.height,
168
- contentTop = _ref2.top;
179
+ var _ref3 = contentRect || {},
180
+ contentHeight = _ref3.height,
181
+ contentTop = _ref3.top;
169
182
 
170
183
  var _useMemo = useMemo(function () {
171
- var defaultHeight = width * 0.8;
172
- var difference = height - contentHeight - contentTop + 1;
173
-
174
- if (difference > defaultHeight) {
175
- return {
176
- imageHeight: difference
177
- };
178
- }
179
-
184
+ var defaultImageHeight = width * 0.8; // const difference = height - contentHeight - contentTop + 1;
185
+ // if (difference > defaultImageHeight) {
186
+ // return { imageHeight: difference, minImageHeight: defaultImageHeight };
187
+ // }
188
+ // return { imageHeight: difference, minImageHeight: defaultImageHeight };
189
+
190
+ // const difference = height - contentHeight - contentTop + 1;
191
+ // if (difference > defaultImageHeight) {
192
+ // return { imageHeight: difference, minImageHeight: defaultImageHeight };
193
+ // }
194
+ // return { imageHeight: difference, minImageHeight: defaultImageHeight };
195
+ var finalMaxContentHeight = height - defaultImageHeight;
180
196
  return {
181
- imageHeight: difference
197
+ imageHeight: defaultImageHeight,
198
+ maxContentHeight: finalMaxContentHeight
182
199
  };
183
200
  }, [contentTop, contentHeight, width, height]),
184
201
  _useMemo$minContentHe = _useMemo.minContentHeight,
185
202
  minContentHeight = _useMemo$minContentHe === void 0 ? null : _useMemo$minContentHe,
186
- imageHeight = _useMemo.imageHeight;
203
+ _useMemo$maxContentHe = _useMemo.maxContentHeight,
204
+ maxContentHeight = _useMemo$maxContentHe === void 0 ? null : _useMemo$maxContentHe,
205
+ _useMemo$imageHeight = _useMemo.imageHeight,
206
+ imageHeight = _useMemo$imageHeight === void 0 ? null : _useMemo$imageHeight;
187
207
 
188
208
  var _useScreenRenderConte = useScreenRenderContext(),
189
209
  isView = _useScreenRenderConte.isView,
@@ -198,14 +218,14 @@ var UrbaniaArticle = function UrbaniaArticle(_ref) {
198
218
  var hasTitle = isTextFilled(title);
199
219
  var hasSponsor = isTextFilled(sponsor);
200
220
 
201
- var _ref3 = author || {},
202
- authorFullName = _ref3.name;
221
+ var _ref4 = author || {},
222
+ authorFullName = _ref4.name;
203
223
 
204
224
  var hasAuthor = isTextFilled(authorFullName);
205
225
 
206
- var _ref4 = image || {},
207
- _ref4$url = _ref4.url,
208
- url = _ref4$url === void 0 ? null : _ref4$url;
226
+ var _ref5 = image || {},
227
+ _ref5$url = _ref5.url,
228
+ url = _ref5$url === void 0 ? null : _ref5$url;
209
229
 
210
230
  var hasImage = url !== null;
211
231
  var backgroundPlaying = current && (isView || isEdit);
@@ -284,7 +304,8 @@ var UrbaniaArticle = function UrbaniaArticle(_ref) {
284
304
  }))),
285
305
  isEmpty: !hasSponsor && !hasArticle
286
306
  }, hasSponsor ? /*#__PURE__*/React.createElement("div", {
287
- className: styles.sponsors
307
+ className: styles.sponsors,
308
+ style: _objectSpread({}, getStyleFromColor(sponsorColor))
288
309
  }, sponsorPrefix !== null ? /*#__PURE__*/React.createElement("span", {
289
310
  className: styles.sponsor
290
311
  }, sponsorPrefix) : null, "\xA0", /*#__PURE__*/React.createElement(Heading, Object.assign({
@@ -294,7 +315,7 @@ var UrbaniaArticle = function UrbaniaArticle(_ref) {
294
315
  return it !== null;
295
316
  });
296
317
  return /*#__PURE__*/React.createElement("div", {
297
- className: classNames([styles.container, (_ref5 = {}, _defineProperty(_ref5, className, className !== null), _defineProperty(_ref5, styles.isVideo, isVideo), _defineProperty(_ref5, styles.isPlaceholder, isPlaceholder), _ref5)]),
318
+ className: classNames([styles.container, (_ref6 = {}, _defineProperty(_ref6, className, className !== null), _defineProperty(_ref6, styles.isVideo, isVideo), _defineProperty(_ref6, styles.isPlaceholder, isPlaceholder), _ref6)]),
298
319
  "data-screen-ready": isStatic || isCapture
299
320
  }, /*#__PURE__*/React.createElement(Background, {
300
321
  background: background,
@@ -309,10 +330,11 @@ var UrbaniaArticle = function UrbaniaArticle(_ref) {
309
330
  height: height
310
331
  }, /*#__PURE__*/React.createElement("div", {
311
332
  className: classNames([styles.content, _defineProperty({}, styles["".concat(site)], site !== null)]),
312
- style: {
333
+ style: _objectSpread({
313
334
  paddingTop: spacing,
314
- minHeight: minContentHeight
315
- },
335
+ minHeight: minContentHeight,
336
+ height: maxContentHeight
337
+ }, !isVideo ? getStyleFromColor(backgroundColor, 'backgroundColor') : null),
316
338
  ref: contentRef
317
339
  }, items), /*#__PURE__*/React.createElement("div", {
318
340
  className: styles.visual
@@ -370,6 +392,8 @@ var UrbaniaArticle = function UrbaniaArticle(_ref) {
370
392
  height: height
371
393
  },
372
394
  arrow: /*#__PURE__*/React.createElement(Arrow, null),
395
+ enableInteraction: enableInteraction,
396
+ disableInteraction: disableInteraction,
373
397
  icon: type === 'video' ? /*#__PURE__*/React.createElement(WatchIcon, {
374
398
  className: styles.icon
375
399
  }) : null
@@ -666,6 +690,16 @@ var definition = {
666
690
  "value": "Sponsor"
667
691
  }]
668
692
  })
693
+ }, {
694
+ name: 'sponsorColor',
695
+ type: 'color',
696
+ label: defineMessage({
697
+ id: "Qw8cb5",
698
+ defaultMessage: [{
699
+ "type": 0,
700
+ "value": "Sponsor color"
701
+ }]
702
+ })
669
703
  }, {
670
704
  name: 'image',
671
705
  type: 'visual',
package/lib/index.js CHANGED
@@ -115,7 +115,7 @@ var WatchIcon = function WatchIcon(_ref) {
115
115
  WatchIcon.propTypes = propTypes$2;
116
116
  WatchIcon.defaultProps = defaultProps$2;
117
117
 
118
- var styles = {"container":"micromag-screen-urbania-article-container","empty":"micromag-screen-urbania-article-empty","isVideo":"micromag-screen-urbania-article-isVideo","video":"micromag-screen-urbania-article-video","disabled":"micromag-screen-urbania-article-disabled","hidden":"micromag-screen-urbania-article-hidden","placeholder":"micromag-screen-urbania-article-placeholder","content":"micromag-screen-urbania-article-content","emptyContainer":"micromag-screen-urbania-article-emptyContainer","small":"micromag-screen-urbania-article-small","inner":"micromag-screen-urbania-article-inner","authors":"micromag-screen-urbania-article-authors","overTitle":"micromag-screen-urbania-article-overTitle","title":"micromag-screen-urbania-article-title","sponsors":"micromag-screen-urbania-article-sponsors","sponsor":"micromag-screen-urbania-article-sponsor","quatre95":"micromag-screen-urbania-article-quatre95","author":"micromag-screen-urbania-article-author","urbania":"micromag-screen-urbania-article-urbania","dehors":"micromag-screen-urbania-article-dehors","callToAction":"micromag-screen-urbania-article-callToAction","arrow":"micromag-screen-urbania-article-arrow","icon":"micromag-screen-urbania-article-icon","mediaControls":"micromag-screen-urbania-article-mediaControls","videoContainer":"micromag-screen-urbania-article-videoContainer","bottomContent":"micromag-screen-urbania-article-bottomContent","bottom":"micromag-screen-urbania-article-bottom","visible":"micromag-screen-urbania-article-visible","withGradient":"micromag-screen-urbania-article-withGradient","isPlaceholder":"micromag-screen-urbania-article-isPlaceholder","visual":"micromag-screen-urbania-article-visual"};
118
+ var styles = {"container":"micromag-screen-urbania-article-container","empty":"micromag-screen-urbania-article-empty","isVideo":"micromag-screen-urbania-article-isVideo","video":"micromag-screen-urbania-article-video","disabled":"micromag-screen-urbania-article-disabled","hidden":"micromag-screen-urbania-article-hidden","placeholder":"micromag-screen-urbania-article-placeholder","content":"micromag-screen-urbania-article-content","emptyContainer":"micromag-screen-urbania-article-emptyContainer","small":"micromag-screen-urbania-article-small","inner":"micromag-screen-urbania-article-inner","authors":"micromag-screen-urbania-article-authors","overTitle":"micromag-screen-urbania-article-overTitle","title":"micromag-screen-urbania-article-title","sponsors":"micromag-screen-urbania-article-sponsors","sponsor":"micromag-screen-urbania-article-sponsor","quatre95":"micromag-screen-urbania-article-quatre95","author":"micromag-screen-urbania-article-author","urbania":"micromag-screen-urbania-article-urbania","dehors":"micromag-screen-urbania-article-dehors","universities":"micromag-screen-urbania-article-universities","callToAction":"micromag-screen-urbania-article-callToAction","arrow":"micromag-screen-urbania-article-arrow","icon":"micromag-screen-urbania-article-icon","mediaControls":"micromag-screen-urbania-article-mediaControls","videoContainer":"micromag-screen-urbania-article-videoContainer","bottomContent":"micromag-screen-urbania-article-bottomContent","bottom":"micromag-screen-urbania-article-bottom","visible":"micromag-screen-urbania-article-visible","withGradient":"micromag-screen-urbania-article-withGradient","isPlaceholder":"micromag-screen-urbania-article-isPlaceholder","visual":"micromag-screen-urbania-article-visual"};
119
119
 
120
120
  var propTypes$1 = {
121
121
  hasArticle: PropTypes__default["default"].bool,
@@ -126,6 +126,7 @@ var propTypes$1 = {
126
126
  author: core.PropTypes.authorElement,
127
127
  sponsor: PropTypes__default["default"].arrayOf(PropTypes__default["default"].shape({})),
128
128
  sponsorPrefix: PropTypes__default["default"].oneOfType([PropTypes__default["default"].node, PropTypes__default["default"].func]),
129
+ sponsorColor: core.PropTypes.color,
129
130
  site: PropTypes__default["default"].string,
130
131
  background: core.PropTypes.backgroundElement,
131
132
  callToAction: core.PropTypes.callToAction,
@@ -133,6 +134,8 @@ var propTypes$1 = {
133
134
  active: PropTypes__default["default"].bool,
134
135
  transitions: core.PropTypes.transitions,
135
136
  spacing: PropTypes__default["default"].number,
137
+ enableInteraction: PropTypes__default["default"].func,
138
+ disableInteraction: PropTypes__default["default"].func,
136
139
  className: PropTypes__default["default"].string
137
140
  };
138
141
  var defaultProps$1 = {
@@ -144,6 +147,7 @@ var defaultProps$1 = {
144
147
  author: null,
145
148
  sponsor: null,
146
149
  sponsorPrefix: null,
150
+ sponsorColor: null,
147
151
  site: null,
148
152
  background: null,
149
153
  callToAction: null,
@@ -151,11 +155,13 @@ var defaultProps$1 = {
151
155
  active: true,
152
156
  transitions: null,
153
157
  spacing: 20,
158
+ enableInteraction: null,
159
+ disableInteraction: null,
154
160
  className: null
155
161
  };
156
162
 
157
163
  var UrbaniaArticle = function UrbaniaArticle(_ref) {
158
- var _ref5;
164
+ var _ref6;
159
165
 
160
166
  var hasArticle = _ref.hasArticle,
161
167
  type = _ref.type,
@@ -165,6 +171,7 @@ var UrbaniaArticle = function UrbaniaArticle(_ref) {
165
171
  author = _ref.author,
166
172
  sponsor = _ref.sponsor,
167
173
  sponsorPrefix = _ref.sponsorPrefix,
174
+ sponsorColor = _ref.sponsorColor,
168
175
  site = _ref.site,
169
176
  background = _ref.background,
170
177
  callToAction = _ref.callToAction,
@@ -172,6 +179,8 @@ var UrbaniaArticle = function UrbaniaArticle(_ref) {
172
179
  active = _ref.active,
173
180
  transitions = _ref.transitions,
174
181
  spacing = _ref.spacing,
182
+ enableInteraction = _ref.enableInteraction,
183
+ disableInteraction = _ref.disableInteraction,
175
184
  className = _ref.className;
176
185
 
177
186
  var _useScreenSize = contexts.useScreenSize(),
@@ -179,31 +188,42 @@ var UrbaniaArticle = function UrbaniaArticle(_ref) {
179
188
  height = _useScreenSize.height,
180
189
  resolution = _useScreenSize.resolution;
181
190
 
191
+ var _ref2 = background || {},
192
+ _ref2$color = _ref2.color,
193
+ backgroundColor = _ref2$color === void 0 ? null : _ref2$color;
194
+
182
195
  var _useResizeObserver = hooks.useResizeObserver(),
183
196
  contentRef = _useResizeObserver.ref,
184
197
  contentRect = _useResizeObserver.entry.contentRect;
185
198
 
186
- var _ref2 = contentRect || {},
187
- contentHeight = _ref2.height,
188
- contentTop = _ref2.top;
199
+ var _ref3 = contentRect || {},
200
+ contentHeight = _ref3.height,
201
+ contentTop = _ref3.top;
189
202
 
190
203
  var _useMemo = React.useMemo(function () {
191
- var defaultHeight = width * 0.8;
192
- var difference = height - contentHeight - contentTop + 1;
193
-
194
- if (difference > defaultHeight) {
195
- return {
196
- imageHeight: difference
197
- };
198
- }
199
-
204
+ var defaultImageHeight = width * 0.8; // const difference = height - contentHeight - contentTop + 1;
205
+ // if (difference > defaultImageHeight) {
206
+ // return { imageHeight: difference, minImageHeight: defaultImageHeight };
207
+ // }
208
+ // return { imageHeight: difference, minImageHeight: defaultImageHeight };
209
+
210
+ // const difference = height - contentHeight - contentTop + 1;
211
+ // if (difference > defaultImageHeight) {
212
+ // return { imageHeight: difference, minImageHeight: defaultImageHeight };
213
+ // }
214
+ // return { imageHeight: difference, minImageHeight: defaultImageHeight };
215
+ var finalMaxContentHeight = height - defaultImageHeight;
200
216
  return {
201
- imageHeight: difference
217
+ imageHeight: defaultImageHeight,
218
+ maxContentHeight: finalMaxContentHeight
202
219
  };
203
220
  }, [contentTop, contentHeight, width, height]),
204
221
  _useMemo$minContentHe = _useMemo.minContentHeight,
205
222
  minContentHeight = _useMemo$minContentHe === void 0 ? null : _useMemo$minContentHe,
206
- imageHeight = _useMemo.imageHeight;
223
+ _useMemo$maxContentHe = _useMemo.maxContentHeight,
224
+ maxContentHeight = _useMemo$maxContentHe === void 0 ? null : _useMemo$maxContentHe,
225
+ _useMemo$imageHeight = _useMemo.imageHeight,
226
+ imageHeight = _useMemo$imageHeight === void 0 ? null : _useMemo$imageHeight;
207
227
 
208
228
  var _useScreenRenderConte = contexts.useScreenRenderContext(),
209
229
  isView = _useScreenRenderConte.isView,
@@ -218,14 +238,14 @@ var UrbaniaArticle = function UrbaniaArticle(_ref) {
218
238
  var hasTitle = utils.isTextFilled(title);
219
239
  var hasSponsor = utils.isTextFilled(sponsor);
220
240
 
221
- var _ref3 = author || {},
222
- authorFullName = _ref3.name;
241
+ var _ref4 = author || {},
242
+ authorFullName = _ref4.name;
223
243
 
224
244
  var hasAuthor = utils.isTextFilled(authorFullName);
225
245
 
226
- var _ref4 = image || {},
227
- _ref4$url = _ref4.url,
228
- url = _ref4$url === void 0 ? null : _ref4$url;
246
+ var _ref5 = image || {},
247
+ _ref5$url = _ref5.url,
248
+ url = _ref5$url === void 0 ? null : _ref5$url;
229
249
 
230
250
  var hasImage = url !== null;
231
251
  var backgroundPlaying = current && (isView || isEdit);
@@ -304,7 +324,8 @@ var UrbaniaArticle = function UrbaniaArticle(_ref) {
304
324
  }))),
305
325
  isEmpty: !hasSponsor && !hasArticle
306
326
  }, hasSponsor ? /*#__PURE__*/React__default["default"].createElement("div", {
307
- className: styles.sponsors
327
+ className: styles.sponsors,
328
+ style: _objectSpread__default["default"]({}, utils.getStyleFromColor(sponsorColor))
308
329
  }, sponsorPrefix !== null ? /*#__PURE__*/React__default["default"].createElement("span", {
309
330
  className: styles.sponsor
310
331
  }, sponsorPrefix) : null, "\xA0", /*#__PURE__*/React__default["default"].createElement(Heading__default["default"], Object.assign({
@@ -314,7 +335,7 @@ var UrbaniaArticle = function UrbaniaArticle(_ref) {
314
335
  return it !== null;
315
336
  });
316
337
  return /*#__PURE__*/React__default["default"].createElement("div", {
317
- className: classNames__default["default"]([styles.container, (_ref5 = {}, _defineProperty__default["default"](_ref5, className, className !== null), _defineProperty__default["default"](_ref5, styles.isVideo, isVideo), _defineProperty__default["default"](_ref5, styles.isPlaceholder, isPlaceholder), _ref5)]),
338
+ className: classNames__default["default"]([styles.container, (_ref6 = {}, _defineProperty__default["default"](_ref6, className, className !== null), _defineProperty__default["default"](_ref6, styles.isVideo, isVideo), _defineProperty__default["default"](_ref6, styles.isPlaceholder, isPlaceholder), _ref6)]),
318
339
  "data-screen-ready": isStatic || isCapture
319
340
  }, /*#__PURE__*/React__default["default"].createElement(Background__default["default"], {
320
341
  background: background,
@@ -329,10 +350,11 @@ var UrbaniaArticle = function UrbaniaArticle(_ref) {
329
350
  height: height
330
351
  }, /*#__PURE__*/React__default["default"].createElement("div", {
331
352
  className: classNames__default["default"]([styles.content, _defineProperty__default["default"]({}, styles["".concat(site)], site !== null)]),
332
- style: {
353
+ style: _objectSpread__default["default"]({
333
354
  paddingTop: spacing,
334
- minHeight: minContentHeight
335
- },
355
+ minHeight: minContentHeight,
356
+ height: maxContentHeight
357
+ }, !isVideo ? utils.getStyleFromColor(backgroundColor, 'backgroundColor') : null),
336
358
  ref: contentRef
337
359
  }, items), /*#__PURE__*/React__default["default"].createElement("div", {
338
360
  className: styles.visual
@@ -390,6 +412,8 @@ var UrbaniaArticle = function UrbaniaArticle(_ref) {
390
412
  height: height
391
413
  },
392
414
  arrow: /*#__PURE__*/React__default["default"].createElement(Arrow, null),
415
+ enableInteraction: enableInteraction,
416
+ disableInteraction: disableInteraction,
393
417
  icon: type === 'video' ? /*#__PURE__*/React__default["default"].createElement(WatchIcon, {
394
418
  className: styles.icon
395
419
  }) : null
@@ -686,6 +710,16 @@ var definition = {
686
710
  "value": "Sponsor"
687
711
  }]
688
712
  })
713
+ }, {
714
+ name: 'sponsorColor',
715
+ type: 'color',
716
+ label: reactIntl.defineMessage({
717
+ id: "Qw8cb5",
718
+ defaultMessage: [{
719
+ "type": 0,
720
+ "value": "Sponsor color"
721
+ }]
722
+ })
689
723
  }, {
690
724
  name: 'image',
691
725
  type: 'visual',
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@micromag/screen-urbania-article",
3
- "version": "0.3.86",
3
+ "version": "0.3.90",
4
4
  "description": "",
5
5
  "keywords": [
6
6
  "javascript"
@@ -51,18 +51,18 @@
51
51
  "@babel/runtime": "^7.13.10",
52
52
  "@folklore/fetch": "^0.1.15",
53
53
  "@folklore/size": "^0.1.20",
54
- "@micromag/core": "^0.3.86",
55
- "@micromag/element-background": "^0.3.86",
56
- "@micromag/element-call-to-action": "^0.3.86",
57
- "@micromag/element-closed-captions": "^0.3.86",
58
- "@micromag/element-container": "^0.3.86",
59
- "@micromag/element-heading": "^0.3.86",
60
- "@micromag/element-image": "^0.3.86",
61
- "@micromag/element-media-controls": "^0.3.86",
62
- "@micromag/element-urbania-author": "^0.3.86",
63
- "@micromag/element-video": "^0.3.86",
64
- "@micromag/element-visual": "^0.3.86",
65
- "@micromag/transforms": "^0.3.86",
54
+ "@micromag/core": "^0.3.88",
55
+ "@micromag/element-background": "^0.3.88",
56
+ "@micromag/element-call-to-action": "^0.3.89",
57
+ "@micromag/element-closed-captions": "^0.3.88",
58
+ "@micromag/element-container": "^0.3.88",
59
+ "@micromag/element-heading": "^0.3.88",
60
+ "@micromag/element-image": "^0.3.88",
61
+ "@micromag/element-media-controls": "^0.3.88",
62
+ "@micromag/element-urbania-author": "^0.3.90",
63
+ "@micromag/element-video": "^0.3.88",
64
+ "@micromag/element-visual": "^0.3.88",
65
+ "@micromag/transforms": "^0.3.88",
66
66
  "classnames": "^2.2.6",
67
67
  "lodash": "^4.17.21",
68
68
  "prop-types": "^15.7.2",
@@ -72,5 +72,5 @@
72
72
  "publishConfig": {
73
73
  "access": "public"
74
74
  },
75
- "gitHead": "063af274982885b7696d265e6567ab8d44c8b9ad"
75
+ "gitHead": "347556649f4402c7bbdb183beb41eb48ec1c059c"
76
76
  }