@kdcloudjs/kdesign 1.8.50 → 1.8.52

package/es/config-provider/defaultConfig.d.ts

@@ -7,5 +7,6 @@ declare const defaultConfig: {
         getCompLangMsg: (compLangMsgParams: import("../locale").CompLangMsgParams, customGetLangMsg?: ((componentName: string, labelName: string, params: any) => any) | undefined, localeDate?: any) => any;
     };
     direction: "ltr" | "rtl";
+    isMobile: boolean;
 };
 export default defaultConfig;

package/es/config-provider/defaultConfig.js

@@ -13,6 +13,7 @@ var defaultConfig = {
     getLangMsg: getLangMsg,
     getCompLangMsg: getCompLangMsg
   },
-  direction: 'ltr'
+  direction: 'ltr',
+  isMobile: false
 };
 export default defaultConfig;

package/es/tabs/style/index.css

@@ -386,7 +386,7 @@
   max-width: var(--kd-c-tabs-pane-text-sizing-max-width);
 }
 .kd-tab-pane-text-active,
-.kd-tab-pane-text:hover {
+.kd-tab-pane-text-notMobile:hover {
   color: var(--kd-c-tabs-color-text-active, var(--kd-g-color-theme, #5582f3));
 }
 .kd-tab-pane-text-disabled:hover {
@@ -473,12 +473,16 @@
       -ms-flex-align: center;
           align-items: center;
 }
-.kd-tab-pane-type-dynamic:not(.kd-tab-pane-disabled):hover .kd-tab-pane-operations span:first-child {
+.kd-tab-pane-type-dynamic .kd-tab-pane-operations .kdicon {
+  font-size: 16px;
+}
+.kd-tab-pane-type-dynamic.kd-tab-pane-box-active.kd-tab-pane-isMobile:not(.kd-tab-pane-disabled):hover .kd-tab-pane-operations span:first-child {
   opacity: 1;
   cursor: pointer;
 }
-.kd-tab-pane-type-dynamic .kd-tab-pane-operations .kdicon {
-  font-size: 16px;
+.kd-tab-pane-type-dynamic-notMobile:not(.kd-tab-pane-disabled):hover .kd-tab-pane-operations span:first-child {
+  opacity: 1;
+  cursor: pointer;
 }
 .kd-tab-pane-type-grid {
   height: 24px;
@@ -507,7 +511,7 @@
 .kd-tab-pane-type-grid.kd-tab-pane-disabled {
   background-color: var(--kd-c-tabs-color-background-disabled, transparent);
 }
-.kd-tab-pane-type-grid:hover {
+.kd-tab-pane-notMobile:hover {
   color: var(--kd-c-tabs-color-text-active, var(--kd-g-color-theme, #5582f3));
 }
 .kd-tab-pane-operations {

package/es/tabs/style/index.less

@@ -221,7 +221,7 @@
     text-overflow: ellipsis;
     max-width: @tab-pane-text-max-width;
     &-active,
-    &:hover {
+    &-notMobile:hover {
       color: @tabPane-font-color-active;
     }
     &-disabled {
@@ -230,6 +230,7 @@
       }
     }
   }
+
   &-disabled {
     color: @tabPane-font-color-disabled;
     cursor: not-allowed;
@@ -304,6 +305,21 @@
     margin: 0 0 0 4px;
     display: inline-flex;
     align-items: center;
+    .@{tabPane-prefix-cls}-operations .@{icon-prefix-cls} {
+      font-size: 16px;
+    }
+    &.@{tabPane-prefix-cls}-box-active {
+      &.@{tabPane-prefix-cls}-isMobile:not(.@{tabPane-prefix-cls}-disabled):hover {
+        .@{tabPane-prefix-cls}-operations {
+          span:first-child {
+            opacity: 1;
+            cursor: pointer;
+          }
+        }
+      }
+    }
+  }
+  &-type-dynamic-notMobile {
     &:not(.@{tabPane-prefix-cls}-disabled):hover {
       .@{tabPane-prefix-cls}-operations {
         span:first-child {
@@ -312,9 +328,6 @@
         }
       }
     }
-    .@{tabPane-prefix-cls}-operations .@{icon-prefix-cls} {
-      font-size: 16px;
-    }
   }
   &-type-grid {
     height: 24px;
@@ -341,6 +354,8 @@
     &.@{tabPane-prefix-cls}-disabled {
       background-color: @tab-disabled-bg;
     }
+  }
+  &-notMobile {
     &:hover {
       color: @tabPane-font-color-active;
     }

package/es/tabs/tab-pane.js

@@ -14,7 +14,8 @@ var TabPane = function TabPane(props) {
   var tabPaneRef = useRef(null);
   var _useContext = useContext(ConfigContext),
     getPrefixCls = _useContext.getPrefixCls,
-    prefixCls = _useContext.prefixCls;
+    prefixCls = _useContext.prefixCls,
+    isMobile = _useContext.isMobile;
   var tab = props.tab,
     id = props.id,
     className = props.className,
@@ -30,8 +31,8 @@ var TabPane = function TabPane(props) {
     tabPaneProps.disabled = context.disabled || disabled;
   }
   var tabPanePrefixCls = getPrefixCls(prefixCls, 'tab-pane');
-  var tabPaneBoxClasses = classNames(tabPanePrefixCls, className, (_classNames = {}, _defineProperty(_classNames, "".concat(tabPanePrefixCls, "-box-active"), String(tabPaneProps.activeKey) === String(id) && !tabPaneProps.disabled), _defineProperty(_classNames, _concatInstanceProperty(_context = "".concat(tabPanePrefixCls, "-type-")).call(_context, tabPaneProps.type), tabPaneProps.type), _defineProperty(_classNames, _concatInstanceProperty(_context2 = "".concat(tabPanePrefixCls, "-")).call(_context2, tabPaneProps.position), tabPaneProps.position), _defineProperty(_classNames, _concatInstanceProperty(_context3 = "".concat(tabPanePrefixCls, "-")).call(_context3, tabPaneProps.size), tabPaneProps.size), _defineProperty(_classNames, "".concat(tabPanePrefixCls, "-disabled"), tabPaneProps.disabled), _classNames));
-  var tabPaneTextClasses = classNames("".concat(tabPanePrefixCls, "-text"), (_classNames2 = {}, _defineProperty(_classNames2, "".concat(tabPanePrefixCls, "-text-active"), String(tabPaneProps.activeKey) === String(id) && !tabPaneProps.disabled), _defineProperty(_classNames2, "".concat(tabPanePrefixCls, "-text-disabled"), tabPaneProps.disabled), _classNames2));
+  var tabPaneBoxClasses = classNames(tabPanePrefixCls, className, (_classNames = {}, _defineProperty(_classNames, "".concat(tabPanePrefixCls, "-box-active"), String(tabPaneProps.activeKey) === String(id) && !tabPaneProps.disabled), _defineProperty(_classNames, "".concat(tabPanePrefixCls, "-type-dynamic-notMobile"), !isMobile), _defineProperty(_classNames, _concatInstanceProperty(_context = "".concat(tabPanePrefixCls, "-type-")).call(_context, tabPaneProps.type), tabPaneProps.type), _defineProperty(_classNames, _concatInstanceProperty(_context2 = "".concat(tabPanePrefixCls, "-")).call(_context2, tabPaneProps.position), tabPaneProps.position), _defineProperty(_classNames, _concatInstanceProperty(_context3 = "".concat(tabPanePrefixCls, "-")).call(_context3, tabPaneProps.size), tabPaneProps.size), _defineProperty(_classNames, "".concat(tabPanePrefixCls, "-disabled"), tabPaneProps.disabled), _defineProperty(_classNames, "".concat(tabPanePrefixCls, "-notMobile"), !isMobile), _defineProperty(_classNames, "".concat(tabPanePrefixCls, "-isMobile"), isMobile), _classNames));
+  var tabPaneTextClasses = classNames("".concat(tabPanePrefixCls, "-text"), (_classNames2 = {}, _defineProperty(_classNames2, "".concat(tabPanePrefixCls, "-text-active"), String(tabPaneProps.activeKey) === String(id) && !tabPaneProps.disabled), _defineProperty(_classNames2, "".concat(tabPanePrefixCls, "-text-disabled"), tabPaneProps.disabled), _defineProperty(_classNames2, "".concat(tabPanePrefixCls, "-text-notMobile"), !isMobile), _classNames2));
   var operationsClasses = classNames("".concat(tabPanePrefixCls, "-operations"), _defineProperty({}, "".concat(tabPanePrefixCls, "-operations-active"), String(tabPaneProps.activeKey) === String(id) && !tabPaneProps.disabled));
   var handleClick = function handleClick(e) {
     if (tabPaneProps.disabled) return;

package/es/tabs/tabs.js

@@ -121,7 +121,14 @@ var Tabs = function Tabs(props) {
     isDragging.current = true;
   };
   var handleTouchMove = function handleTouchMove(e) {
+    var _a, _b;
     if (!isDragging.current || ListWidth <= boxWidth) return;
+    var path = ((_b = (_a = e.nativeEvent).composedPath) === null || _b === void 0 ? void 0 : _b.call(_a)) || [];
+    var isFromTabList = path.some(function (el) {
+      var _a, _b, _c;
+      return (_c = (_b = (_a = el) === null || _a === void 0 ? void 0 : _a.classList) === null || _b === void 0 ? void 0 : _b.contains) === null || _c === void 0 ? void 0 : _c.call(_b, "".concat(tabsPrefixCls, "-tab-list"));
+    });
+    if (!isFromTabList) return;
     var currentX = e.touches[0].clientX;
     var deltaX = currentX - touchStartX.current;
     var newPosition = lastListPosition.current + deltaX;

package/lib/config-provider/defaultConfig.d.ts

@@ -7,5 +7,6 @@ declare const defaultConfig: {
         getCompLangMsg: (compLangMsgParams: import("../locale").CompLangMsgParams, customGetLangMsg?: ((componentName: string, labelName: string, params: any) => any) | undefined, localeDate?: any) => any;
     };
     direction: "ltr" | "rtl";
+    isMobile: boolean;
 };
 export default defaultConfig;

package/lib/config-provider/defaultConfig.js

@@ -20,7 +20,8 @@ var defaultConfig = {
     getLangMsg: _locale.getLangMsg,
     getCompLangMsg: _locale.getCompLangMsg
   },
-  direction: 'ltr'
+  direction: 'ltr',
+  isMobile: false
 };
 var _default = defaultConfig;
 exports.default = _default;

package/lib/tabs/style/index.css

@@ -386,7 +386,7 @@
   max-width: var(--kd-c-tabs-pane-text-sizing-max-width);
 }
 .kd-tab-pane-text-active,
-.kd-tab-pane-text:hover {
+.kd-tab-pane-text-notMobile:hover {
   color: var(--kd-c-tabs-color-text-active, var(--kd-g-color-theme, #5582f3));
 }
 .kd-tab-pane-text-disabled:hover {
@@ -473,12 +473,16 @@
       -ms-flex-align: center;
           align-items: center;
 }
-.kd-tab-pane-type-dynamic:not(.kd-tab-pane-disabled):hover .kd-tab-pane-operations span:first-child {
+.kd-tab-pane-type-dynamic .kd-tab-pane-operations .kdicon {
+  font-size: 16px;
+}
+.kd-tab-pane-type-dynamic.kd-tab-pane-box-active.kd-tab-pane-isMobile:not(.kd-tab-pane-disabled):hover .kd-tab-pane-operations span:first-child {
   opacity: 1;
   cursor: pointer;
 }
-.kd-tab-pane-type-dynamic .kd-tab-pane-operations .kdicon {
-  font-size: 16px;
+.kd-tab-pane-type-dynamic-notMobile:not(.kd-tab-pane-disabled):hover .kd-tab-pane-operations span:first-child {
+  opacity: 1;
+  cursor: pointer;
 }
 .kd-tab-pane-type-grid {
   height: 24px;
@@ -507,7 +511,7 @@
 .kd-tab-pane-type-grid.kd-tab-pane-disabled {
   background-color: var(--kd-c-tabs-color-background-disabled, transparent);
 }
-.kd-tab-pane-type-grid:hover {
+.kd-tab-pane-notMobile:hover {
   color: var(--kd-c-tabs-color-text-active, var(--kd-g-color-theme, #5582f3));
 }
 .kd-tab-pane-operations {

package/lib/tabs/style/index.less

@@ -221,7 +221,7 @@
     text-overflow: ellipsis;
     max-width: @tab-pane-text-max-width;
     &-active,
-    &:hover {
+    &-notMobile:hover {
       color: @tabPane-font-color-active;
     }
     &-disabled {
@@ -230,6 +230,7 @@
       }
     }
   }
+
   &-disabled {
     color: @tabPane-font-color-disabled;
     cursor: not-allowed;
@@ -304,6 +305,21 @@
     margin: 0 0 0 4px;
     display: inline-flex;
     align-items: center;
+    .@{tabPane-prefix-cls}-operations .@{icon-prefix-cls} {
+      font-size: 16px;
+    }
+    &.@{tabPane-prefix-cls}-box-active {
+      &.@{tabPane-prefix-cls}-isMobile:not(.@{tabPane-prefix-cls}-disabled):hover {
+        .@{tabPane-prefix-cls}-operations {
+          span:first-child {
+            opacity: 1;
+            cursor: pointer;
+          }
+        }
+      }
+    }
+  }
+  &-type-dynamic-notMobile {
     &:not(.@{tabPane-prefix-cls}-disabled):hover {
       .@{tabPane-prefix-cls}-operations {
         span:first-child {
@@ -312,9 +328,6 @@
         }
       }
     }
-    .@{tabPane-prefix-cls}-operations .@{icon-prefix-cls} {
-      font-size: 16px;
-    }
   }
   &-type-grid {
     height: 24px;
@@ -341,6 +354,8 @@
     &.@{tabPane-prefix-cls}-disabled {
       background-color: @tab-disabled-bg;
     }
+  }
+  &-notMobile {
     &:hover {
       color: @tabPane-font-color-active;
     }

package/lib/tabs/tab-pane.js

@@ -27,7 +27,8 @@ var TabPane = function TabPane(props) {
   var tabPaneRef = (0, _react.useRef)(null);
   var _useContext = (0, _react.useContext)(_ConfigContext.default),
     getPrefixCls = _useContext.getPrefixCls,
-    prefixCls = _useContext.prefixCls;
+    prefixCls = _useContext.prefixCls,
+    isMobile = _useContext.isMobile;
   var tab = props.tab,
     id = props.id,
     className = props.className,
@@ -43,8 +44,8 @@ var TabPane = function TabPane(props) {
     tabPaneProps.disabled = context.disabled || disabled;
   }
   var tabPanePrefixCls = getPrefixCls(prefixCls, 'tab-pane');
-  var tabPaneBoxClasses = (0, _classnames.default)(tabPanePrefixCls, className, (_classNames = {}, (0, _defineProperty2.default)(_classNames, "".concat(tabPanePrefixCls, "-box-active"), String(tabPaneProps.activeKey) === String(id) && !tabPaneProps.disabled), (0, _defineProperty2.default)(_classNames, (0, _concat.default)(_context = "".concat(tabPanePrefixCls, "-type-")).call(_context, tabPaneProps.type), tabPaneProps.type), (0, _defineProperty2.default)(_classNames, (0, _concat.default)(_context2 = "".concat(tabPanePrefixCls, "-")).call(_context2, tabPaneProps.position), tabPaneProps.position), (0, _defineProperty2.default)(_classNames, (0, _concat.default)(_context3 = "".concat(tabPanePrefixCls, "-")).call(_context3, tabPaneProps.size), tabPaneProps.size), (0, _defineProperty2.default)(_classNames, "".concat(tabPanePrefixCls, "-disabled"), tabPaneProps.disabled), _classNames));
-  var tabPaneTextClasses = (0, _classnames.default)("".concat(tabPanePrefixCls, "-text"), (_classNames2 = {}, (0, _defineProperty2.default)(_classNames2, "".concat(tabPanePrefixCls, "-text-active"), String(tabPaneProps.activeKey) === String(id) && !tabPaneProps.disabled), (0, _defineProperty2.default)(_classNames2, "".concat(tabPanePrefixCls, "-text-disabled"), tabPaneProps.disabled), _classNames2));
+  var tabPaneBoxClasses = (0, _classnames.default)(tabPanePrefixCls, className, (_classNames = {}, (0, _defineProperty2.default)(_classNames, "".concat(tabPanePrefixCls, "-box-active"), String(tabPaneProps.activeKey) === String(id) && !tabPaneProps.disabled), (0, _defineProperty2.default)(_classNames, "".concat(tabPanePrefixCls, "-type-dynamic-notMobile"), !isMobile), (0, _defineProperty2.default)(_classNames, (0, _concat.default)(_context = "".concat(tabPanePrefixCls, "-type-")).call(_context, tabPaneProps.type), tabPaneProps.type), (0, _defineProperty2.default)(_classNames, (0, _concat.default)(_context2 = "".concat(tabPanePrefixCls, "-")).call(_context2, tabPaneProps.position), tabPaneProps.position), (0, _defineProperty2.default)(_classNames, (0, _concat.default)(_context3 = "".concat(tabPanePrefixCls, "-")).call(_context3, tabPaneProps.size), tabPaneProps.size), (0, _defineProperty2.default)(_classNames, "".concat(tabPanePrefixCls, "-disabled"), tabPaneProps.disabled), (0, _defineProperty2.default)(_classNames, "".concat(tabPanePrefixCls, "-notMobile"), !isMobile), (0, _defineProperty2.default)(_classNames, "".concat(tabPanePrefixCls, "-isMobile"), isMobile), _classNames));
+  var tabPaneTextClasses = (0, _classnames.default)("".concat(tabPanePrefixCls, "-text"), (_classNames2 = {}, (0, _defineProperty2.default)(_classNames2, "".concat(tabPanePrefixCls, "-text-active"), String(tabPaneProps.activeKey) === String(id) && !tabPaneProps.disabled), (0, _defineProperty2.default)(_classNames2, "".concat(tabPanePrefixCls, "-text-disabled"), tabPaneProps.disabled), (0, _defineProperty2.default)(_classNames2, "".concat(tabPanePrefixCls, "-text-notMobile"), !isMobile), _classNames2));
   var operationsClasses = (0, _classnames.default)("".concat(tabPanePrefixCls, "-operations"), (0, _defineProperty2.default)({}, "".concat(tabPanePrefixCls, "-operations-active"), String(tabPaneProps.activeKey) === String(id) && !tabPaneProps.disabled));
   var handleClick = function handleClick(e) {
     if (tabPaneProps.disabled) return;

package/lib/tabs/tabs.js

@@ -137,7 +137,14 @@ var Tabs = function Tabs(props) {
     isDragging.current = true;
   };
   var handleTouchMove = function handleTouchMove(e) {
+    var _a, _b;
     if (!isDragging.current || ListWidth <= boxWidth) return;
+    var path = ((_b = (_a = e.nativeEvent).composedPath) === null || _b === void 0 ? void 0 : _b.call(_a)) || [];
+    var isFromTabList = path.some(function (el) {
+      var _a, _b, _c;
+      return (_c = (_b = (_a = el) === null || _a === void 0 ? void 0 : _a.classList) === null || _b === void 0 ? void 0 : _b.contains) === null || _c === void 0 ? void 0 : _c.call(_b, "".concat(tabsPrefixCls, "-tab-list"));
+    });
+    if (!isFromTabList) return;
     var currentX = e.touches[0].clientX;
     var deltaX = currentX - touchStartX.current;
     var newPosition = lastListPosition.current + deltaX;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@kdcloudjs/kdesign",
-  "version": "1.8.50",
+  "version": "1.8.52",
   "description": "KDesign 金蝶前端react 组件库",
   "title": "kdesign",
   "keywords": [