@prosperitainova/dumbo-react-native
Version:
Dumbo for React Native Library
124 lines (120 loc) • 4.55 kB
JavaScript
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.Text = void 0;
var _react = _interopRequireDefault(require("react"));
var _reactNative = require("react-native");
var _helpers = require("../../helpers");
var _colors = require("../../styles/colors");
var _typography = require("../../styles/typography");
var _jsxRuntime = require("react/jsx-runtime");
function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
/** Types of Text items */
/**
* Types of text break modes (where to apply ellipsis)
* `head` - Ellipsis at the beginning
* `middle` - Ellipsis at the middle of string
* `tail` - Ellipsis at the end of string
* `wrap` - No ellipsis. Text will just run on. Wrapping style may need to handle this
* */
/** Props for Text component */
/**
* Text component for rendering blocks of text styled with Carbon text style
*
* {@link https://github.com/carbon-design-system/carbon-react-native/blob/main/example/src/Views/Text.tsx | Example code}
*/
class Text extends _react.default.Component {
get textStyle() {
const {
type,
style
} = this.props;
let finalStyle = {};
switch (type) {
case 'code-01':
finalStyle = (0, _helpers.styleReferenceBreaker)((0, _typography.Code01)());
break;
case 'code-02':
finalStyle = (0, _helpers.styleReferenceBreaker)((0, _typography.Code02)());
break;
case 'label-01':
finalStyle = (0, _helpers.styleReferenceBreaker)((0, _typography.Label01)());
break;
case 'label-02':
finalStyle = (0, _helpers.styleReferenceBreaker)((0, _typography.Label02)());
break;
case 'helper-text-01':
finalStyle = (0, _helpers.styleReferenceBreaker)((0, _typography.HelperText01)());
break;
case 'helper-text-02':
finalStyle = (0, _helpers.styleReferenceBreaker)((0, _typography.HelperText02)());
break;
case 'legal-01':
finalStyle = (0, _helpers.styleReferenceBreaker)((0, _typography.Legal01)());
break;
case 'legal-02':
finalStyle = (0, _helpers.styleReferenceBreaker)((0, _typography.Legal02)());
break;
case 'body-compact-01':
finalStyle = (0, _helpers.styleReferenceBreaker)((0, _typography.BodyCompact01)());
break;
case 'body-01':
finalStyle = (0, _helpers.styleReferenceBreaker)((0, _typography.Body01)());
break;
case 'body-02':
finalStyle = (0, _helpers.styleReferenceBreaker)((0, _typography.Body02)());
break;
case 'heading-compact-01':
finalStyle = (0, _helpers.styleReferenceBreaker)((0, _typography.HeadingCompact01)());
break;
case 'heading-compact-02':
finalStyle = (0, _helpers.styleReferenceBreaker)((0, _typography.HeadingCompact02)());
break;
case 'heading-01':
finalStyle = (0, _helpers.styleReferenceBreaker)((0, _typography.Heading01)());
break;
case 'heading-02':
finalStyle = (0, _helpers.styleReferenceBreaker)((0, _typography.Heading02)());
break;
case 'heading-03':
finalStyle = (0, _helpers.styleReferenceBreaker)((0, _typography.Heading03)());
break;
case 'heading-04':
finalStyle = (0, _helpers.styleReferenceBreaker)((0, _typography.Heading04)());
break;
case 'heading-05':
finalStyle = (0, _helpers.styleReferenceBreaker)((0, _typography.Heading05)());
break;
case 'heading-06':
finalStyle = (0, _helpers.styleReferenceBreaker)((0, _typography.Heading06)());
break;
case 'heading-07':
finalStyle = (0, _helpers.styleReferenceBreaker)((0, _typography.Heading07)());
break;
case 'body-compact-02':
default:
finalStyle = (0, _helpers.styleReferenceBreaker)((0, _typography.BodyCompact02)());
break;
}
return (0, _helpers.styleReferenceBreaker)((0, _helpers.styleReferenceBreaker)(finalStyle, {
color: (0, _colors.getColor)('textPrimary')
}), style);
}
render() {
const {
text,
breakMode,
componentProps
} = this.props;
return /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
style: this.textStyle,
numberOfLines: breakMode !== 'wrap' && !!breakMode ? 1 : undefined,
ellipsizeMode: breakMode === 'wrap' ? undefined : breakMode,
...(componentProps || {}),
children: text
});
}
}
exports.Text = Text;
//# sourceMappingURL=index.js.map