@das-fed/web 1.0.2 → 1.0.3

package/index.js

@@ -1,156 +1,365 @@
-import { ref as b, computed as A, reactive as k, defineComponent as F, resolveComponent as ee, openBlock as f, createElementBlock as S, createElementVNode as h, renderSlot as v, withDirectives as P, createVNode as I, withCtx as p, Transition as D, normalizeProps as T, guardReactiveProps as C, createBlock as g, KeepAlive as te, resolveDynamicComponent as W, createCommentVNode as R, vShow as E, unref as x, watch as N, Fragment as ae, renderList as ne, createApp as se } from "vue";
-import { useRoute as H, createRouter as re, createWebHistory as ce } from "vue-router";
-const _ = b("light"), $ = b({
+import { ref as A, computed as l, reactive as V, defineComponent as P, watch as R, resolveComponent as fe, openBlock as p, createElementBlock as w, createVNode as y, Transition as S, withCtx as L, withDirectives as z, createElementVNode as j, normalizeStyle as pe, vShow as Q, normalizeProps as B, guardReactiveProps as O, renderSlot as T, createCommentVNode as k, createBlock as G, KeepAlive as ge, unref as E, resolveDynamicComponent as ae, onBeforeMount as he, onMounted as be, onUnmounted as _e, Fragment as se, renderList as Ie, createApp as Ae } from "vue";
+import { useRoute as ye, createRouter as Le, createWebHistory as we } from "vue-router";
+import { createCeNav as Me, createCeMenu as Ce, createCeTabs as Te } from "@das-fed/web-components";
+const F = A("light"), W = A({
   light: {},
   dark: {}
-}), M = b({
+}), K = A({
   light: {},
   dark: {}
-}), oe = "dasTheme", L = "das-theme", ie = (e) => {
+}), ke = "dasTheme", H = "das-theme", De = (e) => {
   let t = {
     light: {},
     dark: {}
   };
   if (!e)
     return t;
-  const { light: a, dark: s, ...n } = e || {};
-  t.light = a || {}, t.dark = s || {};
-  for (const r in n) {
-    const c = n[r];
-    if (typeof c == "string" && (t.light[r] = c), typeof c == "object")
-      for (const o in c)
-        t[o][r] = c[o];
+  const { light: n, dark: s, ...a } = e || {};
+  t.light = n || {}, t.dark = s || {};
+  for (const o in a) {
+    const i = a[o];
+    if (typeof i == "string" && (t.light[o] = i), typeof i == "object")
+      for (const r in i)
+        t[r][o] = i[r];
   }
   return t;
 };
-function le(e) {
-  const t = "das-global-theme", a = "das-custom-theme";
-  if (!document.getElementById(a)) {
-    const n = document.createElement("style");
-    n.appendChild(document.createTextNode("")), n.setAttribute("id", a), document.head.appendChild(n);
+function Ee(e) {
+  const t = "das-global-theme", n = "das-custom-theme";
+  if (!document.getElementById(n)) {
+    const a = document.createElement("style");
+    a.appendChild(document.createTextNode("")), a.setAttribute("id", n), document.head.appendChild(a);
   }
   if (!document.getElementById(t)) {
-    const n = document.createElement("style");
-    n.appendChild(document.createTextNode("")), n.setAttribute("id", t), document.head.appendChild(n);
+    const a = document.createElement("style");
+    a.appendChild(document.createTextNode("")), a.setAttribute("id", t), document.head.appendChild(a);
   }
   e || (e = "custom");
-  let s = document.getElementById(a);
+  let s = document.getElementById(n);
   return e === "global" && (s = document.getElementById(t)), s.sheet;
 }
-const j = (e, t) => {
+const oe = (e, t) => {
   t || (t = "custom");
-  const a = le(t), s = ie(e);
-  for (const r in s) {
-    const c = s[r];
-    for (const o in c) {
-      const i = c[o], l = `${L}-${r}`;
-      a.insertRule(`.${l} { ${o}:${i} } `, a.cssRules.length);
+  const n = Ee(t), s = De(e);
+  for (const o in s) {
+    const i = s[o];
+    for (const r in i) {
+      const u = i[r], g = `${H}-${o}`;
+      n.insertRule(`.${g} { ${r}:${u} } `, n.cssRules.length);
     }
-    t === "global" && (M.value[r] || (M.value[r] = {}), M.value[r] = { ...M.value[r], ...c }), t === "custom" && ($.value[r] || ($.value[r] = {}), $.value[r] = { ...$.value[r], ...c });
+    t === "global" && (K.value[o] || (K.value[o] = {}), K.value[o] = { ...K.value[o], ...i }), t === "custom" && (W.value[o] || (W.value[o] = {}), W.value[o] = { ...W.value[o], ...i });
   }
-  const n = `${L}-${_.value}`;
-  document.body.classList.contains(n) || document.body.classList.add(n);
-}, de = async (e) => {
+  const a = `${H}-${F.value}`;
+  document.body.classList.contains(a) || document.body.classList.add(a);
+}, $e = async (e) => {
   var s;
-  const t = window[oe];
-  t && j(t, "global");
-  const a = (s = e == null ? void 0 : e.theme) == null ? void 0 : s.glob;
-  if (a) {
-    const n = Object.values(a).map((r) => r.default).filter((r) => !!r).flat();
-    for (const r of n)
-      j(r);
+  const t = window[ke];
+  t && oe(t, "global");
+  const n = (s = e == null ? void 0 : e.theme) == null ? void 0 : s.glob;
+  if (n) {
+    const a = Object.values(n).map((o) => o.default).filter((o) => !!o).flat();
+    for (const o of a)
+      oe(o);
   }
-}, We = (e) => {
-  document.body.classList.add(`${L}-light`), e === "light" && document.body.classList.remove(`${L}-${_.value}`), _.value = e, document.body.classList.add(`${L}-${_.value}`);
-}, ue = (e) => A(() => {
-  var t, a, s, n;
-  return ((a = (t = M.value) == null ? void 0 : t[_.value]) == null ? void 0 : a[e]) || ((n = (s = $.value) == null ? void 0 : s[_.value]) == null ? void 0 : n[e]) || e;
-}), je = (e) => `var(${e})`, qe = ue, z = k({}), J = k({}), B = b("zh-CN"), me = "dasI18n", q = (e, t) => {
-  const a = t === "global", s = !a;
-  for (const n in e)
-    a && (J[n] = e[n]), s && (z[n] = e[n]);
-}, fe = async (e) => {
+}, yt = (e) => {
+  document.body.classList.add(`${H}-light`), e === "light" && document.body.classList.remove(`${H}-${F.value}`), F.value = e, document.body.classList.add(`${H}-${F.value}`);
+}, Re = (e) => l(() => {
+  var t, n, s, a;
+  return ((n = (t = K.value) == null ? void 0 : t[F.value]) == null ? void 0 : n[e]) || ((a = (s = W.value) == null ? void 0 : s[F.value]) == null ? void 0 : a[e]) || e;
+}), Lt = (e) => `var(${e})`, wt = Re, ce = V({}), le = V({}), ee = A("zh-CN"), Ve = "dasI18n", ie = (e, t) => {
+  const n = t === "global", s = !n;
+  for (const a in e)
+    n && (le[a] = e[a]), s && (ce[a] = e[a]);
+}, Pe = async (e) => {
   var s;
-  const t = window[me];
-  t && q(t, "global");
-  const a = (s = e == null ? void 0 : e.i18n) == null ? void 0 : s.glob;
-  if (a) {
-    const n = Object.values(a).map((r) => r.default).filter((r) => !!r).flat();
-    for (const r of n)
-      q(r);
+  const t = window[Ve];
+  t && ie(t, "global");
+  const n = (s = e == null ? void 0 : e.i18n) == null ? void 0 : s.glob;
+  if (n) {
+    const a = Object.values(n).map((o) => o.default).filter((o) => !!o).flat();
+    for (const o of a)
+      ie(o);
   }
-}, he = (e, ...t) => A(() => {
-  const a = J[e] || z[e] || e;
-  if (a === e)
+}, Se = (e, ...t) => l(() => {
+  const n = le[e] || ce[e] || e;
+  if (n === e)
     return e;
-  let s = a[B.value];
-  return t.map((n, r) => {
-    s = s.replace(`$${r}`, n);
+  let s = n[ee.value];
+  return t.map((a, o) => {
+    s = s.replace(`$${o}`, a);
   }), s;
-}), pe = he, Ge = (e, ...t) => pe(e, ...t).value, He = (e) => {
-  B.value = e;
-}, ze = () => B, m = b([]), d = {}, u = {}, Q = k({
-  location: {}
-}), ve = { class: "das-web-app-container" }, ge = {
-  class: "header",
-  ref: "header"
-}, _e = { class: "main" }, Ae = {
-  class: "aside",
-  ref: "aside"
-}, be = { class: "container" }, ye = { class: "tab" }, $e = { class: "router-view" }, Me = { style: { width: "100%", height: "100%" } }, Le = { style: { height: "100%", width: "100%" } }, we = /* @__PURE__ */ F({
+}), je = Se, Mt = (e, ...t) => je(e, ...t).value, Ct = (e) => {
+  ee.value = e;
+}, Tt = () => ee, m = V({
+  logo: "",
+  items: [],
+  projects: [],
+  userInfo: {},
+  visible: !1,
+  // activeItem: '',
+  // activeProject: {},
+  eventListeners: {}
+}), xe = {
+  show: () => {
+    m.visible = !0;
+  },
+  hide: () => {
+    m.visible = !1;
+  },
+  setLogo: (e) => {
+    m.logo = e;
+  },
+  setItems: (e) => {
+    m.visible || (m.visible = !0), m.items = e;
+  },
+  getItems: () => m.items,
+  removeItem: (e) => {
+    const t = m.items.filter((n) => n.value !== e);
+    m.items = t;
+  },
+  appendItem: (e) => {
+    m.visible || (m.visible = !0), !m.items.find((n) => n.value == e.value) && m.items.push(e);
+  },
+  setActiveItem: (e) => {
+    m.activeItem = e;
+  },
+  setProjects: (e) => {
+    m.projects = e;
+  },
+  setActiveProject: (e) => {
+    m.activeProject = e;
+  },
+  setUserInfo: (e) => {
+    m.userInfo = e;
+  },
+  triggerEventListener: (e, t, n) => {
+    var o;
+    const s = m.eventListeners, { autoRemove: a = !1 } = n || {};
+    for (const i in s) {
+      const r = s[i];
+      r.type === e && ((o = r == null ? void 0 : r.handler) == null || o.call(r, t).then(() => {
+        a && r.remove();
+      }));
+    }
+  },
+  addEventListener: (e, t) => {
+    const n = (/* @__PURE__ */ new Date()).getTime() + Math.random().toString(36).slice(-8), s = () => {
+      m.eventListeners[n] && delete m.eventListeners[n];
+    };
+    return m.eventListeners[n] = {
+      type: e,
+      handler: async (a) => await t(a),
+      remove: s
+    }, {
+      remove: s
+    };
+  }
+}, C = V({
+  items: [],
+  eventListeners: {}
+}), Fe = {
+  setItems: (e) => {
+    C.items = e;
+  },
+  getItems: () => C.items,
+  setActiveItem: (e) => {
+    C.activeItem = e;
+  },
+  triggerEventListener: (e, t, n) => {
+    var o;
+    const s = C.eventListeners, { autoRemove: a = !1 } = n || {};
+    for (const i in s) {
+      const r = s[i];
+      r.type === e && ((o = r == null ? void 0 : r.handler) == null || o.call(r, t).then(() => {
+        a && r.remove();
+      }));
+    }
+  },
+  addEventListener: (e, t) => {
+    const n = (/* @__PURE__ */ new Date()).getTime() + Math.random().toString(36).slice(-8), s = () => {
+      C.eventListeners[n] && delete C.eventListeners[n];
+    };
+    return C.eventListeners[n] = {
+      type: e,
+      handler: async (a) => await t(a),
+      remove: s
+    }, {
+      remove: s
+    };
+  }
+}, b = V({
+  items: [],
+  eventListeners: {}
+}), Ne = {
+  setItems: (e) => {
+    b.items = e;
+  },
+  getItems: () => b.items,
+  removeItem: (e) => {
+    const t = b.items.filter((n) => n.value !== e);
+    b.items = t;
+  },
+  appendItem: (e) => {
+    b.items.find((n) => n.value == e.value) || b.items.push(e);
+  },
+  setActiveItem: (e) => {
+    b.activeItem = e;
+  },
+  triggerEventListener: (e, t, n) => {
+    var o;
+    const s = b.eventListeners, { autoRemove: a = !1 } = n || {};
+    for (const i in s) {
+      const r = s[i];
+      r.type === e && ((o = r == null ? void 0 : r.handler) == null || o.call(r, t).then(() => {
+        a && r.remove();
+      }));
+    }
+  },
+  addEventListener: (e, t) => {
+    const n = (/* @__PURE__ */ new Date()).getTime() + Math.random().toString(36).slice(-8), s = () => {
+      b.eventListeners[n] && delete b.eventListeners[n];
+    };
+    return b.eventListeners[n] = {
+      type: e,
+      handler: async (a) => await t(a),
+      remove: s
+    }, {
+      remove: s
+    };
+  }
+}, Z = V({
+  visible: !1,
+  style: {}
+}), Be = {
+  set: (e, t) => {
+    Z.visible = e, t && (Z.style = t);
+  }
+}, f = {
+  nav: xe,
+  menu: Fe,
+  tab: Ne,
+  overlay: Be
+}, U = {
+  nav: m,
+  menu: C,
+  tab: b,
+  overlay: Z
+}, Oe = { class: "das-web-app-container" }, We = {
+  key: 0,
+  class: "das-web-app-header"
+}, Ke = { class: "das-web-app-main" }, Ge = {
+  key: 0,
+  class: "aside"
+}, He = { class: "das-web-app-main-container" }, Ue = {
+  key: 0,
+  class: "tab"
+}, qe = { class: "das-web-app-main-router-view" }, ze = { style: { width: "100%", height: "100%" } }, Qe = {
+  class: "micro-app",
+  style: { height: "100%", width: "100%" }
+}, Je = /* @__PURE__ */ P({
   __name: "das-web-layout",
   props: {
-    transitionConfig: {}
+    transitionConfig: {},
+    headerTransitionConfig: {},
+    asideTransitionConfig: {},
+    tabTransitionConfig: {},
+    routerViewVisible: { type: Boolean, default: !0 }
   },
   setup(e) {
-    const t = e, a = H(), s = A(() => ({
+    const t = e, n = ye(), s = A(!1), a = A(!1), o = A(!1), i = l(() => t.routerViewVisible ?? !0), r = l(() => U.overlay.visible ?? !1), u = l(() => U.overlay.style ?? { backgroundColor: "rgba(0,0,0,0.5)" });
+    R(
+      () => n.meta,
+      (M) => {
+        const { showLayout: d = !0, showAside: c = !0, showTabs: v = !0 } = M;
+        let $ = !0, te = !0, ne = !0;
+        d !== !1 && (c === !1 && (te = !1), v === !1 && (ne = !1), s.value = $, a.value = te, o.value = ne);
+      }
+    );
+    const g = l(() => ({
       "enter-active-class": "animate__animated animate__fadeInLeft",
       ...t.transitionConfig || {}
+    })), N = l(() => ({
+      "enter-active-class": "animate__animated animate__fadeInDown",
+      ...t.headerTransitionConfig || {}
+    })), X = l(() => ({
+      "enter-active-class": "animate__animated animate__fadeInLeft",
+      ...t.asideTransitionConfig || {}
+    })), Y = l(() => ({
+      "enter-active-class": "animate__animated animate__fadeIn",
+      ...t.tabTransitionConfig || {}
     }));
-    return (n, r) => {
-      const c = ee("router-view");
-      return f(), S("div", ve, [
-        h("div", ge, [
-          v(n.$slots, "header", {}, void 0, !0)
-        ], 512),
-        h("div", _e, [
-          h("div", Ae, [
-            v(n.$slots, "aside", {}, void 0, !0)
-          ], 512),
-          h("div", be, [
-            h("div", ye, [
-              v(n.$slots, "tab", {}, void 0, !0)
+    return (M, d) => {
+      const c = fe("router-view");
+      return p(), w("div", Oe, [
+        y(S, { name: "overlay" }, {
+          default: L(() => [
+            z(j("div", {
+              class: "das-web-app-overlay",
+              style: pe(u.value)
+            }, null, 4), [
+              [Q, r.value]
+            ])
+          ]),
+          _: 1
+        }),
+        y(S, B(O(N.value)), {
+          default: L(() => [
+            s.value ? (p(), w("div", We, [
+              T(M.$slots, "header", {}, void 0, !0)
+            ])) : k("", !0)
+          ]),
+          _: 3
+        }, 16),
+        j("div", Ke, [
+          y(S, B(O(X.value)), {
+            default: L(() => [
+              a.value ? (p(), w("div", Ge, [
+                T(M.$slots, "aside", {}, void 0, !0)
+              ])) : k("", !0)
             ]),
-            h("div", $e, [
-              P(h("div", Me, [
-                I(c, null, {
-                  default: p(({ Component: o, route: i }) => [
-                    I(D, T(C(s.value)), {
-                      default: p(() => [
-                        (f(), g(te, null, [
-                          i.meta.keepAlive ? (f(), g(W(o), {
-                            key: i.path
-                          })) : R("", !0)
-                        ], 1024))
-                      ]),
-                      _: 2
-                    }, 1040),
-                    I(D, T(C(s.value)), {
-                      default: p(() => [
-                        i.meta.keepAlive ? R("", !0) : (f(), g(W(o), { key: 0 }))
-                      ]),
-                      _: 2
-                    }, 1040)
-                  ]),
-                  _: 1
-                })
+            _: 3
+          }, 16),
+          j("div", He, [
+            y(S, B(O(Y.value)), {
+              default: L(() => [
+                o.value ? (p(), w("div", Ue, [
+                  T(M.$slots, "tab", {}, void 0, !0)
+                ])) : k("", !0)
+              ]),
+              _: 3
+            }, 16),
+            j("div", qe, [
+              z(j("div", ze, [
+                T(M.$slots, "router-view", {}, () => [
+                  y(c, null, {
+                    default: L(({ Component: v }) => [
+                      y(S, B(O(g.value)), {
+                        default: L(() => [
+                          (p(), G(ge, null, [
+                            E(n).meta.keepAlive ? (p(), G(ae(v), {
+                              key: E(n).path
+                            })) : k("", !0)
+                          ], 1024))
+                        ]),
+                        _: 2
+                      }, 1040),
+                      y(S, B(O(g.value)), {
+                        default: L(() => [
+                          E(n).meta.keepAlive ? k("", !0) : (p(), G(ae(v), { key: 0 }))
+                        ]),
+                        _: 2
+                      }, 1040)
+                    ]),
+                    _: 1
+                  })
+                ], !0)
               ], 512), [
-                [E, !x(a).meta.isMicroApp]
+                [Q, i.value]
               ]),
-              P(h("div", Le, [
-                v(n.$slots, "micro-app", {}, void 0, !0)
+              z(j("div", Qe, [
+                T(M.$slots, "default", {}, void 0, !0)
               ], 512), [
-                [E, x(a).meta.isMicroApp]
+                [Q, !i.value]
               ])
             ])
           ])
@@ -158,250 +367,409 @@ const j = (e, t) => {
       ]);
     };
   }
-}), K = (e, t) => {
-  const a = e.__vccOpts || e;
-  for (const [s, n] of t)
-    a[s] = n;
-  return a;
-}, U = /* @__PURE__ */ K(we, [["__scopeId", "data-v-8f59fb33"]]), Je = (e, t) => {
-  const a = m.value.find((s) => s.name === e);
-  return a ? t ? (t.startsWith("/") || (t = `/${t}`), `${a.routerPrefix}${t}`) : a.routerPrefix : "";
-}, X = (e, t, a, s) => {
-  var r;
-  const n = m.value.find((c) => c.name === e);
-  n && ((r = n.dom.contentWindow) == null || r.postMessage({ type: t, cmd: a, data: s }, n.entry));
-}, Ie = (e, t, a) => {
-  var s;
-  (s = window.top) == null || s.postMessage({ type: e, cmd: t, data: a }, Q.location.origin);
-}, Pe = () => {
-  window.addEventListener(
+}), J = (e, t) => {
+  const n = e.__vccOpts || e;
+  for (const [s, a] of t)
+    n[s] = a;
+  return n;
+}, ue = /* @__PURE__ */ J(Je, [["__scopeId", "data-v-38d43295"]]), Xe = ["modelValue", "logoUrl", "config", "innerPagesConfig", "projectTreeConfig", "userInfoConfig"], Ye = /* @__PURE__ */ P({
+  __name: "das-web-nav",
+  setup(e) {
+    const { nav: t } = U;
+    Me("das-ce-nav");
+    const n = l(() => t.logo || ""), s = A();
+    R(
+      () => t.activeItem,
+      (d) => {
+        const c = t.items.find((v) => v.value === d);
+        if (!c) {
+          s.value = "";
+          return;
+        }
+        s.value = c.value;
+      }
+    );
+    const a = l(() => (t.items || []).filter((c) => c.fixed)), o = l(() => (t.items || []).filter((c) => !c.fixed)), i = l(() => ({
+      showSearch: !0,
+      showProjectTree: !0,
+      subAppList: o.value.map((d) => ({ code: d.value, name: d.label, ...d }))
+    })), r = l(() => {
+      const d = a.value.find((c) => c.value === t.activeItem);
+      return {
+        activeInnerPagePath: (d == null ? void 0 : d.path) || "",
+        innerPages: a.value.map((c) => ({ title: c.label, ...c }))
+      };
+    }), u = l(() => ({
+      projectStore: {
+        projectTree: t.projects,
+        currentProject: t.activeProject
+      }
+    })), g = l(() => t.userInfo), N = (d) => {
+      const c = d.detail[0], v = a.value.find(($) => c.value === $.value);
+      f.nav.setActiveItem(v.value), f.nav.triggerEventListener("onItemClick", v);
+    }, X = (d) => {
+      const c = d.detail[0], v = o.value.find(($) => c === $.value);
+      f.nav.setActiveItem(v.value), f.nav.triggerEventListener("onItemClick", v);
+    }, Y = (d) => {
+      const c = d.detail[0], v = o.value.find(($) => c === $.value);
+      f.nav.removeItem(v.value), f.nav.triggerEventListener("onItemRemove", v);
+    }, M = (d) => {
+      const [c, v] = d.detail;
+      c && (f.nav.setActiveProject(v), f.nav.triggerEventListener("onProjectChange", v));
+    };
+    return he(() => {
+      f.nav.triggerEventListener("onBeforeMount", null, { autoRemove: !0 });
+    }), be(() => {
+      f.nav.triggerEventListener("onMounted", null, { autoRemove: !0 });
+    }), _e(() => {
+      f.nav.triggerEventListener("onUnmounted", null, { autoRemove: !0 });
+    }), (d, c) => (p(), w("das-ce-nav", {
+      modelValue: s.value,
+      logoUrl: n.value,
+      config: i.value,
+      innerPagesConfig: r.value,
+      projectTreeConfig: u.value,
+      userInfoConfig: g.value,
+      "on:changeInnerPage": N,
+      "on:handleTabClick": X,
+      "on:handleTabDelete": Y,
+      "on:changeTreeHandle": M
+    }, null, 40, Xe));
+  }
+}), de = (e, t = "children", n = !0) => Array.isArray(e) && e.length ? e.reduce((s, a) => {
+  let o = a[t], i = { ...a };
+  return n && delete i[t], o && o.length ? s.concat(i, de(o, t, n)) : s.concat(i);
+}, []) : [], Ze = ["modelValue", "data", "collapse", "fixedTopMenu"], et = /* @__PURE__ */ P({
+  __name: "das-web-menu",
+  setup(e) {
+    const { menu: t } = U;
+    Ce();
+    const n = l(() => t.items), s = l(() => t.items.find((r) => r.fixed)), a = l(() => t.activeItem), o = l(() => t.collapse ?? !1), i = (r) => {
+      const u = r.detail[0], g = de(n.value).find((N) => u === N.id);
+      f.menu.setActiveItem(g.id), f.menu.triggerEventListener("onItemClick", g);
+    };
+    return (r, u) => n.value.length > 0 ? (p(), w("das-ce-menu", {
+      key: 0,
+      modelValue: a.value,
+      data: n.value,
+      collapse: o.value,
+      fixedTopMenu: s.value,
+      onChange: i
+    }, null, 40, Ze)) : k("", !0);
+  }
+}), tt = ["modelValue", "options"], nt = /* @__PURE__ */ P({
+  __name: "das-web-tabs",
+  setup(e) {
+    const { tab: t } = U;
+    Te();
+    const n = l(() => t.items.map((i) => ({
+      ...i,
+      key: i.value,
+      tab: i.label
+    }))), s = A();
+    R(
+      () => t.activeItem,
+      (i) => {
+        const r = n.value.find((u) => u.value === i);
+        s.value = r == null ? void 0 : r.value;
+      }
+    );
+    const a = (i) => {
+      const r = i.detail[0], u = n.value.find((g) => r === g.value);
+      f.tab.setActiveItem(u.value), f.tab.triggerEventListener("onItemClick", u);
+    }, o = (i) => {
+      const r = i.detail[0], u = n.value.find((g) => r === g.value);
+      f.tab.removeItem(u.value), f.tab.triggerEventListener("onItemRemove", u);
+    };
+    return (i, r) => n.value.length > 0 ? (p(), w("das-ce-tabs", {
+      key: 0,
+      modelValue: s.value,
+      options: n.value,
+      "on:tabClick": a,
+      "on:tabDelete": o
+    }, null, 40, tt)) : k("", !0);
+  }
+}), h = A([]), me = V({
+  location: {}
+}), x = A(!1);
+let _ = null, I = null;
+const q = (e, t, n) => {
+  var a, o;
+  const s = h.value.find((i) => i.name === e);
+  s && ((o = (a = s.dom) == null ? void 0 : a.contentWindow) == null || o.postMessage({ type: t, data: n }, s.entry));
+}, re = (e, t) => {
+  var n;
+  (n = window.top) == null || n.postMessage({ type: e, data: t }, me.location.origin);
+}, at = () => {
+  I || (I || (I = {}), window.addEventListener(
     "message",
     (e) => {
-      e.data.type && console.log("initMainAppEventHandler", e.data);
-      const { type: t } = e.data || {};
-      if (u[t])
-        for (const a in u[t])
-          u[t][a](e.data);
+      const { type: t, source: n } = e.data || {};
+      if (n !== "react-devtools-content-script" && I[t])
+        for (const s in I[t])
+          I[t][s](e.data);
     },
     !1
-  );
-}, De = () => {
-  window.addEventListener(
+  ));
+}, st = () => {
+  _ || (_ || (_ = {}), window.addEventListener(
     "message",
     (e) => {
       const { type: t } = e.data || {};
-      if (d[t])
-        for (const a in d[t])
-          d[t][a](e.data);
+      if (_[t])
+        for (const n in _[t])
+          _[t][n](e.data);
     },
     !1
-  );
-}, G = (e, t) => {
-  const a = (/* @__PURE__ */ new Date()).getTime() + Math.random().toString(36).slice(-8);
-  return d[e] || (d[e] = {}), d[e][a] = t, {
-    removeEventListener: () => {
-      d[e] && d[e][a] && delete d[e][a];
+  ));
+}, ot = (e, t) => {
+  st();
+  const n = (/* @__PURE__ */ new Date()).getTime() + Math.random().toString(36).slice(-8);
+  return _[e] || (_[e] = {}), _[e][n] = t, {
+    remove: () => {
+      _[e] && _[e][n] && delete _[e][n];
     }
   };
-}, Te = (e, t) => {
-  const a = (/* @__PURE__ */ new Date()).getTime() + Math.random().toString(36).slice(-8);
-  return u[e] || (u[e] = {}), u[e][a] = t, {
-    removeEventListener: () => {
-      u[e] && u[e][a] && delete u[e][a];
+}, it = (e, t) => {
+  at();
+  const n = (/* @__PURE__ */ new Date()).getTime() + Math.random().toString(36).slice(-8);
+  return I[e] || (I[e] = {}), I[e][n] = t, {
+    remove: () => {
+      I[e] && I[e][n] && delete I[e][n];
     }
   };
-}, Ce = ["src", "name"], Re = /* @__PURE__ */ F({
+}, D = {
+  loadMicroApp: (e) => {
+    x.value = !0;
+    const t = h.value.find((i) => i.name === e), n = h.value.find((i) => i.actived), s = !!t, a = !(t != null && t.loaded), o = t == null ? void 0 : t.actived;
+    if (!s) {
+      n && (n.actived = !1);
+      return;
+    }
+    if (a) {
+      t.src = t.entry;
+      const i = h.value.find((r) => r.actived);
+      i && (i.actived = !1), t.loaded = !0, t.actived = !0;
+      return;
+    }
+    if (!o) {
+      n && (n.actived = !1), t.actived = !0;
+      return;
+    }
+  },
+  hideMicroApp: async (e) => {
+    x.value = !1;
+    const t = h.value.find((n) => n.name === e);
+    t && t.loaded && (t.dom || await new Promise((n) => R(() => t.dom, n)), q(e, "router", { cmd: "push", route: { name: "das-micro-app-ghost" } }));
+  },
+  hideAllMicroApp: () => {
+    x.value = !1, h.value.map((e) => {
+      e.actived = !1;
+    });
+  },
+  unloadMicroApp: (e) => {
+    x.value = !1;
+    const t = h.value.find((n) => n.name === e);
+    t && (t.loaded = !1, t.actived = !1);
+  },
+  unloadAllMicroApp: () => {
+    x.value = !1, h.value.map((e) => {
+      e.loaded = !1, e.actived = !1;
+    });
+  },
+  setMicroAppRoute: async (e, t) => {
+    const n = h.value.find((s) => s.name === e);
+    n && (!n.loaded || !n.actived || (n.dom || await new Promise((s) => R(() => n.dom, s)), q(e, "router", { cmd: "push", route: t })));
+  },
+  sendMessageToMicroApp: q,
+  sendMessageToMainApp: re,
+  addEventListenerFromMainApp: ot,
+  addEventListenerFromMicroApp: it,
+  setMainAppOverlay: (e, t) => {
+    re("bodyOverlay", { visible: e, style: t });
+  },
+  setMicroAppSessionStorage: async (e, t) => {
+    const n = h.value.find((s) => s.name === e);
+    n && (!n.loaded || !n.actived || (n.dom || await new Promise((s) => R(() => n.dom, s)), q(e, "sessionStorage", t)));
+  }
+}, rt = ["src", "name"], ct = /* @__PURE__ */ P({
   __name: "das-micro-app",
   props: {
     src: {},
     name: {},
-    actived: { type: Boolean },
-    fullPath: {}
+    actived: { type: Boolean }
   },
   emits: ["loaded"],
   setup(e, { emit: t }) {
-    const a = e, s = t, n = (l) => {
-      s("loaded", l);
-    }, r = A(() => a.actived), c = A(() => a.fullPath), o = (l, w) => {
-      X(a.name, "router", "push", l);
-    }, i = () => {
-    };
-    return N(() => c.value, o), N(() => r.value, i), (l, w) => (f(), S("iframe", {
+    const n = e, s = t, a = (r) => {
+      s("loaded", r);
+    }, o = l(() => n.actived);
+    return R(() => o.value, (r) => {
+      D.sendMessageToMicroApp(n.name, r ? "onActivated" : "onDeactivated");
+    }), (r, u) => (p(), w("iframe", {
       class: "das-micro-app",
-      src: a.src,
-      name: a.name,
+      src: n.src,
+      name: n.name,
       frameborder: "0",
-      onLoad: n
-    }, null, 40, Ce));
+      onLoad: a
+    }, null, 40, rt));
   }
-}), Ee = /* @__PURE__ */ K(Re, [["__scopeId", "data-v-0f040a01"]]), Qe = /* @__PURE__ */ F({
+}), lt = /* @__PURE__ */ J(ct, [["__scopeId", "data-v-76498068"]]), ut = /* @__PURE__ */ P({
+  __name: "das-micro-apps",
+  setup(e) {
+    const t = (n, s) => {
+      const a = h.value.find((o) => o.name === s);
+      a && (a.dom = n.target, D.sendMessageToMicroApp(s, "mainAppInfo", { location: { origin: window.location.origin } }));
+    };
+    return (n, s) => (p(!0), w(se, null, Ie(E(h), (a) => (p(), w(se, null, [
+      a.loaded ? z((p(), G(lt, {
+        key: 0,
+        src: a.src || "",
+        name: a.name,
+        actived: a.actived,
+        onLoaded: (o) => t(o, a.name)
+      }, null, 8, ["src", "name", "actived", "onLoaded"])), [
+        [Q, a.actived]
+      ]) : k("", !0)
+    ], 64))), 256));
+  }
+}), dt = /* @__PURE__ */ J(ut, [["__scopeId", "data-v-17151868"]]), kt = /* @__PURE__ */ P({
   __name: "das-main-app-layout",
   props: {
     transitionConfig: {}
   },
   setup(e) {
-    const t = e, a = H(), s = A(() => ({
+    const t = l(() => !x.value), n = e, s = l(() => ({
       "enter-active-class": "animate__animated animate__fadeInLeft",
-      ...t.transitionConfig || {}
-    })), n = async (c) => {
-      const o = m.value.find((y) => y.name === c), i = m.value.find((y) => y.actived), l = !!o, w = !(o != null && o.loaded), Y = o == null ? void 0 : o.actived;
-      if (!l) {
-        i && (i.actived = !1);
-        return;
-      }
-      const O = a.fullPath.replace(o.routerPrefix || "", "") || "/";
-      if (o.currentFullPath = O, w) {
-        const y = o.entry + O;
-        o.src = y;
-        const V = m.value.find((Z) => Z.actived);
-        V && (V.actived = !1), o.loaded = !0, o.actived = !0;
-        return;
-      }
-      if (!Y) {
-        i && (i.actived = !1), o.actived = !0;
-        return;
-      }
-    }, r = (c, o) => {
-      const i = m.value.find((l) => l.name === o);
-      i && (i.dom = c.target, X(o, "mainAppInfo", "location", { origin: window.location.origin }));
-    };
-    return N(
-      () => a.fullPath,
-      () => {
-        var c;
-        n(String(((c = a.meta) == null ? void 0 : c.microAppName) || ""));
-      }
-    ), (c, o) => (f(), g(U, { "transition-config": s.value }, {
-      header: p(() => [
-        v(c.$slots, "header")
+      ...n.transitionConfig || {}
+    }));
+    return (a, o) => (p(), G(E(ue), {
+      "transition-config": s.value,
+      "router-view-visible": t.value
+    }, {
+      header: L(() => [
+        T(a.$slots, "header", {}, () => [
+          y(E(Ye))
+        ])
       ]),
-      aside: p(() => [
-        v(c.$slots, "aside")
+      aside: L(() => [
+        T(a.$slots, "aside", {}, () => [
+          y(E(et))
+        ])
       ]),
-      tab: p(() => [
-        v(c.$slots, "tab")
+      tab: L(() => [
+        T(a.$slots, "tab", {}, () => [
+          y(E(nt))
+        ])
       ]),
-      "micro-app": p(() => [
-        (f(!0), S(ae, null, ne(x(m), (i) => (f(), g(D, T(C(s.value)), {
-          default: p(() => [
-            i.loaded ? P((f(), g(Ee, {
-              key: 0,
-              src: i.src || i.entry,
-              name: i.name,
-              "full-path": i.currentFullPath,
-              onLoaded: (l) => r(l, i.name)
-            }, null, 8, ["src", "name", "full-path", "onLoaded"])), [
-              [E, i.actived]
-            ]) : R("", !0)
-          ]),
-          _: 2
-        }, 1040))), 256))
+      default: L(() => [
+        y(dt)
       ]),
       _: 3
-    }, 8, ["transition-config"]));
+    }, 8, ["transition-config", "router-view-visible"]));
   }
-}), xe = {};
-function Ne(e, t) {
+}), mt = {};
+function vt(e, t) {
   return null;
 }
-const ke = /* @__PURE__ */ K(xe, [["render", Ne]]), Fe = (e, t) => {
-  e != null && e.microApps && (m.value = [], e.microApps.map((a) => {
-    const s = (e == null ? void 0 : e.microAppRouterPrefix) || `/${a.name}`, n = a.entry || `//${a.name}`;
-    t == null || t.addRoute({
-      name: a.name,
-      path: `${s}/:pathMatch(.*)*`,
-      component: ke,
-      meta: {
-        isMicroApp: !0,
-        microAppName: a.name
-      }
-    }), m.value.push({
-      ...a,
-      entry: n,
-      routerPrefix: s
-    });
-  }), Pe(), Te("router", (a) => {
-    var o;
-    const { cmd: s, data: n } = a;
-    let r = {};
-    typeof n == "string" ? r.path = n : r = n;
-    const c = (e == null ? void 0 : e.microAppRouterPrefix) || `/${r.meta.microAppName}`;
-    r.path = `${c}${r.path}`, (o = t == null ? void 0 : t[s]) == null || o.call(t, r);
-  }));
-}, Se = (e, t) => {
-  if (e != null && e.microAppName && (De(), G("router", (a) => {
-    var c;
-    const { cmd: s, data: n } = a;
-    let r = {};
-    typeof n == "string" ? r.path = n : r = n, r.query = { ...r.query || {}, changeFromMainApp: !0 }, (c = t == null ? void 0 : t[s]) == null || c.call(t, r);
-  }), G("mainAppInfo", (a) => {
-    const { cmd: s, data: n } = a;
-    Q[s] = n;
-  }), t)) {
-    let a = !0;
-    t.afterEach((s) => {
-      if (a) {
-        a = !1;
-        return;
-      }
-      s.query.changeFromMainApp || Ie("router", "push", {
-        path: s.path,
-        params: s.params,
-        query: s.query,
-        // @ts-ignore
-        meta: { ...s.meta, microAppName: e == null ? void 0 : e.microAppName }
-      });
-    });
-  }
-}, Be = (e) => {
-  var r, c;
-  const t = ((r = e == null ? void 0 : e.router) == null ? void 0 : r.options) || {}, s = [...Object.values(((c = e == null ? void 0 : e.router) == null ? void 0 : c.glob) || []).map((o) => o.default).filter((o) => !!o).flat().sort((o, i) => (o.index ?? 0) - (i.index ?? 0)), ...(e == null ? void 0 : e.routes) || []];
-  return { router: re({ history: ce(), routes: s, ...t }) };
-}, Ke = {
+const ve = /* @__PURE__ */ J(mt, [["render", vt]]), ft = (e, t) => {
+  if (!(e != null && e.microApps))
+    return;
+  const { microAppRouterPrefix: n = "/das-micro-app" } = e || {};
+  h.value = e.microApps || [], t == null || t.addRoute({
+    name: "das-micro-app",
+    path: `${n}/:pathMatch(.*)*`,
+    component: ve,
+    meta: { isMicroApp: !0, keepAlive: !0 }
+  }), D.addEventListenerFromMicroApp("bodyOverlay", (s) => {
+    const { visible: a, style: o } = s.data;
+    f.overlay.set(a, o);
+  });
+}, pt = (e, t) => {
+  if (!(e != null && e.microAppName))
+    return;
+  const n = "das-micro-app-ghost";
+  t == null || t.addRoute({
+    name: n,
+    path: `/${n}/:pathMatch(.*)*`,
+    component: ve,
+    meta: { isMicroApp: !0, keepAlive: !0 }
+  }), D.addEventListenerFromMainApp("router", (s) => {
+    var i;
+    const { cmd: a, route: o } = s.data;
+    (i = t == null ? void 0 : t[a]) == null || i.call(t, o);
+  }), D.addEventListenerFromMainApp("onDeactivated", (s) => {
+    const { path: a, params: o = {}, query: i = {} } = t.currentRoute.value;
+    t == null || t.push({ name: n, query: { fromQuery: { ...i }, fromPath: a }, params: o });
+  }), D.addEventListenerFromMainApp("onActivated", (s) => {
+    const { params: a = {}, query: o = {} } = t.currentRoute.value, { fromPath: i = "", fromQuery: r = {} } = o || {};
+    t == null || t.push({ path: i, query: r, params: a });
+  }), D.addEventListenerFromMainApp("mainAppInfo", (s) => {
+    const { data: a } = s;
+    for (const o in a)
+      me[o] = a[o];
+  }), D.addEventListenerFromMainApp("sessionStorage", (s) => {
+    const { cmd: a, data: o = [] } = s.data;
+    if (a === "setItem")
+      for (const i of o)
+        sessionStorage.setItem(i.key, i.value);
+    if (a === "getItem")
+      for (const i of o)
+        sessionStorage.getItem(i.key || i);
+    if (a === "clear" && sessionStorage.clear(), a === "clear")
+      for (const i of o)
+        sessionStorage.removeItem(i.key || i);
+  });
+}, gt = (e) => {
+  var o, i;
+  const t = ((o = e == null ? void 0 : e.router) == null ? void 0 : o.options) || {}, s = Object.values(((i = e == null ? void 0 : e.router) == null ? void 0 : i.glob) || []).map((r) => r.default).filter((r) => !!r).flat().sort((r, u) => (r.index ?? 0) - (u.index ?? 0)).map((r) => {
+    const u = r.meta || {};
+    return u.keepAlive = u.keepAlive ?? e.keepAlive ?? !0, { ...r, meta: u };
+  });
+  return { router: Le({ history: we(), routes: s, ...t }) };
+}, ht = {
   install: (e, t) => {
     var s;
-    const a = (s = t == null ? void 0 : t.plugins) == null ? void 0 : s.glob;
-    a && Object.values(a).sort((n, r) => (n.index ?? 0) - (r.index ?? 0)).forEach((n) => {
-      n.default && n.default.install && e.use(n.default, t);
+    const n = (s = t == null ? void 0 : t.plugins) == null ? void 0 : s.glob;
+    n && Object.values(n).sort((a, o) => (a.index ?? 0) - (o.index ?? 0)).forEach((a) => {
+      a.default && a.default.install && e.use(a.default, t);
     });
   }
-}, Ue = (e) => {
-  e || (e = {});
-  const t = b(!0);
-  Promise.all([de(e), fe(e)]).then(() => {
+}, bt = () => window.config || {}, Dt = (e) => {
+  e || (e = {}), e = { ...e, ...bt() };
+  const t = A(!0);
+  Promise.all([$e(e), Pe(e)]).then(() => {
     t.value = !1;
   });
-  const { container: a, component: s, props: n } = (e == null ? void 0 : e.root) || {}, r = se(s || U, n);
-  r.use(Ke, e);
-  const { router: c } = Be(e);
-  return e.microApps && e.microApps.length > 0 && Fe(e, c), e.microAppName && Se(e, c), r.use(c), r.mount(a || "#app"), { app: r, router: c, loading: t };
+  const { container: n, component: s, props: a } = (e == null ? void 0 : e.root) || {}, o = Ae(s || ue, a);
+  o.use(ht, e);
+  const { router: i } = gt(e);
+  return e.microApps && e.microApps.length > 0 && ft(e, i), e.microAppName && pt(e, i), o.use(i), o.mount(n || "#app"), { app: o, router: i, loading: t };
 };
 export {
-  Qe as DasMainAppLayout,
-  U as DasWebLayout,
-  G as addEventListenerFromMainApp,
-  Te as addEventListenerFromMicroApp,
-  Ue as createDasWebApp,
-  B as currentLang,
-  _ as currentTheme,
-  he as getI18nRule,
-  ze as getLang,
-  Je as getMicroAppRouterPath,
-  ue as getThemeRule,
-  je as getVar,
-  qe as getVarValue,
-  pe as i18n,
-  fe as initI18n,
-  Fe as initMainApp,
-  Pe as initMainAppEventHandler,
-  Se as initMicroApp,
-  De as initMicroAppEventHandler,
-  de as initTheme,
-  Ie as sendMessageToMainApp,
-  X as sendMessageToMicroApp,
-  q as setI18nRule,
-  He as setLang,
-  We as setTheme,
-  j as setThemeRule,
-  Ge as t
+  kt as DasMainAppLayout,
+  ue as DasWebLayout,
+  et as DasWebMenu,
+  Ye as DasWebNav,
+  nt as DasWebTabs,
+  Dt as createDasWebApp,
+  ee as currentLang,
+  F as currentTheme,
+  Se as getI18nRule,
+  Tt as getLang,
+  Re as getThemeRule,
+  Lt as getVar,
+  wt as getVarValue,
+  je as i18n,
+  Pe as initI18n,
+  ft as initMainApp,
+  pt as initMicroApp,
+  $e as initTheme,
+  f as layout,
+  D as microFrontend,
+  ie as setI18nRule,
+  Ct as setLang,
+  yt as setTheme,
+  oe as setThemeRule,
+  Mt as t
 };