sci-pro/es/src/loading/loading.mjs

import { reactive as u, defineComponent as f, h as t, Transition as m, withCtx as g, withDirectives as p, createVNode as x, vShow as C, createApp as h, toRefs as w } from "vue";
import { removeClass as b } from "../utils/dom.mjs";
function y(s) {
  const e = u({
    visible: !1,
    ...s
  });
  function o() {
    var n;
    e.visible = !1, (n = s.closed) == null || n.call(s);
  }
  function a() {
    c();
  }
  function c() {
    e.target && b(e.target, "loading-relative"), r.unmount();
  }
  const l = f({
    name: "loading",
    setup() {
      return () => {
        const n = e.spinner || e.svg, d = t(
          "svg",
          {
            class: "circular",
            viewBox: e.svgViewBox ? e.svgViewBox : "0 0 50 50",
            ...n ? { innerHTML: n } : {}
          },
          [
            t("circle", {
              class: "path",
              cx: "25",
              cy: "25",
              r: "20",
              fill: "none"
            })
          ]
        ), v = e.text ? t("p", { class: "text" }, [e.text]) : void 0;
        return t(
          m,
          {
            name: "fade",
            onAfterLeave: a
          },
          {
            default: g(() => [
              p(
                x(
                  "div",
                  {
                    style: {
                      backgroundColor: e.background || ""
                    },
                    class: [
                      "sci-loading-mask",
                      e.customClass,
                      e.fullscreen ? "is-fullscreen" : ""
                    ]
                  },
                  [
                    t(
                      "div",
                      {
                        class: "spinner"
                      },
                      [d, v]
                    )
                  ]
                ),
                [[C, e.visible]]
              )
            ])
          }
        );
      };
    }
  }), r = h(l), i = r.mount(document.createElement("div"));
  return {
    ...w(e),
    vm: i,
    close: o,
    get $el() {
      return i.$el;
    }
  };
}
export {
  y as createLoadingComponent
};