ndla-ui
Version:
UI component library for NDLA.
206 lines (187 loc) • 8.01 kB
JavaScript
'use strict';
Object.defineProperty(exports, "__esModule", {
value: true
});
var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; /**
* Copyright (c) 2016-present, NDLA.
*
* This source code is licensed under the GPLv3 license found in the
* LICENSE file in the root directory of this source tree.
*
*/
var _react = require('react');
var _react2 = _interopRequireDefault(_react);
var _propTypes = require('prop-types');
var _propTypes2 = _interopRequireDefault(_propTypes);
var _reactBemHelper = require('react-bem-helper');
var _reactBemHelper2 = _interopRequireDefault(_reactBemHelper);
var _ndlaI18n = require('ndla-i18n');
var _ndlaUi = require('ndla-ui');
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
var classes = new _reactBemHelper2.default({
name: 'article-author-popup',
prefix: 'c-'
});
var ArticleAuthorContent = function ArticleAuthorContent(_ref) {
var showAuthor = _ref.showAuthor,
authors = _ref.authors,
onSelectAuthor = _ref.onSelectAuthor;
if ((showAuthor === null || showAuthor === undefined) && authors.length !== 1) {
// Render author list
return _react2.default.createElement(
_ndlaI18n.Trans,
null,
function (_ref2) {
var t = _ref2.t;
return _react2.default.createElement(
'div',
null,
_react2.default.createElement(
'h1',
null,
t('article.multipleAuthorsLabel')
),
_react2.default.createElement('hr', null),
_react2.default.createElement(
'ul',
classes('ul-list'),
authors.map(function (author, index) {
return _react2.default.createElement(
'li',
{ key: author.name },
author.role && _react2.default.createElement(
'span',
null,
author.role,
':'
),
_react2.default.createElement(
'span',
null,
author.phone || author.email || author.introduction || author.title ? _react2.default.createElement(
'button',
{
type: 'button',
className: 'c-button--link',
onClick: function onClick() {
onSelectAuthor(index);
} },
author.name
) : author.name
),
author.licenses && _react2.default.createElement(
'span',
classes('', 'author-licenses'),
author.licenses
)
);
})
)
);
}
);
}
// Show author
var _authors = authors[showAuthor !== null && showAuthor !== undefined ? showAuthor : 0],
image = _authors.image,
name = _authors.name,
shortName = _authors.shortName,
title = _authors.title,
role = _authors.role,
phone = _authors.phone,
email = _authors.email,
introduction = _authors.introduction,
urlContributions = _authors.urlContributions,
urlAuthor = _authors.urlAuthor;
return _react2.default.createElement(
_ndlaI18n.Trans,
null,
function (_ref3) {
var t = _ref3.t;
return _react2.default.createElement(
'div',
classes(),
_react2.default.createElement(
'div',
classes('author-info'),
image && _react2.default.createElement(_ndlaUi.Portrait, _extends({ src: image, alt: name }, classes('portrait'))),
_react2.default.createElement(
'section',
null,
_react2.default.createElement(
'h1',
null,
name
),
_react2.default.createElement('hr', null),
_react2.default.createElement(
'ul',
null,
title && _react2.default.createElement(
'li',
null,
'' + title + (title ? ' / ' : '') + role
),
phone && _react2.default.createElement(
'li',
null,
phone
),
email && _react2.default.createElement(
'li',
null,
_react2.default.createElement(
_ndlaUi.SafeLink,
{ to: 'mailto:' + email },
email
)
)
),
introduction && _react2.default.createElement(
'p',
null,
introduction
),
_react2.default.createElement(
'div',
classes('link-container'),
urlContributions && _react2.default.createElement(
_ndlaUi.SafeLink,
{
className: 'c-button c-button--outline',
to: urlContributions },
t('article.urlContributionsLabel', { name: shortName })
),
urlAuthor && _react2.default.createElement(
_ndlaUi.SafeLink,
{ to: urlAuthor },
t('article.urlAuthorLabel', { name: shortName })
)
)
)
)
);
}
);
};
ArticleAuthorContent.propTypes = {
authors: _propTypes2.default.arrayOf(_propTypes2.default.shape({
name: _propTypes2.default.string.isRequired,
shortName: _propTypes2.default.string.isRequired,
title: _propTypes2.default.string,
phone: _propTypes2.default.string,
email: _propTypes2.default.string,
image: _propTypes2.default.string,
introduction: _propTypes2.default.string,
role: _propTypes2.default.string,
urlContributions: _propTypes2.default.string,
urlAuthor: _propTypes2.default.string,
licenses: _propTypes2.default.string
})).isRequired,
showAuthor: _propTypes2.default.number,
onSelectAuthor: _propTypes2.default.func.isRequired
};
ArticleAuthorContent.defaultProps = {
showAuthor: null
};
exports.default = ArticleAuthorContent;