rfa
Version:
**React Form Architect** is an ultimate solution for creating and rendering forms in React. Its main focus is to provide users with a tool to define, render and share a form in a browser.
1 lines • 68.8 kB
JavaScript
"use strict";function e(e){return e&&"object"==typeof e&&"default"in e?e.default:e}Object.defineProperty(exports,"__esModule",{value:!0});var t=require("react"),n=e(t),r=require("@material-ui/core"),a=e(require("@material-ui/core/styles/createMuiTheme")),o=require("react-simple-hook-store"),l=e(require("@material-ui/icons/Close")),i=require("@material-ui/icons"),c=require("react-hook-form"),u=require("yup"),s=require("@material-ui/styles"),m=require("react-dnd"),p=e(require("@material-ui/core/useMediaQuery")),d=e(require("@material-ui/core/colors/purple")),f=e(require("@material-ui/core/colors/green")),g=require("react-dnd-html5-backend"),v=e(require("@material-ui/core/CssBaseline")),h=e(require("@material-ui/styles/ThemeProvider")),b=require("@hookform/resolvers/yup"),y=require("@material-ui/core/styles"),E=e(require("@material-ui/core/Paper")),x=e(require("@material-ui/core/InputBase")),C=e(require("@material-ui/core/IconButton")),k=e(require("@material-ui/icons/Menu")),S=e(require("@material-ui/icons/Search")),w=e(require("@material-ui/core/Popper"));function T(e,t,n,r,a,o,l){try{var i=e[o](l),c=i.value}catch(e){return void n(e)}i.done?t(c):Promise.resolve(c).then(r,a)}function N(e){return function(){var t=this,n=arguments;return new Promise((function(r,a){var o=e.apply(t,n);function l(e){T(o,r,a,l,i,"next",e)}function i(e){T(o,r,a,l,i,"throw",e)}l(void 0)}))}}function D(){return(D=Object.assign||function(e){for(var t=1;t<arguments.length;t++){var n=arguments[t];for(var r in n)Object.prototype.hasOwnProperty.call(n,r)&&(e[r]=n[r])}return e}).apply(this,arguments)}function I(e,t){if(null==e)return{};var n,r,a={},o=Object.keys(e);for(r=0;r<o.length;r++)t.indexOf(n=o[r])>=0||(a[n]=e[n]);return a}var B,G=function(e){return n.createElement(r.Dialog,{open:e.opened,onClose:e.onDeny,"aria-labelledby":"alert-dialog-title","aria-describedby":"alert-dialog-description"},e.title&&n.createElement(r.DialogTitle,{id:"alert-dialog-title"},e.title),n.createElement(r.DialogContent,null,n.createElement(r.DialogContentText,{id:"alert-dialog-description"},e.text)),n.createElement(r.DialogActions,null,n.createElement(r.Button,{onClick:e.onDeny,color:"primary"},"Disagree"),n.createElement(r.Button,{onClick:e.onSuccess,color:"primary",autoFocus:!0},"Agree")))},O=function(e){var t,a;return n.createElement(r.Dialog,{open:e.opened,onClose:e.onDeny,"aria-labelledby":"alert-dialog-title","aria-describedby":"alert-dialog-description"},e.title&&n.createElement(r.DialogTitle,{id:"alert-dialog-title"},e.title),n.createElement(r.DialogContent,null,e.text&&n.createElement(r.DialogContentText,{id:"alert-dialog-description"},e.text),e.children),n.createElement(r.DialogActions,null,n.createElement(r.Button,{onClick:e.onDeny,color:"primary"},null!=(t=e.cancelationText)?t:"Cancel"),n.createElement(r.Button,{onClick:e.onSuccess,color:"primary",autoFocus:!0},null!=(a=e.confirmationText)?a:"OK")))},F=function(e){var t=e.name,a=e.register,o=e.disabledParam,l=e.defaultErrorMessage;return n.createElement(r.Grid,{container:!0,direction:"row",className:e.className,spacing:1},n.createElement(r.Grid,{item:!0,xs:6},n.createElement(e.controlComponent,D({name:t,register:a},e.controlComponentProps))),n.createElement(r.Grid,{item:!0,xs:6},n.createElement(R,{register:a,name:t+"ErrorMessage",type:"text",label:"error message",muiProps:{disabled:o,defaultValue:l}})))},R=function(e){var t,a,o;return n.createElement(_e,{variant:"outlined"},n.createElement(r.TextField,Object.assign({inputRef:e.register,name:e.name,label:e.label,placeholder:e.placeholder,type:e.type,helperText:null!=(t=null==(a=e.error)?void 0:a.message)?t:e.helperText,error:!!(null==(o=e.error)?void 0:o.message),InputLabelProps:{shrink:!0}},e.muiProps)))},A=function(e){var t,a,o,l,i;return n.createElement(_e,{error:!!(null==(t=e.error)?void 0:t.message)},n.createElement(r.FormControlLabel,{control:n.createElement(r.Switch,Object.assign({inputRef:e.register,name:e.name},e.muiProps)),label:e.label}),(e.helperText||(null==(a=e.error)?void 0:a.message))&&n.createElement(r.FormHelperText,{error:!!(null==(o=e.error)?void 0:o.message)},null!=(l=null==(i=e.error)?void 0:i.message)?l:e.helperText))},L=(function(e){var t=function(e){var t=Object.prototype,n=t.hasOwnProperty,r="function"==typeof Symbol?Symbol:{},a=r.iterator||"@@iterator",o=r.asyncIterator||"@@asyncIterator",l=r.toStringTag||"@@toStringTag";function i(e,t,n){return Object.defineProperty(e,t,{value:n,enumerable:!0,configurable:!0,writable:!0}),e[t]}try{i({},"")}catch(e){i=function(e,t,n){return e[t]=n}}function c(e,t,n,r){var a=Object.create((t&&t.prototype instanceof m?t:m).prototype),o=new k(r||[]);return a._invoke=function(e,t,n){var r="suspendedStart";return function(a,o){if("executing"===r)throw new Error("Generator is already running");if("completed"===r){if("throw"===a)throw o;return{value:void 0,done:!0}}for(n.method=a,n.arg=o;;){var l=n.delegate;if(l){var i=E(l,n);if(i){if(i===s)continue;return i}}if("next"===n.method)n.sent=n._sent=n.arg;else if("throw"===n.method){if("suspendedStart"===r)throw r="completed",n.arg;n.dispatchException(n.arg)}else"return"===n.method&&n.abrupt("return",n.arg);r="executing";var c=u(e,t,n);if("normal"===c.type){if(r=n.done?"completed":"suspendedYield",c.arg===s)continue;return{value:c.arg,done:n.done}}"throw"===c.type&&(r="completed",n.method="throw",n.arg=c.arg)}}}(e,n,o),a}function u(e,t,n){try{return{type:"normal",arg:e.call(t,n)}}catch(e){return{type:"throw",arg:e}}}e.wrap=c;var s={};function m(){}function p(){}function d(){}var f={};f[a]=function(){return this};var g=Object.getPrototypeOf,v=g&&g(g(S([])));v&&v!==t&&n.call(v,a)&&(f=v);var h=d.prototype=m.prototype=Object.create(f);function b(e){["next","throw","return"].forEach((function(t){i(e,t,(function(e){return this._invoke(t,e)}))}))}function y(e,t){var r;this._invoke=function(a,o){function l(){return new t((function(r,l){!function r(a,o,l,i){var c=u(e[a],e,o);if("throw"!==c.type){var s=c.arg,m=s.value;return m&&"object"==typeof m&&n.call(m,"__await")?t.resolve(m.__await).then((function(e){r("next",e,l,i)}),(function(e){r("throw",e,l,i)})):t.resolve(m).then((function(e){s.value=e,l(s)}),(function(e){return r("throw",e,l,i)}))}i(c.arg)}(a,o,r,l)}))}return r=r?r.then(l,l):l()}}function E(e,t){var n=e.iterator[t.method];if(void 0===n){if(t.delegate=null,"throw"===t.method){if(e.iterator.return&&(t.method="return",t.arg=void 0,E(e,t),"throw"===t.method))return s;t.method="throw",t.arg=new TypeError("The iterator does not provide a 'throw' method")}return s}var r=u(n,e.iterator,t.arg);if("throw"===r.type)return t.method="throw",t.arg=r.arg,t.delegate=null,s;var a=r.arg;return a?a.done?(t[e.resultName]=a.value,t.next=e.nextLoc,"return"!==t.method&&(t.method="next",t.arg=void 0),t.delegate=null,s):a:(t.method="throw",t.arg=new TypeError("iterator result is not an object"),t.delegate=null,s)}function x(e){var t={tryLoc:e[0]};1 in e&&(t.catchLoc=e[1]),2 in e&&(t.finallyLoc=e[2],t.afterLoc=e[3]),this.tryEntries.push(t)}function C(e){var t=e.completion||{};t.type="normal",delete t.arg,e.completion=t}function k(e){this.tryEntries=[{tryLoc:"root"}],e.forEach(x,this),this.reset(!0)}function S(e){if(e){var t=e[a];if(t)return t.call(e);if("function"==typeof e.next)return e;if(!isNaN(e.length)){var r=-1,o=function t(){for(;++r<e.length;)if(n.call(e,r))return t.value=e[r],t.done=!1,t;return t.value=void 0,t.done=!0,t};return o.next=o}}return{next:w}}function w(){return{value:void 0,done:!0}}return p.prototype=h.constructor=d,d.constructor=p,p.displayName=i(d,l,"GeneratorFunction"),e.isGeneratorFunction=function(e){var t="function"==typeof e&&e.constructor;return!!t&&(t===p||"GeneratorFunction"===(t.displayName||t.name))},e.mark=function(e){return Object.setPrototypeOf?Object.setPrototypeOf(e,d):(e.__proto__=d,i(e,l,"GeneratorFunction")),e.prototype=Object.create(h),e},e.awrap=function(e){return{__await:e}},b(y.prototype),y.prototype[o]=function(){return this},e.AsyncIterator=y,e.async=function(t,n,r,a,o){void 0===o&&(o=Promise);var l=new y(c(t,n,r,a),o);return e.isGeneratorFunction(n)?l:l.next().then((function(e){return e.done?e.value:l.next()}))},b(h),i(h,l,"Generator"),h[a]=function(){return this},h.toString=function(){return"[object Generator]"},e.keys=function(e){var t=[];for(var n in e)t.push(n);return t.reverse(),function n(){for(;t.length;){var r=t.pop();if(r in e)return n.value=r,n.done=!1,n}return n.done=!0,n}},e.values=S,k.prototype={constructor:k,reset:function(e){if(this.prev=0,this.next=0,this.sent=this._sent=void 0,this.done=!1,this.delegate=null,this.method="next",this.arg=void 0,this.tryEntries.forEach(C),!e)for(var t in this)"t"===t.charAt(0)&&n.call(this,t)&&!isNaN(+t.slice(1))&&(this[t]=void 0)},stop:function(){this.done=!0;var e=this.tryEntries[0].completion;if("throw"===e.type)throw e.arg;return this.rval},dispatchException:function(e){if(this.done)throw e;var t=this;function r(n,r){return l.type="throw",l.arg=e,t.next=n,r&&(t.method="next",t.arg=void 0),!!r}for(var a=this.tryEntries.length-1;a>=0;--a){var o=this.tryEntries[a],l=o.completion;if("root"===o.tryLoc)return r("end");if(o.tryLoc<=this.prev){var i=n.call(o,"catchLoc"),c=n.call(o,"finallyLoc");if(i&&c){if(this.prev<o.catchLoc)return r(o.catchLoc,!0);if(this.prev<o.finallyLoc)return r(o.finallyLoc)}else if(i){if(this.prev<o.catchLoc)return r(o.catchLoc,!0)}else{if(!c)throw new Error("try statement without catch or finally");if(this.prev<o.finallyLoc)return r(o.finallyLoc)}}}},abrupt:function(e,t){for(var r=this.tryEntries.length-1;r>=0;--r){var a=this.tryEntries[r];if(a.tryLoc<=this.prev&&n.call(a,"finallyLoc")&&this.prev<a.finallyLoc){var o=a;break}}o&&("break"===e||"continue"===e)&&o.tryLoc<=t&&t<=o.finallyLoc&&(o=null);var l=o?o.completion:{};return l.type=e,l.arg=t,o?(this.method="next",this.next=o.finallyLoc,s):this.complete(l)},complete:function(e,t){if("throw"===e.type)throw e.arg;return"break"===e.type||"continue"===e.type?this.next=e.arg:"return"===e.type?(this.rval=this.arg=e.arg,this.method="return",this.next="end"):"normal"===e.type&&t&&(this.next=t),s},finish:function(e){for(var t=this.tryEntries.length-1;t>=0;--t){var n=this.tryEntries[t];if(n.finallyLoc===e)return this.complete(n.completion,n.afterLoc),C(n),s}},catch:function(e){for(var t=this.tryEntries.length-1;t>=0;--t){var n=this.tryEntries[t];if(n.tryLoc===e){var r=n.completion;if("throw"===r.type){var a=r.arg;C(n)}return a}}throw new Error("illegal catch attempt")},delegateYield:function(e,t,n){return this.delegate={iterator:S(e),resultName:t,nextLoc:n},"next"===this.method&&(this.arg=void 0),s}},e}(e.exports);try{regeneratorRuntime=t}catch(e){Function("r","regeneratorRuntime = r")(t)}}(B={exports:{}}),B.exports);function j(){var e,t,n="";for(e=0;e<32;e++)t=16*Math.random()|0,8!==e&&12!==e&&16!==e&&20!==e||(n+="-"),n+=(12===e?4:16===e?3&t|8:t).toString(16);return n}var P={addFormElement:function(e,t){e.setState({elements:[].concat(e.state.elements,[t])})},addFormElementAtIndex:function(e,t,n){var r=[].concat(e.state.elements);r.splice(n,0,t),e.setState({elements:r})},removeFormElement:function(e,t){e.setState({elements:e.state.elements.filter((function(e){return e.id!==t}))})},copyFormElement:function(e,t,n,r){var a=e.state.elements.find((function(e){return e.id===t}));a.name=n;var o=e.state.elements.findIndex((function(e){return e.id===t}));if(!a)return null;var l=D({},a,{id:j(),groupPosition:r});return P.addFormElementAtIndex(e,l,o+1),null},swapFormElements:function(e,t,n,r){var a=e.state.elements.filter((function(e){return e.groupID===t})),o=e.state.elements.filter((function(e){return e.groupID!==t})),l=a[n],i=a[r],c=l.groupPosition;l.groupPosition=i.groupPosition,i.groupPosition=c,a.splice(n,1,l),a.splice(r,1,i),e.setState({elements:[].concat(a.sort((function(e,t){return e.groupPosition-t.groupPosition})),o)})},transferElement:function(e,t,n){P.setFormElementAttribute(e,t,"groupID",n)},setFormElementAttributes:function(e,t,n){var r=[].concat(e.state.elements),a=r.find((function(e){return e.id===t})),o=r.findIndex((function(e){return e.id===t}));if(!a)return null;var l=D({},a,{attributes:D({},n)});return r.splice(o,1,l),e.setState({elements:r}),null},setFormElementValidations:function(e,t,n){var r=[].concat(e.state.elements),a=r.find((function(e){return e.id===t})),o=r.findIndex((function(e){return e.id===t}));if(!a)return null;var l=D({},a,{attributes:D({},a.attributes,{required:n.required}),validations:D({},n)});return r.splice(o,1,l),e.setState({elements:r}),null},setFormElementAttribute:function(e,t,n,r){var a,o=[].concat(e.state.elements),l=o.find((function(e){return e.id===t})),i=o.findIndex((function(e){return e.id===t}));if(!l)return null;var c=D({},l,((a={})[n]=r,a));return o.splice(i,1,c),e.setState({elements:o}),null}},M={addGroup:function(e,t){e.setState({grouping:{activeGroup:t.id,groups:[].concat(e.state.grouping.groups,[t])}})},setActiveGroup:function(e,t){e.setState({grouping:{groups:[].concat(e.state.grouping.groups),activeGroup:t}})},removeGroup:function(e,t){var n;if(1===e.state.grouping.groups.length)return null;var r=e.state.grouping.groups.find((function(e){return e.id!==t}));return e.setState({grouping:{groups:[].concat(e.state.grouping.groups.filter((function(e){return e.id!==t}))),activeGroup:null!=(n=null==r?void 0:r.id)?n:e.state.grouping.groups[0].id},elements:[].concat(e.state.elements.filter((function(e){return e.groupID!==t})))}),null},renameGroup:function(e,t,n){var r=[].concat(e.state.grouping.groups),a=r.find((function(e){return e.id===t})),o=r.findIndex((function(e){return e.id===t}));if(console.log({group:a,groupIndex:o}),!a||-1===o)return null;var l=D({},a,{name:n});return r.splice(o,1,l),e.setState({grouping:{groups:r,activeGroup:e.state.grouping.activeGroup}}),null},swapGroups:function(e,t,n){var r=[].concat(e.state.grouping.groups);r[t]=r.splice(n,1,r[t])[0],e.setState({grouping:{groups:r,activeGroup:e.state.grouping.activeGroup}})}},V={setStore:function(e,t){e.setState({elements:t.elements,grouping:t.grouping})},clearStore:function(e){e.setState(W)}},q=j(),W={elements:[],grouping:{groups:[{id:q,name:"default group"}],activeGroup:q}},_=o.createStore(W,{formElementsActions:P,groupingActions:M,storeActions:V}).useStore,z=function(e){void 0===e&&(e=!1);var n=t.useState(e),r=n[1];return[n[0],t.useCallback((function(){return r(!0)}),[]),t.useCallback((function(){return r(!1)}),[])]},H=function(e){return n.createElement(r.Tooltip,{title:e.text},n.createElement(i.HelpOutline,{fontSize:"small",color:"action"}))},J=function(e){var n=U(),a=c.useFieldArray({name:e.name,control:e.control}),o=a.fields,l=a.append,u=a.remove,s=a.swap;return t.createElement(t.Fragment,null,t.createElement(r.Grid,{container:!0,spacing:1,direction:"column",className:n.wrapper},t.createElement(r.Typography,{color:"textSecondary",variant:"subtitle2"},"Node data"),t.createElement(r.Grid,{item:!0,container:!0,direction:"row",alignItems:"center",justify:"center",spacing:2,className:n.container},t.createElement("div",{style:{width:26}}),t.createElement(r.Grid,{item:!0,xs:4},t.createElement(r.Typography,{variant:"caption",color:"primary"},"title")),t.createElement(r.Grid,{item:!0,xs:3},t.createElement(r.Typography,{variant:"caption",color:"primary"},"input placeholder")),t.createElement(r.Grid,{item:!0,xs:3},t.createElement(r.Typography,{variant:"caption",color:"primary"},"input value"),t.createElement(H,{text:"When filled, user cannot edit this field, use for constants"})),t.createElement(r.Grid,{item:!0,xs:1})),t.createElement(r.Divider,null),o.map((function(a,o){return t.createElement(ze,{id:a.id,index:o,swap:s,dndIndicator:"optionItemSortable",key:a.id},t.createElement(r.Grid,{item:!0,container:!0,direction:"row",alignItems:"center",justify:"center",spacing:2,className:n.container},t.createElement("div",{className:n.dragContainer},t.createElement(i.DragIndicatorOutlined,{color:"action"})),t.createElement(r.Grid,{item:!0,xs:4},t.createElement(r.Input,{fullWidth:!0,placeholder:"Name "+(o+1),autoFocus:!0,onFocus:function(e){e.target.select()},inputRef:e.register(),defaultValue:a.name,name:e.name+"["+o+"].name",endAdornment:":"})),t.createElement(r.Grid,{item:!0,xs:3},t.createElement(r.Input,{fullWidth:!0,placeholder:"Placeholder "+(o+1),autoFocus:!0,onFocus:function(e){e.target.select()},inputRef:e.register(),defaultValue:a.placeholder,name:e.name+"["+o+"].placeholder"})),t.createElement(r.Grid,{item:!0,xs:3},t.createElement(r.Input,{fullWidth:!0,placeholder:"Value "+(o+1),autoFocus:!0,onFocus:function(e){e.target.select()},inputRef:e.register(),defaultValue:a.value,name:e.name+"["+o+"].value"})),t.createElement(r.Grid,{item:!0,xs:1},t.createElement(r.Tooltip,{title:"Remove option","aria-label":"remove-option",enterDelay:500},t.createElement(r.IconButton,{"aria-label":"delete",onClick:function(){return u(o)},size:"small"},t.createElement(i.Clear,{color:"error",fontSize:"small"}))))))})),t.createElement(r.Box,{p:2,className:n.actionArea},t.createElement(r.Button,{color:"primary",variant:"outlined",onClick:function(){return l({name:""})}},"Add"))))},U=r.makeStyles((function(e){return r.createStyles({container:{width:"100%",flexWrap:"nowrap","&:hover $dragContainer":{visibility:"visible"}},dragContainer:{visibility:"hidden",cursor:"move",position:"relative",display:"flex",alignItems:"center",height:"100%",left:e.spacing(.5)},wrapper:{borderWidth:1,borderStyle:"solid",borderColor:e.palette.grey.A100,borderRadius:e.shape.borderRadius,padding:e.spacing(2)},actionArea:{display:"flex",justifyContent:"center",alignItems:"center"},actionDivider:{paddingLeft:e.spacing(1),paddingRight:e.spacing(1)}})})),Y=function(){var e=_((function(e){return e.elements}))[0],t=n.useCallback((function(t){return!e.map((function(e){return e.name})).includes(t)}),[e]),r=n.useCallback((function(e,n){var r=e.trim().replace(/\s+/g,"_").toLowerCase(),a=t(r)?r:r+"-"+j();return n?n+"-"+a:a}),[t]),a=n.useCallback((function(t){var n=e.find((function(e){return e.id===t}));return n?r(n.label):""}),[r,e]);return{createName:r,createNameById:a}},$=function(){var e=_((function(e){return e.elements}),(function(e){return e.formElementsActions})),t=e[0],r=e[1],a=_((function(e){return e.grouping.activeGroup}),(function(){return null}))[0],o=Y().createName,l=n.useMemo((function(){return t.filter((function(e){return e.groupID===a}))}),[t,a]),i=n.useMemo((function(){return l.length>0?Math.max.apply(Math,l.map((function(e){return e.groupPosition}))):0}),[l]),c=n.useCallback((function(e){var t=j(),n=e.attributes.reduce((function(e,t){var n,r,a;return D({},e,t.options&&"options"===t.type?((r={})[t.name]=t.options,r):t.keyValueData&&"keyValueData"===t.type?((a={})[t.name]=t.keyValueData,a):((n={})[t.name]=t.value,n))}),{});r.addFormElement({id:t,label:e.label,name:o(e.label),attributeSchema:e.attributes,attributes:n,render:e.render,isCustomRegistered:e.isCustomRegistered,groupID:a,groupPosition:i+1,isReadOnly:e.isReadOnly,validations:{},validationType:e.validationType,validators:e.validators})}),[r,a,o,i]),u=n.useCallback((function(){r.setFormElementAttributes.apply(r,arguments)}),[r]),s=n.useCallback((function(){r.setFormElementAttribute.apply(r,arguments)}),[r]),m=n.useCallback((function(){r.setFormElementValidations.apply(r,arguments)}),[r]);return{elements:l,allElements:t,createFormElement:c,setFormElementAttributes:u,setFormElementAttribute:s,handlers:{setFormElementValidations:m},state:{lastGroupPositionIndex:i}}},K=function(e){var t=_((function(){return null}),(function(e){return e.formElementsActions}))[1],r=$().state.lastGroupPositionIndex,a=Y().createNameById;return{removeElement:n.useCallback((function(){t.removeFormElement(e)}),[t,e]),copyElement:n.useCallback((function(){t.copyFormElement(e,a(e),r+1)}),[t,a,e,r]),swapElement:n.useCallback((function(e){return function(n,r){t.swapFormElements(e,n,r)}}),[t]),transferElement:n.useCallback((function(n){t.transferElement(e,n)}),[t,e])}},Q=function(){var e=_((function(e){return e.grouping}),(function(e){return e.groupingActions})),t=e[0],r=e[1],a=n.useCallback((function(e){r.addGroup({id:j(),name:e})}),[r]),o=n.useCallback((function(e){r.setActiveGroup(e)}),[r]),l=n.useCallback((function(){r.removeGroup(t.activeGroup)}),[r,t.activeGroup]),i=n.useCallback((function(e){r.renameGroup(t.activeGroup,e)}),[r,t.activeGroup]),c=n.useCallback((function(){r.swapGroups.apply(r,arguments)}),[r]),u=n.useMemo((function(){var e=t.groups.find((function(e){return e.id===t.activeGroup}));return e?e.name:null}),[t.activeGroup,t.groups]);return{groupings:t,addGroup:a,setActiveGroup:o,deleteGroup:l,renameGroup:i,ActiveGroupName:u,swapGroups:c}},X=function(){var e=$().allElements,t=n.useMemo((function(){return e.filter((function(e){return"{}"!==JSON.stringify(e.validations)})).reduce((function(e,t){var n;return D({},e,((n={})[t.name]=ee(Z(t.validations),t.validationType),n))}),{})}),[e]);return{data:{ValidationSchema:n.useMemo((function(){return u.object().shape(t)}),[t])}}},Z=function(e){var t=[];return Object.entries(e).forEach((function(n){var r,a=n[0],o=n[1];o&&(a.includes("ErrorMessage")||("type"===a?r={type:e[a],params:[e[a+"ErrorMessage"]]}:(r={type:a,params:[e[a+"ErrorMessage"]]},o&&"boolean"!=typeof o&&r.params.unshift(o)),("boolean"!=typeof o||o)&&t.push(r)))})),t},ee=function(e,t){var n=(new u[t]).nullable();return e.forEach((function(e){var t,r=e.type;n[r]&&(n=(t=n)[r].apply(t,e.params))})),"number"===t&&(n=n.transform(te)),n};function te(e,t){return console.log({value:e,originalValue:t}),"string"==typeof t&&""===t?null:e}var ne=r.makeStyles((function(e){return r.createStyles({previewContainer:{padding:e.spacing(2),display:"flex",height:"100%",flexDirection:"column",alignItems:"center",justifyContent:"center"},attributes:{paddingTop:e.spacing(3)}})})),re=function(e){var t,a,o=c.useForm({defaultValues:e.element.attributes}),l=o.register,i=o.unregister,u=o.control,s=o.handleSubmit,m=o.reset,p=o.setValue,d=(0,o.watch)(),f=Y().createName,g=$(),v=g.setFormElementAttributes,h=g.setFormElementAttribute,b=(t=n.useState("Save Attributes"),a=t[1],{text:t[0],retractString:function(){a("Saved!"),setTimeout((function(){a("Save Attributes")}),3e3)}}),y=b.text,E=b.retractString,x=ne();return n.createElement("form",{onSubmit:s((function(t){E(),delete t[e.element.name],t.label!==e.element.attributes.label&&("tree"===e.element.name.toLowerCase()?h(e.element.id,"name",f(t.label,"tree")):h(e.element.id,"name",f(t.label))),v(e.element.id,t)}))},n.createElement(r.Paper,{className:x.previewContainer,elevation:5},n.createElement(r.Typography,{color:"secondary"},"Preview"),n.createElement(e.element.render,D({},e.element.attributes,{register:l,unregister:i,control:u,setValue:p,reset:m},d,{name:e.element.name}))),n.createElement(r.Grid,{item:!0,container:!0,direction:"column",spacing:4,className:x.attributes},e.element.attributeSchema.map((function(e){return n.createElement(r.Grid,{item:!0,key:e.name},(t=e,a={register:l},o=u,{input:n.createElement(R,Object.assign({},t,{register:a.register})),select:n.createElement(Je,Object.assign({},t,{options:t.options,control:o})),checkbox:n.createElement("div",null,"Checkbox is not mapped yet"),options:n.createElement(ge,{name:t.name,control:o,register:a.register}),radio:n.createElement("div",null,"radio is not mapped yet"),switch:n.createElement(A,Object.assign({},t,{register:a.register})),keyValueData:n.createElement(J,{control:o,name:t.name,register:a.register})}[t.type]));var t,a,o}))),n.createElement(r.Box,{display:"flex",alignItems:"center",justifyContent:"center",p:3},n.createElement(r.Button,{variant:"contained",color:"primary",type:"submit"},y)))},ae=function(e){var t=m.useDrag({item:D({},e.formElement,{type:"draggable-field"}),collect:function(e){return{isDragging:e.isDragging()}}}),a=t[0].isDragging,o=t[1],l=p("(min-width:600px)");return n.createElement(r.ListItem,{ref:o,style:{opacity:a?.8:1,cursor:"pointer"},onClick:e.onClick,divider:!0},n.createElement(r.ListItemAvatar,null,e.formElement.icon),l&&n.createElement(r.ListItemText,{primary:e.formElement.label,secondary:e.formElement.description}))},oe=r.createMuiTheme({palette:{primary:{main:d[500]},secondary:{main:f[500]}}}),le=t.forwardRef((function(e,n){var a=e.swap,o=e.index,l=e.value,i=e.label,c=e.number,u=e.id,s=I(e,["swap","index","value","label","number","id"]);return t.createElement(ze,{id:u,index:o,swap:a},t.createElement(r.Tab,Object.assign({},s,{ref:n,value:l,label:t.createElement(r.Box,{display:"flex",flexDirection:"row",alignItems:"center"},t.createElement(r.Typography,null,i),t.createElement(r.Typography,{variant:"caption",color:"textSecondary",style:{marginLeft:oe.spacing(1)}},c)),wrapped:!0})))})),ie=r.makeStyles((function(e){return{root:{zIndex:1e4,position:"absolute",top:0,bottom:0,left:0,right:0,backgroundColor:"rgba(0,0,0,0.1)",borderWidth:3,borderStyle:"dashed",borderRadius:e.shape.borderRadius,borderColor:e.palette.grey.A200,display:"flex",justifyContent:"center",alignItems:"center"}}})),ce=function(){var e=ie();return n.createElement("div",{className:e.root},n.createElement(r.Typography,{variant:"h4",color:"textSecondary"},"Drop here"))},ue=function(e){var a=Q(),o=a.groupings,l=a.ActiveGroupName,i=t.useState(o.activeGroup||""),c=i[0],u=i[1],s=n.useCallback((function(){o.activeGroup!==c?(e.onSuccess(c),e.onClose()):e.onClose()}),[c,o.activeGroup,e]);return n.createElement(O,{opened:e.open,onSuccess:s,onDeny:e.onClose,title:"Transfer "+l+" to new group"},n.createElement(r.FormControl,{style:{width:"100%"}},n.createElement(r.InputLabel,{id:"group-select"},"Group to transfer"),n.createElement(r.Select,{labelId:"group-select",id:"group-select",value:c,onChange:function(e){return u(e.target.value)}},o.groups.map((function(e){return n.createElement(r.MenuItem,{value:e.id,key:e.id},e.name)})))))},se=r.makeStyles((function(e){return r.createStyles({container:{display:"flex",flexDirection:"row",borderWidth:1,borderStyle:"solid",borderColor:e.palette.grey.A100,borderBottomLeftRadius:e.shape.borderRadius,borderTopWidth:0},actionItem:{padding:e.spacing(.2,1,.2,1),borderRightWidth:1,borderRightStyle:"solid",borderRightColor:e.palette.grey.A100,cursor:"pointer","&:last-child":{borderRightWidth:0},"&:hover":{backgroundColor:e.palette.action.hover}}})})),me=function(e){var t=se(),a=z(),o=a[0],l=a[1],c=a[2],u=K(e.formElementId),s=u.removeElement,m=u.copyElement,p=u.transferElement,d=[{icon:n.createElement(i.SwapHorizontalCircleOutlined,{color:"action"}),label:"Change Group",onClick:l},{icon:n.createElement(i.FileCopyOutlined,{color:"action"}),label:"Copy",onClick:m},{icon:n.createElement(i.DeleteOutlined,{color:"error"}),label:"Delete",onClick:s}],f=e.actions?[].concat(e.actions,d):[].concat(d);return n.createElement("div",{className:t.container},f.map((function(e,a){return n.createElement(r.Tooltip,{title:e.label,key:a},n.createElement("div",{className:t.actionItem,onClick:e.onClick,"data-cy":"action-"+e.label},e.icon))})),n.createElement(ue,{open:o,onSuccess:p,onClose:c}))},pe=s.makeStyles((function(e){return r.createStyles({spacing:{padding:e.spacing(1)},dragArea:{cursor:"move",padding:e.spacing(.2,1,.2,1)},center:{display:"flex",justifyContent:"center",alignItems:"center"},container:{width:"100%",borderWidth:1,borderStyle:"solid",borderColor:e.palette.grey.A100},elementContainer:{padding:e.spacing(0,2,1,2)}})})),de=function(e){var t=K(e.element.id).swapElement,a=z(!1),o=a[0],l=a[1],c=a[2],u=pe();return n.createElement("div",{style:{width:"100%",marginBottom:10}},n.createElement(ze,{id:e.element.id,index:e.index,swap:t(e.element.groupID)},n.createElement(r.Paper,{className:u.container,style:{width:"100%"},elevation:0},n.createElement(r.Grid,{container:!0,direction:"column"},n.createElement(r.Grid,{item:!0,container:!0,direction:"row",justify:"space-between"},n.createElement(r.Grid,{item:!0},n.createElement("div",{className:u.dragArea},n.createElement(i.DragHandleOutlined,{color:"action",className:u.center}))),n.createElement(r.Grid,{item:!0,className:u.spacing},n.createElement(r.Typography,{color:"secondary",variant:"overline"},e.element.label)),n.createElement(r.Grid,{item:!0},n.createElement(me,{formElementId:e.element.id,actions:e.element.isReadOnly?void 0:[{icon:n.createElement(i.EditOutlined,{color:"action"}),label:"Edit",onClick:l}]}))),n.createElement(r.Grid,{item:!0,container:!0,direction:"row",alignItems:"center",spacing:1},n.createElement(r.Grid,{item:!0,xs:12},n.createElement("div",{className:u.elementContainer},n.createElement(e.element.render,D({},e.element.attributes,e.formContextRegistration,{name:e.element.name})))))))),n.createElement(Ee,{open:o,onClose:c,element:e.element}))},fe=r.makeStyles((function(e){return r.createStyles({container:{"&:hover $dragContainer":{visibility:"visible"}},dragContainer:{visibility:"hidden",cursor:"move",position:"relative",display:"flex",alignItems:"center",height:"100%",left:e.spacing(.5)},wrapper:{borderWidth:1,borderStyle:"solid",borderColor:e.palette.grey.A100,borderRadius:e.shape.borderRadius,padding:e.spacing(2)},actionArea:{display:"flex",justifyContent:"center",alignItems:"center"},actionDivider:{paddingLeft:e.spacing(1),paddingRight:e.spacing(1)}})})),ge=function(e){var n=fe(),a=c.useFieldArray({name:e.name,control:e.control}),o=a.fields,l=a.append,u=a.remove,s=a.swap;return t.createElement(t.Fragment,null,t.createElement(r.Grid,{container:!0,spacing:1,direction:"column",className:n.wrapper},t.createElement(r.Typography,{color:"textSecondary",variant:"subtitle2"},"options"),o.map((function(a,o){return t.createElement(ze,{id:a.id,index:o,swap:s,dndIndicator:"optionItemSortable",key:a.id},t.createElement(r.Grid,{item:!0,container:!0,direction:"row",alignItems:"center",justify:"center",spacing:2,className:n.container},t.createElement("div",{className:n.dragContainer},t.createElement(i.DragIndicatorOutlined,{color:"action"})),t.createElement(r.Grid,{item:!0,xs:6},t.createElement(r.Input,{fullWidth:!0,placeholder:"Option "+(o+1),autoFocus:!0,onFocus:function(e){e.target.select()},inputRef:e.register(),defaultValue:a.name,name:e.name+"["+o+"].name"})),t.createElement(r.Grid,{item:!0,xs:2},t.createElement(r.Tooltip,{title:"Remove option","aria-label":"remove-option",enterDelay:500},t.createElement(r.IconButton,{"aria-label":"delete",onClick:function(){return u(o)}},t.createElement(i.Clear,null))))))})),t.createElement(r.Box,{p:2,className:n.actionArea},t.createElement(r.Button,{color:"primary",variant:"outlined",onClick:function(){return l({name:""})}},"Add Option"),t.createElement("div",{className:n.actionDivider},t.createElement(r.Typography,{color:"textSecondary"},"or")),t.createElement(r.Button,{variant:"text",size:"small",onClick:function(){return l({name:"other",label:"Other"})}},"Add 'Other' Option"))))},ve={required:function(e){return n.createElement(F,Object.assign({},e,{controlComponent:He,controlComponentProps:{options:[{name:"Required"}]},defaultErrorMessage:"Field is required"}))},min:function(e){return n.createElement(F,Object.assign({},e,{controlComponent:R,controlComponentProps:{type:"number",label:"Minimal value/length"},defaultErrorMessage:"Value is too short"}))},max:function(e){return n.createElement(F,Object.assign({},e,{controlComponent:R,controlComponentProps:{type:"number",label:"Maximal value/length"},defaultErrorMessage:"Value is too long"}))},length:function(e){return n.createElement(F,Object.assign({},e,{controlComponent:R,controlComponentProps:{type:"number",label:"Length"},defaultErrorMessage:"Value must be exactly X characters long"}))},matches:function(e){return n.createElement(F,Object.assign({},e,{controlComponent:R,controlComponentProps:{label:"Regular expression",muiProps:{InputProps:{startAdornment:n.createElement(r.InputAdornment,{position:"start"},"/"),endAdornment:n.createElement(r.InputAdornment,{position:"end"},"/")}}},defaultErrorMessage:"Value does not match expression"}))},email:function(e){return n.createElement(F,Object.assign({},e,{controlComponent:A,controlComponentProps:{label:"Email"},defaultErrorMessage:"Value is not a valid email address"}))},url:function(e){return n.createElement(F,Object.assign({},e,{controlComponent:A,controlComponentProps:{label:"URL"},defaultErrorMessage:"Value is not a valid url"}))},moreThan:function(e){return n.createElement(F,Object.assign({},e,{controlComponent:R,controlComponentProps:{type:"number",label:"More than"},defaultErrorMessage:"Value is too low"}))},lessThan:function(e){return n.createElement(F,Object.assign({},e,{controlComponent:R,controlComponentProps:{type:"number",label:"Less than"},defaultErrorMessage:"Value is too high"}))},positive:function(e){return n.createElement(F,Object.assign({},e,{controlComponent:A,controlComponentProps:{label:"Positive"},defaultErrorMessage:"Value is not positive"}))},negative:function(e){return n.createElement(F,Object.assign({},e,{controlComponent:A,controlComponentProps:{label:"Negative"},defaultErrorMessage:"Value is not negative"}))},integer:function(e){return n.createElement(F,Object.assign({},e,{controlComponent:A,controlComponentProps:{label:"Integer"},defaultErrorMessage:"Value is not an integer"}))}},he=r.makeStyles((function(e){return r.createStyles({validator:{marginBottom:e.spacing(2)}})})),be=function(e){var t,a=c.useForm({defaultValues:e.element.validations}),o=a.register,l=a.handleSubmit,i=a.watch;X();var u=i(),s=$().handlers,m=he();return n.createElement("form",{onSubmit:l((function(t){s.setFormElementValidations(e.element.id,t)}))},n.createElement(r.Grid,{item:!0,container:!0,direction:"column",spacing:2},null==(t=e.element.validators)?void 0:t.map((function(e){return n.createElement(r.Grid,{item:!0,key:e},n.createElement(ve[e],{register:o,disabledParam:!u[e],name:e,className:m.validator}))}))),n.createElement(r.Box,{display:"flex",alignItems:"center",justifyContent:"center",p:3},n.createElement(r.Button,{variant:"contained",color:"primary",type:"submit"},"Save Validations")))},ye=r.makeStyles((function(e){return r.createStyles({root:{margin:0,padding:e.spacing(2)},closeButton:{position:"absolute",right:e.spacing(1),top:e.spacing(1)}})})),Ee=function(e){var t=ye();return n.createElement(n.Fragment,null,n.createElement(r.Dialog,{open:e.open,onClose:e.onClose,fullWidth:!0,maxWidth:"sm"},n.createElement(r.DialogTitle,{disableTypography:!0,className:t.root},n.createElement(r.Typography,{variant:"h6"},e.element.label," Editor"),n.createElement(r.IconButton,{"aria-label":"close",onClick:e.onClose,className:t.closeButton,"data-cy":"button-close-modal"},n.createElement(l,null))),n.createElement(r.DialogContent,null,n.createElement(r.Box,null,n.createElement(r.Box,null,n.createElement(r.Box,{marginBottom:1},n.createElement(r.Typography,{variant:"h6",color:"primary",gutterBottom:!0},"Attributes"),n.createElement(r.Divider,null)),n.createElement(re,{element:e.element})),e.element.validators&&n.createElement(r.Box,null,n.createElement(r.Box,{marginBottom:2},n.createElement(r.Typography,{variant:"h6",color:"primary",gutterBottom:!0},"Validations"),n.createElement(r.Divider,null)),n.createElement(be,{element:e.element}))))))},xe=function(e){var t=e.onJson,a=e.imported,o=n.useState(!1),l=o[0],i=o[1],c=n.useRef(null);return n.createElement(n.Fragment,null,n.createElement("input",{ref:c,type:"file",accept:"application/JSON",style:{display:"none"},onChange:function(e){var n=e.target;if(n&&n.files){i(!0);var r=new FileReader;r.readAsText(n.files[0]),r.onload=function(e){var n,r,a=null==(n=e.target)||null==(r=n.result)?void 0:r.toString(),o=JSON.parse(null!=a?a:"");i(!1),null==t||t(o)}}}}),n.createElement(r.Button,{onClick:function(){var e;return null==c||null==(e=c.current)?void 0:e.click()},variant:"text",color:a?"default":"secondary"},l&&n.createElement(r.CircularProgress,null),a?"Imported":"Import"))},Ce=function(e){var t=e.open,a=e.onClose,o=function(){var e=_((function(e){return e}),(function(e){return e.storeActions})),t=e[0],r=e[1],a=Xe().handlers,o=a.dataToStore,l=a.dataToExport,i=n.useState(!1),c=i[0],u=i[1],s=n.useState(!1),m=s[0],p=s[1],d=n.useState(!1),f=d[0],g=d[1],v=n.useCallback((function(){return JSON.stringify(t)}),[t]);return{handlers:{saveAsJSON:n.useCallback((function(){for(var e=l(t),n=JSON.stringify(e),r=[],a=0;a<n.length;a++)r[a]=n.charCodeAt(a);var o=new Uint8Array(r),i=new Blob([o],{type:"application/octet-stream"}),c=URL.createObjectURL(i),u=document.createElement("a");u.setAttribute("href",c),u.setAttribute("download","small_step_for_rfa.json"),u.click(),p(!0)}),[v]),importData:n.useCallback((function(e){if(!((t=e).elements&&t.elements.length&&t.elements[0].id&&t.elements[0].name&&t.elements[0].groupID&&t.grouping))return alert("import unsuccessful, wrong type!"),void g(!1);var t,n=o(e);r.clearStore(),r.setStore(n),g(!0)}),[r,o]),copyToClipboard:n.useCallback(N(L.mark((function e(){return L.wrap((function(e){for(;;)switch(e.prev=e.next){case 0:return e.prev=0,e.next=3,navigator.clipboard.writeText(v());case 3:u(!0),e.next=10;break;case 6:e.prev=6,e.t0=e.catch(0),console.log(e.t0),u(!1);case 10:case"end":return e.stop()}}),e,null,[[0,6]])}))),[v])},state:{copied:c,exported:m,imported:f}}}(),l=o.handlers,c=o.state,u=ke();return n.createElement(r.Dialog,{open:t,onClose:a},n.createElement(r.DialogTitle,{className:u.root,disableTypography:!0},n.createElement(r.Typography,{variant:"h6"},"RFA Transferer"),n.createElement(r.IconButton,{"aria-label":"close",className:u.closeButton,onClick:a},n.createElement(i.Close,null))),n.createElement(r.DialogContent,null,n.createElement(r.Typography,{color:"textSecondary"},"Export form data as JSON file and/or import it to react form architect - renderer"),n.createElement(r.Box,{display:"flex",flexDirection:"row",alignItems:"center",justifyContent:"space-around",className:u.root},n.createElement(r.Button,{onClick:l.saveAsJSON,variant:"text",color:c.exported?"default":"secondary"},c.exported?"Exported":"Export as JSON"),n.createElement(r.Typography,{className:u.divider}," or "),n.createElement(xe,{onJson:l.importData,imported:c.imported}),n.createElement(r.Typography,{className:u.divider}," or "),n.createElement(r.Button,{onClick:l.copyToClipboard,variant:"text",color:c.copied?"default":"secondary"},c.copied?"Copied":"Copy to Clipboard"))))},ke=s.makeStyles((function(e){return r.createStyles({root:{margin:0,padding:e.spacing(2)},closeButton:{position:"absolute",right:e.spacing(1),top:e.spacing(1),color:e.palette.grey[500]},divider:{marginLeft:e.spacing(1),marginRight:e.spacing(1)}})})),Se=function(e){var t=e.formElements,a=$().createFormElement,o=n.useCallback((function(e){return a(e)}),[a]);return n.createElement(r.Paper,{variant:"outlined"},n.createElement(r.List,{disablePadding:!0,dense:!0},t.map((function(e,t){return n.createElement(ae,{key:t,formElement:e,onClick:function(){return o(e)}})}))))},we=function(){var e=c.useForm(),t=e.register,a=e.control,o=e.setValue,l=e.unregister,i=$();return n.createElement(r.Box,{p:1,width:"100%",height:"100%"},n.createElement("form",null,i.elements.map((function(e,r){return n.createElement(de,{key:e.id,element:e,index:r,formContextRegistration:{register:t,control:a,setValue:o,unregister:l}})}))))};function Te(e){var n=e.children,r=e.value,a=e.index,o=I(e,["children","value","index"]);return t.createElement("div",Object.assign({role:"tabpanel",hidden:r!==a,id:"simple-tabpanel-"+a,"aria-labelledby":"simple-tab-"+a},o),r===a&&n)}var Ne=r.makeStyles({root:{position:"relative",display:"flex",flex:"1 1 0",alignItems:"center",justifyContent:"flex-start",flexDirection:"column"},contentWrapper:{padding:10},dropArea:{width:"100%",justifyContent:"center"},buttonGroup:{justifyContent:"flex-end",paddingBottom:5},dataTransferButtonGroup:{justifyContent:"flex-start",paddingBottom:5}}),De=function(){var e=t.useState(""),n=e[0],a=e[1],o=t.useState(!1),l=o[0],i=o[1],c=Ne(),u=Q(),s=u.groupings,p=u.addGroup,d=u.setActiveGroup,f=u.renameGroup,g=u.deleteGroup,v=u.ActiveGroupName,h=u.swapGroups,b=$(),y=b.createFormElement,E=b.allElements,x=z(),C=x[0],k=x[1],S=x[2],w=z(),T=w[0],N=w[1],D=w[2],I=z(),B=I[0],F=I[1],R=I[2],A=m.useDrop({accept:"draggable-field",drop:function(e){y(e)},collect:function(e){i(e.canDrop())}})[1],L=t.useCallback((function(e,t){d(t)}),[d]),j=t.useCallback((function(){p("Group "+s.groups.length)}),[p,s.groups.length]),P=t.useCallback((function(){f(n),a(""),D()}),[n,D,f]),M=t.useCallback((function(){a(v||""),N()}),[v,N]),V=t.useCallback((function(){g(),S()}),[g,S]),q=t.useCallback((function(e){return E.filter((function(t){return t.groupID===e})).length}),[E]);return t.createElement(r.Box,{display:"flex",flexDirection:"column",style:{height:"100%",width:"100%"}},t.createElement(r.Box,{width:"100%",display:"flex",flexDirection:"row",justifyContent:"space-between",paddingBottom:1},t.createElement(r.Button,{variant:"outlined",onClick:F},"Data Transfer"),t.createElement(r.ButtonGroup,{color:"primary",size:"small","aria-label":"outlined primary button group"},t.createElement(r.Button,{onClick:j},"Add Group"),t.createElement(r.Button,{onClick:M},"Rename Active Group"),",",s.groups.length>1&&t.createElement(r.Button,{onClick:k},"Delete Group"))),t.createElement(r.Paper,{ref:A,className:c.root,variant:"outlined"},s.groups.length>0&&t.createElement(r.AppBar,{position:"static",color:"default",elevation:0},t.createElement(r.Tabs,{value:s.activeGroup,onChange:L,variant:"scrollable",scrollButtons:"auto","aria-label":"simple tabs example"},s.groups.map((function(e,n){return t.createElement(le,{key:e.id,value:e.id,label:e.name,number:q(e.id),id:e.id,index:n,swap:h})})))),l&&t.createElement(ce,null),s.groups.map((function(e){return t.createElement(Te,{key:e.id,value:s.activeGroup,index:e.id,className:c.dropArea},t.createElement(we,null))}))),t.createElement(G,{opened:C,title:"Are you sure to delete "+v+"?",text:"You will lose its form progress",onSuccess:V,onDeny:S}),t.createElement(O,{opened:T,title:"Enter new name for "+v,onSuccess:P,onDeny:D},t.createElement(r.TextField,{autoFocus:!0,value:n,onChange:function(e){return a(e.target.value)},label:"New name",margin:"dense",id:"name"})),t.createElement(Ce,{open:B,onClose:R}))},Ie=function(e){var t=e.onSave,a=_((function(e){return e}))[0],o=n.useCallback((function(){t(a)}),[a]);return n.createElement(r.Button,{color:"primary",variant:"contained",onClick:o,disabled:!a.elements.length},"Save Form")},Be=function(){var e=n.useState(!1),t=e[0],r=e[1],a=n.createRef();return n.useEffect((function(){if(a.current){var e=a.current,t=new IntersectionObserver((function(e){return r(e[0].intersectionRatio<1)}),{threshold:[1],rootMargin:"-1px 0px 150px 0px"});return t.observe(e),function(){t.unobserve(e)}}}),[a]),{isSticky:t,ref:a}},Ge=function(e){var t=D({},e);return n.createElement(r.TextField,Object.assign({},t,{variant:"outlined",InputLabelProps:{shrink:!0}}))},Oe=function(e){var t=e.data,a=e.formContext,o=e.allowUserDefinedData,l=Fe(),c=n.useState(),u=c[0],s=c[1],m=n.useCallback((function(){s((function(e){var t;return D({},e,((t={})[j()]="",t))}))}),[]),p=n.useCallback((function(e){return function(){s((function(t){if(!t)return t;var n=D({},t);return delete n[e],n}))}}),[]);return n.createElement(r.Box,{paddingTop:1},null==t?void 0:t.map((function(e,t){var o,i;return n.createElement(r.Box,{className:l.payloadEntry,key:t},n.createElement(r.Typography,{variant:"caption",className:l.payloadCaption},e.name+":"),e.value?n.createElement(r.Typography,null,e.value):n.createElement(r.Input,{inputRef:a.register,name:a.name+".data."+e.name,defaultValue:null!=(o=e.value)?o:"",placeholder:null!=(i=e.placeholder)?i:"",inputProps:{"aria-label":"description"}}))})),o&&u&&Object.entries(u).map((function(e,t){var o=e[0];return n.createElement(r.Box,{className:l.payloadEntry,key:o},n.createElement(r.Input,{className:l.payloadCaption,inputRef:a.register,name:a.name+".userData["+t+"].name",inputProps:{"aria-label":"name"},endAdornment:":",placeholder:"name",autoFocus:!0}),n.createElement(r.Input,{inputRef:a.register,name:a.name+".userData["+t+"].value",placeholder:"value",inputProps:{"aria-label":"description"}}),n.createElement(r.IconButton,{"aria-label":"delete",onClick:p(o),size:"small"},n.createElement(i.Clear,{color:"error",fontSize:"small"})))})),o&&n.createElement(r.Box,{className:l.actionArea},n.createElement(r.Button,{variant:"outlined",color:"secondary",onClick:m,startIcon:n.createElement(i.Add,null),size:"small"},"data entry")))},Fe=r.makeStyles((function(e){return r.createStyles({payloadCaption:{marginRight:e.spacing(1),width:e.spacing(13)},payloadEntry:{display:"flex",flexDirection:"row",alignItems:"center",borderBottomWidth:1,borderBottomStyle:"solid",borderBottomColor:e.palette.grey[200]},actionArea:{marginTop:e.spacing(1),display:"flex",justifyContent:"center"}})})),Re=function(e){var t=e.visible,a=e.title,o=e.onClick,l=Ae();return n.createElement("div",{className:l.root,onClick:function(e){e.preventDefault(),null==o||o()}},n.createElement(r.Typography,{color:"textSecondary",className:l.nodeTitle,variant:"caption",style:{visibility:t?"visible":"hidden"}},a))},Ae=r.makeStyles((function(e){return r.createStyles({root:{position:"sticky",top:0,zIndex:15,cursor:"pointer"},nodeTitle:{border:"1px "+e.palette.primary.light+" solid",borderRadius:e.shape.borderRadius,backgroundColor:e.palette.background.default,position:"absolute",height:"max-content",writingMode:"vertical-rl",padding:e.spacing(.5,.25,.5,.25),textShadow:"0px 0px 1px "+e.palette.primary.light,"&:hover":{border:"1px "+e.palette.primary.main+" solid",textShadow:"0px 0px 1px "+e.palette.primary.main}}})})),Le={remove:i.Remove,add:i.Add,expandMore:i.ExpandMore,expandLess:i.ExpandLess},je=function(e){var t=e.corner,r=e.icon,a=e.color,o=void 0===a?"inherit":a,l=e.onClick,i=Pe(),c=n.useCallback((function(e){e.preventDefault(),l()}),[l]);return n.createElement("div",{className:i[t]},n.createElement("div",{className:i.button,style:{borderColor:oe.palette.grey[300]},onClick:c},n.createElement(Le[r],{color:o})))},Pe=r.makeStyles((function(e){return r.createStyles({button:{height:e.spacing(2.5),width:e.spacing(2.5),cursor:"pointer",borderRadius:e.shape.borderRadius,backgroundColor:e.palette.background.default,borderWidth:1,borderStyle:"solid",display:"flex",alignItems:"center",justifyContent:"center","&:hover":{backgroundColor:e.palette.grey.A100}},topRight:{position:"absolute",top:-e.spacing(2.5)/2,right:-e.spacing(2.5)/2,zIndex:10},bottomLeft:{position:"absolute",bottom:-e.spacing(2.5)/2,left:-e.spacing(2.5)/2,zIndex:10},bottomRight:{position:"absolute",bottom:-e.spacing(2.5)/2,right:-e.spacing(2.5)/2,zIndex:10}})})),Me=function(){var e=n.useState(),t=e[0],r=e[1],a=n.useState(),o=a[0],l=a[1];return[t,n.useCallback((function(e){null!==e&&(r(e.getBoundingClientRect()),l(e))}),[]),o]},Ve=function e(t){var a,o,l=t.id,i=t.formContext,u=t.data,s=t.descendents,m=t.allowUserToDefineData,p=t.isEndingNode,d=void 0!==p&&p,f=t.level,g=void 0===f?1:f,v=t.onDelete,h=t.nodeLabel,b=I(t,["id","formContext","data","descendents","allowUserToDefineData","isEndingNode","level","onDelete","nodeLabel","required"]),y=qe(),E=n.useState(!0),x=E[0],C=E[1],k=n.useState(),S=k[0],w=k[1],T=n.useMemo((function(){return!(!(null==s?void 0:s.length)&&!(null==S?void 0:S.length))}),[S,s]),N=n.useCallback((function(){T&&C((function(e){return!e}))}),[T]),D=Be(),B=D.ref,G=D.isSticky,O=c.useWatch({name:i.name+".name",control:i.control,defaultValue:"Node level "+g}),F=Me(),R=F[0],A=F[1],L=F[2],P=n.useCallback((function(){L&&L.scrollIntoView({behavior:"smooth"})}),[L]),M=n.useCallback((function(){x||C(!0),w((function(e){return[].concat(null!=e?e:[],[{id:j()}])}))}),[x]),V=n.useCallback((function(){null==v||v(l)}),[l,v]),q=n.useCallback((function(e){w((function(t){return null==t?void 0:t.filter((function(t){return t.id!==e}))}))}),[]);return n.createElement(n.Fragment,null,n.createElement("div",{className:y.root,style:1===g?{paddingLeft:0}:{}},1!==g&&n.createElement("div",{className:y.edgeWrapper},n.createElement("div",{className:y.edgeVer,style:{height:d?(null!=(a=null==R?void 0:R.height)?a:2)/2:"100%"}}),n.createElement("div",{className:y.edgeHor,style:{top:(null!=(o=null==R?void 0:R.height)?o:2)/2}})),n.createElement(Re,{visible:!!(G&&T&&x),title:O,onClick:P}),n.createElement(r.Paper,{variant:"outlined",className:y.node,innerRef:A},n.createElement(Ge,Object.assign({},b,{label:h,inputRef:i.register,name:i.name+".name",style:{display:"flex",flex:1}})),n.createElement(je,{onClick:M,icon:"add",corner:"bottomRight",color:"action"}),v&&n.createElement(je,{onClick:V,icon:"remove",corner:"topRight",color:"error"}),T&&n.createElement(je,{onClick:N,icon:x?"expandLess":"expandMore",corner:"bottomLeft",color:"action"}),n.createElement("div",{ref:B}),n.createElement(Oe,{data:u,allowUserDefinedData:m,formContext:i})),n.createElement(r.Collapse,{in:x},null==S?void 0:S.map((function(t,r){return n.createElement(e,Object.assign({key:t.id,id:t.id,formContext:{register:i.register,name:i.name+".descendents["+r+"]",control:i.control},data:u,descendents:t.descendents,level:g+1,isEndingNode:(null==S?void 0:S.length)===r+1,onDelete:q,allowUserToDefineData:m,nodeLabel:h},b))})))))},qe=r.makeStyles((function(e){return r.createStyles({edgeWrapper:{position:"absolute",top:0,bottom:0,left:0,width:e.spacing(5),zIndex:0},edgeVer:{width:1,backgroundColor:e.palette.grey[300]},edgeHor:{position:"absolute",height:1,width:"100%",backgroundColor:e.palette.grey[300]},root:{position:"relative",padding:e.spacing(2,0,2,5)},node:{position:"relative",padding:e.spacing(2),display:"flex",flexDirection:"column",width:"fit-content"},payloadCaption:{marginRight:e.spacing(1),width:e.spacing(13)},payloadEntry:{display:"flex",flexDirection:"row",alignItems:"center",borderBottomWidth:1,borderBottomStyle:"solid",borderBottomColor:e.palette.grey[200]},removeButton:{position:"absolute",height:36,width:36,top:-18,right:-18},addButton:{position:"absolute",height:36,width:36,bottom:-18,right:-18}})})),We=function(e){var t=e.name,a=e.register,o=e.control,l=e.label,i=I(e,["name","register","control","label","error","setValue","unregister