orc-shared 5.10.0-dev.2 → 5.10.0-dev.21

package/dist/components/Form/Field.js

@@ -1,13 +1,10 @@
 "use strict";
 
 exports.__esModule = true;
-exports.default = exports.RequiredNotice = exports.Label = exports.FieldBox = void 0;
+exports.default = void 0;
 var _react = _interopRequireDefault(require("react"));
-var _styledComponents = _interopRequireWildcard(require("styled-components"));
-var _utils = require("../../utils");
-var _Text = _interopRequireDefault(require("../Text"));
-function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
-function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
+var _styles = require("@material-ui/core/styles");
+var _reactIntl = require("react-intl");
 function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
 (function () {
   var enterModule = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal.enterModule : undefined;
@@ -17,25 +14,49 @@ function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e
   var enterModule = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal.enterModule : undefined;
   enterModule && enterModule(module);
 })();
-function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
 var __signature__ = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal.default.signature : function (a) {
   return a;
 };
 var __signature__ = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal.default.signature : function (a) {
   return a;
 };
-var FieldBox = exports.FieldBox = _styledComponents.default.div.withConfig({
-  displayName: "Field__FieldBox",
-  componentId: "sc-oln5y9-0"
-})(["flex:0 1 auto;display:flex;flex-direction:column;margin-top:20px;position:relative;"]);
-var Label = exports.Label = _styledComponents.default.label.withConfig({
-  displayName: "Field__Label",
-  componentId: "sc-oln5y9-1"
-})(["", " min-height:17px;", ";", ";", ""], (0, _utils.ifFlag)("invalid", (0, _styledComponents.css)(["color:", ";"], (0, _utils.getThemeProp)(["colors", "error"], "#ce4844")), (0, _styledComponents.css)(["color:", ";"], (0, _utils.getThemeProp)(["colors", "textMedium"], "#999999"))), (0, _utils.ifFlag)("center", (0, _styledComponents.css)(["text-align:center;"])), (0, _utils.ifFlag)("labelOnly", "", (0, _styledComponents.css)(["margin-bottom:10px;"])), (0, _utils.ifFlag)("required", (0, _styledComponents.css)(["&::after{content:\" *\";color:#666;}"])));
-var RequiredNotice = exports.RequiredNotice = _styledComponents.default.div.withConfig({
-  displayName: "Field__RequiredNotice",
-  componentId: "sc-oln5y9-2"
-})(["position:absolute;bottom:-1.6em;right:0;color:", ";"], (0, _utils.getThemeProp)(["colors", "error"], "#ce4844"));
+var useStyles = (0, _styles.makeStyles)(function (theme) {
+  return {
+    fieldBox: {
+      flex: "0 1 auto",
+      display: "flex",
+      flexDirection: "column",
+      marginTop: 20,
+      position: "relative"
+    },
+    label: {
+      minHeight: 17,
+      color: theme.palette.text.hint,
+      marginBottom: "10px"
+    },
+    invalidLabel: {
+      color: theme.palette.error.main
+    },
+    centerLabel: {
+      textAlign: "center"
+    },
+    labelOnly: {
+      marginBottom: "0px"
+    },
+    requiredLabel: {
+      "&::after": {
+        content: '" *"',
+        color: "#666"
+      }
+    },
+    requiredNotice: {
+      position: "absolute",
+      bottom: "-1.6em",
+      right: 0,
+      color: theme.palette.error.main
+    }
+  };
+});
 var Field = function Field(_ref) {
   var id = _ref.id,
     label = _ref.label,
@@ -44,21 +65,23 @@ var Field = function Field(_ref) {
     required = _ref.required,
     invalid = _ref.invalid,
     children = _ref.children;
-  var reqFlag = {
-    invalid: invalid
-  };
-  if (required) reqFlag.required = true;
-  return /*#__PURE__*/_react.default.createElement(FieldBox, null, label !== undefined ? /*#__PURE__*/_react.default.createElement(Label, _extends({
+  var classes = useStyles();
+  return /*#__PURE__*/_react.default.createElement("div", {
+    className: classes.fieldBox
+  }, label !== undefined ? /*#__PURE__*/_react.default.createElement("label", {
     htmlFor: labelOnly ? undefined : id,
-    labelOnly: labelOnly,
-    id: id + "_label",
-    center: center
-  }, reqFlag), /*#__PURE__*/_react.default.createElement(_Text.default, {
-    message: label
-  })) : null, labelOnly ? null : children, !labelOnly && required && invalid ? /*#__PURE__*/_react.default.createElement(RequiredNotice, null, /*#__PURE__*/_react.default.createElement(_Text.default, {
-    message: required
-  })) : null);
+    id: "".concat(id, "_label"),
+    className: "".concat(classes.label, " \n\t\t\t\t\t\t").concat(invalid ? classes.invalidLabel : "", "\n\t\t\t\t\t\t").concat(center ? classes.centerLabel : "", "\n\t\t\t\t\t\t").concat(labelOnly ? classes.labelOnly : "", "\n\t\t\t\t\t\t").concat(required ? classes.requiredLabel : "")
+  }, typeof label === "string" ? label : /*#__PURE__*/_react.default.createElement(_reactIntl.FormattedMessage, label)) : null, labelOnly ? null : children, !labelOnly && required && invalid ? /*#__PURE__*/_react.default.createElement("div", {
+    className: classes.requiredNotice
+  }, typeof required === "string" ? required : /*#__PURE__*/_react.default.createElement(_reactIntl.FormattedMessage, required)) : null);
 };
+__signature__(Field, "useStyles{classes}", function () {
+  return [useStyles];
+});
+__signature__(Field, "useStyles{classes}", function () {
+  return [useStyles];
+});
 var _default = Field;
 var _default2 = _default;
 var _default3 = exports.default = _default2;
@@ -68,9 +91,7 @@ var _default3 = exports.default = _default2;
   if (!reactHotLoader) {
     return;
   }
-  reactHotLoader.register(FieldBox, "FieldBox", "/home/vsts/work/1/s/src/components/Form/Field.js");
-  reactHotLoader.register(Label, "Label", "/home/vsts/work/1/s/src/components/Form/Field.js");
-  reactHotLoader.register(RequiredNotice, "RequiredNotice", "/home/vsts/work/1/s/src/components/Form/Field.js");
+  reactHotLoader.register(useStyles, "useStyles", "/home/vsts/work/1/s/src/components/Form/Field.js");
   reactHotLoader.register(Field, "Field", "/home/vsts/work/1/s/src/components/Form/Field.js");
   reactHotLoader.register(_default, "default", "/home/vsts/work/1/s/src/components/Form/Field.js");
 })();
@@ -85,9 +106,7 @@ var _default3 = exports.default = _default2;
   if (!reactHotLoader) {
     return;
   }
-  reactHotLoader.register(FieldBox, "FieldBox", "/home/vsts/work/1/s/src/components/Form/Field.js");
-  reactHotLoader.register(Label, "Label", "/home/vsts/work/1/s/src/components/Form/Field.js");
-  reactHotLoader.register(RequiredNotice, "RequiredNotice", "/home/vsts/work/1/s/src/components/Form/Field.js");
+  reactHotLoader.register(useStyles, "useStyles", "/home/vsts/work/1/s/src/components/Form/Field.js");
   reactHotLoader.register(Field, "Field", "/home/vsts/work/1/s/src/components/Form/Field.js");
   reactHotLoader.register(_default2, "default", "/home/vsts/work/1/s/src/components/Form/Field.js");
 })();

package/dist/components/Form/FieldElements.js

@@ -5,7 +5,6 @@ exports.default = void 0;
 var _react = _interopRequireDefault(require("react"));
 var _Fieldset = _interopRequireDefault(require("./Fieldset"));
 var _Combination = _interopRequireDefault(require("./Combination"));
-var _FieldList = _interopRequireDefault(require("./FieldList"));
 var _InputField = _interopRequireDefault(require("./InputField"));
 var _excluded = ["fields", "labelOnly", "getUpdater"],
   _excluded2 = ["type", "name", "label"];
@@ -62,16 +61,6 @@ var _FieldElements = function FieldElements(_ref) {
             labelOnly: labelOnly
           }, elementProps, props)));
         }
-      case "List":
-        {
-          return /*#__PURE__*/_react.default.createElement(_FieldList.default, _extends({
-            key: key,
-            name: name,
-            label: label,
-            getUpdater: getUpdater,
-            rowCount: props.rowCount
-          }, elementProps, props));
-        }
       default:
         {
           return /*#__PURE__*/_react.default.createElement(_InputField.default, _extends({

package/dist/components/Form/Fieldset.js

@@ -1,11 +1,10 @@
 "use strict";
 
 exports.__esModule = true;
-exports.default = exports.Legend = exports.FieldsetBox = void 0;
+exports.default = void 0;
 var _react = _interopRequireDefault(require("react"));
-var _styledComponents = _interopRequireDefault(require("styled-components"));
-var _utils = require("../../utils");
-var _Text = _interopRequireDefault(require("../Text"));
+var _styles = require("@material-ui/core/styles");
+var _reactIntl = require("react-intl");
 function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
 (function () {
   var enterModule = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal.enterModule : undefined;
@@ -21,21 +20,52 @@ var __signature__ = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoader
 var __signature__ = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal.default.signature : function (a) {
   return a;
 };
-var FieldsetBox = exports.FieldsetBox = _styledComponents.default.fieldset.withConfig({
-  displayName: "Fieldset__FieldsetBox",
-  componentId: "sc-g5pm1u-0"
-})(["position:relative;box-sizing:border-box;display:flex;align-self:stretch;flex-direction:column;flex-wrap:wrap;border:1px solid ", ";border-radius:5px;margin-top:45px;margin-left:0;margin-bottom:0;padding:20px;padding-top:0;background-color:#fafafa;"], (0, _utils.getThemeProp)(["colors", "borderLight"], "#cccccc"));
-var Legend = exports.Legend = _styledComponents.default.legend.withConfig({
-  displayName: "Fieldset__Legend",
-  componentId: "sc-g5pm1u-1"
-})(["position:absolute;top:-2em;left:-4px;font-family:", ";font-style:italic;font-size:13px;text-transform:uppercase;color:", ";"], (0, _utils.getThemeProp)(["fonts", "header"], "sans-serif"), (0, _utils.getThemeProp)(["colors", "application", "base"], "#333333"));
+var useStyles = (0, _styles.makeStyles)(function (theme) {
+  return {
+    fieldsetBox: {
+      position: "relative",
+      boxSizing: "border-box",
+      display: "flex",
+      alignSelf: "stretch",
+      flexDirection: "column",
+      flexWrap: "wrap",
+      border: "1px solid ".concat(theme.palette.grey.borders),
+      borderRadius: 5,
+      marginTop: 45,
+      marginLeft: 0,
+      marginBottom: 0,
+      padding: 20,
+      paddingTop: 0,
+      backgroundColor: "#fafafa"
+    },
+    legend: {
+      position: "absolute",
+      top: "-2em",
+      left: -4,
+      fontFamily: theme.typography.button.fontFamily,
+      fontStyle: "italic",
+      fontSize: 13,
+      textTransform: "uppercase",
+      color: theme.palette.primary.main
+    }
+  };
+});
 var Fieldset = function Fieldset(_ref) {
   var label = _ref.label,
     children = _ref.children;
-  return /*#__PURE__*/_react.default.createElement(FieldsetBox, null, /*#__PURE__*/_react.default.createElement(Legend, null, /*#__PURE__*/_react.default.createElement(_Text.default, {
-    message: label
-  })), children);
+  var classes = useStyles();
+  return /*#__PURE__*/_react.default.createElement("fieldset", {
+    className: classes.fieldsetBox
+  }, /*#__PURE__*/_react.default.createElement("legend", {
+    className: classes.legend
+  }, /*#__PURE__*/_react.default.createElement(_reactIntl.FormattedMessage, label)), children);
 };
+__signature__(Fieldset, "useStyles{classes}", function () {
+  return [useStyles];
+});
+__signature__(Fieldset, "useStyles{classes}", function () {
+  return [useStyles];
+});
 var _default = Fieldset;
 var _default2 = _default;
 var _default3 = exports.default = _default2;
@@ -45,8 +75,7 @@ var _default3 = exports.default = _default2;
   if (!reactHotLoader) {
     return;
   }
-  reactHotLoader.register(FieldsetBox, "FieldsetBox", "/home/vsts/work/1/s/src/components/Form/Fieldset.js");
-  reactHotLoader.register(Legend, "Legend", "/home/vsts/work/1/s/src/components/Form/Fieldset.js");
+  reactHotLoader.register(useStyles, "useStyles", "/home/vsts/work/1/s/src/components/Form/Fieldset.js");
   reactHotLoader.register(Fieldset, "Fieldset", "/home/vsts/work/1/s/src/components/Form/Fieldset.js");
   reactHotLoader.register(_default, "default", "/home/vsts/work/1/s/src/components/Form/Fieldset.js");
 })();
@@ -61,8 +90,7 @@ var _default3 = exports.default = _default2;
   if (!reactHotLoader) {
     return;
   }
-  reactHotLoader.register(FieldsetBox, "FieldsetBox", "/home/vsts/work/1/s/src/components/Form/Fieldset.js");
-  reactHotLoader.register(Legend, "Legend", "/home/vsts/work/1/s/src/components/Form/Fieldset.js");
+  reactHotLoader.register(useStyles, "useStyles", "/home/vsts/work/1/s/src/components/Form/Fieldset.js");
   reactHotLoader.register(Fieldset, "Fieldset", "/home/vsts/work/1/s/src/components/Form/Fieldset.js");
   reactHotLoader.register(_default2, "default", "/home/vsts/work/1/s/src/components/Form/Fieldset.js");
 })();

package/dist/components/Form/Form.js

@@ -1,9 +1,9 @@
 "use strict";
 
 exports.__esModule = true;
-exports.default = exports.Wrapper = exports.FormPage = exports.FormContext = void 0;
+exports.default = exports.FormPage = exports.FormContext = void 0;
 var _react = _interopRequireWildcard(require("react"));
-var _styledComponents = _interopRequireDefault(require("styled-components"));
+var _styles = require("@material-ui/core/styles");
 var _propTypes = _interopRequireDefault(require("prop-types"));
 var _withScrollBox = _interopRequireDefault(require("../../hocs/withScrollBox"));
 var _FormElement = _interopRequireDefault(require("./FormElement"));
@@ -25,10 +25,14 @@ var __signature__ = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoader
 var __signature__ = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal.default.signature : function (a) {
   return a;
 };
-var Wrapper = exports.Wrapper = _styledComponents.default.div.withConfig({
-  displayName: "Form__Wrapper",
-  componentId: "sc-6q0epb-0"
-})(["display:flex;margin-bottom:20px;"]);
+var useStyles = (0, _styles.makeStyles)(function () {
+  return {
+    wrapper: {
+      display: "flex",
+      marginBottom: 20
+    }
+  };
+});
 var splitFields = function splitFields(fields, cols) {
   if (cols <= 1) return [fields];
   var elmsPerCol = Math.ceil(fields.length / cols);
@@ -51,6 +55,7 @@ var FormPage = exports.FormPage = function FormPage(_ref) {
     fields = _ref.fields,
     values = _ref.values,
     wide = _ref.wide;
+  var classes = useStyles();
   var colSpans = wide ? [] : cols;
   var colFields = splitFields(fields, colSpans.length);
   return /*#__PURE__*/_react.default.createElement(FormContext.Provider, {
@@ -58,7 +63,9 @@ var FormPage = exports.FormPage = function FormPage(_ref) {
       values: values,
       formName: formName
     }
-  }, /*#__PURE__*/_react.default.createElement(Wrapper, null, colFields.map(function (fields, index) {
+  }, /*#__PURE__*/_react.default.createElement("div", {
+    className: classes.wrapper
+  }, colFields.map(function (fields, index) {
     return /*#__PURE__*/_react.default.createElement(_FormElement.default, {
       key: index,
       spanWidth: colSpans[index] || 1
@@ -68,6 +75,12 @@ var FormPage = exports.FormPage = function FormPage(_ref) {
     }));
   })));
 };
+__signature__(FormPage, "useStyles{classes}", function () {
+  return [useStyles];
+});
+__signature__(FormPage, "useStyles{classes}", function () {
+  return [useStyles];
+});
 var WiredForm = (0, _withScrollBox.default)(FormPage);
 WiredForm.propTypes = {
   getUpdater: _propTypes.default.func.isRequired,
@@ -84,7 +97,7 @@ var _default3 = exports.default = _default2;
   if (!reactHotLoader) {
     return;
   }
-  reactHotLoader.register(Wrapper, "Wrapper", "/home/vsts/work/1/s/src/components/Form/Form.js");
+  reactHotLoader.register(useStyles, "useStyles", "/home/vsts/work/1/s/src/components/Form/Form.js");
   reactHotLoader.register(splitFields, "splitFields", "/home/vsts/work/1/s/src/components/Form/Form.js");
   reactHotLoader.register(FormContext, "FormContext", "/home/vsts/work/1/s/src/components/Form/Form.js");
   reactHotLoader.register(FormPage, "FormPage", "/home/vsts/work/1/s/src/components/Form/Form.js");
@@ -102,7 +115,7 @@ var _default3 = exports.default = _default2;
   if (!reactHotLoader) {
     return;
   }
-  reactHotLoader.register(Wrapper, "Wrapper", "/home/vsts/work/1/s/src/components/Form/Form.js");
+  reactHotLoader.register(useStyles, "useStyles", "/home/vsts/work/1/s/src/components/Form/Form.js");
   reactHotLoader.register(splitFields, "splitFields", "/home/vsts/work/1/s/src/components/Form/Form.js");
   reactHotLoader.register(FormContext, "FormContext", "/home/vsts/work/1/s/src/components/Form/Form.js");
   reactHotLoader.register(FormPage, "FormPage", "/home/vsts/work/1/s/src/components/Form/Form.js");

package/dist/components/Form/FormElement.js

@@ -2,7 +2,8 @@
 
 exports.__esModule = true;
 exports.default = void 0;
-var _styledComponents = _interopRequireDefault(require("styled-components"));
+var _styles = require("@material-ui/core/styles");
+var _react = _interopRequireDefault(require("react"));
 function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
 (function () {
   var enterModule = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal.enterModule : undefined;
@@ -18,13 +19,43 @@ var __signature__ = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoader
 var __signature__ = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal.default.signature : function (a) {
   return a;
 };
-var Form = _styledComponents.default.div.withConfig({
-  displayName: "FormElement__Form",
-  componentId: "sc-jfqmae-0"
-})(["box-sizing:border-box;flex-basis:0;flex-shrink:0;flex-grow:", ";display:flex;flex-direction:column;padding:0;padding-right:20px;padding-top:0;font-size:12px;&:first-child{padding-left:20px;}"], function (_ref) {
+var useStyles = (0, _styles.makeStyles)(function () {
+  return {
+    form: {
+      boxSizing: "border-box",
+      flexBasis: 0,
+      flexShrink: 0,
+      display: "flex",
+      flexDirection: "column",
+      padding: 0,
+      paddingRight: 20,
+      paddingTop: 0,
+      fontSize: 12,
+      flexGrow: function flexGrow(props) {
+        return props.spanWidth;
+      },
+      "&:first-child": {
+        paddingLeft: 20
+      }
+    }
+  };
+});
+var Form = function Form(_ref) {
   var _ref$spanWidth = _ref.spanWidth,
-    spanWidth = _ref$spanWidth === void 0 ? 1 : _ref$spanWidth;
-  return spanWidth;
+    spanWidth = _ref$spanWidth === void 0 ? 1 : _ref$spanWidth,
+    children = _ref.children;
+  var classes = useStyles({
+    spanWidth: spanWidth
+  });
+  return /*#__PURE__*/_react.default.createElement("div", {
+    className: classes.form
+  }, children);
+};
+__signature__(Form, "useStyles{classes}", function () {
+  return [useStyles];
+});
+__signature__(Form, "useStyles{classes}", function () {
+  return [useStyles];
 });
 var _default = Form;
 var _default2 = _default;
@@ -35,6 +66,7 @@ var _default3 = exports.default = _default2;
   if (!reactHotLoader) {
     return;
   }
+  reactHotLoader.register(useStyles, "useStyles", "/home/vsts/work/1/s/src/components/Form/FormElement.js");
   reactHotLoader.register(Form, "Form", "/home/vsts/work/1/s/src/components/Form/FormElement.js");
   reactHotLoader.register(_default, "default", "/home/vsts/work/1/s/src/components/Form/FormElement.js");
 })();
@@ -49,6 +81,7 @@ var _default3 = exports.default = _default2;
   if (!reactHotLoader) {
     return;
   }
+  reactHotLoader.register(useStyles, "useStyles", "/home/vsts/work/1/s/src/components/Form/FormElement.js");
   reactHotLoader.register(Form, "Form", "/home/vsts/work/1/s/src/components/Form/FormElement.js");
   reactHotLoader.register(_default2, "default", "/home/vsts/work/1/s/src/components/Form/FormElement.js");
 })();

package/dist/components/Form/Inputs/Button.js

@@ -1,12 +1,14 @@
 "use strict";
 
 exports.__esModule = true;
-exports.default = exports.PositionedButton = exports.FormButton = void 0;
+exports.default = void 0;
 var _react = _interopRequireDefault(require("react"));
-var _styledComponents = _interopRequireDefault(require("styled-components"));
+var _styles = require("@material-ui/core/styles");
+var _Button = _interopRequireDefault(require("@material-ui/core/Button"));
 var _withId = _interopRequireDefault(require("../../../hocs/withId"));
-var _IconButton = _interopRequireDefault(require("../../IconButton"));
-var _excluded = ["id", "icon", "buttonText", "update", "aria-labelledby"];
+var _Icon = _interopRequireDefault(require("../../MaterialUI/DataDisplay/Icon"));
+var _reactIntl = require("react-intl");
+var _excluded = ["id", "icon", "buttonText", "update", "primary"];
 function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
 (function () {
   var enterModule = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal.enterModule : undefined;
@@ -25,25 +27,68 @@ var __signature__ = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoader
 var __signature__ = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal.default.signature : function (a) {
   return a;
 };
-var PositionedButton = exports.PositionedButton = (0, _styledComponents.default)(_IconButton.default).withConfig({
-  displayName: "Button__PositionedButton",
-  componentId: "sc-1jkhmuf-0"
-})(["width:max-content;position:relative;"]);
-var FormButton = exports.FormButton = function FormButton(_ref) {
+var useStyles = (0, _styles.makeStyles)(function (theme) {
+  return {
+    positionedButton: {
+      width: "max-content",
+      position: "relative",
+      padding: "6px 14px !important",
+      "&:hover": {
+        borderColor: "#4fa1f0",
+        boxShadow: "0 0 4px #4fa1f0",
+        outline: "none",
+        backgroundColor: "#f7f7f7 !important"
+      },
+      "&:disabled": {
+        opacity: 0.6,
+        backgroundColor: "#f7f7f7 !important"
+      }
+    },
+    buttonIcon: {
+      height: "1em",
+      width: "1em",
+      fill: "currentColor",
+      stroke: "currentColor",
+      fontSize: "1.23em !important"
+    },
+    primaryButton: {
+      color: "".concat(theme.palette.primary.main, " !important"),
+      border: "1px solid ".concat(theme.palette.primary.main, " !important"),
+      backgroundColor: "#fff !important",
+      "&:hover": {
+        backgroundColor: "#fff !important"
+      }
+    },
+    primaryIcon: {
+      color: "".concat(theme.palette.primary.main, " !important")
+    }
+  };
+});
+var FormButton = function FormButton(_ref) {
   var id = _ref.id,
     icon = _ref.icon,
     buttonText = _ref.buttonText,
     update = _ref.update,
-    aria = _ref["aria-labelledby"],
+    primary = _ref.primary,
     props = _objectWithoutProperties(_ref, _excluded);
-  return /*#__PURE__*/_react.default.createElement(PositionedButton, _extends({
-    id: id
-  }, props, {
+  var classes = useStyles();
+  return /*#__PURE__*/_react.default.createElement(_Button.default, _extends({
+    id: id,
+    className: "".concat(classes.positionedButton, " ").concat(primary ? classes.primaryButton : ""),
     onClick: update,
-    icon: icon,
-    label: buttonText
-  }));
+    variant: "outlined",
+    startIcon: icon ? /*#__PURE__*/_react.default.createElement(_Icon.default, {
+      id: icon,
+      className: "".concat(classes.buttonIcon, " ").concat(primary ? classes.primaryIcon : "")
+    }) : null
+  }, props), buttonText ? /*#__PURE__*/_react.default.createElement(_reactIntl.FormattedMessage, buttonText) : null);
 };
+__signature__(FormButton, "useStyles{classes}", function () {
+  return [useStyles];
+});
+__signature__(FormButton, "useStyles{classes}", function () {
+  return [useStyles];
+});
 FormButton.displayName = "FormButton";
 var _default = (0, _withId.default)("formbutton")(FormButton);
 var _default2 = _default;
@@ -54,7 +99,7 @@ var _default3 = exports.default = _default2;
   if (!reactHotLoader) {
     return;
   }
-  reactHotLoader.register(PositionedButton, "PositionedButton", "/home/vsts/work/1/s/src/components/Form/Inputs/Button.js");
+  reactHotLoader.register(useStyles, "useStyles", "/home/vsts/work/1/s/src/components/Form/Inputs/Button.js");
   reactHotLoader.register(FormButton, "FormButton", "/home/vsts/work/1/s/src/components/Form/Inputs/Button.js");
   reactHotLoader.register(_default, "default", "/home/vsts/work/1/s/src/components/Form/Inputs/Button.js");
 })();
@@ -69,7 +114,7 @@ var _default3 = exports.default = _default2;
   if (!reactHotLoader) {
     return;
   }
-  reactHotLoader.register(PositionedButton, "PositionedButton", "/home/vsts/work/1/s/src/components/Form/Inputs/Button.js");
+  reactHotLoader.register(useStyles, "useStyles", "/home/vsts/work/1/s/src/components/Form/Inputs/Button.js");
   reactHotLoader.register(FormButton, "FormButton", "/home/vsts/work/1/s/src/components/Form/Inputs/Button.js");
   reactHotLoader.register(_default2, "default", "/home/vsts/work/1/s/src/components/Form/Inputs/Button.js");
 })();