npm - @hw-component/table - Versions diffs - 1.10.28 → 1.10.30 - Mend

@hw-component/table 1.10.28 → 1.10.30

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (6) hide show

package/es/render/TagsComponent.d.ts +2 -0
package/es/render/TagsComponent.js +31 -7
package/lib/render/TagsComponent.d.ts +2 -0
package/lib/render/TagsComponent.js +30 -5
package/package.json +1 -1
package/src/components/render/TagsComponent.tsx +18 -3

package/es/render/TagsComponent.d.ts CHANGED Viewed

@@ -19,6 +19,8 @@ interface IProps {
     popoverContentRender?: (node: React.ReactNode) => React.ReactNode;
     contentItemRender?: (item: any) => React.ReactNode;
     extra?: React.ReactNode;
+    tagStyle?: React.CSSProperties;
 }
+export declare const Text: React.FC;
 declare const TagsComponent: (props: IProps) => JSX.Element;
 export default TagsComponent;

package/es/render/TagsComponent.js CHANGED Viewed

@@ -14,7 +14,7 @@ import _defineProperty from '@babel/runtime-corejs3/helpers/defineProperty';
 import _sliceInstanceProperty from '@babel/runtime-corejs3/core-js-stable/instance/slice';
 import _mapInstanceProperty from '@babel/runtime-corejs3/core-js-stable/instance/map';
 import { jsxs, jsx } from 'react/jsx-runtime';
-import { Row, Tooltip, Tag, Popover } from 'antd';
+import { Row, Tooltip, Tag, Popover, Typography } from 'antd';
 import { useMemo } from 'react';
 var _excluded = ["contentItemRender"];
@@ -41,6 +41,15 @@ var getTooltipProps = function getTooltipProps(item, tooltip) {
     title: title
   });
 };
+var Text = function Text(_ref) {
+  var children = _ref.children;
+  return jsx(Typography.Text, {
+    ellipsis: {
+      tooltip: children
+    },
+    children: children
+  });
+};
 var TagsComponent = function TagsComponent(props) {
   var data = props.data,
     closable = props.closable,
@@ -53,7 +62,8 @@ var TagsComponent = function TagsComponent(props) {
     tableInstance = props.tableInstance,
     maxLen = props.maxLen,
     popoverContentRender = props.popoverContentRender,
-    extra = props.extra;
+    extra = props.extra,
+    tagStyle = props.tagStyle;
   var _fieldNames$label = fieldNames.label,
     label = _fieldNames$label === void 0 ? "label" : _fieldNames$label,
     _fieldNames$value = fieldNames.value,
@@ -91,13 +101,20 @@ var TagsComponent = function TagsComponent(props) {
         var _tooltipProps = getTooltipProps({
           title: tagItem
         }, tooltip);
+        var _tagNode = jsx(Text, {
+          children: tagItem
+        });
         return jsx(Tooltip, _objectSpread(_objectSpread({}, _tooltipProps), {}, {
-          children: jsx(Tag, _objectSpread(_objectSpread({}, tagProps), {}, {
+          children: jsx(Tag, _objectSpread(_objectSpread({
+            style: _objectSpread({
+              maxWidth: "100%"
+            }, tagStyle)
+          }, tagProps), {}, {
             onClose: function onClose(e) {
               e.preventDefault();
               _onClose === null || _onClose === void 0 || _onClose(indexKey, tableInstance);
             },
-            children: contentItemRender ? contentItemRender(tagItem) : tagItem
+            children: contentItemRender ? contentItemRender(_tagNode) : _tagNode
           }), indexKey)
         }));
       }
@@ -110,13 +127,20 @@ var TagsComponent = function TagsComponent(props) {
       }, itemProps), tooltip);
       var cuTagProps = _objectSpread(_objectSpread({}, tagProps), itemProps);
       var cuKey = tagValue || indexKey;
+      var tagNode = jsx(Text, {
+        children: tagLabel
+      });
       return jsx(Tooltip, _objectSpread(_objectSpread({}, tooltipProps), {}, {
-        children: jsx(Tag, _objectSpread(_objectSpread({}, cuTagProps), {}, {
+        children: jsx(Tag, _objectSpread(_objectSpread({
+          style: _objectSpread({
+            maxWidth: "100%"
+          }, tagStyle)
+        }, cuTagProps), {}, {
           onClose: function onClose(e) {
             e.preventDefault();
             cuTagProps === null || cuTagProps === void 0 || cuTagProps.onClose(cuKey, tableInstance);
           },
-          children: contentItemRender ? contentItemRender(tagLabel) : tagLabel
+          children: contentItemRender ? tagNode : tagNode
         }), cuKey)
       }));
     }), !moreLen ? null : jsx(Popover, {
@@ -134,5 +158,5 @@ var TagsComponent = function TagsComponent(props) {
   });
 };
-export { TagsComponent as default };
+export { Text, TagsComponent as default };
 // powered by hdj

package/lib/render/TagsComponent.d.ts CHANGED Viewed

@@ -19,6 +19,8 @@ interface IProps {
     popoverContentRender?: (node: React.ReactNode) => React.ReactNode;
     contentItemRender?: (item: any) => React.ReactNode;
     extra?: React.ReactNode;
+    tagStyle?: React.CSSProperties;
 }
+export declare const Text: React.FC;
 declare const TagsComponent: (props: IProps) => JSX.Element;
 export default TagsComponent;

package/lib/render/TagsComponent.js CHANGED Viewed

@@ -44,6 +44,15 @@ var getTooltipProps = function getTooltipProps(item, tooltip) {
     title: title
   });
 };
+var Text = function Text(_ref) {
+  var children = _ref.children;
+  return jsxRuntime.jsx(antd.Typography.Text, {
+    ellipsis: {
+      tooltip: children
+    },
+    children: children
+  });
+};
 var TagsComponent = function TagsComponent(props) {
   var data = props.data,
     closable = props.closable,
@@ -56,7 +65,8 @@ var TagsComponent = function TagsComponent(props) {
     tableInstance = props.tableInstance,
     maxLen = props.maxLen,
     popoverContentRender = props.popoverContentRender,
-    extra = props.extra;
+    extra = props.extra,
+    tagStyle = props.tagStyle;
   var _fieldNames$label = fieldNames.label,
     label = _fieldNames$label === void 0 ? "label" : _fieldNames$label,
     _fieldNames$value = fieldNames.value,
@@ -94,13 +104,20 @@ var TagsComponent = function TagsComponent(props) {
         var _tooltipProps = getTooltipProps({
           title: tagItem
         }, tooltip);
+        var _tagNode = jsxRuntime.jsx(Text, {
+          children: tagItem
+        });
         return jsxRuntime.jsx(antd.Tooltip, _objectSpread(_objectSpread({}, _tooltipProps), {}, {
-          children: jsxRuntime.jsx(antd.Tag, _objectSpread(_objectSpread({}, tagProps), {}, {
+          children: jsxRuntime.jsx(antd.Tag, _objectSpread(_objectSpread({
+            style: _objectSpread({
+              maxWidth: "100%"
+            }, tagStyle)
+          }, tagProps), {}, {
             onClose: function onClose(e) {
               e.preventDefault();
               _onClose === null || _onClose === void 0 || _onClose(indexKey, tableInstance);
             },
-            children: contentItemRender ? contentItemRender(tagItem) : tagItem
+            children: contentItemRender ? contentItemRender(_tagNode) : _tagNode
           }), indexKey)
         }));
       }
@@ -113,13 +130,20 @@ var TagsComponent = function TagsComponent(props) {
       }, itemProps), tooltip);
       var cuTagProps = _objectSpread(_objectSpread({}, tagProps), itemProps);
       var cuKey = tagValue || indexKey;
+      var tagNode = jsxRuntime.jsx(Text, {
+        children: tagLabel
+      });
       return jsxRuntime.jsx(antd.Tooltip, _objectSpread(_objectSpread({}, tooltipProps), {}, {
-        children: jsxRuntime.jsx(antd.Tag, _objectSpread(_objectSpread({}, cuTagProps), {}, {
+        children: jsxRuntime.jsx(antd.Tag, _objectSpread(_objectSpread({
+          style: _objectSpread({
+            maxWidth: "100%"
+          }, tagStyle)
+        }, cuTagProps), {}, {
           onClose: function onClose(e) {
             e.preventDefault();
             cuTagProps === null || cuTagProps === void 0 || cuTagProps.onClose(cuKey, tableInstance);
           },
-          children: contentItemRender ? contentItemRender(tagLabel) : tagLabel
+          children: contentItemRender ? tagNode : tagNode
         }), cuKey)
       }));
     }), !moreLen ? null : jsxRuntime.jsx(antd.Popover, {
@@ -137,5 +161,6 @@ var TagsComponent = function TagsComponent(props) {
   });
 };
+exports.Text = Text;
 exports.default = TagsComponent;
 // powered by h

package/package.json CHANGED Viewed

@@ -1,6 +1,6 @@
 {
   "name": "@hw-component/table",
-  "version": "1.10.28",
+  "version": "1.10.30",
   "description": "基于antd二次开发table组件",
   "keywords": [
     "table"

package/src/components/render/TagsComponent.tsx CHANGED Viewed

@@ -1,4 +1,4 @@
-import { Row, Tag, Tooltip, Popover } from "antd";
+import {Row, Tag, Tooltip, Popover, Typography} from "antd";
 import React, { useMemo } from "react";
 import type { TooltipProps } from "antd/lib/tooltip";
 import type { HTableInstance } from "../modal";
@@ -19,6 +19,7 @@ interface IProps {
   popoverContentRender?: (node: React.ReactNode) => React.ReactNode;
   contentItemRender?: (item: any) => React.ReactNode;
   extra?: React.ReactNode;
+  tagStyle?: React.CSSProperties;
 }
 const getTooltipProps = (
   item: any,
@@ -43,6 +44,9 @@ const getTooltipProps = (
     title,
   };
 };
+export const Text:React.FC=({children})=>{
+  return <Typography.Text ellipsis={{tooltip:children}}>{children}</Typography.Text>
+}
 const TagsComponent = (props: IProps) => {
   const {
     data,
@@ -56,6 +60,7 @@ const TagsComponent = (props: IProps) => {
     maxLen,
     popoverContentRender,
     extra,
+    tagStyle
   } = props;
   const { label = "label", value = "value" } = fieldNames;
   const { tagData, moreTag } = useMemo(() => {
@@ -85,17 +90,22 @@ const TagsComponent = (props: IProps) => {
         const indexKey = index.toString();
         if (typeof tagItem === "string") {
           const tooltipProps = getTooltipProps({ title: tagItem }, tooltip);
+          const tagNode=<Text>{tagItem}</Text>
           return (
             <Tooltip {...tooltipProps}>
               <Tag
                 key={indexKey}
+                style={{
+                  maxWidth: "100%",
+                  ...tagStyle
+                }}
                 {...tagProps}
                 onClose={(e) => {
                   e.preventDefault();
                   onClose?.(indexKey, tableInstance);
                 }}
               >
-                {contentItemRender ? contentItemRender(tagItem) : tagItem}
+                {contentItemRender ? contentItemRender(tagNode) : tagNode}
               </Tag>
             </Tooltip>
           );
@@ -110,17 +120,22 @@ const TagsComponent = (props: IProps) => {
           ...itemProps,
         };
         const cuKey = tagValue || indexKey;
+        const tagNode=<Text>{tagLabel}</Text>
         return (
           <Tooltip {...tooltipProps}>
             <Tag
               key={cuKey}
+              style={{
+                maxWidth: "100%",
+                ...tagStyle
+              }}
               {...cuTagProps}
               onClose={(e) => {
                 e.preventDefault();
                 cuTagProps?.onClose(cuKey, tableInstance);
               }}
             >
-              {contentItemRender ? contentItemRender(tagLabel) : tagLabel}
+              {contentItemRender ? tagNode : tagNode}
             </Tag>
           </Tooltip>
         );