@massds/mayflower-react
Version:
React versions of Mayflower design system UI components
119 lines (97 loc) • 4.15 kB
JavaScript
;
exports.__esModule = true;
exports["default"] = void 0;
var _react = _interopRequireDefault(require("react"));
var _propTypes = _interopRequireDefault(require("prop-types"));
var _IconCalendar = _interopRequireDefault(require("../Icon/IconCalendar.js"));
var _index = _interopRequireDefault(require("../LinkDropdown/index.js"));
var _index2 = _interopRequireDefault(require("../EventTime/index.js"));
var _utils = require("../GenTeaser/utils.js");
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
function _extends() { _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; }; return _extends.apply(this, arguments); }
function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
/**
* Event
*/
var GenTeaserEvent = function GenTeaserEvent(props) {
var calendars = props.calendars,
startDate = props.startDate,
endDate = props.endDate,
details = props.details,
location = props.location,
description = props.description,
title = props.title,
rest = _objectWithoutPropertiesLoose(props, ["calendars", "startDate", "endDate", "details", "location", "description", "title"]);
var dropdownProps = {
dropdownButton: {
text: 'Add to Calendar',
theme: 'c-primary',
usage: 'quaternary',
id: 'dropdownbutton-simple',
'aria-haspopup': true,
capitalized: true
}
};
var eventProps = {
startDate: startDate,
endDate: endDate,
details: details,
location: location,
description: description,
title: title
};
dropdownProps.dropdownItems = calendars.map(function (item) {
var type = item.type,
text = item.text;
var itemVals = '';
switch (type) {
case 'yahoo':
case 'google':
case 'outlookcom':
itemVals = {
text: text,
href: (0, _utils.buildUrl)(eventProps, type)
};
break;
default:
itemVals = {
text: text,
href: (0, _utils.buildUrl)(eventProps, type, window || ''),
target: '_blank',
download: 'download.ics'
};
break;
}
return itemVals;
});
return /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null, /*#__PURE__*/_react["default"].createElement("div", _extends({
className: "ma__gen-teaser__infoitem"
}, rest), /*#__PURE__*/_react["default"].createElement("span", {
className: "ma__gen-teaser__infoitem-icon"
}, /*#__PURE__*/_react["default"].createElement(_IconCalendar["default"], {
width: 15,
height: 15
})), /*#__PURE__*/_react["default"].createElement(_index2["default"], eventProps)), /*#__PURE__*/_react["default"].createElement(_index["default"], dropdownProps));
};
GenTeaserEvent.propTypes = process.env.NODE_ENV !== "production" ? {
/** The start date & time of the event */
startDate: _propTypes["default"].string,
/** The end date & time of the event */
endDate: _propTypes["default"].string,
/** The address of the event */
location: _propTypes["default"].string,
/** Any details about the event */
details: _propTypes["default"].string,
/** What type of calendars you would like users to be able to add to.
'google', 'yahoo', and 'outlookcom' if passed will render as specific
formats, all others render as base ics format.
*/
calendars: _propTypes["default"].arrayOf(_propTypes["default"].string),
/** The title of the event */
title: _propTypes["default"].string,
/** A description of the event */
description: _propTypes["default"].string
} : {};
var _default = GenTeaserEvent;
exports["default"] = _default;
module.exports = exports.default;