@agilemotion/oui-react-js 1.6.1 → 1.6.2

package/dist/components/signatures/Toolbar.js

@@ -39,93 +39,124 @@ var _ViewUtils = _interopRequireDefault(require("./ViewUtils"));
 
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
-const useStyles = (0, _styles.makeStyles)(theme => ({
-  paper: {
-    display: 'flex',
-    flexWrap: 'wrap',
-    marginBottom: '5px'
-  },
-  divider: {
-    alignSelf: 'stretch',
-    height: 'auto',
-    width: '1px',
-    margin: theme.spacing(1, 0.5),
-    backgroundColor: theme.palette.primary.main
-  },
-  themeButton: {
-    color: 'white',
-    fontSize: '12px',
-    height: '30px',
-    backgroundColor: theme.palette.primary.main,
-    "&:hover, &:focus": {
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); keys.push.apply(keys, symbols); } return keys; }
+
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
+
+function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return 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 {
+    paper: {
+      display: 'flex',
+      flexWrap: 'wrap',
+      marginBottom: '5px'
+    },
+    divider: {
+      alignSelf: 'stretch',
+      height: 'auto',
+      width: '1px',
+      margin: theme.spacing(1, 0.5),
+      backgroundColor: theme.palette.primary.main
+    },
+    themeButton: {
       color: 'white',
+      fontSize: '12px',
+      height: '30px',
       backgroundColor: theme.palette.primary.main,
-      opacity: '0.7'
+      "&:hover, &:focus": {
+        color: 'white',
+        backgroundColor: theme.palette.primary.main,
+        opacity: '0.7'
+      }
     }
-  }
-}));
-const StyledToggleButtonGroup = (0, _styles.withStyles)(theme => ({
-  grouped: {
-    margin: theme.spacing(0.5),
-    border: 'none',
-    padding: theme.spacing(0, 1),
-    '&:not(:first-child)': {
-      borderRadius: theme.shape.borderRadius
-    },
-    '&:first-child': {
-      borderRadius: theme.shape.borderRadius
+  };
+});
+var StyledToggleButtonGroup = (0, _styles.withStyles)(function (theme) {
+  return {
+    grouped: {
+      margin: theme.spacing(0.5),
+      border: 'none',
+      padding: theme.spacing(0, 1),
+      '&:not(:first-child)': {
+        borderRadius: theme.shape.borderRadius
+      },
+      '&:first-child': {
+        borderRadius: theme.shape.borderRadius
+      }
     }
-  }
-}))(_ToggleButtonGroup.default);
-const utils = new _ViewUtils.default();
+  };
+})(_ToggleButtonGroup.default);
+var utils = new _ViewUtils.default();
 
-const EnhancedToolbar = /*#__PURE__*/_react.default.forwardRef((props, ref) => {
-  const [alignment, setAlignment] = _react.default.useState('left');
+var EnhancedToolbar = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
+  var _React$useState = _react.default.useState('left'),
+      _React$useState2 = _slicedToArray(_React$useState, 2),
+      alignment = _React$useState2[0],
+      setAlignment = _React$useState2[1];
 
-  const [buttonDisability, setButtonDisability] = _react.default.useState({});
+  var _React$useState3 = _react.default.useState({}),
+      _React$useState4 = _slicedToArray(_React$useState3, 2),
+      buttonDisability = _React$useState4[0],
+      setButtonDisability = _React$useState4[1];
 
-  const [config, setConfig] = _react.default.useState(props.config);
+  var _React$useState5 = _react.default.useState(props.config),
+      _React$useState6 = _slicedToArray(_React$useState5, 2),
+      config = _React$useState6[0],
+      setConfig = _React$useState6[1];
 
-  let itemKeyCounter = 0;
-  let buttonKeyCounter = 0;
+  var itemKeyCounter = 0;
+  var buttonKeyCounter = 0;
 
-  const handleAlignment = (event, newAlignment) => {
+  var handleAlignment = function handleAlignment(event, newAlignment) {
     setAlignment(newAlignment);
   };
 
-  const setButtonDisabled = (name, disabled) => {
+  var _setButtonDisabled = function setButtonDisabled(name, disabled) {
     buttonDisability[name] = disabled; // Force a refresh
     //setButtonDisability(JSON.parse(JSON.stringify(buttonDisability)));
 
-    setButtonDisability({ ...buttonDisability,
-      ["key"]: Math.random()
-    });
+    setButtonDisability(_objectSpread(_objectSpread({}, buttonDisability), {}, _defineProperty({}, "key", Math.random())));
   };
 
-  _react.default.useImperativeHandle(ref, () => ({
-    setButtonDisabled: (name, disabled) => {
-      return setButtonDisabled(name, disabled);
-    }
-  }));
+  _react.default.useImperativeHandle(ref, function () {
+    return {
+      setButtonDisabled: function setButtonDisabled(name, disabled) {
+        return _setButtonDisabled(name, disabled);
+      }
+    };
+  });
 
-  _react.default.useEffect(() => {
+  _react.default.useEffect(function () {
     if (!utils.isNull(props.mode)) {
       setConfig(utils.processToolbarConfig(props.mode, props.config));
     } else {
       setConfig(props.config);
     }
 
-    let items = config.items;
-    let temp = {};
+    var items = config.items;
+    var temp = {};
 
     for (var i = 0; i < items.length; i++) {
-      let type = items[i].type;
+      var type = items[i].type;
 
       if (type === 'buttonGroup') {
-        let buttons = items[i].buttons;
+        var buttons = items[i].buttons;
 
         for (var j = 0; j < buttons.length; j++) {
-          let button = buttons[j];
+          var button = buttons[j];
           temp[button.id] = !utils.isNull(button.disabled) && button.disabled;
         }
       }
@@ -134,47 +165,57 @@ const EnhancedToolbar = /*#__PURE__*/_react.default.forwardRef((props, ref) => {
     setButtonDisability(temp);
   });
 
-  const classes = useStyles();
+  var classes = useStyles();
   return /*#__PURE__*/_react.default.createElement("div", null, /*#__PURE__*/_react.default.createElement(_Paper.default, {
     elevation: 0,
     className: classes.paper,
     ref: ref
-  }, config !== null ? config.items.map(item => item.type === 'buttonGroup' ? /*#__PURE__*/_react.default.createElement(StyledToggleButtonGroup, {
-    size: "small",
-    value: alignment,
-    exclusive: true,
-    key: itemKeyCounter++,
-    onChange: handleAlignment,
-    "aria-label": "text alignment"
-  }, item.buttons.map(button => button.visible === null || typeof button.visible === "undefined" || button.visible === true ? button.contextMenu === null || typeof button.contextMenu === "undefined" ? /*#__PURE__*/_react.default.createElement(_ToggleButton.default, {
-    key: buttonKeyCounter++,
-    value: button.id,
-    "aria-label": button.Tooltip,
-    disabled: buttonDisability[button.id],
-    onClick: () => props.buttonClickHandler(button.id),
-    className: button.theme === true ? classes.themeButton : "",
-    style: {
-      width: button.width !== null && typeof button.width !== 'undefined' ? button.width : 'auto'
-    }
-  }, /*#__PURE__*/_react.default.createElement(_Tooltip.default, {
-    title: button.tooltip
-  }, button.icon !== null && typeof button.icon !== 'undefined' ? button.icon === "AddIcon" ? /*#__PURE__*/_react.default.createElement(_Add.default, null) : button.icon === "SaveIcon" ? /*#__PURE__*/_react.default.createElement(_Save.default, null) : button.icon === "EditIcon" ? /*#__PURE__*/_react.default.createElement(_Edit.default, null) : button.icon === "InfoIcon" ? /*#__PURE__*/_react.default.createElement(_Info.default, null) : /*#__PURE__*/_react.default.createElement(_Delete.default, null) : /*#__PURE__*/_react.default.createElement("div", null, " ", button.label, " "))) : /*#__PURE__*/_react.default.createElement("div", null, /*#__PURE__*/_react.default.createElement(_MenuButton.default, {
-    label: button.label,
-    width: button.width,
-    defaultStyle: true,
-    disabled: buttonDisability[button.id]
-  }, /*#__PURE__*/_react.default.createElement(_MenuList.default, {
-    style: {
-      background: "#ffffff",
-      opacity: "1"
-    }
-  }, button.contextMenu.map(menu => /*#__PURE__*/_react.default.createElement(_MenuItem.default, {
-    onClick: () => props.buttonMenuClickHandler(menu)
-  }, menu.description))))) : "")) : item.type === 'devider' && item.visible === null || typeof item.visible === "undefined" || item.visible === true ? /*#__PURE__*/_react.default.createElement(_Divider.default, {
-    orientation: "vertical",
-    key: buttonKeyCounter++,
-    className: classes.divider
-  }) : null) : null));
+  }, config !== null ? config.items.map(function (item) {
+    return item.type === 'buttonGroup' ? /*#__PURE__*/_react.default.createElement(StyledToggleButtonGroup, {
+      size: "small",
+      value: alignment,
+      exclusive: true,
+      key: itemKeyCounter++,
+      onChange: handleAlignment,
+      "aria-label": "text alignment"
+    }, item.buttons.map(function (button) {
+      return button.visible === null || typeof button.visible === "undefined" || button.visible === true ? button.contextMenu === null || typeof button.contextMenu === "undefined" ? /*#__PURE__*/_react.default.createElement(_ToggleButton.default, {
+        key: buttonKeyCounter++,
+        value: button.id,
+        "aria-label": button.Tooltip,
+        disabled: buttonDisability[button.id],
+        onClick: function onClick() {
+          return props.buttonClickHandler(button.id);
+        },
+        className: button.theme === true ? classes.themeButton : "",
+        style: {
+          width: button.width !== null && typeof button.width !== 'undefined' ? button.width : 'auto'
+        }
+      }, /*#__PURE__*/_react.default.createElement(_Tooltip.default, {
+        title: button.tooltip
+      }, button.icon !== null && typeof button.icon !== 'undefined' ? button.icon === "AddIcon" ? /*#__PURE__*/_react.default.createElement(_Add.default, null) : button.icon === "SaveIcon" ? /*#__PURE__*/_react.default.createElement(_Save.default, null) : button.icon === "EditIcon" ? /*#__PURE__*/_react.default.createElement(_Edit.default, null) : button.icon === "InfoIcon" ? /*#__PURE__*/_react.default.createElement(_Info.default, null) : /*#__PURE__*/_react.default.createElement(_Delete.default, null) : /*#__PURE__*/_react.default.createElement("div", null, " ", button.label, " "))) : /*#__PURE__*/_react.default.createElement("div", null, /*#__PURE__*/_react.default.createElement(_MenuButton.default, {
+        label: button.label,
+        width: button.width,
+        defaultStyle: true,
+        disabled: buttonDisability[button.id]
+      }, /*#__PURE__*/_react.default.createElement(_MenuList.default, {
+        style: {
+          background: "#ffffff",
+          opacity: "1"
+        }
+      }, button.contextMenu.map(function (menu) {
+        return /*#__PURE__*/_react.default.createElement(_MenuItem.default, {
+          onClick: function onClick() {
+            return props.buttonMenuClickHandler(menu);
+          }
+        }, menu.description);
+      })))) : "";
+    })) : item.type === 'devider' && item.visible === null || typeof item.visible === "undefined" || item.visible === true ? /*#__PURE__*/_react.default.createElement(_Divider.default, {
+      orientation: "vertical",
+      key: buttonKeyCounter++,
+      className: classes.divider
+    }) : null;
+  }) : null));
 });
 
 var _default = EnhancedToolbar;