@keyblade/pro-components 1.4.5 → 1.5.0

package/es/pro-reuse-tabs/pro-reuse-tabs.vue.js

@@ -1,53 +1,46 @@
-import { defineComponent, computed, resolveComponent, openBlock, createElementBlock, normalizeClass, createVNode, withCtx, Fragment, renderList, createBlock } from "vue";
-const prefixClsName = "keyblade-pro-reuse-tabs";
-const _sfc_main = /* @__PURE__ */ defineComponent({
+import { defineComponent as p, computed as k, resolveComponent as c, openBlock as a, createElementBlock as l, normalizeClass as y, createVNode as _, withCtx as f, Fragment as v, renderList as C, createBlock as h } from "vue";
+const g = "keyblade-pro-reuse-tabs", B = /* @__PURE__ */ p({
   __name: "pro-reuse-tabs",
   props: {
     tabs: {
       type: Array,
-      required: true,
+      required: !0,
       default: () => []
     }
   },
   emits: {
-    "tab-click": (key) => true,
-    "tab-delete": (key) => true
+    "tab-click": (t) => !0,
+    "tab-delete": (t) => !0
   },
-  setup(__props, { emit }) {
-    const props = __props;
-    const activeKey = computed(() => {
-      var _a;
-      return ((_a = props.tabs.find((v) => v.active)) == null ? void 0 : _a.name) ?? void 0;
-    });
-    const onTabClick = (key) => {
-      emit("tab-click", String(key));
+  setup(t, { emit: n }) {
+    const s = t, i = k(() => {
+      var e;
+      return ((e = s.tabs.find((o) => o.active)) == null ? void 0 : e.name) ?? void 0;
+    }), d = (e) => {
+      n("tab-click", String(e));
+    }, u = (e) => {
+      n("tab-delete", String(e));
     };
-    const onTabDelete = (key) => {
-      emit("tab-delete", String(key));
-    };
-    return (_ctx, _cache) => {
-      const _component_a_tab_pane = resolveComponent("a-tab-pane");
-      const _component_a_tabs = resolveComponent("a-tabs");
-      return openBlock(), createElementBlock("div", {
-        class: normalizeClass(prefixClsName)
+    return (e, o) => {
+      const b = c("a-tab-pane"), m = c("a-tabs");
+      return a(), l("div", {
+        class: y(g)
       }, [
-        createVNode(_component_a_tabs, {
-          "active-key": activeKey.value,
+        _(m, {
+          "active-key": i.value,
           size: "mini",
           type: "rounded",
-          editable: __props.tabs.length > 1,
+          editable: t.tabs.length > 1,
           "hide-content": "",
           "destroy-on-hide": "",
-          onTabClick,
-          onDelete: onTabDelete
+          onTabClick: d,
+          onDelete: u
         }, {
-          default: withCtx(() => [
-            (openBlock(true), createElementBlock(Fragment, null, renderList(__props.tabs, (tab) => {
-              return openBlock(), createBlock(_component_a_tab_pane, {
-                key: tab.name,
-                title: tab.title
-              }, null, 8, ["title"]);
-            }), 128))
+          default: f(() => [
+            (a(!0), l(v, null, C(t.tabs, (r) => (a(), h(b, {
+              key: r.name,
+              title: r.title
+            }, null, 8, ["title"]))), 128))
           ]),
           _: 1
         }, 8, ["active-key", "editable"])
@@ -56,5 +49,5 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
   }
 });
 export {
-  _sfc_main as default
+  B as default
 };

package/es/pro-reuse-tabs/pro-reuse-tabs.vue2.js

@@ -1,4 +1,4 @@
-const proReuseTabs_vue_vue_type_style_index_0_lang = "";
+const e = "";
 export {
-  proReuseTabs_vue_vue_type_style_index_0_lang as default
+  e as default
 };

package/es/pro-reuse-tabs/pro-reuse-tabs.vue3.js

@@ -1,5 +1,5 @@
-import _sfc_main from "./pro-reuse-tabs.vue.js";
+import o from "./pro-reuse-tabs.vue.js";
 import "./pro-reuse-tabs.vue2.js";
 export {
-  _sfc_main as default
+  o as default
 };

package/es/style.css

@@ -1,121 +1 @@
-.keyblade-pro-breadcrumb {
-  margin: 16px 0;
-}
-.keyblade-pro-page-container {
-  padding: 0 20px 20px 20px;
-}
-.keyblade-pro-layout {
-  width: 100%;
-  height: 100%;
-}
-.keyblade-pro-layout :global(.arco-layout-sider-trigger) {
-  border-top: 0;
-}
-.keyblade-pro-layout-header {
-  position: fixed;
-  top: 0;
-  left: 0;
-  width: 100%;
-  height: var(--79d837bc);
-  z-index: 100;
-  display: flex;
-  align-items: center;
-  justify-content: space-between;
-  padding: 0 20px;
-  background-color: var(--color-bg-2);
-  border-bottom: 1px solid var(--color-border);
-  transition: all 0.2s cubic-bezier(0.34, 0.69, 0.1, 1);
-}
-.keyblade-pro-layout-header-left {
-  cursor: pointer;
-  display: flex;
-  align-items: center;
-}
-.keyblade-pro-layout-header-left-logo {
-  height: 28px;
-}
-.keyblade-pro-layout-header-left-title.arco-typography {
-  margin: 0;
-  font-size: 18px;
-}
-.keyblade-pro-layout-sider {
-  padding-top: var(--79d837bc);
-  position: fixed;
-  top: 0;
-  left: 0;
-  z-index: 99;
-  height: 100%;
-  transition: all 0.2s cubic-bezier(0.34, 0.69, 0.1, 1);
-}
-.keyblade-pro-layout-sider-content {
-  position: relative;
-  height: 100%;
-  overflow: auto;
-}
-.keyblade-pro-layout-sider-collapsed-icon.arco-btn {
-  position: absolute;
-  right: 12px;
-  bottom: 12px;
-}
-.keyblade-pro-layout-body {
-  padding-top: var(--79d837bc);
-  padding-left: var(--51986431);
-  min-height: 100vh;
-  overflow-y: hidden;
-  background-color: var(--color-fill-2);
-  transition: padding 0.2s cubic-bezier(0.34, 0.69, 0.1, 1);
-}
-.keyblade-pro-layout-body-affix .arco-affix {
-  z-index: 98;
-}
-.keyblade-pro-layout-body-footer {
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  height: 40px;
-  color: var(--color-text-2);
-  text-align: center;
-}
-.keyblade-pro-layout-body-collapsed {
-  padding-left: var(--2cc12c98);
-}
-.keyblade-pro-layout-side .keyblade-pro-layout-header {
-  z-index: 98;
-  left: var(--51986431);
-  width: calc(100% - var(--51986431));
-}
-.keyblade-pro-layout-side .keyblade-pro-layout-header-collapsed {
-  left: var(--2cc12c98);
-  width: calc(100% - var(--2cc12c98));
-}
-.keyblade-pro-layout-side .keyblade-pro-layout-sider {
-  padding-top: 0;
-}
-.keyblade-pro-layout-side .keyblade-pro-layout-sider-content-top {
-  position: relative;
-  display: flex;
-  align-items: center;
-  padding: 16px;
-  cursor: pointer;
-  transition: padding 0.3s cubic-bezier(0.645, 0.045, 0.355, 1);
-}
-.keyblade-pro-layout-side .keyblade-pro-layout-sider-content-top-logo {
-  width: 28px;
-  height: auto;
-}
-.keyblade-pro-layout-side .keyblade-pro-layout-sider-content-top-title.arco-typography {
-  margin: 0;
-  font-size: 18px;
-}
-.keyblade-pro-layout-side .keyblade-pro-layout-sider-collapsed .keyblade-pro-layout-sider-content-top {
-  padding: 16px 8px;
-}
-.keyblade-pro-reuse-tabs {
-  position: relative;
-  background-color: var(--color-bg-2);
-  padding: 4px 20px;
-}
-.keyblade-pro-menu-item-img {
-  width: 14px;
-  height: auto;
-}
+.keyblade-pro-page-header{background:var(--color-bg-2);padding:16px 32px}.keyblade-pro-page-header-section-breadcrumb .arco-breadcrumb-item:first-child{padding-left:0}.keyblade-pro-page-header-title.arco-typography{padding-top:4px;margin-top:0}.keyblade-pro-menu-item-img{width:14px;height:auto}.keyblade-pro-layout{width:100%;height:100%}.keyblade-pro-layout :global(.arco-layout-sider-trigger){border-top:0}.keyblade-pro-layout-header{position:fixed;top:0;left:0;width:100%;height:var(--db27ef1a);z-index:100;display:flex;align-items:center;justify-content:space-between;padding:0 20px;background-color:var(--color-bg-2);border-bottom:1px solid var(--color-border);transition:all .2s cubic-bezier(.34,.69,.1,1)}.keyblade-pro-layout-header-left{cursor:pointer;display:flex;align-items:center}.keyblade-pro-layout-header-left-logo{height:28px}.keyblade-pro-layout-header-left-title.arco-typography{margin:0;font-size:18px}.keyblade-pro-layout-header-center{flex:1}.keyblade-pro-layout-sider{padding-top:var(--db27ef1a);position:fixed;top:0;left:0;z-index:99;height:100%;transition:all .2s cubic-bezier(.34,.69,.1,1)}.keyblade-pro-layout-sider-content{position:relative;height:100%;overflow:auto}.keyblade-pro-layout-sider-collapsed-icon.arco-btn{position:absolute;right:12px;bottom:12px}.keyblade-pro-layout-body{padding-top:var(--db27ef1a);padding-left:var(--2f10394c);min-height:100vh;overflow-y:hidden;background-color:var(--color-fill-2);transition:padding .2s cubic-bezier(.34,.69,.1,1)}.keyblade-pro-layout-body-affix .arco-affix{z-index:98}.keyblade-pro-layout-body-footer{display:flex;align-items:center;justify-content:center;height:40px;color:var(--color-text-2);text-align:center}.keyblade-pro-layout-body-collapsed{padding-left:var(--2c81e8ab)}.keyblade-pro-layout-side .keyblade-pro-layout-header{z-index:98;left:var(--2f10394c);width:calc(100% - var(--2f10394c))}.keyblade-pro-layout-side .keyblade-pro-layout-header-collapsed{left:var(--2c81e8ab);width:calc(100% - var(--2c81e8ab))}.keyblade-pro-layout-side .keyblade-pro-layout-sider{padding-top:0}.keyblade-pro-layout-side .keyblade-pro-layout-sider-content-top{position:relative;display:flex;align-items:center;padding:16px;cursor:pointer;transition:padding .3s cubic-bezier(.645,.045,.355,1)}.keyblade-pro-layout-side .keyblade-pro-layout-sider-content-top-logo{width:28px;height:auto}.keyblade-pro-layout-side .keyblade-pro-layout-sider-content-top-title.arco-typography{margin:0;font-size:18px}.keyblade-pro-layout-side .keyblade-pro-layout-sider-collapsed .keyblade-pro-layout-sider-content-top{padding:16px 8px}.keyblade-pro-page-container-content{padding:20px}.keyblade-pro-reuse-tabs{position:relative;background-color:var(--color-bg-2);padding:4px 20px}

package/package.json

@@ -2,7 +2,7 @@
   "name": "@keyblade/pro-components",
   "description": "KeyBlade Pro Components",
   "author": "yangshuai <704807396@qq.com>",
-  "version": "1.4.5",
+  "version": "1.5.0",
   "private": false,
   "type": "module",
   "main": "es/index.js",
@@ -13,14 +13,16 @@
     "README.md"
   ],
   "publishConfig": {
+    "registry": "https://registry.npmjs.org/",
     "access": "public"
   },
   "sideEffects": [
     "*.css"
   ],
   "dependencies": {
-    "@arco-design/web-vue": "^2.49.2",
-    "vue-router": "^4.2.4"
+    "@arco-design/web-vue": "^2.50.0",
+    "vue-router": "^4.2.4",
+    "@vueuse/core": "^10.3.0"
   },
   "peerDependencies": {
     "vue": "^3.3.4"

package/src/index.ts

@@ -1,5 +1,5 @@
 import type { App } from 'vue'
-import { ProBreadcrumb } from './pro-breadcrumb'
+import { ProPageHeader } from './pro-page-header'
 import { ProKeepAliveRouterView } from './pro-keep-alive-router-view'
 import { ProLayout } from './pro-layout'
 import { ProMenu } from './pro-menu'
@@ -8,7 +8,7 @@ import { ProReuseTabs } from './pro-reuse-tabs'
 
 export default {
   install(app: App): void {
-    app.use(ProBreadcrumb)
+    app.use(ProPageHeader)
     app.use(ProKeepAliveRouterView)
     app.use(ProLayout)
     app.use(ProMenu)
@@ -18,7 +18,7 @@ export default {
 }
 
 // 按组件导出
-export { default as ProBreadcrumb } from './pro-breadcrumb'
+export { default as ProPageHeader } from './pro-page-header'
 
 export { default as ProKeepAliveRouterView } from './pro-keep-alive-router-view'
 

package/es/pro-breadcrumb/index.js

@@ -1,16 +0,0 @@
-import _sfc_main from "./pro-breadcrumb.vue.js";
-import "./pro-breadcrumb.vue2.js";
-import { Breadcrumb } from "@arco-design/web-vue";
-import { IconApps } from "@arco-design/web-vue/es/icon";
-const ProBreadcrumb = Object.assign(_sfc_main, {
-  install: (app) => {
-    app.use(Breadcrumb);
-    app.use(IconApps);
-    app.component("KbProBreadcrumb", _sfc_main);
-  }
-});
-const ProBreadcrumb$1 = ProBreadcrumb;
-export {
-  ProBreadcrumb,
-  ProBreadcrumb$1 as default
-};

package/es/pro-breadcrumb/pro-breadcrumb.vue.js

@@ -1,115 +0,0 @@
-import { defineComponent, inject, computed, resolveComponent, openBlock, createElementBlock, normalizeClass, createVNode, withCtx, createBlock, resolveDynamicComponent, createCommentVNode, Fragment, renderList, createTextVNode, toDisplayString } from "vue";
-const prefixClsName = "keyblade-pro-breadcrumb";
-const _sfc_main = /* @__PURE__ */ defineComponent({
-  __name: "pro-breadcrumb",
-  props: {
-    /** 是否显示图标 */
-    showIcon: {
-      type: Boolean,
-      required: false,
-      default: true
-    },
-    /** 图标类型 */
-    icon: {
-      type: String,
-      required: false,
-      default: "icon-apps"
-    },
-    /** 面包屑项目 */
-    items: {
-      type: Array,
-      required: false,
-      default: () => []
-    },
-    /** 是否显示标题 */
-    showTitle: {
-      type: Boolean,
-      required: false,
-      default: true
-    },
-    /** 标题，不传默认展示面包屑标题最后一项 */
-    title: {
-      type: String,
-      required: false,
-      default: ""
-    },
-    /** 副标题，不传默认不展示 */
-    subTitle: {
-      type: String,
-      required: false,
-      default: ""
-    }
-  },
-  setup(__props) {
-    const props = __props;
-    const proBreadcrumbItems = inject("ProBreadcrumbItems", []);
-    const breadcrumbItems = computed(() => {
-      if (props.items instanceof Array && props.items.length === 0 || !props.items) {
-        return proBreadcrumbItems.value;
-      }
-      return props.items || [];
-    });
-    return (_ctx, _cache) => {
-      const _component_a_breadcrumb_item = resolveComponent("a-breadcrumb-item");
-      const _component_a_breadcrumb = resolveComponent("a-breadcrumb");
-      const _component_a_typography_title = resolveComponent("a-typography-title");
-      const _component_a_typography_text = resolveComponent("a-typography-text");
-      return breadcrumbItems.value ? (openBlock(), createElementBlock("div", {
-        key: 0,
-        class: normalizeClass(prefixClsName)
-      }, [
-        createVNode(_component_a_breadcrumb, {
-          class: normalizeClass(`${prefixClsName}-items`)
-        }, {
-          default: withCtx(() => [
-            __props.showIcon ? (openBlock(), createBlock(_component_a_breadcrumb_item, {
-              key: 0,
-              style: { "cursor": "text" }
-            }, {
-              default: withCtx(() => [
-                (openBlock(), createBlock(resolveDynamicComponent(__props.icon)))
-              ]),
-              _: 1
-            })) : createCommentVNode("", true),
-            (openBlock(true), createElementBlock(Fragment, null, renderList(breadcrumbItems.value, (item, index) => {
-              return openBlock(), createBlock(_component_a_breadcrumb_item, {
-                key: `${item}-${index}`
-              }, {
-                default: withCtx(() => [
-                  createTextVNode(toDisplayString(item), 1)
-                ]),
-                _: 2
-              }, 1024);
-            }), 128))
-          ]),
-          _: 1
-        }, 8, ["class"]),
-        (props == null ? void 0 : props.showTitle) ? (openBlock(), createBlock(_component_a_typography_title, {
-          key: 0,
-          heading: 6,
-          class: normalizeClass(`${prefixClsName}-title`)
-        }, {
-          default: withCtx(() => {
-            var _a, _b;
-            return [
-              createTextVNode(toDisplayString((props == null ? void 0 : props.title) || ((_b = breadcrumbItems.value) == null ? void 0 : _b[((_a = breadcrumbItems.value) == null ? void 0 : _a.length) - 1])), 1)
-            ];
-          }),
-          _: 1
-        }, 8, ["class"])) : createCommentVNode("", true),
-        (props == null ? void 0 : props.subTitle) ? (openBlock(), createBlock(_component_a_typography_text, {
-          key: 1,
-          class: normalizeClass(`${prefixClsName}-subtitle`)
-        }, {
-          default: withCtx(() => [
-            createTextVNode(toDisplayString(props == null ? void 0 : props.subTitle), 1)
-          ]),
-          _: 1
-        }, 8, ["class"])) : createCommentVNode("", true)
-      ])) : createCommentVNode("", true);
-    };
-  }
-});
-export {
-  _sfc_main as default
-};

package/es/pro-breadcrumb/pro-breadcrumb.vue2.js

@@ -1,4 +0,0 @@
-const proBreadcrumb_vue_vue_type_style_index_0_lang = "";
-export {
-  proBreadcrumb_vue_vue_type_style_index_0_lang as default
-};

package/es/pro-breadcrumb/pro-breadcrumb.vue3.js

@@ -1,5 +0,0 @@
-import _sfc_main from "./pro-breadcrumb.vue.js";
-import "./pro-breadcrumb.vue2.js";
-export {
-  _sfc_main as default
-};

package/es/pro-menu/pro-menu-item.vue.d.ts

@@ -1,14 +0,0 @@
-import { DefineComponent, PropType, ComponentOptionsMixin, VNodeProps, AllowedComponentProps, ComponentCustomProps, ExtractPropTypes } from 'vue';
-import type { IProMenuItem } from './interface';
-declare const _default: DefineComponent<{
-    item: {
-        type: PropType<IProMenuItem>;
-        required: true;
-    };
-}, {}, unknown, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, VNodeProps & AllowedComponentProps & ComponentCustomProps, Readonly<ExtractPropTypes<{
-    item: {
-        type: PropType<IProMenuItem>;
-        required: true;
-    };
-}>>, {}, {}>;
-export default _default;

package/es/pro-menu/pro-menu-item.vue.js

@@ -1,103 +0,0 @@
-import { defineComponent, computed, resolveComponent, openBlock, createElementBlock, Fragment, createBlock, createSlots, withCtx, createTextVNode, toDisplayString, renderList, createCommentVNode, resolveDynamicComponent, normalizeClass } from "vue";
-import { useRouter } from "vue-router";
-const _hoisted_1 = ["src"];
-const _hoisted_2 = ["src"];
-const __default__ = {
-  name: "KbProMenuItem"
-};
-const _sfc_main = /* @__PURE__ */ defineComponent({
-  ...__default__,
-  props: {
-    item: {}
-  },
-  setup(__props) {
-    const props = __props;
-    const prefixItemClsName = "keyblade-pro-menu-item";
-    const router = useRouter();
-    const iconType = computed(() => {
-      var _a;
-      const icon = (_a = props.item) == null ? void 0 : _a.icon;
-      if (icon == null ? void 0 : icon.startsWith("icon")) {
-        return "icon";
-      }
-      return "url";
-    });
-    const onMenuItemClick = (item) => {
-      if (!(item == null ? void 0 : item.path)) {
-        return;
-      }
-      if (item.path.startsWith("http") || item.path.startsWith("https")) {
-        window.open(item.path);
-        return;
-      }
-      router.push({ path: item.path });
-    };
-    return (_ctx, _cache) => {
-      var _a, _b, _c, _d, _e, _f, _g, _h;
-      const _component_kb_pro_menu_item = resolveComponent("kb-pro-menu-item");
-      const _component_a_sub_menu = resolveComponent("a-sub-menu");
-      const _component_a_menu_item = resolveComponent("a-menu-item");
-      return _ctx.item && !_ctx.item.hideInMenu ? (openBlock(), createElementBlock(Fragment, { key: 0 }, [
-        ((_a = _ctx.item) == null ? void 0 : _a.children) && ((_c = (_b = _ctx.item) == null ? void 0 : _b.children) == null ? void 0 : _c.length) > 0 ? (openBlock(), createBlock(_component_a_sub_menu, {
-          key: _ctx.item.name
-        }, createSlots({
-          title: withCtx(() => [
-            createTextVNode(toDisplayString(_ctx.item.title), 1)
-          ]),
-          default: withCtx(() => {
-            var _a2, _b2;
-            return [
-              !((_a2 = _ctx.item) == null ? void 0 : _a2.hideChildrenInMenu) ? (openBlock(true), createElementBlock(Fragment, { key: 0 }, renderList(((_b2 = _ctx.item) == null ? void 0 : _b2.children) || [], (childItem) => {
-                return openBlock(), createBlock(_component_kb_pro_menu_item, {
-                  key: childItem.name,
-                  item: childItem
-                }, null, 8, ["item"]);
-              }), 128)) : createCommentVNode("", true)
-            ];
-          }),
-          _: 2
-        }, [
-          ((_d = _ctx.item) == null ? void 0 : _d.icon) ? {
-            name: "icon",
-            fn: withCtx(() => [
-              iconType.value === "icon" ? (openBlock(), createBlock(resolveDynamicComponent(_ctx.item.icon), { key: 0 })) : createCommentVNode("", true),
-              iconType.value === "url" ? (openBlock(), createElementBlock("img", {
-                key: 1,
-                class: normalizeClass(`${prefixItemClsName}-img`),
-                src: _ctx.item.icon,
-                alt: ""
-              }, null, 10, _hoisted_1)) : createCommentVNode("", true)
-            ]),
-            key: "0"
-          } : void 0
-        ]), 1024)) : createCommentVNode("", true),
-        !((_e = _ctx.item) == null ? void 0 : _e.children) || ((_g = (_f = _ctx.item) == null ? void 0 : _f.children) == null ? void 0 : _g.length) === 0 ? (openBlock(), createBlock(_component_a_menu_item, {
-          key: _ctx.item.name,
-          onClick: _cache[0] || (_cache[0] = ($event) => onMenuItemClick(_ctx.item))
-        }, createSlots({
-          default: withCtx(() => [
-            createTextVNode(" " + toDisplayString(_ctx.item.title), 1)
-          ]),
-          _: 2
-        }, [
-          ((_h = _ctx.item) == null ? void 0 : _h.icon) ? {
-            name: "icon",
-            fn: withCtx(() => [
-              iconType.value === "icon" ? (openBlock(), createBlock(resolveDynamicComponent(_ctx.item.icon), { key: 0 })) : createCommentVNode("", true),
-              iconType.value === "url" ? (openBlock(), createElementBlock("img", {
-                key: 1,
-                class: normalizeClass(`${prefixItemClsName}-img`),
-                src: _ctx.item.icon,
-                alt: ""
-              }, null, 10, _hoisted_2)) : createCommentVNode("", true)
-            ]),
-            key: "0"
-          } : void 0
-        ]), 1024)) : createCommentVNode("", true)
-      ], 64)) : createCommentVNode("", true);
-    };
-  }
-});
-export {
-  _sfc_main as default
-};

package/es/pro-menu/pro-menu-item.vue2.js

@@ -1,4 +0,0 @@
-const proMenuItem_vue_vue_type_style_index_0_lang = "";
-export {
-  proMenuItem_vue_vue_type_style_index_0_lang as default
-};

package/es/pro-menu/pro-menu-item.vue3.js

@@ -1,5 +0,0 @@
-import _sfc_main from "./pro-menu-item.vue.js";
-import "./pro-menu-item.vue2.js";
-export {
-  _sfc_main as default
-};