@micromag/element-author 0.3.411

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 +2 -0
  2. package/es/index.js +143 -0
  3. package/lib/index.js +155 -0
  4. package/package.json +68 -0
package/assets/css/styles.css ADDED
@@ -0,0 +1,2 @@
1
+ .micromag-element-author-avatar-container{display:inline-block;position:relative;width:100%;z-index:1}.micromag-element-author-avatar-container.micromag-element-author-avatar-shapeCircle .micromag-element-author-avatar-shape{background-color:#fff;background-position:top;border-radius:50%;overflow:hidden}.micromag-element-author-avatar-container .micromag-element-author-avatar-shape{background-color:#fff;background-position:50%;background-repeat:no-repeat;background-size:cover;-webkit-box-shadow:0 0 4px rgba(0,0,0,.2);box-shadow:0 0 4px rgba(0,0,0,.2);display:block;height:0;padding-bottom:100%;width:100%}
2
+ .micromag-element-author-container{-ms-flex-align:center;align-items:center;display:-ms-flexbox;display:flex;-ms-flex-direction:row;flex-direction:row;vertical-align:center}.micromag-element-author-container .micromag-element-author-image{margin-right:10px;max-width:4em}.micromag-element-author-container .micromag-element-author-link{color:currentColor;display:inline-block}.micromag-element-author-container .micromag-element-author-right{display:block}.micromag-element-author-container .micromag-element-author-collaborator,.micromag-element-author-container .micromag-element-author-name{white-space:nowrap}.micromag-element-author-container .micromag-element-author-name p{display:inline;margin:0}.micromag-element-author-container .micromag-element-author-collaborator{background-color:transparent;position:absolute}.micromag-element-author-container .micromag-element-author-collaborator .micromag-element-author-collaboratorText{font-size:inherit}.micromag-element-author-container .micromag-element-author-collaborator .micromag-element-author-collaboratorText p{display:inline}.micromag-element-author-container.micromag-element-author-isSmall{font-size:9px}.micromag-element-author-container.micromag-element-author-isSmall .micromag-element-author-name{font-size:9px;white-space:normal}.micromag-element-author-container.micromag-element-author-isSmall .micromag-element-author-image{max-width:30px}.micromag-element-author-container.micromag-element-author-withoutImage .micromag-element-author-name{margin-left:0;padding-left:0}.micromag-element-author-container.micromag-element-author-withoutImage .micromag-element-author-prefix{margin-right:0;padding-right:.4em}
package/es/index.js ADDED
@@ -0,0 +1,143 @@
1
+ import _defineProperty from '@babel/runtime/helpers/defineProperty';
2
+ import _objectWithoutProperties from '@babel/runtime/helpers/objectWithoutProperties';
3
+ import classNames from 'classnames';
4
+ import PropTypes$1 from 'prop-types';
5
+ import React from 'react';
6
+ import 'react-intl';
7
+ import { PropTypes } from '@micromag/core';
8
+ import { getOptimalImageUrl, pascalCase, isTextFilled } from '@micromag/core/utils';
9
+ import Link from '@micromag/element-link';
10
+ import Text from '@micromag/element-text';
11
+
12
+ var styles$1 = {"container":"micromag-element-author-avatar-container","shapeCircle":"micromag-element-author-avatar-shapeCircle","shape":"micromag-element-author-avatar-shape"};
13
+
14
+ var propTypes$1 = {
15
+ image: PropTypes.imageElement,
16
+ width: PropTypes$1.number,
17
+ height: PropTypes$1.number,
18
+ resolution: PropTypes$1.number,
19
+ isTag: PropTypes$1.bool,
20
+ shape: PropTypes$1.oneOf([null, 'tag', 'circle']),
21
+ className: PropTypes$1.string,
22
+ shouldLoad: PropTypes$1.bool
23
+ };
24
+ var defaultProps$1 = {
25
+ image: null,
26
+ width: 100,
27
+ height: 100,
28
+ resolution: 1,
29
+ isTag: false,
30
+ shape: 'circle',
31
+ className: null,
32
+ shouldLoad: true
33
+ };
34
+ var Avatar = function Avatar(_ref) {
35
+ var _ref2;
36
+ var image = _ref.image,
37
+ width = _ref.width,
38
+ height = _ref.height,
39
+ resolution = _ref.resolution,
40
+ shape = _ref.shape,
41
+ isTag = _ref.isTag,
42
+ className = _ref.className,
43
+ shouldLoad = _ref.shouldLoad;
44
+ var imageAtSize = getOptimalImageUrl(image, width, height, {
45
+ resolution: resolution
46
+ });
47
+ var finalShape = shape !== null ? pascalCase(shape) : null;
48
+ return /*#__PURE__*/React.createElement("span", {
49
+ className: classNames([styles$1.container, (_ref2 = {}, _defineProperty(_ref2, styles$1["shape".concat(finalShape)], finalShape !== null), _defineProperty(_ref2, styles$1.isTag, isTag), _defineProperty(_ref2, className, className !== null), _ref2)])
50
+ }, /*#__PURE__*/React.createElement("span", {
51
+ className: styles$1.shape,
52
+ style: {
53
+ backgroundImage: shouldLoad ? "url(\"".concat(imageAtSize, "\")") : null
54
+ }
55
+ }));
56
+ };
57
+ Avatar.propTypes = propTypes$1;
58
+ Avatar.defaultProps = defaultProps$1;
59
+
60
+ var styles = {"container":"micromag-element-author-container","image":"micromag-element-author-image","link":"micromag-element-author-link","right":"micromag-element-author-right","name":"micromag-element-author-name","collaborator":"micromag-element-author-collaborator","collaboratorText":"micromag-element-author-collaboratorText","isSmall":"micromag-element-author-isSmall","withoutImage":"micromag-element-author-withoutImage","prefix":"micromag-element-author-prefix"};
61
+
62
+ var _excluded = ["author", "withImage", "withoutLink", "isSmall", "linkUnderlineColor", "className", "backgroundClassName", "collaboratorClassName", "shouldLoad"];
63
+ var propTypes = {
64
+ author: PropTypes$1.shape({
65
+ slug: PropTypes$1.string,
66
+ name: PropTypes.textElement,
67
+ image: PropTypes.imageElement,
68
+ url: PropTypes$1.string,
69
+ collaborator: PropTypes.textElement
70
+ }),
71
+ withImage: PropTypes$1.bool,
72
+ withoutLink: PropTypes$1.bool,
73
+ isSmall: PropTypes$1.bool,
74
+ linkUnderlineColor: PropTypes$1.string,
75
+ className: PropTypes$1.string,
76
+ backgroundClassName: PropTypes$1.string,
77
+ collaboratorClassName: PropTypes$1.string,
78
+ shouldLoad: PropTypes$1.bool
79
+ };
80
+ var defaultProps = {
81
+ author: null,
82
+ withImage: true,
83
+ withoutLink: false,
84
+ isSmall: false,
85
+ linkUnderlineColor: null,
86
+ className: null,
87
+ backgroundClassName: null,
88
+ collaboratorClassName: null,
89
+ shouldLoad: true
90
+ };
91
+ var Author = function Author(_ref) {
92
+ var _ref4;
93
+ var author = _ref.author,
94
+ withImage = _ref.withImage,
95
+ withoutLink = _ref.withoutLink,
96
+ isSmall = _ref.isSmall,
97
+ linkUnderlineColor = _ref.linkUnderlineColor,
98
+ className = _ref.className,
99
+ backgroundClassName = _ref.backgroundClassName,
100
+ collaboratorClassName = _ref.collaboratorClassName,
101
+ shouldLoad = _ref.shouldLoad,
102
+ otherProps = _objectWithoutProperties(_ref, _excluded);
103
+ var _ref2 = author || {},
104
+ _ref2$name = _ref2.name,
105
+ name = _ref2$name === void 0 ? null : _ref2$name,
106
+ _ref2$image = _ref2.image,
107
+ image = _ref2$image === void 0 ? null : _ref2$image,
108
+ _ref2$url = _ref2.url,
109
+ url = _ref2$url === void 0 ? null : _ref2$url,
110
+ _ref2$collaborator = _ref2.collaborator,
111
+ collaborator = _ref2$collaborator === void 0 ? null : _ref2$collaborator;
112
+ var withAvatar = withImage && image !== null;
113
+ var authorText = isTextFilled(name) ? /*#__PURE__*/React.createElement(Text, Object.assign({
114
+ className: classNames([styles.name, _defineProperty({}, backgroundClassName, backgroundClassName)])
115
+ }, name)) : null;
116
+ var collaboratorText = isTextFilled(collaborator) ? /*#__PURE__*/React.createElement(Text, Object.assign({
117
+ className: styles.collaboratorText
118
+ }, collaborator, {
119
+ inline: true
120
+ })) : null;
121
+ return /*#__PURE__*/React.createElement("div", Object.assign({
122
+ className: classNames([styles.container, (_ref4 = {}, _defineProperty(_ref4, styles.isSmall, isSmall), _defineProperty(_ref4, styles.withoutAvatar, withAvatar), _defineProperty(_ref4, styles.withoutImage, !withImage || image === null), _defineProperty(_ref4, className, className !== null), _ref4)])
123
+ }, otherProps), withAvatar ? /*#__PURE__*/React.createElement(Avatar, {
124
+ className: styles.image,
125
+ image: image,
126
+ shouldLoad: shouldLoad
127
+ }) : null, /*#__PURE__*/React.createElement("div", {
128
+ className: styles.right
129
+ }, url !== null && !withoutLink ? /*#__PURE__*/React.createElement(Link, {
130
+ className: styles.link,
131
+ url: url,
132
+ external: true,
133
+ style: {
134
+ backgroundImage: linkUnderlineColor !== null ? "linear-gradient(0deg, ".concat(linkUnderlineColor, " 0, ").concat(linkUnderlineColor, ")") : null
135
+ }
136
+ }, authorText) : /*#__PURE__*/React.createElement("div", null, authorText), collaboratorText !== null ? /*#__PURE__*/React.createElement("div", {
137
+ className: classNames([styles.collaborator, _defineProperty({}, collaboratorClassName, collaboratorClassName)])
138
+ }, collaboratorText !== null ? collaboratorText : null) : null));
139
+ };
140
+ Author.propTypes = propTypes;
141
+ Author.defaultProps = defaultProps;
142
+
143
+ export { Author as default };
package/lib/index.js ADDED
@@ -0,0 +1,155 @@
1
+ 'use strict';
2
+
3
+ var _defineProperty = require('@babel/runtime/helpers/defineProperty');
4
+ var _objectWithoutProperties = require('@babel/runtime/helpers/objectWithoutProperties');
5
+ var classNames = require('classnames');
6
+ var PropTypes = require('prop-types');
7
+ var React = require('react');
8
+ require('react-intl');
9
+ var core = require('@micromag/core');
10
+ var utils = require('@micromag/core/utils');
11
+ var Link = require('@micromag/element-link');
12
+ var Text = require('@micromag/element-text');
13
+
14
+ function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
15
+
16
+ var _defineProperty__default = /*#__PURE__*/_interopDefaultLegacy(_defineProperty);
17
+ var _objectWithoutProperties__default = /*#__PURE__*/_interopDefaultLegacy(_objectWithoutProperties);
18
+ var classNames__default = /*#__PURE__*/_interopDefaultLegacy(classNames);
19
+ var PropTypes__default = /*#__PURE__*/_interopDefaultLegacy(PropTypes);
20
+ var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
21
+ var Link__default = /*#__PURE__*/_interopDefaultLegacy(Link);
22
+ var Text__default = /*#__PURE__*/_interopDefaultLegacy(Text);
23
+
24
+ var styles$1 = {"container":"micromag-element-author-avatar-container","shapeCircle":"micromag-element-author-avatar-shapeCircle","shape":"micromag-element-author-avatar-shape"};
25
+
26
+ var propTypes$1 = {
27
+ image: core.PropTypes.imageElement,
28
+ width: PropTypes__default["default"].number,
29
+ height: PropTypes__default["default"].number,
30
+ resolution: PropTypes__default["default"].number,
31
+ isTag: PropTypes__default["default"].bool,
32
+ shape: PropTypes__default["default"].oneOf([null, 'tag', 'circle']),
33
+ className: PropTypes__default["default"].string,
34
+ shouldLoad: PropTypes__default["default"].bool
35
+ };
36
+ var defaultProps$1 = {
37
+ image: null,
38
+ width: 100,
39
+ height: 100,
40
+ resolution: 1,
41
+ isTag: false,
42
+ shape: 'circle',
43
+ className: null,
44
+ shouldLoad: true
45
+ };
46
+ var Avatar = function Avatar(_ref) {
47
+ var _ref2;
48
+ var image = _ref.image,
49
+ width = _ref.width,
50
+ height = _ref.height,
51
+ resolution = _ref.resolution,
52
+ shape = _ref.shape,
53
+ isTag = _ref.isTag,
54
+ className = _ref.className,
55
+ shouldLoad = _ref.shouldLoad;
56
+ var imageAtSize = utils.getOptimalImageUrl(image, width, height, {
57
+ resolution: resolution
58
+ });
59
+ var finalShape = shape !== null ? utils.pascalCase(shape) : null;
60
+ return /*#__PURE__*/React__default["default"].createElement("span", {
61
+ className: classNames__default["default"]([styles$1.container, (_ref2 = {}, _defineProperty__default["default"](_ref2, styles$1["shape".concat(finalShape)], finalShape !== null), _defineProperty__default["default"](_ref2, styles$1.isTag, isTag), _defineProperty__default["default"](_ref2, className, className !== null), _ref2)])
62
+ }, /*#__PURE__*/React__default["default"].createElement("span", {
63
+ className: styles$1.shape,
64
+ style: {
65
+ backgroundImage: shouldLoad ? "url(\"".concat(imageAtSize, "\")") : null
66
+ }
67
+ }));
68
+ };
69
+ Avatar.propTypes = propTypes$1;
70
+ Avatar.defaultProps = defaultProps$1;
71
+
72
+ var styles = {"container":"micromag-element-author-container","image":"micromag-element-author-image","link":"micromag-element-author-link","right":"micromag-element-author-right","name":"micromag-element-author-name","collaborator":"micromag-element-author-collaborator","collaboratorText":"micromag-element-author-collaboratorText","isSmall":"micromag-element-author-isSmall","withoutImage":"micromag-element-author-withoutImage","prefix":"micromag-element-author-prefix"};
73
+
74
+ var _excluded = ["author", "withImage", "withoutLink", "isSmall", "linkUnderlineColor", "className", "backgroundClassName", "collaboratorClassName", "shouldLoad"];
75
+ var propTypes = {
76
+ author: PropTypes__default["default"].shape({
77
+ slug: PropTypes__default["default"].string,
78
+ name: core.PropTypes.textElement,
79
+ image: core.PropTypes.imageElement,
80
+ url: PropTypes__default["default"].string,
81
+ collaborator: core.PropTypes.textElement
82
+ }),
83
+ withImage: PropTypes__default["default"].bool,
84
+ withoutLink: PropTypes__default["default"].bool,
85
+ isSmall: PropTypes__default["default"].bool,
86
+ linkUnderlineColor: PropTypes__default["default"].string,
87
+ className: PropTypes__default["default"].string,
88
+ backgroundClassName: PropTypes__default["default"].string,
89
+ collaboratorClassName: PropTypes__default["default"].string,
90
+ shouldLoad: PropTypes__default["default"].bool
91
+ };
92
+ var defaultProps = {
93
+ author: null,
94
+ withImage: true,
95
+ withoutLink: false,
96
+ isSmall: false,
97
+ linkUnderlineColor: null,
98
+ className: null,
99
+ backgroundClassName: null,
100
+ collaboratorClassName: null,
101
+ shouldLoad: true
102
+ };
103
+ var Author = function Author(_ref) {
104
+ var _ref4;
105
+ var author = _ref.author,
106
+ withImage = _ref.withImage,
107
+ withoutLink = _ref.withoutLink,
108
+ isSmall = _ref.isSmall,
109
+ linkUnderlineColor = _ref.linkUnderlineColor,
110
+ className = _ref.className,
111
+ backgroundClassName = _ref.backgroundClassName,
112
+ collaboratorClassName = _ref.collaboratorClassName,
113
+ shouldLoad = _ref.shouldLoad,
114
+ otherProps = _objectWithoutProperties__default["default"](_ref, _excluded);
115
+ var _ref2 = author || {},
116
+ _ref2$name = _ref2.name,
117
+ name = _ref2$name === void 0 ? null : _ref2$name,
118
+ _ref2$image = _ref2.image,
119
+ image = _ref2$image === void 0 ? null : _ref2$image,
120
+ _ref2$url = _ref2.url,
121
+ url = _ref2$url === void 0 ? null : _ref2$url,
122
+ _ref2$collaborator = _ref2.collaborator,
123
+ collaborator = _ref2$collaborator === void 0 ? null : _ref2$collaborator;
124
+ var withAvatar = withImage && image !== null;
125
+ var authorText = utils.isTextFilled(name) ? /*#__PURE__*/React__default["default"].createElement(Text__default["default"], Object.assign({
126
+ className: classNames__default["default"]([styles.name, _defineProperty__default["default"]({}, backgroundClassName, backgroundClassName)])
127
+ }, name)) : null;
128
+ var collaboratorText = utils.isTextFilled(collaborator) ? /*#__PURE__*/React__default["default"].createElement(Text__default["default"], Object.assign({
129
+ className: styles.collaboratorText
130
+ }, collaborator, {
131
+ inline: true
132
+ })) : null;
133
+ return /*#__PURE__*/React__default["default"].createElement("div", Object.assign({
134
+ className: classNames__default["default"]([styles.container, (_ref4 = {}, _defineProperty__default["default"](_ref4, styles.isSmall, isSmall), _defineProperty__default["default"](_ref4, styles.withoutAvatar, withAvatar), _defineProperty__default["default"](_ref4, styles.withoutImage, !withImage || image === null), _defineProperty__default["default"](_ref4, className, className !== null), _ref4)])
135
+ }, otherProps), withAvatar ? /*#__PURE__*/React__default["default"].createElement(Avatar, {
136
+ className: styles.image,
137
+ image: image,
138
+ shouldLoad: shouldLoad
139
+ }) : null, /*#__PURE__*/React__default["default"].createElement("div", {
140
+ className: styles.right
141
+ }, url !== null && !withoutLink ? /*#__PURE__*/React__default["default"].createElement(Link__default["default"], {
142
+ className: styles.link,
143
+ url: url,
144
+ external: true,
145
+ style: {
146
+ backgroundImage: linkUnderlineColor !== null ? "linear-gradient(0deg, ".concat(linkUnderlineColor, " 0, ").concat(linkUnderlineColor, ")") : null
147
+ }
148
+ }, authorText) : /*#__PURE__*/React__default["default"].createElement("div", null, authorText), collaboratorText !== null ? /*#__PURE__*/React__default["default"].createElement("div", {
149
+ className: classNames__default["default"]([styles.collaborator, _defineProperty__default["default"]({}, collaboratorClassName, collaboratorClassName)])
150
+ }, collaboratorText !== null ? collaboratorText : null) : null));
151
+ };
152
+ Author.propTypes = propTypes;
153
+ Author.defaultProps = defaultProps;
154
+
155
+ module.exports = Author;
package/package.json ADDED
@@ -0,0 +1,68 @@
1
+ {
2
+ "name": "@micromag/element-author",
3
+ "version": "0.3.411",
4
+ "private": false,
5
+ "description": "",
6
+ "keywords": [
7
+ "javascript"
8
+ ],
9
+ "homepage": "https://github.com/urbania-media/micromag-js",
10
+ "repository": {
11
+ "type": "git",
12
+ "url": "git+https://github.com/urbania-media/micromag-js.git"
13
+ },
14
+ "author": {
15
+ "name": "Folklore",
16
+ "email": "info@folklore.email"
17
+ },
18
+ "contributors": [
19
+ {
20
+ "name": "David Mongeau-Petitpas",
21
+ "email": "dmp@folklore.email"
22
+ },
23
+ {
24
+ "name": "Nicolas Roy-Bourdages",
25
+ "email": "nrb@folklore.email"
26
+ },
27
+ {
28
+ "name": "Joseph Blais",
29
+ "email": "joseph@folklore.email"
30
+ }
31
+ ],
32
+ "license": "ISC",
33
+ "main": "lib/index.js",
34
+ "module": "es/index.js",
35
+ "files": [
36
+ "lib",
37
+ "es",
38
+ "assets"
39
+ ],
40
+ "scripts": {
41
+ "prepare": "../../scripts/prepare-package.sh"
42
+ },
43
+ "devDependencies": {
44
+ "react": "^16.8.0 || ^17.0.0 || ^18.0.0",
45
+ "react-dom": "^16.8.0 || ^17.0.0 || ^18.0.0"
46
+ },
47
+ "peerDependencies": {
48
+ "react": "^16.8.0 || ^17.0.0 || ^18.0.0",
49
+ "react-dom": "^16.8.0 || ^17.0.0 || ^18.0.0"
50
+ },
51
+ "dependencies": {
52
+ "@babel/runtime": "^7.13.10",
53
+ "@micromag/core": "^0.3.410",
54
+ "@micromag/element-button": "^0.3.410",
55
+ "@micromag/element-link": "^0.3.410",
56
+ "@micromag/element-text": "^0.3.410",
57
+ "classnames": "^2.2.6",
58
+ "lodash": "^4.17.21",
59
+ "prop-types": "^15.7.2",
60
+ "react-intl": "^5.12.1",
61
+ "uuid": "^9.0.0"
62
+ },
63
+ "publishConfig": {
64
+ "access": "public",
65
+ "registry": "https://registry.npmjs.org/"
66
+ },
67
+ "gitHead": "06ef83636bf6f3ed8dea7fa2a7aee9909d6da7d4"
68
+ }