styledot
Version:
23andMe Design System
79 lines (71 loc) • 8.51 kB
JavaScript
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
exports["default"] = void 0;
var _react = _interopRequireDefault(require("react"));
var _propTypes = _interopRequireDefault(require("prop-types"));
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
// Example:
// <Tag tagText="Unread" tagType="warning" />
// <Tag tagType="research" tagStyle="mod-transparent" />
var tagTypeMap = {
'': '',
neutral: 'neutral',
invalid: 'invalid',
warning: 'warning',
error: 'error',
bad: 'bad',
success: 'success',
good: 'good',
research: 'research',
"new": 'new',
updated: 'updated',
recommended: 'recommended',
promotional: 'promotional',
'total-health-promotional': 'total-health-promotional',
health: 'health',
'premium-promotional': 'premium-promotional'
};
var Tag = function Tag(props) {
var text = props.tagText ? props.tagText : '';
var type = props.tagType ? "sd-tag-".concat(props.tagType) : 'sd-tag-neutral';
var style = props.tagStyle ? props.tagStyle : '';
var hiddenText = props.hiddenText;
return /*#__PURE__*/_react["default"].createElement("div", {
className: "".concat(type).concat(style ? " ".concat(style) : '').concat(props.tagIcon || props.tagType === 'research' ? ' with-icon' : ''),
"data-text": text
}, props.tagIcon && props.tagType !== 'research' && /*#__PURE__*/_react["default"].createElement("svg", {
focusable: "false",
"aria-hidden": "true",
className: "sd-tag-icon",
height: "10",
width: "10"
}, /*#__PURE__*/_react["default"].createElement("use", {
xlinkHref: "".concat(props.iconPath).concat(props.tagIcon, ".svg#icon")
})), props.tagType === 'research' && /*#__PURE__*/_react["default"].createElement("img", {
src: "".concat(props.iconPath, "ic_tag_research.svg"),
"aria-hidden": "true",
height: "10",
width: "10",
alt: ""
}), hiddenText && /*#__PURE__*/_react["default"].createElement("span", {
className: "visually-hidden"
}, hiddenText), /*#__PURE__*/_react["default"].createElement("span", {
className: "sd-tag-text"
}, text));
};
Tag.defaultProps = {
iconPath: '/static/img/components/tags/' // YouDot default path
};
Tag.propTypes = {
tagText: _propTypes["default"].string.isRequired,
tagIcon: _propTypes["default"].string,
tagStyle: _propTypes["default"].string,
tagType: _propTypes["default"].oneOf(Object.keys(tagTypeMap)),
hiddenText: _propTypes["default"].string,
iconPath: _propTypes["default"].string
};
var _default = Tag;
exports["default"] = _default;
//# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJuYW1lcyI6WyJ0YWdUeXBlTWFwIiwibmV1dHJhbCIsImludmFsaWQiLCJ3YXJuaW5nIiwiZXJyb3IiLCJiYWQiLCJzdWNjZXNzIiwiZ29vZCIsInJlc2VhcmNoIiwidXBkYXRlZCIsInJlY29tbWVuZGVkIiwicHJvbW90aW9uYWwiLCJoZWFsdGgiLCJUYWciLCJwcm9wcyIsInRleHQiLCJ0YWdUZXh0IiwidHlwZSIsInRhZ1R5cGUiLCJzdHlsZSIsInRhZ1N0eWxlIiwiaGlkZGVuVGV4dCIsInRhZ0ljb24iLCJpY29uUGF0aCIsImRlZmF1bHRQcm9wcyIsInByb3BUeXBlcyIsIlByb3BUeXBlcyIsInN0cmluZyIsImlzUmVxdWlyZWQiLCJvbmVPZiIsIk9iamVjdCIsImtleXMiXSwic291cmNlcyI6WyIuLi9zcmMvbGliL3RhZ3MuanN4Il0sInNvdXJjZXNDb250ZW50IjpbImltcG9ydCBSZWFjdCBmcm9tICdyZWFjdCc7XG5pbXBvcnQgUHJvcFR5cGVzIGZyb20gJ3Byb3AtdHlwZXMnO1xuXG4vLyBFeGFtcGxlOlxuLy8gPFRhZyB0YWdUZXh0PVwiVW5yZWFkXCIgdGFnVHlwZT1cIndhcm5pbmdcIiAvPlxuLy8gPFRhZyB0YWdUeXBlPVwicmVzZWFyY2hcIiB0YWdTdHlsZT1cIm1vZC10cmFuc3BhcmVudFwiIC8+XG5cbmNvbnN0IHRhZ1R5cGVNYXAgPSB7XG4gICAgJyc6ICcnLFxuICAgIG5ldXRyYWw6ICduZXV0cmFsJyxcbiAgICBpbnZhbGlkOiAnaW52YWxpZCcsXG4gICAgd2FybmluZzogJ3dhcm5pbmcnLFxuICAgIGVycm9yOiAnZXJyb3InLFxuICAgIGJhZDogJ2JhZCcsXG4gICAgc3VjY2VzczogJ3N1Y2Nlc3MnLFxuICAgIGdvb2Q6ICdnb29kJyxcbiAgICByZXNlYXJjaDogJ3Jlc2VhcmNoJyxcbiAgICBuZXc6ICduZXcnLFxuICAgIHVwZGF0ZWQ6ICd1cGRhdGVkJyxcbiAgICByZWNvbW1lbmRlZDogJ3JlY29tbWVuZGVkJyxcbiAgICBwcm9tb3Rpb25hbDogJ3Byb21vdGlvbmFsJyxcbiAgICAndG90YWwtaGVhbHRoLXByb21vdGlvbmFsJzogJ3RvdGFsLWhlYWx0aC1wcm9tb3Rpb25hbCcsXG4gICAgaGVhbHRoOiAnaGVhbHRoJyxcbiAgICAncHJlbWl1bS1wcm9tb3Rpb25hbCc6ICdwcmVtaXVtLXByb21vdGlvbmFsJyxcbn07XG5cbmNvbnN0IFRhZyA9IHByb3BzID0+IHtcbiAgICBjb25zdCB0ZXh0ID0gcHJvcHMudGFnVGV4dCA/IHByb3BzLnRhZ1RleHQgOiAnJztcbiAgICBjb25zdCB0eXBlID0gcHJvcHMudGFnVHlwZSA/IGBzZC10YWctJHtwcm9wcy50YWdUeXBlfWAgOiAnc2QtdGFnLW5ldXRyYWwnO1xuICAgIGNvbnN0IHN0eWxlID0gcHJvcHMudGFnU3R5bGUgPyBwcm9wcy50YWdTdHlsZSA6ICcnO1xuICAgIGNvbnN0IGhpZGRlblRleHQgPSBwcm9wcy5oaWRkZW5UZXh0O1xuXG4gICAgcmV0dXJuIChcbiAgICAgICAgPGRpdlxuICAgICAgICAgICAgY2xhc3NOYW1lPXtgJHt0eXBlfSR7c3R5bGUgPyBgICR7c3R5bGV9YCA6ICcnfSR7XG4gICAgICAgICAgICAgICAgcHJvcHMudGFnSWNvbiB8fCBwcm9wcy50YWdUeXBlID09PSAncmVzZWFyY2gnID8gJyB3aXRoLWljb24nIDogJydcbiAgICAgICAgICAgIH1gfVxuICAgICAgICAgICAgZGF0YS10ZXh0PXt0ZXh0fVxuICAgICAgICA+XG4gICAgICAgICAgICB7cHJvcHMudGFnSWNvbiAmJiBwcm9wcy50YWdUeXBlICE9PSAncmVzZWFyY2gnICYmIChcbiAgICAgICAgICAgICAgICA8c3ZnIGZvY3VzYWJsZT1cImZhbHNlXCIgYXJpYS1oaWRkZW49XCJ0cnVlXCIgY2xhc3NOYW1lPVwic2QtdGFnLWljb25cIiBoZWlnaHQ9XCIxMFwiIHdpZHRoPVwiMTBcIj5cbiAgICAgICAgICAgICAgICAgICAgPHVzZSB4bGlua0hyZWY9e2Ake3Byb3BzLmljb25QYXRofSR7cHJvcHMudGFnSWNvbn0uc3ZnI2ljb25gfSAvPlxuICAgICAgICAgICAgICAgIDwvc3ZnPlxuICAgICAgICAgICAgKX1cbiAgICAgICAgICAgIHtwcm9wcy50YWdUeXBlID09PSAncmVzZWFyY2gnICYmIChcbiAgICAgICAgICAgICAgICA8aW1nIHNyYz17YCR7cHJvcHMuaWNvblBhdGh9aWNfdGFnX3Jlc2VhcmNoLnN2Z2B9IGFyaWEtaGlkZGVuPVwidHJ1ZVwiIGhlaWdodD1cIjEwXCIgd2lkdGg9XCIxMFwiIGFsdD1cIlwiIC8+XG4gICAgICAgICAgICApfVxuICAgICAgICAgICAge2hpZGRlblRleHQgJiYgPHNwYW4gY2xhc3NOYW1lPVwidmlzdWFsbHktaGlkZGVuXCI+e2hpZGRlblRleHR9PC9zcGFuPn1cbiAgICAgICAgICAgIDxzcGFuIGNsYXNzTmFtZT1cInNkLXRhZy10ZXh0XCI+e3RleHR9PC9zcGFuPlxuICAgICAgICA8L2Rpdj5cbiAgICApO1xufTtcblxuVGFnLmRlZmF1bHRQcm9wcyA9IHtcbiAgICBpY29uUGF0aDogJy9zdGF0aWMvaW1nL2NvbXBvbmVudHMvdGFncy8nLCAvLyBZb3VEb3QgZGVmYXVsdCBwYXRoXG59O1xuXG5UYWcucHJvcFR5cGVzID0ge1xuICAgIHRhZ1RleHQ6IFByb3BUeXBlcy5zdHJpbmcuaXNSZXF1aXJlZCxcbiAgICB0YWdJY29uOiBQcm9wVHlwZXMuc3RyaW5nLFxuICAgIHRhZ1N0eWxlOiBQcm9wVHlwZXMuc3RyaW5nLFxuICAgIHRhZ1R5cGU6IFByb3BUeXBlcy5vbmVPZihPYmplY3Qua2V5cyh0YWdUeXBlTWFwKSksXG4gICAgaGlkZGVuVGV4dDogUHJvcFR5cGVzLnN0cmluZyxcbiAgICBpY29uUGF0aDogUHJvcFR5cGVzLnN0cmluZyxcbn07XG5cbmV4cG9ydCBkZWZhdWx0IFRhZztcbiJdLCJtYXBwaW5ncyI6Ijs7Ozs7OztBQUFBOztBQUNBOzs7O0FBRUE7QUFDQTtBQUNBO0FBRUEsSUFBTUEsVUFBVSxHQUFHO0VBQ2YsSUFBSSxFQURXO0VBRWZDLE9BQU8sRUFBRSxT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