@jetlinks-web/components 2.0.30 → 2.0.32

package/es/CardSelect/style/index.css

@@ -0,0 +1,24 @@
+/* stylelint-disable at-rule-empty-line-before,at-rule-name-space-after,at-rule-no-unknown */
+/* stylelint-disable no-duplicate-selectors */
+/* stylelint-disable */
+/* stylelint-disable declaration-bang-space-before,no-duplicate-selectors,string-no-newline */
+.j-card-select {
+  display: grid;
+  gap: 12px;
+}
+.j-card-select .j-card-select-item {
+  padding: 12px;
+  border: 1px solid #e6e6e6;
+  border-radius: 2px;
+  cursor: pointer;
+}
+.j-card-select .j-card-select-item.active {
+  border-color: #1890ff;
+}
+.j-card-select .j-card-select-item.disabled {
+  cursor: not-allowed;
+  opacity: 0.75;
+}
+.j-card-select .j-card-select-item .j-card-select-describe {
+  color: #263237;
+}

package/es/CardSelect/style/index.less

@@ -1,4 +1,4 @@
-@import 'ant-design-vue/es/style/themes/index.less';
+@import '../../style/variable.less';
 
 .j-card-select {
   display: grid;

package/es/Ellipsis/style/index.css

@@ -0,0 +1,17 @@
+.j-ellipsis {
+  overflow: hidden;
+  vertical-align: bottom;
+}
+.j-ellipsis-cursor {
+  cursor: pointer;
+}
+.j-ellipsis-line-clamp {
+  display: -webkit-box;
+  -webkit-box-orient: vertical;
+  word-break: break-all;
+}
+.j-ellipsis-deep {
+  max-height: 380px;
+  -webkit-line-clamp: 17;
+  text-overflow: ellipsis;
+}

package/es/Ellipsis/style/index.less

@@ -0,0 +1,20 @@
+.j-ellipsis {
+  overflow: hidden;
+  vertical-align: bottom;
+}
+
+.j-ellipsis-cursor {
+  cursor: pointer;
+}
+
+.j-ellipsis-line-clamp {
+  display: -webkit-box;
+  -webkit-box-orient: vertical;
+  word-break: break-all;
+}
+
+.j-ellipsis-deep {
+  max-height: 380px;
+  -webkit-line-clamp: 17;
+  text-overflow: ellipsis;
+}

package/es/FullPage/FullPage.js

@@ -6,7 +6,7 @@
 } */
 import { defineComponent as _defineComponent } from 'vue';
 import { unref as _unref, renderSlot as _renderSlot, createElementVNode as _createElementVNode, normalizeStyle as _normalizeStyle, openBlock as _openBlock, createElementBlock as _createElementBlock, pushScopeId as _pushScopeId, popScopeId as _popScopeId } from "vue";
-const _withScopeId = n => (_pushScopeId("data-v-1715740839180"), n = n(), _popScopeId(), n);
+const _withScopeId = n => (_pushScopeId("data-v-1716194136622"), n = n(), _popScopeId(), n);
 const _hoisted_1 = { class: "full-page-warp-content" };
 import { ref } from 'vue';
 import { useElementBounding } from '@vueuse/core';

package/es/ProLayout/Basic/BasicLayout.js

@@ -210,6 +210,7 @@ export default defineComponent({
       var linksRender = getSlot(slots, props, 'linksRender');
       var logoRender = getSlot(slots, props, 'logoRender');
       var historyRender = getSlot(slots, props, 'historyRender');
+      var topHeaderMenuRender = getSlot(slots, props, 'topHeaderMenuRender');
       var headerDom = computed(function () {
         return headerRender(_objectSpread(_objectSpread({}, props), {}, {
           menuItemRender: menuItemRender,
@@ -228,6 +229,7 @@ export default defineComponent({
           headerContentRender: headerContentRender,
           logo: logoRender || props.logo,
           headerRender: customHeaderRender,
+          topHeaderMenuRender: topHeaderMenuRender,
           theme: (props.theme || 'dark').toLocaleLowerCase().includes('dark') ? 'dark' : 'light'
         }), props.matchMenuKeys);
       });

package/es/ProLayout/Basic/BasicLayout.less

@@ -0,0 +1,66 @@
+@import '../style/default.less';
+
+.@{basicLayout-prefix-cls} {
+  // BFC
+  display: flex;
+  flex-direction: column;
+  width: 100%;
+  min-height: 100%;
+
+  .@{ant-prefix}-layout-header {
+    &.@{ant-prefix}-pro-fixed-header {
+      position: fixed;
+      top: 0;
+    }
+  }
+
+  &-content {
+    position: relative;
+    margin: 24px;
+
+    .@{ant-prefix}-pro-page-container {
+      margin: -24px -24px 0;
+    }
+
+    &-disable-margin {
+      margin: 0;
+
+      .@{ant-prefix}-pro-page-container {
+        margin: 0;
+      }
+    }
+
+    > .@{ant-prefix}-layout {
+      max-height: 100%;
+    }
+  }
+
+  // children should support fixed
+  .@{basicLayout-prefix-cls}-is-children.@{basicLayout-prefix-cls}-fix-siderbar {
+    height: 100vh;
+    overflow: hidden;
+    transform: rotate(0);
+  }
+
+  .@{basicLayout-prefix-cls}-has-header {
+    // tech-page-container
+    .tech-page-container {
+      height: calc(100vh - @pro-layout-header-height);
+    }
+
+    .@{basicLayout-prefix-cls}-is-children.@{basicLayout-prefix-cls}-has-header {
+      .tech-page-container {
+        height: calc(100vh - @pro-layout-header-height -
+        @pro-layout-header-height);
+      }
+
+      .@{basicLayout-prefix-cls}-is-children {
+        min-height: calc(100vh - @pro-layout-header-height);
+
+        &.@{basicLayout-prefix-cls}-fix-siderbar {
+          height: calc(100vh - @pro-layout-header-height);
+        }
+      }
+    }
+  }
+}

package/es/ProLayout/Basic/Header.js

@@ -53,6 +53,7 @@ export default defineComponent({
     var className = computed(function () {
       return _defineProperty(_defineProperty({}, "".concat(prefixCls.value, "-fixed-header"), needFixedHeader.value), "".concat(prefixCls.value, "-top-menu"), isTop.value);
     });
+    var headerMenuRender = computed(function () {});
     var renderContent = function renderContent() {
       var defaultDom = _createVNode(TopNavHeader, _objectSpread(_objectSpread({
         "theme": theme.value,

package/es/ProLayout/Basic/Header.less

@@ -0,0 +1,8 @@
+@import '../style/default.less';
+
+@pro-layout-fixed-header-prefix-cls: ~'@{ant-prefix}-pro-fixed-header';
+
+.@{pro-layout-fixed-header-prefix-cls} {
+    z-index: 9;
+    width: 100%;
+}

package/es/ProLayout/PageContainer/index.less

@@ -0,0 +1,103 @@
+@import '../style/default.less';
+
+@pro-layout-page-container: ~'@{ant-prefix}-pro-page-container';
+
+.@{pro-layout-page-container}-children-content {
+    margin: 24px 24px 0;
+}
+
+.@{pro-layout-page-container} {
+    &-warp {
+        background-color: @component-background;
+        .@{ant-prefix}-tabs-bar {
+            margin: 0;
+        }
+    }
+    &-ghost {
+        .@{pro-layout-page-container}-warp {
+            background-color: @component-background;
+        }
+    }
+}
+
+.@{pro-layout-page-container}-main {
+    .@{pro-layout-page-container}-detail {
+        display: flex;
+    }
+
+    .@{pro-layout-page-container}-row {
+        display: flex;
+        width: 100%;
+    }
+
+    .@{pro-layout-page-container}-title-content {
+        margin-bottom: 16px;
+    }
+
+    .@{pro-layout-page-container}-title,
+    .@{pro-layout-page-container}-content {
+        flex: auto;
+    }
+
+    .@{pro-layout-page-container}-extraContent,
+    .@{pro-layout-page-container}-main {
+        flex: 0 1 auto;
+    }
+
+    .@{pro-layout-page-container}-main {
+        width: 100%;
+    }
+
+    .@{pro-layout-page-container}-title {
+        margin-bottom: 16px;
+    }
+
+    .@{pro-layout-page-container}-logo {
+        margin-bottom: 16px;
+    }
+
+    .@{pro-layout-page-container}-extraContent {
+        min-width: 242px;
+        margin-left: 88px;
+        text-align: right;
+    }
+}
+
+@media screen and (max-width: @screen-xl) {
+    .@{pro-layout-page-container}-main {
+        .@{pro-layout-page-container}-extraContent {
+            margin-left: 44px;
+        }
+    }
+}
+
+@media screen and (max-width: @screen-lg) {
+    .@{pro-layout-page-container}-main {
+        .@{pro-layout-page-container}-extraContent {
+            margin-left: 20px;
+        }
+    }
+}
+
+@media screen and (max-width: @screen-md) {
+    .@{pro-layout-page-container}-main {
+        .@{pro-layout-page-container}-row {
+            display: block;
+        }
+
+        .@{pro-layout-page-container}-action,
+        .@{pro-layout-page-container}-extraContent {
+            margin-left: 0;
+            text-align: left;
+        }
+    }
+}
+
+@media screen and (max-width: @screen-sm) {
+    .@{pro-layout-page-container}-detail {
+        display: block;
+    }
+    .@{pro-layout-page-container}-extraContent {
+        margin-left: 0;
+    }
+}

package/es/ProLayout/SiderMenu/index.less

@@ -0,0 +1,231 @@
+@import '../style/default.less';
+
+@pro-layout-sider-menu-prefix-cls: ~'@{ant-prefix}-pro-sider';
+
+@nav-header-height: @pro-layout-header-height;
+
+.@{pro-layout-sider-menu-prefix-cls} {
+    position: relative;
+    background-color: @layout-sider-background;
+    border-right: 0;
+    // FIXME: 临时修正(可能不会做兼容)
+    z-index: 20;
+
+    // 这里关掉了动画，不然使用无法兼容
+    .@{ant-prefix}-menu {
+        background: transparent;
+    }
+
+    &.@{ant-prefix}-layout-sider-light {
+        .@{ant-prefix}-menu-item a {
+            color: @heading-color;
+        }
+        .@{ant-prefix}-menu-item-selected a,
+        .@{ant-prefix}-menu-item a:hover {
+            color: @primary-color;
+        }
+    }
+
+    &-logo {
+        position: relative;
+        display: flex;
+        align-items: center;
+        padding: 16px 16px;
+        cursor: pointer;
+        transition: padding 0.3s cubic-bezier(0.645, 0.045, 0.355, 1);
+
+        > a {
+            display: flex;
+            align-items: center;
+            justify-content: center;
+            min-height: 32px;
+        }
+
+        img {
+            display: inline-block;
+            height: 32px;
+            vertical-align: middle;
+        }
+
+        h1 {
+            display: inline-block;
+            height: 32px;
+            margin: 0 0 0 12px;
+            color: white;
+            font-weight: 600;
+            font-size: 18px;
+            line-height: 32px;
+            vertical-align: middle;
+            animation: pro-layout-title-hide 0.3s;
+        }
+    }
+
+    &-logo-card {
+      padding: 16px 0;
+      justify-content: center;
+    }
+
+    &-extra {
+        margin-bottom: 16px;
+        padding: 0 16px;
+        &-no-logo {
+            margin-top: 16px;
+        }
+    }
+
+    &-menu {
+        position: relative;
+        z-index: 10;
+        min-height: 100%;
+        box-shadow: 2px 0 6px rgba(0, 21, 41, 0.35);
+    }
+
+    .@{ant-prefix}-layout-sider-children {
+        display: flex;
+        flex-direction: column;
+        height: 100%;
+
+        ::-webkit-scrollbar {
+            width: 6px;
+            height: 6px;
+        }
+
+        ::-webkit-scrollbar-track {
+            background: rgba(255, 255, 255, 0.15);
+            border-radius: 3px;
+            box-shadow: inset 0 0 5px rgba(37, 37, 37, 0.05);
+        }
+
+        /* 滚动条滑块 */
+        ::-webkit-scrollbar-thumb {
+            background: rgba(255, 255, 255, 0.2);
+            border-radius: 3px;
+            box-shadow: inset 0 0 5px rgba(255, 255, 255, 0.05);
+        }
+    }
+
+    &.@{ant-prefix}-layout-sider-collapsed {
+        .@{ant-prefix}-menu-inline-collapsed {
+            width: 48px;
+        }
+        .@{pro-layout-sider-menu-prefix-cls} {
+            &-logo {
+                padding: 16px 8px;
+            }
+        }
+    }
+
+    &.@{ant-prefix}-layout-sider.@{pro-layout-sider-menu-prefix-cls}-fixed {
+        position: fixed;
+        top: 0;
+        left: 0;
+        z-index: 99; // react pro-components: z-index: 100;
+        height: 100%;
+        overflow: auto;
+        overflow-x: hidden;
+        box-shadow: 2px 0 8px 0 rgba(29, 35, 41, 0.05);
+        > .@{ant-prefix}-menu-root {
+            :not(.@{pro-layout-sider-menu-prefix-cls}-link-menu) {
+                height: ~'calc(100vh - @{nav-header-height})';
+                overflow-y: auto;
+            }
+        }
+    }
+
+    &-light {
+        background-color: @component-background;
+        box-shadow: 2px 0 8px 0 rgba(29, 35, 41, 0.05);
+
+        .@{ant-prefix}-layout-sider-children {
+            ::-webkit-scrollbar-track {
+                background: rgba(0, 0, 0, 0.06);
+                border-radius: 3px;
+                box-shadow: inset 0 0 5px rgba(0, 21, 41, 0.05);
+            }
+
+            /* 滚动条滑块 */
+            ::-webkit-scrollbar-thumb {
+                background: rgba(0, 0, 0, 0.12);
+                border-radius: 3px;
+                box-shadow: inset 0 0 5px rgba(0, 21, 41, 0.05);
+            }
+        }
+
+        .@{pro-layout-sider-menu-prefix-cls}-logo {
+            h1 {
+                color: @primary-color;
+            }
+        }
+        .@{ant-prefix}-menu-light {
+            border-right-color: transparent;
+        }
+
+        .@{pro-layout-sider-menu-prefix-cls}-collapsed-button {
+            border-top: @border-width-base @border-style-base
+                @border-color-split;
+        }
+    }
+
+    &-icon {
+        width: 14px;
+        vertical-align: baseline;
+    }
+
+    &-links {
+        width: 100%;
+        ul.@{ant-prefix}-menu-root {
+            height: auto;
+        }
+    }
+
+    &-collapsed-button {
+        border-top: @border-width-base @border-style-base rgba(0, 0, 0, 0.25);
+        .anticon {
+            font-size: 16px;
+        }
+    }
+
+    .top-nav-menu li.@{ant-prefix}-menu-item {
+        height: 100%;
+        line-height: 1;
+    }
+    .drawer .drawer-content {
+        background: @layout-sider-background;
+    }
+}
+
+// 修正菜单 collapsed 时，icon 与 title 的间距
+.@{ant-prefix}-pro-menu-item {
+    .anticon + .@{ant-prefix}-pro-menu-item-title {
+        margin-left: 10px;
+    }
+}
+
+.sider-app-menus {
+  width: 100px;
+  background-color: #fff;
+  cursor: pointer;
+  padding: 6px;
+  transition: all .3s;
+  border-radius: 4px;
+  color: #333;
+
+  &:hover {
+    background-color: #efefef;
+  }
+}
+
+@keyframes pro-layout-title-hide {
+    0% {
+        display: none;
+        opacity: 0;
+    }
+    80% {
+        display: none;
+        opacity: 0;
+    }
+    100% {
+        display: unset;
+        opacity: 1;
+    }
+}

package/es/ProLayout/TopHeader/index.js

@@ -39,6 +39,12 @@ export var baseHeaderProps = _objectSpread(_objectSpread({}, defaultSettingProps
   },
   menuHeaderRender: siderMenuProps.menuHeaderRender,
   menuItemRender: siderMenuProps.menuItemRender,
+  topHeaderMenuRender: {
+    type: [Function, Object, Boolean],
+    default: function _default() {
+      return undefined;
+    }
+  },
   subMenuItemRender: siderMenuProps.subMenuItemRender,
   rightContentRender: {
     type: [Object, Function],
@@ -86,6 +92,7 @@ export var TopNavHeader = function TopNavHeader(props) {
     onSelect = props.onSelect,
     contentWidth = props.contentWidth,
     rightContentRender = props.rightContentRender,
+    topHeaderMenuRender = props.topHeaderMenuRender,
     layout = props.layout,
     menuData = props.menuData,
     mode = props.mode;
@@ -136,7 +143,7 @@ export var TopNavHeader = function TopNavHeader(props) {
       flex: 1
     },
     "class": "".concat(prefixCls, "-menu")
-  }, [_createVNode(BaseMenu, {
+  }, [topHeaderMenuRender ? topHeaderMenuRender() : _createVNode(BaseMenu, {
     "prefixCls": propPrefixCls,
     "locale": props.locale || context.locale,
     "theme": props.theme,