kylefang/react-native-web
1
0
Fork 0
mirror of https://github.com/zhigang1992/react-native-web.git synced 2026-01-12 17:43:00 +08:00
Code Issues Packages Projects Releases Wiki Activity

Install eslint and fix code style

Browse Source
This commit is contained in:
Nicolas Gallagher
2015-09-02 17:15:05 -07:00
parent ff5c8f64cc
commit 1417dd2e6a
31 changed files with 262 additions and 240 deletions
Download Patch File Download Diff File Expand all files Collapse all files

3
.eslintignore Normal file
View File

@@ -0,0 +1,3 @@
dist
docs
example

17
.eslintrc Normal file
View File

@@ -0,0 +1,17 @@
{
// babel parser to support ES features
"parser": "babel-eslint",
// based on https://github.com/feross/standard
"extends": [ "standard", "standard-react" ],
"env": {
"mocha": true
},
"rules": {
// overrides of the standard style
"space-before-function-paren": [ 2, { "anonymous": "always", "named": "never" } ],
"wrap-iife": [ 2, "outside" ],
// overrides of the standard-react style
"react/jsx-sort-props": 2,
"react/jsx-sort-prop-types": 2
}
}

10
karma.config.js
View File

@@ -1,9 +1,7 @@
'use strict';
var webpackConfig = require('./webpack-base.config.js');
var webpackConfig = require('./webpack-base.config.js')
// entry is determined by karma config 'files' array
webpackConfig.devtool = 'inline-source-map'
webpackConfig.entry = {};
webpackConfig.entry = {}
module.exports = function (config) {
config.set({
@@ -43,5 +41,5 @@ module.exports = function (config) {
modules: false
}
}
});
};
})
}

7
package.json
View File

@@ -12,6 +12,7 @@
"build:watch": "npm run build -- --watch",
"build:example": "npm run build && cd example && webpack --config ./webpack.config.js",
"build:example:watch": "npm run build:example -- --watch",
"lint": "eslint .",
"test": "NODE_ENV=test karma start karma.config.js",
"test:watch": "npm test -- --no-single-run"
},
@@ -21,9 +22,15 @@
"devDependencies": {
"autoprefixer-core": "^5.2.0",
"babel-core": "^5.5.6",
"babel-eslint": "^4.1.1",
"babel-loader": "^5.1.4",
"babel-runtime": "^5.5.6",
"css-loader": "^0.15.1",
"eslint": "^1.3.1",
"eslint-config-standard": "^4.1.0",
"eslint-config-standard-react": "^1.0.4",
"eslint-plugin-react": "^3.3.1",
"eslint-plugin-standard": "^1.3.0",
"extract-text-webpack-plugin": "^0.8.1",
"karma": "^0.13.9",
"karma-chrome-launcher": "^0.2.0",

14
src/index.js
View File

@@ -1,16 +1,16 @@
import React from 'react';
import React from 'react'
// components
import Image from './modules/Image';
import Text from './modules/Text';
import TextInput from './modules/TextInput';
import View from './modules/View';
import Image from './modules/Image'
import Text from './modules/Text'
import TextInput from './modules/TextInput'
import View from './modules/View'
export default React;
export default React
export {
Image,
Text,
TextInput,
View
};
}

8
src/modules/Image/ImageStylePropTypes.js
View File

@@ -1,5 +1,5 @@
import { StylePropTypes } from '../react-native-web-style';
import { PropTypes } from 'react';
import { StylePropTypes } from '../react-native-web-style'
import { PropTypes } from 'react'
export default {
...StylePropTypes.BorderThemePropTypes,
@@ -8,10 +8,10 @@ export default {
boxShadow: PropTypes.string,
opacity: PropTypes.number,
transform: PropTypes.string
};
}
export const ImageDefaultStyles = {
backgroundColor: 'lightGray',
borderWidth: 0,
maxWidth: '100%'
};
}

18
src/modules/Image/index.js
View File

@@ -1,7 +1,7 @@
import { pickProps } from '../filterObjectProps';
import { WebStyleComponent } from '../react-native-web-style';
import ImageStylePropTypes, { ImageDefaultStyles } from './ImageStylePropTypes';
import React, { PropTypes } from 'react';
import { pickProps } from '../filterObjectProps'
import { WebStyleComponent } from '../react-native-web-style'
import ImageStylePropTypes, { ImageDefaultStyles } from './ImageStylePropTypes'
import React, { PropTypes } from 'react'
class Image extends React.Component {
static propTypes = {
@@ -20,9 +20,9 @@ class Image extends React.Component {
}
render() {
const { className, src, style, ...other } = this.props;
const filteredStyle = pickProps(style, Object.keys(ImageStylePropTypes));
const mergedStyle = { ...ImageDefaultStyles, ...filteredStyle };
const { alt, className, src, style, ...other } = this.props
const filteredStyle = pickProps(style, Object.keys(ImageStylePropTypes))
const mergedStyle = { ...ImageDefaultStyles, ...filteredStyle }
return (
<WebStyleComponent
@@ -32,8 +32,8 @@ class Image extends React.Component {
component='img'
style={mergedStyle}
/>
);
)
}
}
export default Image;
export default Image

6
src/modules/Text/TextStylePropTypes.js
View File

@@ -1,10 +1,10 @@
import { StylePropTypes } from '../react-native-web-style';
import { ViewStylePropTypes } from '../View/ViewStylePropTypes';
import { StylePropTypes } from '../react-native-web-style'
import { ViewStylePropTypes } from '../View/ViewStylePropTypes'
export default {
...ViewStylePropTypes,
...StylePropTypes.TypographicPropTypes
};
}
export const TextDefaultStyle = {
display: 'inline'

18
src/modules/Text/index.js
View File

@@ -1,7 +1,7 @@
import { pickProps } from '../filterObjectProps';
import { WebStyleComponent } from '../react-native-web-style';
import React, { PropTypes } from 'react';
import TextStylePropTypes, { TextDefaultStyle } from './TextStylePropTypes';
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 = {
@@ -20,9 +20,9 @@ class Text extends React.Component {
}
render() {
const { className, style, ...other } = this.props;
const filteredStyle = pickProps(style, Object.keys(TextStylePropTypes));
const mergedStyle = { ...TextDefaultStyle, ...filteredStyle };
const { className, style, ...other } = this.props
const filteredStyle = pickProps(style, Object.keys(TextStylePropTypes))
const mergedStyle = { ...TextDefaultStyle, ...filteredStyle }
return (
<WebStyleComponent
@@ -30,8 +30,8 @@ class Text extends React.Component {
className={`Text ${className}`}
style={mergedStyle}
/>
);
)
}
}
export default Text;
export default Text

62
src/modules/Text/index.spec.js
View File

@@ -1,67 +1,67 @@
import assert from 'assert';
import React from 'react/addons';
import assert from 'assert'
import React from 'react/addons'
import { TextDefaultStyle } from './TextStylePropTypes';
import Text from '.';
import { TextDefaultStyle } from './TextStylePropTypes'
import Text from '.'
const ReactTestUtils = React.addons.TestUtils;
const ReactTestUtils = React.addons.TestUtils
function shallowRender(component, context = {}) {
const shallowRenderer = React.addons.TestUtils.createRenderer();
shallowRenderer.render(component, context);
return shallowRenderer.getRenderOutput();
const shallowRenderer = React.addons.TestUtils.createRenderer()
shallowRenderer.render(component, context)
return shallowRenderer.getRenderOutput()
}
suite('Text', () => {
test('defaults', () => {
const result = ReactTestUtils.renderIntoDocument(<Text />);
const root = React.findDOMNode(result);
const result = ReactTestUtils.renderIntoDocument(<Text />)
const root = React.findDOMNode(result)
assert.equal((root.tagName).toLowerCase(), 'span');
});
assert.equal((root.tagName).toLowerCase(), 'span')
})
test('prop "children"', () => {
const children = 'children';
const result = shallowRender(<Text>{children}</Text>);
const children = 'children'
const result = shallowRender(<Text>{children}</Text>)
assert.equal(result.props.children, children);
});
assert.equal(result.props.children, children)
})
test('prop "className"', () => {
const className = 'className';
const result = shallowRender(<Text className={className} />);
const className = 'className'
const result = shallowRender(<Text className={className} />)
assert.ok(
(result.props.className).indexOf(className) > -1,
'"className" was not transferred'
);
});
)
})
test('prop "component"', () => {
const type = 'a';
const result = ReactTestUtils.renderIntoDocument(<Text component={type} />);
const root = React.findDOMNode(result);
const type = 'a'
const result = ReactTestUtils.renderIntoDocument(<Text component={type} />)
const root = React.findDOMNode(result)
assert.equal(
(root.tagName).toLowerCase(),
type,
'"component" did not produce the correct DOM node type'
);
});
)
})
test('prop "style"', () => {
const initial = shallowRender(<Text />);
const initial = shallowRender(<Text />)
assert.deepEqual(
initial.props.style,
TextDefaultStyle,
'default "style" is incorrect'
);
)
const unsupported = shallowRender(<Text style={{ unsupported: 'true' }} />);
const unsupported = shallowRender(<Text style={{ unsupported: 'true' }} />)
assert.deepEqual(
unsupported.props.style.unsupported,
null,
'unsupported "style" properties must not be transferred'
);
});
});
)
})
})

9
src/modules/TextInput/TextInputStylePropTypes.js
View File

@@ -1,14 +1,13 @@
import { PropTypes } from 'react';
import { StylePropTypes } from '../react-native-web-style';
import ViewStylePropTypes from '../View/ViewStylePropTypes';
import { StylePropTypes } from '../react-native-web-style'
import ViewStylePropTypes from '../View/ViewStylePropTypes'
export default {
...ViewStylePropTypes,
...StylePropTypes.TypographicPropTypes
};
}
export const TextInputDefaultStyles = {
background: 'transparent',
color: 'inherit',
font: 'inherit'
};
}

20
src/modules/TextInput/index.js
View File

@@ -1,7 +1,7 @@
import { pickProps } from '../filterObjectProps';
import { WebStyleComponent } from '../react-native-web-style';
import React, { PropTypes } from 'react';
import TextInputStylePropTypes, { TextInputDefaultStyles } from './TextInputStylePropTypes';
import { pickProps } from '../filterObjectProps'
import { WebStyleComponent } from '../react-native-web-style'
import React, { PropTypes } from 'react'
import TextInputStylePropTypes, { TextInputDefaultStyles } from './TextInputStylePropTypes'
class TextInput extends React.Component {
static propTypes = {
@@ -10,7 +10,7 @@ class TextInput extends React.Component {
multiline: PropTypes.bool,
placeholder: PropTypes.string,
style: PropTypes.shape(TextInputStylePropTypes)
};
}
static defaultProps = {
editable: true,
@@ -18,9 +18,9 @@ class TextInput extends React.Component {
}
render() {
const { className, editable, multiline, placeholder, style, ...other } = this.props;
const filteredStyle = pickProps(style, Object.keys(TextInputStylePropTypes));
const mergedStyle = { ...TextInputDefaultStyles, ...filteredStyle };
const { className, editable, multiline, placeholder, style, ...other } = this.props
const filteredStyle = pickProps(style, Object.keys(TextInputStylePropTypes))
const mergedStyle = { ...TextInputDefaultStyles, ...filteredStyle }
return (
<WebStyleComponent
@@ -31,8 +31,8 @@ class TextInput extends React.Component {
placeholder={placeholder}
style={mergedStyle}
/>
);
)
}
}
export default TextInput;
export default TextInput

8
src/modules/View/ViewStylePropTypes.js
View File

@@ -1,5 +1,5 @@
import { PropTypes } from 'react';
import { StylePropTypes } from '../react-native-web-style';
import { PropTypes } from 'react'
import { StylePropTypes } from '../react-native-web-style'
export default {
...StylePropTypes.BackgroundPropTypes,
@@ -8,7 +8,7 @@ export default {
boxShadow: PropTypes.string,
opacity: PropTypes.number,
transform: PropTypes.string
};
}
// https://github.com/facebook/css-layout#default-values
export const ViewDefaultStyle = {
@@ -24,4 +24,4 @@ export const ViewDefaultStyle = {
margin: 0,
padding: 0,
position: 'relative'
};
}

20
src/modules/View/index.js
View File

@@ -1,7 +1,7 @@
import { pickProps } from '../filterObjectProps';
import { WebStyleComponent } from '../react-native-web-style';
import React, { PropTypes } from 'react';
import ViewStylePropTypes, { ViewDefaultStyle } from './ViewStylePropTypes';
import { pickProps } from '../filterObjectProps'
import { WebStyleComponent } from '../react-native-web-style'
import React, { PropTypes } from 'react'
import ViewStylePropTypes, { ViewDefaultStyle } from './ViewStylePropTypes'
class View extends React.Component {
static propTypes = {
@@ -26,14 +26,14 @@ class View extends React.Component {
}
render() {
const { className, pointerEvents, style, ...other } = this.props;
const filteredStyle = pickProps(style, Object.keys(ViewStylePropTypes));
const pointerEventsStyle = pointerEvents && { pointerEvents };
const { className, pointerEvents, style, ...other } = this.props
const filteredStyle = pickProps(style, Object.keys(ViewStylePropTypes))
const pointerEventsStyle = pointerEvents && { pointerEvents }
const mergedStyle = {
...ViewDefaultStyle,
...filteredStyle,
...pointerEventsStyle
};
}
return (
<WebStyleComponent
@@ -41,8 +41,8 @@ class View extends React.Component {
className={`View ${className}`}
style={mergedStyle}
/>
);
)
}
}
export default View;
export default View

68
src/modules/View/index.spec.js
View File

@@ -1,76 +1,76 @@
import assert from 'assert';
import React from 'react/addons';
import assert from 'assert'
import React from 'react/addons'
import { ViewDefaultStyle } from './ViewStylePropTypes';
import View from '.';
import { ViewDefaultStyle } from './ViewStylePropTypes'
import View from '.'
const ReactTestUtils = React.addons.TestUtils;
const ReactTestUtils = React.addons.TestUtils
function shallowRender(component, context = {}) {
const shallowRenderer = React.addons.TestUtils.createRenderer();
shallowRenderer.render(component, context);
return shallowRenderer.getRenderOutput();
const shallowRenderer = React.addons.TestUtils.createRenderer()
shallowRenderer.render(component, context)
return shallowRenderer.getRenderOutput()
}
suite('View', () => {
test('defaults', () => {
const result = ReactTestUtils.renderIntoDocument(<View />);
const root = React.findDOMNode(result);
const result = ReactTestUtils.renderIntoDocument(<View />)
const root = React.findDOMNode(result)
assert.equal((root.tagName).toLowerCase(), 'div');
});
assert.equal((root.tagName).toLowerCase(), 'div')
})
test('prop "children"', () => {
const children = 'children';
const result = shallowRender(<View>{children}</View>);
const children = 'children'
const result = shallowRender(<View>{children}</View>)
assert.equal(result.props.children, children);
});
assert.equal(result.props.children, children)
})
test('prop "className"', () => {
const className = 'className';
const result = shallowRender(<View className={className} />);
const className = 'className'
const result = shallowRender(<View className={className} />)
assert.ok(
(result.props.className).indexOf(className) > -1,
'"className" was not transferred'
);
});
)
})
test('prop "component"', () => {
const type = 'a';
const result = ReactTestUtils.renderIntoDocument(<View component={type} />);
const root = React.findDOMNode(result);
const type = 'a'
const result = ReactTestUtils.renderIntoDocument(<View component={type} />)
const root = React.findDOMNode(result)
assert.equal(
(root.tagName).toLowerCase(),
type,
'"component" did not produce the correct DOM node type'
);
});
)
})
test('prop "pointerEvents"', () => {
const result = shallowRender(<View pointerEvents="box-only" />);
const result = shallowRender(<View pointerEvents='box-only' />)
assert.equal(
result.props.style.pointerEvents,
'box-only'
);
});
)
})
test('prop "style"', () => {
const initial = shallowRender(<View />);
const initial = shallowRender(<View />)
assert.deepEqual(
initial.props.style,
ViewDefaultStyle,
'default "style" is incorrect'
);
)
const unsupported = shallowRender(<View style={{ unsupported: 'true' }} />);
const unsupported = shallowRender(<View style={{ unsupported: 'true' }} />)
assert.deepEqual(
unsupported.props.style.unsupported,
null,
'unsupported "style" properties must not be transferred'
);
});
});
)
})
})

22
src/modules/filterObjectProps/index.js
View File

@@ -1,29 +1,29 @@
function filterProps(obj, props, excluded=false) {
function filterProps(obj, props, excluded = false) {
if (!Array.isArray(props)) {
throw new TypeError('props is not an Array');
throw new TypeError('props is not an Array')
}
let filtered = {};
for (let prop in obj) {
const filtered = {}
for (const prop in obj) {
if (Object.prototype.hasOwnProperty.call(obj, prop)) {
let isMatch = props.indexOf(prop) > -1;
const isMatch = props.indexOf(prop) > -1
if (excluded && isMatch) {
continue;
continue
} else if (!excluded && !isMatch) {
continue;
continue
}
filtered[prop] = obj[prop];
filtered[prop] = obj[prop]
}
}
return filtered;
return filtered
}
export function pickProps(obj, props) {
return filterProps(obj, props);
return filterProps(obj, props)
}
export function omitProps(obj, props) {
return filterProps(obj, props, true);
return filterProps(obj, props, true)
}

45
src/modules/filterObjectProps/index.spec.js
View File

@@ -1,41 +1,40 @@
import { omitProps, pickProps } from '.';
import assert from 'assert';
import React from 'react/addons';
import { omitProps, pickProps } from '.'
import assert from 'assert'
suite('pickProps', () => {
test('interface', () => {
assert.throws(
() => { pickProps({}, true); },
() => { pickProps({}, true) },
TypeError,
'pickProps should throw if the second argument is not an array'
);
});
)
})
test('return value', () => {
const obj = { a: 1, b: 2, c: { cc: { ccc: 3 } } };
const props = [ 'a', 'b' ];
const expected = { a: 1, b: 2 };
const actual = pickProps(obj, props);
const obj = { a: 1, b: 2, c: { cc: { ccc: 3 } } }
const props = [ 'a', 'b' ]
const expected = { a: 1, b: 2 }
const actual = pickProps(obj, props)
assert.deepEqual(actual, expected);
});
});
assert.deepEqual(actual, expected)
})
})
suite('omitProps', () => {
test('interface', () => {
assert.throws(
() => { omitProps({}, true); },
() => { omitProps({}, true) },
TypeError,
'omitProps should throw if the second argument is not an array'
);
});
)
})
test('return value', () => {
const obj = { a: 1, b: 2, c: { cc: { ccc: 3 } } };
const props = [ 'a', 'b' ];
const expected = { c: { cc: { ccc: 3 } } };
const actual = omitProps(obj, props);
const obj = { a: 1, b: 2, c: { cc: { ccc: 3 } } }
const props = [ 'a', 'b' ]
const expected = { c: { cc: { ccc: 3 } } }
const actual = omitProps(obj, props)
assert.deepEqual(actual, expected);
});
});
assert.deepEqual(actual, expected)
})
})

12
src/modules/react-native-web-style/index.js vendored
View File

@@ -1,6 +1,6 @@
import React, { PropTypes } from 'react';
import restyle from './modules/restyle';
import StylePropTypes from './modules/StylePropTypes';
import React, { PropTypes } from 'react'
import restyle from './modules/restyle'
import StylePropTypes from './modules/StylePropTypes'
class WebStyleComponent extends React.Component {
static propTypes = {
@@ -18,15 +18,15 @@ class WebStyleComponent extends React.Component {
}
render() {
const { component: Component, ...other } = this.props;
const { component: Component, ...other } = this.props
return (
<Component
{...other}
{...restyle(this.props)}
/>
);
)
}
}
export { StylePropTypes, restyle, WebStyleComponent };
export { StylePropTypes, restyle, WebStyleComponent }

4
src/modules/react-native-web-style/modules/StylePropTypes/Background.js vendored
View File

@@ -1,4 +1,4 @@
import { PropTypes } from 'react';
import { PropTypes } from 'react'
export default {
backgroundColor: PropTypes.string,
@@ -6,4 +6,4 @@ export default {
backgroundPosition: PropTypes.string,
backgroundRepeat: PropTypes.string,
backgroundSize: PropTypes.string
};
}

8
src/modules/react-native-web-style/modules/StylePropTypes/BorderTheme.js vendored
View File

@@ -1,9 +1,9 @@
import { PropTypes } from 'react';
import { PropTypes } from 'react'
const numberOrString = PropTypes.oneOfType([
PropTypes.number,
PropTypes.string,
]);
PropTypes.string
])
export default {
// border-color
@@ -20,4 +20,4 @@ export default {
borderTopRightRadius: numberOrString,
borderBottomLeftRadius: numberOrString,
borderBottomRightRadius: numberOrString
};
}

8
src/modules/react-native-web-style/modules/StylePropTypes/BoxModel.js vendored
View File

@@ -1,9 +1,9 @@
import {PropTypes} from 'react';
import {PropTypes} from 'react'
const numberOrString = PropTypes.oneOfType([
PropTypes.number,
PropTypes.string,
]);
PropTypes.string
])
export default {
boxSizing: PropTypes.oneOf([
@@ -39,4 +39,4 @@ export default {
paddingBottom: numberOrString,
paddingLeft: numberOrString,
paddingRight: numberOrString
};
}

4
src/modules/react-native-web-style/modules/StylePropTypes/Flexbox.js vendored
View File

@@ -1,4 +1,4 @@
import { PropTypes } from 'react';
import { PropTypes } from 'react'
export default {
alignContent: PropTypes.oneOf([
@@ -46,4 +46,4 @@ export default {
'space-between'
]),
order: PropTypes.number
};
}

8
src/modules/react-native-web-style/modules/StylePropTypes/Layout.js vendored
View File

@@ -1,9 +1,9 @@
import BoxModel from './BoxModel';
import Flexbox from './Flexbox';
import Position from './Position';
import BoxModel from './BoxModel'
import Flexbox from './Flexbox'
import Position from './Position'
export default {
...BoxModel,
...Flexbox,
...Position
};
}

10
src/modules/react-native-web-style/modules/StylePropTypes/Position.js vendored
View File

@@ -1,19 +1,19 @@
import { PropTypes } from 'react';
import { PropTypes } from 'react'
const numberOrString = PropTypes.oneOfType([
PropTypes.number,
PropTypes.string,
]);
PropTypes.string
])
export default {
position: PropTypes.oneOf([
'absolute',
'fixed',
'relative' /*default*/
'relative' /* default */
]),
bottom: numberOrString,
left: numberOrString,
right: numberOrString,
top: numberOrString,
zIndex: PropTypes.number
};
}

18
src/modules/react-native-web-style/modules/StylePropTypes/Typographic.js vendored
View File

@@ -1,19 +1,19 @@
import { PropTypes } from 'react';
import { PropTypes } from 'react'
export default {
color: PropTypes.string,
direction: PropTypes.oneOf([
'auto' /*default*/, 'ltr', 'rtl'
'auto', 'ltr', 'rtl'
]),
font: PropTypes.string,
fontFamily: PropTypes.string,
fontSize: PropTypes.string,
fontStyle: PropTypes.oneOf([
'inherit' /*default*/, 'normal', 'italic'
'inherit', 'normal', 'italic'
]),
fontWeight: PropTypes.oneOf([
'inherit' /*default*/, 'bold', 'normal',
'100', '200', '300', '400', '500', '600', '700', '800', '900'
'inherit', 'bold', 'normal',
'100', '200', '300', '400', '500', '600', '700', '800', '900'
]),
letterSpacing: PropTypes.string,
lineHeight: PropTypes.oneOfType([
@@ -21,15 +21,15 @@ export default {
PropTypes.string
]),
textAlign: PropTypes.oneOf([
'auto' /*default*/, 'center', 'justify', 'left', 'right'
'auto', 'center', 'justify', 'left', 'right'
]),
textDecoration: PropTypes.oneOf([
'none' /*default*/, 'line-through', 'underline', 'underline line-through'
'none', 'line-through', 'underline', 'underline line-through'
]),
textTransform: PropTypes.oneOf([
'none' /*default*/, 'capitalize', 'lowercase', 'uppercase'
'none', 'capitalize', 'lowercase', 'uppercase'
]),
wordWrap: PropTypes.oneOf([
'break-word', 'normal'
])
};
}

12
src/modules/react-native-web-style/modules/StylePropTypes/index.js vendored
View File

@@ -1,8 +1,8 @@
import BackgroundPropTypes from './Background';
import BorderThemePropTypes from './BorderTheme';
import FlexboxPropTypes from './Flexbox';
import LayoutPropTypes from './Layout';
import TypographicPropTypes from './Typographic';
import BackgroundPropTypes from './Background'
import BorderThemePropTypes from './BorderTheme'
import FlexboxPropTypes from './Flexbox'
import LayoutPropTypes from './Layout'
import TypographicPropTypes from './Typographic'
export default {
BackgroundPropTypes,
@@ -10,4 +10,4 @@ export default {
FlexboxPropTypes,
LayoutPropTypes,
TypographicPropTypes
};
}

14
src/modules/react-native-web-style/modules/autoprefix.js vendored
View File

@@ -4,7 +4,7 @@ export default function prefixStyles(style) {
WebkitFlexBasis: style.flexBasis,
msFlexBasis: style.flexBasis,
...style
};
}
}
if (style.hasOwnProperty('flexGrow')) {
@@ -13,7 +13,7 @@ export default function prefixStyles(style) {
WebkitFlexGrow: style.flexGrow,
msFlexPositive: style.flexGrow,
...style
};
}
}
if (style.hasOwnProperty('flexShrink')) {
@@ -21,7 +21,7 @@ export default function prefixStyles(style) {
WebkitFlexShrink: style.flexShrink,
msFlexNegative: style.flexShrink,
...style
};
}
}
// NOTE: adding `;` to the string value prevents React from automatically
@@ -30,9 +30,9 @@ export default function prefixStyles(style) {
style = {
WebkitBoxOrdinalGroup: `${parseInt(style.order, 10) + 1};`,
WebkitOrder: `${style.order}`,
msFlexOrder: `${style.order};`,
msFlexOrder: `${style.order}`,
...style
};
}
}
if (style.hasOwnProperty('transform')) {
@@ -40,8 +40,8 @@ export default function prefixStyles(style) {
WebkitTransform: style.transform,
msTransform: style.transform,
...style
};
}
}
return style;
return style
}

28
src/modules/react-native-web-style/modules/restyle.js vendored
View File

@@ -1,5 +1,5 @@
import autoprefix from './autoprefix';
import styles from './styles.css';
import autoprefix from './autoprefix'
import styles from './styles.css'
/**
* Get the HTML class that corresponds to a style declaration
@@ -8,9 +8,9 @@ import styles from './styles.css';
* @return {string} class name
*/
function getSinglePurposeClassName(prop, style) {
const className = `${prop}-${style[prop]}`;
const className = `${prop}-${style[prop]}`
if (style.hasOwnProperty(prop) && styles[className]) {
return styles[className];
return styles[className]
}
}
@@ -20,21 +20,21 @@ function getSinglePurposeClassName(prop, style) {
* @return {Object}
*/
export default function stylingStrategy(props) {
let className;
let style = {};
let className
let style = {}
const classList = [ props.className ];
for (let prop in props.style) {
let styleClass = getSinglePurposeClassName(prop, props.style);
const classList = [ props.className ]
for (const prop in props.style) {
const styleClass = getSinglePurposeClassName(prop, props.style)
if (styleClass) {
classList.push(styleClass);
classList.push(styleClass)
} else {
style[prop] = props.style[prop];
style[prop] = props.style[prop]
}
}
className = classList.join(' ');
style = autoprefix(style);
className = classList.join(' ')
style = autoprefix(style)
return { className: className, style };
return { className: className, style }
}

6
src/specs.bundle.js
View File

@@ -4,6 +4,6 @@
*
* See: https://github.com/webpack/docs/wiki/context
*/
const specContext = require.context('.', true, /.+\.spec\.jsx?$/);
specContext.keys().forEach(specContext);
module.exports = specContext;
const specContext = require.context('.', true, /.+\.spec\.jsx?$/)
specContext.keys().forEach(specContext)
module.exports = specContext

5
webpack-base.config.js
View File

@@ -1,4 +1,4 @@
var autoprefixer = require('autoprefixer-core');
var autoprefixer = require('autoprefixer-core')
module.exports = {
module: {
@@ -20,5 +20,4 @@ module.exports = {
]
},
postcss: [ autoprefixer ]
};
}

10
webpack.config.js
View File

@@ -1,7 +1,7 @@
var assign = require('object-assign');
var base = require('./webpack-base.config.js');
var webpack = require('webpack');
var UglifyJsPlugin = webpack.optimize.UglifyJsPlugin;
var assign = require('object-assign')
var base = require('./webpack-base.config.js')
var webpack = require('webpack')
var UglifyJsPlugin = webpack.optimize.UglifyJsPlugin
module.exports = assign({}, base, {
entry: {
@@ -26,4 +26,4 @@ module.exports = assign({}, base, {
}
})
]
});
})