linear-react-components-ui 0.4.75 → 0.4.76-rc.0

package/lib/fieldset/fieldset.spec.js

@@ -0,0 +1,329 @@
+"use strict";
+
+var _react = _interopRequireDefault(require("react"));
+
+var _react2 = require("@testing-library/react");
+
+require("@testing-library/jest-dom/extend-expect");
+
+var _index = _interopRequireDefault(require("./index"));
+
+var _gridlayout = require("../gridlayout");
+
+var _text = _interopRequireDefault(require("../inputs/text"));
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
+
+describe('Fieldset', function () {
+  var fieldset = function fieldset(propsArgument) {
+    return /*#__PURE__*/_react["default"].createElement(_index["default"], propsArgument, /*#__PURE__*/_react["default"].createElement(_gridlayout.GridRow, {
+      template: "columns",
+      style: {
+        marginBottom: 20
+      }
+    }, /*#__PURE__*/_react["default"].createElement(_text["default"], {
+      required: true,
+      name: "nome",
+      value: "XPTO",
+      label: "Nome",
+      gridLayout: "12 12 12 12"
+    })));
+  };
+
+  var sessionStorageMock = function sessionStorageMock() {
+    var store = {};
+    return {
+      getItem: function getItem(key) {
+        return store[key] || null;
+      },
+      setItem: function setItem(key, value) {
+        store[key] = value.toString();
+      },
+      removeItem: function removeItem(key) {
+        delete store[key];
+      },
+      clear: function clear() {
+        store = {};
+      }
+    };
+  };
+
+  var storePermissionAttrMock = function storePermissionAttrMock() {
+    Object.defineProperty(window, 'sessionStorage', {
+      value: sessionStorageMock()
+    });
+    var permissionMock = {
+      SG_SEGURANCA: [{
+        nome: 'Autorização',
+        codigo: 'SG_SEGURANCA_AUTORIZACAO',
+        permissoes: [{
+          codigo: 'SG_SEGURANCA_AUTORIZACAO_RECURSOS'
+        }],
+        itens: []
+      }]
+    };
+    sessionStorage.setItem('permissionsStorage', JSON.stringify(permissionMock));
+  };
+
+  it('should render correctly', function () {
+    var _render = (0, _react2.render)(fieldset()),
+        container = _render.container;
+
+    var gridRow = container.querySelector('.-withinput.grid-container');
+    var textField = container.querySelector('.textinput.text-align-left');
+    expect(container.firstChild).toHaveClass('fieldset-component');
+    expect(gridRow).toBeTruthy();
+    expect(textField).toBeTruthy();
+    expect(textField.name).toBe('nome');
+    expect(textField.value).toBe('XPTO');
+  });
+  it('should apply customClass', function () {
+    var customClass = 'testecustomclass';
+
+    var _render2 = (0, _react2.render)(fieldset({
+      customClass: customClass
+    })),
+        container = _render2.container;
+
+    expect(container.firstChild).toHaveClass(customClass);
+  });
+  it('should apply template', function () {
+    var template = 'columns';
+
+    var _render3 = (0, _react2.render)(fieldset({
+      template: template
+    })),
+        container = _render3.container;
+
+    var contentFieldSet = container.querySelector('.contentfieldset');
+    expect(contentFieldSet).toHaveClass("-template".concat(template));
+  });
+  it('should render title', function () {
+    var _render4 = (0, _react2.render)(fieldset({
+      title: 'Teste'
+    })),
+        container = _render4.container;
+
+    var fieldsetTitle = container.querySelector('.legend');
+    expect(fieldsetTitle).toBeTruthy();
+    expect(fieldsetTitle).toHaveTextContent('Teste');
+  });
+  it('should apply titleAlign', function () {
+    var titleAlign = 'right';
+
+    var _render5 = (0, _react2.render)(fieldset({
+      titleAlign: titleAlign,
+      title: 'Teste titleAlign'
+    })),
+        container = _render5.container;
+
+    var fieldsetTitle = container.querySelector('.legend');
+    expect(fieldsetTitle.align).toBe(titleAlign);
+  });
+  it('should apply titleCustomClass', function () {
+    var titleCustomClass = 'titleCustomClass';
+
+    var _render6 = (0, _react2.render)(fieldset({
+      titleCustomClass: titleCustomClass,
+      title: 'Teste titleCustomClass'
+    })),
+        container = _render6.container;
+
+    var fieldsetTitle = container.querySelector('.legend');
+    expect(fieldsetTitle).toHaveClass(titleCustomClass);
+  });
+  it('should apply colsCount', function () {
+    var colsCount = 4;
+
+    var _render7 = (0, _react2.render)(fieldset({
+      template: 'columns',
+      colsCount: colsCount
+    })),
+        container = _render7.container;
+
+    var contentFieldSet = container.querySelector('.contentfieldset.-templatecolumns');
+    expect(contentFieldSet).toHaveStyle("grid-template-columns: repeat(".concat(colsCount, ", 1fr)"));
+  });
+  it('should apply rowsCount', function () {
+    var rowsCount = 4;
+
+    var _render8 = (0, _react2.render)(fieldset({
+      template: 'rows',
+      rowsCount: rowsCount
+    })),
+        container = _render8.container;
+
+    var contentFieldSet = container.querySelector('.contentfieldset.-templaterows');
+    expect(contentFieldSet).toHaveStyle("grid-template-rows: repeat(".concat(rowsCount, ", 1fr)"));
+  });
+  it('should apply style', function () {
+    var style = {
+      paddingTop: '10px',
+      marginBottom: '10px'
+    };
+
+    var _render9 = (0, _react2.render)(fieldset({
+      style: style
+    })),
+        container = _render9.container;
+
+    expect(container.firstChild).toHaveStyle(style);
+  });
+  it('should apply styleContent', function () {
+    var styleContent = {
+      paddingTop: '10px',
+      marginBottom: '10px'
+    };
+
+    var _render10 = (0, _react2.render)(fieldset({
+      styleContent: styleContent
+    })),
+        container = _render10.container;
+
+    var contentFieldSet = container.querySelector('.contentfieldset');
+    expect(contentFieldSet).toHaveStyle(styleContent);
+  });
+  it('should apply styleTitle', function () {
+    var styleTitle = {
+      paddingTop: '10px',
+      marginBottom: '10px'
+    };
+
+    var _render11 = (0, _react2.render)(fieldset({
+      title: 'Teste',
+      styleTitle: styleTitle
+    })),
+        container = _render11.container;
+
+    var fieldsetTitle = container.querySelector('.legend');
+    expect(fieldsetTitle).toHaveStyle(styleTitle);
+  });
+  describe('prop type', function () {
+    it('should apply -primary css class', function () {
+      var type = 'primary';
+
+      var _render12 = (0, _react2.render)(fieldset({
+        type: type
+      })),
+          container = _render12.container;
+
+      expect(container.firstChild).toHaveClass("-".concat(type));
+    });
+    it('should apply -danger css class', function () {
+      var type = 'danger';
+
+      var _render13 = (0, _react2.render)(fieldset({
+        type: type
+      })),
+          container = _render13.container;
+
+      expect(container.firstChild).toHaveClass("-".concat(type));
+    });
+    it('should apply -success css class', function () {
+      var type = 'success';
+
+      var _render14 = (0, _react2.render)(fieldset({
+        type: type
+      })),
+          container = _render14.container;
+
+      expect(container.firstChild).toHaveClass("-".concat(type));
+    });
+    it('should apply -warning css class', function () {
+      var type = 'warning';
+
+      var _render15 = (0, _react2.render)(fieldset({
+        type: type
+      })),
+          container = _render15.container;
+
+      expect(container.firstChild).toHaveClass("-".concat(type));
+    });
+    it('should apply -info css class', function () {
+      var type = 'info';
+
+      var _render16 = (0, _react2.render)(fieldset({
+        type: type
+      })),
+          container = _render16.container;
+
+      expect(container.firstChild).toHaveClass("-".concat(type));
+    });
+  });
+  it('prop hasError should apply -witherror css class', function () {
+    var _render17 = (0, _react2.render)(fieldset({
+      hasError: true
+    })),
+        container = _render17.container;
+
+    expect(container.firstChild).toHaveClass('-witherror');
+  });
+  describe('prop gridCols', function () {
+    var gridCols = '4';
+    it('should wrapp subject within Grid component', function () {
+      var _render18 = (0, _react2.render)(fieldset({
+        gridCols: gridCols
+      })),
+          container = _render18.container;
+
+      expect(container.firstChild).toHaveClass('grid-container');
+    });
+    it('should apply into Grid component', function () {
+      var _render19 = (0, _react2.render)(fieldset({
+        gridCols: gridCols
+      })),
+          container = _render19.container;
+
+      expect(container.firstChild).toHaveClass("col-xs-".concat(gridCols));
+    });
+  });
+  describe('prop permissionAttr', function () {
+    beforeEach(function () {
+      window.sessionStorage.clear();
+    });
+    it('should allow default subject rendering', function () {
+      storePermissionAttrMock();
+
+      var _render20 = (0, _react2.render)(fieldset({
+        permissionAttr: {
+          module: 'SG_SEGURANCA',
+          feature: 'SG_SEGURANCA_AUTORIZACAO',
+          operation: 'SG_SEGURANCA_AUTORIZACAO_RECURSOS',
+          onDenied: 'unvisible'
+        }
+      })),
+          container = _render20.container;
+
+      expect(container.firstChild).toHaveClass('fieldset-component');
+      expect(container.querySelector('.no-permission-component')).not.toBeInTheDocument();
+    });
+    it('should turn subject unvisible', function () {
+      storePermissionAttrMock();
+      (0, _react2.render)(fieldset({
+        permissionAttr: {
+          module: 'SG_XPTO',
+          feature: 'SG_SEGURANCA_AUTORIZACAO',
+          operation: 'SG_SEGURANCA_AUTORIZACAO_RECURSOS',
+          onDenied: 'unvisible'
+        }
+      }));
+      expect(document.querySelector('.fieldset-component')).not.toBeInTheDocument();
+    });
+    it('should hide subject content', function () {
+      storePermissionAttrMock();
+
+      var _render21 = (0, _react2.render)(fieldset({
+        permissionAttr: {
+          module: 'SG_XPTO',
+          feature: 'SG_SEGURANCA_AUTORIZACAO',
+          operation: 'SG_SEGURANCA_AUTORIZACAO_RECURSOS',
+          onDenied: 'hideContent'
+        }
+      })),
+          container = _render21.container;
+
+      expect(container.firstChild).toHaveClass('fieldset-component');
+      expect(container.querySelector('.no-permission-component')).toBeInTheDocument();
+    });
+  });
+});

package/lib/form/Field.js

@@ -125,6 +125,7 @@ Field.propTypes = {
   onBlur: _propTypes["default"].func,
   validators: _propTypes["default"].any,
   fieldErrors: _propTypes["default"].object,
+  externalFieldErrors: _propTypes["default"].object,
   externalMessagesErrors: _propTypes["default"].arrayOf(_propTypes["default"].string),
   fieldId: _propTypes["default"].string
 };
@@ -136,6 +137,7 @@ Field.defaultProps = {
   onBlur: undefined,
   validators: null,
   fieldErrors: {},
+  externalFieldErrors: {},
   externalMessagesErrors: [],
   fieldId: '' // Inicialmente implementado para atender radios e checkboxs
 

package/lib/form/FieldNumber.js

@@ -36,10 +36,16 @@ var getOnBlurEvent = function getOnBlurEvent(_ref) {
 
 var FieldMask = function FieldMask(props) {
   var data = props.data,
-      name = props.name;
+      name = props.name,
+      handlerFieldChange = props.handlerFieldChange,
+      _onChange = props.onChange;
   return /*#__PURE__*/_react["default"].createElement(props.component, _extends({}, props, getOnBlurEvent(props), {
     errorMessages: (0, _helpers.getErrorMessages)(props),
-    value: _lodash["default"].get(data, name)
+    value: _lodash["default"].get(data, name),
+    onChange: function onChange(e) {
+      handlerFieldChange(e);
+      if (_onChange) _onChange(e);
+    }
   }));
 };
 
@@ -49,6 +55,7 @@ FieldMask.propTypes = {
   handlerFieldChange: _propTypes["default"].func.isRequired,
   component: _propTypes["default"].oneOfType([_propTypes["default"].object, _propTypes["default"].func]),
   onBlur: _propTypes["default"].func,
+  onChange: _propTypes["default"].func,
   validators: _propTypes["default"].oneOf([_propTypes["default"].func, _propTypes["default"].arrayOf(_propTypes["default"].func)]),
   fieldErrors: _propTypes["default"].object,
   externalMessagesErrors: _propTypes["default"].arrayOf(_propTypes["default"].string)
@@ -56,6 +63,7 @@ FieldMask.propTypes = {
 FieldMask.defaultProps = {
   component: undefined,
   onBlur: undefined,
+  onChange: undefined,
   validators: undefined,
   fieldErrors: {},
   externalMessagesErrors: []

package/lib/form/FieldPeriod.js

@@ -0,0 +1,100 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = void 0;
+
+var _react = _interopRequireDefault(require("react"));
+
+var _propTypes = _interopRequireDefault(require("prop-types"));
+
+var _lodash = _interopRequireDefault(require("lodash"));
+
+var _withFieldHOC = _interopRequireDefault(require("./withFieldHOC"));
+
+var _helpers = require("./helpers");
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
+
+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); }
+
+var FieldPeriod = function FieldPeriod(props) {
+  var data = props.data,
+      nameDateInitial = props.nameDateInitial,
+      nameDateFinal = props.nameDateFinal,
+      handlerFieldChange = props.handlerFieldChange,
+      handlerFieldValidade = props.handlerFieldValidade,
+      fieldErrors = props.fieldErrors,
+      externalMessagesErrors = props.externalMessagesErrors,
+      _onChange = props.onChange,
+      validators = props.validators;
+  var errorMessages = (0, _helpers.getErrorMessages)({
+    name: nameDateInitial,
+    fieldErrors: fieldErrors,
+    externalMessagesErrors: externalMessagesErrors
+  });
+  return /*#__PURE__*/_react["default"].createElement(props.component, _extends({}, props, {
+    errorMessages: errorMessages,
+    onChange: function onChange(_ref) {
+      var initial = _ref.initial,
+          _final = _ref["final"];
+
+      if (validators) {
+        handlerFieldValidade(nameDateInitial, {
+          initial: initial,
+          "final": _final
+        }, validators);
+      }
+
+      handlerFieldChange({
+        target: {
+          name: nameDateInitial,
+          value: initial
+        }
+      });
+      handlerFieldChange({
+        target: {
+          name: nameDateFinal,
+          value: _final
+        }
+      });
+
+      _onChange({
+        initial: initial,
+        "final": _final
+      });
+    },
+    value: {
+      initial: _lodash["default"].get(data, nameDateInitial),
+      "final": _lodash["default"].get(data, nameDateFinal)
+    }
+  }));
+};
+
+FieldPeriod.propTypes = {
+  data: _propTypes["default"].object.isRequired,
+  nameDateInitial: _propTypes["default"].string.isRequired,
+  nameDateFinal: _propTypes["default"].string.isRequired,
+  handlerFieldChange: _propTypes["default"].func.isRequired,
+  component: _propTypes["default"].oneOfType([_propTypes["default"].object, _propTypes["default"].func]),
+  onBlur: _propTypes["default"].func,
+  validators: _propTypes["default"].oneOf([_propTypes["default"].func, _propTypes["default"].arrayOf(_propTypes["default"].func)]),
+  fieldErrors: _propTypes["default"].object,
+  externalMessagesErrors: _propTypes["default"].arrayOf(_propTypes["default"].string),
+  handlerFieldValidade: _propTypes["default"].func,
+  onChange: _propTypes["default"].func
+};
+FieldPeriod.defaultProps = {
+  component: undefined,
+  onBlur: undefined,
+  validators: undefined,
+  fieldErrors: {},
+  externalMessagesErrors: [],
+  handlerFieldValidade: undefined,
+  onChange: undefined
+};
+
+var _default = (0, _withFieldHOC["default"])(FieldPeriod);
+
+exports["default"] = _default;