@meethive/components 0.0.9 → 0.0.10

package/lib/ProLayout/SiderMenu/SiderMenu.js

@@ -1,4 +1,4 @@
-import { computed, unref, defineComponent, createVNode as _createVNode, createTextVNode as _createTextVNode, Fragment as _Fragment } from 'vue';
+import { computed, unref, createVNode as _createVNode, createTextVNode as _createTextVNode, Fragment as _Fragment } from 'vue';
 import { LayoutSider as Sider, Menu, Tooltip } from 'ant-design-vue';
 import BaseMenu, { baseMenuProps } from './BaseMenu.js';
 import { defaultSettingProps, LayoutType } from '../defaultSettings';
@@ -135,154 +135,140 @@ export const defaultRenderCollapsedButton = collapsed => {
     "type": "MenuFoldOutlined"
   }, null);
 };
-const SiderMenu = defineComponent({
-  name: 'SiderMenu',
-  props: siderMenuProps,
-  setup(props) {
-    const prefixCls = computed(() => 'pro-layout');
-    const [wrapSSR, hashId] = useProLayoutStyle(prefixCls);
-    const context = useRouteContext();
-    const getPrefixCls = context.getPrefixCls;
-    const baseClassName = getPrefixCls('sider');
-    const hasSplitMenu = computed(() => {
-      return props.layout === 'mix' && props.splitMenus;
-    });
-    const sSideWidth = computed(() => {
-      return props.collapsed ? props.collapsedWidth : props.siderWidth;
-    });
-    const classNames = computed(() => ({
-      [baseClassName]: true,
-      [`${baseClassName}-fixed`]: context.fixSiderbar,
-      [`${baseClassName}-${props.theme}`]: true,
-      [`${baseClassName}-layout-${props.layout}`]: props.layout,
-      [hashId.value]: true
-    }));
-    const menuLocale = computed(() => {
-      const locale = props.locale || context.locale;
-      if (typeof locale === 'function' || typeof locale === 'boolean') return locale;
-      if (locale && typeof locale === 'object') {
-        return t => locale[t] ?? t;
-      }
-      return t => t;
-    });
-    const logCls = computed(() => ({
-      [`${baseClassName}-logo`]: true,
-      [`${baseClassName}-logo-card`]: props.layoutType === LayoutType.CARD
-    }));
-    const handleSelect = $event => {
-      if (props.onSelect) {
-        if (unref(hasSplitMenu)) {
-          props.onSelect([context.selectedKeys[0], ...$event]);
-          return;
-        }
-        props.onSelect($event);
+const SiderMenu = props => {
+  const {
+    collapsed,
+    siderWidth,
+    breakpoint,
+    collapsedWidth = 48,
+    menuExtraRender = false,
+    menuContentRender = false,
+    collapsedButtonRender = defaultRenderCollapsedButton,
+    linksRender,
+    theme
+  } = props;
+  const prefixCls = computed(() => 'pro-layout');
+  const [wrapSSR, hashId] = useProLayoutStyle(prefixCls);
+  const context = useRouteContext();
+  const getPrefixCls = context.getPrefixCls;
+  const baseClassName = getPrefixCls('sider');
+  const hasSplitMenu = computed(() => {
+    return props.layout === 'mix' && props.splitMenus;
+  });
+  const sSideWidth = computed(() => {
+    return props.collapsed ? props.collapsedWidth : props.siderWidth;
+  });
+  const classNames = computed(() => ({
+    [baseClassName]: true,
+    [`${baseClassName}-fixed`]: context.fixSiderbar,
+    [`${baseClassName}-${theme}`]: true,
+    [`${baseClassName}-layout-${props.layout}`]: props.layout,
+    [hashId.value]: true
+  }));
+  const logCls = computed(() => ({
+    [`${baseClassName}-logo`]: true,
+    [`${baseClassName}-logo-card`]: props.layoutType === LayoutType.CARD
+  }));
+  const handleSelect = $event => {
+    if (props.onSelect) {
+      if (unref(hasSplitMenu)) {
+        props.onSelect([context.selectedKeys[0], ...$event]);
+        return;
       }
-    };
-    const headerDom = computed(() => defaultRenderLogoAndTitle({
-      ...props,
-      baseClassName
-    }));
-    const extraDom = computed(() => props.menuExtraRender && props.menuExtraRender(props));
-    return () => {
-      const {
-        collapsed,
-        siderWidth,
-        breakpoint,
-        collapsedWidth = 48,
-        menuExtraRender = false,
-        menuContentRender = false,
-        collapsedButtonRender = defaultRenderCollapsedButton,
-        linksRender,
-        theme
-      } = props;
-      if (props.layoutType !== LayoutType.CARD && hasSplitMenu.value && unref(context.flatMenuData).length === 0) {
-        return null;
+      props.onSelect($event);
+    }
+  };
+  const headerDom = defaultRenderLogoAndTitle({
+    ...props,
+    baseClassName
+  });
+  const extraDom = menuExtraRender && menuExtraRender(props);
+  if (props.layoutType !== LayoutType.CARD && hasSplitMenu.value && unref(context.flatMenuData).length === 0) {
+    return null;
+  }
+  const defaultMenuDom = _createVNode(BaseMenu, {
+    "prefixCls": getPrefixCls(),
+    "locale": props.locale || context.locale,
+    "theme": theme,
+    "mode": "inline",
+    "menuData": hasSplitMenu.value ? context.flatMenuData : context.menuData,
+    "collapsed": props.collapsed,
+    "openKeys": context.openKeys,
+    "selectedKeys": context.selectedKeys,
+    "menuItemRender": props.menuItemRender,
+    "subMenuItemRender": props.subMenuItemRender,
+    "iconfontUrl": props.iconfontUrl,
+    "onClick": props.onMenuClick,
+    "style": {
+      width: '100%'
+    },
+    "class": `${baseClassName}-menu`,
+    "onUpdate:openKeys": $event => props.onOpenKeys && props.onOpenKeys($event),
+    "onUpdate:selectedKeys": handleSelect
+  }, null);
+  return _createVNode(_Fragment, null, [context.fixSiderbar && _createVNode("div", {
+    "style": {
+      width: `${sSideWidth.value}px`,
+      overflow: 'hidden',
+      flex: `0 0 ${sSideWidth.value}px`,
+      maxWidth: `${sSideWidth.value}px`,
+      minWidth: `${sSideWidth.value}px`,
+      transition: 'background-color 0.3s, min-width 0.3s, max-width 0.3s cubic-bezier(0.645, 0.045, 0.355, 1)'
+    }
+  }, null), _createVNode(Sider, {
+    "collapsible": true,
+    "trigger": null,
+    "collapsed": collapsed,
+    "breakpoint": breakpoint || undefined,
+    "onCollapse": collapse => {
+      props.onCollapse?.(collapse);
+    },
+    "collapsedWidth": collapsedWidth,
+    "style": {
+      overflow: 'hidden',
+      paddingTop: `${props.headerHeight}px`,
+      zIndex: props.layoutType === LayoutType.PAD ? 200 : 1
+    },
+    "width": siderWidth,
+    "theme": theme,
+    "class": classNames.value
+  }, {
+    default: () => [headerDom && _createVNode("div", {
+      "class": logCls.value,
+      "onClick": props.layout !== 'mix' ? props.onMenuHeaderClick : undefined,
+      "id": "logo",
+      "style": props?.logoStyle
+    }, [headerDom]), extraDom && _createVNode("div", {
+      "class": {
+        [`${baseClassName}-extra`]: true,
+        [`${baseClassName}-extra-no-logo`]: !headerDom
       }
-      const defaultMenuDom = _createVNode(BaseMenu, {
-        "prefixCls": getPrefixCls(),
-        "locale": menuLocale.value,
-        "theme": theme,
-        "mode": "inline",
-        "menuData": hasSplitMenu.value ? context.flatMenuData : context.menuData,
-        "collapsed": props.collapsed,
-        "openKeys": context.openKeys,
-        "selectedKeys": context.selectedKeys,
-        "menuItemRender": props.menuItemRender,
-        "subMenuItemRender": props.subMenuItemRender,
-        "iconfontUrl": props.iconfontUrl,
-        "onClick": props.onMenuClick,
-        "style": {
-          width: '100%'
-        },
-        "class": `${baseClassName}-menu`,
-        "onUpdate:openKeys": $event => props.onOpenKeys && props.onOpenKeys($event),
-        "onUpdate:selectedKeys": handleSelect
-      }, null);
-      return _createVNode(_Fragment, null, [context.fixSiderbar && _createVNode("div", {
-        "style": {
-          width: `${sSideWidth.value}px`,
-          overflow: 'hidden',
-          flex: `0 0 ${sSideWidth.value}px`,
-          maxWidth: `${sSideWidth.value}px`,
-          minWidth: `${sSideWidth.value}px`,
-          transition: 'background-color 0.3s, min-width 0.3s, max-width 0.3s cubic-bezier(0.645, 0.045, 0.355, 1)'
+    }, [extraDom]), _createVNode("div", {
+      "class": `${baseClassName}-body`,
+      "style": "flex: 1; overflow: hidden auto;"
+    }, [props.layoutType !== LayoutType.CARD ? menuContentRender && menuContentRender(props, defaultMenuDom) || defaultMenuDom : null]), _createVNode("div", {
+      "class": `${baseClassName}-links`
+    }, [linksRender ? linksRender() : collapsedButtonRender !== false ? _createVNode(Menu, {
+      "class": `${baseClassName}-link-menu`,
+      "inlineIndent": 16,
+      "theme": theme,
+      "selectedKeys": [],
+      "openKeys": [],
+      "mode": "inline",
+      "onClick": () => {
+        if (props.onCollapse) {
+          props.onCollapse(!props.collapsed);
         }
-      }, null), _createVNode(Sider, {
-        "collapsible": true,
-        "trigger": null,
-        "collapsed": collapsed,
-        "breakpoint": breakpoint || undefined,
-        "onCollapse": collapse => {
-          props.onCollapse?.(collapse);
-        },
-        "collapsedWidth": collapsedWidth,
-        "style": {
-          overflow: 'hidden',
-          paddingTop: `${props.headerHeight}px`,
-          zIndex: props.layoutType === LayoutType.PAD ? 200 : 1
-        },
-        "width": siderWidth,
-        "theme": theme,
-        "class": classNames.value
+      }
+    }, {
+      default: () => [_createVNode(Menu.Item, {
+        "key": "collapsed-button",
+        "class": `${baseClassName}-collapsed-button`,
+        "title": false
       }, {
-        default: () => [headerDom.value && _createVNode("div", {
-          "class": logCls.value,
-          "onClick": props.layout !== 'mix' ? props.onMenuHeaderClick : undefined,
-          "id": "logo",
-          "style": props?.logoStyle
-        }, [headerDom.value]), extraDom.value && _createVNode("div", {
-          "class": {
-            [`${baseClassName}-extra`]: true,
-            [`${baseClassName}-extra-no-logo`]: !headerDom.value
-          }
-        }, [extraDom.value]), _createVNode("div", {
-          "class": `${baseClassName}-body`,
-          "style": "flex: 1; overflow: hidden auto;"
-        }, [props.layoutType !== LayoutType.CARD ? menuContentRender && menuContentRender(props, defaultMenuDom) || defaultMenuDom : null]), _createVNode("div", {
-          "class": `${baseClassName}-links`
-        }, [linksRender ? linksRender() : collapsedButtonRender !== false ? _createVNode(Menu, {
-          "class": `${baseClassName}-link-menu`,
-          "inlineIndent": 16,
-          "theme": theme,
-          "selectedKeys": [],
-          "openKeys": [],
-          "mode": "inline",
-          "onClick": () => {
-            if (props.onCollapse) {
-              props.onCollapse(!props.collapsed);
-            }
-          }
-        }, {
-          default: () => [_createVNode(Menu.Item, {
-            "key": "collapsed-button",
-            "class": `${baseClassName}-collapsed-button`,
-            "title": false
-          }, {
-            default: () => [collapsedButtonRender && typeof collapsedButtonRender === 'function' ? collapsedButtonRender(collapsed) : collapsedButtonRender]
-          })]
-        }) : null])]
-      })]);
-    };
-  }
-});
+        default: () => [collapsedButtonRender && typeof collapsedButtonRender === 'function' ? collapsedButtonRender(collapsed) : collapsedButtonRender]
+      })]
+    }) : null])]
+  })]);
+};
 export default SiderMenu;

package/lib/ProLayout/TopHeader/index.js

@@ -1,4 +1,4 @@
-import { computed, ref, defineComponent, createVNode as _createVNode, mergeProps as _mergeProps } from 'vue';
+import { computed, ref, createVNode as _createVNode, mergeProps as _mergeProps } from 'vue';
 import { default as ResizeObserver } from 'ant-design-vue/es/vc-resize-observer';
 import { defaultRenderLogoAndTitle, siderMenuProps } from '../SiderMenu/SiderMenu';
 import PropTypes from 'ant-design-vue/es/_util/vue-types';
@@ -75,104 +75,96 @@ const RightContent = ({
     })]) : rightContentRender]
   })])]);
 };
-export const TopNavHeader = defineComponent({
-  name: 'TopNavHeader',
-  props: topNavHeaderProps,
-  setup(props) {
-    const headerRef = ref();
-    const context = useRouteContext();
-    const stylePrefixCls = computed(() => 'pro-layout');
-    const [wrapSSR, hashId] = useProLayoutStyle(stylePrefixCls);
-    const prefixCls = computed(() => `${props.prefixCls || defaultPrefixCls}-top-nav-header`);
-    const MenusData = computed(() => {
-      let data = props.layout === 'side' ? [] : props.menuData;
-      if (props.layout === 'mix' && props.splitMenus) {
-        const noChildrenMenuData = (props.menuData || []).map(item => {
-          return {
-            ...item,
-            children: undefined,
-            component: undefined
-          };
-        });
-        data = clearMenuItem(noChildrenMenuData);
-      }
-      return data;
-    });
-    const _mode = computed(() => {
-      return props.layout === 'mix' && props.splitMenus ? 'horizontal' : props.mode;
-    });
-    const menuLocale = computed(() => {
-      const locale = props.locale || context.locale;
-      if (typeof locale === 'function' || typeof locale === 'boolean') return locale;
-      if (locale && typeof locale === 'object') {
-        return t => locale[t] ?? t;
-      }
-      return t => t;
-    });
-    const className = computed(() => ({
-      [prefixCls.value]: true,
-      [hashId.value]: true,
-      'light': props.theme === 'light',
-      'dark': props.theme === 'dark'
-    }));
-    const paddingLeft = computed(() => {
-      return context.layoutType === LayoutType.PAD && props.collapsed ? context.headerLeftWidth + 'px' : 0;
+export const TopNavHeader = props => {
+  const headerRef = ref();
+  const {
+    prefixCls: propPrefixCls,
+    onMenuHeaderClick,
+    onOpenKeys,
+    onSelect,
+    contentWidth,
+    rightContentRender,
+    topHeaderMenuRender,
+    layout,
+    menuData,
+    mode
+  } = props;
+  const context = useRouteContext();
+  const prefixCls = `${propPrefixCls || defaultPrefixCls}-top-nav-header`;
+  const stylePrefixCls = computed(() => 'pro-layout');
+  const [wrapSSR, hashId] = useProLayoutStyle(stylePrefixCls);
+  const headerDom = defaultRenderLogoAndTitle({
+    ...props,
+    collapsed: false
+  },
+  // REMARK:: Any time render header title
+  // layout === 'mix' ? 'headerTitleRender' : undefined,
+  // layout !== 'side' ? 'headerTitleRender' : undefined,
+  'headerTitleRender');
+
+  //
+  let MenusData = props.layout === 'side' ? [] : menuData;
+  if (props.layout === 'mix' && props.splitMenus) {
+    const noChildrenMenuData = (menuData || []).map(item => {
+      return {
+        ...item,
+        children: undefined,
+        component: undefined
+      };
     });
-    return () => {
-      const headerDom = defaultRenderLogoAndTitle({
-        ...props,
-        collapsed: false
-      }, 'headerTitleRender');
-      const {
-        prefixCls: propPrefixCls,
-        onMenuHeaderClick,
-        onOpenKeys,
-        onSelect,
-        contentWidth,
-        rightContentRender,
-        topHeaderMenuRender
-      } = props;
-      return _createVNode("div", {
-        "class": className.value,
-        "style": {
-          paddingLeft: paddingLeft.value
-        }
-      }, [_createVNode("div", {
-        "ref": headerRef,
-        "class": `${prefixCls.value}-main ${contentWidth === 'Fixed' ? 'wide' : ''}`
-      }, [headerDom && _createVNode("div", {
-        "class": `${prefixCls.value}-main-left`,
-        "onClick": onMenuHeaderClick
-      }, [_createVNode("div", {
-        "class": `${prefixCls.value}-logo`,
-        "key": "logo",
-        "id": "logo"
-      }, [headerDom])]), _createVNode("div", {
-        "style": {
-          flex: 1
-        },
-        "class": `${prefixCls.value}-menu`
-      }, [topHeaderMenuRender ? topHeaderMenuRender() : _createVNode(BaseMenu, {
-        "prefixCls": propPrefixCls,
-        "locale": menuLocale.value,
-        "theme": props.theme,
-        "mode": _mode.value,
-        "collapsed": props.collapsed,
-        "iconfontUrl": props.iconfontUrl,
-        "menuData": MenusData.value,
-        "menuItemRender": props.menuItemRender,
-        "subMenuItemRender": props.subMenuItemRender,
-        "openKeys": context.openKeys,
-        "selectedKeys": context.selectedKeys,
-        "class": {
-          'top-nav-menu': props.mode === 'horizontal'
-        },
-        "onUpdate:openKeys": $event => onOpenKeys && onOpenKeys($event),
-        "onUpdate:selectedKeys": $event => onSelect && onSelect($event)
-      }, null)]), rightContentRender && _createVNode(RightContent, _mergeProps({
-        "rightContentRender": rightContentRender
-      }, props), null)])]);
-    };
+    MenusData = clearMenuItem(noChildrenMenuData);
   }
-});
+  const _mode = computed(() => {
+    return props.layout === 'mix' && props.splitMenus ? 'horizontal' : mode;
+  });
+  const className = computed(() => ({
+    [prefixCls]: true,
+    [hashId.value]: true,
+    'light': props.theme === 'light',
+    'dark': props.theme === 'dark'
+  }));
+  const paddingLeft = computed(() => {
+    return context.layoutType === LayoutType.PAD && props.collapsed ? context.headerLeftWidth + 'px' : 0;
+  });
+  return _createVNode("div", {
+    "class": className.value,
+    "style": {
+      paddingLeft: paddingLeft.value
+    }
+  }, [_createVNode("div", {
+    "ref": headerRef,
+    "class": `${prefixCls}-main ${contentWidth === 'Fixed' ? 'wide' : ''}`
+  }, [headerDom && _createVNode("div", {
+    "class": `${prefixCls}-main-left`,
+    "onClick": onMenuHeaderClick
+  }, [_createVNode("div", {
+    "class": `${prefixCls}-logo`,
+    "key": "logo",
+    "id": "logo"
+  }, [headerDom])]), _createVNode("div", {
+    "style": {
+      flex: 1
+    },
+    "class": `${prefixCls}-menu`
+  }, [topHeaderMenuRender ? topHeaderMenuRender() : _createVNode(BaseMenu, {
+    "prefixCls": propPrefixCls,
+    "locale": props.locale || context.locale,
+    "theme": props.theme,
+    "mode": _mode.value,
+    "collapsed": props.collapsed,
+    "iconfontUrl": props.iconfontUrl,
+    "menuData": MenusData,
+    "menuItemRender": props.menuItemRender,
+    "subMenuItemRender": props.subMenuItemRender,
+    "openKeys": context.openKeys,
+    "selectedKeys": context.selectedKeys,
+    "class": {
+      'top-nav-menu': props.mode === 'horizontal'
+    },
+    "onUpdate:openKeys": $event => onOpenKeys && onOpenKeys($event),
+    "onUpdate:selectedKeys": $event => onSelect && onSelect($event)
+  }, null)]), rightContentRender && _createVNode(RightContent, _mergeProps({
+    "rightContentRender": rightContentRender
+  }, props), null)])]);
+};
 export default TopNavHeader;

package/lib/ProTable/Alert.js

@@ -32,7 +32,7 @@ export default defineComponent({
     return {
       hashId,
       contextLocale,
-      _message,
+      alertMessage: _message,
       onClose
     };
   }

package/lib/ProTable/Content.js

@@ -69,11 +69,11 @@ export default defineComponent({
     return {
       hashId,
       contextLocale,
-      _columns,
-      _slots,
-      _scroll,
+      tableColumns: _columns,
+      tableSlots: _slots,
+      tableScroll: _scroll,
       gridTemplateColumns,
-      __rowSelection,
+      mergedRowSelection: __rowSelection,
       indeterminate,
       checkedAll,
       onClick,

package/lib/ProTable/Pagination.js

@@ -49,7 +49,7 @@ export default defineComponent({
     return {
       hashId,
       className,
-      _showTotal,
+      showTotal: _showTotal,
       onChange
     };
   }

package/lib/ProTable/ProTable.js

@@ -242,15 +242,15 @@ export default defineComponent({
       slots,
       hashId,
       loading,
-      _dataSource,
-      _mode,
+      tableDataSource: _dataSource,
+      currentMode: _mode,
       column,
       page,
       myPagination,
       showAlert,
       showPagination,
       extraSlots,
-      _rowSelection,
+      injectRowSelection: _rowSelection,
       onCheck,
       onPageChange,
       onClose

package/lib/ProTable/setting.js

@@ -19,7 +19,7 @@ export const _alertProps = {
     default: true
   },
   rowSelection: {
-    type: Object,
+    type: [Object, Boolean],
     default: () => undefined
   }
 }