@prosperitainova/dumbo-react-native
Version:
Dumbo for React Native Library
118 lines (114 loc) • 3.86 kB
JavaScript
"use strict";
import React from 'react';
import { Text as ReactText } from 'react-native';
import { styleReferenceBreaker } from '../../helpers';
import { getColor } from '../../styles/colors';
import { Body01, Body02, BodyCompact01, BodyCompact02, Code01, Code02, Heading01, Heading02, Heading03, Heading04, Heading05, Heading06, Heading07, HeadingCompact01, HeadingCompact02, HelperText01, HelperText02, Label01, Label02, Legal01, Legal02 } from '../../styles/typography';
/** 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 */
import { jsx as _jsx } from "react/jsx-runtime";
/**
* 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}
*/
export class Text extends React.Component {
get textStyle() {
const {
type,
style
} = this.props;
let finalStyle = {};
switch (type) {
case 'code-01':
finalStyle = styleReferenceBreaker(Code01());
break;
case 'code-02':
finalStyle = styleReferenceBreaker(Code02());
break;
case 'label-01':
finalStyle = styleReferenceBreaker(Label01());
break;
case 'label-02':
finalStyle = styleReferenceBreaker(Label02());
break;
case 'helper-text-01':
finalStyle = styleReferenceBreaker(HelperText01());
break;
case 'helper-text-02':
finalStyle = styleReferenceBreaker(HelperText02());
break;
case 'legal-01':
finalStyle = styleReferenceBreaker(Legal01());
break;
case 'legal-02':
finalStyle = styleReferenceBreaker(Legal02());
break;
case 'body-compact-01':
finalStyle = styleReferenceBreaker(BodyCompact01());
break;
case 'body-01':
finalStyle = styleReferenceBreaker(Body01());
break;
case 'body-02':
finalStyle = styleReferenceBreaker(Body02());
break;
case 'heading-compact-01':
finalStyle = styleReferenceBreaker(HeadingCompact01());
break;
case 'heading-compact-02':
finalStyle = styleReferenceBreaker(HeadingCompact02());
break;
case 'heading-01':
finalStyle = styleReferenceBreaker(Heading01());
break;
case 'heading-02':
finalStyle = styleReferenceBreaker(Heading02());
break;
case 'heading-03':
finalStyle = styleReferenceBreaker(Heading03());
break;
case 'heading-04':
finalStyle = styleReferenceBreaker(Heading04());
break;
case 'heading-05':
finalStyle = styleReferenceBreaker(Heading05());
break;
case 'heading-06':
finalStyle = styleReferenceBreaker(Heading06());
break;
case 'heading-07':
finalStyle = styleReferenceBreaker(Heading07());
break;
case 'body-compact-02':
default:
finalStyle = styleReferenceBreaker(BodyCompact02());
break;
}
return styleReferenceBreaker(styleReferenceBreaker(finalStyle, {
color: getColor('textPrimary')
}), style);
}
render() {
const {
text,
breakMode,
componentProps
} = this.props;
return /*#__PURE__*/_jsx(ReactText, {
style: this.textStyle,
numberOfLines: breakMode !== 'wrap' && !!breakMode ? 1 : undefined,
ellipsizeMode: breakMode === 'wrap' ? undefined : breakMode,
...(componentProps || {}),
children: text
});
}
}
//# sourceMappingURL=index.js.map