@wfrog/vc-ui 1.0.0

package/dist/es/chunk/CS4VKsqy.mjs

@@ -0,0 +1,19 @@
+import { inject, computed, unref } from 'vue';
+import { z as buildProp } from './E_WRn0OP.mjs';
+
+const componentSizes = ["", "default", "small", "large"];
+
+const useSizeProp = buildProp({
+  type: String,
+  values: componentSizes,
+  required: false
+});
+const SIZE_INJECTION_KEY = Symbol("size");
+const useGlobalSize = () => {
+  const injectedSize = inject(SIZE_INJECTION_KEY, {});
+  return computed(() => {
+    return unref(injectedSize.size) || "";
+  });
+};
+
+export { SIZE_INJECTION_KEY as S, useGlobalSize as a, componentSizes as c, useSizeProp as u };

package/dist/es/chunk/CVlj9F0I.mjs

@@ -0,0 +1,291 @@
+import { ref, reactive, defineComponent, h, Transition, withCtx, withDirectives, createVNode, vShow, createApp, toRefs, nextTick, isRef } from 'vue';
+import { a as useGlobalComponentSettings } from './Dh4jaUSg.mjs';
+import { r as removeClass, g as getStyle, b as addClass } from './D5259bwd.mjs';
+import { o as isClient, h as isString, s as isObject, D as hyphenate } from './E_WRn0OP.mjs';
+
+function createLoadingComponent(options, appContext) {
+  let afterLeaveTimer;
+  const afterLeaveFlag = ref(false);
+  const data = reactive({
+    ...options,
+    originalPosition: "",
+    originalOverflow: "",
+    visible: false
+  });
+  function setText(text) {
+    data.text = text;
+  }
+  function destroySelf() {
+    const target = data.parent;
+    const ns = vm.ns;
+    if (!target.vLoadingAddClassList) {
+      let loadingNumber = target.getAttribute("loading-number");
+      loadingNumber = Number.parseInt(loadingNumber) - 1;
+      if (!loadingNumber) {
+        removeClass(target, ns.bm("parent", "relative"));
+        target.removeAttribute("loading-number");
+      } else {
+        target.setAttribute("loading-number", loadingNumber.toString());
+      }
+      removeClass(target, ns.bm("parent", "hidden"));
+    }
+    removeElLoadingChild();
+    loadingInstance.unmount();
+  }
+  function removeElLoadingChild() {
+    var _a, _b;
+    (_b = (_a = vm.$el) == null ? void 0 : _a.parentNode) == null ? void 0 : _b.removeChild(vm.$el);
+  }
+  function close() {
+    var _a;
+    if (options.beforeClose && !options.beforeClose())
+      return;
+    afterLeaveFlag.value = true;
+    clearTimeout(afterLeaveTimer);
+    afterLeaveTimer = setTimeout(handleAfterLeave, 400);
+    data.visible = false;
+    (_a = options.closed) == null ? void 0 : _a.call(options);
+  }
+  function handleAfterLeave() {
+    if (!afterLeaveFlag.value)
+      return;
+    const target = data.parent;
+    afterLeaveFlag.value = false;
+    target.vLoadingAddClassList = void 0;
+    destroySelf();
+  }
+  const elLoadingComponent = defineComponent({
+    name: "ElLoading",
+    setup(_, { expose }) {
+      const { ns, zIndex } = useGlobalComponentSettings("loading");
+      expose({
+        ns,
+        zIndex
+      });
+      return () => {
+        const svg = data.spinner || data.svg;
+        const spinner = h("svg", {
+          class: "circular",
+          viewBox: data.svgViewBox ? data.svgViewBox : "0 0 50 50",
+          ...svg ? { innerHTML: svg } : {}
+        }, [
+          h("circle", {
+            class: "path",
+            cx: "25",
+            cy: "25",
+            r: "20",
+            fill: "none"
+          })
+        ]);
+        const spinnerText = data.text ? h("p", { class: ns.b("text") }, [data.text]) : void 0;
+        return h(Transition, {
+          name: ns.b("fade"),
+          onAfterLeave: handleAfterLeave
+        }, {
+          default: withCtx(() => [
+            withDirectives(createVNode("div", {
+              style: {
+                backgroundColor: data.background || ""
+              },
+              class: [
+                ns.b("mask"),
+                data.customClass,
+                ns.is("fullscreen", data.fullscreen)
+              ]
+            }, [
+              h("div", {
+                class: ns.b("spinner")
+              }, [spinner, spinnerText])
+            ]), [[vShow, data.visible]])
+          ])
+        });
+      };
+    }
+  });
+  const loadingInstance = createApp(elLoadingComponent);
+  Object.assign(loadingInstance._context, appContext != null ? appContext : {});
+  const vm = loadingInstance.mount(document.createElement("div"));
+  return {
+    ...toRefs(data),
+    setText,
+    removeElLoadingChild,
+    close,
+    handleAfterLeave,
+    vm,
+    get $el() {
+      return vm.$el;
+    }
+  };
+}
+
+let fullscreenInstance = void 0;
+const Loading = function(options = {}, context) {
+  if (!isClient)
+    return void 0;
+  const resolved = resolveOptions(options);
+  if (resolved.fullscreen && fullscreenInstance) {
+    return fullscreenInstance;
+  }
+  const instance = createLoadingComponent({
+    ...resolved,
+    closed: () => {
+      var _a;
+      (_a = resolved.closed) == null ? void 0 : _a.call(resolved);
+      if (resolved.fullscreen)
+        fullscreenInstance = void 0;
+    }
+  }, context != null ? context : Loading._context);
+  addStyle(resolved, resolved.parent, instance);
+  addClassList(resolved, resolved.parent, instance);
+  resolved.parent.vLoadingAddClassList = () => addClassList(resolved, resolved.parent, instance);
+  let loadingNumber = resolved.parent.getAttribute("loading-number");
+  if (!loadingNumber) {
+    loadingNumber = "1";
+  } else {
+    loadingNumber = `${Number.parseInt(loadingNumber) + 1}`;
+  }
+  resolved.parent.setAttribute("loading-number", loadingNumber);
+  resolved.parent.appendChild(instance.$el);
+  nextTick(() => instance.visible.value = resolved.visible);
+  if (resolved.fullscreen) {
+    fullscreenInstance = instance;
+  }
+  return instance;
+};
+const resolveOptions = (options) => {
+  var _a, _b, _c, _d;
+  let target;
+  if (isString(options.target)) {
+    target = (_a = document.querySelector(options.target)) != null ? _a : document.body;
+  } else {
+    target = options.target || document.body;
+  }
+  return {
+    parent: target === document.body || options.body ? document.body : target,
+    background: options.background || "",
+    svg: options.svg || "",
+    svgViewBox: options.svgViewBox || "",
+    spinner: options.spinner || false,
+    text: options.text || "",
+    fullscreen: target === document.body && ((_b = options.fullscreen) != null ? _b : true),
+    lock: (_c = options.lock) != null ? _c : false,
+    customClass: options.customClass || "",
+    visible: (_d = options.visible) != null ? _d : true,
+    beforeClose: options.beforeClose,
+    closed: options.closed,
+    target
+  };
+};
+const addStyle = async (options, parent, instance) => {
+  const { nextZIndex } = instance.vm.zIndex || instance.vm._.exposed.zIndex;
+  const maskStyle = {};
+  if (options.fullscreen) {
+    instance.originalPosition.value = getStyle(document.body, "position");
+    instance.originalOverflow.value = getStyle(document.body, "overflow");
+    maskStyle.zIndex = nextZIndex();
+  } else if (options.parent === document.body) {
+    instance.originalPosition.value = getStyle(document.body, "position");
+    await nextTick();
+    for (const property of ["top", "left"]) {
+      const scroll = property === "top" ? "scrollTop" : "scrollLeft";
+      maskStyle[property] = `${options.target.getBoundingClientRect()[property] + document.body[scroll] + document.documentElement[scroll] - Number.parseInt(getStyle(document.body, `margin-${property}`), 10)}px`;
+    }
+    for (const property of ["height", "width"]) {
+      maskStyle[property] = `${options.target.getBoundingClientRect()[property]}px`;
+    }
+  } else {
+    instance.originalPosition.value = getStyle(parent, "position");
+  }
+  for (const [key, value] of Object.entries(maskStyle)) {
+    instance.$el.style[key] = value;
+  }
+};
+const addClassList = (options, parent, instance) => {
+  const ns = instance.vm.ns || instance.vm._.exposed.ns;
+  if (!["absolute", "fixed", "sticky"].includes(instance.originalPosition.value)) {
+    addClass(parent, ns.bm("parent", "relative"));
+  } else {
+    removeClass(parent, ns.bm("parent", "relative"));
+  }
+  if (options.fullscreen && options.lock) {
+    addClass(parent, ns.bm("parent", "hidden"));
+  } else {
+    removeClass(parent, ns.bm("parent", "hidden"));
+  }
+};
+Loading._context = null;
+
+const INSTANCE_KEY = Symbol("ElLoading");
+const getAttributeName = (name) => {
+  return `element-loading-${hyphenate(name)}`;
+};
+const createInstance = (el, binding) => {
+  var _a, _b, _c, _d;
+  const vm = binding.instance;
+  const getBindingProp = (key) => isObject(binding.value) ? binding.value[key] : void 0;
+  const resolveExpression = (key) => {
+    const data = isString(key) && (vm == null ? void 0 : vm[key]) || key;
+    return ref(data);
+  };
+  const getProp = (name) => resolveExpression(getBindingProp(name) || el.getAttribute(getAttributeName(name)));
+  const fullscreen = (_a = getBindingProp("fullscreen")) != null ? _a : binding.modifiers.fullscreen;
+  const options = {
+    text: getProp("text"),
+    svg: getProp("svg"),
+    svgViewBox: getProp("svgViewBox"),
+    spinner: getProp("spinner"),
+    background: getProp("background"),
+    customClass: getProp("customClass"),
+    fullscreen,
+    target: (_b = getBindingProp("target")) != null ? _b : fullscreen ? void 0 : el,
+    body: (_c = getBindingProp("body")) != null ? _c : binding.modifiers.body,
+    lock: (_d = getBindingProp("lock")) != null ? _d : binding.modifiers.lock
+  };
+  const instance = Loading(options);
+  instance._context = vLoading._context;
+  el[INSTANCE_KEY] = {
+    options,
+    instance
+  };
+};
+const updateOptions = (originalOptions, newOptions) => {
+  for (const key of Object.keys(originalOptions)) {
+    if (isRef(originalOptions[key]))
+      originalOptions[key].value = newOptions[key];
+  }
+};
+const vLoading = {
+  mounted(el, binding) {
+    if (binding.value) {
+      createInstance(el, binding);
+    }
+  },
+  updated(el, binding) {
+    const instance = el[INSTANCE_KEY];
+    if (!binding.value) {
+      instance == null ? void 0 : instance.instance.close();
+      el[INSTANCE_KEY] = null;
+      return;
+    }
+    if (!instance)
+      createInstance(el, binding);
+    else {
+      updateOptions(instance.options, isObject(binding.value) ? binding.value : {
+        text: el.getAttribute(getAttributeName("text")),
+        svg: el.getAttribute(getAttributeName("svg")),
+        svgViewBox: el.getAttribute(getAttributeName("svgViewBox")),
+        spinner: el.getAttribute(getAttributeName("spinner")),
+        background: el.getAttribute(getAttributeName("background")),
+        customClass: el.getAttribute(getAttributeName("customClass"))
+      });
+    }
+  },
+  unmounted(el) {
+    var _a;
+    (_a = el[INSTANCE_KEY]) == null ? void 0 : _a.instance.close();
+    el[INSTANCE_KEY] = null;
+  }
+};
+vLoading._context = null;
+
+export { vLoading as v };

package/dist/es/chunk/CZ4ggqDE.mjs

@@ -0,0 +1,140 @@
+import { defineComponent, computed, createElementBlock, createBlock, openBlock, normalizeStyle, normalizeClass, unref, createElementVNode, createCommentVNode, renderSlot, withModifiers, createVNode, withCtx, Transition } from 'vue';
+import { E as ElIcon } from './DMHNh_tw.mjs';
+import { Close } from '@element-plus/icons-vue';
+import { c as buildProps, u as useNamespace } from './E_WRn0OP.mjs';
+import { c as componentSizes } from './CS4VKsqy.mjs';
+import { _ as _export_sfc, w as withInstall } from './D389hx_T.mjs';
+import { c as useFormSize } from './DZACQ9LT.mjs';
+import { u as useLocale } from './aibQ9WSZ.mjs';
+
+const tagProps = buildProps({
+  type: {
+    type: String,
+    values: ["primary", "success", "info", "warning", "danger"],
+    default: "primary"
+  },
+  closable: Boolean,
+  disableTransitions: Boolean,
+  hit: Boolean,
+  color: String,
+  size: {
+    type: String,
+    values: componentSizes
+  },
+  effect: {
+    type: String,
+    values: ["dark", "light", "plain"],
+    default: "light"
+  },
+  round: Boolean
+});
+const tagEmits = {
+  close: (evt) => evt instanceof MouseEvent,
+  click: (evt) => evt instanceof MouseEvent
+};
+
+const __default__ = defineComponent({
+  name: "ElTag"
+});
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  ...__default__,
+  props: tagProps,
+  emits: tagEmits,
+  setup(__props, { emit }) {
+    const props = __props;
+    const tagSize = useFormSize();
+    const { t } = useLocale();
+    const ns = useNamespace("tag");
+    const containerKls = computed(() => {
+      const { type, hit, effect, closable, round } = props;
+      return [
+        ns.b(),
+        ns.is("closable", closable),
+        ns.m(type || "primary"),
+        ns.m(tagSize.value),
+        ns.m(effect),
+        ns.is("hit", hit),
+        ns.is("round", round)
+      ];
+    });
+    const handleClose = (event) => {
+      emit("close", event);
+    };
+    const handleClick = (event) => {
+      emit("click", event);
+    };
+    const handleVNodeMounted = (vnode) => {
+      var _a, _b, _c;
+      if ((_c = (_b = (_a = vnode == null ? void 0 : vnode.component) == null ? void 0 : _a.subTree) == null ? void 0 : _b.component) == null ? void 0 : _c.bum) {
+        vnode.component.subTree.component.bum = null;
+      }
+    };
+    return (_ctx, _cache) => {
+      return _ctx.disableTransitions ? (openBlock(), createElementBlock("span", {
+        key: 0,
+        class: normalizeClass(unref(containerKls)),
+        style: normalizeStyle({ backgroundColor: _ctx.color }),
+        onClick: handleClick
+      }, [
+        createElementVNode("span", {
+          class: normalizeClass(unref(ns).e("content"))
+        }, [
+          renderSlot(_ctx.$slots, "default")
+        ], 2),
+        _ctx.closable ? (openBlock(), createElementBlock("button", {
+          key: 0,
+          "aria-label": unref(t)("el.tag.close"),
+          class: normalizeClass(unref(ns).e("close")),
+          type: "button",
+          onClick: withModifiers(handleClose, ["stop"])
+        }, [
+          createVNode(unref(ElIcon), null, {
+            default: withCtx(() => [
+              createVNode(unref(Close))
+            ]),
+            _: 1
+          })
+        ], 10, ["aria-label", "onClick"])) : createCommentVNode("v-if", true)
+      ], 6)) : (openBlock(), createBlock(Transition, {
+        key: 1,
+        name: `${unref(ns).namespace.value}-zoom-in-center`,
+        appear: "",
+        onVnodeMounted: handleVNodeMounted
+      }, {
+        default: withCtx(() => [
+          createElementVNode("span", {
+            class: normalizeClass(unref(containerKls)),
+            style: normalizeStyle({ backgroundColor: _ctx.color }),
+            onClick: handleClick
+          }, [
+            createElementVNode("span", {
+              class: normalizeClass(unref(ns).e("content"))
+            }, [
+              renderSlot(_ctx.$slots, "default")
+            ], 2),
+            _ctx.closable ? (openBlock(), createElementBlock("button", {
+              key: 0,
+              "aria-label": unref(t)("el.tag.close"),
+              class: normalizeClass(unref(ns).e("close")),
+              type: "button",
+              onClick: withModifiers(handleClose, ["stop"])
+            }, [
+              createVNode(unref(ElIcon), null, {
+                default: withCtx(() => [
+                  createVNode(unref(Close))
+                ]),
+                _: 1
+              })
+            ], 10, ["aria-label", "onClick"])) : createCommentVNode("v-if", true)
+          ], 6)
+        ]),
+        _: 3
+      }, 8, ["name"]));
+    };
+  }
+});
+var Tag = /* @__PURE__ */ _export_sfc(_sfc_main, [["__file", "tag.vue"]]);
+
+const ElTag = withInstall(Tag);
+
+export { ElTag as E, tagProps as t };