@maif/react-forms 1.0.16 → 1.0.17

package/examples/src/Playground.js

@@ -3,13 +3,11 @@ import { Form } from '@maif/react-forms'
 import Select from 'react-select';
 import AceEditor from 'react-ace';
 
-import 'ace-builds/src-noconflict/mode-html'
-import 'ace-builds/src-noconflict/mode-json'
-import 'ace-builds/src-noconflict/mode-javascript'
-import 'ace-builds/src-noconflict/mode-markdown'
-import 'ace-builds/src-noconflict/theme-monokai'
-import 'ace-builds/src-noconflict/ext-searchbox'
-import 'ace-builds/src-noconflict/ext-language_tools'
+import Beautify from 'brace/ext/beautify'
+import 'brace/mode/json'
+import 'brace/theme/monokai'
+import 'brace/ext/searchbox'
+import 'brace/ext/language_tools';
 
 import './App.css';
 import 'bootstrap/dist/css/bootstrap.min.css'
@@ -77,6 +75,7 @@ export const Playground = () => {
               defaultValue={{ value: basic, label: "basic" }}
               onChange={e => setSchema(JSON.stringify(examples[e.value], null, 4))} />
             <AceEditor
+              commands={Beautify.commands}
               style={{ marginTop: '15px', zIndex: 0, isolation: 'isolate', width: '100%' }}
               mode="json"
               theme="monokai"

package/lib/form.js

@@ -282,7 +282,8 @@ var Form = /*#__PURE__*/_react["default"].forwardRef(function (_ref2, ref) {
     resolver: function resolver(data, context, options) {
       return (0, _yup.yupResolver)(_resolver(data))(data, context, options);
     },
-    defaultValues: cleanInputArray(value || defaultValues)
+    defaultValues: cleanInputArray(value || defaultValues),
+    shouldFocusError: !options.autosubmit
   });
   var register = methods.register,
       _handleSubmit = methods.handleSubmit,
@@ -586,7 +587,7 @@ var Step = function Step(_ref4) {
                 error: error
               }, /*#__PURE__*/_react["default"].createElement(_index.CodeInput, _extends({
                 className: (0, _classnames["default"])(_defineProperty({}, classes.input__invalid, error)),
-                readOnly: step.disabled ? 'readOnly' : null,
+                readOnly: step.disabled ? true : false,
                 onChange: field.onChange,
                 value: field.value,
                 defaultValue: defaultValue

package/lib/inputs/CodeInput.js

@@ -9,25 +9,25 @@ var _react = _interopRequireDefault(require("react"));
 
 var _reactAce = _interopRequireDefault(require("react-ace"));
 
-var _extBeautify = _interopRequireDefault(require("ace-builds/src-noconflict/ext-beautify"));
+var _beautify = _interopRequireDefault(require("brace/ext/beautify"));
 
-require("ace-builds/src-noconflict/mode-html");
+require("brace/mode/html");
 
-require("ace-builds/src-noconflict/mode-json");
+require("brace/mode/javascript");
 
-require("ace-builds/src-noconflict/mode-javascript");
+require("brace/mode/json");
 
-require("ace-builds/src-noconflict/mode-css");
+require("brace/mode/css");
 
-require("ace-builds/src-noconflict/mode-markdown");
+require("brace/mode/markdown");
 
-require("ace-builds/src-noconflict/theme-monokai");
+require("brace/theme/monokai");
 
-require("ace-builds/src-noconflict/theme-tomorrow");
+require("brace/theme/tomorrow");
 
-require("ace-builds/src-noconflict/ext-searchbox");
+require("brace/ext/searchbox");
 
-require("ace-builds/src-noconflict/ext-language_tools");
+require("brace/ext/language_tools");
 
 var _excluded = ["onChange", "value", "className", "readOnly", "theme", "mode"];
 
@@ -52,7 +52,7 @@ var CodeInput = function CodeInput(_ref) {
       props = _objectWithoutProperties(_ref, _excluded);
 
   return /*#__PURE__*/_react["default"].createElement(_reactAce["default"], _extends({
-    commands: _extBeautify["default"].commands,
+    commands: _beautify["default"].commands,
     className: className,
     readOnly: readOnly,
     style: {

package/lib/inputs/MarkdownInput.js

@@ -19,19 +19,25 @@ require("@fortawesome/fontawesome-free/css/all.css");
 
 require("highlight.js/styles/monokai.css");
 
-require("ace-builds/src-noconflict/mode-html");
+var _beautify = _interopRequireDefault(require("brace/ext/beautify"));
 
-require("ace-builds/src-noconflict/mode-json");
+require("brace/mode/html");
 
-require("ace-builds/src-noconflict/mode-javascript");
+require("brace/mode/javascript");
 
-require("ace-builds/src-noconflict/mode-markdown");
+require("brace/mode/json");
 
-require("ace-builds/src-noconflict/theme-monokai");
+require("brace/mode/css");
 
-require("ace-builds/src-noconflict/ext-searchbox");
+require("brace/mode/markdown");
 
-require("ace-builds/src-noconflict/ext-language_tools");
+require("brace/theme/monokai");
+
+require("brace/theme/tomorrow");
+
+require("brace/ext/searchbox");
+
+require("brace/ext/language_tools");
 
 var _highlight = _interopRequireDefault(require("highlight.js"));
 
@@ -316,6 +322,17 @@ var MarkdownInput = function MarkdownInput(props) {
       return /*#__PURE__*/_react["default"].createElement("button", {
         type: "button",
         className: "btn-for-descriptionToolbar",
+        style: {
+          textAlign: "left",
+          cursor: "pointer",
+          height: "22px",
+          padding: "4px",
+          border: "none",
+          background: "none",
+          color: "#242729",
+          marginRight: "5px",
+          marginLeft: "5px"
+        },
         "aria-label": command.name,
         title: command.name,
         key: "toolbar-btn-".concat(idx),
@@ -373,18 +390,26 @@ var MarkdownInput = function MarkdownInput(props) {
   }, "Preview"))), /*#__PURE__*/_react["default"].createElement("div", {
     className: "d-flex flex-row"
   }, injectButtons())), !preview && /*#__PURE__*/_react["default"].createElement(_reactAce["default"], {
+    commands: _beautify["default"].commands,
     ref: function ref(r) {
       if (r && r.editor) {
         setEditor(r.editor);
       }
     },
     mode: "markdown",
-    theme: "monokai",
+    theme: props.theme | 'monokai',
     style: {
       zIndex: 0,
       isolation: 'isolate'
     },
     onChange: props.onChange,
+    onLoad: function onLoad(editorInstance) {
+      editorInstance.container.style.resize = "both"; // mouseup = css resize end
+
+      document.addEventListener("mouseup", function (e) {
+        return editorInstance.resize();
+      });
+    },
     value: props.value,
     name: "scriptParam",
     editorProps: {

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@maif/react-forms",
   "description": "Build react safe forms as fast as possible",
-  "version": "1.0.16",
+  "version": "1.0.17",
   "main": "lib/index.js",
   "author": "MAIF team",
   "keywords": [
@@ -105,13 +105,13 @@
     "@types/node": "^16.3.0",
     "@types/react": "^17.0.14",
     "@types/react-dom": "^17.0.9",
-    "ace-builds": "1.4.12",
     "antd": "4.15.4",
     "bootstrap": "5.0.0",
+    "brace": "^0.11.1",
     "classnames": "2.3.0",
     "highlight.js": "11.2.0",
     "moment": "2.29.1",
-    "react-ace": "9.4.3",
+    "react-ace": "9.5.0",
     "react-feather": "2.0.9",
     "react-hook-form": "7.17.1",
     "react-jss": "10.8.2",