@micromag/screen-article 0.3.411 → 0.3.414

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 +12 -7
  3. package/lib/index.js +12 -7
  4. package/package.json +3 -3
package/assets/css/styles.css CHANGED
@@ -1 +1 @@
1
- .micromag-screen-article-container .micromag-screen-article-background{height:100%;left:0;position:absolute;top:0;width:100%}.micromag-screen-article-container .micromag-screen-article-emptyAuthor,.micromag-screen-article-container .micromag-screen-article-emptyDate,.micromag-screen-article-container .micromag-screen-article-emptySurtitle,.micromag-screen-article-container .micromag-screen-article-emptyText,.micromag-screen-article-container .micromag-screen-article-emptyTitle{border:2px dashed #343434;color:#343434;margin:5px auto}.micromag-screen-article-container{position:relative}.micromag-screen-article-container .micromag-screen-article-background{z-index:0}.micromag-screen-article-container .micromag-screen-article-content{z-index:1}.micromag-screen-article-container .micromag-screen-article-layout{position:relative}.micromag-screen-article-container .micromag-screen-article-emptyAuthor,.micromag-screen-article-container .micromag-screen-article-emptyText,.micromag-screen-article-container .micromag-screen-article-emptyTitle{margin:10px auto;padding:12px 0 10px;width:100%}.micromag-screen-article-container .micromag-screen-article-emptyDate,.micromag-screen-article-container .micromag-screen-article-emptySurtitle{-ms-flex-negative:0;flex-shrink:0;padding:4px 0;width:50%}.micromag-screen-article-container .micromag-screen-article-visualContainer{height:auto;left:0;position:absolute;top:0;width:100%;z-index:-1}.micromag-screen-article-container .micromag-screen-article-surtitle{font-size:12px;width:100%}.micromag-screen-article-container .micromag-screen-article-date{font-size:12px;text-align:right;width:100%}.micromag-screen-article-container .micromag-screen-article-title{margin:10px 0}.micromag-screen-article-container .micromag-screen-article-text{margin-top:2.5em}.micromag-screen-article-container .micromag-screen-article-text blockquote,.micromag-screen-article-container .micromag-screen-article-text h2,.micromag-screen-article-container .micromag-screen-article-text h3,.micromag-screen-article-container .micromag-screen-article-text img,.micromag-screen-article-container .micromag-screen-article-text ol,.micromag-screen-article-container .micromag-screen-article-text p,.micromag-screen-article-container .micromag-screen-article-text ul{margin-bottom:1rem}.micromag-screen-article-container .micromag-screen-article-text blockquote:last-child,.micromag-screen-article-container .micromag-screen-article-text h2:last-child,.micromag-screen-article-container .micromag-screen-article-text h3:last-child,.micromag-screen-article-container .micromag-screen-article-text img:last-child,.micromag-screen-article-container .micromag-screen-article-text ol:last-child,.micromag-screen-article-container .micromag-screen-article-text p:last-child,.micromag-screen-article-container .micromag-screen-article-text ul:last-child{margin-bottom:0}.micromag-screen-article-container .micromag-screen-article-text h2{font-size:2em}.micromag-screen-article-container .micromag-screen-article-text h3{font-size:1.5em}.micromag-screen-article-container .micromag-screen-article-text ol,.micromag-screen-article-container .micromag-screen-article-text ul{list-style-position:inside}.micromag-screen-article-container .micromag-screen-article-text blockquote{border-left:1px solid;padding-left:.5em}.micromag-screen-article-container .micromag-screen-article-topContent{-ms-flex-pack:justify;display:-ms-flexbox;display:flex;justify-content:space-between}.micromag-screen-article-container .micromag-screen-article-footer{-webkit-transition:opacity .2s ease-out;-o-transition:opacity .2s ease-out;transition:opacity .2s ease-out}.micromag-screen-article-container .micromag-screen-article-footer a{padding:0}.micromag-screen-article-container .micromag-screen-article-footer.micromag-screen-article-disabled{opacity:0;pointer-events:none}.micromag-screen-article-container.micromag-screen-article-isPlaceholder .micromag-screen-article-layout{padding:10px}
1
+ .micromag-screen-article-container .micromag-screen-article-background{height:100%;left:0;position:absolute;top:0;width:100%}.micromag-screen-article-container .micromag-screen-article-emptyAuthor,.micromag-screen-article-container .micromag-screen-article-emptyDate,.micromag-screen-article-container .micromag-screen-article-emptySurtitle,.micromag-screen-article-container .micromag-screen-article-emptyText,.micromag-screen-article-container .micromag-screen-article-emptyTitle{border:2px dashed #343434;color:#343434;margin:5px auto}.micromag-screen-article-container{position:relative}.micromag-screen-article-container .micromag-screen-article-background{z-index:0}.micromag-screen-article-container .micromag-screen-article-content{z-index:1}.micromag-screen-article-container .micromag-screen-article-layout{position:relative}.micromag-screen-article-container .micromag-screen-article-emptyAuthor,.micromag-screen-article-container .micromag-screen-article-emptyText,.micromag-screen-article-container .micromag-screen-article-emptyTitle{margin:10px auto;padding:12px 0 10px;width:100%}.micromag-screen-article-container .micromag-screen-article-emptyDate,.micromag-screen-article-container .micromag-screen-article-emptySurtitle{-ms-flex-negative:0;flex-shrink:0;padding:4px 0;width:50%}.micromag-screen-article-container .micromag-screen-article-main.micromag-screen-article-hasText{margin-bottom:30px}.micromag-screen-article-container .micromag-screen-article-visualContainer{height:auto;left:0;position:absolute;top:0;width:100%;z-index:-1}.micromag-screen-article-container .micromag-screen-article-surtitle{font-size:12px;width:100%}.micromag-screen-article-container .micromag-screen-article-date{font-size:12px;text-align:right;width:100%}.micromag-screen-article-container .micromag-screen-article-title{margin:10px 0}.micromag-screen-article-container .micromag-screen-article-text blockquote,.micromag-screen-article-container .micromag-screen-article-text h2,.micromag-screen-article-container .micromag-screen-article-text h3,.micromag-screen-article-container .micromag-screen-article-text img,.micromag-screen-article-container .micromag-screen-article-text ol,.micromag-screen-article-container .micromag-screen-article-text p,.micromag-screen-article-container .micromag-screen-article-text ul{margin-bottom:1rem}.micromag-screen-article-container .micromag-screen-article-text blockquote:last-child,.micromag-screen-article-container .micromag-screen-article-text h2:last-child,.micromag-screen-article-container .micromag-screen-article-text h3:last-child,.micromag-screen-article-container .micromag-screen-article-text img:last-child,.micromag-screen-article-container .micromag-screen-article-text ol:last-child,.micromag-screen-article-container .micromag-screen-article-text p:last-child,.micromag-screen-article-container .micromag-screen-article-text ul:last-child{margin-bottom:0}.micromag-screen-article-container .micromag-screen-article-text h2{font-size:2em}.micromag-screen-article-container .micromag-screen-article-text h3{font-size:1.5em}.micromag-screen-article-container .micromag-screen-article-text ol,.micromag-screen-article-container .micromag-screen-article-text ul{list-style-position:inside}.micromag-screen-article-container .micromag-screen-article-text blockquote{border-left:1px solid;padding-left:.5em}.micromag-screen-article-container .micromag-screen-article-topContent{-ms-flex-pack:justify;display:-ms-flexbox;display:flex;justify-content:space-between}.micromag-screen-article-container .micromag-screen-article-footer{-webkit-transition:opacity .2s ease-out;-o-transition:opacity .2s ease-out;transition:opacity .2s ease-out}.micromag-screen-article-container .micromag-screen-article-footer a{padding:0}.micromag-screen-article-container .micromag-screen-article-footer.micromag-screen-article-disabled{opacity:0;pointer-events:none}.micromag-screen-article-container.micromag-screen-article-isPlaceholder .micromag-screen-article-layout{padding:10px}
package/es/index.js CHANGED
@@ -24,7 +24,7 @@ import _objectSpread from '@babel/runtime/helpers/objectSpread2';
24
24
  import _toConsumableArray from '@babel/runtime/helpers/toConsumableArray';
25
25
  import { Container as Container$1 } from '@micromag/transforms/apple-news';
26
26
 
27
- var styles = {"container":"micromag-screen-article-container","background":"micromag-screen-article-background","emptySurtitle":"micromag-screen-article-emptySurtitle","emptyDate":"micromag-screen-article-emptyDate","emptyTitle":"micromag-screen-article-emptyTitle","emptyAuthor":"micromag-screen-article-emptyAuthor","emptyText":"micromag-screen-article-emptyText","content":"micromag-screen-article-content","layout":"micromag-screen-article-layout","visualContainer":"micromag-screen-article-visualContainer","surtitle":"micromag-screen-article-surtitle","date":"micromag-screen-article-date","title":"micromag-screen-article-title","text":"micromag-screen-article-text","topContent":"micromag-screen-article-topContent","footer":"micromag-screen-article-footer","disabled":"micromag-screen-article-disabled","isPlaceholder":"micromag-screen-article-isPlaceholder"};
27
+ var styles = {"container":"micromag-screen-article-container","background":"micromag-screen-article-background","emptySurtitle":"micromag-screen-article-emptySurtitle","emptyDate":"micromag-screen-article-emptyDate","emptyTitle":"micromag-screen-article-emptyTitle","emptyAuthor":"micromag-screen-article-emptyAuthor","emptyText":"micromag-screen-article-emptyText","content":"micromag-screen-article-content","layout":"micromag-screen-article-layout","main":"micromag-screen-article-main","hasText":"micromag-screen-article-hasText","visualContainer":"micromag-screen-article-visualContainer","surtitle":"micromag-screen-article-surtitle","date":"micromag-screen-article-date","title":"micromag-screen-article-title","text":"micromag-screen-article-text","topContent":"micromag-screen-article-topContent","footer":"micromag-screen-article-footer","disabled":"micromag-screen-article-disabled","isPlaceholder":"micromag-screen-article-isPlaceholder"};
28
28
 
29
29
  var propTypes = {
30
30
  layout: PropTypes.oneOf(['normal']),
@@ -109,14 +109,17 @@ var ArticleScreen = function ArticleScreen(_ref) {
109
109
  var scrollingDisabled = !isEdit && transitionDisabled || !current;
110
110
  var _ref2 = author || {},
111
111
  _ref2$name = _ref2.name,
112
- authorName = _ref2$name === void 0 ? null : _ref2$name;
112
+ authorName = _ref2$name === void 0 ? null : _ref2$name,
113
+ _ref2$image = _ref2.image,
114
+ authorImage = _ref2$image === void 0 ? null : _ref2$image,
115
+ authorCollabs = _ref2.collaborator;
113
116
  var hasText = isTextFilled(text);
114
117
  var hasHeader = isHeaderFilled(header);
115
118
  var hasFooter = isFooterFilled(footer);
116
119
  var hasTitle = isTextFilled(title);
117
120
  var hasSurtitle = isTextFilled(surtitle);
118
121
  var hasSimpleAuthor = isTextFilled(author); // legacy
119
- var hasAuthor = isTextFilled(authorName);
122
+ var hasAuthor = isTextFilled(authorName) || isImageFilled(authorImage) || isTextFilled(authorCollabs);
120
123
  var hasImage = isImageFilled(image);
121
124
  var hasDate = isTextFilled(date);
122
125
  var footerProps = getFooterProps(footer, {
@@ -284,11 +287,13 @@ var ArticleScreen = function ArticleScreen(_ref) {
284
287
  key: "header",
285
288
  style: {
286
289
  height: hasImage && imageHeight > 0 ? 0 : 'auto',
287
- paddingBottom: imageHeight > 0 ? imageHeight : spacing
290
+ paddingBottom: imageHeight > 0 ? imageHeight - viewerTopHeight : spacing
288
291
  }
289
- }, /*#__PURE__*/React.createElement(Header, header)) : null, imageElement, /*#__PURE__*/React.createElement("div", {
292
+ }, /*#__PURE__*/React.createElement(Header, header)) : null, /*#__PURE__*/React.createElement("div", {
293
+ className: classNames([styles.main, _defineProperty({}, styles.hasText, hasText)])
294
+ }, imageElement, /*#__PURE__*/React.createElement("div", {
290
295
  className: styles.topContent
291
- }, surtitleElement, dateElement), titleElement, authorElement, contentElement, !isPlaceholder && hasFooter ? /*#__PURE__*/React.createElement("div", {
296
+ }, surtitleElement, dateElement), titleElement, authorElement), contentElement, !isPlaceholder && hasFooter ? /*#__PURE__*/React.createElement("div", {
292
297
  className: classNames([styles.footer, _defineProperty({}, styles.disabled, !scrolledBottom)]),
293
298
  style: {
294
299
  paddingLeft: Math.max(viewerBottomSidesWidth - spacing, 0),
@@ -368,7 +373,7 @@ var definition = [{
368
373
  type: 'heading-element',
369
374
  inline: true,
370
375
  theme: {
371
- textStyle: 'heading2'
376
+ textStyle: 'header2'
372
377
  },
373
378
  label: defineMessage({
374
379
  id: "N25iDO",
package/lib/index.js CHANGED
@@ -49,7 +49,7 @@ var Visual__default = /*#__PURE__*/_interopDefaultLegacy(Visual);
49
49
  var _objectSpread__default = /*#__PURE__*/_interopDefaultLegacy(_objectSpread);
50
50
  var _toConsumableArray__default = /*#__PURE__*/_interopDefaultLegacy(_toConsumableArray);
51
51
 
52
- var styles = {"container":"micromag-screen-article-container","background":"micromag-screen-article-background","emptySurtitle":"micromag-screen-article-emptySurtitle","emptyDate":"micromag-screen-article-emptyDate","emptyTitle":"micromag-screen-article-emptyTitle","emptyAuthor":"micromag-screen-article-emptyAuthor","emptyText":"micromag-screen-article-emptyText","content":"micromag-screen-article-content","layout":"micromag-screen-article-layout","visualContainer":"micromag-screen-article-visualContainer","surtitle":"micromag-screen-article-surtitle","date":"micromag-screen-article-date","title":"micromag-screen-article-title","text":"micromag-screen-article-text","topContent":"micromag-screen-article-topContent","footer":"micromag-screen-article-footer","disabled":"micromag-screen-article-disabled","isPlaceholder":"micromag-screen-article-isPlaceholder"};
52
+ var styles = {"container":"micromag-screen-article-container","background":"micromag-screen-article-background","emptySurtitle":"micromag-screen-article-emptySurtitle","emptyDate":"micromag-screen-article-emptyDate","emptyTitle":"micromag-screen-article-emptyTitle","emptyAuthor":"micromag-screen-article-emptyAuthor","emptyText":"micromag-screen-article-emptyText","content":"micromag-screen-article-content","layout":"micromag-screen-article-layout","main":"micromag-screen-article-main","hasText":"micromag-screen-article-hasText","visualContainer":"micromag-screen-article-visualContainer","surtitle":"micromag-screen-article-surtitle","date":"micromag-screen-article-date","title":"micromag-screen-article-title","text":"micromag-screen-article-text","topContent":"micromag-screen-article-topContent","footer":"micromag-screen-article-footer","disabled":"micromag-screen-article-disabled","isPlaceholder":"micromag-screen-article-isPlaceholder"};
53
53
 
54
54
  var propTypes = {
55
55
  layout: PropTypes__default["default"].oneOf(['normal']),
@@ -134,14 +134,17 @@ var ArticleScreen = function ArticleScreen(_ref) {
134
134
  var scrollingDisabled = !isEdit && transitionDisabled || !current;
135
135
  var _ref2 = author || {},
136
136
  _ref2$name = _ref2.name,
137
- authorName = _ref2$name === void 0 ? null : _ref2$name;
137
+ authorName = _ref2$name === void 0 ? null : _ref2$name,
138
+ _ref2$image = _ref2.image,
139
+ authorImage = _ref2$image === void 0 ? null : _ref2$image,
140
+ authorCollabs = _ref2.collaborator;
138
141
  var hasText = utils.isTextFilled(text);
139
142
  var hasHeader = utils.isHeaderFilled(header);
140
143
  var hasFooter = utils.isFooterFilled(footer);
141
144
  var hasTitle = utils.isTextFilled(title);
142
145
  var hasSurtitle = utils.isTextFilled(surtitle);
143
146
  var hasSimpleAuthor = utils.isTextFilled(author); // legacy
144
- var hasAuthor = utils.isTextFilled(authorName);
147
+ var hasAuthor = utils.isTextFilled(authorName) || utils.isImageFilled(authorImage) || utils.isTextFilled(authorCollabs);
145
148
  var hasImage = utils.isImageFilled(image);
146
149
  var hasDate = utils.isTextFilled(date);
147
150
  var footerProps = utils.getFooterProps(footer, {
@@ -309,11 +312,13 @@ var ArticleScreen = function ArticleScreen(_ref) {
309
312
  key: "header",
310
313
  style: {
311
314
  height: hasImage && imageHeight > 0 ? 0 : 'auto',
312
- paddingBottom: imageHeight > 0 ? imageHeight : spacing
315
+ paddingBottom: imageHeight > 0 ? imageHeight - viewerTopHeight : spacing
313
316
  }
314
- }, /*#__PURE__*/React__default["default"].createElement(Header__default["default"], header)) : null, imageElement, /*#__PURE__*/React__default["default"].createElement("div", {
317
+ }, /*#__PURE__*/React__default["default"].createElement(Header__default["default"], header)) : null, /*#__PURE__*/React__default["default"].createElement("div", {
318
+ className: classNames__default["default"]([styles.main, _defineProperty__default["default"]({}, styles.hasText, hasText)])
319
+ }, imageElement, /*#__PURE__*/React__default["default"].createElement("div", {
315
320
  className: styles.topContent
316
- }, surtitleElement, dateElement), titleElement, authorElement, contentElement, !isPlaceholder && hasFooter ? /*#__PURE__*/React__default["default"].createElement("div", {
321
+ }, surtitleElement, dateElement), titleElement, authorElement), contentElement, !isPlaceholder && hasFooter ? /*#__PURE__*/React__default["default"].createElement("div", {
317
322
  className: classNames__default["default"]([styles.footer, _defineProperty__default["default"]({}, styles.disabled, !scrolledBottom)]),
318
323
  style: {
319
324
  paddingLeft: Math.max(viewerBottomSidesWidth - spacing, 0),
@@ -393,7 +398,7 @@ var definition = [{
393
398
  type: 'heading-element',
394
399
  inline: true,
395
400
  theme: {
396
- textStyle: 'heading2'
401
+ textStyle: 'header2'
397
402
  },
398
403
  label: reactIntl.defineMessage({
399
404
  id: "N25iDO",
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@micromag/screen-article",
3
- "version": "0.3.411",
3
+ "version": "0.3.414",
4
4
  "private": false,
5
5
  "description": "",
6
6
  "keywords": [
@@ -47,7 +47,7 @@
47
47
  "dependencies": {
48
48
  "@babel/runtime": "^7.13.10",
49
49
  "@micromag/core": "^0.3.410",
50
- "@micromag/element-author": "^0.3.411",
50
+ "@micromag/element-author": "^0.3.414",
51
51
  "@micromag/element-background": "^0.3.410",
52
52
  "@micromag/element-container": "^0.3.410",
53
53
  "@micromag/element-footer": "^0.3.410",
@@ -70,5 +70,5 @@
70
70
  "access": "public",
71
71
  "registry": "https://registry.npmjs.org/"
72
72
  },
73
- "gitHead": "06ef83636bf6f3ed8dea7fa2a7aee9909d6da7d4"
73
+ "gitHead": "d992e87bf9264c4b36a60ba9b4608768a777344d"
74
74
  }