UNPKG

wix-style-react

Version:
105 lines (89 loc) 4.12 kB
import _defineProperty from "@babel/runtime/helpers/defineProperty"; import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties"; var _excluded = ["size", "secondary", "skin", "light", "weight", "tagName", "children", "ellipsis", "showDelay", "hideDelay", "appendTo", "flip", "fixed", "placement", "timeout", "maxWidth", "zIndex", "showTooltip", "listStyle"], _excluded2 = ["dataHook", "className"]; function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) { symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; } function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; } import React from 'react'; import PropTypes from 'prop-types'; import { st, classes } from './Text.st.css'; var getStyleDataAttributes = function getStyleDataAttributes(styleAttributes) { return Object.keys(styleAttributes).reduce(function (acc, styleKey) { acc["data-".concat(styleKey)] = styleAttributes[styleKey]; return acc; }, {}); }; var RawText = /*#__PURE__*/React.forwardRef(function (_ref, ref) { var size = _ref.size, secondary = _ref.secondary, skin = _ref.skin, light = _ref.light, weight = _ref.weight, tagName = _ref.tagName, children = _ref.children, ellipsis = _ref.ellipsis, showDelay = _ref.showDelay, hideDelay = _ref.hideDelay, appendTo = _ref.appendTo, flip = _ref.flip, fixed = _ref.fixed, placement = _ref.placement, timeout = _ref.timeout, maxWidth = _ref.maxWidth, zIndex = _ref.zIndex, showTooltip = _ref.showTooltip, listStyle = _ref.listStyle, rest = _objectWithoutProperties(_ref, _excluded); /* eslint-disable no-unused-vars */ var dataHook = rest.dataHook, className = rest.className, textProps = _objectWithoutProperties(rest, _excluded2); var styleAttributes = { size: size, secondary: secondary, skin: skin, light: light, weight: weight, 'list-style': listStyle }; var styleDataAttributes = getStyleDataAttributes(styleAttributes); return /*#__PURE__*/React.createElement(tagName, _objectSpread(_objectSpread({ ref: ref }, textProps), {}, { 'data-hook': dataHook, className: st(classes.root, styleAttributes, className) }, styleDataAttributes), children); }); RawText.displayName = 'Text'; RawText.propTypes = { /** Applied as data-hook HTML attribute that can be used in the tests */ dataHook: PropTypes.string, /** class to be applied to the root element */ className: PropTypes.string, /** tag name that will be rendered */ tagName: PropTypes.string, /** Styling to be applied to the root element */ style: PropTypes.object, /** font size of the text */ size: PropTypes.oneOf(['tiny', 'small', 'medium']), /** any nodes to be rendered (usually text nodes) */ children: PropTypes.any, /** is the text type is secondary. Affects the font color */ secondary: PropTypes.bool, /** skin color of the text */ skin: PropTypes.oneOf(['standard', 'success', 'error', 'premium', 'disabled', 'primary']), /** make the text color lighter */ light: PropTypes.bool, /** font weight of the text */ weight: PropTypes.oneOf(['thin', 'normal', 'bold']) }; RawText.defaultProps = { size: 'medium', secondary: false, skin: 'standard', light: false, weight: 'thin', tagName: 'span', listStyle: 'checkmark' }; export default RawText;