element-pe 1.0.8 → 1.0.9-alpha.12

package/es/components/loading/src/loading.mjs

@@ -0,0 +1,112 @@
+import { ref, reactive, h, Transition, withCtx, withDirectives, createVNode, vShow, createApp, toRefs } from 'vue';
+import { removeClass } from '../../../utils/dom.mjs';
+
+function createLoadingComponent(options) {
+  let afterLeaveTimer;
+  const afterLeaveFlag = ref(false);
+  const data = reactive({
+    ...options,
+    originalPosition: "",
+    originalOverflow: "",
+    visible: false
+  });
+  function setText(text) {
+    data.text = text;
+  }
+  function destroySelf() {
+    var _a, _b;
+    const target = data.parent;
+    if (!target.vLoadingAddClassList) {
+      let loadingNumber = target.getAttribute("loading-number");
+      loadingNumber = Number.parseInt(loadingNumber) - 1;
+      if (!loadingNumber) {
+        removeClass(target, "el-loading-parent--relative");
+        target.removeAttribute("loading-number");
+      } else {
+        target.setAttribute("loading-number", loadingNumber.toString());
+      }
+      removeClass(target, "el-loading-parent--hidden");
+    }
+    (_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;
+    const target = data.parent;
+    target.vLoadingAddClassList = void 0;
+    afterLeaveFlag.value = true;
+    clearTimeout(afterLeaveTimer);
+    afterLeaveTimer = window.setTimeout(() => {
+      if (afterLeaveFlag.value) {
+        afterLeaveFlag.value = false;
+        destroySelf();
+      }
+    }, 400);
+    data.visible = false;
+    (_a = options.closed) == null ? void 0 : _a.call(options);
+  }
+  function handleAfterLeave() {
+    if (!afterLeaveFlag.value)
+      return;
+    afterLeaveFlag.value = false;
+    destroySelf();
+  }
+  const elLoadingComponent = {
+    name: "ElLoading",
+    setup() {
+      return () => {
+        const svg = data.spinner || data.svg;
+        const spinner = h("svg", {
+          class: "circular",
+          viewBox: data.svgViewBox ? data.svgViewBox : "25 25 50 50",
+          ...svg ? { innerHTML: svg } : {}
+        }, [
+          h("circle", {
+            class: "path",
+            cx: "50",
+            cy: "50",
+            r: "20",
+            fill: "none"
+          })
+        ]);
+        const spinnerText = data.text ? h("p", { class: "el-loading-text" }, [data.text]) : void 0;
+        return h(Transition, {
+          name: "el-loading-fade",
+          onAfterLeave: handleAfterLeave
+        }, {
+          default: withCtx(() => [
+            withDirectives(createVNode("div", {
+              style: {
+                backgroundColor: data.background || ""
+              },
+              class: [
+                "el-loading-mask",
+                data.customClass,
+                data.fullscreen ? "is-fullscreen" : ""
+              ]
+            }, [
+              h("div", {
+                class: "el-loading-spinner"
+              }, [spinner, spinnerText])
+            ]), [[vShow, data.visible]])
+          ])
+        });
+      };
+    }
+  };
+  const vm = createApp(elLoadingComponent).mount(document.createElement("div"));
+  return {
+    ...toRefs(data),
+    setText,
+    close,
+    handleAfterLeave,
+    vm,
+    get $el() {
+      return vm.$el;
+    }
+  };
+}
+
+export { createLoadingComponent };
+//# sourceMappingURL=loading.mjs.map

package/es/components/loading/src/loading.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"loading.mjs","sources":["../../../../../../packages/components/loading/src/loading.ts"],"sourcesContent":["import {\n  createApp,\n  h,\n  reactive,\n  ref,\n  createVNode,\n  toRefs,\n  Transition,\n  vShow,\n  withCtx,\n  withDirectives,\n} from 'vue'\nimport { removeClass } from '@element-plus/utils/dom'\n\nimport type { LoadingOptionsResolved } from './types'\n\nexport function createLoadingComponent(options: LoadingOptionsResolved) {\n  let afterLeaveTimer: number\n\n  const afterLeaveFlag = ref(false)\n  const data = reactive({\n    ...options,\n    originalPosition: '',\n    originalOverflow: '',\n    visible: false,\n  })\n\n  function setText(text: string) {\n    data.text = text\n  }\n\n  function destroySelf() {\n    const target = data.parent\n    if (!target.vLoadingAddClassList) {\n      let loadingNumber: number | string | null =\n        target.getAttribute('loading-number')\n      loadingNumber = Number.parseInt(loadingNumber as any) - 1\n      if (!loadingNumber) {\n        removeClass(target, 'el-loading-parent--relative')\n        target.removeAttribute('loading-number')\n      } else {\n        target.setAttribute('loading-number', loadingNumber.toString())\n      }\n      removeClass(target, 'el-loading-parent--hidden')\n    }\n    vm.$el?.parentNode?.removeChild(vm.$el)\n  }\n\n  function close() {\n    if (options.beforeClose && !options.beforeClose()) return\n\n    const target = data.parent\n    target.vLoadingAddClassList = undefined\n    afterLeaveFlag.value = true\n    clearTimeout(afterLeaveTimer)\n\n    afterLeaveTimer = window.setTimeout(() => {\n      if (afterLeaveFlag.value) {\n        afterLeaveFlag.value = false\n        destroySelf()\n      }\n    }, 400)\n    data.visible = false\n\n    options.closed?.()\n  }\n\n  function handleAfterLeave() {\n    if (!afterLeaveFlag.value) return\n    afterLeaveFlag.value = false\n    destroySelf()\n  }\n\n  const elLoadingComponent = {\n    name: 'ElLoading',\n    setup() {\n      return () => {\n        const svg = data.spinner || data.svg\n        const spinner = h(\n          'svg',\n          {\n            class: 'circular',\n            viewBox: data.svgViewBox ? data.svgViewBox : '25 25 50 50',\n            ...(svg ? { innerHTML: svg } : {}),\n          },\n          [\n            h('circle', {\n              class: 'path',\n              cx: '50',\n              cy: '50',\n              r: '20',\n              fill: 'none',\n            }),\n          ]\n        )\n\n        const spinnerText = data.text\n          ? h('p', { class: 'el-loading-text' }, [data.text])\n          : undefined\n\n        return h(\n          Transition,\n          {\n            name: 'el-loading-fade',\n            onAfterLeave: handleAfterLeave,\n          },\n          {\n            default: withCtx(() => [\n              withDirectives(\n                createVNode(\n                  'div',\n                  {\n                    style: {\n                      backgroundColor: data.background || '',\n                    },\n                    class: [\n                      'el-loading-mask',\n                      data.customClass,\n                      data.fullscreen ? 'is-fullscreen' : '',\n                    ],\n                  },\n                  [\n                    h(\n                      'div',\n                      {\n                        class: 'el-loading-spinner',\n                      },\n                      [spinner, spinnerText]\n                    ),\n                  ]\n                ),\n                [[vShow, data.visible]]\n              ),\n            ]),\n          }\n        )\n      }\n    },\n  }\n\n  const vm = createApp(elLoadingComponent).mount(document.createElement('div'))\n\n  return {\n    ...toRefs(data),\n    setText,\n    close,\n    handleAfterLeave,\n    vm,\n    get $el(): HTMLElement {\n      return vm.$el\n    },\n  }\n}\n\nexport type LoadingInstance = ReturnType<typeof createLoadingComponent>\n"],"names":[],"mappings":";;;gCAgBuC,SAAiC;AACtE,MAAI;AAEJ,QAAM,iBAAiB,IAAI;AAC3B,QAAM,OAAO,SAAS;AAAA,OACjB;AAAA,IACH,kBAAkB;AAAA,IAClB,kBAAkB;AAAA,IAClB,SAAS;AAAA;AAGX,mBAAiB,MAAc;AAC7B,SAAK,OAAO;AAAA;AAGd,yBAAuB;AA/BzB;AAgCI,UAAM,SAAS,KAAK;AACpB,QAAI,CAAC,OAAO,sBAAsB;AAChC,UAAI,gBACF,OAAO,aAAa;AACtB,sBAAgB,OAAO,SAAS,iBAAwB;AACxD,UAAI,CAAC,eAAe;AAClB,oBAAY,QAAQ;AACpB,eAAO,gBAAgB;AAAA,aAClB;AACL,eAAO,aAAa,kBAAkB,cAAc;AAAA;AAEtD,kBAAY,QAAQ;AAAA;AAEtB,mBAAG,QAAH,mBAAQ,eAAR,mBAAoB,YAAY,GAAG;AAAA;AAGrC,mBAAiB;AAhDnB;AAiDI,QAAI,QAAQ,eAAe,CAAC,QAAQ;AAAe;AAEnD,UAAM,SAAS,KAAK;AACpB,WAAO,uBAAuB;AAC9B,mBAAe,QAAQ;AACvB,iBAAa;AAEb,sBAAkB,OAAO,WAAW,MAAM;AACxC,UAAI,eAAe,OAAO;AACxB,uBAAe,QAAQ;AACvB;AAAA;AAAA,OAED;AACH,SAAK,UAAU;AAEf,kBAAQ,WAAR;AAAA;AAGF,8BAA4B;AAC1B,QAAI,CAAC,eAAe;AAAO;AAC3B,mBAAe,QAAQ;AACvB;AAAA;AAGF,QAAM,qBAAqB;AAAA,IACzB,MAAM;AAAA,IACN,QAAQ;AACN,aAAO,MAAM;AACX,cAAM,MAAM,KAAK,WAAW,KAAK;AACjC,cAAM,UAAU,EACd,OACA;AAAA,UACE,OAAO;AAAA,UACP,SAAS,KAAK,aAAa,KAAK,aAAa;AAAA,aACzC,MAAM,EAAE,WAAW,QAAQ;AAAA,WAEjC;AAAA,UACE,EAAE,UAAU;AAAA,YACV,OAAO;AAAA,YACP,IAAI;AAAA,YACJ,IAAI;AAAA,YACJ,GAAG;AAAA,YACH,MAAM;AAAA;AAAA;AAKZ,cAAM,cAAc,KAAK,OACrB,EAAE,KAAK,EAAE,OAAO,qBAAqB,CAAC,KAAK,SAC3C;AAEJ,eAAO,EACL,YACA;AAAA,UACE,MAAM;AAAA,UACN,cAAc;AAAA,WAEhB;AAAA,UACE,SAAS,QAAQ,MAAM;AAAA,YACrB,eACE,YACE,OACA;AAAA,cACE,OAAO;AAAA,gBACL,iBAAiB,KAAK,cAAc;AAAA;AAAA,cAEtC,OAAO;AAAA,gBACL;AAAA,gBACA,KAAK;AAAA,gBACL,KAAK,aAAa,kBAAkB;AAAA;AAAA,eAGxC;AAAA,cACE,EACE,OACA;AAAA,gBACE,OAAO;AAAA,iBAET,CAAC,SAAS;AAAA,gBAIhB,CAAC,CAAC,OAAO,KAAK;AAAA;AAAA;AAAA;AAAA;AAAA;AAS5B,QAAM,KAAK,UAAU,oBAAoB,MAAM,SAAS,cAAc;AAEtE,SAAO;AAAA,OACF,OAAO;AAAA,IACV;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,QACI,MAAmB;AACrB,aAAO,GAAG;AAAA;AAAA;AAAA;;;;"}

package/es/components/loading/src/service.d.ts

@@ -0,0 +1,3 @@
+import type { LoadingInstance } from './loading';
+import type { LoadingOptions } from './types';
+export declare const Loading: (options?: LoadingOptions) => LoadingInstance;

package/es/components/loading/src/service.mjs

@@ -0,0 +1,101 @@
+import { nextTick } from 'vue';
+import { isString } from '@vue/shared';
+import { isClient } from '@vueuse/core';
+import { getStyle, addClass, removeClass } from '../../../utils/dom.mjs';
+import PopupManager from '../../../utils/popup-manager.mjs';
+import { createLoadingComponent } from './loading.mjs';
+
+let fullscreenInstance = void 0;
+const Loading = function(options = {}) {
+  if (!isClient)
+    return void 0;
+  const resolved = resolveOptions(options);
+  if (resolved.fullscreen && fullscreenInstance) {
+    fullscreenInstance.close();
+  }
+  const instance = createLoadingComponent({
+    ...resolved,
+    closed: () => {
+      var _a;
+      (_a = resolved.closed) == null ? void 0 : _a.call(resolved);
+      if (resolved.fullscreen)
+        fullscreenInstance = void 0;
+    }
+  });
+  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,
+    target
+  };
+};
+const addStyle = async (options, parent, instance) => {
+  const maskStyle = {};
+  if (options.fullscreen) {
+    instance.originalPosition.value = getStyle(document.body, "position");
+    instance.originalOverflow.value = getStyle(document.body, "overflow");
+    maskStyle.zIndex = PopupManager.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] - 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) => {
+  if (instance.originalPosition.value !== "absolute" && instance.originalPosition.value !== "fixed") {
+    addClass(parent, "el-loading-parent--relative");
+  } else {
+    removeClass(parent, "el-loading-parent--relative");
+  }
+  if (options.fullscreen && options.lock) {
+    addClass(parent, "el-loading-parent--hidden");
+  } else {
+    removeClass(parent, "el-loading-parent--hidden");
+  }
+};
+
+export { Loading };
+//# sourceMappingURL=service.mjs.map

package/es/components/loading/src/service.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"service.mjs","sources":["../../../../../../packages/components/loading/src/service.ts"],"sourcesContent":["import { nextTick } from 'vue'\nimport { isString } from '@vue/shared'\nimport { isClient } from '@vueuse/core'\nimport { addClass, getStyle, removeClass } from '@element-plus/utils/dom'\nimport PopupManager from '@element-plus/utils/popup-manager'\nimport { createLoadingComponent } from './loading'\nimport type { LoadingInstance } from './loading'\nimport type { LoadingOptionsResolved } from '..'\nimport type { LoadingOptions } from './types'\nimport type { CSSProperties } from 'vue'\n\nlet fullscreenInstance: LoadingInstance | undefined = undefined\n\nexport const Loading = function (\n  options: LoadingOptions = {}\n): LoadingInstance {\n  if (!isClient) return undefined as any\n\n  const resolved = resolveOptions(options)\n\n  if (resolved.fullscreen && fullscreenInstance) {\n    fullscreenInstance.close()\n  }\n\n  const instance = createLoadingComponent({\n    ...resolved,\n    closed: () => {\n      resolved.closed?.()\n      if (resolved.fullscreen) fullscreenInstance = undefined\n    },\n  })\n\n  addStyle(resolved, resolved.parent, instance)\n  addClassList(resolved, resolved.parent, instance)\n\n  resolved.parent.vLoadingAddClassList = () =>\n    addClassList(resolved, resolved.parent, instance)\n\n  /**\n   * add loading-number to parent.\n   * because if a fullscreen loading is triggered when somewhere\n   * a v-loading.body was triggered before and it's parent is\n   * document.body which with a margin , the fullscreen loading's\n   * destroySelf function will remove 'el-loading-parent--relative',\n   * and then the position of v-loading.body will be error.\n   */\n  let loadingNumber: string | null =\n    resolved.parent.getAttribute('loading-number')\n  if (!loadingNumber) {\n    loadingNumber = '1'\n  } else {\n    loadingNumber = `${Number.parseInt(loadingNumber) + 1}`\n  }\n  resolved.parent.setAttribute('loading-number', loadingNumber)\n\n  resolved.parent.appendChild(instance.$el)\n\n  // after instance render, then modify visible to trigger transition\n  nextTick(() => (instance.visible.value = resolved.visible))\n\n  if (resolved.fullscreen) {\n    fullscreenInstance = instance\n  }\n  return instance\n}\n\nconst resolveOptions = (options: LoadingOptions): LoadingOptionsResolved => {\n  let target: HTMLElement\n  if (isString(options.target)) {\n    target =\n      document.querySelector<HTMLElement>(options.target) ?? document.body\n  } else {\n    target = options.target || document.body\n  }\n  return {\n    parent: target === document.body || options.body ? document.body : target,\n    background: options.background || '',\n    svg: options.svg || '',\n    svgViewBox: options.svgViewBox || '',\n    spinner: options.spinner || false,\n    text: options.text || '',\n    fullscreen: target === document.body && (options.fullscreen ?? true),\n    lock: options.lock ?? false,\n    customClass: options.customClass || '',\n    visible: options.visible ?? true,\n    target,\n  }\n}\n\nconst addStyle = async (\n  options: LoadingOptionsResolved,\n  parent: HTMLElement,\n  instance: LoadingInstance\n) => {\n  const maskStyle: CSSProperties = {}\n  if (options.fullscreen) {\n    instance.originalPosition.value = getStyle(document.body, 'position')\n    instance.originalOverflow.value = getStyle(document.body, 'overflow')\n    maskStyle.zIndex = PopupManager.nextZIndex()\n  } else if (options.parent === document.body) {\n    instance.originalPosition.value = getStyle(document.body, 'position')\n    /**\n     * await dom render when visible is true in init,\n     * because some component's height maybe 0.\n     * e.g. el-table.\n     */\n    await nextTick()\n    for (const property of ['top', 'left']) {\n      const scroll = property === 'top' ? 'scrollTop' : 'scrollLeft'\n      maskStyle[property] = `${\n        (options.target as HTMLElement).getBoundingClientRect()[property] +\n        document.body[scroll] +\n        document.documentElement[scroll] -\n        parseInt(getStyle(document.body, `margin-${property}`), 10)\n      }px`\n    }\n    for (const property of ['height', 'width']) {\n      maskStyle[property] = `${\n        (options.target as HTMLElement).getBoundingClientRect()[property]\n      }px`\n    }\n  } else {\n    instance.originalPosition.value = getStyle(parent, 'position')\n  }\n  for (const [key, value] of Object.entries(maskStyle)) {\n    instance.$el.style[key] = value\n  }\n}\n\nconst addClassList = (\n  options: LoadingOptions,\n  parent: HTMLElement,\n  instance: LoadingInstance\n) => {\n  if (\n    instance.originalPosition.value !== 'absolute' &&\n    instance.originalPosition.value !== 'fixed'\n  ) {\n    addClass(parent, 'el-loading-parent--relative')\n  } else {\n    removeClass(parent, 'el-loading-parent--relative')\n  }\n  if (options.fullscreen && options.lock) {\n    addClass(parent, 'el-loading-parent--hidden')\n  } else {\n    removeClass(parent, 'el-loading-parent--hidden')\n  }\n}\n"],"names":[],"mappings":";;;;;;;AAWA,IAAI,qBAAkD;MAEzC,UAAU,SACrB,UAA0B,IACT;AACjB,MAAI,CAAC;AAAU,WAAO;AAEtB,QAAM,WAAW,eAAe;AAEhC,MAAI,SAAS,cAAc,oBAAoB;AAC7C,uBAAmB;AAAA;AAGrB,QAAM,WAAW,uBAAuB;AAAA,OACnC;AAAA,IACH,QAAQ,MAAM;AA1BlB;AA2BM,qBAAS,WAAT;AACA,UAAI,SAAS;AAAY,6BAAqB;AAAA;AAAA;AAIlD,WAAS,UAAU,SAAS,QAAQ;AACpC,eAAa,UAAU,SAAS,QAAQ;AAExC,WAAS,OAAO,uBAAuB,MACrC,aAAa,UAAU,SAAS,QAAQ;AAU1C,MAAI,gBACF,SAAS,OAAO,aAAa;AAC/B,MAAI,CAAC,eAAe;AAClB,oBAAgB;AAAA,SACX;AACL,oBAAgB,GAAG,OAAO,SAAS,iBAAiB;AAAA;AAEtD,WAAS,OAAO,aAAa,kBAAkB;AAE/C,WAAS,OAAO,YAAY,SAAS;AAGrC,WAAS,MAAO,SAAS,QAAQ,QAAQ,SAAS;AAElD,MAAI,SAAS,YAAY;AACvB,yBAAqB;AAAA;AAEvB,SAAO;AAAA;AAGT,MAAM,iBAAiB,CAAC,YAAoD;AAlE5E;AAmEE,MAAI;AACJ,MAAI,SAAS,QAAQ,SAAS;AAC5B,aACE,eAAS,cAA2B,QAAQ,YAA5C,YAAuD,SAAS;AAAA,SAC7D;AACL,aAAS,QAAQ,UAAU,SAAS;AAAA;AAEtC,SAAO;AAAA,IACL,QAAQ,WAAW,SAAS,QAAQ,QAAQ,OAAO,SAAS,OAAO;AAAA,IACnE,YAAY,QAAQ,cAAc;AAAA,IAClC,KAAK,QAAQ,OAAO;AAAA,IACpB,YAAY,QAAQ,cAAc;AAAA,IAClC,SAAS,QAAQ,WAAW;AAAA,IAC5B,MAAM,QAAQ,QAAQ;AAAA,IACtB,YAAY,WAAW,SAAS,uBAAiB,eAAR,YAAsB;AAAA,IAC/D,MAAM,cAAQ,SAAR,YAAgB;AAAA,IACtB,aAAa,QAAQ,eAAe;AAAA,IACpC,SAAS,cAAQ,YAAR,YAAmB;AAAA,IAC5B;AAAA;AAAA;AAIJ,MAAM,WAAW,OACf,SACA,QACA,aACG;AACH,QAAM,YAA2B;AACjC,MAAI,QAAQ,YAAY;AACtB,aAAS,iBAAiB,QAAQ,SAAS,SAAS,MAAM;AAC1D,aAAS,iBAAiB,QAAQ,SAAS,SAAS,MAAM;AAC1D,cAAU,SAAS,aAAa;AAAA,aACvB,QAAQ,WAAW,SAAS,MAAM;AAC3C,aAAS,iBAAiB,QAAQ,SAAS,SAAS,MAAM;AAM1D,UAAM;AACN,eAAW,YAAY,CAAC,OAAO,SAAS;AACtC,YAAM,SAAS,aAAa,QAAQ,cAAc;AAClD,gBAAU,YAAY,GACnB,QAAQ,OAAuB,wBAAwB,YACxD,SAAS,KAAK,UACd,SAAS,gBAAgB,UACzB,SAAS,SAAS,SAAS,MAAM,UAAU,aAAa;AAAA;AAG5D,eAAW,YAAY,CAAC,UAAU,UAAU;AAC1C,gBAAU,YAAY,GACnB,QAAQ,OAAuB,wBAAwB;AAAA;AAAA,SAGvD;AACL,aAAS,iBAAiB,QAAQ,SAAS,QAAQ;AAAA;AAErD,aAAW,CAAC,KAAK,UAAU,OAAO,QAAQ,YAAY;AACpD,aAAS,IAAI,MAAM,OAAO;AAAA;AAAA;AAI9B,MAAM,eAAe,CACnB,SACA,QACA,aACG;AACH,MACE,SAAS,iBAAiB,UAAU,cACpC,SAAS,iBAAiB,UAAU,SACpC;AACA,aAAS,QAAQ;AAAA,SACZ;AACL,gBAAY,QAAQ;AAAA;AAEtB,MAAI,QAAQ,cAAc,QAAQ,MAAM;AACtC,aAAS,QAAQ;AAAA,SACZ;AACL,gBAAY,QAAQ;AAAA;AAAA;;;;"}

package/es/components/loading/src/types.d.ts

@@ -0,0 +1,23 @@
+import type { MaybeRef } from '@vueuse/core';
+export declare type LoadingOptionsResolved = {
+    parent: LoadingParentElement;
+    background: MaybeRef<string>;
+    svg: MaybeRef<string>;
+    svgViewBox: MaybeRef<string>;
+    spinner: MaybeRef<boolean | string>;
+    text: MaybeRef<string>;
+    fullscreen: boolean;
+    lock: boolean;
+    customClass: MaybeRef<string>;
+    visible: boolean;
+    target: HTMLElement;
+    beforeClose?: () => boolean;
+    closed?: () => void;
+};
+export declare type LoadingOptions = Partial<Omit<LoadingOptionsResolved, 'parent' | 'target'> & {
+    target: HTMLElement | string;
+    body: boolean;
+}>;
+export interface LoadingParentElement extends HTMLElement {
+    vLoadingAddClassList?: () => void;
+}

package/es/components/menu/index.d.ts

@@ -31,9 +31,9 @@ export declare const ElMenu: import("../../utils/types").SFCWithInstall<import("
     readonly collapseTransition?: unknown;
     readonly ellipsis?: unknown;
 } & {
+    mode: import("../../utils/props").BuildPropType<StringConstructor, "horizontal" | "vertical", unknown>;
     ellipsis: import("../../utils/props").BuildPropType<BooleanConstructor, unknown, unknown>;
     collapse: boolean;
-    mode: import("../../utils/props").BuildPropType<StringConstructor, "horizontal" | "vertical", unknown>;
     defaultActive: string;
     defaultOpeneds: string[];
     menuTrigger: import("../../utils/props").BuildPropType<StringConstructor, "click" | "hover", unknown>;
@@ -41,17 +41,17 @@ export declare const ElMenu: import("../../utils/types").SFCWithInstall<import("
     uniqueOpened: boolean;
     router: boolean;
 } & {
-    backgroundColor?: string | undefined;
     textColor?: string | undefined;
+    backgroundColor?: string | undefined;
     activeTextColor?: string | undefined;
 }> & {
     onClose?: ((index: string, indexPath: string[]) => any) | undefined;
     onSelect?: ((index: string, indexPath: string[], item: import("./src/types").MenuItemClicked, routerResult?: Promise<void | import("vue-router").NavigationFailure> | undefined) => any) | undefined;
     onOpen?: ((index: string, indexPath: string[]) => any) | undefined;
 }, {
+    mode: import("../../utils/props").BuildPropType<StringConstructor, "horizontal" | "vertical", unknown>;
     ellipsis: import("../../utils/props").BuildPropType<BooleanConstructor, unknown, unknown>;
     collapse: boolean;
-    mode: import("../../utils/props").BuildPropType<StringConstructor, "horizontal" | "vertical", unknown>;
     defaultActive: string;
     defaultOpeneds: string[];
     menuTrigger: import("../../utils/props").BuildPropType<StringConstructor, "click" | "hover", unknown>;

package/es/components/menu/index.mjs

@@ -8,8 +8,8 @@ export { subMenuProps } from './src/sub-menu.mjs';
 export { menuItemEmits, menuItemProps } from './src/menu-item.mjs';
 export { menuItemGroupProps } from './src/menu-item-group.mjs';
 import './src/types.mjs';
-import script from './src/menu-item.vue_vue&type=script&lang.mjs';
-import script$1 from './src/menu-item-group.vue_vue&type=script&lang.mjs';
+import script from './src/menu-item.vue_vue_type_script_lang.mjs';
+import script$1 from './src/menu-item-group.vue_vue_type_script_lang.mjs';
 
 const ElMenu = withInstall(Menu, {
   MenuItem: script,

package/es/components/menu/src/menu-collapse-transition.mjs

@@ -1,6 +1,6 @@
-import script from './menu-collapse-transition.vue_vue&type=script&lang.mjs';
-export { default } from './menu-collapse-transition.vue_vue&type=script&lang.mjs';
-import { render } from './menu-collapse-transition.vue_vue&type=template&id=db8e3ce6&lang.mjs';
+import script from './menu-collapse-transition.vue_vue_type_script_lang.mjs';
+export { default } from './menu-collapse-transition.vue_vue_type_script_lang.mjs';
+import { render } from './menu-collapse-transition.vue_vue_type_template_id_db8e3ce6_lang.mjs';
 
 script.render = render;
 script.__file = "packages/components/menu/src/menu-collapse-transition.vue";

package/es/components/menu/src/menu-collapse-transition.vue_vue_type_script_lang.mjs

@@ -0,0 +1,49 @@
+import { defineComponent } from 'vue';
+import { addClass, removeClass, hasClass } from '../../../utils/dom.mjs';
+
+var script = defineComponent({
+  name: "ElMenuCollapseTransition",
+  setup() {
+    const listeners = {
+      onBeforeEnter: (el) => el.style.opacity = "0.2",
+      onEnter(el, done) {
+        addClass(el, "el-opacity-transition");
+        el.style.opacity = "1";
+        done();
+      },
+      onAfterEnter(el) {
+        removeClass(el, "el-opacity-transition");
+        el.style.opacity = "";
+      },
+      onBeforeLeave(el) {
+        if (!el.dataset) {
+          ;
+          el.dataset = {};
+        }
+        if (hasClass(el, "el-menu--collapse")) {
+          removeClass(el, "el-menu--collapse");
+          el.dataset.oldOverflow = el.style.overflow;
+          el.dataset.scrollWidth = el.clientWidth.toString();
+          addClass(el, "el-menu--collapse");
+        } else {
+          addClass(el, "el-menu--collapse");
+          el.dataset.oldOverflow = el.style.overflow;
+          el.dataset.scrollWidth = el.clientWidth.toString();
+          removeClass(el, "el-menu--collapse");
+        }
+        el.style.width = `${el.scrollWidth}px`;
+        el.style.overflow = "hidden";
+      },
+      onLeave(el) {
+        addClass(el, "horizontal-collapse-transition");
+        el.style.width = `${el.dataset.scrollWidth}px`;
+      }
+    };
+    return {
+      listeners
+    };
+  }
+});
+
+export { script as default };
+//# sourceMappingURL=menu-collapse-transition.vue_vue_type_script_lang.mjs.map

package/es/components/menu/src/menu-collapse-transition.vue_vue_type_script_lang.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"menu-collapse-transition.vue_vue_type_script_lang.mjs","sources":["../../../../../../packages/components/menu/src/menu-collapse-transition.vue"],"sourcesContent":["<template>\n  <transition mode=\"out-in\" v-bind=\"listeners\">\n    <slot />\n  </transition>\n</template>\n<script lang=\"ts\">\nimport { defineComponent } from 'vue'\nimport { addClass, removeClass, hasClass } from '@element-plus/utils/dom'\n\nimport type { TransitionProps, BaseTransitionProps } from 'vue'\n\nexport default defineComponent({\n  name: 'ElMenuCollapseTransition',\n  setup() {\n    const listeners = {\n      onBeforeEnter: (el) => (el.style.opacity = '0.2'),\n      onEnter(el, done) {\n        addClass(el, 'el-opacity-transition')\n        el.style.opacity = '1'\n        done()\n      },\n\n      onAfterEnter(el) {\n        removeClass(el, 'el-opacity-transition')\n        el.style.opacity = ''\n      },\n\n      onBeforeLeave(el) {\n        if (!el.dataset) {\n          ;(el as any).dataset = {}\n        }\n\n        if (hasClass(el, 'el-menu--collapse')) {\n          removeClass(el, 'el-menu--collapse')\n          el.dataset.oldOverflow = el.style.overflow\n          el.dataset.scrollWidth = el.clientWidth.toString()\n          addClass(el, 'el-menu--collapse')\n        } else {\n          addClass(el, 'el-menu--collapse')\n          el.dataset.oldOverflow = el.style.overflow\n          el.dataset.scrollWidth = el.clientWidth.toString()\n          removeClass(el, 'el-menu--collapse')\n        }\n\n        el.style.width = `${el.scrollWidth}px`\n        el.style.overflow = 'hidden'\n      },\n\n      onLeave(el: HTMLElement) {\n        addClass(el, 'horizontal-collapse-transition')\n        el.style.width = `${el.dataset.scrollWidth}px`\n      },\n    } as BaseTransitionProps<HTMLElement> as TransitionProps\n\n    return {\n      listeners,\n    }\n  },\n})\n</script>\n"],"names":[],"mappings":";;;AAWA,aAAe,gBAAgB;AAAA,EAC7B,MAAM;AAAA,EACN,QAAQ;AACN,UAAM,YAAY;AAAA,MAChB,eAAe,CAAC,OAAQ,GAAG,MAAM,UAAU;AAAA,MAC3C,QAAQ,IAAI,MAAM;AAChB,iBAAS,IAAI;AACb,WAAG,MAAM,UAAU;AACnB;AAAA;AAAA,MAGF,aAAa,IAAI;AACf,oBAAY,IAAI;AAChB,WAAG,MAAM,UAAU;AAAA;AAAA,MAGrB,cAAc,IAAI;AAChB,YAAI,CAAC,GAAG,SAAS;AACf;AAAC,UAAC,GAAW,UAAU;AAAA;AAGzB,YAAI,SAAS,IAAI,sBAAsB;AACrC,sBAAY,IAAI;AAChB,aAAG,QAAQ,cAAc,GAAG,MAAM;AAClC,aAAG,QAAQ,cAAc,GAAG,YAAY;AACxC,mBAAS,IAAI;AAAA,eACR;AACL,mBAAS,IAAI;AACb,aAAG,QAAQ,cAAc,GAAG,MAAM;AAClC,aAAG,QAAQ,cAAc,GAAG,YAAY;AACxC,sBAAY,IAAI;AAAA;AAGlB,WAAG,MAAM,QAAQ,GAAG,GAAG;AACvB,WAAG,MAAM,WAAW;AAAA;AAAA,MAGtB,QAAQ,IAAiB;AACvB,iBAAS,IAAI;AACb,WAAG,MAAM,QAAQ,GAAG,GAAG,QAAQ;AAAA;AAAA;AAInC,WAAO;AAAA,MACL;AAAA;AAAA;AAAA;;;;"}

package/es/components/menu/src/menu-collapse-transition.vue_vue_type_template_id_db8e3ce6_lang.mjs

@@ -0,0 +1,13 @@
+import { openBlock, createBlock, Transition, mergeProps, withCtx, renderSlot } from 'vue';
+
+function render(_ctx, _cache, $props, $setup, $data, $options) {
+  return openBlock(), createBlock(Transition, mergeProps({ mode: "out-in" }, _ctx.listeners), {
+    default: withCtx(() => [
+      renderSlot(_ctx.$slots, "default")
+    ]),
+    _: 3
+  }, 16);
+}
+
+export { render };
+//# sourceMappingURL=menu-collapse-transition.vue_vue_type_template_id_db8e3ce6_lang.mjs.map

package/es/components/menu/src/menu-collapse-transition.vue_vue_type_template_id_db8e3ce6_lang.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"menu-collapse-transition.vue_vue_type_template_id_db8e3ce6_lang.mjs","sources":["../../../../../../packages/components/menu/src/menu-collapse-transition.vue?vue&type=template&id=db8e3ce6&lang.js"],"sourcesContent":["<template>\n  <transition mode=\"out-in\" v-bind=\"listeners\">\n    <slot />\n  </transition>\n</template>\n<script lang=\"ts\">\nimport { defineComponent } from 'vue'\nimport { addClass, removeClass, hasClass } from '@element-plus/utils/dom'\n\nimport type { TransitionProps, BaseTransitionProps } from 'vue'\n\nexport default defineComponent({\n  name: 'ElMenuCollapseTransition',\n  setup() {\n    const listeners = {\n      onBeforeEnter: (el) => (el.style.opacity = '0.2'),\n      onEnter(el, done) {\n        addClass(el, 'el-opacity-transition')\n        el.style.opacity = '1'\n        done()\n      },\n\n      onAfterEnter(el) {\n        removeClass(el, 'el-opacity-transition')\n        el.style.opacity = ''\n      },\n\n      onBeforeLeave(el) {\n        if (!el.dataset) {\n          ;(el as any).dataset = {}\n        }\n\n        if (hasClass(el, 'el-menu--collapse')) {\n          removeClass(el, 'el-menu--collapse')\n          el.dataset.oldOverflow = el.style.overflow\n          el.dataset.scrollWidth = el.clientWidth.toString()\n          addClass(el, 'el-menu--collapse')\n        } else {\n          addClass(el, 'el-menu--collapse')\n          el.dataset.oldOverflow = el.style.overflow\n          el.dataset.scrollWidth = el.clientWidth.toString()\n          removeClass(el, 'el-menu--collapse')\n        }\n\n        el.style.width = `${el.scrollWidth}px`\n        el.style.overflow = 'hidden'\n      },\n\n      onLeave(el: HTMLElement) {\n        addClass(el, 'horizontal-collapse-transition')\n        el.style.width = `${el.dataset.scrollWidth}px`\n      },\n    } as BaseTransitionProps<HTMLElement> as TransitionProps\n\n    return {\n      listeners,\n    }\n  },\n})\n</script>\n"],"names":["_createBlock","_mergeProps","_renderSlot"],"mappings":";;;sBACEA,wBAAAC,aAAY,MAAK,YAAiB;qBAChC;MAAAC;;;;;;;;"}

package/es/components/menu/src/menu-item-group.vue_vue_type_script_lang.mjs

@@ -0,0 +1,34 @@
+import { defineComponent, getCurrentInstance, inject, computed } from 'vue';
+import { throwError } from '../../../utils/error.mjs';
+import { menuItemGroupProps } from './menu-item-group.mjs';
+
+const COMPONENT_NAME = "ElMenuItemGroup";
+var script = defineComponent({
+  name: COMPONENT_NAME,
+  props: menuItemGroupProps,
+  setup() {
+    const instance = getCurrentInstance();
+    const menu = inject("rootMenu");
+    if (!menu)
+      throwError(COMPONENT_NAME, "can not inject root menu");
+    const levelPadding = computed(() => {
+      if (menu.props.collapse)
+        return 20;
+      let padding = 20;
+      let parent = instance.parent;
+      while (parent && parent.type.name !== "ElMenu") {
+        if (parent.type.name === "ElSubMenu") {
+          padding += 20;
+        }
+        parent = parent.parent;
+      }
+      return padding;
+    });
+    return {
+      levelPadding
+    };
+  }
+});
+
+export { script as default };
+//# sourceMappingURL=menu-item-group.vue_vue_type_script_lang.mjs.map

package/es/components/menu/src/menu-item-group.vue_vue_type_script_lang.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"menu-item-group.vue_vue_type_script_lang.mjs","sources":["../../../../../../packages/components/menu/src/menu-item-group.vue"],"sourcesContent":["<template>\n  <li class=\"el-menu-item-group\">\n    <div\n      class=\"el-menu-item-group__title\"\n      :style=\"{ paddingLeft: `${levelPadding}px` }\"\n    >\n      <template v-if=\"!$slots.title\">{{ title }}</template>\n      <slot v-else name=\"title\" />\n    </div>\n    <ul>\n      <slot />\n    </ul>\n  </li>\n</template>\n\n<script lang=\"ts\">\nimport { defineComponent, computed, getCurrentInstance, inject } from 'vue'\nimport { throwError } from '@element-plus/utils/error'\nimport { menuItemGroupProps } from './menu-item-group'\n\nimport type { MenuProvider } from './types'\n\nconst COMPONENT_NAME = 'ElMenuItemGroup'\n\nexport default defineComponent({\n  name: COMPONENT_NAME,\n\n  props: menuItemGroupProps,\n\n  setup() {\n    const instance = getCurrentInstance()!\n    const menu = inject<MenuProvider>('rootMenu')\n    if (!menu) throwError(COMPONENT_NAME, 'can not inject root menu')\n\n    const levelPadding = computed(() => {\n      if (menu.props.collapse) return 20\n      let padding = 20\n      let parent = instance.parent\n      while (parent && parent.type.name !== 'ElMenu') {\n        if (parent.type.name === 'ElSubMenu') {\n          padding += 20\n        }\n        parent = parent.parent\n      }\n      return padding\n    })\n\n    return {\n      levelPadding,\n    }\n  },\n})\n</script>\n"],"names":[],"mappings":";;;;AAsBA,MAAM,iBAAiB;AAEvB,aAAe,gBAAgB;AAAA,EAC7B,MAAM;AAAA,EAEN,OAAO;AAAA,EAEP,QAAQ;AACN,UAAM,WAAW;AACjB,UAAM,OAAO,OAAqB;AAClC,QAAI,CAAC;AAAM,iBAAW,gBAAgB;AAEtC,UAAM,eAAe,SAAS,MAAM;AAClC,UAAI,KAAK,MAAM;AAAU,eAAO;AAChC,UAAI,UAAU;AACd,UAAI,SAAS,SAAS;AACtB,aAAO,UAAU,OAAO,KAAK,SAAS,UAAU;AAC9C,YAAI,OAAO,KAAK,SAAS,aAAa;AACpC,qBAAW;AAAA;AAEb,iBAAS,OAAO;AAAA;AAElB,aAAO;AAAA;AAGT,WAAO;AAAA,MACL;AAAA;AAAA;AAAA;;;;"}

package/es/components/menu/src/menu-item-group.vue_vue_type_template_id_67a2995d_lang.mjs

@@ -0,0 +1,21 @@
+import { openBlock, createElementBlock, createElementVNode, normalizeStyle, Fragment, createTextVNode, toDisplayString, renderSlot } from 'vue';
+
+const _hoisted_1 = { class: "el-menu-item-group" };
+function render(_ctx, _cache, $props, $setup, $data, $options) {
+  return openBlock(), createElementBlock("li", _hoisted_1, [
+    createElementVNode("div", {
+      class: "el-menu-item-group__title",
+      style: normalizeStyle({ paddingLeft: `${_ctx.levelPadding}px` })
+    }, [
+      !_ctx.$slots.title ? (openBlock(), createElementBlock(Fragment, { key: 0 }, [
+        createTextVNode(toDisplayString(_ctx.title), 1)
+      ], 2112)) : renderSlot(_ctx.$slots, "title", { key: 1 })
+    ], 4),
+    createElementVNode("ul", null, [
+      renderSlot(_ctx.$slots, "default")
+    ])
+  ]);
+}
+
+export { render };
+//# sourceMappingURL=menu-item-group.vue_vue_type_template_id_67a2995d_lang.mjs.map

package/es/components/menu/src/menu-item-group.vue_vue_type_template_id_67a2995d_lang.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"menu-item-group.vue_vue_type_template_id_67a2995d_lang.mjs","sources":["../../../../../../packages/components/menu/src/menu-item-group.vue?vue&type=template&id=67a2995d&lang.js"],"sourcesContent":["<template>\n  <li class=\"el-menu-item-group\">\n    <div\n      class=\"el-menu-item-group__title\"\n      :style=\"{ paddingLeft: `${levelPadding}px` }\"\n    >\n      <template v-if=\"!$slots.title\">{{ title }}</template>\n      <slot v-else name=\"title\" />\n    </div>\n    <ul>\n      <slot />\n    </ul>\n  </li>\n</template>\n\n<script lang=\"ts\">\nimport { defineComponent, computed, getCurrentInstance, inject } from 'vue'\nimport { throwError } from '@element-plus/utils/error'\nimport { menuItemGroupProps } from './menu-item-group'\n\nimport type { MenuProvider } from './types'\n\nconst COMPONENT_NAME = 'ElMenuItemGroup'\n\nexport default defineComponent({\n  name: COMPONENT_NAME,\n\n  props: menuItemGroupProps,\n\n  setup() {\n    const instance = getCurrentInstance()!\n    const menu = inject<MenuProvider>('rootMenu')\n    if (!menu) throwError(COMPONENT_NAME, 'can not inject root menu')\n\n    const levelPadding = computed(() => {\n      if (menu.props.collapse) return 20\n      let padding = 20\n      let parent = instance.parent\n      while (parent && parent.type.name !== 'ElMenu') {\n        if (parent.type.name === 'ElSubMenu') {\n          padding += 20\n        }\n        parent = parent.parent\n      }\n      return padding\n    })\n\n    return {\n      levelPadding,\n    }\n  },\n})\n</script>\n"],"names":["_createElementBlock","_createElementVNode","_renderSlot"],"mappings":";;qBACM,OAAM;;sBAAVA,yBAAA;IACEC;MACE,OAAM;AAAA,MACL,wCAAyB;;OAET,YAAO,sBAAxBD;wCAAkC;kBAClCE;;IAEFD;MACEC;;;;;;;"}

package/es/components/menu/src/menu-item-group2.mjs

@@ -1,6 +1,6 @@
-import script from './menu-item-group.vue_vue&type=script&lang.mjs';
-export { default } from './menu-item-group.vue_vue&type=script&lang.mjs';
-import { render } from './menu-item-group.vue_vue&type=template&id=67a2995d&lang.mjs';
+import script from './menu-item-group.vue_vue_type_script_lang.mjs';
+export { default } from './menu-item-group.vue_vue_type_script_lang.mjs';
+import { render } from './menu-item-group.vue_vue_type_template_id_67a2995d_lang.mjs';
 
 script.render = render;
 script.__file = "packages/components/menu/src/menu-item-group.vue";

package/es/components/menu/src/menu-item.vue_vue_type_script_lang.mjs

@@ -0,0 +1,62 @@
+import { defineComponent, getCurrentInstance, inject, toRef, computed, reactive, onMounted, onBeforeUnmount } from 'vue';
+import _Tooltip from '../../tooltip/index.mjs';
+import '../../popper/index.mjs';
+import { throwError } from '../../../utils/error.mjs';
+import useMenu from './use-menu.mjs';
+import { menuItemProps, menuItemEmits } from './menu-item.mjs';
+import { Effect } from '../../popper/src/use-popper/defaults.mjs';
+
+const COMPONENT_NAME = "ElMenuItem";
+var script = defineComponent({
+  name: COMPONENT_NAME,
+  components: {
+    ElTooltip: _Tooltip
+  },
+  props: menuItemProps,
+  emits: menuItemEmits,
+  setup(props, { emit }) {
+    const instance = getCurrentInstance();
+    const rootMenu = inject("rootMenu");
+    if (!rootMenu)
+      throwError(COMPONENT_NAME, "can not inject root menu");
+    const { parentMenu, paddingStyle, indexPath } = useMenu(instance, toRef(props, "index"));
+    const subMenu = inject(`subMenu:${parentMenu.value.uid}`);
+    if (!subMenu)
+      throwError(COMPONENT_NAME, "can not inject sub menu");
+    const active = computed(() => props.index === rootMenu.activeIndex);
+    const item = reactive({
+      index: props.index,
+      indexPath,
+      active
+    });
+    const handleClick = () => {
+      if (!props.disabled) {
+        rootMenu.handleMenuItemClick({
+          index: props.index,
+          indexPath: indexPath.value,
+          route: props.route
+        });
+        emit("click", item);
+      }
+    };
+    onMounted(() => {
+      subMenu.addSubMenu(item);
+      rootMenu.addMenuItem(item);
+    });
+    onBeforeUnmount(() => {
+      subMenu.removeSubMenu(item);
+      rootMenu.removeMenuItem(item);
+    });
+    return {
+      Effect,
+      parentMenu,
+      rootMenu,
+      paddingStyle,
+      active,
+      handleClick
+    };
+  }
+});
+
+export { script as default };
+//# sourceMappingURL=menu-item.vue_vue_type_script_lang.mjs.map

package/es/components/menu/src/menu-item.vue_vue_type_script_lang.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"menu-item.vue_vue_type_script_lang.mjs","sources":["../../../../../../packages/components/menu/src/menu-item.vue"],"sourcesContent":["<template>\n  <li\n    class=\"el-menu-item\"\n    role=\"menuitem\"\n    tabindex=\"-1\"\n    :style=\"paddingStyle\"\n    :class=\"{\n      'is-active': active,\n      'is-disabled': disabled,\n    }\"\n    @click=\"handleClick\"\n  >\n    <el-tooltip\n      v-if=\"\n        parentMenu.type.name === 'ElMenu' &&\n        rootMenu.props.collapse &&\n        $slots.title\n      \"\n      :effect=\"Effect.DARK\"\n      placement=\"right\"\n    >\n      <template #content>\n        <slot name=\"title\" />\n      </template>\n      <div\n        :style=\"{\n          position: 'absolute',\n          left: 0,\n          top: 0,\n          height: '100%',\n          width: '100%',\n          display: 'inline-block',\n          boxSizing: 'border-box',\n          padding: '0 20px',\n        }\"\n      >\n        <slot />\n      </div>\n    </el-tooltip>\n    <template v-else>\n      <slot />\n      <slot name=\"title\" />\n    </template>\n  </li>\n</template>\n\n<script lang=\"ts\">\nimport {\n  defineComponent,\n  computed,\n  onMounted,\n  onBeforeUnmount,\n  inject,\n  getCurrentInstance,\n  toRef,\n  reactive,\n} from 'vue'\nimport ElTooltip from '@element-plus/components/tooltip'\nimport { Effect } from '@element-plus/components/popper'\nimport { throwError } from '@element-plus/utils/error'\nimport useMenu from './use-menu'\nimport { menuItemEmits, menuItemProps } from './menu-item'\n\nimport type { MenuItemRegistered, MenuProvider, SubMenuProvider } from './types'\n\nconst COMPONENT_NAME = 'ElMenuItem'\nexport default defineComponent({\n  name: COMPONENT_NAME,\n  components: {\n    ElTooltip,\n  },\n\n  props: menuItemProps,\n  emits: menuItemEmits,\n\n  setup(props, { emit }) {\n    const instance = getCurrentInstance()!\n    const rootMenu = inject<MenuProvider>('rootMenu')\n    if (!rootMenu) throwError(COMPONENT_NAME, 'can not inject root menu')\n\n    const { parentMenu, paddingStyle, indexPath } = useMenu(\n      instance,\n      toRef(props, 'index')\n    )\n\n    const subMenu = inject<SubMenuProvider>(`subMenu:${parentMenu.value.uid}`)\n    if (!subMenu) throwError(COMPONENT_NAME, 'can not inject sub menu')\n\n    const active = computed(() => props.index === rootMenu.activeIndex)\n    const item: MenuItemRegistered = reactive({\n      index: props.index,\n      indexPath,\n      active,\n    })\n\n    const handleClick = () => {\n      if (!props.disabled) {\n        rootMenu.handleMenuItemClick({\n          index: props.index,\n          indexPath: indexPath.value,\n          route: props.route,\n        })\n        emit('click', item)\n      }\n    }\n\n    onMounted(() => {\n      subMenu.addSubMenu(item)\n      rootMenu.addMenuItem(item)\n    })\n\n    onBeforeUnmount(() => {\n      subMenu.removeSubMenu(item)\n      rootMenu.removeMenuItem(item)\n    })\n\n    return {\n      Effect,\n      parentMenu,\n      rootMenu,\n      paddingStyle,\n      active,\n\n      handleClick,\n    }\n  },\n})\n</script>\n"],"names":["ElTooltip"],"mappings":";;;;;;;;AAiEA,MAAM,iBAAiB;AACvB,aAAe,gBAAgB;AAAA,EAC7B,MAAM;AAAA,EACN,YAAY;AAAA,eACVA;AAAA;AAAA,EAGF,OAAO;AAAA,EACP,OAAO;AAAA,EAEP,MAAM,OAAO,EAAE,QAAQ;AACrB,UAAM,WAAW;AACjB,UAAM,WAAW,OAAqB;AACtC,QAAI,CAAC;AAAU,iBAAW,gBAAgB;AAE1C,UAAM,EAAE,YAAY,cAAc,cAAc,QAC9C,UACA,MAAM,OAAO;AAGf,UAAM,UAAU,OAAwB,WAAW,WAAW,MAAM;AACpE,QAAI,CAAC;AAAS,iBAAW,gBAAgB;AAEzC,UAAM,SAAS,SAAS,MAAM,MAAM,UAAU,SAAS;AACvD,UAAM,OAA2B,SAAS;AAAA,MACxC,OAAO,MAAM;AAAA,MACb;AAAA,MACA;AAAA;AAGF,UAAM,cAAc,MAAM;AACxB,UAAI,CAAC,MAAM,UAAU;AACnB,iBAAS,oBAAoB;AAAA,UAC3B,OAAO,MAAM;AAAA,UACb,WAAW,UAAU;AAAA,UACrB,OAAO,MAAM;AAAA;AAEf,aAAK,SAAS;AAAA;AAAA;AAIlB,cAAU,MAAM;AACd,cAAQ,WAAW;AACnB,eAAS,YAAY;AAAA;AAGvB,oBAAgB,MAAM;AACpB,cAAQ,cAAc;AACtB,eAAS,eAAe;AAAA;AAG1B,WAAO;AAAA,MACL;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MAEA;AAAA;AAAA;AAAA;;;;"}

package/es/components/menu/src/menu-item.vue_vue_type_template_id_aa755baa_lang.mjs

@@ -0,0 +1,47 @@
+import { resolveComponent, openBlock, createElementBlock, normalizeClass, normalizeStyle, createBlock, withCtx, renderSlot, createElementVNode, Fragment } from 'vue';
+
+const _hoisted_1 = { style: {
+  position: "absolute",
+  left: 0,
+  top: 0,
+  height: "100%",
+  width: "100%",
+  display: "inline-block",
+  boxSizing: "border-box",
+  padding: "0 20px"
+} };
+function render(_ctx, _cache, $props, $setup, $data, $options) {
+  const _component_el_tooltip = resolveComponent("el-tooltip");
+  return openBlock(), createElementBlock("li", {
+    class: normalizeClass(["el-menu-item", {
+      "is-active": _ctx.active,
+      "is-disabled": _ctx.disabled
+    }]),
+    role: "menuitem",
+    tabindex: "-1",
+    style: normalizeStyle(_ctx.paddingStyle),
+    onClick: _cache[0] || (_cache[0] = (...args) => _ctx.handleClick && _ctx.handleClick(...args))
+  }, [
+    _ctx.parentMenu.type.name === "ElMenu" && _ctx.rootMenu.props.collapse && _ctx.$slots.title ? (openBlock(), createBlock(_component_el_tooltip, {
+      key: 0,
+      effect: _ctx.Effect.DARK,
+      placement: "right"
+    }, {
+      content: withCtx(() => [
+        renderSlot(_ctx.$slots, "title")
+      ]),
+      default: withCtx(() => [
+        createElementVNode("div", _hoisted_1, [
+          renderSlot(_ctx.$slots, "default")
+        ])
+      ]),
+      _: 3
+    }, 8, ["effect"])) : (openBlock(), createElementBlock(Fragment, { key: 1 }, [
+      renderSlot(_ctx.$slots, "default"),
+      renderSlot(_ctx.$slots, "title")
+    ], 64))
+  ], 6);
+}
+
+export { render };
+//# sourceMappingURL=menu-item.vue_vue_type_template_id_aa755baa_lang.mjs.map

package/es/components/menu/src/menu-item.vue_vue_type_template_id_aa755baa_lang.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"menu-item.vue_vue_type_template_id_aa755baa_lang.mjs","sources":["../../../../../../packages/components/menu/src/menu-item.vue?vue&type=template&id=aa755baa&lang.js"],"sourcesContent":["<template>\n  <li\n    class=\"el-menu-item\"\n    role=\"menuitem\"\n    tabindex=\"-1\"\n    :style=\"paddingStyle\"\n    :class=\"{\n      'is-active': active,\n      'is-disabled': disabled,\n    }\"\n    @click=\"handleClick\"\n  >\n    <el-tooltip\n      v-if=\"\n        parentMenu.type.name === 'ElMenu' &&\n        rootMenu.props.collapse &&\n        $slots.title\n      \"\n      :effect=\"Effect.DARK\"\n      placement=\"right\"\n    >\n      <template #content>\n        <slot name=\"title\" />\n      </template>\n      <div\n        :style=\"{\n          position: 'absolute',\n          left: 0,\n          top: 0,\n          height: '100%',\n          width: '100%',\n          display: 'inline-block',\n          boxSizing: 'border-box',\n          padding: '0 20px',\n        }\"\n      >\n        <slot />\n      </div>\n    </el-tooltip>\n    <template v-else>\n      <slot />\n      <slot name=\"title\" />\n    </template>\n  </li>\n</template>\n\n<script lang=\"ts\">\nimport {\n  defineComponent,\n  computed,\n  onMounted,\n  onBeforeUnmount,\n  inject,\n  getCurrentInstance,\n  toRef,\n  reactive,\n} from 'vue'\nimport ElTooltip from '@element-plus/components/tooltip'\nimport { Effect } from '@element-plus/components/popper'\nimport { throwError } from '@element-plus/utils/error'\nimport useMenu from './use-menu'\nimport { menuItemEmits, menuItemProps } from './menu-item'\n\nimport type { MenuItemRegistered, MenuProvider, SubMenuProvider } from './types'\n\nconst COMPONENT_NAME = 'ElMenuItem'\nexport default defineComponent({\n  name: COMPONENT_NAME,\n  components: {\n    ElTooltip,\n  },\n\n  props: menuItemProps,\n  emits: menuItemEmits,\n\n  setup(props, { emit }) {\n    const instance = getCurrentInstance()!\n    const rootMenu = inject<MenuProvider>('rootMenu')\n    if (!rootMenu) throwError(COMPONENT_NAME, 'can not inject root menu')\n\n    const { parentMenu, paddingStyle, indexPath } = useMenu(\n      instance,\n      toRef(props, 'index')\n    )\n\n    const subMenu = inject<SubMenuProvider>(`subMenu:${parentMenu.value.uid}`)\n    if (!subMenu) throwError(COMPONENT_NAME, 'can not inject sub menu')\n\n    const active = computed(() => props.index === rootMenu.activeIndex)\n    const item: MenuItemRegistered = reactive({\n      index: props.index,\n      indexPath,\n      active,\n    })\n\n    const handleClick = () => {\n      if (!props.disabled) {\n        rootMenu.handleMenuItemClick({\n          index: props.index,\n          indexPath: indexPath.value,\n          route: props.route,\n        })\n        emit('click', item)\n      }\n    }\n\n    onMounted(() => {\n      subMenu.addSubMenu(item)\n      rootMenu.addMenuItem(item)\n    })\n\n    onBeforeUnmount(() => {\n      subMenu.removeSubMenu(item)\n      rootMenu.removeMenuItem(item)\n    })\n\n    return {\n      Effect,\n      parentMenu,\n      rootMenu,\n      paddingStyle,\n      active,\n\n      handleClick,\n    }\n  },\n})\n</script>\n"],"names":["_createElementBlock","_createBlock","_renderSlot","_createElementVNode"],"mappings":";;qBAyBS,OAAO;AAAA;;;;;;;;;;;sBAxBdA;IACE,uBAAM;;;;IACN,MAAK;AAAA,IACL,UAAS;AAAA,IACR,sBAAO;IAKP,gDAAO;;gHAERC;;MAMG,QAAQ,YAAO;AAAA,MAChB,WAAU;AAAA;MAEC,iBACT;QAAAC;;uBAEF;QAAAC,0BAAA;UAYED;;;;uCAGJF;MACEE;MACAA;;;;;;;"}