linear-react-components-ui 0.4.76-beta.26 → 0.4.76-beta.29

package/lib/table/index.js

@@ -63,8 +63,6 @@ function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "functio
 
 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 _extends() { _extends = Object.assign || 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); }
-
 function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
 
 function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
@@ -87,9 +85,8 @@ var getClass = function getClass(_ref) {
       headerColored = _ref.headerColored,
       condensed = _ref.condensed,
       vertical = _ref.vertical,
-      bodyScrollable = _ref.bodyScrollable,
-      skeletonInRows = _ref.skeletonInRows;
-  return "table-component ".concat(customClass, " ").concat(striped && '-striped', " \n  ").concat(bordered && '-bordered', " ").concat(hovered && '-hovered', " ").concat(headerColored && '-headercolor', "\n  ").concat(condensed && '-condensed', "\n  ").concat(vertical && '-vertical', "\n  ").concat(skeletonize && !skeletonInRows ? '-skeletonized' : '', "\n  ").concat(bodyScrollable ? '-scrollable' : '');
+      bodyScrollable = _ref.bodyScrollable;
+  return "table-component ".concat(customClass, " ").concat(striped && '-striped', " \n  ").concat(bordered && '-bordered', " ").concat(hovered && '-hovered', " ").concat(headerColored && '-headercolor', "\n  ").concat(condensed && '-condensed', "\n  ").concat(vertical && '-vertical', "\n  ").concat(skeletonize ? '-skeletonized' : '', "\n  ").concat(bodyScrollable ? '-scrollable' : '');
 };
 
 var Table = function Table(props) {
@@ -98,8 +95,7 @@ var Table = function Table(props) {
       bodyScrollable = props.bodyScrollable,
       children = props.children,
       vertical = props.vertical,
-      skeletonize = props.skeletonize,
-      strict = props.strict;
+      skeletonize = props.skeletonize;
 
   var _useState = (0, _react.useState)(props.selectedRowId),
       _useState2 = _slicedToArray(_useState, 2),
@@ -116,11 +112,6 @@ var Table = function Table(props) {
       columnsWidth = _useState6[0],
       setColumnsWidth = _useState6[1];
 
-  var _useState7 = (0, _react.useState)(undefined),
-      _useState8 = _slicedToArray(_useState7, 2),
-      columnsCount = _useState8[0],
-      setColumnsCount = _useState8[1];
-
   var bodyContainerRef = (0, _react.useRef)(undefined);
   (0, _react.useEffect)(function () {
     if (bodyScrollable && bodyContainerRef && bodyContainerRef.current) {
@@ -134,15 +125,13 @@ var Table = function Table(props) {
   (0, _react.useEffect)(function () {
     setSelectedRowId(props.selectedRowId);
   }, [props.selectedRowId]);
-
-  var contextValues = _extends({}, props, {
+  var contextValues = {
     bodyContainerRef: bodyContainerRef,
+    bodyScrollable: bodyScrollable,
     bodyScrollWidth: bodyScrollWidth,
     selectedRowId: selectedRowId,
     vertical: vertical,
     skeletonize: skeletonize,
-    strict: strict,
-    columnsCount: columnsCount,
     handleSelectRow: function handleSelectRow(selectedId) {
       setSelectedRowId(selectedId);
     },
@@ -150,20 +139,13 @@ var Table = function Table(props) {
     handleTableRowClick: onRowClick,
     handlerSetColumnsWidth: function handlerSetColumnsWidth(widths) {
       if (!_lodash["default"].isEmpty(widths) && _lodash["default"].isEmpty(columnsWidth)) setColumnsWidth(widths);
-    },
-    handlerSetColumnsCount: function handlerSetColumnsCount(count) {
-      return setColumnsCount(count);
     }
-  });
-
+  };
   return /*#__PURE__*/_react["default"].createElement(_helpers["default"].Provider, {
     value: contextValues
   }, bodyScrollable ? /*#__PURE__*/_react["default"].createElement("div", {
     className: getClass(props)
   }, children) : /*#__PURE__*/_react["default"].createElement("table", {
-    style: {
-      contain: strict ? 'strict' : 'size layout style'
-    },
     className: getClass(props)
   }, children));
 };
@@ -181,10 +163,7 @@ Table.propTypes = {
   vertical: _propTypes["default"].bool,
   selectedRowId: _propTypes["default"].string,
   bodyScrollable: _propTypes["default"].bool,
-  skeletonize: _propTypes["default"].bool,
-  strict: _propTypes["default"].bool,
-  skeletonInRows: _propTypes["default"].number,
-  skeletonInHeader: _propTypes["default"].bool
+  skeletonize: _propTypes["default"].bool
 };
 Table.defaultProps = {
   striped: false,
@@ -198,10 +177,7 @@ Table.defaultProps = {
   vertical: false,
   selectedRowId: null,
   bodyScrollable: false,
-  skeletonize: false,
-  strict: false,
-  skeletonInRows: undefined,
-  skeletonInHeader: true
+  skeletonize: false
 };
 var _default = Table;
 exports["default"] = _default;

package/lib/tabs/Menu.js

@@ -20,12 +20,22 @@ var Menu = function Menu(props) {
       customClassForToolBar = props.customClassForToolBar,
       menuRef = props.menuRef,
       toolBarRef = props.toolBarRef;
+
+  if (!toolbar) {
+    return /*#__PURE__*/_react["default"].createElement("div", {
+      className: "menucontainer",
+      ref: function ref(r) {
+        menuRef(r);
+      }
+    }, /*#__PURE__*/_react["default"].createElement(_MenuItems["default"], props), /*#__PURE__*/_react["default"].createElement(_DropdownItems["default"], props));
+  }
+
   return /*#__PURE__*/_react["default"].createElement("div", {
     className: "menucontainer",
     ref: function ref(r) {
       menuRef(r);
     }
-  }, /*#__PURE__*/_react["default"].createElement(_MenuItems["default"], props), /*#__PURE__*/_react["default"].createElement(_DropdownItems["default"], props), toolbar && /*#__PURE__*/_react["default"].cloneElement(toolbar, {
+  }, /*#__PURE__*/_react["default"].createElement(_MenuItems["default"], props), /*#__PURE__*/_react["default"].createElement(_DropdownItems["default"], props), /*#__PURE__*/_react["default"].cloneElement(toolbar, {
     customClass: "menubar ".concat(customClassForToolBar),
     innerRef: toolBarRef ? function (r) {
       toolBarRef(r);

package/lib/tabs/index.js

@@ -254,7 +254,7 @@ var Tabs = function Tabs(props) {
     return function () {
       return window.removeEventListener('resize', onResize);
     };
-  }, [_menuRef.current, tabMenuPosition]);
+  }, [_menuRef.current]);
   (0, _react.useEffect)(function () {
     if (selectedTab) setSelectedTabId(selectedTab);
     if (children) setPanels((0, _tabHelpers.buildPanels)(children));

package/lib/treeview/Node.js

@@ -27,6 +27,8 @@ var _list = _interopRequireWildcard(require("../list"));
 
 var _toolbar = _interopRequireWildcard(require("../toolbar"));
 
+var _SpinnerLoading = _interopRequireDefault(require("../spinner/SpinnerLoading"));
+
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
 
 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); }
@@ -155,6 +157,9 @@ var TreeNode = /*#__PURE__*/function (_Component) {
           className: "treeviewitem"
         }, _this2.getSpan(), /*#__PURE__*/_react["default"].createElement("div", {
           className: "label",
+          style: !onNodeClick ? {
+            textDecoration: 'none'
+          } : null,
           ref: _this2.labelRef,
           role: "button",
           onKeyPress: null,
@@ -240,8 +245,11 @@ var _initialiseProps = function _initialiseProps() {
     enumerable: true,
     writable: true,
     value: function value() {
-      var alwaysShowArrow = _this3.props.alwaysShowArrow;
+      var _this3$props = _this3.props,
+          alwaysShowArrow = _this3$props.alwaysShowArrow,
+          idsInLoading = _this3$props.idsInLoading;
       var node = _this3.state.node;
+      var isLoading = idsInLoading.includes(node.id);
 
       var span = /*#__PURE__*/_react["default"].createElement("noscript", null);
 
@@ -250,11 +258,13 @@ var _initialiseProps = function _initialiseProps() {
           onKeyPress: null,
           tabIndex: 0,
           role: "button",
-          className: "opencloseicon",
+          className: isLoading ? 'isloading' : 'opencloseicon',
           onClick: function onClick() {
             return _this3.openCloseTree(node);
           }
-        }, /*#__PURE__*/_react["default"].createElement(_icons["default"], {
+        }, isLoading ? /*#__PURE__*/_react["default"].createElement(_SpinnerLoading["default"], {
+          size: "35px"
+        }) : /*#__PURE__*/_react["default"].createElement(_icons["default"], {
           name: _this3.state.isVisible ? 'up' : 'down',
           size: 10
         }));
@@ -431,7 +441,8 @@ TreeNode.propTypes = {
   onNodeClick: _propTypes["default"].func,
   handlerOnNodeOpen: _propTypes["default"].func,
   nodeElementsValidations: _propTypes["default"].object,
-  startNodesOpened: _propTypes["default"].bool.isRequired
+  startNodesOpened: _propTypes["default"].bool.isRequired,
+  idsInLoading: _propTypes["default"].arrayOf(_propTypes["default"].number)
 };
 TreeNode.defaultProps = {
   childrenIds: [],
@@ -444,7 +455,8 @@ TreeNode.defaultProps = {
   nodeMenuButtonSize: 'small',
   onNodeClick: undefined,
   handlerOnNodeOpen: undefined,
-  nodeElementsValidations: undefined
+  nodeElementsValidations: undefined,
+  idsInLoading: []
 };
 TreeNode.contextType = _constants.TreeviewContext;
 var _default = TreeNode;

package/lib/treeview/index.js

@@ -100,26 +100,20 @@ var TreeView = /*#__PURE__*/function (_Component) {
       enumerable: true,
       writable: true,
       value: function value(selectedIds) {
-        _this.setState({
-          requiredParentsIds: []
-        }, function () {
-          var requiredIds = [];
-          var newSelectedIds = [];
-          var selectedIdsUpdatedOnMount = _this.state.selectedIdsUpdatedOnMount;
-          selectedIds.forEach(function (id) {
-            var _this$checkAllAncestr = _this.checkAllAncestry(id, [], true, false),
-                requiredParentsIds = _this$checkAllAncestr.requiredParentsIds,
-                updatedIdsWithAncestryIds = _this$checkAllAncestr.updatedIdsWithAncestryIds;
-
-            newSelectedIds = [].concat(_toConsumableArray(newSelectedIds), _toConsumableArray(updatedIdsWithAncestryIds));
-            requiredIds = [].concat(_toConsumableArray(requiredIds), _toConsumableArray(requiredParentsIds));
-          });
+        var requiredIds = [];
+        var newSelectedIds = [];
+        selectedIds.forEach(function (id) {
+          var _this$checkAllAncestr = _this.checkAllAncestry(id, [], true, false),
+              requiredParentsIds = _this$checkAllAncestr.requiredParentsIds,
+              updatedIdsWithAncestryIds = _this$checkAllAncestr.updatedIdsWithAncestryIds;
+
+          newSelectedIds = [].concat(_toConsumableArray(newSelectedIds), _toConsumableArray(updatedIdsWithAncestryIds));
+          requiredIds = [].concat(_toConsumableArray(requiredIds), _toConsumableArray(requiredParentsIds));
+        });
 
-          _this.setState({
-            requiredParentsIds: _lodash["default"].uniq(requiredIds),
-            selectedIds: _lodash["default"].uniq(newSelectedIds),
-            selectedIdsUpdatedOnMount: selectedIdsUpdatedOnMount || true
-          });
+        _this.setState({
+          requiredParentsIds: _lodash["default"].uniq(requiredIds),
+          selectedIds: _lodash["default"].uniq(newSelectedIds)
         });
       }
     });
@@ -469,7 +463,8 @@ var TreeView = /*#__PURE__*/function (_Component) {
             nodeToolbarElements = _this$props3.nodeToolbarElements,
             nodeMenuButtonSize = _this$props3.nodeMenuButtonSize,
             alwaysShowArrow = _this$props3.alwaysShowArrow,
-            startNodesOpened = _this$props3.startNodesOpened;
+            startNodesOpened = _this$props3.startNodesOpened,
+            idsInLoading = _this$props3.idsInLoading;
         var childrenIds = [];
 
         if (node.itens && node.itens.length > 0) {
@@ -487,6 +482,7 @@ var TreeView = /*#__PURE__*/function (_Component) {
         return /*#__PURE__*/_react["default"].createElement(_Node["default"], {
           key: "node-".concat(node.id),
           node: node,
+          idsInLoading: idsInLoading,
           startNodesOpened: startNodesOpened,
           alwaysShowArrow: alwaysShowArrow,
           childrenIds: childrenIds,
@@ -510,8 +506,7 @@ var TreeView = /*#__PURE__*/function (_Component) {
       selectedIds: _this.props.selectedIds,
       isHandlingSelectedIds: false,
       requiredParentsIds: [],
-      alreadyOpenedIds: [],
-      selectedIdsUpdatedOnMount: false
+      alreadyOpenedIds: []
     };
     return _this;
   }
@@ -526,15 +521,12 @@ var TreeView = /*#__PURE__*/function (_Component) {
     value: function componentDidUpdate(prevProps, prevState) {
       var _this$state3 = this.state,
           selectedIds = _this$state3.selectedIds,
-          propSelectedIds = _this$state3.propSelectedIds,
-          selectedIdsUpdatedOnMount = _this$state3.selectedIdsUpdatedOnMount;
+          propSelectedIds = _this$state3.propSelectedIds;
       var allowCheckAllAncestry = this.props.allowCheckAllAncestry;
 
       var isSameSelectedIds = _lodash["default"].isEqual(propSelectedIds.sort(), prevState.propSelectedIds.sort());
 
-      if (allowCheckAllAncestry && (!selectedIdsUpdatedOnMount || !isSameSelectedIds)) {
-        this.handleNewSelectedIds(selectedIds);
-      }
+      if (allowCheckAllAncestry && !isSameSelectedIds) this.handleNewSelectedIds(selectedIds);
     }
   }, {
     key: "render",
@@ -606,7 +598,8 @@ TreeView.propTypes = {
   onNodeClick: _propTypes["default"].func,
   onNodeOpen: _propTypes["default"].func,
   nodeElementsValidations: _propTypes["default"].object,
-  enableDynamicData: _propTypes["default"].bool
+  enableDynamicData: _propTypes["default"].bool,
+  idsInLoading: _propTypes["default"].arrayOf(_propTypes["default"].number)
 };
 TreeView.defaultProps = {
   customClass: '',
@@ -628,7 +621,8 @@ TreeView.defaultProps = {
   onNodeClick: undefined,
   onNodeOpen: undefined,
   nodeElementsValidations: undefined,
-  enableDynamicData: false
+  enableDynamicData: false,
+  idsInLoading: []
 };
 var _default = TreeView;
 exports["default"] = _default;

package/lib/treeview/treeview.spec.js

@@ -257,5 +257,14 @@ describe('Treeview', function () {
 
       expect(container.querySelector('ul')).toHaveStyle('background-color: #000');
     });
+    it('should apply idsInLoading', function () {
+      var _render13 = (0, _react.render)(treeviewRenderMock({
+        idsInLoading: [1]
+      })),
+          container = _render13.container;
+
+      var li = container.querySelector('li').firstChild;
+      expect(li.firstChild).toHaveClass('spinnerloading');
+    });
   });
 });

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "linear-react-components-ui",
-  "version": "0.4.76-beta.26",
+  "version": "0.4.76-beta.29",
   "description": "Linear Sistemas ReactJs Components",
   "main": "lib/index.js",
   "scripts": {

package/lib/assets/styles/uitour.scss

@@ -1,112 +0,0 @@
-@import "commons.scss";
-@import "colors.scss";
-@import "effects.scss";
-
-$step-arrow-size: 22px;
-$step-arrow-shadow-size: 26px;
-%step-arrow {
-  content: '';
-  position: absolute;
-  border-bottom: $step-arrow-size solid transparent;
-  border-right: $step-arrow-size solid #fff;
-  border-top: $step-arrow-size solid transparent;
-}
-%step-arrow-shadow {
-  content: '';
-  position: absolute;
-  border-bottom: $step-arrow-shadow-size solid transparent;
-  border-right: $step-arrow-shadow-size solid rgba(0, 0, 0, 0.6);
-  border-top: $step-arrow-shadow-size solid transparent;
-}
-.uitour-component {
-  position: absolute;
-  width: 100%;
-  height: 100vh;
-  left: 0;
-  top: 0;
-  z-index: 99999999999999999999;
-  > .step {
-    background-color: #fff;
-    position: relative;
-    max-width: 450px;
-    display: flex;
-    flex-direction: column;
-    border: 3px solid rgba(0, 0, 0, 0.6);
-    border-radius: 8px;
-    padding: 5px 0;
-    &.-left {
-      animation: slideRightToLeftWithFade 0.5s;
-      &:before {
-        @extend %step-arrow-shadow;
-        top: 6px;
-        left: -$step-arrow-shadow-size;
-      }
-      &:after {
-        @extend %step-arrow;
-        top: 10px;
-        left: -$step-arrow-size;
-      }
-    }
-    &.-right {
-      animation: slideLeftToRightWithFade 0.5s;
-      &:before {
-        @extend %step-arrow-shadow;
-        top: 6px;
-        right: -$step-arrow-shadow-size;
-        transform: rotate(180deg);
-      }
-      &:after {
-        @extend %step-arrow;
-        top: 10px;
-        right: -$step-arrow-size;
-        transform: rotate(180deg);
-      }
-    }
-    > .closebutton {
-      align-self: flex-end;
-      padding: 0 5px 5px;
-      line-height: 0;
-    }
-    > .content {
-      width: 100%;
-      padding: 0px 20px;
-      margin-bottom: 0;
-      display: flex;
-      > .number {
-        display: flex;
-        width: 40px;
-        height: 40px;
-        align-items: center;
-        justify-content: center;
-        border-radius: 50%;
-        background-color: $success-color;
-        color: #fff;
-        margin-right: 10px;
-        font-weight: bold;
-        font-size: 20px;
-        line-height: 0;
-      }
-      > .about {
-        flex: 1;
-        margin-bottom: 10px;
-        > h3 {
-          font-size: 16px;
-          font-weight: bold;
-        }
-        > .description {
-          font-size: 14px;
-          line-height: 18px;
-          strong {
-            font-weight: bold;
-          }
-        }
-      }
-    }
-    > .footer {
-      display: flex;
-      justify-content: flex-end;
-      gap: 10px;
-      padding: 5px 10px 10px;
-    }
-  }
-}

package/lib/inputs/date/helper.js

@@ -1,16 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports["default"] = void 0;
-
-var getCalendarDropdownStyle = function getCalendarDropdownStyle(_ref) {
-  var topPosition = _ref.topPosition,
-      leftPosition = _ref.leftPosition,
-      width = _ref.width;
-  return "top: ".concat(topPosition, "px;\n  left: ").concat(leftPosition, "px;\n  width:").concat(width, "px");
-};
-
-var _default = getCalendarDropdownStyle;
-exports["default"] = _default;

package/lib/uitour/helpers.js

@@ -1,15 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.STEP_POSITIONS = exports.ARROW_HEIGHT = exports.ARROW_WIDTH = void 0;
-var ARROW_WIDTH = 26;
-exports.ARROW_WIDTH = ARROW_WIDTH;
-var ARROW_HEIGHT = 20;
-exports.ARROW_HEIGHT = ARROW_HEIGHT;
-var STEP_POSITIONS = {
-  right: 'right',
-  left: 'left'
-};
-exports.STEP_POSITIONS = STEP_POSITIONS;