@cashub/ui 0.40.4 → 0.40.5

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@cashub/ui",
-  "version": "0.40.4",
+  "version": "0.40.5",
   "private": false,
   "author": "CasHUB Team",
   "description": "CasHUB UI components library",

package/table/InfiniteGridTable.js

@@ -13,7 +13,7 @@ var _Resizer = _interopRequireDefault(require("./subComponent/Resizer"));
 var _Popover = _interopRequireDefault(require("../popover/Popover"));
 var _jsxRuntime = require("react/jsx-runtime");
 var _templateObject, _templateObject2, _templateObject3, _templateObject4;
-const _excluded = ["title", "fieldName", "render", "custom"];
+const _excluded = ["title", "fieldName", "render", "custom", "width"];
 function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
 function _taggedTemplateLiteral(e, t) { return t || (t = e.slice(0)), Object.freeze(Object.defineProperties(e, { raw: { value: Object.freeze(t) } })); }
 function _objectWithoutProperties(e, t) { if (null == e) return {}; var o, r, i = _objectWithoutPropertiesLoose(e, t); if (Object.getOwnPropertySymbols) { var s = Object.getOwnPropertySymbols(e); for (r = 0; r < s.length; r++) o = s[r], t.includes(o) || {}.propertyIsEnumerable.call(e, o) && (i[o] = e[o]); } return i; }
@@ -188,7 +188,8 @@ const InfiniteGridTable = _ref => {
             title,
             fieldName,
             render,
-            custom
+            custom,
+            width
           } = column,
           props = _objectWithoutProperties(column, _excluded);
         const key = rowIndex + columnIndex.toString();
@@ -206,7 +207,8 @@ const InfiniteGridTable = _ref => {
         }
         return /*#__PURE__*/(0, _jsxRuntime.jsx)(TD, _objectSpread(_objectSpread({
           "data-label": title,
-          backgroundReverse: backgroundReverse
+          backgroundReverse: backgroundReverse,
+          $width: width
         }, props), {}, {
           children: renderedData
         }), columnIndex);
@@ -294,26 +296,36 @@ const TableWrapper = _styledComponents.default.div(_templateObject || (_template
   return backgroundReverse ? 'var(--color-background1)' : 'var(--color-background2)';
 });
 const ResponsiveTable = _styledComponents.default.table(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n  /* make fixed width work */\n  position: relative;\n  width: 0px;\n  color: var(--font-on-background);\n  table-layout: fixed;\n  border-collapse: collapse;\n"])));
-const TD = _styledComponents.default.td(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n  height: 48px;\n  padding: 0 var(--spacing-xs);\n  border-top: 1px solid var(--border-color);\n  border-right: 1px solid var(--border-color);\n  border-bottom: 1px solid var(--border-color);\n  text-align: ", ";\n  background: ", ";\n\n  &:last-child {\n    border-right: none;\n    padding: 0;\n  }\n\n  > span {\n    display: inline-block;\n    width: 100%;\n    padding: 0 2px;\n    overflow: hidden;\n    white-space: pre;\n    text-overflow: ellipsis;\n  }\n"])), _ref3 => {
+const TD = _styledComponents.default.td(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n  width: ", ";\n  max-width: ", ";\n  height: 48px;\n  padding: 0 var(--spacing-xs);\n  border-top: 1px solid var(--border-color);\n  border-right: 1px solid var(--border-color);\n  border-bottom: 1px solid var(--border-color);\n  text-align: ", ";\n  background: ", ";\n\n  &:last-child {\n    border-right: none;\n    padding: 0;\n  }\n\n  > span {\n    display: inline-block;\n    width: 100%;\n    padding: 0 2px;\n    overflow: hidden;\n    white-space: pre;\n    text-overflow: ellipsis;\n  }\n"])), _ref3 => {
   let {
-    center
+    $width
   } = _ref3;
-  return center ? 'center' : 'left';
+  return $width;
 }, _ref4 => {
   let {
-    backgroundReverse
+    $width
   } = _ref4;
+  return $width;
+}, _ref5 => {
+  let {
+    center
+  } = _ref5;
+  return center ? 'center' : 'left';
+}, _ref6 => {
+  let {
+    backgroundReverse
+  } = _ref6;
   return backgroundReverse ? 'var(--color-background1)' : 'var(--color-background2)';
 });
-const Scrollbar = _styledComponents.default.div(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n  position: sticky;\n  bottom: 0;\n  width: 100%;\n  overflow: auto;\n  background: ", ";\n\n  ::before {\n    display: block;\n    content: '';\n    width: ", ";\n    height: 1px;\n  }\n\n  ", "\n"])), _ref5 => {
+const Scrollbar = _styledComponents.default.div(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n  position: sticky;\n  bottom: 0;\n  width: 100%;\n  overflow: auto;\n  background: ", ";\n\n  ::before {\n    display: block;\n    content: '';\n    width: ", ";\n    height: 1px;\n  }\n\n  ", "\n"])), _ref7 => {
   let {
     backgroundReverse
-  } = _ref5;
+  } = _ref7;
   return backgroundReverse ? 'var(--color-background1)' : 'var(--color-background2)';
-}, _ref6 => {
+}, _ref8 => {
   let {
     width
-  } = _ref6;
+  } = _ref8;
   return "".concat(width, "px");
 }, (0, _scrollbar.default)({
   size: 'large'

package/table/__mock__/columns.js

@@ -10,11 +10,13 @@ var _jsxRuntime = require("react/jsx-runtime");
 const columns = [{
   title: 'Name',
   fieldName: 'name',
-  sortable: true
+  sortable: true,
+  width: '400px'
 }, {
   title: 'Tag',
   fieldName: 'tag',
   sortable: false,
+  width: '150px',
   render(data) {
     return data.length > 0 && /*#__PURE__*/(0, _jsxRuntime.jsx)(_badge.Badge, {
       style: {