antd-mobile
Version:
基于 React 的移动设计规范实现
250 lines (223 loc) • 10.2 kB
JavaScript
;
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.Brief = undefined;
var _extends2 = require('babel-runtime/helpers/extends');
var _extends3 = _interopRequireDefault(_extends2);
var _classCallCheck2 = require('babel-runtime/helpers/classCallCheck');
var _classCallCheck3 = _interopRequireDefault(_classCallCheck2);
var _createClass2 = require('babel-runtime/helpers/createClass');
var _createClass3 = _interopRequireDefault(_createClass2);
var _possibleConstructorReturn2 = require('babel-runtime/helpers/possibleConstructorReturn');
var _possibleConstructorReturn3 = _interopRequireDefault(_possibleConstructorReturn2);
var _inherits2 = require('babel-runtime/helpers/inherits');
var _inherits3 = _interopRequireDefault(_inherits2);
var _react = require('react');
var _react2 = _interopRequireDefault(_react);
var _reactNative = require('react-native');
var _index = require('./style/index');
var _index2 = _interopRequireDefault(_index);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { 'default': obj }; }
var __rest = undefined && undefined.__rest || function (s, e) {
var t = {};
for (var p in s) {
if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0) t[p] = s[p];
}if (s != null && typeof Object.getOwnPropertySymbols === "function") for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
if (e.indexOf(p[i]) < 0) t[p[i]] = s[p[i]];
}return t;
};
/* tslint:disable:jsx-no-multiline-js */
var Brief = exports.Brief = function (_React$Component) {
(0, _inherits3['default'])(Brief, _React$Component);
function Brief() {
(0, _classCallCheck3['default'])(this, Brief);
return (0, _possibleConstructorReturn3['default'])(this, (Brief.__proto__ || Object.getPrototypeOf(Brief)).apply(this, arguments));
}
(0, _createClass3['default'])(Brief, [{
key: 'render',
value: function render() {
var _props = this.props,
children = _props.children,
style = _props.style,
_props$styles = _props.styles,
styles = _props$styles === undefined ? _index2['default'] : _props$styles,
wrap = _props.wrap;
var numberOfLines = {};
if (wrap === false) {
numberOfLines = {
numberOfLines: 1
};
}
return _react2['default'].createElement(
_reactNative.View,
{ style: [styles.Brief] },
_react2['default'].createElement(
_reactNative.Text,
(0, _extends3['default'])({ style: [styles.BriefText, style] }, numberOfLines),
children
)
);
}
}]);
return Brief;
}(_react2['default'].Component);
var Item = function (_React$Component2) {
(0, _inherits3['default'])(Item, _React$Component2);
function Item() {
(0, _classCallCheck3['default'])(this, Item);
return (0, _possibleConstructorReturn3['default'])(this, (Item.__proto__ || Object.getPrototypeOf(Item)).apply(this, arguments));
}
(0, _createClass3['default'])(Item, [{
key: 'render',
value: function render() {
var _a = this.props,
styles = _a.styles,
children = _a.children,
multipleLine = _a.multipleLine,
thumb = _a.thumb,
extra = _a.extra,
arrow = _a.arrow,
style = _a.style,
onClick = _a.onClick,
onPressIn = _a.onPressIn,
onPressOut = _a.onPressOut,
wrap = _a.wrap,
disabled = _a.disabled,
align = _a.align,
restProps = __rest(_a, ["styles", "children", "multipleLine", "thumb", "extra", "arrow", "style", "onClick", "onPressIn", "onPressOut", "wrap", "disabled", "align"]);
var itemStyles = styles; // assert none-null none-undefined
var numberOfLines = {};
if (wrap === false) {
numberOfLines = {
numberOfLines: 1
};
}
var underlayColor = {};
if (!disabled && onClick) {
underlayColor = {
underlayColor: itemStyles.underlayColor,
activeOpacity: 0.5
};
} else {
underlayColor = {
activeOpacity: 1
};
}
var alignStyle = {};
if (align === 'top') {
alignStyle = {
alignItems: 'flex-start'
};
} else if (align === 'bottom') {
alignStyle = {
alignItems: 'flex-end'
};
}
var contentDom = void 0;
if (Array.isArray(children)) {
var tempContentDom = [];
children.forEach(function (el, index) {
if (_react2['default'].isValidElement(el)) {
tempContentDom.push(el);
} else {
tempContentDom.push(_react2['default'].createElement(
_reactNative.Text,
(0, _extends3['default'])({ style: [itemStyles.Content] }, numberOfLines, { key: index + '-children' }),
el
));
}
});
contentDom = _react2['default'].createElement(
_reactNative.View,
{ style: [itemStyles.column] },
tempContentDom
);
} else {
if (_react2['default'].isValidElement(children)) {
contentDom = _react2['default'].createElement(
_reactNative.View,
{ style: [itemStyles.column] },
children
);
} else {
contentDom = _react2['default'].createElement(
_reactNative.View,
{ style: [itemStyles.column] },
_react2['default'].createElement(
_reactNative.Text,
(0, _extends3['default'])({ style: [itemStyles.Content] }, numberOfLines),
children
)
);
}
}
var extraDom = void 0;
if (extra) {
extraDom = _react2['default'].createElement(
_reactNative.View,
{ style: [itemStyles.column] },
_react2['default'].createElement(
_reactNative.Text,
(0, _extends3['default'])({ style: [itemStyles.Extra] }, numberOfLines),
extra
)
);
if (_react2['default'].isValidElement(extra)) {
var extraChildren = extra.props.children;
if (Array.isArray(extraChildren)) {
var tempExtraDom = [];
extraChildren.forEach(function (el, index) {
if (typeof el === 'string') {
tempExtraDom.push(_react2['default'].createElement(
_reactNative.Text,
(0, _extends3['default'])({}, numberOfLines, { style: [itemStyles.Extra], key: index + '-children' }),
el
));
} else {
tempExtraDom.push(el);
}
});
extraDom = _react2['default'].createElement(
_reactNative.View,
{ style: [itemStyles.column] },
tempExtraDom
);
} else {
extraDom = extra;
}
}
}
var arrEnum = {
horizontal: _react2['default'].createElement(_reactNative.Image, { source: require('../style/images/arrow.png'), style: itemStyles.Arrow }),
down: _react2['default'].createElement(_reactNative.Image, { source: require('../style/images/arrow-down.png'), style: itemStyles.ArrowV }),
up: _react2['default'].createElement(_reactNative.Image, { source: require('../style/images/arrow-up.png'), style: itemStyles.ArrowV })
};
var itemView = _react2['default'].createElement(
_reactNative.View,
(0, _extends3['default'])({}, restProps, { style: [itemStyles.Item, style] }),
typeof thumb === 'string' ? _react2['default'].createElement(_reactNative.Image, { source: { uri: thumb }, style: [itemStyles.Thumb, multipleLine && itemStyles.multipleThumb] }) : thumb,
_react2['default'].createElement(
_reactNative.View,
{ style: [itemStyles.Line, multipleLine && itemStyles.multipleLine, multipleLine && alignStyle] },
contentDom,
extraDom,
arrow ? arrEnum[arrow] || _react2['default'].createElement(_reactNative.View, { style: itemStyles.Arrow }) : null
)
);
return _react2['default'].createElement(
_reactNative.TouchableHighlight,
(0, _extends3['default'])({}, underlayColor, { onPress: onClick ? onClick : undefined, onPressIn: onPressIn, onPressOut: onPressOut }),
itemView
);
}
}]);
return Item;
}(_react2['default'].Component);
exports['default'] = Item;
Item.defaultProps = {
multipleLine: false,
wrap: false,
styles: _index2['default']
};
Item.Brief = Brief;