linear-react-components-ui 0.4.77-beta.23 → 0.4.77-beta.26

package/lib/table/table.spec.js

@@ -1,350 +1,295 @@
 "use strict";
 
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
-var _typeof = require("@babel/runtime/helpers/typeof");
-
-var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
-
+function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, _typeof(obj); }
 var _react = _interopRequireDefault(require("react"));
-
 var _react2 = require("@testing-library/react");
-
 require("@testing-library/jest-dom/extend-expect");
-
-var _ = _interopRequireWildcard(require("./"));
-
+var _ = _interopRequireWildcard(require("."));
 function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
-
-function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
-
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
 var mockTable = function mockTable(propsTable, propsTRow, propsTh, propsTd) {
-  return /*#__PURE__*/_react["default"].createElement(_["default"], (0, _extends2["default"])({
+  return /*#__PURE__*/_react.default.createElement(_.default, _extends({
     customClass: "mock-table"
-  }, propsTable), /*#__PURE__*/_react["default"].createElement(_.THeader, {
+  }, propsTable), /*#__PURE__*/_react.default.createElement(_.THeader, {
     customClass: "mock-theader"
-  }, /*#__PURE__*/_react["default"].createElement(_.TRow, (0, _extends2["default"])({
+  }, /*#__PURE__*/_react.default.createElement(_.TRow, _extends({
     customClass: "mock-trow",
     height: "64px",
     rowId: "mock-rowId",
     dataId: 1,
     color: "primary"
-  }, propsTRow), /*#__PURE__*/_react["default"].createElement(_.Th, (0, _extends2["default"])({
+  }, propsTRow), /*#__PURE__*/_react.default.createElement(_.Th, _extends({
     customClass: "mock-th",
     textAlign: "center",
     style: {
       backgroundColor: 'red'
     }
-  }, propsTh), "Nome"), /*#__PURE__*/_react["default"].createElement(_.Th, (0, _extends2["default"])({
+  }, propsTh), "Nome"), /*#__PURE__*/_react.default.createElement(_.Th, _extends({
     customClass: "mock-th"
-  }, propsTh), "Idade"))), /*#__PURE__*/_react["default"].createElement(_.TBody, {
+  }, propsTh), "Idade"))), /*#__PURE__*/_react.default.createElement(_.TBody, {
     customClass: "mock-tbody"
-  }, /*#__PURE__*/_react["default"].createElement(_.TRow, (0, _extends2["default"])({
+  }, /*#__PURE__*/_react.default.createElement(_.TRow, _extends({
     customClass: "mock-trow"
-  }, propsTRow), /*#__PURE__*/_react["default"].createElement(_.Td, (0, _extends2["default"])({
+  }, propsTRow), /*#__PURE__*/_react.default.createElement(_.Td, _extends({
     textAlign: "center",
     style: {
       backgroundColor: 'red'
     },
     customClass: "mock-td"
-  }, propsTd), "Fulano"), /*#__PURE__*/_react["default"].createElement(_.Td, (0, _extends2["default"])({
+  }, propsTd), "Fulano"), /*#__PURE__*/_react.default.createElement(_.Td, _extends({
     customClass: "mock-td"
-  }, propsTd), "20")), /*#__PURE__*/_react["default"].createElement(_.TRow, (0, _extends2["default"])({
+  }, propsTd), "20")), /*#__PURE__*/_react.default.createElement(_.TRow, _extends({
     customClass: "mock-trow"
-  }, propsTRow), /*#__PURE__*/_react["default"].createElement(_.Td, (0, _extends2["default"])({
+  }, propsTRow), /*#__PURE__*/_react.default.createElement(_.Td, _extends({
     customClass: "mock-td"
-  }, propsTd), "Ciclano"), /*#__PURE__*/_react["default"].createElement(_.Td, (0, _extends2["default"])({
+  }, propsTd), "Ciclano"), /*#__PURE__*/_react.default.createElement(_.Td, _extends({
     customClass: "mock-td"
   }, propsTd), "30"))));
 };
-
 describe('Table', function () {
   it('should render correctly', function () {
-    var _render = (0, _react2.render)(mockTable()),
-        container = _render.container;
-
+    var _render = (0, _react2.render)(mockTable({}, {}, {}, {})),
+      container = _render.container;
     expect(container.firstChild).toBeTruthy();
   });
   it('should render children with THeader, TBody, TRow, Th and Td', function () {
-    var _render2 = (0, _react2.render)(mockTable()),
-        container = _render2.container;
-
+    var _render2 = (0, _react2.render)(mockTable({}, {}, {}, {})),
+      container = _render2.container;
     expect(container.firstChild).toContainElement(container.querySelector('.tbody'));
     expect(container.firstChild).toContainElement(container.querySelector('.theader'));
     expect(container.firstChild).toContainElement(container.querySelector('.trow'));
   });
   it('should apply custom class', function () {
-    var _render3 = (0, _react2.render)(mockTable()),
-        container = _render3.container;
-
+    var _render3 = (0, _react2.render)(mockTable({}, {}, {}, {})),
+      container = _render3.container;
     expect(container.firstChild).toHaveClass('mock-table');
   });
   it('should apply striped', function () {
     var _render4 = (0, _react2.render)(mockTable({
-      striped: true
-    })),
-        container = _render4.container;
-
+        striped: true
+      }, {}, {}, {})),
+      container = _render4.container;
     expect(container.firstChild).toHaveClass('-striped');
   });
   it('should apply bordered', function () {
     var _render5 = (0, _react2.render)(mockTable({
-      bordered: true
-    })),
-        container = _render5.container;
-
+        bordered: true
+      }, {}, {}, {})),
+      container = _render5.container;
     expect(container.firstChild).toHaveClass('-bordered');
   });
   it('should apply condensed', function () {
     var _render6 = (0, _react2.render)(mockTable({
-      condensed: true
-    })),
-        container = _render6.container;
-
+        condensed: true
+      }, {}, {}, {})),
+      container = _render6.container;
     expect(container.firstChild).toHaveClass('-condensed');
   });
   it('should apply hovered', function () {
     var _render7 = (0, _react2.render)(mockTable({
-      hovered: true
-    })),
-        container = _render7.container;
-
+        hovered: true
+      }, {}, {}, {})),
+      container = _render7.container;
     expect(container.firstChild).toHaveClass('-hovered');
   });
   it('should apply headerColored', function () {
     var _render8 = (0, _react2.render)(mockTable({
-      headerColored: true
-    })),
-        container = _render8.container;
-
+        headerColored: true
+      }, {}, {}, {})),
+      container = _render8.container;
     expect(container.firstChild).toHaveClass('-headercolor');
   });
   it('should apply bodyScrollable', function () {
     var _render9 = (0, _react2.render)(mockTable({
-      bodyScrollable: true
-    })),
-        container = _render9.container;
-
+        bodyScrollable: true
+      }, {}, {}, {})),
+      container = _render9.container;
     expect(container.firstChild).toHaveClass('-scrollable');
   });
   it('should apply vertical', function () {
     var _render10 = (0, _react2.render)(mockTable({
-      vertical: true
-    })),
-        container = _render10.container;
-
+        vertical: true
+      }, {}, {}, {})),
+      container = _render10.container;
     expect(container.firstChild).toHaveClass('-vertical');
   });
   it('should fire event on row click', function () {
     var mockOnClick = jest.fn();
-
     var _render11 = (0, _react2.render)(mockTable({
-      onRowClick: mockOnClick
-    })),
-        container = _render11.container;
-
+        onRowClick: mockOnClick
+      }, {}, {}, {})),
+      container = _render11.container;
     _react2.fireEvent.click(container.querySelectorAll('.trow')[0]);
-
     expect(mockOnClick).toBeCalledTimes(1);
   });
   it('should fire event on column click', function () {
     var mockOnClick = jest.fn();
-
     var _render12 = (0, _react2.render)(mockTable({
-      onColClick: mockOnClick
-    })),
-        container = _render12.container;
-
+        onColClick: mockOnClick
+      }, {}, {}, {})),
+      container = _render12.container;
     _react2.fireEvent.click(container.querySelectorAll('.rowcolumn')[0]);
-
     expect(mockOnClick).toBeCalledTimes(1);
   });
   describe('TRow', function () {
     it('should render correctly', function () {
-      var _render13 = (0, _react2.render)(mockTable()),
-          container = _render13.container;
-
+      var _render13 = (0, _react2.render)(mockTable({}, {}, {}, {})),
+        container = _render13.container;
       expect(container.querySelector('.trow')).toBeInTheDocument();
       expect(container.querySelectorAll('.trow').length).toBe(3);
     });
     it('should apply custom class', function () {
-      var _render14 = (0, _react2.render)(mockTable()),
-          container = _render14.container;
-
+      var _render14 = (0, _react2.render)(mockTable({}, {}, {}, {})),
+        container = _render14.container;
       expect(container.querySelector('.trow')).toHaveClass('mock-trow');
     });
     it('should change height', function () {
-      var _render15 = (0, _react2.render)(mockTable()),
-          container = _render15.container;
-
+      var _render15 = (0, _react2.render)(mockTable({}, {}, {}, {})),
+        container = _render15.container;
       expect(container.querySelector('.trow')).toHaveStyle('height: 64px;');
     });
     it('should apply row id', function () {
-      var _render16 = (0, _react2.render)(mockTable()),
-          container = _render16.container;
-
+      var _render16 = (0, _react2.render)(mockTable({}, {}, {}, {})),
+        container = _render16.container;
       expect(container.querySelector('.trow')).toHaveAttribute('id', 'mock-rowId');
     });
     it('should apply -noborder class', function () {
       var _render17 = (0, _react2.render)(mockTable({}, {
-        rowBorder: false
-      })),
-          container = _render17.container;
-
+          rowBorder: false
+        }, {}, {})),
+        container = _render17.container;
       expect(container.querySelector('.trow .rowcolumn')).toHaveClass('-noborder');
     });
     it('should fire event on row click', function () {
       var mockOnClick = jest.fn();
-
       var _render18 = (0, _react2.render)(mockTable({}, {
-        onClick: mockOnClick
-      })),
-          container = _render18.container;
-
+          onClick: mockOnClick
+        }, {}, {})),
+        container = _render18.container;
       _react2.fireEvent.click(container.querySelectorAll('.trow')[0]);
-
       expect(mockOnClick).toBeCalledTimes(1);
     });
   });
   describe('THeader', function () {
     it('should apply custom class', function () {
-      var _render19 = (0, _react2.render)(mockTable()),
-          container = _render19.container;
-
+      var _render19 = (0, _react2.render)(mockTable({}, {}, {}, {})),
+        container = _render19.container;
       expect(container.querySelector('.theader')).toHaveClass('mock-theader');
     });
     it('should render children', function () {
-      var _render20 = (0, _react2.render)(mockTable()),
-          container = _render20.container;
-
+      var _render20 = (0, _react2.render)(mockTable({}, {}, {}, {})),
+        container = _render20.container;
       expect(container.querySelector('.theader')).toContainElement(container.querySelector('.headercolumn'));
       expect(container.querySelectorAll('.headercolumn').length).toBe(2);
     });
     describe('Th', function () {
       it('should render correctly', function () {
-        var _render21 = (0, _react2.render)(mockTable()),
-            container = _render21.container;
-
+        var _render21 = (0, _react2.render)(mockTable({}, {}, {}, {})),
+          container = _render21.container;
         expect(container.querySelectorAll('.headercolumn')[0]).toHaveTextContent('Nome');
         expect(container.querySelectorAll('.headercolumn')[1]).toHaveTextContent('Idade');
       });
       it('should apply custom class', function () {
-        var _render22 = (0, _react2.render)(mockTable()),
-            container = _render22.container;
-
+        var _render22 = (0, _react2.render)(mockTable({}, {}, {}, {})),
+          container = _render22.container;
         expect(container.querySelectorAll('.headercolumn')[0]).toHaveClass('mock-th');
       });
       it('should change text align', function () {
-        var _render23 = (0, _react2.render)(mockTable()),
-            container = _render23.container;
-
+        var _render23 = (0, _react2.render)(mockTable({}, {}, {}, {})),
+          container = _render23.container;
         expect(container.querySelectorAll('.headercolumn')[0]).toHaveClass('text-align-center');
       });
       it('should apply style', function () {
-        var _render24 = (0, _react2.render)(mockTable()),
-            container = _render24.container;
-
+        var _render24 = (0, _react2.render)(mockTable({}, {}, {}, {})),
+          container = _render24.container;
         expect(container.querySelectorAll('.headercolumn')[0]).toHaveStyle('background-color: red;');
       });
       it('should hide component', function () {
         var _render25 = (0, _react2.render)(mockTable({}, {}, {
-          visible: false
-        })),
-            container = _render25.container;
-
+            visible: false
+          }, {})),
+          container = _render25.container;
         expect(container.querySelector('.headercolumn')).not.toBeInTheDocument();
       });
     });
   });
   describe('TBody', function () {
     it('should apply custom class', function () {
-      var _render26 = (0, _react2.render)(mockTable()),
-          container = _render26.container;
-
+      var _render26 = (0, _react2.render)(mockTable({}, {}, {}, {})),
+        container = _render26.container;
       expect(container.querySelector('.tbody')).toHaveClass('mock-tbody');
     });
     it('should render children', function () {
-      var _render27 = (0, _react2.render)(mockTable()),
-          container = _render27.container;
-
+      var _render27 = (0, _react2.render)(mockTable({}, {}, {}, {})),
+        container = _render27.container;
       expect(container.querySelector('.tbody')).toContainElement(container.querySelector('.rowcolumn'));
       expect(container.querySelectorAll('.rowcolumn').length).toBe(4);
     });
     describe('Td', function () {
       it('should apply custom class', function () {
-        var _render28 = (0, _react2.render)(mockTable()),
-            container = _render28.container;
-
+        var _render28 = (0, _react2.render)(mockTable({}, {}, {}, {})),
+          container = _render28.container;
         expect(container.querySelector('.rowcolumn')).toHaveClass('mock-td');
       });
       it('should render correctly', function () {
-        var _render29 = (0, _react2.render)(mockTable()),
-            container = _render29.container;
-
+        var _render29 = (0, _react2.render)(mockTable({}, {}, {}, {})),
+          container = _render29.container;
         expect(container.querySelectorAll('.rowcolumn')[0]).toHaveTextContent('Fulano');
         expect(container.querySelectorAll('.rowcolumn')[1]).toHaveTextContent('20');
         expect(container.querySelectorAll('.rowcolumn')[2]).toHaveTextContent('Ciclano');
         expect(container.querySelectorAll('.rowcolumn')[3]).toHaveTextContent('30');
       });
       it('should change text align', function () {
-        var _render30 = (0, _react2.render)(mockTable()),
-            container = _render30.container;
-
+        var _render30 = (0, _react2.render)(mockTable({}, {}, {}, {})),
+          container = _render30.container;
         expect(container.querySelectorAll('.rowcolumn')[0]).toHaveClass('text-align-center');
       });
       it('should apply style', function () {
-        var _render31 = (0, _react2.render)(mockTable()),
-            container = _render31.container;
-
+        var _render31 = (0, _react2.render)(mockTable({}, {}, {}, {})),
+          container = _render31.container;
         expect(container.querySelectorAll('.rowcolumn')[0]).toHaveStyle('background-color: red;');
       });
       it('should fire event on click', function () {
         var mockOnClick = jest.fn();
-
         var _render32 = (0, _react2.render)(mockTable({}, {}, {}, {
-          onClick: mockOnClick
-        })),
-            container = _render32.container;
-
+            onClick: mockOnClick,
+            dataId: 10
+          })),
+          container = _render32.container;
         _react2.fireEvent.click(container.querySelectorAll('.rowcolumn')[0]);
-
         expect(mockOnClick).toBeCalledTimes(1);
       });
       it('should not fire event on click', function () {
         var mockOnClick = jest.fn();
-
         var _render33 = (0, _react2.render)(mockTable({}, {}, {}, {
-          onClick: mockOnClick,
-          ignoreTableColClick: true
-        })),
-            container = _render33.container;
-
+            onClick: mockOnClick,
+            ignoreTableColClick: true
+          })),
+          container = _render33.container;
         _react2.fireEvent.click(container.querySelectorAll('.rowcolumn')[0]);
-
         expect(mockOnClick).toBeCalledTimes(0);
       });
       it('should hide content', function () {
         var _render34 = (0, _react2.render)(mockTable({}, {}, {}, {
-          displayContent: 'never'
-        })),
-            container = _render34.container;
-
+            displayContent: 'never'
+          })),
+          container = _render34.container;
         expect(container.querySelectorAll('.rowcolumn')[0]).toContainElement(container.querySelector('.rowcolumn .hidden'));
       });
       it('should show content on row hover', function () {
         var _render35 = (0, _react2.render)(mockTable({}, {}, {}, {
-          displayContent: 'onRowHover'
-        })),
-            container = _render35.container;
-
+            displayContent: 'onRowHover'
+          })),
+          container = _render35.container;
         expect(container.querySelectorAll('.rowcolumn')[0]).toContainElement(container.querySelector('.rowcolumn .rowhover'));
       });
       it('should hide component', function () {
         var _render36 = (0, _react2.render)(mockTable({}, {}, {}, {
-          visible: false
-        })),
-            container = _render36.container;
-
+            visible: false
+          })),
+          container = _render36.container;
         expect(container.querySelector('.rowcolumn')).not.toBeInTheDocument();
       });
     });

package/lib/table/types.d.ts

@@ -0,0 +1,84 @@
+import { TableHTMLAttributes, ReactNode, MouseEvent, CSSProperties, LegacyRef, SetStateAction } from 'react';
+
+interface ITableProps extends TableHTMLAttributes<HTMLTableElement> {
+    children?: ReactNode;
+    striped?: boolean;
+    customClass?: string;
+    bordered?: boolean;
+    hovered?: boolean;
+    headerColored?: boolean;
+    condensed?: boolean;
+    onRowClick?: () => void;
+    onColClick?: () => void;
+    vertical?: boolean;
+    selectedRowId?: string;
+    bodyScrollable?: boolean;
+    skeletonize?: boolean;
+    strict?: boolean;
+    skeletonInRows?: number;
+    skeletonInHeader?: boolean;
+    skeletonHeight?: number;
+}
+interface ITableHeaderProps extends TableHTMLAttributes<HTMLTableElement> {
+    children?: ReactNode;
+    customClass?: string;
+    textAlign?: string;
+    visible?: boolean;
+}
+interface ITableBodyProps extends TableHTMLAttributes<HTMLTableElement> {
+    children?: ReactNode;
+    customClass?: string;
+    columnsCount?: number;
+    vertical?: boolean;
+    skeletonize?: boolean;
+    skeletonInRows?: number;
+    skeletonHeight?: number;
+}
+interface ITableRowProps {
+    children?: ReactNode;
+    color?: string;
+    customClass?: string;
+    rowId?: string;
+    dataId?: number | string;
+    onClick?: (e: MouseEvent, dataId?: number | string) => void;
+    handleTableColClick?: (e: MouseEvent, dataId?: number | string) => void;
+    rowBorder?: boolean;
+    height?: string;
+    style?: CSSProperties;
+    ignoreTableColClick?: boolean;
+    textAlign?: string;
+    displayContent?: 'always' | 'never' | 'onRowHover';
+    visible?: boolean;
+}
+interface ITableContext {
+    bodyScrollable?: boolean;
+    skeletonInRows?: number;
+    bodyContainerRef?: LegacyRef<HTMLDivElement>;
+    bodyScrollWidth?: number | string;
+    selectedRowId?: string;
+    vertical?: boolean;
+    skeletonize?: boolean;
+    skeletonInHeader?: boolean;
+    strict?: boolean;
+    columnsCount?: number;
+    handleSelectRow?: (rowId: SetStateAction<string | undefined>) => void;
+    handleTableColClick?: () => void;
+    handleTableRowClick?: (e: MouseEvent, dataId?: number | string) => void;
+    handlerSetColumnsWidth?: (width: (string | number | undefined)[]) => void;
+    handlerSetColumnsCount?: (count: number) => void;
+}
+interface ITableRowContext {
+    skeletonize?: boolean;
+    vertical?: boolean;
+    skeletonInRows?: number;
+    rowBorder?: boolean;
+}
+declare type TableElement = {
+    props: {
+        style: {
+            width: string | number;
+        };
+    };
+};
+
+export { ITableBodyProps, ITableContext, ITableHeaderProps, ITableProps, ITableRowContext, ITableRowProps, TableElement };

package/lib/table/types.js

@@ -0,0 +1,5 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});

package/lib/tabs/DropdownItems.d.ts

@@ -0,0 +1,9 @@
+import { MenuProps } from './types.js';
+import 'react';
+import '../@types/Size.js';
+import '../@types/Position.js';
+import '../@types/PermissionAttr.js';
+
+declare const DropdownItems: ({ handlerClick, handlerRemovePanel, dropdownPanels, tabMenuSize, }: MenuProps) => JSX.Element;
+
+export { DropdownItems as default };