Loading.mjs 1.9 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172
  1. import { createVNode as _createVNode } from "vue";
  2. import { computed, defineComponent } from "vue";
  3. import { extend, addUnit, numericProp, getSizeStyle, makeStringProp, createNamespace } from "../utils/index.mjs";
  4. const [name, bem] = createNamespace("loading");
  5. const SpinIcon = Array(12).fill(null).map((_, index) => _createVNode("i", {
  6. "class": bem("line", String(index + 1))
  7. }, null));
  8. const CircularIcon = _createVNode("svg", {
  9. "class": bem("circular"),
  10. "viewBox": "25 25 50 50"
  11. }, [_createVNode("circle", {
  12. "cx": "50",
  13. "cy": "50",
  14. "r": "20",
  15. "fill": "none"
  16. }, null)]);
  17. const loadingProps = {
  18. size: numericProp,
  19. type: makeStringProp("circular"),
  20. color: String,
  21. vertical: Boolean,
  22. textSize: numericProp,
  23. textColor: String
  24. };
  25. var stdin_default = defineComponent({
  26. name,
  27. props: loadingProps,
  28. setup(props, {
  29. slots
  30. }) {
  31. const spinnerStyle = computed(() => extend({
  32. color: props.color
  33. }, getSizeStyle(props.size)));
  34. const renderIcon = () => {
  35. const DefaultIcon = props.type === "spinner" ? SpinIcon : CircularIcon;
  36. return _createVNode("span", {
  37. "class": bem("spinner", props.type),
  38. "style": spinnerStyle.value
  39. }, [slots.icon ? slots.icon() : DefaultIcon]);
  40. };
  41. const renderText = () => {
  42. var _a;
  43. if (slots.default) {
  44. return _createVNode("span", {
  45. "class": bem("text"),
  46. "style": {
  47. fontSize: addUnit(props.textSize),
  48. color: (_a = props.textColor) != null ? _a : props.color
  49. }
  50. }, [slots.default()]);
  51. }
  52. };
  53. return () => {
  54. const {
  55. type,
  56. vertical
  57. } = props;
  58. return _createVNode("div", {
  59. "class": bem([type, {
  60. vertical
  61. }]),
  62. "aria-live": "polite",
  63. "aria-busy": true
  64. }, [renderIcon(), renderText()]);
  65. };
  66. }
  67. });
  68. export {
  69. stdin_default as default,
  70. loadingProps
  71. };