@geezee/react-ui
Version:
Modern and minimalist React UI library.
51 lines (47 loc) • 2.01 kB
JavaScript
import _extends from "@babel/runtime/helpers/esm/extends";
import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
import _JSXStyle from "styled-jsx/style";
import React, { useMemo } from 'react';
import withDefaults from '../utils/with-defaults';
import useTheme from '../styles/use-theme';
var defaultProps = {
type: 'default',
className: ''
};
var getTypeColor = function getTypeColor(type, palette) {
var colors = {
"default": 'inherit',
primary: palette.success,
secondary: palette.secondary,
success: palette.success,
warning: palette.warning,
error: palette.error
};
return colors[type] || colors["default"];
};
var TextChild = function TextChild(_ref) {
var children = _ref.children,
tag = _ref.tag,
className = _ref.className,
type = _ref.type,
size = _ref.size,
props = _objectWithoutProperties(_ref, ["children", "tag", "className", "type", "size"]);
var theme = useTheme();
var Component = tag;
var color = useMemo(function () {
return getTypeColor(type, theme.palette);
}, [type, theme.palette]);
var fontSize = useMemo(function () {
if (!size) return 'inherit';
if (typeof size === 'number') return "".concat(size, "px");
return size;
}, [size]);
return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(Component, _extends({}, props, {
className: _JSXStyle.dynamic([["1575699407", [tag, color, fontSize]]]) + " " + (props && props.className != null && props.className || "".concat(size ? 'custom-size' : '', " ").concat(className))
}), children), /*#__PURE__*/React.createElement(_JSXStyle, {
id: "1575699407",
dynamic: [tag, color, fontSize]
}, "".concat(tag, ".__jsx-style-dynamic-selector{color:").concat(color, ";}.custom-size.__jsx-style-dynamic-selector{font-size:").concat(fontSize, ";}")));
};
var MemoTextChild = React.memo(TextChild);
export default withDefaults(MemoTextChild, defaultProps);