tenjin-ui-kit 0.2.49 → 0.2.51

package/common/hooks/newApiHook.js

@@ -35,31 +35,77 @@ var useAPI = function useAPI() {
     _useState8 = _slicedToArray(_useState7, 2),
     deleteResult = _useState8[0],
     setdeleteResult = _useState8[1];
-  var _useState9 = (0, _react.useState)({
+  //
+  var _useState9 = (0, _react.useState)(null),
+    _useState10 = _slicedToArray(_useState9, 2),
+    getError = _useState10[0],
+    setGetError = _useState10[1];
+  var _useState11 = (0, _react.useState)(null),
+    _useState12 = _slicedToArray(_useState11, 2),
+    postError = _useState12[0],
+    setpostError = _useState12[1];
+  var _useState13 = (0, _react.useState)(null),
+    _useState14 = _slicedToArray(_useState13, 2),
+    putError = _useState14[0],
+    setputError = _useState14[1];
+  var _useState15 = (0, _react.useState)(null),
+    _useState16 = _slicedToArray(_useState15, 2),
+    deleteError = _useState16[0],
+    setdeleteError = _useState16[1];
+  //
+  var _useState17 = (0, _react.useState)(null),
+    _useState18 = _slicedToArray(_useState17, 2),
+    getLoading = _useState18[0],
+    setGetLoading = _useState18[1];
+  var _useState19 = (0, _react.useState)(null),
+    _useState20 = _slicedToArray(_useState19, 2),
+    postLoading = _useState20[0],
+    setpostLoading = _useState20[1];
+  var _useState21 = (0, _react.useState)(null),
+    _useState22 = _slicedToArray(_useState21, 2),
+    putLoading = _useState22[0],
+    setputLoading = _useState22[1];
+  var _useState23 = (0, _react.useState)(null),
+    _useState24 = _slicedToArray(_useState23, 2),
+    deleteLoading = _useState24[0],
+    setdeleteLoading = _useState24[1];
+  var _useState25 = (0, _react.useState)({
       getResult: getResult,
       postResult: postResult,
       putResult: putResult,
       deleteResult: deleteResult
     }),
-    _useState10 = _slicedToArray(_useState9, 2),
-    result = _useState10[0],
-    setResult = _useState10[1];
-  var _useState11 = (0, _react.useState)(null),
-    _useState12 = _slicedToArray(_useState11, 2),
-    errorMessage = _useState12[0],
-    setErrorMessage = _useState12[1];
-  var _useState13 = (0, _react.useState)(false),
-    _useState14 = _slicedToArray(_useState13, 2),
-    loading = _useState14[0],
-    setLoading = _useState14[1];
+    _useState26 = _slicedToArray(_useState25, 2),
+    result = _useState26[0],
+    setResult = _useState26[1];
+  var _useState27 = (0, _react.useState)({
+      getError: getError,
+      postError: postError,
+      putError: putError,
+      deleteError: deleteError
+    }),
+    _useState28 = _slicedToArray(_useState27, 2),
+    errorMessage = _useState28[0],
+    setErrorMessage = _useState28[1];
+  var _useState29 = (0, _react.useState)({
+      getLoading: getLoading,
+      postLoading: postLoading,
+      putLoading: putLoading,
+      deleteLoading: deleteLoading
+    }),
+    _useState30 = _slicedToArray(_useState29, 2),
+    loading = _useState30[0],
+    setLoading = _useState30[1];
   var useGet = /*#__PURE__*/function () {
     var _ref = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee(url, action) {
-      var response;
+      var response, parsedError;
       return _regeneratorRuntime().wrap(function _callee$(_context) {
         while (1) switch (_context.prev = _context.next) {
           case 0:
             _context.prev = 0;
-            setLoading(true);
+            setLoading({
+              getLoading: true
+            });
             _context.next = 4;
             return (0, _http.getSecureClient)().get(url);
           case 4:
@@ -67,15 +113,22 @@ var useAPI = function useAPI() {
             setResult({
               getResult: response
             });
-            setLoading(false);
-            _context.next = 13;
+            setLoading({
+              getLoading: false
+            });
+            _context.next = 14;
             break;
           case 9:
             _context.prev = 9;
             _context.t0 = _context["catch"](0);
-            setErrorMessage(_context.t0.message);
-            setLoading(false);
-          case 13:
+            parsedError = (0, _http.parseAxiosError)(_context.t0);
+            setErrorMessage({
+              getError: parsedError.message
+            });
+            setLoading({
+              getLoading: false
+            });
+          case 14:
           case "end":
             return _context.stop();
         }
@@ -87,12 +140,14 @@ var useAPI = function useAPI() {
   }();
   var usePost = /*#__PURE__*/function () {
     var _ref2 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee2(url, body, action) {
-      var response;
+      var response, parsedError;
       return _regeneratorRuntime().wrap(function _callee2$(_context2) {
         while (1) switch (_context2.prev = _context2.next) {
           case 0:
             _context2.prev = 0;
-            setLoading(true);
+            setLoading({
+              postLoading: true
+            });
             _context2.next = 4;
             return (0, _http.getSecureClient)().post(url, body);
           case 4:
@@ -100,15 +155,22 @@ var useAPI = function useAPI() {
             setResult({
               postResult: response
             });
-            setLoading(false);
-            _context2.next = 13;
+            setLoading({
+              postLoading: false
+            });
+            _context2.next = 14;
             break;
           case 9:
             _context2.prev = 9;
             _context2.t0 = _context2["catch"](0);
-            setErrorMessage(_context2.t0.message);
-            setLoading(false);
-          case 13:
+            parsedError = (0, _http.parseAxiosError)(_context2.t0);
+            setErrorMessage({
+              postError: parsedError.message
+            });
+            setLoading({
+              postLoading: false
+            });
+          case 14:
           case "end":
             return _context2.stop();
         }
@@ -120,28 +182,37 @@ var useAPI = function useAPI() {
   }();
   var usePut = /*#__PURE__*/function () {
     var _ref3 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee3(url, body, action) {
-      var response;
+      var response, _response, parsedError;
       return _regeneratorRuntime().wrap(function _callee3$(_context3) {
         while (1) switch (_context3.prev = _context3.next) {
           case 0:
             _context3.prev = 0;
-            setLoading(true);
+            setLoading({
+              putLoading: true
+            });
             _context3.next = 4;
             return (0, _http.getSecureClient)().put(url, body);
           case 4:
-            response = _context3.sent;
+            _response = _context3.sent;
             setResult({
-              putResult: response
+              putResult: _response
+            });
+            setLoading({
+              putLoading: false
             });
-            setLoading(false);
-            _context3.next = 13;
+            _context3.next = 14;
             break;
           case 9:
             _context3.prev = 9;
             _context3.t0 = _context3["catch"](0);
-            setErrorMessage(_context3.t0.message);
-            setLoading(false);
-          case 13:
+            parsedError = (0, _http.parseAxiosError)(_context3.t0);
+            setErrorMessage({
+              putError: parsedError.message
+            });
+            setLoading({
+              putLoading: false
+            });
+          case 14:
           case "end":
             return _context3.stop();
         }
@@ -153,12 +224,14 @@ var useAPI = function useAPI() {
   }();
   var useDelete = /*#__PURE__*/function () {
     var _ref4 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee4(url, action) {
-      var response;
+      var response, parsedError;
       return _regeneratorRuntime().wrap(function _callee4$(_context4) {
         while (1) switch (_context4.prev = _context4.next) {
           case 0:
             _context4.prev = 0;
-            setLoading(true);
+            setLoading({
+              deleteLoading: true
+            });
             _context4.next = 4;
             return (0, _http.getSecureClient)().delete(url);
           case 4:
@@ -166,15 +239,22 @@ var useAPI = function useAPI() {
             setResult({
               deleteResult: response
             });
-            setLoading(false);
-            _context4.next = 13;
+            setLoading({
+              deleteLoading: false
+            });
+            _context4.next = 14;
             break;
           case 9:
             _context4.prev = 9;
             _context4.t0 = _context4["catch"](0);
-            setErrorMessage(_context4.t0.message);
-            setLoading(false);
-          case 13:
+            parsedError = (0, _http.parseAxiosError)(_context4.t0);
+            setErrorMessage({
+              deleteError: parsedError.message
+            });
+            setLoading({
+              deleteLoading: false
+            });
+          case 14:
           case "end":
             return _context4.stop();
         }

package/components/input/index.js

@@ -34,7 +34,10 @@ var Input = function Input(_ref) {
     fullWidth: fullWidth
   }, label && /*#__PURE__*/_react.default.createElement(_InputLabel.default, {
     sx: {
-      fontWeight: 500
+      fontWeight: 500,
+      '& .MuiFormLabel-asterisk': {
+        color: '#FF0000'
+      }
     },
     size: "small",
     shrink: true,
@@ -43,13 +46,13 @@ var Input = function Input(_ref) {
   }, label), !error && /*#__PURE__*/_react.default.createElement(_material.OutlinedInput, _extends({}, rest, {
     id: id,
     required: isRequired,
-    autoComplete: disableAutocomplete ? "nothing" : null,
+    autoComplete: disableAutocomplete ? 'nothing' : null,
     sx: {
       marginTop: label ? theme.spacing(2.5) : 0,
-      "& label": {
+      '& label': {
         fontWeight: 500
       },
-      "& svg": {
+      '& svg': {
         marginRight: startIcon ? theme.spacing(1) : 0,
         marginLeft: endIcon ? theme.spacing(1) : 0
       }
@@ -61,13 +64,13 @@ var Input = function Input(_ref) {
   })), error && /*#__PURE__*/_react.default.createElement(_material.TextField, _extends({
     required: isRequired,
     id: id,
-    autoComplete: disableAutocomplete ? "nothing" : null,
+    autoComplete: disableAutocomplete ? 'nothing' : null,
     sx: {
       marginTop: label ? theme.spacing(2.5) : 0,
-      "& label": {
+      '& label': {
         fontWeight: 500
       },
-      "& svg": {
+      '& svg': {
         marginRight: startIcon ? theme.spacing(1) : 0,
         marginLeft: endIcon ? theme.spacing(1) : 0
       }

package/components/select/index.js

@@ -33,7 +33,7 @@ var ReactSelect = function ReactSelect(props) {
     isRequired = props.isRequired,
     isDisabled = props.isDisabled,
     rest = _objectWithoutProperties(props, _excluded);
-  console.log(defaultValue, "hsgdsahgd", options[1]);
+  console.log(defaultValue, 'hsgdsahgd', options[1]);
   var icon = /*#__PURE__*/_react.default.createElement(_CheckBoxOutlineBlank.default, {
     fontSize: "small"
   });
@@ -45,14 +45,19 @@ var ReactSelect = function ReactSelect(props) {
   }, /*#__PURE__*/_react.default.createElement(_material.FormLabel, {
     htmlFor: "my-input",
     sx: {
-      fontSize: "0.8rem",
+      fontSize: '0.8rem',
       fontWeight: 500
     }
-  }, label, isRequired ? "*" : ""), checkBox && /*#__PURE__*/_react.default.createElement(_material.Autocomplete, _extends({}, rest, {
+  }, label, isRequired ? /*#__PURE__*/_react.default.createElement("span", {
+    style: {
+      color: 'red'
+    }
+  }, " *") : ''), checkBox && /*#__PURE__*/_react.default.createElement(_material.Autocomplete, _extends({}, rest, {
     disabled: isDisabled,
     multiple: isMulti,
-    options: options,
-    disableCloseOnSelect: true,
+    options: options
+    // disableCloseOnSelect
+    ,
     getOptionLabel: function getOptionLabel(option) {
       return option === null || option === void 0 ? void 0 : option.label;
     },
@@ -79,8 +84,9 @@ var ReactSelect = function ReactSelect(props) {
   })), !checkBox && !blueTheme && /*#__PURE__*/_react.default.createElement(_material.Autocomplete, _extends({}, rest, {
     disabled: isDisabled,
     multiple: isMulti,
-    options: options,
-    disableCloseOnSelect: true,
+    options: options
+    // disableCloseOnSelect
+    ,
     getOptionLabel: function getOptionLabel(option) {
       return option.label;
     },
@@ -100,37 +106,38 @@ var ReactSelect = function ReactSelect(props) {
   })), blueTheme && /*#__PURE__*/_react.default.createElement(_material.Grid, {
     container: true,
     sx: {
-      height: "200px",
-      backgroundColor: "#3D3981",
-      borderRadius: "7px",
-      padding: "16px",
-      width: "50%"
+      height: '200px',
+      backgroundColor: '#3D3981',
+      borderRadius: '7px',
+      padding: '16px',
+      width: '50%'
       //   background: "red",
     }
   }, /*#__PURE__*/_react.default.createElement(_material.Autocomplete, _extends({
     sx: {
-      width: "100%",
+      width: '100%',
       "& .MuiAutocomplete-inputRoot[class*='MuiOutlinedInput-root']": {
-        background: "#6e6ba1",
-        color: "#F4F7FC"
+        background: '#6e6ba1',
+        color: '#F4F7FC'
       }
     },
     PaperComponent: function PaperComponent(_ref2) {
       var children = _ref2.children;
       return /*#__PURE__*/_react.default.createElement(_material.Paper, {
         style: {
-          background: "#6e6ba1",
-          color: "#F4F7FC",
-          "&:hover": {
-            background: "#fff"
+          background: '#6e6ba1',
+          color: '#F4F7FC',
+          '&:hover': {
+            background: '#fff'
           }
         }
       }, children);
     }
   }, rest, {
     disabled: isDisabled,
-    options: options,
-    disableCloseOnSelect: true,
+    options: options
+    // disableCloseOnSelect
+    ,
     getOptionLabel: function getOptionLabel(option) {
       return option.label;
     },
@@ -166,13 +173,13 @@ ReactSelect.propTypes = {
 };
 ReactSelect.defaultProps = {
   value: {},
-  label: "",
-  className: "",
+  label: '',
+  className: '',
   defaultValue: [{}],
   isMulti: false,
   isDisabled: false,
   options: [],
-  placeholder: "",
+  placeholder: '',
   isRequired: false,
   simulateNativeSelect: true
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "tenjin-ui-kit",
-  "version": "0.2.49",
+  "version": "0.2.51",
   "repository": {
     "url": "https://gitlab.com/yethi/react/tenjin-ui-kit.git"
   },

package/themes/default.js

@@ -9,12 +9,12 @@ var _default = (0, _material.createTheme)({
   components: {
     MuiButton: {
       defaultProps: {
-        variant: "contained",
+        variant: 'contained',
         disableRipple: true
       },
       styleOverrides: {
         root: {
-          textTransform: "initial"
+          textTransform: 'initial'
         }
       }
     },
@@ -41,46 +41,56 @@ var _default = (0, _material.createTheme)({
   MuiAutocomplete: {
     styleOverrides: {
       root: {
-        padding: "0.5rem 0.75rem",
-        border: "1px solid black !important",
-        borderRadius: "0.25rem",
-        backgroundColor: "white",
-        "& .MuiAutocomplete-input": {
-          padding: "0.5rem 0.75rem",
-          fontSize: "1rem",
-          border: "1px solid black !important"
+        padding: '0.5rem 0.75rem',
+        border: '1px solid black !important',
+        borderRadius: '0.25rem',
+        backgroundColor: 'white',
+        '& .MuiAutocomplete-input': {
+          padding: '0.5rem 0.75rem',
+          fontSize: '1rem',
+          border: '1px solid black !important'
+        }
+      }
+    },
+    MuiInputLabel: {
+      styleOverrides: {
+        asterisk: {
+          color: '#db3131',
+          '&$error': {
+            color: '#db3131'
+          }
         }
       }
     }
   },
   overrides: {
     MuiCssBaseline: {
-      "@global": {
+      '@global': {
         html: {
-          "scroll-behavior": "smooth",
-          height: "100vh"
+          'scroll-behavior': 'smooth',
+          height: '100vh'
         },
         body: {
-          position: "relative",
+          position: 'relative',
           margin: 0,
-          height: "100vh",
-          color: "#000000",
-          backgroundColor: "#f4f7fc"
+          height: '100vh',
+          color: '#000000',
+          backgroundColor: '#f4f7fc'
         },
-        "*::-webkit-scrollbar": {
-          width: "6px"
+        '*::-webkit-scrollbar': {
+          width: '6px'
         },
         a: {
-          textDecoration: "none",
-          color: "#44409A"
+          textDecoration: 'none',
+          color: '#44409A'
         },
-        "*::-webkit-scrollbar-thumb": {
-          backgroundColor: "#e4e4e4",
-          borderRadius: "3px",
+        '*::-webkit-scrollbar-thumb': {
+          backgroundColor: '#e4e4e4',
+          borderRadius: '3px',
           opacity: 0.5
         },
-        "*::-webkit-scrollbar-track": {
-          background: "transparent"
+        '*::-webkit-scrollbar-track': {
+          background: 'transparent'
         }
       }
     }
@@ -123,83 +133,83 @@ var _default = (0, _material.createTheme)({
     //   main: "#BF1E1E",
     // },
     primary: {
-      main: "#44409A"
+      main: '#44409A'
     },
     primary_light: {
-      main: "#5B58A9"
+      main: '#5B58A9'
     },
     primary_dark: {
-      main: "#000050"
+      main: '#000050'
     },
     secondary: {
-      main: "#BF1E1E"
+      main: '#BF1E1E'
     },
     secondary_light: {
-      main: "#CC3F3F"
+      main: '#CC3F3F'
     },
     secondary_dark: {
-      main: "#951010"
+      main: '#951010'
     },
     success: {
-      main: "#2C7413"
+      main: '#2C7413'
     },
     success_light: {
-      main: "#5EA342"
+      main: '#5EA342'
     },
     success_dark: {
-      main: "#004700"
+      main: '#004700'
     },
     info: {
-      main: "#70BBFD"
+      main: '#70BBFD'
     },
     info_light: {
-      main: "#A6EDFF"
+      main: '#A6EDFF'
     },
     info_dark: {
-      main: "#358BCA"
+      main: '#358BCA'
     },
     error: {
-      main: "#BE1515"
+      main: '#BE1515'
     },
     error_light: {
-      main: "#F8533F"
+      main: '#F8533F'
     },
     error_dark: {
-      main: "#860000"
+      main: '#860000'
     },
     warning: {
-      main: "#EB9A31"
+      main: '#EB9A31'
     },
     warning_light: {
-      main: "#FFCB62"
+      main: '#FFCB62'
     },
     warning_dark: {
-      main: "#B46C00"
+      main: '#B46C00'
     },
     grey: {
-      main: "#7D7D7D"
+      main: '#7D7D7D'
     },
     grey_light: {
-      main: "#ACACAC"
+      main: '#ACACAC'
     },
     grey_dark: {
-      main: "#515151"
+      main: '#515151'
     },
     secondary_grey: {
-      main: "#D7E2F0"
+      main: '#D7E2F0'
     },
     white: {
-      main: "#ffffff"
+      main: '#ffffff'
     },
     default: {
-      main: "#7D7D7D"
+      main: '#7D7D7D'
     },
     text: {
-      main: "#000000"
+      main: '#000000'
     }
   },
   typography: {
-    fontFamily: ["-apple-system", "BlinkMacSystemFont", '"Segoe UI"', "Roboto", '"Helvetica Neue"', "Arial", "sans-serif", '"Apple Color Emoji"', '"Segoe UI Emoji"', '"Segoe UI Symbol"'].join(",")
+    fontFamily: ['-apple-system', 'BlinkMacSystemFont', '"Segoe UI"', 'Roboto', '"Helvetica Neue"', 'Arial', 'sans-serif', '"Apple Color Emoji"', '"Segoe UI Emoji"', '"Segoe UI Symbol"'].join(',')
   }
 });
 exports.default = _default;