lm-button/lib/index.js

* 作者：hjingfen * 邮箱：hjingfen@gmail.com * 版本：**`1.0.0`**

'use strict';

Object.defineProperty(exports, "__esModule", {
    value: true
});
var _jsxFileName = 'src/index.js';

var _react = require('react');

var _react2 = _interopRequireDefault(_react);

var _propTypes = require('prop-types');

var _propTypes2 = _interopRequireDefault(_propTypes);

var _classnames = require('classnames');

var _classnames2 = _interopRequireDefault(_classnames);

require('./index.scss');

function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }

function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }

function _objectWithoutProperties(obj, keys) { var target = {}; for (var i in obj) { if (keys.indexOf(i) >= 0) continue; if (!Object.prototype.hasOwnProperty.call(obj, i)) continue; target[i] = obj[i]; } return target; } /**
                                                                                                                                                                                                                              * Created by hjingfen<hjingfen@gmail.com>.
                                                                                                                                                                                                                              * ComponentName Button
                                                                                                                                                                                                                              * Desc 组件描述内容
                                                                                                                                                                                                                              * GroupName lm-component
                                                                                                                                                                                                                              */


var propTypes = {
    content: _propTypes2.default.string, //按钮名称
    type: _propTypes2.default.string, //按钮类型 现在主要指按钮颜色
    size: _propTypes2.default.string, //按钮大小
    position: _propTypes2.default.string, //按钮位置 在文档流中还是吸底
    className: _propTypes2.default.string, //自定义样式 readme中写的是这个属性
    customClass: _propTypes2.default.string, //自定义样式 取名不当 readme中已经删除这个属性，为了兼容老用户不删除此属性
    disabled: _propTypes2.default.oneOfType([//是否可点击 若值为'false'时，处理成布尔值false
    _propTypes2.default.string, _propTypes2.default.bool]),
    handle: _propTypes2.default.func, //click事件处理
    href: _propTypes2.default.string //点击按钮后跳转页面的跳转链接
};

var defaultProps = {
    content: '',
    className: '',
    customClass: '',
    type: 'blue-white', //可选项：'white-blue', 'white-grey', 'blue-white'
    size: '', //可选项： 'normal', 'tiny', 'small'
    position: '', //可选项：'fixed'
    disabled: false,
    handle: function handle() {},
    href: ''
};

// 若disabled值为'false'时，处理成布尔值false
// 若没有子元素children同时也没有传入content值时，显示按钮内容默认为“提交”
var Button = function Button(_ref) {
    var content = _ref.content,
        className = _ref.className,
        customClass = _ref.customClass,
        handle = _ref.handle,
        size = _ref.size,
        type = _ref.type,
        position = _ref.position,
        disabled = _ref.disabled,
        children = _ref.children,
        href = _ref.href,
        others = _objectWithoutProperties(_ref, ['content', 'className', 'customClass', 'handle', 'size', 'type', 'position', 'disabled', 'children', 'href']);

    var defaultClass = (0, _classnames2.default)('lm-btn', 'lm-btn-' + type, size ? 'lm-btn-' + size : '', position ? 'lm-btn-' + position : '', className, customClass);
    disabled === 'false' ? false : disabled;

    var template = href ? _react2.default.createElement(
        'a',
        Object.assign({ className: defaultClass + ' lm-btn-a', href: href, disabled: disabled }, others, _defineProperty({
            __source: {
                fileName: _jsxFileName,
                lineNumber: 60
            },
            __self: undefined
        }, '__self', undefined)),
        children ? content : content || '提交',
        ' ',
        children
    ) : _react2.default.createElement(
        'button',
        Object.assign({ type: 'button', className: defaultClass, disabled: disabled, onClick: handle }, others, _defineProperty({
            __source: {
                fileName: _jsxFileName,
                lineNumber: 64
            },
            __self: undefined
        }, '__self', undefined)),
        children ? content : content || '提交',
        ' ',
        children
    );

    return template;
};

Button.propTypes = propTypes;
Button.defaultProps = defaultProps;

exports.default = Button;
module.exports = exports['default'];