diff --git a/src/components/Text/TextStylePropTypes.js b/src/components/Text/TextStylePropTypes.js
new file mode 100644
index 00000000..986d9915
--- /dev/null
+++ b/src/components/Text/TextStylePropTypes.js
@@ -0,0 +1,31 @@
+import { pickProps } from '../../modules/filterObjectProps'
+import CoreComponent from '../CoreComponent'
+
+export default {
+ ...pickProps(CoreComponent.stylePropTypes, [
+ 'backgroundColor',
+ 'color',
+ 'direction',
+ 'font',
+ 'fontFamily',
+ 'fontSize',
+ 'fontWeight',
+ 'letterSpacing',
+ 'lineHeight',
+ 'margin',
+ 'marginBottom',
+ 'marginLeft',
+ 'marginRight',
+ 'marginTop',
+ 'padding',
+ 'paddingBottom',
+ 'paddingLeft',
+ 'paddingRight',
+ 'paddingTop',
+ 'textAlign',
+ 'textDecoration',
+ 'textTransform',
+ 'whiteSpace',
+ 'wordWrap'
+ ])
+}
diff --git a/src/components/Text/index.js b/src/components/Text/index.js
new file mode 100644
index 00000000..9d58672a
--- /dev/null
+++ b/src/components/Text/index.js
@@ -0,0 +1,65 @@
+import { pickProps } from '../../modules/filterObjectProps'
+import CoreComponent from '../CoreComponent'
+import React, { PropTypes } from 'react'
+import TextStylePropTypes from './TextStylePropTypes'
+
+const styles = {
+ initial: {
+ color: 'inherit',
+ display: 'inline-block',
+ font: 'inherit',
+ margin: 0,
+ padding: 0,
+ wordWrap: 'break-word'
+ },
+ singleLineStyle: {
+ maxWidth: '100%',
+ overflow: 'hidden',
+ textOverflow: 'ellipsis',
+ whiteSpace: 'nowrap'
+ }
+}
+
+class Text extends React.Component {
+ static propTypes = {
+ children: PropTypes.any,
+ component: CoreComponent.propTypes.component,
+ numberOfLines: PropTypes.number,
+ onPress: PropTypes.func,
+ style: PropTypes.shape(TextStylePropTypes),
+ testID: CoreComponent.propTypes.testID
+ }
+
+ static stylePropTypes = TextStylePropTypes
+
+ static defaultProps = {
+ component: 'span',
+ style: styles.initial
+ }
+
+ _onPress(e) {
+ if (this.props.onPress) this.props.onPress(e)
+ }
+
+ render() {
+ const { children, component, numberOfLines, style, testID } = this.props
+ const resolvedStyle = pickProps(style, Object.keys(TextStylePropTypes))
+
+ return (
+
+ )
+ }
+}
+
+export default Text
diff --git a/src/modules/Text/index.spec.js b/src/components/Text/index.spec.js
similarity index 61%
rename from src/modules/Text/index.spec.js
rename to src/components/Text/index.spec.js
index 54e59ca8..27a405a5 100644
--- a/src/modules/Text/index.spec.js
+++ b/src/components/Text/index.spec.js
@@ -1,7 +1,6 @@
import assert from 'assert'
import React from 'react/addons'
-import { TextDefaultStyle } from './TextStylePropTypes'
import Text from '.'
const ReactTestUtils = React.addons.TestUtils
@@ -27,16 +26,6 @@ suite('Text', () => {
assert.equal(result.props.children, children)
})
- test('prop "className"', () => {
- const className = 'className'
- const result = shallowRender()
-
- assert.ok(
- (result.props.className).indexOf(className) > -1,
- '"className" was not transferred'
- )
- })
-
test('prop "component"', () => {
const type = 'a'
const result = ReactTestUtils.renderIntoDocument()
@@ -49,19 +38,43 @@ suite('Text', () => {
)
})
+ test.skip('prop "numberOfLines"', () => {})
+
+ test('prop "onPress"', (done) => {
+ const result = ReactTestUtils.renderIntoDocument()
+ const root = React.findDOMNode(result)
+ ReactTestUtils.Simulate.click(root)
+
+ function onPress(e) {
+ assert(true, 'the "onPress" callback was never called')
+ assert.ok(e.nativeEvent)
+ done()
+ }
+ })
+
test('prop "style"', () => {
const initial = shallowRender()
assert.deepEqual(
initial.props.style,
- TextDefaultStyle,
- 'default "style" is incorrect'
+ Text.defaultProps.style
)
- const unsupported = shallowRender()
+ const unsupported = shallowRender()
assert.deepEqual(
- unsupported.props.style.unsupported,
+ unsupported.props.style.flexDirection,
null,
'unsupported "style" properties must not be transferred'
)
})
+
+ test('prop "testID"', () => {
+ const testID = 'Example.text'
+ const result = ReactTestUtils.renderIntoDocument()
+ const root = React.findDOMNode(result)
+
+ assert.equal(
+ root.getAttribute('data-testid'),
+ testID
+ )
+ })
})
diff --git a/src/modules/Text/TextStylePropTypes.js b/src/modules/Text/TextStylePropTypes.js
deleted file mode 100644
index c414398e..00000000
--- a/src/modules/Text/TextStylePropTypes.js
+++ /dev/null
@@ -1,11 +0,0 @@
-import { StylePropTypes } from '../react-native-web-style'
-import { ViewStylePropTypes } from '../View/ViewStylePropTypes'
-
-export default {
- ...ViewStylePropTypes,
- ...StylePropTypes.TypographicPropTypes
-}
-
-export const TextDefaultStyle = {
- display: 'inline'
-}
diff --git a/src/modules/Text/index.js b/src/modules/Text/index.js
deleted file mode 100644
index b648c9cf..00000000
--- a/src/modules/Text/index.js
+++ /dev/null
@@ -1,37 +0,0 @@
-import { pickProps } from '../filterObjectProps'
-import { WebStyleComponent } from '../react-native-web-style'
-import React, { PropTypes } from 'react'
-import TextStylePropTypes, { TextDefaultStyle } from './TextStylePropTypes'
-
-class Text extends React.Component {
- static propTypes = {
- children: PropTypes.any,
- className: PropTypes.string,
- component: PropTypes.oneOfType([
- PropTypes.func,
- PropTypes.string
- ]),
- style: PropTypes.shape(TextStylePropTypes)
- }
-
- static defaultProps = {
- className: '',
- component: 'span'
- }
-
- render() {
- const { className, style, ...other } = this.props
- const filteredStyle = pickProps(style, Object.keys(TextStylePropTypes))
- const mergedStyle = { ...TextDefaultStyle, ...filteredStyle }
-
- return (
-
- )
- }
-}
-
-export default Text