import _mergeJSXProps from 'babel-helper-vue-jsx-merge-props';
import _defineProperty from 'babel-runtime/helpers/defineProperty';
import Icon from '../icon';
import { emit, inherit } from '../_utils/functional';
import classNames from '../_utils/classnames';
import './index.less';

var Button = {
    functional: true,
    name: 'SnButton',
    props: {
        loading: {
            type: Boolean,
            'default': false
        },
        type: {
            type: String,
            'default': 'default',
            validator: function validator(value) {
                return ['default', 'primary', 'success', 'info', 'warning', 'danger', 'link'].indexOf(value) > -1;
            }
        },
        size: {
            type: String,
            validator: function validator(value) {
                return ['medium', 'small'].indexOf(value) > -1;
            }
        },
        inline: {
            type: Boolean,
            'default': false
        },
        ghost: {
            type: Boolean,
            'default': false
        },
        disabled: {
            type: Boolean,
            'default': false
        },
        icon: String,
        shape: {
            type: String,
            validator: function validator(value) {
                return ['square', 'round'].indexOf(value) > -1;
            }
        }
    },
    render: function render(h, context) {
        var _classNames;

        var props = context.props,
            slots = context.slots,
            data = context.data;
        var loading = props.loading,
            type = props.type,
            size = props.size,
            inline = props.inline,
            ghost = props.ghost,
            disabled = props.disabled,
            icon = props.icon,
            shape = props.shape;

        var $slots = slots();
        var className = classNames((_classNames = {
            'sn-button': true,
            'sn-button-loading': loading,
            'sn-button-inline': inline,
            'sn-button-ghost': ghost,
            'sn-button-disabled': disabled || loading
        }, _defineProperty(_classNames, 'sn-button-' + type, true), _defineProperty(_classNames, 'sn-button-' + size, size === 'medium' || size === 'small'), _defineProperty(_classNames, 'sn-button-' + shape, shape === 'square' || shape === 'round'), _classNames));

        var btnIcon = loading ? h(Icon, {
            attrs: { type: 'loading' },
            'class': 'sn-button-icon' }) : $slots.icon ? $slots.icon : icon && h(Icon, {
            attrs: { type: icon },
            'class': 'sn-button-icon' });

        function onClick(event) {
            if (!loading && !disabled) {
                emit(context, 'click', event);
            } else {
                event.stopPropagation();
            }
        }

        return h(
            'button',
            _mergeJSXProps([{
                'class': className,
                attrs: { disabled: disabled
                },
                on: {
                    'click': onClick
                }
            }, inherit(context)]),
            [btnIcon, $slots['default'] ? h('span', [$slots['default']]) : null]
        );
    }
};

Button.install = function (Vue) {
    Vue.component(Button.name, Button);
};

export default Button;