index.js 4.0 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188
  1. "use strict";
  2. var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
  3. exports.__esModule = true;
  4. exports.default = void 0;
  5. var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
  6. var _babelHelperVueJsxMergeProps = _interopRequireDefault(require("@vue/babel-helper-vue-jsx-merge-props"));
  7. var _utils = require("../utils");
  8. var _functional = require("../utils/functional");
  9. var _constant = require("../utils/constant");
  10. var _router = require("../utils/router");
  11. var _icon = _interopRequireDefault(require("../icon"));
  12. var _loading = _interopRequireDefault(require("../loading"));
  13. // Utils
  14. // Components
  15. var _createNamespace = (0, _utils.createNamespace)('button'),
  16. createComponent = _createNamespace[0],
  17. bem = _createNamespace[1];
  18. function Button(h, props, slots, ctx) {
  19. var _ref;
  20. var tag = props.tag,
  21. icon = props.icon,
  22. type = props.type,
  23. color = props.color,
  24. plain = props.plain,
  25. disabled = props.disabled,
  26. loading = props.loading,
  27. hairline = props.hairline,
  28. loadingText = props.loadingText,
  29. iconPosition = props.iconPosition;
  30. var style = {};
  31. if (color) {
  32. style.color = plain ? color : 'white';
  33. if (!plain) {
  34. // Use background instead of backgroundColor to make linear-gradient work
  35. style.background = color;
  36. } // hide border when color is linear-gradient
  37. if (color.indexOf('gradient') !== -1) {
  38. style.border = 0;
  39. } else {
  40. style.borderColor = color;
  41. }
  42. }
  43. function onClick(event) {
  44. if (!loading && !disabled) {
  45. (0, _functional.emit)(ctx, 'click', event);
  46. (0, _router.functionalRoute)(ctx);
  47. }
  48. }
  49. function onTouchstart(event) {
  50. (0, _functional.emit)(ctx, 'touchstart', event);
  51. }
  52. var classes = [bem([type, props.size, {
  53. plain: plain,
  54. loading: loading,
  55. disabled: disabled,
  56. hairline: hairline,
  57. block: props.block,
  58. round: props.round,
  59. square: props.square
  60. }]), (_ref = {}, _ref[_constant.BORDER_SURROUND] = hairline, _ref)];
  61. function renderIcon() {
  62. if (loading) {
  63. return slots.loading ? slots.loading() : h(_loading.default, {
  64. "class": bem('loading'),
  65. "attrs": {
  66. "size": props.loadingSize,
  67. "type": props.loadingType,
  68. "color": "currentColor"
  69. }
  70. });
  71. }
  72. if (icon) {
  73. return h(_icon.default, {
  74. "attrs": {
  75. "name": icon,
  76. "classPrefix": props.iconPrefix
  77. },
  78. "class": bem('icon')
  79. });
  80. }
  81. }
  82. function renderContent() {
  83. var content = [];
  84. if (iconPosition === 'left') {
  85. content.push(renderIcon());
  86. }
  87. var text;
  88. if (loading) {
  89. text = loadingText;
  90. } else {
  91. text = slots.default ? slots.default() : props.text;
  92. }
  93. if (text) {
  94. content.push(h("span", {
  95. "class": bem('text')
  96. }, [text]));
  97. }
  98. if (iconPosition === 'right') {
  99. content.push(renderIcon());
  100. }
  101. return content;
  102. }
  103. return h(tag, (0, _babelHelperVueJsxMergeProps.default)([{
  104. "style": style,
  105. "class": classes,
  106. "attrs": {
  107. "type": props.nativeType,
  108. "disabled": disabled
  109. },
  110. "on": {
  111. "click": onClick,
  112. "touchstart": onTouchstart
  113. }
  114. }, (0, _functional.inherit)(ctx)]), [h("div", {
  115. "class": bem('content')
  116. }, [renderContent()])]);
  117. }
  118. Button.props = (0, _extends2.default)({}, _router.routeProps, {
  119. text: String,
  120. icon: String,
  121. color: String,
  122. block: Boolean,
  123. plain: Boolean,
  124. round: Boolean,
  125. square: Boolean,
  126. loading: Boolean,
  127. hairline: Boolean,
  128. disabled: Boolean,
  129. iconPrefix: String,
  130. nativeType: String,
  131. loadingText: String,
  132. loadingType: String,
  133. tag: {
  134. type: String,
  135. default: 'button'
  136. },
  137. type: {
  138. type: String,
  139. default: 'default'
  140. },
  141. size: {
  142. type: String,
  143. default: 'normal'
  144. },
  145. loadingSize: {
  146. type: String,
  147. default: '20px'
  148. },
  149. iconPosition: {
  150. type: String,
  151. default: 'left'
  152. }
  153. });
  154. var _default = createComponent(Button);
  155. exports.default = _default;