@agilemotion/oui-react-js 1.6.4 → 1.6.6

package/dist/components/signatures/SearchView.js

@@ -4,110 +4,50 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = SearchView;
-
 var _react = _interopRequireDefault(require("react"));
-
 var _ResponsiveTable = _interopRequireDefault(require("./ResponsiveTable"));
-
 var _IconButton = _interopRequireDefault(require("@material-ui/core/IconButton"));
-
 var _Search = _interopRequireDefault(require("@material-ui/icons/Search"));
-
 var _ViewUtils = _interopRequireDefault(require("./ViewUtils"));
-
 var _Prompt = _interopRequireDefault(require("./Prompt"));
-
 var _AlertItem = _interopRequireDefault(require("./AlertItem"));
-
-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) { if (typeof Symbol === "undefined" || !(Symbol.iterator in Object(arr))) return; var _arr = []; var _n = true; var _d = false; var _e = undefined; try { for (var _i = arr[Symbol.iterator](), _s; !(_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; }
-
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
 function SearchView(props) {
-  var utils = new _ViewUtils.default();
-
-  var _React$useState = _react.default.useState(props.model),
-      _React$useState2 = _slicedToArray(_React$useState, 2),
-      model = _React$useState2[0],
-      setModel = _React$useState2[1];
-
-  var _React$useState3 = _react.default.useState(props.searchParameters),
-      _React$useState4 = _slicedToArray(_React$useState3, 2),
-      searchParameters = _React$useState4[0],
-      setSearchParameters = _React$useState4[1];
-
-  var _React$useState5 = _react.default.useState([]),
-      _React$useState6 = _slicedToArray(_React$useState5, 2),
-      selection = _React$useState6[0],
-      setSelection = _React$useState6[1];
-
-  var _React$useState7 = _react.default.useState(""),
-      _React$useState8 = _slicedToArray(_React$useState7, 2),
-      message = _React$useState8[0],
-      setMessage = _React$useState8[1];
-
-  var _React$useState9 = _react.default.useState(""),
-      _React$useState10 = _slicedToArray(_React$useState9, 2),
-      messageStyle = _React$useState10[0],
-      setMessageStyle = _React$useState10[1];
-
-  var _React$useState11 = _react.default.useState(false),
-      _React$useState12 = _slicedToArray(_React$useState11, 1),
-      showToolBar = _React$useState12[0];
-
-  var _React$useState13 = _react.default.useState(props.toolbarRef || /*#__PURE__*/_react.default.createRef()),
-      _React$useState14 = _slicedToArray(_React$useState13, 1),
-      toolbarRef = _React$useState14[0];
-
-  var _React$useState15 = _react.default.useState(false),
-      _React$useState16 = _slicedToArray(_React$useState15, 2),
-      promptOpen = _React$useState16[0],
-      setPromptOpen = _React$useState16[1];
-
-  var _React$useState17 = _react.default.useState(utils.isNull(props.keyUpSwitch) ? false : props.keyUpSwitch),
-      _React$useState18 = _slicedToArray(_React$useState17, 2),
-      keyUpSwitch = _React$useState18[0],
-      setKeyUpSwitch = _React$useState18[1];
-
-  var closePrompt = function closePrompt() {
+  const utils = new _ViewUtils.default();
+  const [model, setModel] = _react.default.useState(props.model);
+  const [searchParameters, setSearchParameters] = _react.default.useState(props.searchParameters);
+  const [selection, setSelection] = _react.default.useState([]);
+  const [message, setMessage] = _react.default.useState("");
+  const [messageStyle, setMessageStyle] = _react.default.useState("");
+  const [showToolBar] = _react.default.useState(false);
+  const [toolbarRef] = _react.default.useState(props.toolbarRef || /*#__PURE__*/_react.default.createRef());
+  const [promptOpen, setPromptOpen] = _react.default.useState(false);
+  const [keyUpSwitch, setKeyUpSwitch] = _react.default.useState(utils.isNull(props.keyUpSwitch) ? false : props.keyUpSwitch);
+  const closePrompt = () => {
     setPromptOpen(false);
   };
-
-  _react.default.useEffect(function () {
+  _react.default.useEffect(() => {
     if (props.keyUpSwitch !== keyUpSwitch) {
       search();
       setKeyUpSwitch(props.keyUpSwitch);
     }
   }, [props.keyUpSwitch]);
-
-  _react.default.useEffect(function () {
+  _react.default.useEffect(() => {
     if (JSON.stringify(model) !== JSON.stringify(props.model)) {
       setModel(props.model);
     }
   }, [props.model]);
-
-  _react.default.useEffect(function () {
+  _react.default.useEffect(() => {
     if (JSON.stringify(props.searchParameters) !== JSON.stringify(searchParameters)) {
       search();
       setSearchParameters(props.searchParameters);
     }
   }, [props.SearchParameters]);
-
-  var deleteRecord = function deleteRecord() {
-    setPromptOpen(false); // TODO : support bulk delete when nulti select is enabled
-
-    var url = "".concat(props.deleteUrl, "?id=").concat(selection[0].Id);
-    utils.invokeUrl(url, function (data) {
+  const deleteRecord = () => {
+    setPromptOpen(false);
+    // TODO : support bulk delete when nulti select is enabled
+    let url = `${props.deleteUrl}?id=${selection[0].Id}`;
+    utils.invokeUrl(url, data => {
       setSelection([]);
       setMessage(data.Message);
       setMessageStyle(data.MessageType.toLowerCase());
@@ -116,8 +56,7 @@ function SearchView(props) {
       search();
     }, null);
   };
-
-  var handleToolbarButtonClick = function handleToolbarButtonClick(buttonId) {
+  const handleToolbarButtonClick = buttonId => {
     if ("info" !== buttonId) {
       if ("add" === buttonId) {
         props.history.push(!utils.isNull(props.addViewPath) ? props.addViewPath : props.entityViewPath);
@@ -131,14 +70,12 @@ function SearchView(props) {
           }
         });
       }
-
       if (!utils.isNull(props.buttonClickHandler)) {
         props.buttonClickHandler(buttonId);
       }
     }
   };
-
-  var handleDataArrived = function handleDataArrived(data) {
+  const handleDataArrived = data => {
     if (!utils.isNull(data) && props.mode === 'lookup') {
       if (data.Data.length === 0) {
         setMessage("No data records found");
@@ -149,52 +86,41 @@ function SearchView(props) {
       }
     }
   };
-
-  var isModelEmpty = function isModelEmpty() {
-    var properties = Object.getOwnPropertyNames(model);
-
+  const isModelEmpty = () => {
+    const properties = Object.getOwnPropertyNames(model);
     if (utils.isNull(properties) || properties.length === 0) {
       return true;
     }
-
-    for (var i = 0; i < properties.length; i++) {
+    for (let i = 0; i < properties.length; i++) {
       if (!utils.isStringEmpty(properties[properties[i]])) {
         return false;
       }
     }
-
     return true;
   };
-
-  var search = function search() {
-    var searchParameters = [];
-    var properties = Object.getOwnPropertyNames(model);
-
+  const search = () => {
+    let searchParameters = [];
+    const properties = Object.getOwnPropertyNames(model);
     if (!utils.isNull(properties) && properties.length > 0) {
-      for (var i = 0; i < properties.length; i++) {
-        var searchParameter = {};
+      for (let i = 0; i < properties.length; i++) {
+        let searchParameter = {};
         searchParameter.name = properties[i];
         searchParameter.type = "string";
         searchParameter.value = model[properties[i]];
         searchParameters.push(searchParameter);
       }
     }
-
     setSearchParameters(searchParameters);
   };
-
-  var handleSelectionChange = function handleSelectionChange(selection) {
+  const handleSelectionChange = selection => {
     setSelection(selection);
-
     if (props.setSelection) {
       props.setSelection(selection);
     }
-
     if (!utils.isNull(props.onLookupValueChange)) {
       props.onLookupValueChange(selection);
     }
   };
-
   return /*#__PURE__*/_react.default.createElement("div", {
     className: "w-100",
     style: {
@@ -207,9 +133,7 @@ function SearchView(props) {
     message: message,
     alertStyle: messageStyle
   }), /*#__PURE__*/_react.default.createElement("table", null, /*#__PURE__*/_react.default.createElement("tbody", null, /*#__PURE__*/_react.default.createElement("tr", null, /*#__PURE__*/_react.default.createElement("td", null, props.children), /*#__PURE__*/_react.default.createElement("td", null, props.search === false ? null : /*#__PURE__*/_react.default.createElement(_IconButton.default, {
-    onClick: function onClick() {
-      return search();
-    },
+    onClick: () => search(),
     "aria-label": "search"
   }, /*#__PURE__*/_react.default.createElement(_Search.default, null)))))), /*#__PURE__*/_react.default.createElement("div", {
     style: {
@@ -217,14 +141,12 @@ function SearchView(props) {
     }
   }, /*#__PURE__*/_react.default.createElement(_ResponsiveTable.default, {
     headCells: props.headCells,
-    onSelectionChange: function onSelectionChange(selection) {
+    onSelectionChange: selection => {
       handleSelectionChange(selection);
     },
     dataUrl: props.dataUrl,
     dataService: props.dataService,
-    onDataArrive: function onDataArrive(data) {
-      return handleDataArrived(data);
-    },
+    onDataArrive: data => handleDataArrived(data),
     mode: props.mode,
     autoFetchData: props.autoFetchData,
     height: "20vh",

package/dist/components/signatures/SignatorySearch.js

@@ -4,51 +4,22 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = SignatorySearch;
-
 var _react = _interopRequireDefault(require("react"));
-
 var _SignatorySearchForm = _interopRequireDefault(require("./SignatorySearchForm"));
-
 var _Card = _interopRequireDefault(require("./Card"));
-
 var _IconButton = _interopRequireDefault(require("@material-ui/core/IconButton"));
-
 var _Search = _interopRequireDefault(require("@material-ui/icons/Search"));
-
 var _RestUtils = require("../../RestUtils");
-
-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) { if (typeof Symbol === "undefined" || !(Symbol.iterator in Object(arr))) return; var _arr = []; var _n = true; var _d = false; var _e = undefined; try { for (var _i = arr[Symbol.iterator](), _s; !(_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; }
-
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
 function SignatorySearch(props) {
-  var _React$useState = _react.default.useState(null),
-      _React$useState2 = _slicedToArray(_React$useState, 2),
-      data = _React$useState2[0],
-      setData = _React$useState2[1];
-
-  var _React$useState3 = _react.default.useState(null),
-      _React$useState4 = _slicedToArray(_React$useState3, 2),
-      emailAddress = _React$useState4[0],
-      setEmailAddress = _React$useState4[1];
-
-  var _onValueChange = function onValueChange(val) {
+  const [data, setData] = _react.default.useState(null);
+  const [emailAddress, setEmailAddress] = _react.default.useState(null);
+  const onValueChange = val => {
     setEmailAddress(val);
   };
-
-  var search = function search() {
+  const search = () => {
     if (emailAddress) {
-      var service = {
+      let service = {
         url: props.signatoryUrl,
         parameters: [{
           name: 'id',
@@ -62,17 +33,15 @@ function SignatorySearch(props) {
           get id() {
             return 'signatory-search';
           }
-
         }
-      }, 'signatory-search', function (result) {
+      }, 'signatory-search', result => {
         setData(result);
         props.onLookupValueChange(result);
-      }, function (e) {
+      }, e => {
         console.error(e);
       }, null);
     }
   };
-
   return /*#__PURE__*/_react.default.createElement("div", {
     title: "Signatories",
     style: {
@@ -86,14 +55,12 @@ function SignatorySearch(props) {
       padding: '8px'
     }
   }, "Signatory search"), /*#__PURE__*/_react.default.createElement("div", null, /*#__PURE__*/_react.default.createElement("table", null, /*#__PURE__*/_react.default.createElement("tbody", null, /*#__PURE__*/_react.default.createElement("tr", null, /*#__PURE__*/_react.default.createElement("td", null, /*#__PURE__*/_react.default.createElement(_SignatorySearchForm.default, {
-    onValueChange: function onValueChange(val) {
-      _onValueChange(val);
+    onValueChange: val => {
+      onValueChange(val);
     }
   })), /*#__PURE__*/_react.default.createElement("td", null, props.search === false ? null : /*#__PURE__*/_react.default.createElement(_IconButton.default, {
     disabled: emailAddress === null,
-    onClick: function onClick() {
-      return search();
-    },
+    onClick: () => search(),
     "aria-label": "search"
   }, /*#__PURE__*/_react.default.createElement(_Search.default, null))))))), !data ? /*#__PURE__*/_react.default.createElement("div", {
     style: {

package/dist/components/signatures/SignatorySearchForm.js

@@ -4,64 +4,34 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = SignatorySearchForm;
-
 var _react = _interopRequireDefault(require("react"));
-
 var _styles = require("@material-ui/core/styles");
-
 var _FormControl = _interopRequireDefault(require("@material-ui/core/FormControl"));
-
 var _InputLabel = _interopRequireDefault(require("@material-ui/core/InputLabel"));
-
 var _OutlinedInput = _interopRequireDefault(require("@material-ui/core/OutlinedInput"));
-
 var _TextField = _interopRequireDefault(require("@material-ui/core/TextField"));
-
-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) { if (typeof Symbol === "undefined" || !(Symbol.iterator in Object(arr))) return; var _arr = []; var _n = true; var _d = false; var _e = undefined; try { for (var _i = arr[Symbol.iterator](), _s; !(_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 useStyles = (0, _styles.makeStyles)(function (theme) {
-  return {
-    container: {
-      display: 'flex',
-      flexWrap: 'wrap'
-    },
-    formControl: {
-      margin: theme.spacing(1)
-    },
-    'MuiOutlinedInput-input': {
-      padding: '18.5px 100px'
-    }
-  };
-});
-
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
+const useStyles = (0, _styles.makeStyles)(theme => ({
+  container: {
+    display: 'flex',
+    flexWrap: 'wrap'
+  },
+  formControl: {
+    margin: theme.spacing(1)
+  },
+  'MuiOutlinedInput-input': {
+    padding: '18.5px 100px'
+  }
+}));
 function SignatorySearchForm(props) {
-  var _React$useState = _react.default.useState(0),
-      _React$useState2 = _slicedToArray(_React$useState, 2),
-      labelWidth = _React$useState2[0],
-      setLabelWidth = _React$useState2[1];
-
-  var labelRef = _react.default.useRef(null);
-
-  var classes = useStyles();
-
-  _react.default.useEffect(function () {
+  const [labelWidth, setLabelWidth] = _react.default.useState(0);
+  const labelRef = _react.default.useRef(null);
+  const classes = useStyles();
+  _react.default.useEffect(() => {
     if (labelRef.current !== null) {
       setLabelWidth(labelRef.current.offsetWidth);
     }
   }, []);
-
   return /*#__PURE__*/_react.default.createElement("div", {
     className: "row"
   }, /*#__PURE__*/_react.default.createElement("div", {
@@ -74,9 +44,8 @@ function SignatorySearchForm(props) {
     required: true,
     size: "small",
     margin: "normal",
-    onChange: function onChange(e) {
-      var val = e.target.value;
-
+    onChange: e => {
+      let val = e.target.value;
       if (val.match(/^([a-zA-Z0-9_\-.]+)@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.)|(([a-zA-Z0-9-]+\.)+))([a-zA-Z]{2,4}|[0-9]{1,3})(]?)$/)) {
         props.onValueChange(val);
       } else {

package/dist/components/signatures/SignatureInput.js

@@ -4,128 +4,70 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
-
 var _react = _interopRequireDefault(require("react"));
-
 var _Button = _interopRequireDefault(require("@material-ui/core/Button"));
-
 var _TextField = _interopRequireDefault(require("@material-ui/core/TextField"));
-
 var _Radio = _interopRequireDefault(require("@material-ui/core/Radio"));
-
 var _RadioGroup = _interopRequireDefault(require("@material-ui/core/RadioGroup"));
-
 var _FormControlLabel = _interopRequireDefault(require("@material-ui/core/FormControlLabel"));
-
 var _FormControl = _interopRequireDefault(require("@material-ui/core/FormControl"));
-
 var _FormLabel = _interopRequireDefault(require("@material-ui/core/FormLabel"));
-
 var _Checkbox = _interopRequireDefault(require("@material-ui/core/Checkbox"));
-
 var _ImageSignatureInput = _interopRequireDefault(require("./ImageSignatureInput"));
-
 var _Utils = _interopRequireDefault(require("../../Utils"));
-
 var _ApplicationManager = _interopRequireDefault(require("../../ApplicationManager"));
-
 var _reactPromiseTracker = require("react-promise-tracker");
-
-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) { if (typeof Symbol === "undefined" || !(Symbol.iterator in Object(arr))) return; var _arr = []; var _n = true; var _d = false; var _e = undefined; try { for (var _i = arr[Symbol.iterator](), _s; !(_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 status = function status(response) {
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
+const status = response => {
   if (response.ok) {
     return Promise.resolve(response);
   } else {
-    var error = new Error(response.statusText);
+    let error = new Error(response.statusText);
     error.code = response.status;
     return Promise.reject(error);
   }
 };
-
-var json = function json(response) {
+const json = response => {
   return response.text();
 };
-
-var location = window.location.protocol + "//" + window.location.hostname;
-
-var SignatureInput = /*#__PURE__*/_react.default.memo( /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
-  var _React$useState = _react.default.useState(null),
-      _React$useState2 = _slicedToArray(_React$useState, 2),
-      value = _React$useState2[0],
-      setValue = _React$useState2[1];
-
-  var _React$useState3 = _react.default.useState(false),
-      _React$useState4 = _slicedToArray(_React$useState3, 2),
-      declarationChecked = _React$useState4[0],
-      setDeclarationChecked = _React$useState4[1];
-
-  var _React$useState5 = _react.default.useState('type'),
-      _React$useState6 = _slicedToArray(_React$useState5, 2),
-      method = _React$useState6[0],
-      setMethod = _React$useState6[1];
-
-  var _React$useState7 = _react.default.useState(false),
-      _React$useState8 = _slicedToArray(_React$useState7, 2),
-      signing = _React$useState8[0],
-      setSigning = _React$useState8[1];
-
-  var _React$useState9 = _react.default.useState(false),
-      _React$useState10 = _slicedToArray(_React$useState9, 2),
-      saveAsSystemImage = _React$useState10[0],
-      setSaveAsSystemImage = _React$useState10[1];
-
-  var _React$useState11 = _react.default.useState(props.systemImage),
-      _React$useState12 = _slicedToArray(_React$useState11, 2),
-      systemImage = _React$useState12[0],
-      setSystemImage = _React$useState12[1];
-
-  _react.default.useEffect(function () {
+const location = window.location.protocol + "//" + window.location.hostname;
+const SignatureInput = /*#__PURE__*/_react.default.memo( /*#__PURE__*/_react.default.forwardRef((props, ref) => {
+  const [value, setValue] = _react.default.useState(null);
+  const [declarationChecked, setDeclarationChecked] = _react.default.useState(false);
+  const [method, setMethod] = _react.default.useState('type');
+  const [signing, setSigning] = _react.default.useState(false);
+  const [saveAsSystemImage, setSaveAsSystemImage] = _react.default.useState(false);
+  const [systemImage, setSystemImage] = _react.default.useState(props.systemImage);
+  _react.default.useEffect(() => {
     setSigning(props.signing);
   }, [props.signing]);
-
   function saveImage() {
-    var data = {};
+    let data = {};
     data.signature = props.mode === 'SIGN' ? value : systemImage ? systemImage.signature : null;
     data.initial = props.mode === 'INITIAL' ? value : systemImage ? systemImage.initial : null;
-    var fetchConfig = getFetchConfig(JSON.stringify(data));
-    var url = location + _ApplicationManager.default.getContextRoot() + props.signatureImageUrl + "/save";
-    (0, _reactPromiseTracker.trackPromise)(fetch(encodeURI(url), fetchConfig).then(status).then(json).then(function (result) {
+    let fetchConfig = getFetchConfig(JSON.stringify(data));
+    let url = location + _ApplicationManager.default.getContextRoot() + props.signatureImageUrl + "/save";
+    (0, _reactPromiseTracker.trackPromise)(fetch(encodeURI(url), fetchConfig).then(status).then(json).then(result => {
       setSystemImage(data);
       props.systemSignaturesChangeHandler(data);
-    }).catch(function (e) {
+    }).catch(e => {
       // TODO : Display error message
       if (e.code === 401) {
         _ApplicationManager.default.clear();
-
         _ApplicationManager.default.getApplicationHistory().push('/login');
       }
     }));
   }
-
-  _react.default.useEffect(function () {
+  _react.default.useEffect(() => {
     if (method === 'type') {
       setValue(null);
     } else {
       setValue(systemImage ? props.mode === 'SIGN' ? systemImage.signature : systemImage.initial : null);
     }
   }, [method]);
-
   function getFetchConfig(data) {
-    var accessToken = sessionStorage.getItem("accessToken");
-    var idToken = sessionStorage.getItem("idToken");
+    const accessToken = sessionStorage.getItem("accessToken");
+    const idToken = sessionStorage.getItem("idToken");
     return {
       method: 'POST',
       headers: {
@@ -137,11 +79,9 @@ var SignatureInput = /*#__PURE__*/_react.default.memo( /*#__PURE__*/_react.defau
       body: data
     };
   }
-
-  var handleChange = function handleChange(event) {
+  const handleChange = event => {
     setMethod(event.target.value);
   };
-
   return /*#__PURE__*/_react.default.createElement("div", {
     ref: ref,
     style: {
@@ -200,7 +140,7 @@ var SignatureInput = /*#__PURE__*/_react.default.memo( /*#__PURE__*/_react.defau
     id: 'otp',
     required: true,
     disabled: signing,
-    onChange: function onChange(e) {
+    onChange: e => {
       setValue(e.target.value);
     },
     margin: "dense",
@@ -228,7 +168,7 @@ var SignatureInput = /*#__PURE__*/_react.default.memo( /*#__PURE__*/_react.defau
     value: systemImage ? props.mode === 'SIGN' ? systemImage.signature : systemImage.initial : null,
     mode: props.mode,
     imageProcessingUrl: props.imageProcessingUrl,
-    valueChangeHandler: function valueChangeHandler(value, saveAsSystemImage) {
+    valueChangeHandler: (value, saveAsSystemImage) => {
       setValue(value);
       setSaveAsSystemImage(saveAsSystemImage);
     }
@@ -244,7 +184,7 @@ var SignatureInput = /*#__PURE__*/_react.default.memo( /*#__PURE__*/_react.defau
       key: props.key,
       disabled: signing,
       value: declarationChecked,
-      onChange: function onChange(e) {
+      onChange: e => {
         setDeclarationChecked(e.target.checked);
       },
       size: "small"
@@ -273,7 +213,7 @@ var SignatureInput = /*#__PURE__*/_react.default.memo( /*#__PURE__*/_react.defau
       width: '100px',
       height: '48px'
     },
-    onClick: function onClick() {
+    onClick: () => {
       props.callback('CLOSE');
     }
   }, "CLOSE"), /*#__PURE__*/_react.default.createElement(_Button.default, {
@@ -285,11 +225,10 @@ var SignatureInput = /*#__PURE__*/_react.default.memo( /*#__PURE__*/_react.defau
       width: '100px',
       height: '48px'
     },
-    onClick: function onClick() {
+    onClick: () => {
       if (saveAsSystemImage) {
         saveImage();
       }
-
       props.callback('SIGN', method, value);
     }
   }, signing && /*#__PURE__*/_react.default.createElement("i", {
@@ -299,6 +238,4 @@ var SignatureInput = /*#__PURE__*/_react.default.memo( /*#__PURE__*/_react.defau
     }
   }), props.mode)))));
 }));
-
-var _default = SignatureInput;
-exports.default = _default;
+var _default = exports.default = SignatureInput;