index.js 1.8 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586
  1. import _mergeJSXProps from "@vue/babel-helper-vue-jsx-merge-props";
  2. // Utils
  3. import { createNamespace, addUnit } from '../utils';
  4. import { inherit } from '../utils/functional'; // Types
  5. var _createNamespace = createNamespace('loading'),
  6. createComponent = _createNamespace[0],
  7. bem = _createNamespace[1];
  8. function LoadingIcon(h, props) {
  9. if (props.type === 'spinner') {
  10. var Spin = [];
  11. for (var i = 0; i < 12; i++) {
  12. Spin.push(h("i"));
  13. }
  14. return Spin;
  15. }
  16. return h("svg", {
  17. "class": bem('circular'),
  18. "attrs": {
  19. "viewBox": "25 25 50 50"
  20. }
  21. }, [h("circle", {
  22. "attrs": {
  23. "cx": "50",
  24. "cy": "50",
  25. "r": "20",
  26. "fill": "none"
  27. }
  28. })]);
  29. }
  30. function LoadingText(h, props, slots) {
  31. if (slots.default) {
  32. var _props$textColor;
  33. var style = {
  34. fontSize: addUnit(props.textSize),
  35. color: (_props$textColor = props.textColor) != null ? _props$textColor : props.color
  36. };
  37. return h("span", {
  38. "class": bem('text'),
  39. "style": style
  40. }, [slots.default()]);
  41. }
  42. }
  43. function Loading(h, props, slots, ctx) {
  44. var color = props.color,
  45. size = props.size,
  46. type = props.type;
  47. var style = {
  48. color: color
  49. };
  50. if (size) {
  51. var iconSize = addUnit(size);
  52. style.width = iconSize;
  53. style.height = iconSize;
  54. }
  55. return h("div", _mergeJSXProps([{
  56. "class": bem([type, {
  57. vertical: props.vertical
  58. }])
  59. }, inherit(ctx, true)]), [h("span", {
  60. "class": bem('spinner', type),
  61. "style": style
  62. }, [LoadingIcon(h, props)]), LoadingText(h, props, slots)]);
  63. }
  64. Loading.props = {
  65. color: String,
  66. size: [Number, String],
  67. vertical: Boolean,
  68. textSize: [Number, String],
  69. textColor: String,
  70. type: {
  71. type: String,
  72. default: 'circular'
  73. }
  74. };
  75. export default createComponent(Loading);