@xaypay/tui 0.0.111 → 0.0.112

package/dist/index.es.js

@@ -608,7 +608,8 @@ const TD = ({
       key: `${innerItem}_${innerItemIndex}`,
       className: styles$c['list-text'],
       style: {
-        color: openListColor
+        color: openListColor,
+        maxWidth: (item.content.length * 9 <= 100 ? 100 : item.content.length * 9) + 'px'
       },
       onClick: e => handleContentListClick(e, {
         item,
@@ -618,7 +619,7 @@ const TD = ({
         listContent: innerItem.content,
         listContentIndex: innerItemIndex
       })
-    }, innerItem.content.length >= item.content.length ? innerItem.content.substr(0, item.content.length - 4) + '...' : innerItem.content);
+    }, innerItem.content);
   })))) : '');
 };
 
@@ -1104,6 +1105,17 @@ const Table = ({
     };
     getData(moreData);
   };
+  const handleTableClick = () => {
+    const checkBodyMore = body.map(elemItem => {
+      return elemItem.map(elemInnerItem => {
+        if (Object.prototype.hasOwnProperty.call(elemInnerItem, 'dots')) {
+          elemInnerItem.dotsStatus = 'deActive';
+        }
+        return elemInnerItem;
+      });
+    });
+    setBody(() => checkBodyMore);
+  };
   useEffect(() => {
     let checkedItems = [];
     const disabledArray = [];
@@ -1170,7 +1182,8 @@ const Table = ({
     style: {
       width: '100%',
       borderCollapse: 'collapse'
-    }
+    },
+    onClick: handleTableClick
   }, header && header.length > 0 && /*#__PURE__*/React__default.createElement("thead", null, /*#__PURE__*/React__default.createElement("tr", {
     style: {
       color: tHeadColor ? tHeadColor : configStyles.TABLE.tHeadColor,
@@ -3368,7 +3381,7 @@ for (let i = 0; i < 256; ++i) {
 function unsafeStringify(arr, offset = 0) {
   // Note: Be careful editing this code!  It's been tuned for performance
   // and works in ways you may not expect. See https://github.com/uuidjs/uuid/pull/434
-  return (byteToHex[arr[offset + 0]] + byteToHex[arr[offset + 1]] + byteToHex[arr[offset + 2]] + byteToHex[arr[offset + 3]] + '-' + byteToHex[arr[offset + 4]] + byteToHex[arr[offset + 5]] + '-' + byteToHex[arr[offset + 6]] + byteToHex[arr[offset + 7]] + '-' + byteToHex[arr[offset + 8]] + byteToHex[arr[offset + 9]] + '-' + byteToHex[arr[offset + 10]] + byteToHex[arr[offset + 11]] + byteToHex[arr[offset + 12]] + byteToHex[arr[offset + 13]] + byteToHex[arr[offset + 14]] + byteToHex[arr[offset + 15]]).toLowerCase();
+  return byteToHex[arr[offset + 0]] + byteToHex[arr[offset + 1]] + byteToHex[arr[offset + 2]] + byteToHex[arr[offset + 3]] + '-' + byteToHex[arr[offset + 4]] + byteToHex[arr[offset + 5]] + '-' + byteToHex[arr[offset + 6]] + byteToHex[arr[offset + 7]] + '-' + byteToHex[arr[offset + 8]] + byteToHex[arr[offset + 9]] + '-' + byteToHex[arr[offset + 10]] + byteToHex[arr[offset + 11]] + byteToHex[arr[offset + 12]] + byteToHex[arr[offset + 13]] + byteToHex[arr[offset + 14]] + byteToHex[arr[offset + 15]];
 }
 
 const randomUUID = typeof crypto !== 'undefined' && crypto.randomUUID && crypto.randomUUID.bind(crypto);
@@ -4389,6 +4402,9 @@ const Textarea = ({
     if (!onChange) {
       alert('Please add onChange function on Textarea component');
     }
+    if (value === '') {
+      setError('');
+    }
     setInnerValue(value);
   }, [value, onChange]);
   useEffect(() => {

package/dist/index.js

@@ -638,7 +638,8 @@ const TD = ({
       key: `${innerItem}_${innerItemIndex}`,
       className: styles$c['list-text'],
       style: {
-        color: openListColor
+        color: openListColor,
+        maxWidth: (item.content.length * 9 <= 100 ? 100 : item.content.length * 9) + 'px'
       },
       onClick: e => handleContentListClick(e, {
         item,
@@ -648,7 +649,7 @@ const TD = ({
         listContent: innerItem.content,
         listContentIndex: innerItemIndex
       })
-    }, innerItem.content.length >= item.content.length ? innerItem.content.substr(0, item.content.length - 4) + '...' : innerItem.content);
+    }, innerItem.content);
   })))) : '');
 };
 
@@ -1134,6 +1135,17 @@ const Table = ({
     };
     getData(moreData);
   };
+  const handleTableClick = () => {
+    const checkBodyMore = body.map(elemItem => {
+      return elemItem.map(elemInnerItem => {
+        if (Object.prototype.hasOwnProperty.call(elemInnerItem, 'dots')) {
+          elemInnerItem.dotsStatus = 'deActive';
+        }
+        return elemInnerItem;
+      });
+    });
+    setBody(() => checkBodyMore);
+  };
   React.useEffect(() => {
     let checkedItems = [];
     const disabledArray = [];
@@ -1200,7 +1212,8 @@ const Table = ({
     style: {
       width: '100%',
       borderCollapse: 'collapse'
-    }
+    },
+    onClick: handleTableClick
   }, header && header.length > 0 && /*#__PURE__*/React__default["default"].createElement("thead", null, /*#__PURE__*/React__default["default"].createElement("tr", {
     style: {
       color: tHeadColor ? tHeadColor : configStyles.TABLE.tHeadColor,
@@ -3398,7 +3411,7 @@ for (let i = 0; i < 256; ++i) {
 function unsafeStringify(arr, offset = 0) {
   // Note: Be careful editing this code!  It's been tuned for performance
   // and works in ways you may not expect. See https://github.com/uuidjs/uuid/pull/434
-  return (byteToHex[arr[offset + 0]] + byteToHex[arr[offset + 1]] + byteToHex[arr[offset + 2]] + byteToHex[arr[offset + 3]] + '-' + byteToHex[arr[offset + 4]] + byteToHex[arr[offset + 5]] + '-' + byteToHex[arr[offset + 6]] + byteToHex[arr[offset + 7]] + '-' + byteToHex[arr[offset + 8]] + byteToHex[arr[offset + 9]] + '-' + byteToHex[arr[offset + 10]] + byteToHex[arr[offset + 11]] + byteToHex[arr[offset + 12]] + byteToHex[arr[offset + 13]] + byteToHex[arr[offset + 14]] + byteToHex[arr[offset + 15]]).toLowerCase();
+  return byteToHex[arr[offset + 0]] + byteToHex[arr[offset + 1]] + byteToHex[arr[offset + 2]] + byteToHex[arr[offset + 3]] + '-' + byteToHex[arr[offset + 4]] + byteToHex[arr[offset + 5]] + '-' + byteToHex[arr[offset + 6]] + byteToHex[arr[offset + 7]] + '-' + byteToHex[arr[offset + 8]] + byteToHex[arr[offset + 9]] + '-' + byteToHex[arr[offset + 10]] + byteToHex[arr[offset + 11]] + byteToHex[arr[offset + 12]] + byteToHex[arr[offset + 13]] + byteToHex[arr[offset + 14]] + byteToHex[arr[offset + 15]];
 }
 
 const randomUUID = typeof crypto !== 'undefined' && crypto.randomUUID && crypto.randomUUID.bind(crypto);
@@ -4419,6 +4432,9 @@ const Textarea = ({
     if (!onChange) {
       alert('Please add onChange function on Textarea component');
     }
+    if (value === '') {
+      setError('');
+    }
     setInnerValue(value);
   }, [value, onChange]);
   React.useEffect(() => {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@xaypay/tui",
-  "version": "0.0.111",
+  "version": "0.0.112",
   "description": "",
   "main": "dist/index.js",
   "module": "dist/index.es.js",

package/src/components/table/index.js

@@ -484,6 +484,18 @@ export const Table = ({
         getData(moreData)
     }
 
+    const handleTableClick = () => {
+        const checkBodyMore = body.map((elemItem) => {
+            return elemItem.map((elemInnerItem) => {
+                if (Object.prototype.hasOwnProperty.call(elemInnerItem, 'dots')) {
+                    elemInnerItem.dotsStatus = 'deActive'
+                }
+                return elemInnerItem
+            })
+        })
+        setBody(() => checkBodyMore)
+    }
+
     useEffect(() => {
         let checkedItems = []
         const disabledArray = []
@@ -560,6 +572,7 @@ export const Table = ({
                     width: '100%',
                     borderCollapse: 'collapse',
                 }}
+                onClick={handleTableClick}
             >
                 {header && header.length > 0 && (
                     <thead>

package/src/components/table/table.stories.js

@@ -435,16 +435,7 @@ const Template = (args) => {
         console.log(tData, ' data from table click action, with getData props')
     }
 
-    return (
-        <Table
-            {...args}
-            arrowShow
-            arrowColumn={3}
-            dataBody={bodyData}
-            dataHeader={headerData}
-            getData={handleGetData}
-        />
-    )
+    return <Table {...args} dataBody={bodyData} dataHeader={headerData} getData={handleGetData} />
 }
 
 export const Default = Template.bind({})

package/src/components/table/td.js

@@ -295,6 +295,9 @@ const TD = ({
                                             className={styles['list-text']}
                                             style={{
                                                 color: openListColor,
+                                                maxWidth:
+                                                    (item.content.length * 9 <= 100 ? 100 : item.content.length * 9) +
+                                                    'px',
                                             }}
                                             onClick={(e) =>
                                                 handleContentListClick(e, {
@@ -307,9 +310,7 @@ const TD = ({
                                                 })
                                             }
                                         >
-                                            {innerItem.content.length >= item.content.length
-                                                ? innerItem.content.substr(0, item.content.length - 4) + '...'
-                                                : innerItem.content}
+                                            {innerItem.content}
                                         </p>
                                     )
                                 })}

package/src/components/textarea/index.js

@@ -93,6 +93,10 @@ export const Textarea = ({
             alert('Please add onChange function on Textarea component')
         }
 
+        if (value === '') {
+            setError('')
+        }
+
         setInnerValue(value)
     }, [value, onChange])