aibox-custom-component-packages 0.0.7 → 0.0.9

package/es/CustomSidebar.mjs

@@ -1,712 +1,2 @@
-import { w as $ } from "./chunks/index.bCzIhWFw.js";
-import { createElementBlock as p, openBlock as s, createVNode as y, createElementVNode as d, createBlock as g, createCommentVNode as I, unref as u, withCtx as m, normalizeStyle as k, toDisplayString as x, resolveDynamicComponent as T, ref as A, watch as B, nextTick as D, normalizeClass as w, withModifiers as K, computed as W, Fragment as C, renderList as H, Transition as V, withDirectives as Y, vShow as G } from "vue";
-import { ElIcon as O, ElAutoResizer as q, ElTreeV2 as J } from "element-plus";
-import { AiboxIcon as Q } from "color-message-aibox-vue";
-import { _ as N } from "./chunks/_plugin-vue_export-helper.CHgC5LLL.js";
-import { IconRenderer as X, iconLibraryMap as Z } from "color-star-custom-components";
-import './assets/CustomSidebar.css';const _ = { class: "nav-title overflow-hidden" }, ee = /* @__PURE__ */ Object.assign({
-  name: "NavTitle"
-}, {
-  __name: "NavTitle",
-  props: {
-    // 标题文本
-    title: {
-      type: String,
-      default: ""
-    },
-    // 头部图标尺寸
-    logoSize: {
-      type: Number,
-      default: 30
-    },
-    // 标题样式
-    titleStyle: {
-      type: Object,
-      default: () => ({ fontSize: "16px" })
-    },
-    // 是否显示折叠按钮
-    showToggle: {
-      type: Boolean,
-      default: !0
-    },
-    // 折叠按钮图标
-    toggleIcon: {
-      type: [Object, String],
-      default: null
-    }
-  },
-  emits: ["toggle"],
-  setup(e, { emit: n }) {
-    const t = n, o = () => {
-      t("toggle");
-    };
-    return (l, h) => (s(), p("div", _, [
-      y(u(O), { size: e.logoSize }, {
-        default: m(() => [
-          y(u(Q))
-        ]),
-        _: 1
-      }, 8, ["size"]),
-      d("span", {
-        class: "weight-500 text-1f2329 title-text",
-        style: k(e.titleStyle)
-      }, x(e.title), 5),
-      e.showToggle ? (s(), g(u(O), {
-        key: 0,
-        size: 18,
-        class: "collapse-unfold-icon",
-        onClick: o
-      }, {
-        default: m(() => [
-          (s(), g(T(e.toggleIcon)))
-        ]),
-        _: 1
-      })) : I("", !0)
-    ]));
-  }
-}), te = /* @__PURE__ */ N(ee, [["__scopeId", "data-v-384d20d1"]]), M = {
-  DIR: "DIR",
-  // 目录
-  MENU: "MENU",
-  // 菜单
-  BUTTON: "BUTTON"
-  // 按钮
-}, ne = /* @__PURE__ */ new Map([
-  ["active", "#3271FE"],
-  ["parent_active", "#3271FE"],
-  ["normal", "#1F2329"]
-]), oe = (e, n) => !Array.isArray(e) || !n ? !1 : e.some((t) => t.path === n ? !0 : t.children?.length > 0 ? oe(t.children, n) : !1), le = (e, n = 1) => e.filter((o) => [M.DIR, M.MENU].includes(o.type)).map((o) => ({
-  ...o,
-  id: o.bnid,
-  name: o.name,
-  path: o?.path || "",
-  children: o.children?.length > 0 ? le(o.children || [], n + 1) : [],
-  level: n
-})), ie = (e, n) => e?.children?.length ? e.children.some(
-  (t) => t?.path === n || t.children?.length && ie(t, n)
-) : !1, z = (e, n) => e?.children?.length ? e.children.some(
-  (t) => t?.id === n || t.children?.length && z(t, n)
-) : !1, re = (e, n) => {
-  const t = e?.id === n, o = z(e, n);
-  let l = "normal";
-  return t ? l = "active" : o && (l = "parent_active"), ne.get(l);
-}, $e = (e, n) => e.includes(n) ? e : [...e, n], Be = (e, n) => e.filter((t) => t !== n), se = (e, n, t = []) => e.some((o) => {
-  if (o?.path === n)
-    return !0;
-  if (o.children?.length > 0) {
-    t.push(o.id);
-    const l = se(o.children, n, t);
-    return l || t.pop(), l;
-  }
-  return !1;
-}), U = (e, n, t = []) => e.some((o) => {
-  if (o?.id === n)
-    return !0;
-  if (o.children?.length > 0) {
-    t.push(o.id);
-    const l = U(o.children, n, t);
-    return l || t.pop(), l;
-  }
-  return !1;
-}), De = (e, n) => {
-  const t = [];
-  return U(e, n, t), t;
-}, ae = (e, n) => {
-  if (!Array.isArray(e) || !n) return null;
-  for (const t of e) {
-    if (t.path === n)
-      return t;
-    if (t.children?.length > 0) {
-      const o = ae(t.children, n);
-      if (o) return o;
-    }
-  }
-  return null;
-}, ce = (e) => Array.isArray(e) ? e.map((n) => {
-  const t = { ...n };
-  return t.children && Array.isArray(t.children) && t.children.length > 0 ? t.children = ce(t.children) : t.isLeaf = !0, t;
-}) : [], ue = (e) => {
-  if (!Array.isArray(e) || e.length === 0) return null;
-  for (const n of e) {
-    if (n.isLeaf && n.path)
-      return n;
-    if (n.children?.length > 0) {
-      const t = ue(n.children);
-      if (t) return t;
-    }
-  }
-  return null;
-}, Ke = ["/404", "/login", "/unauthorized"], j = {
-  label: "name",
-  children: "children",
-  isLeaf: "isLeaf"
-}, P = {
-  PARENT: "parent",
-  LEAF: "leaf"
-}, We = {
-  LOADING: "loading",
-  LOADED: "loaded",
-  ERROR: "error"
-}, v = {
-  POPUP: "popup",
-  FOOTER: "footer"
-}, de = { class: "node-label" }, fe = ["onClick"], pe = /* @__PURE__ */ Object.assign({
-  name: "MenuList"
-}, {
-  __name: "MenuList",
-  props: {
-    // 菜单数据（已处理好的树形结构）
-    menuData: {
-      type: Array,
-      default: () => []
-    },
-    // 当前选中的菜单ID
-    currentMenuId: {
-      type: String,
-      default: null
-    },
-    // 展开的节点ID数组
-    expandedKeys: {
-      type: Array,
-      default: () => []
-    },
-    // 树形组件配置
-    treeProps: {
-      type: Object,
-      default: () => j
-    },
-    // 菜单项高度
-    itemHeight: {
-      type: Number,
-      default: 36
-    },
-    // 缩进距离
-    indent: {
-      type: Number,
-      default: 24
-    },
-    // 图标大小
-    iconSize: {
-      type: Number,
-      default: 16
-    },
-    // 菜单选中背景色
-    selectMenuBg: {
-      type: String,
-      default: "#eaf0fe"
-    },
-    // 展开图标组件
-    expandedIcon: {
-      type: [Object, String],
-      default: null
-    },
-    // 收起图标组件
-    collapsedIcon: {
-      type: [Object, String],
-      default: null
-    }
-    // 图标渲染器组件（可选）
-    // iconRenderer: {
-    //   type: [Object, String],
-    //   default: null,
-    // },
-    // // 图标库配置
-    // iconLibrary: {
-    //   type: [String, Object],
-    //   default: null,
-    // },
-  },
-  emits: ["node-click", "node-expand", "node-collapse"],
-  setup(e, { emit: n }) {
-    const t = e, o = n, l = A(null), h = (r) => r?.icon && r.level === 1 || !r.isLeaf, c = (r) => re(r, t.currentMenuId), b = (r) => {
-      const E = r.isLeaf ? P.LEAF : P.PARENT;
-      o("node-click", r, E);
-    }, a = (r) => {
-      o("node-expand", r.id, r);
-    }, i = (r) => {
-      o("node-collapse", r.id, r);
-    }, S = (r) => {
-      if (!l.value) return;
-      t.expandedKeys.includes(r.data.id) ? l.value.collapseNode(r) : l.value.expandNode(r);
-    };
-    return B(
-      () => t.expandedKeys,
-      (r) => {
-        D(() => {
-          l.value && l.value.setExpandedKeys([...r]);
-        });
-      },
-      { deep: !0 }
-    ), (r, E) => (s(), g(u(q), { class: "flex-1 overflow-hidden" }, {
-      default: m(({ height: F }) => [
-        y(u(J), {
-          ref_key: "treeRef",
-          ref: l,
-          "node-key": "id",
-          data: e.menuData,
-          props: e.treeProps,
-          height: F,
-          "current-node-key": e.currentMenuId,
-          "highlight-current": !0,
-          "expanded-keys": e.expandedKeys,
-          "show-checkbox": !1,
-          "item-size": e.itemHeight + 8,
-          "expand-on-click-node": !1,
-          indent: e.indent,
-          style: k({ "--select-menu-bg": e.selectMenuBg }),
-          onNodeClick: b,
-          onNodeExpand: a,
-          onNodeCollapse: i,
-          class: "custom-tree"
-        }, {
-          default: m(({ node: L, data: f }) => [
-            d("div", {
-              class: w(["tree-node-content-custom", {
-                "has-children": !f.isLeaf,
-                "is-current": f.id === e.currentMenuId && f.isLeaf,
-                "is-parent-active": u(z)(f, e.currentMenuId) && !f.isLeaf
-              }])
-            }, [
-              h(f) ? (s(), g(u(O), {
-                key: 0,
-                size: e.iconSize,
-                class: "node-icon",
-                color: c(f)
-              }, {
-                default: m(() => [
-                  y(u(X), {
-                    "icon-name": f?.icon,
-                    "icon-library": u(Z).aibox
-                  }, null, 8, ["icon-name", "icon-library"])
-                ]),
-                _: 2
-              }, 1032, ["size", "color"])) : I("", !0),
-              d("span", de, x(L.label), 1),
-              f.isLeaf ? I("", !0) : (s(), p("div", {
-                key: 1,
-                class: "expand-arrow",
-                onClick: K((Le) => S(L), ["stop"])
-              }, [
-                y(u(O), {
-                  size: e.iconSize,
-                  color: c(f)
-                }, {
-                  default: m(() => [
-                    (s(), g(T(e.expandedKeys.includes(f.id) ? e.expandedIcon : e.collapsedIcon)))
-                  ]),
-                  _: 2
-                }, 1032, ["size", "color"])
-              ], 8, fe))
-            ], 2)
-          ]),
-          _: 1
-        }, 8, ["data", "props", "height", "current-node-key", "expanded-keys", "item-size", "indent", "style"])
-      ]),
-      _: 1
-    }));
-  }
-}), ye = /* @__PURE__ */ N(pe, [["__scopeId", "data-v-c047074f"]]), he = { class: "user-info-card__avatar" }, me = { class: "user-info-card__avatar-text" }, ge = { class: "user-info-card__details" }, ve = { class: "user-info-card__name" }, Ie = {
-  key: 0,
-  class: "user-info-card__bnid"
-}, be = /* @__PURE__ */ Object.assign({
-  name: "UserInfoCard"
-}, {
-  __name: "UserInfoCard",
-  props: {
-    // 用户信息对象
-    userInfo: {
-      type: Object,
-      default: () => ({})
-    },
-    // 展示类型：USER_INFO_CARD_TYPES.POPUP | USER_INFO_CARD_TYPES.FOOTER
-    type: {
-      type: String,
-      default: v.POPUP,
-      validator: (e) => Object.values(v).includes(e)
-    }
-  },
-  setup(e) {
-    const n = e, t = W(() => n.userInfo?.name?.charAt(0)?.toUpperCase() || "");
-    return (o, l) => (s(), p("div", {
-      class: w(["user-info-card", `user-info-card--${e.type}`])
-    }, [
-      d("div", he, [
-        d("span", me, x(t.value), 1)
-      ]),
-      d("div", ge, [
-        d("div", ve, x(e.userInfo?.name || ""), 1),
-        e.type === u(v).POPUP ? (s(), p("div", Ie, x(e.userInfo?.bnid || e.userInfo?.id || ""), 1)) : I("", !0)
-      ])
-    ], 2));
-  }
-}), R = /* @__PURE__ */ N(be, [["__scopeId", "data-v-2ddc6d4a"]]), xe = { class: "user-popup-content" }, Ne = ["onClick"], Se = /* @__PURE__ */ Object.assign({
-  name: "UserPopup"
-}, {
-  __name: "UserPopup",
-  props: {
-    // 操作列表配置
-    actions: {
-      type: Array,
-      default: () => [],
-      validator: (e) => e.every((n) => n.key && (n.icon || n.iconName))
-    },
-    // 用户信息
-    userInfo: {
-      type: Object,
-      default: () => ({})
-    },
-    // 是否显示用户信息卡片
-    showUserInfo: {
-      type: Boolean,
-      default: !0
-    }
-  },
-  emits: ["action-click"],
-  setup(e, { emit: n }) {
-    const t = n, o = (l) => {
-      t("action-click", l.key, l);
-    };
-    return (l, h) => (s(), p("div", xe, [
-      e.showUserInfo ? (s(), g(R, {
-        key: 0,
-        userInfo: e.userInfo,
-        type: u(v).POPUP,
-        class: "user-info-card"
-      }, null, 8, ["userInfo", "type"])) : I("", !0),
-      d("div", {
-        class: w({
-          "popup-list": e.showUserInfo
-        })
-      }, [
-        (s(!0), p(C, null, H(e.actions, (c, b) => (s(), p(C, { key: b }, [
-          c.hidden ? I("", !0) : (s(), p("div", {
-            key: 0,
-            class: "list__item",
-            onClick: (a) => o(c)
-          }, [
-            y(u(O), {
-              class: "list__item-icon",
-              size: c.iconSize || 20,
-              color: "#262626"
-            }, {
-              default: m(() => [
-                (s(), g(T(c.icon), {
-                  size: c.iconSize || 20
-                }, null, 8, ["size"]))
-              ]),
-              _: 2
-            }, 1032, ["size"]),
-            d("span", null, x(c.label), 1)
-          ], 8, Ne))
-        ], 64))), 128))
-      ], 2)
-    ]));
-  }
-}), Oe = /* @__PURE__ */ N(Se, [["__scopeId", "data-v-be7ee388"]]), ke = { class: "navbar-box__footer__left" }, Ee = /* @__PURE__ */ Object.assign({
-  name: "NavFooter"
-}, {
-  __name: "NavFooter",
-  props: {
-    // 用户信息
-    userInfo: {
-      type: Object,
-      default: null,
-      validator: (e) => e ? e.name !== void 0 : !0
-    },
-    // 用户操作列表
-    actions: {
-      type: Array,
-      default: () => []
-    },
-    // 弹窗显示延迟（毫秒）
-    popupDelay: {
-      type: Number,
-      default: 200
-    },
-    // 弹窗左侧位置（像素）
-    popupLeft: {
-      type: Number,
-      default: 240
-    },
-    navFooterWidth: {
-      type: Number,
-      default: 240
-    },
-    // 底栏用户信息卡片展示类型
-    userInfoCardType: {
-      type: String,
-      default: v.FOOTER,
-      validator: (e) => Object.values(v).includes(e)
-    },
-    // 是否在弹窗中显示用户信息卡片
-    showPopupUserInfo: {
-      type: Boolean,
-      default: !0
-    }
-  },
-  emits: ["action-click"],
-  setup(e, { emit: n }) {
-    const t = e, o = n, l = A(null), h = A(!1), c = (a) => {
-      a || (l.value = setTimeout(() => {
-        h.value = !1;
-      }, t.popupDelay)), a && (h.value = a, clearTimeout(l.value));
-    }, b = (a, i) => {
-      h.value = !1, o("action-click", a, i);
-    };
-    return (a, i) => (s(), p(C, null, [
-      e.userInfo ? (s(), p("div", {
-        key: 0,
-        class: "navbar-box__footer flex items-center",
-        style: k({ width: e.navFooterWidth + "px" }),
-        onMouseenter: i[0] || (i[0] = (S) => c(!0)),
-        onMouseleave: i[1] || (i[1] = (S) => c(!1))
-      }, [
-        d("div", ke, [
-          y(R, {
-            userInfo: e.userInfo,
-            type: e.userInfoCardType
-          }, null, 8, ["userInfo", "type"])
-        ])
-      ], 36)) : I("", !0),
-      y(V, { name: "fade" }, {
-        default: m(() => [
-          Y(d("div", {
-            class: "footer-popup content-bg",
-            style: k({ left: e.popupLeft + "px" }),
-            onMouseenter: i[2] || (i[2] = (S) => c(!0)),
-            onMouseleave: i[3] || (i[3] = (S) => c(!1))
-          }, [
-            y(Oe, {
-              actions: e.actions,
-              userInfo: e.userInfo,
-              showUserInfo: e.showPopupUserInfo,
-              onActionClick: b
-            }, null, 8, ["actions", "userInfo", "showUserInfo"])
-          ], 36), [
-            [G, h.value]
-          ])
-        ]),
-        _: 1
-      })
-    ], 64));
-  }
-}), Ae = /* @__PURE__ */ N(Ee, [["__scopeId", "data-v-2b4a0a2b"]]), Ce = { class: "sidebar flex h-full flex-col" }, Te = { class: "flex-1 overflow-hidden flex flex-col pd-l-12 pd-r-12" }, we = /* @__PURE__ */ Object.assign({
-  name: "CustomSidebar"
-}, {
-  __name: "layout",
-  props: {
-    // ========== 菜单数据 ==========
-    // 菜单树数据（已处理好的树形结构）
-    menuData: {
-      type: Array,
-      default: () => []
-    },
-    // 当前选中的菜单ID
-    currentMenuId: {
-      type: String,
-      default: null
-    },
-    // 展开的节点ID数组
-    expandedKeys: {
-      type: Array,
-      default: () => []
-    },
-    // ========== 头部配置 ==========
-    // 标题文本
-    title: {
-      type: String,
-      default: ""
-    },
-    // 是否显示折叠按钮
-    showToggle: {
-      type: Boolean,
-      default: !0
-    },
-    // 折叠按钮图标
-    toggleIcon: {
-      type: [Object, String],
-      default: null
-    },
-    // ========== 菜单配置 ==========
-    // 树形组件配置
-    treeProps: {
-      type: Object,
-      default: () => j
-    },
-    // 菜单项高度
-    itemHeight: {
-      type: Number,
-      default: 36
-    },
-    // 缩进距离
-    indent: {
-      type: Number,
-      default: 24
-    },
-    // 图标大小
-    iconSize: {
-      type: Number,
-      default: 16
-    },
-    // 菜单选中背景色
-    selectMenuBg: {
-      type: String,
-      default: "#eaf0fe"
-    },
-    // 标题样式
-    titleStyle: {
-      type: Object,
-      default: () => ({ fontSize: "16px" })
-    },
-    // 展开图标组件
-    expandedIcon: {
-      type: [Object, String],
-      default: null
-    },
-    // 收起图标组件
-    collapsedIcon: {
-      type: [Object, String],
-      default: null
-    },
-    // 图标渲染器组件
-    iconRenderer: {
-      type: [Object, String],
-      default: null
-    },
-    // 图标库配置
-    iconLibrary: {
-      type: [String, Object],
-      default: null
-    },
-    // ========== 底部配置 ==========
-    // 是否显示底部
-    showFooter: {
-      type: Boolean,
-      default: !0
-    },
-    // 用户信息
-    userInfo: {
-      type: Object,
-      default: null
-    },
-    // 用户操作列表
-    userActions: {
-      type: Array,
-      default: () => []
-    },
-    // 弹窗显示延迟
-    popupDelay: {
-      type: Number,
-      default: 200
-    },
-    // 弹窗左侧位置（像素）
-    popupLeft: {
-      type: Number,
-      default: 240
-    },
-    navFooterWidth: {
-      type: Number,
-      default: 240
-    },
-    // 底栏用户信息卡片展示类型
-    userInfoCardType: {
-      type: String,
-      default: v.FOOTER,
-      validator: (e) => Object.values(v).includes(e)
-    },
-    // 是否在弹窗中显示用户信息卡片
-    showPopupUserInfo: {
-      type: Boolean,
-      default: !0
-    },
-    // Logo 尺寸
-    logoSize: {
-      type: Number,
-      default: 30
-    }
-  },
-  emits: [
-    "toggle",
-    "node-click",
-    "node-expand",
-    "node-collapse",
-    "user-action-click"
-  ],
-  setup(e, { emit: n }) {
-    const t = n, o = () => {
-      t("toggle");
-    }, l = (a, i) => {
-      t("node-click", a, i);
-    }, h = (a, i) => {
-      t("node-expand", a, i);
-    }, c = (a, i) => {
-      t("node-collapse", a, i);
-    }, b = (a, i) => {
-      t("user-action-click", a, i);
-    };
-    return (a, i) => (s(), p("div", Ce, [
-      d("div", Te, [
-        y(te, {
-          "title-style": e.titleStyle,
-          title: e.title,
-          "logo-size": e.logoSize,
-          "show-toggle": e.showToggle,
-          "toggle-icon": e.toggleIcon,
-          onToggle: o
-        }, null, 8, ["title-style", "title", "logo-size", "show-toggle", "toggle-icon"]),
-        y(ye, {
-          "menu-data": e.menuData,
-          "current-menu-id": e.currentMenuId,
-          "expanded-keys": e.expandedKeys,
-          "tree-props": e.treeProps,
-          "item-height": e.itemHeight,
-          indent: e.indent,
-          "icon-size": e.iconSize,
-          "select-menu-bg": e.selectMenuBg,
-          "expanded-icon": e.expandedIcon,
-          "collapsed-icon": e.collapsedIcon,
-          "icon-renderer": e.iconRenderer,
-          "icon-library": e.iconLibrary,
-          onNodeClick: l,
-          onNodeExpand: h,
-          onNodeCollapse: c
-        }, null, 8, ["menu-data", "current-menu-id", "expanded-keys", "tree-props", "item-height", "indent", "icon-size", "select-menu-bg", "expanded-icon", "collapsed-icon", "icon-renderer", "icon-library"])
-      ]),
-      e.showFooter ? (s(), g(Ae, {
-        key: 0,
-        "popup-left": e.popupLeft,
-        "user-info": e.userInfo,
-        actions: e.userActions,
-        "popup-delay": e.popupDelay,
-        "nav-footer-width": e.navFooterWidth,
-        "user-info-card-type": e.userInfoCardType,
-        "show-popup-user-info": e.showPopupUserInfo,
-        onActionClick: b
-      }, null, 8, ["popup-left", "user-info", "actions", "popup-delay", "nav-footer-width", "user-info-card-type", "show-popup-user-info"])) : I("", !0)
-    ]));
-  }
-}), ze = /* @__PURE__ */ N(we, [["__scopeId", "data-v-9caa952a"]]), He = $(ze);
-export {
-  He as CustomSidebar,
-  ne as MENU_COLOR_STRATEGY,
-  We as MENU_LOADING_STATES,
-  M as MENU_TYPE,
-  P as NODE_CLICK_TYPES,
-  Ke as SPECIAL_ROUTES,
-  j as TREE_PROPS,
-  v as USER_INFO_CARD_TYPES,
-  Be as collapseNodeKeys,
-  He as default,
-  $e as expandNodeKeys,
-  se as findExpandPath,
-  U as findExpandPathById,
-  ae as findMenuByPath,
-  ue as getFirstLeafMenu,
-  re as getMenuIconColorById,
-  De as getParentNodeIdsById,
-  z as isParentMenuActive,
-  ie as isParentRouteActive,
-  oe as isPathInMenu,
-  ce as processMenuTreeWithLeaf,
-  le as transformMenuData
-};
+import { _ as e, a as t, b as n, c as r, d as i, f as a, g as o, h as s, i as c, l, m as u, n as d, o as f, p, r as m, s as h, t as g, u as _, v, x as y, y as b } from "./chunks/CustomSidebar.BSGAhmVY.js";
+export { g as CustomSidebar, g as default, h as MENU_COLOR_STRATEGY, d as MENU_LOADING_STATES, r as MENU_TYPE, m as NODE_CLICK_TYPES, c as SPECIAL_ROUTES, t as TREE_PROPS, f as USER_INFO_CARD_TYPES, l as collapseNodeKeys, _ as expandNodeKeys, i as findExpandPath, a as findExpandPathById, p as findMenuByPath, u as getFirstLeafMenu, s as getMenuIconColorById, o as getParentNodeIdsById, e as isParentMenuActive, v as isParentRouteActive, b as isPathInMenu, n as processMenuTreeWithLeaf, y as transformMenuData };