@comet/admin 8.0.0-beta.1 → 8.0.0-beta.3

package/lib/common/buttons/save/SaveButton.js

@@ -1,173 +0,0 @@
-"use strict";
-
-function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.SaveButton = SaveButton;
-var _adminIcons = require("@comet/admin-icons");
-var _material = require("@mui/material");
-var _styles = require("@mui/material/styles");
-var _react = require("react");
-var _reactIntl = require("react-intl");
-var _createComponentSlot = require("../../../helpers/createComponentSlot");
-var _messages = require("../../../messages");
-var _useSplitButtonContext = require("../split/useSplitButtonContext");
-var _jsxRuntime = require("react/jsx-runtime");
-var _excluded = ["saving", "hasErrors", "hasConflict", "children", "savingItem", "successItem", "errorItem", "conflictItem", "saveIcon", "savingIcon", "successIcon", "errorIcon", "conflictIcon", "variant", "color", "disabled"];
-var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7;
-function _slicedToArray(r, e) { return _arrayWithHoles(r) || _iterableToArrayLimit(r, e) || _unsupportedIterableToArray(r, e) || _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(r, a) { if (r) { if ("string" == typeof r) return _arrayLikeToArray(r, a); var t = {}.toString.call(r).slice(8, -1); return "Object" === t && r.constructor && (t = r.constructor.name), "Map" === t || "Set" === t ? Array.from(r) : "Arguments" === t || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(t) ? _arrayLikeToArray(r, a) : void 0; } }
-function _arrayLikeToArray(r, a) { (null == a || a > r.length) && (a = r.length); for (var e = 0, n = Array(a); e < a; e++) n[e] = r[e]; return n; }
-function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t["return"] && (u = t["return"](), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
-function _arrayWithHoles(r) { if (Array.isArray(r)) return r; }
-function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
-function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
-function _defineProperty(e, r, t) { return (r = _toPropertyKey(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: !0, configurable: !0, writable: !0 }) : e[r] = t, e; }
-function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : i + ""; }
-function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
-function _objectWithoutProperties(e, t) { if (null == e) return {}; var o, r, i = _objectWithoutPropertiesLoose(e, t); if (Object.getOwnPropertySymbols) { var n = Object.getOwnPropertySymbols(e); for (r = 0; r < n.length; r++) o = n[r], -1 === t.indexOf(o) && {}.propertyIsEnumerable.call(e, o) && (i[o] = e[o]); } return i; }
-function _objectWithoutPropertiesLoose(r, e) { if (null == r) return {}; var t = {}; for (var n in r) if ({}.hasOwnProperty.call(r, n)) { if (-1 !== e.indexOf(n)) continue; t[n] = r[n]; } return t; }
-function _taggedTemplateLiteral(e, t) { return t || (t = e.slice(0)), Object.freeze(Object.defineProperties(e, { raw: { value: Object.freeze(t) } })); }
-var Root = (0, _createComponentSlot.createComponentSlot)(_material.Button)({
-  componentName: "SaveButton",
-  slotName: "root",
-  classesResolver: function classesResolver(ownerState) {
-    return [ownerState.displayState === "saving" && "saving", ownerState.displayState === "error" && "error", ownerState.displayState === "success" && "success", ownerState.displayState === "conflict" && "conflict"];
-  }
-})(function (_ref) {
-  var ownerState = _ref.ownerState,
-    theme = _ref.theme;
-  return (0, _styles.css)(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n        ", "\n        ", "\n        ", "\n        ", "\n    "])), ownerState.displayState === "saving" && (0, _styles.css)(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n            &:disabled {\n                ", ";\n                ", "\n            }\n        "])), ownerState.variant === "contained" && ownerState.color === "primary" && (0, _styles.css)(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n                    color: ", ";\n                    background-color: ", ";\n                "])), theme.palette.primary.contrastText, theme.palette.primary.main), ownerState.variant === "contained" && ownerState.color === "secondary" && (0, _styles.css)(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n                    color: ", ";\n                    background-color: ", ";\n                "])), theme.palette.secondary.contrastText, theme.palette.secondary.main)), ownerState.displayState === "error" && (0, _styles.css)(_templateObject5 || (_templateObject5 = _taggedTemplateLiteral(["\n            &:disabled {\n                color: ", ";\n                background-color: ", ";\n            }\n        "])), theme.palette.error.contrastText, theme.palette.error.light), ownerState.displayState === "success" && (0, _styles.css)(_templateObject6 || (_templateObject6 = _taggedTemplateLiteral(["\n            &:disabled {\n                color: ", ";\n                background-color: ", ";\n            }\n        "])), theme.palette.success.contrastText, theme.palette.success.light), ownerState.displayState === "conflict" && (0, _styles.css)(_templateObject7 || (_templateObject7 = _taggedTemplateLiteral(["\n            color: ", ";\n            background-color: ", ";\n            &:hover {\n                background-color: ", ";\n            }\n            &.", ":not(:last-child) {\n                border-right-color: ", ";\n            }\n        "])), theme.palette.error.contrastText, theme.palette.error.main, theme.palette.error.dark, _material.buttonGroupClasses.grouped, theme.palette.error.dark));
-});
-function SaveButton(inProps) {
-  var _useThemeProps = (0, _styles.useThemeProps)({
-      props: inProps,
-      name: "CometAdminSaveButton"
-    }),
-    _useThemeProps$saving = _useThemeProps.saving,
-    saving = _useThemeProps$saving === void 0 ? false : _useThemeProps$saving,
-    _useThemeProps$hasErr = _useThemeProps.hasErrors,
-    hasErrors = _useThemeProps$hasErr === void 0 ? false : _useThemeProps$hasErr,
-    _useThemeProps$hasCon = _useThemeProps.hasConflict,
-    hasConflict = _useThemeProps$hasCon === void 0 ? false : _useThemeProps$hasCon,
-    _useThemeProps$childr = _useThemeProps.children,
-    children = _useThemeProps$childr === void 0 ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactIntl.FormattedMessage, _objectSpread({}, _messages.messages.save)) : _useThemeProps$childr,
-    _useThemeProps$saving2 = _useThemeProps.savingItem,
-    savingItem = _useThemeProps$saving2 === void 0 ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactIntl.FormattedMessage, {
-      id: "comet.saveButton.savingItem.title",
-      defaultMessage: "Saving"
-    }) : _useThemeProps$saving2,
-    _useThemeProps$succes = _useThemeProps.successItem,
-    successItem = _useThemeProps$succes === void 0 ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactIntl.FormattedMessage, {
-      id: "comet.saveButton.successItem.title",
-      defaultMessage: "Successfully Saved"
-    }) : _useThemeProps$succes,
-    _useThemeProps$errorI = _useThemeProps.errorItem,
-    errorItem = _useThemeProps$errorI === void 0 ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactIntl.FormattedMessage, {
-      id: "comet.saveButton.errorItem.title",
-      defaultMessage: "Save Error"
-    }) : _useThemeProps$errorI,
-    _useThemeProps$confli = _useThemeProps.conflictItem,
-    conflictItem = _useThemeProps$confli === void 0 ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactIntl.FormattedMessage, _objectSpread({}, _messages.messages.saveConflict)) : _useThemeProps$confli,
-    _useThemeProps$saveIc = _useThemeProps.saveIcon,
-    saveIcon = _useThemeProps$saveIc === void 0 ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_adminIcons.Save, {}) : _useThemeProps$saveIc,
-    _useThemeProps$saving3 = _useThemeProps.savingIcon,
-    savingIcon = _useThemeProps$saving3 === void 0 ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_adminIcons.ThreeDotSaving, {}) : _useThemeProps$saving3,
-    _useThemeProps$succes2 = _useThemeProps.successIcon,
-    successIcon = _useThemeProps$succes2 === void 0 ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_adminIcons.Check, {}) : _useThemeProps$succes2,
-    _useThemeProps$errorI2 = _useThemeProps.errorIcon,
-    errorIcon = _useThemeProps$errorI2 === void 0 ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_adminIcons.Error, {}) : _useThemeProps$errorI2,
-    _useThemeProps$confli2 = _useThemeProps.conflictIcon,
-    conflictIcon = _useThemeProps$confli2 === void 0 ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_adminIcons.Error, {}) : _useThemeProps$confli2,
-    _useThemeProps$varian = _useThemeProps.variant,
-    variant = _useThemeProps$varian === void 0 ? "contained" : _useThemeProps$varian,
-    _useThemeProps$color = _useThemeProps.color,
-    color = _useThemeProps$color === void 0 ? "primary" : _useThemeProps$color,
-    disabled = _useThemeProps.disabled,
-    restProps = _objectWithoutProperties(_useThemeProps, _excluded);
-  var _useState = (0, _react.useState)("idle"),
-    _useState2 = _slicedToArray(_useState, 2),
-    displayState = _useState2[0],
-    setDisplayState = _useState2[1];
-  var saveSplitButton = (0, _useSplitButtonContext.useSplitButtonContext)();
-  var ownerState = {
-    displayState: displayState,
-    variant: variant,
-    color: color
-  };
-  var resolveIconForDisplayState = function resolveIconForDisplayState(displayState) {
-    if (displayState === "saving") {
-      return savingIcon;
-    } else if (displayState === "success") {
-      return successIcon;
-    } else if (displayState === "error") {
-      return errorIcon;
-    } else if (displayState === "conflict") {
-      return conflictIcon;
-    }
-    return saveIcon;
-  };
-  (0, _react.useEffect)(function () {
-    var timeoutId;
-    if ((displayState === "idle" || displayState === "conflict") && saving) {
-      setDisplayState("saving");
-    }
-    // Display Conflict
-    else if (displayState === "idle" && hasConflict) {
-      setDisplayState("conflict");
-    }
-    // Display Error
-    else if (displayState === "saving" && hasErrors === true) {
-      timeoutId = window.setTimeout(function () {
-        setDisplayState("error");
-      }, 500);
-    }
-    // Display Success
-    else if (displayState === "saving" && saving === false && hasErrors === false) {
-      timeoutId = window.setTimeout(function () {
-        setDisplayState("success");
-      }, 500);
-    }
-    // Return to idle
-    else if (displayState === "error") {
-      timeoutId = window.setTimeout(function () {
-        setDisplayState("idle");
-      }, 5000);
-    }
-    // Return to idle
-    else if (displayState === "success") {
-      timeoutId = window.setTimeout(function () {
-        setDisplayState("idle");
-      }, 2000);
-    }
-    return function () {
-      if (timeoutId !== undefined) {
-        window.clearTimeout(timeoutId);
-      }
-    };
-  }, [displayState, saving, hasErrors, hasConflict]);
-  (0, _react.useEffect)(function () {
-    if (displayState === "idle") {
-      saveSplitButton === null || saveSplitButton === void 0 || saveSplitButton.setShowSelectButton(undefined);
-    } else if (displayState === "saving") {
-      saveSplitButton === null || saveSplitButton === void 0 || saveSplitButton.setShowSelectButton(false);
-    } else if (displayState === "success") {
-      saveSplitButton === null || saveSplitButton === void 0 || saveSplitButton.setShowSelectButton(false);
-    } else if (displayState === "error") {
-      saveSplitButton === null || saveSplitButton === void 0 || saveSplitButton.setShowSelectButton(false);
-    } else if (displayState === "conflict") {
-      saveSplitButton === null || saveSplitButton === void 0 || saveSplitButton.setShowSelectButton(undefined);
-    }
-  }, [displayState, saveSplitButton]);
-  return /*#__PURE__*/(0, _jsxRuntime.jsxs)(Root, _objectSpread(_objectSpread({
-    ownerState: ownerState
-  }, restProps), {}, {
-    startIcon: resolveIconForDisplayState(displayState),
-    variant: variant,
-    color: color,
-    disabled: disabled || displayState != "idle" && displayState != "conflict",
-    children: [displayState === "idle" && children, displayState === "saving" && savingItem, displayState === "success" && successItem, displayState === "error" && errorItem, displayState === "conflict" && conflictItem]
-  }));
-}