@micromag/element-urbania-author 0.3.60 → 0.3.64

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 +26 -34
  3. package/lib/index.js +26 -32
  4. package/package.json +6 -4
package/assets/css/styles.css CHANGED
@@ -1,2 +1,2 @@
1
1
  .micromag-element-urbania-author-avatar-container{display:inline-block;position:relative;z-index:1;width:100%}.micromag-element-urbania-author-avatar-container .micromag-element-urbania-author-avatar-shape{display:block;width:100%;height:0;padding-bottom:100%;background-color:#222;background-repeat:no-repeat;background-position:50%;background-size:cover;-webkit-box-shadow:0 0 4px rgba(0,0,0,.2);box-shadow:0 0 4px rgba(0,0,0,.2)}.micromag-element-urbania-author-avatar-container.micromag-element-urbania-author-avatar-shapeCircle .micromag-element-urbania-author-avatar-shape{overflow:hidden;border-radius:50%;background-color:rgba(0,0,0,0);background-position:top}
2
- .micromag-element-urbania-author-container{display:-webkit-inline-flex;display:-ms-inline-flexbox;display:inline-flex;-webkit-flex-direction:row;-ms-flex-direction:row;flex-direction:row;-webkit-align-items:center;-ms-flex-align:center;align-items:center;color:#222;font-family:Agrandir;font-size:12px}.micromag-element-urbania-author-container .micromag-element-urbania-author-avatar{min-width:3em;max-width:60px}.micromag-element-urbania-author-container .micromag-element-urbania-author-conjunction{background-color:#e9e9e9;white-space:nowrap}.micromag-element-urbania-author-container .micromag-element-urbania-author-name{margin-left:-6px;padding:6px 8px 4px 13px;border-top-right-radius:10px;border-bottom-right-radius:10px;font-size:13px;font-weight:700;text-transform:uppercase}.micromag-element-urbania-author-container .micromag-element-urbania-author-by{margin-right:-5px;padding:6px 13px 5px 8px;border-top-left-radius:10px;border-bottom-left-radius:10px}.micromag-element-urbania-author-container .micromag-element-urbania-author-by,.micromag-element-urbania-author-container .micromag-element-urbania-author-name{background-color:#e9e9e9;white-space:nowrap}.micromag-element-urbania-author-container.micromag-element-urbania-author-isSmall{font-size:10px}.micromag-element-urbania-author-container.micromag-element-urbania-author-isSmall .micromag-element-urbania-author-name{white-space:normal}
2
+ .micromag-element-urbania-author-container{display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-direction:row;-ms-flex-direction:row;flex-direction:row;-webkit-align-items:center;-ms-flex-align:center;align-items:center;color:#222;font-family:Agrandir;vertical-align:center}.micromag-element-urbania-author-container .micromag-element-urbania-author-avatar{min-width:2.5em;max-width:35px}.micromag-element-urbania-author-container .micromag-element-urbania-author-link{display:inline-block;color:#222;text-decoration:none}.micromag-element-urbania-author-container .micromag-element-urbania-author-name{margin-left:-7px;padding:6px 8px 6px 13px;border-top-right-radius:10px;border-bottom-right-radius:10px;font-weight:700;text-transform:uppercase}.micromag-element-urbania-author-container .micromag-element-urbania-author-name p{display:inline;margin:0;padding:0;font-size:inherit;line-height:1}.micromag-element-urbania-author-container .micromag-element-urbania-author-prefix{margin-right:-5px;padding:6px 13px 6px 8px;border-top-left-radius:10px;border-bottom-left-radius:10px}.micromag-element-urbania-author-container .micromag-element-urbania-author-name,.micromag-element-urbania-author-container .micromag-element-urbania-author-prefix{display:block;background-color:#e9e9e9;font-size:12px;line-height:1;white-space:nowrap}.micromag-element-urbania-author-container.micromag-element-urbania-author-isSmall{font-size:10px}.micromag-element-urbania-author-container.micromag-element-urbania-author-isSmall .micromag-element-urbania-author-name,.micromag-element-urbania-author-container.micromag-element-urbania-author-isSmall .micromag-element-urbania-author-prefix{font-size:10px;white-space:normal}.micromag-element-urbania-author-container.micromag-element-urbania-author-isSmall .micromag-element-urbania-author-avatar{max-width:30px}.micromag-element-urbania-author-container.micromag-element-urbania-author-withoutAvatar .micromag-element-urbania-author-name{margin-left:0;padding-left:0}
package/es/index.js CHANGED
@@ -2,9 +2,11 @@ import _defineProperty from '@babel/runtime/helpers/defineProperty';
2
2
  import classNames from 'classnames';
3
3
  import PropTypes$1 from 'prop-types';
4
4
  import React from 'react';
5
- import { FormattedMessage } from 'react-intl';
5
+ import { useIntl } from 'react-intl';
6
6
  import { PropTypes } from '@micromag/core';
7
- import { getOptimalImageUrl } from '@micromag/core/utils';
7
+ import { getOptimalImageUrl, isTextFilled } from '@micromag/core/utils';
8
+ import Link from '@micromag/element-link';
9
+ import Text from '@micromag/element-text';
8
10
 
9
11
  var styles$1 = {"container":"micromag-element-urbania-author-avatar-container","shape":"micromag-element-urbania-author-avatar-shape","shapeCircle":"micromag-element-urbania-author-avatar-shapeCircle"};
10
12
 
@@ -48,18 +50,18 @@ var Avatar = function Avatar(_ref) {
48
50
  Avatar.propTypes = propTypes$1;
49
51
  Avatar.defaultProps = defaultProps$1;
50
52
 
51
- var styles = {"container":"micromag-element-urbania-author-container","avatar":"micromag-element-urbania-author-avatar","conjunction":"micromag-element-urbania-author-conjunction","name":"micromag-element-urbania-author-name","by":"micromag-element-urbania-author-by","isSmall":"micromag-element-urbania-author-isSmall"};
53
+ var styles = {"container":"micromag-element-urbania-author-container","avatar":"micromag-element-urbania-author-avatar","link":"micromag-element-urbania-author-link","name":"micromag-element-urbania-author-name","prefix":"micromag-element-urbania-author-prefix","isSmall":"micromag-element-urbania-author-isSmall","withoutAvatar":"micromag-element-urbania-author-withoutAvatar"};
52
54
 
53
55
  var propTypes = {
54
56
  author: PropTypes$1.shape({
55
57
  slug: PropTypes$1.string,
56
- name: PropTypes$1.string,
58
+ name: PropTypes.textElement,
57
59
  avatar: PropTypes.imageElement,
58
60
  url: PropTypes$1.string
59
61
  }),
60
62
  withAvatar: PropTypes$1.bool,
61
- withConjunction: PropTypes$1.bool,
62
63
  withoutLink: PropTypes$1.bool,
64
+ withoutPrefix: PropTypes$1.bool,
63
65
  isSmall: PropTypes$1.bool,
64
66
  linkUnderlineColor: PropTypes$1.string,
65
67
  className: PropTypes$1.string
@@ -67,8 +69,8 @@ var propTypes = {
67
69
  var defaultProps = {
68
70
  author: null,
69
71
  withAvatar: true,
70
- withConjunction: false,
71
72
  withoutLink: false,
73
+ withoutPrefix: false,
72
74
  isSmall: false,
73
75
  linkUnderlineColor: null,
74
76
  className: null
@@ -79,57 +81,47 @@ var UrbaniaAuthor = function UrbaniaAuthor(_ref) {
79
81
 
80
82
  var author = _ref.author,
81
83
  withAvatar = _ref.withAvatar,
82
- withConjunction = _ref.withConjunction,
83
84
  withoutLink = _ref.withoutLink,
85
+ withoutPrefix = _ref.withoutPrefix,
84
86
  isSmall = _ref.isSmall,
85
87
  linkUnderlineColor = _ref.linkUnderlineColor,
86
88
  className = _ref.className;
89
+ var intl = useIntl();
87
90
 
88
91
  var _ref2 = author || {},
89
92
  _ref2$name = _ref2.name,
90
- name = _ref2$name === void 0 ? '' : _ref2$name,
93
+ name = _ref2$name === void 0 ? null : _ref2$name,
91
94
  _ref2$avatar = _ref2.avatar,
92
95
  avatar = _ref2$avatar === void 0 ? null : _ref2$avatar,
93
96
  _ref2$url = _ref2.url,
94
97
  url = _ref2$url === void 0 ? null : _ref2$url;
95
98
 
96
- var prefix = /*#__PURE__*/React.createElement("span", {
97
- className: styles.by
98
- }, /*#__PURE__*/React.createElement(FormattedMessage, {
99
+ var prefix = intl.formatMessage({
99
100
  id: "jEK6B8",
100
101
  defaultMessage: [{
101
102
  "type": 0,
102
103
  "value": "By"
103
104
  }]
104
- }));
105
-
106
- if (withConjunction) {
107
- prefix = /*#__PURE__*/React.createElement("span", {
108
- className: styles.conjunction
109
- }, /*#__PURE__*/React.createElement(FormattedMessage, {
110
- id: "0UxdOa",
111
- defaultMessage: [{
112
- "type": 0,
113
- "value": "and"
114
- }]
115
- }));
116
- }
117
-
105
+ });
106
+ var text = isTextFilled(name) ? /*#__PURE__*/React.createElement(Text, Object.assign({
107
+ className: styles.name
108
+ }, name)) : null;
118
109
  return /*#__PURE__*/React.createElement("div", {
119
- className: classNames([styles.container, (_ref3 = {}, _defineProperty(_ref3, styles.isSmall, isSmall), _defineProperty(_ref3, className, className !== null), _ref3)])
120
- }, /*#__PURE__*/React.createElement("span", {
121
- className: styles.prefix
122
- }, prefix), withAvatar && avatar !== null ? /*#__PURE__*/React.createElement(Avatar, {
110
+ className: classNames([styles.container, (_ref3 = {}, _defineProperty(_ref3, styles.isSmall, isSmall), _defineProperty(_ref3, styles.withoutAvatar, !withAvatar || avatar === null), _defineProperty(_ref3, className, className !== null), _ref3)])
111
+ }, !withoutPrefix ? /*#__PURE__*/React.createElement(Text, Object.assign({}, name, {
112
+ className: styles.prefix,
113
+ body: prefix
114
+ })) : null, withAvatar && avatar !== null ? /*#__PURE__*/React.createElement(Avatar, {
123
115
  className: styles.avatar,
124
116
  image: avatar
125
- }) : null, url !== null && !withoutLink ? /*#__PURE__*/React.createElement("div", {
126
- className: styles.name,
117
+ }) : null, url !== null && !withoutLink ? /*#__PURE__*/React.createElement(Link, {
118
+ className: styles.link,
119
+ url: url,
120
+ external: true,
127
121
  style: {
128
122
  backgroundImage: linkUnderlineColor !== null ? "linear-gradient(0deg, ".concat(linkUnderlineColor, " 0, ").concat(linkUnderlineColor, ")") : null
129
123
  }
130
- }, name) : /*#__PURE__*/React.createElement("em", {
131
- className: styles.name
132
- }, name));
124
+ }, text) : /*#__PURE__*/React.createElement("div", null, text));
133
125
  };
134
126
 
135
127
  UrbaniaAuthor.propTypes = propTypes;
package/lib/index.js CHANGED
@@ -7,6 +7,8 @@ var React = require('react');
7
7
  var reactIntl = require('react-intl');
8
8
  var core = require('@micromag/core');
9
9
  var utils = require('@micromag/core/utils');
10
+ var Link = require('@micromag/element-link');
11
+ var Text = require('@micromag/element-text');
10
12
 
11
13
  function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
12
14
 
@@ -14,6 +16,8 @@ var _defineProperty__default = /*#__PURE__*/_interopDefaultLegacy(_definePropert
14
16
  var classNames__default = /*#__PURE__*/_interopDefaultLegacy(classNames);
15
17
  var PropTypes__default = /*#__PURE__*/_interopDefaultLegacy(PropTypes);
16
18
  var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
19
+ var Link__default = /*#__PURE__*/_interopDefaultLegacy(Link);
20
+ var Text__default = /*#__PURE__*/_interopDefaultLegacy(Text);
17
21
 
18
22
  var styles$1 = {"container":"micromag-element-urbania-author-avatar-container","shape":"micromag-element-urbania-author-avatar-shape","shapeCircle":"micromag-element-urbania-author-avatar-shapeCircle"};
19
23
 
@@ -57,18 +61,18 @@ var Avatar = function Avatar(_ref) {
57
61
  Avatar.propTypes = propTypes$1;
58
62
  Avatar.defaultProps = defaultProps$1;
59
63
 
60
- var styles = {"container":"micromag-element-urbania-author-container","avatar":"micromag-element-urbania-author-avatar","conjunction":"micromag-element-urbania-author-conjunction","name":"micromag-element-urbania-author-name","by":"micromag-element-urbania-author-by","isSmall":"micromag-element-urbania-author-isSmall"};
64
+ var styles = {"container":"micromag-element-urbania-author-container","avatar":"micromag-element-urbania-author-avatar","link":"micromag-element-urbania-author-link","name":"micromag-element-urbania-author-name","prefix":"micromag-element-urbania-author-prefix","isSmall":"micromag-element-urbania-author-isSmall","withoutAvatar":"micromag-element-urbania-author-withoutAvatar"};
61
65
 
62
66
  var propTypes = {
63
67
  author: PropTypes__default["default"].shape({
64
68
  slug: PropTypes__default["default"].string,
65
- name: PropTypes__default["default"].string,
69
+ name: core.PropTypes.textElement,
66
70
  avatar: core.PropTypes.imageElement,
67
71
  url: PropTypes__default["default"].string
68
72
  }),
69
73
  withAvatar: PropTypes__default["default"].bool,
70
- withConjunction: PropTypes__default["default"].bool,
71
74
  withoutLink: PropTypes__default["default"].bool,
75
+ withoutPrefix: PropTypes__default["default"].bool,
72
76
  isSmall: PropTypes__default["default"].bool,
73
77
  linkUnderlineColor: PropTypes__default["default"].string,
74
78
  className: PropTypes__default["default"].string
@@ -76,8 +80,8 @@ var propTypes = {
76
80
  var defaultProps = {
77
81
  author: null,
78
82
  withAvatar: true,
79
- withConjunction: false,
80
83
  withoutLink: false,
84
+ withoutPrefix: false,
81
85
  isSmall: false,
82
86
  linkUnderlineColor: null,
83
87
  className: null
@@ -88,57 +92,47 @@ var UrbaniaAuthor = function UrbaniaAuthor(_ref) {
88
92
 
89
93
  var author = _ref.author,
90
94
  withAvatar = _ref.withAvatar,
91
- withConjunction = _ref.withConjunction,
92
95
  withoutLink = _ref.withoutLink,
96
+ withoutPrefix = _ref.withoutPrefix,
93
97
  isSmall = _ref.isSmall,
94
98
  linkUnderlineColor = _ref.linkUnderlineColor,
95
99
  className = _ref.className;
100
+ var intl = reactIntl.useIntl();
96
101
 
97
102
  var _ref2 = author || {},
98
103
  _ref2$name = _ref2.name,
99
- name = _ref2$name === void 0 ? '' : _ref2$name,
104
+ name = _ref2$name === void 0 ? null : _ref2$name,
100
105
  _ref2$avatar = _ref2.avatar,
101
106
  avatar = _ref2$avatar === void 0 ? null : _ref2$avatar,
102
107
  _ref2$url = _ref2.url,
103
108
  url = _ref2$url === void 0 ? null : _ref2$url;
104
109
 
105
- var prefix = /*#__PURE__*/React__default["default"].createElement("span", {
106
- className: styles.by
107
- }, /*#__PURE__*/React__default["default"].createElement(reactIntl.FormattedMessage, {
110
+ var prefix = intl.formatMessage({
108
111
  id: "jEK6B8",
109
112
  defaultMessage: [{
110
113
  "type": 0,
111
114
  "value": "By"
112
115
  }]
113
- }));
114
-
115
- if (withConjunction) {
116
- prefix = /*#__PURE__*/React__default["default"].createElement("span", {
117
- className: styles.conjunction
118
- }, /*#__PURE__*/React__default["default"].createElement(reactIntl.FormattedMessage, {
119
- id: "0UxdOa",
120
- defaultMessage: [{
121
- "type": 0,
122
- "value": "and"
123
- }]
124
- }));
125
- }
126
-
116
+ });
117
+ var text = utils.isTextFilled(name) ? /*#__PURE__*/React__default["default"].createElement(Text__default["default"], Object.assign({
118
+ className: styles.name
119
+ }, name)) : null;
127
120
  return /*#__PURE__*/React__default["default"].createElement("div", {
128
- className: classNames__default["default"]([styles.container, (_ref3 = {}, _defineProperty__default["default"](_ref3, styles.isSmall, isSmall), _defineProperty__default["default"](_ref3, className, className !== null), _ref3)])
129
- }, /*#__PURE__*/React__default["default"].createElement("span", {
130
- className: styles.prefix
131
- }, prefix), withAvatar && avatar !== null ? /*#__PURE__*/React__default["default"].createElement(Avatar, {
121
+ className: classNames__default["default"]([styles.container, (_ref3 = {}, _defineProperty__default["default"](_ref3, styles.isSmall, isSmall), _defineProperty__default["default"](_ref3, styles.withoutAvatar, !withAvatar || avatar === null), _defineProperty__default["default"](_ref3, className, className !== null), _ref3)])
122
+ }, !withoutPrefix ? /*#__PURE__*/React__default["default"].createElement(Text__default["default"], Object.assign({}, name, {
123
+ className: styles.prefix,
124
+ body: prefix
125
+ })) : null, withAvatar && avatar !== null ? /*#__PURE__*/React__default["default"].createElement(Avatar, {
132
126
  className: styles.avatar,
133
127
  image: avatar
134
- }) : null, url !== null && !withoutLink ? /*#__PURE__*/React__default["default"].createElement("div", {
135
- className: styles.name,
128
+ }) : null, url !== null && !withoutLink ? /*#__PURE__*/React__default["default"].createElement(Link__default["default"], {
129
+ className: styles.link,
130
+ url: url,
131
+ external: true,
136
132
  style: {
137
133
  backgroundImage: linkUnderlineColor !== null ? "linear-gradient(0deg, ".concat(linkUnderlineColor, " 0, ").concat(linkUnderlineColor, ")") : null
138
134
  }
139
- }, name) : /*#__PURE__*/React__default["default"].createElement("em", {
140
- className: styles.name
141
- }, name));
135
+ }, text) : /*#__PURE__*/React__default["default"].createElement("div", null, text));
142
136
  };
143
137
 
144
138
  UrbaniaAuthor.propTypes = propTypes;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@micromag/element-urbania-author",
3
- "version": "0.3.60",
3
+ "version": "0.3.64",
4
4
  "description": "",
5
5
  "keywords": [
6
6
  "javascript"
@@ -49,8 +49,10 @@
49
49
  },
50
50
  "dependencies": {
51
51
  "@babel/runtime": "^7.13.10",
52
- "@micromag/core": "^0.3.60",
53
- "@micromag/element-button": "^0.3.60",
52
+ "@micromag/core": "^0.3.64",
53
+ "@micromag/element-button": "^0.3.64",
54
+ "@micromag/element-link": "^0.3.64",
55
+ "@micromag/element-text": "^0.3.64",
54
56
  "classnames": "^2.2.6",
55
57
  "lodash": "^4.17.21",
56
58
  "prop-types": "^15.7.2",
@@ -60,5 +62,5 @@
60
62
  "publishConfig": {
61
63
  "access": "public"
62
64
  },
63
- "gitHead": "f79f285d0b402d94f7703782bdd9e6fdc0cdafb0"
65
+ "gitHead": "b0da130454a8615d3fd00a3d380f438863b35334"
64
66
  }