123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198 |
- "use strict";
- var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
- exports.__esModule = true;
- exports.default = void 0;
- var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
- var _babelHelperVueJsxMergeProps = _interopRequireDefault(require("@vue/babel-helper-vue-jsx-merge-props"));
- var _utils = require("../utils");
- var _functional = require("../utils/functional");
- var _constant = require("../utils/constant");
- var _router = require("../utils/router");
- var _icon = _interopRequireDefault(require("../icon"));
- var _loading = _interopRequireDefault(require("../loading"));
- // Utils
- // Components
- var _createNamespace = (0, _utils.createNamespace)('button'),
- createComponent = _createNamespace[0],
- bem = _createNamespace[1];
- function Button(h, props, slots, ctx) {
- var _ref;
- var tag = props.tag,
- icon = props.icon,
- type = props.type,
- color = props.color,
- plain = props.plain,
- disabled = props.disabled,
- loading = props.loading,
- hairline = props.hairline,
- loadingText = props.loadingText,
- iconPosition = props.iconPosition;
- var style = {};
- if (color) {
- style.color = plain ? color : 'white';
- if (!plain) {
- // Use background instead of backgroundColor to make linear-gradient work
- style.background = color;
- } // hide border when color is linear-gradient
- if (color.indexOf('gradient') !== -1) {
- style.border = 0;
- } else {
- style.borderColor = color;
- }
- }
- function onClick(event) {
- if (props.loading) {
- event.preventDefault();
- }
- if (!loading && !disabled) {
- (0, _functional.emit)(ctx, 'click', event);
- (0, _router.functionalRoute)(ctx);
- }
- }
- function onTouchstart(event) {
- (0, _functional.emit)(ctx, 'touchstart', event);
- }
- var classes = [bem([type, props.size, {
- plain: plain,
- loading: loading,
- disabled: disabled,
- hairline: hairline,
- block: props.block,
- round: props.round,
- square: props.square
- }]), (_ref = {}, _ref[_constant.BORDER_SURROUND] = hairline, _ref)];
- function renderIcon() {
- if (loading) {
- return slots.loading ? slots.loading() : h(_loading.default, {
- "class": bem('loading'),
- "attrs": {
- "size": props.loadingSize,
- "type": props.loadingType,
- "color": "currentColor"
- }
- });
- }
- if (slots.icon) {
- return h("div", {
- "class": bem('icon')
- }, [slots.icon()]);
- }
- if (icon) {
- return h(_icon.default, {
- "attrs": {
- "name": icon,
- "classPrefix": props.iconPrefix
- },
- "class": bem('icon')
- });
- }
- }
- function renderContent() {
- var content = [];
- if (iconPosition === 'left') {
- content.push(renderIcon());
- }
- var text;
- if (loading) {
- text = loadingText;
- } else {
- text = slots.default ? slots.default() : props.text;
- }
- if (text) {
- content.push(h("span", {
- "class": bem('text')
- }, [text]));
- }
- if (iconPosition === 'right') {
- content.push(renderIcon());
- }
- return content;
- }
- return h(tag, (0, _babelHelperVueJsxMergeProps.default)([{
- "style": style,
- "class": classes,
- "attrs": {
- "type": props.nativeType,
- "disabled": disabled
- },
- "on": {
- "click": onClick,
- "touchstart": onTouchstart
- }
- }, (0, _functional.inherit)(ctx)]), [h("div", {
- "class": bem('content')
- }, [renderContent()])]);
- }
- Button.props = (0, _extends2.default)({}, _router.routeProps, {
- text: String,
- icon: String,
- color: String,
- block: Boolean,
- plain: Boolean,
- round: Boolean,
- square: Boolean,
- loading: Boolean,
- hairline: Boolean,
- disabled: Boolean,
- iconPrefix: String,
- nativeType: String,
- loadingText: String,
- loadingType: String,
- tag: {
- type: String,
- default: 'button'
- },
- type: {
- type: String,
- default: 'default'
- },
- size: {
- type: String,
- default: 'normal'
- },
- loadingSize: {
- type: String,
- default: '20px'
- },
- iconPosition: {
- type: String,
- default: 'left'
- }
- });
- var _default = createComponent(Button);
- exports.default = _default;
|