linear-react-components-ui 1.0.0-rc.2 → 1.0.0-rc.4

package/lib/alerts/AlertContainer.js

@@ -4,21 +4,14 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
-
 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); }
-
 function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
-
 function _defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } }
-
 function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); Object.defineProperty(Constructor, "prototype", { writable: false }); return Constructor; }
-
 var AlertContainer = /*#__PURE__*/function () {
   function AlertContainer(pushAlert) {
     var _this = this;
-
     _classCallCheck(this, AlertContainer);
-
     Object.defineProperty(this, "pushAlert", {
       configurable: true,
       enumerable: true,
@@ -36,7 +29,6 @@ var AlertContainer = /*#__PURE__*/function () {
           iconName: 'information',
           color: '#fff'
         });
-
         _this.pushAlert(messageConfig);
       }
     });
@@ -51,7 +43,6 @@ var AlertContainer = /*#__PURE__*/function () {
           iconName: 'power',
           color: '#fff'
         });
-
         _this.pushAlert(messageConfig);
       }
     });
@@ -66,7 +57,6 @@ var AlertContainer = /*#__PURE__*/function () {
           iconName: 'warning',
           color: '#fff'
         });
-
         _this.pushAlert(messageConfig);
       }
     });
@@ -81,7 +71,6 @@ var AlertContainer = /*#__PURE__*/function () {
           iconName: 'checkmark',
           color: '#fff'
         });
-
         _this.pushAlert(messageConfig);
       }
     });
@@ -93,41 +82,33 @@ var AlertContainer = /*#__PURE__*/function () {
         var messageConfig = _extends({}, options, {
           message: message
         });
-
         _this.pushAlert(messageConfig);
       }
     });
     this.pushAlert = pushAlert;
   }
-
   _createClass(AlertContainer, [{
     key: "default",
     value: function _default(messageConfig) {
       var message = messageConfig.message,
-          options = messageConfig.options;
-
+        options = messageConfig.options;
       switch (options.type) {
         case 'info':
           this.info(message, options);
           break;
-
         case 'warning':
           this.warning(message, options);
           break;
-
         case 'danger':
           this.danger(message, options);
           break;
-
         default:
           this.success(message, options);
           break;
       }
     }
   }]);
-
   return AlertContainer;
 }();
-
 var _default2 = AlertContainer;
 exports.default = _default2;

package/lib/alerts/AlertProvider.js

@@ -1,71 +1,49 @@
 "use strict";
 
 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); }
-
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
-
 var _react = _interopRequireWildcard(require("react"));
-
 var _lodash = _interopRequireDefault(require("lodash"));
-
 var _BaseAlert = _interopRequireDefault(require("./BaseAlert"));
-
 var _AlertContainer = _interopRequireDefault(require("./AlertContainer"));
-
 var _Message = _interopRequireDefault(require("./Message"));
-
 var _helpers = _interopRequireDefault(require("./helpers"));
-
 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); }
-
 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 ? 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); }
-
 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."); }
-
 function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
-
 function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }
-
 function _iterableToArrayLimit(arr, i) { var _i = arr == null ? null : typeof Symbol !== "undefined" && arr[Symbol.iterator] || arr["@@iterator"]; if (_i == null) return; var _arr = []; var _n = true; var _d = false; var _s, _e; try { for (_i = _i.call(arr); !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"] != null) _i["return"](); } finally { if (_d) throw _e; } } return _arr; }
-
 function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
-
 var AlertProvider = function AlertProvider(props) {
   var _useState = (0, _react.useState)({
-    leftTop: [],
-    leftBottom: [],
-    rightBottom: [],
-    rightTop: [],
-    centerTop: [],
-    centerBottom: []
-  }),
-      _useState2 = _slicedToArray(_useState, 2),
-      messages = _useState2[0],
-      setMessages = _useState2[1];
-
+      leftTop: [],
+      leftBottom: [],
+      rightBottom: [],
+      rightTop: [],
+      centerTop: [],
+      centerBottom: []
+    }),
+    _useState2 = _slicedToArray(_useState, 2),
+    messages = _useState2[0],
+    setMessages = _useState2[1];
   var _useState3 = (0, _react.useState)(false),
-      _useState4 = _slicedToArray(_useState3, 2),
-      toggleRefreshComponent = _useState4[0],
-      setToggleRefreshComponent = _useState4[1];
-
+    _useState4 = _slicedToArray(_useState3, 2),
+    toggleRefreshComponent = _useState4[0],
+    setToggleRefreshComponent = _useState4[1];
   var children = props.children;
-
   var removeAlert = function removeAlert(messageId, position) {
     messages[position] = messages[position].filter(function (message) {
       return message.id !== messageId;
     });
     setMessages(_extends({}, messages));
   };
-
   var pushAlert = function pushAlert(params) {
     var properties = params;
     if (properties.position === undefined) properties.position = 'rightBottom';
@@ -74,7 +52,6 @@ var AlertProvider = function AlertProvider(props) {
     setMessages(messages);
     setToggleRefreshComponent(!toggleRefreshComponent);
   };
-
   var buildAlertMessage = function buildAlertMessage(values) {
     return values.map(function (value) {
       return /*#__PURE__*/_react.default.createElement(_Message.default, _extends({}, value, {
@@ -83,34 +60,27 @@ var AlertProvider = function AlertProvider(props) {
       }));
     });
   };
-
   var contextValues = {
     alert: new _AlertContainer.default(pushAlert)
   };
-
   var renderBaseContainer = function renderBaseContainer() {
     var elements = [];
-
     _lodash.default.forEach(messages, function (values, key) {
       if (values.length > 0) {
         var messageAlert = /*#__PURE__*/_react.default.createElement("div", {
           className: key.toLowerCase(),
           key: key
         }, buildAlertMessage(values));
-
         elements.push(messageAlert);
       } else {
         elements.push(null);
       }
     });
-
     return /*#__PURE__*/_react.default.createElement(_helpers.default.Provider, {
       value: _extends({}, contextValues)
     }, /*#__PURE__*/_react.default.createElement(_BaseAlert.default, null, elements), children);
   };
-
   return _react.Children.only(renderBaseContainer());
 };
-
 var _default = AlertProvider;
 exports.default = _default;

package/lib/alerts/BaseAlert.js

@@ -4,37 +4,23 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
-
 var _react = require("react");
-
 var _reactDom = _interopRequireDefault(require("react-dom"));
-
 require("../assets/styles/alerts.scss");
-
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-
 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."); }
-
 function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
-
 function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }
-
 function _iterableToArrayLimit(arr, i) { var _i = arr == null ? null : typeof Symbol !== "undefined" && arr[Symbol.iterator] || arr["@@iterator"]; if (_i == null) return; var _arr = []; var _n = true; var _d = false; var _s, _e; try { for (_i = _i.call(arr); !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"] != null) _i["return"](); } finally { if (_d) throw _e; } } return _arr; }
-
 function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
-
 var body = document.getElementsByTagName('body')[0];
 var alert = document.getElementById('alert');
-
 var BaseAlert = function BaseAlert(_ref) {
   var children = _ref.children;
-
   var _useState = (0, _react.useState)(document.createElement('div')),
-      _useState2 = _slicedToArray(_useState, 1),
-      messageContainerEl = _useState2[0];
-
+    _useState2 = _slicedToArray(_useState, 1),
+    messageContainerEl = _useState2[0];
   messageContainerEl.className = 'messagecontainer';
   (0, _react.useEffect)(function () {
     if (alert === null) {
@@ -45,13 +31,11 @@ var BaseAlert = function BaseAlert(_ref) {
     } else {
       alert.appendChild(messageContainerEl);
     }
-
     return function () {
       alert === null || alert === void 0 ? void 0 : alert.removeChild(messageContainerEl);
     };
   }, []);
   return /*#__PURE__*/_reactDom.default.createPortal(children, messageContainerEl);
 };
-
 var _default = BaseAlert;
 exports.default = _default;

package/lib/alerts/Message.js

@@ -1,28 +1,20 @@
 "use strict";
 
 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); }
-
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
-
 var _react = _interopRequireWildcard(require("react"));
-
 var _icons = _interopRequireDefault(require("../icons"));
-
 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); }
-
 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; }
-
 var getClass = function getClass(_ref) {
   var customClass = _ref.customClass,
-      className = _ref.className;
+    className = _ref.className;
   return "".concat(className, " ").concat(customClass);
 };
-
 var getIcon = function getIcon(icon, iconName, color) {
   if (icon !== null) {
     return icon;
@@ -33,32 +25,30 @@ var getIcon = function getIcon(icon, iconName, color) {
       size: 32
     });
   }
-
   return null;
 };
-
 var Message = function Message(_ref2) {
   var _ref2$handleClose = _ref2.handleClose,
-      handleClose = _ref2$handleClose === void 0 ? function () {} : _ref2$handleClose,
-      message = _ref2.message,
-      _ref2$id = _ref2.id,
-      id = _ref2$id === void 0 ? 0 : _ref2$id,
-      _ref2$color = _ref2.color,
-      color = _ref2$color === void 0 ? '' : _ref2$color,
-      _ref2$icon = _ref2.icon,
-      icon = _ref2$icon === void 0 ? null : _ref2$icon,
-      _ref2$iconName = _ref2.iconName,
-      iconName = _ref2$iconName === void 0 ? '' : _ref2$iconName,
-      _ref2$timeout = _ref2.timeout,
-      timeout = _ref2$timeout === void 0 ? 3000 : _ref2$timeout,
-      _ref2$customClass = _ref2.customClass,
-      customClass = _ref2$customClass === void 0 ? '' : _ref2$customClass,
-      _ref2$closeButton = _ref2.closeButton,
-      closeButton = _ref2$closeButton === void 0 ? false : _ref2$closeButton,
-      _ref2$className = _ref2.className,
-      className = _ref2$className === void 0 ? 'message' : _ref2$className,
-      _ref2$position = _ref2.position,
-      position = _ref2$position === void 0 ? 'centerTop' : _ref2$position;
+    handleClose = _ref2$handleClose === void 0 ? function () {} : _ref2$handleClose,
+    message = _ref2.message,
+    _ref2$id = _ref2.id,
+    id = _ref2$id === void 0 ? 0 : _ref2$id,
+    _ref2$color = _ref2.color,
+    color = _ref2$color === void 0 ? '' : _ref2$color,
+    _ref2$icon = _ref2.icon,
+    icon = _ref2$icon === void 0 ? null : _ref2$icon,
+    _ref2$iconName = _ref2.iconName,
+    iconName = _ref2$iconName === void 0 ? '' : _ref2$iconName,
+    _ref2$timeout = _ref2.timeout,
+    timeout = _ref2$timeout === void 0 ? 3000 : _ref2$timeout,
+    _ref2$customClass = _ref2.customClass,
+    customClass = _ref2$customClass === void 0 ? '' : _ref2$customClass,
+    _ref2$closeButton = _ref2.closeButton,
+    closeButton = _ref2$closeButton === void 0 ? false : _ref2$closeButton,
+    _ref2$className = _ref2.className,
+    className = _ref2$className === void 0 ? 'message' : _ref2$className,
+    _ref2$position = _ref2.position,
+    position = _ref2$position === void 0 ? 'centerTop' : _ref2$position;
   (0, _react.useEffect)(function () {
     if (timeout > 0) {
       setTimeout(function () {
@@ -87,6 +77,5 @@ var Message = function Message(_ref2) {
     }
   }, "x") : null));
 };
-
 var _default = Message;
 exports.default = _default;

package/lib/alerts/helpers.js

@@ -4,9 +4,7 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
-
 var _react = require("react");
-
 var AlertProviderContext = /*#__PURE__*/(0, _react.createContext)({});
 var _default = AlertProviderContext;
 exports.default = _default;

package/lib/alerts/index.js

@@ -10,12 +10,8 @@ Object.defineProperty(exports, "AlertProvider", {
   }
 });
 exports.default = void 0;
-
 var _withAlert = _interopRequireDefault(require("./withAlert"));
-
 var _AlertProvider = _interopRequireDefault(require("./AlertProvider"));
-
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-
 var _default = _withAlert.default;
 exports.default = _default;

package/lib/alerts/withAlert.js

@@ -1,36 +1,25 @@
 "use strict";
 
 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); }
-
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
-
 var _react = _interopRequireWildcard(require("react"));
-
 var _helpers = _interopRequireDefault(require("./helpers"));
-
 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); }
-
 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 ? 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 withAlert = function withAlert(WrapperComponent) {
   var GetAlert = function GetAlert(props) {
     var _useContext = (0, _react.useContext)(_helpers.default),
-        alert = _useContext.alert;
-
+      alert = _useContext.alert;
     return /*#__PURE__*/_react.default.createElement(WrapperComponent, _extends({}, props, {
       alert: alert
     }));
   };
-
   return GetAlert;
 };
-
 var _default = withAlert;
 exports.default = _default;

package/lib/assets/styles/effects.scss

@@ -136,8 +136,42 @@
   0% {
     color: transparent;
     height: 0%;
+    opacity: 0.0;
+  }
+  50% {
+    color: inherit;
+    height: auto;
     opacity: 0.3;
   }
+  100% {
+    color: inherit;
+    opacity: 1;
+  }
+}
+
+@-moz-keyframes revealelement {
+  0% {
+    -moz-color: transparent;
+    -moz-height: 0%;
+    -moz-opacity: 0.0;
+  }
+  50% {
+    -moz-color: inherit;
+    -moz-height: auto;
+    -moz-opacity: 0.3;
+  }
+  100% {
+    -moz-color: inherit;
+    -moz-opacity: 1;
+  }
+}
+
+@-webkit-keyframes revealelement {
+  0% {
+    color: transparent;
+    height: 0%;
+    opacity: 0.0;
+  }
   50% {
     color: inherit;
     height: auto;
@@ -475,6 +509,31 @@
     transform: translateX(-2%);
   }
 }
+
+@-moz-keyframes slideLeft {
+  0% {
+    -moz-transform-origin: 0 0;
+    -moz-transform: translateX(0%);
+  }
+
+  10% {
+    -moz-transform-origin: 0 0;
+    -moz-transform: translateX(-2%);
+  }
+}
+
+@-webkit-keyframes slideLeft {
+  0% {
+    -webkit-transform-origin: 0 0;
+    -webkit-transform: translateX(0%);
+  }
+
+  10% {
+    -webkit-transform-origin: 0 0;
+    -webkit-transform: translateX(-2%);
+  }
+}
+
 .slideRight {
   animation-name: slideRight;
 }

package/lib/assets/styles/sidenav.scss

@@ -108,9 +108,11 @@ que utilizam. Em caso de mudança, ficar atento para os refatores.
 
 .sidenav-component > .expandedmenu {
   animation: revealelement 0.3s;
+  -moz-animation: revealelement 0.3s;
   background-color: #fff;
   overflow: none;
   width: 100%;
+  -moz-box-flex: 0;
   -webkit-box-flex: 0;
   -ms-flex: 0 0 70px;
   flex: 0 0 70px;
@@ -198,6 +200,7 @@ que utilizam. Em caso de mudança, ficar atento para os refatores.
 .sidenav-component > .collapsedmenu > .item > .submenu-container,
 .sidenav-component > .expandedmenu > .item > .submenu-container {
   animation: 0.5s ease-in 0s 1 slideLeft;
+  -moz-animation: 0.5s ease-in 0s 1 slideLeft;
   background-color: #eee ;
   height: auto;
   width: auto;
@@ -225,7 +228,6 @@ que utilizam. Em caso de mudança, ficar atento para os refatores.
     > .item {
       display: grid;
       min-height: 40px;
-      /* height: 40px; */
       align-content: center;
       display: grid;
       margin-left: 20px;

package/lib/assets/styles/treetable.scss

@@ -0,0 +1,100 @@
+@import "commons.scss";
+@import "colors.scss";
+@import "effects.scss";
+
+.treetable-container {
+  width: 100%;
+  height: auto;
+  padding: 0px;
+  margin: 12px 0;
+}
+
+table {
+  tbody {
+    .tree-row-element {
+      animation: revealelement 0.3s forwards ease-in-out;
+    }
+
+    .open-close-children {
+      outline: 0;
+      border: 0;
+      display: flex;
+      align-items: center;
+      width: auto;
+      height: auto;
+      background-color: transparent;
+      border-radius: 4px;
+      font-size: 0px;
+      padding: 4px 4px 4px 0;
+      cursor: pointer;
+    }
+
+    .value-button {
+      margin-left: 6px;
+
+      &:hover {
+        text-decoration: underline;
+        cursor: pointer;
+      }
+    }
+
+    tr td.td-loading-childrens {
+      border-bottom: 1px solid $component-border-color-soft;
+    }
+
+    .tr-loading-childrens {
+      animation: revealelement 0.3s forwards ease-in-out;
+    }
+
+    .td-loading-childrens-container {
+      width: 100%;
+      height: 35px;
+      display: flex;
+      align-items: center;
+      flex-direction: row;
+      justify-content: center;
+    }
+
+    .column-more-childrens {
+      width: auto;
+      max-height: 24px;
+      display: flex;
+      align-items: center;
+    }
+
+    .line-path-decoration::before {
+      content: "";
+      height: 34px;
+      position: relative;
+      right: 0.5rem;
+      border-left: 2px solid $component-border-color-soft;
+    }
+
+    span.children-row {
+      margin-left: 8px;
+    }
+
+    div.column-container {
+      display: flex;
+      flex-direction: row;
+      align-items: center;
+    }
+
+    span.container-toolbar-buttons {
+      width: 100%;
+      height: auto;
+      margin-left: 4px;
+      margin-right: 16px;
+    }
+
+    .row-toolbar {
+      width: 100%;
+      height: auto;
+      margin-left: 4px;
+      display: flex;
+      flex-direction: row;
+      align-items: center;
+      justify-content: space-between;
+    }
+  }
+}