UNPKG

jsonata-visual-editor

Version:

Visual editor for JSONata expressions. Themeable to your needs, default theme is Boostrap 4

3 lines (2 loc) 17.2 kB
function e(e){return e&&"object"==typeof e&&"default"in e?e.default:e}var t=require("react"),n=e(t),a=e(require("jsonata")),r=require("unstated-next"),s=require("jsonata-ui-core"),o={NodeMode:"NodeMode",IDEMode:"IDEMode"},i={">":"greater than","<":"less than","<=":"less than or equal",">=":"greater than or equal"},c={"=":"equals","!=":"not equals"},u={in:"array contains"},l=Object.assign({},c,i,u),h={and:"and",or:"or"},p={"-":"minus","+":"plus","*":"times","/":"divided by","%":"modulo"},g={"&":"concatenate"},d=Object.assign({},l,p,h,g),f={defaultString:function(){return{value:"text",type:"string",position:0}},defaultNumber:function(){return{value:0,type:"number",position:0}},defaultComparison:v,defaultCondition:function(){return{type:"condition",condition:{type:"binary",value:"=",lhs:{type:"path",steps:[{type:"name",value:"revenue",position:0}],position:0,value:void 0},rhs:{value:0,type:"number",position:0},position:0},then:{value:"text",type:"string",position:0},else:{value:"text",type:"string",position:0},position:0,value:void 0}},defaultPath:function(){return{type:"path",steps:[{type:"name",value:"revenue",position:0}],position:0,value:void 0}}};function v(){return{type:"binary",value:"=",lhs:{type:"path",steps:[{type:"name",value:"revenue",position:0}],position:0,value:void 0},rhs:{value:0,type:"number",position:0},position:0}}var m=["string","number","integer","boolean"];function b(e,t){void 0===t&&(t={});var n=t.pathPrefix,a=t.isJsonataSequence;void 0===a&&(a=!1);var r=t.titlePath;void 0===r&&(r=[]);var o=t.typePath;void 0===o&&(o=[]);var i=function(e){return e?n?n+"."+s.escapeString(e):s.escapeString(e):n};function c(e,n){return e.concat(b(n,t))}var u=[];if(!e)return u;e.anyOf&&(u=u.concat(e.anyOf.reduce(c,[]))),e.oneOf&&(u=u.concat(e.oneOf.reduce(c,[]))),e.allOf&&(u=u.concat(e.allOf.reduce(c,[])));var l=e.type;if("object"===l){var h=Object.keys(e.properties||{}).reduce(function(n,a){var s=b(e.properties[a],Object.assign({},t,{pathPrefix:i(a),titlePath:r.concat([e.title]),typePath:o.concat([l])}));return n.concat(s)},[]);u=u.concat(h)}else if("array"===l)u=[].concat(b(e.items,{pathPrefix:i(),titlePath:r.concat([e.title]),typePath:o.concat([l]),isJsonataSequence:!0}));else if(!Array.isArray(l)&&m.includes(l)){var p={path:i(),title:e.title,description:e.description,type:l,titlePath:r.concat([e.title]),typePath:o.concat([l]),isJsonataSequence:a};u=u.concat([p])}else Array.isArray(l)&&(u=u.concat(l.reduce(function(t,n){return"null"===n?t:t.concat([{path:i(),title:e.title,description:e.description,type:n,titlePath:r.concat([e.title]),typePath:o.concat([n]),isJsonataSequence:a}])},[])));return u}function y(e){return{getPaths:function(t){return b(e)},getTypeAtPath:function(e){return null}}}var C={makeSchemaProvider:y},O={numberOperators:i,baseOperators:c,arrayOperators:u,comparionsOperators:l,combinerOperators:h,mathOperators:p,stringOperators:g,operators:d},E=b,j=r.createContainer(function(e){if(void 0===e)throw new Error("initialState is required!");return{schemaProvider:e.schemaProvider,theme:e.theme,boundVariables:e.boundVariables,defaultProvider:e.defaultProvider}}),P=function(e){return"binary"===e.type&&Object.keys(O.mathOperators).includes(e.value)};function x(e){var t=a('**[type = "block" or type = "lambda" or type = "transform" or (type = "binary" and value = "&")]');try{if(t.evaluate(e))return"Can't use basic editor for advanced expressions. Try a simpler expression."}catch(e){return"Failed to evaluate expression"}return null}function w(e){var t=e.ast,a=function(e,t){var n={};for(var a in e)Object.prototype.hasOwnProperty.call(e,a)&&-1===t.indexOf(a)&&(n[a]=e[a]);return n}(e,["ast"]);if("binary"===t.type)return n.createElement(T,Object.assign({},a,{ast:t}));if("path"===t.type)return n.createElement(V,Object.assign({},a,{ast:t}));if("number"===t.type||"value"===t.type||"string"===t.type)return n.createElement(L,Object.assign({},a,{ast:t}));if("block"===t.type)return n.createElement(I,Object.assign({},a,{ast:t}));if("condition"===t.type)return n.createElement(D,Object.assign({},a,{ast:t}));if("variable"===t.type)return n.createElement(A,Object.assign({},a,{ast:t}));if("bind"===t.type)return n.createElement(U,Object.assign({},a,{ast:t}));if("apply"===t.type)return n.createElement(z,Object.assign({},a,{ast:t}));if("function"===t.type)return n.createElement(R,Object.assign({},a,{ast:t}));if("unary"===t.type&&"{"===t.value)return n.createElement(F,Object.assign({},a,{ast:t}));if("unary"===t.type&&"["===t.value)return n.createElement(J,Object.assign({},a,{ast:t}));throw new Error("Unsupported node type: "+e.ast.type)}function N(e,n,a){var r=t.useState(null),s=r[0],o=r[1];return t.useEffect(function(){e!==s&&(o(e),a())},[e]),[function(e){o(e),n(e)}]}function S(e){var r=e.text,s=e.onChange,o=e.setToggleBlock,i=e.isValidBasicExpression,c=j.useContainer().theme,u=t.useState({inProgress:!1,error:""}),l=u[0],h=u[1],p=N(r,s,f)[0],g=function(e){var t=i(e);o(t)},d=function(e){o(e?"Can't switch modes while there is an error.":null)};function f(e){var t;h({inProgress:!0,error:void 0});var n=void 0;try{t=a(e||r).ast()}catch(e){return h({inProgress:!1,error:n="Parsing Error: "+e.message}),void(d&&d(n))}h({inProgress:!1,error:n}),d&&d(void 0),g(t)}return n.createElement(c.IDETextarea,{text:r,textChange:function(e){if("string"!=typeof e)throw Error("Invalid text");p(e),f(e)},parsing:l})}function k(e){var t=j.useContainer().theme,a=n.createElement(w,Object.assign({},e));return n.createElement(t.RootNodeEditor,Object.assign({},e,{editor:a}))}function T(e){return Object.keys(O.combinerOperators).includes(e.ast.value)?n.createElement(B,Object.assign({},e)):Object.keys(O.comparionsOperators).includes(e.ast.value)?n.createElement(M,Object.assign({},e)):Object.keys(O.mathOperators).includes(e.ast.value)?n.createElement(G,Object.assign({},e)):void 0}function M(e){var t=j.useContainer().theme,a="in"===e.ast.value,r=a?"rhs":"lhs",s=a?"lhs":"rhs",o={ast:e.ast[r],onChange:function(t){var n;return e.onChange(Object.assign({},e.ast,((n={})[r]=t,n)))}},i={ast:e.ast[s],onChange:function(t){var n;return e.onChange(Object.assign({},e.ast,((n={})[s]=t,n)))}},c=n.createElement(w,Object.assign({},o)),u=n.createElement(w,Object.assign({},i));return n.createElement(t.ComparisonEditor,{ast:e.ast,onChange:e.onChange,lhs:c,rhs:u,lhsProps:o,rhsProps:i,changeOperator:function(t){var n=Object.assign({},e.ast,{value:t}),a=function(e){return Object.assign({},e,{lhs:e.rhs,rhs:e.lhs})};e.onChange("in"===e.ast.value&&"in"!==n.value?a(n):"in"===n.value&&"in"!==e.ast.value?a(n):n)}})}function B(e){var t=j.useContainer(),a=t.theme,r=t.defaultProvider,s=function e(t){var n=t.ast,a=t.onChange,r=t.parentType;return"binary"===n.type&&n.value===r?e({ast:n.lhs,onChange:function(e){return a(Object.assign({},n,{lhs:e}))},parentType:r}).concat(e({ast:n.rhs,onChange:function(e){return a(Object.assign({},n,{rhs:e}))},parentType:r})):[{ast:n,onChange:a}]}({ast:e.ast,onChange:e.onChange,parentType:e.ast.value}),o=function(t){return e.onChange(function e(t){var n=t.ast,a=t.parentType,r=t.newValue;return"binary"===n.type&&n.value===a?Object.assign({},n,{lhs:e({ast:n.lhs,parentType:a,newValue:r}),rhs:e({ast:n.rhs,parentType:a,newValue:r}),value:r}):n}({ast:e.ast,newValue:t,parentType:e.ast.value}))},i=s.map(function(e){return{editor:n.createElement(w,{ast:e.ast,onChange:e.onChange}),ast:e.ast,onChange:e.onChange}}),c=i.map(function(e){return e.editor});return n.createElement(a.CombinerEditor,{children:c,childNodes:i,ast:e.ast,onChange:o,removeLast:function(){return e.onChange(e.ast.lhs)},addNew:function(){return o({type:"binary",value:e.ast.value,lhs:e.ast,rhs:r.defaultComparison(),position:0})},combinerOperators:O.combinerOperators})}function V(e){var t=e.ast,a=e.onChange,r=e.cols;void 0===r&&(r="5");var s=j.useContainer(),o=s.defaultProvider;return n.createElement(s.theme.PathEditor,{ast:t,changeType:function(){return a(q(t,o))},cols:r,onChange:a,schemaProvider:s.schemaProvider})}function q(e,t){if("string"===e.type)try{var n=a(e.value).ast();if(P(n))return n}catch(e){}if("path"!==e.type){if(!e.value||isNaN(e.value))return t.defaultPath();try{return a(e.value).ast()}catch(e){return t.defaultPath()}}else if("path"===e.type)return{type:"string",value:s.serializer(e),position:0};throw new Error("Unhandled AST type")}function L(e){var t=e.ast,a=e.onChange,r=e.cols;void 0===r&&(r="5");var s=j.useContainer(),o=s.theme,i=s.defaultProvider,c=function(e){if("string"===e.type)return e.value;if("number"===e.type)return e.value.toString();if("value"===e.type){if(null===e.value)return"null";if(!1===e.value)return"false";if(!0===e.value)return"true"}}(t);return n.createElement(o.LeafValueEditor,{ast:t,text:c,onChange:a,onChangeText:function(e){return a(function(e){var t,n=e.trim().toLowerCase();if("string"==typeof(t=e)&&!isNaN(t)&&!isNaN(parseFloat(t)))return{type:"number",value:parseFloat(e),position:0};if(["true","false","null"].includes(n)){var a;if("true"===n)a=!0;else if("false"===n)a=!1;else{if("null"!==n)throw console.error("Invalid value node"+e),new Error("Unhandle value node"+e);a=null}return{type:"value",value:a,position:0}}return{type:"string",value:e,position:0}}(e))},changeType:function(){return a(q(t,i))},cols:r})}function I(e){var t=e.ast,a=e.onChange,r=j.useContainer().theme,s=t.expressions.map(function(e,r){var s=function(e){var n=[].concat(t.expressions);n[r]=e;var s=Object.assign({},t,{expressions:n});a(s)};return{editor:n.createElement(w,{ast:e,onChange:s}),ast:e,onChange:s}}),o=s.map(function(e){return e.editor});return n.createElement(r.BlockEditor,{ast:t,onChange:a,children:o,childNodes:s})}function A(e){var t=e.ast,a=e.onChange,r=e.cols;void 0===r&&(r="5");var s=j.useContainer(),o=s.boundVariables;return void 0===o&&(o=[]),n.createElement(s.theme.VariableEditor,{ast:t,cols:r,onChange:a,boundVariables:o})}function D(e){var t=e.ast,a=e.onChange,r=j.useContainer(),s=r.theme,o=r.defaultProvider,i=function e(t){var n=t.ast,a=t.onChange;if("condition"===n.type){var r={condition:function(e){return a(Object.assign({},n,{condition:e}))},then:function(e){return a(Object.assign({},n,{then:e}))},else:function(e){return a(Object.assign({},n,{else:e}))}};if(!n.else)return{pairs:[{condition:{ast:n.condition,onChange:r.condition},then:{ast:n.then,onChange:r.then},original:{ast:n,onChange:a}}]};var s=e({ast:n.else,onChange:r.else});return{pairs:[{condition:{ast:n.condition,onChange:r.condition},then:{ast:n.then,onChange:r.then},original:{ast:n,onChange:a}}].concat(s.pairs),finalElse:s.finalElse}}return{pairs:[],finalElse:{ast:n,onChange:a}}}({ast:t,onChange:a}),c=i.pairs,u=function(){if(!(c.length<=1)){var e=c[c.length-2].original;e.onChange(i.finalElse?Object.assign({},e.ast,{else:i.finalElse.ast}):Object.assign({},e.ast))}},l=function(){var e=c[c.length-1].original;e.onChange(i.finalElse?Object.assign({},e.ast,{else:Object.assign({},o.defaultCondition(),{else:i.finalElse.ast})}):Object.assign({},e.ast,{else:Object.assign({},o.defaultCondition())}))},h=i.pairs.map(function(e){return{Then:n.createElement(w,Object.assign({},e.then,{cols:"12"})),Condition:n.createElement(w,Object.assign({},e.condition,{cols:"12"})),remove:function(){return(0,e.original.onChange)((t=e.original.ast).else?t.else:null);var t},ast:e.original.ast,onChange:e.original.onChange}});if(i.finalElse){var p=n.createElement(w,Object.assign({},i.finalElse,{cols:"6"}));return n.createElement(s.ConditionEditor,{ast:t,onChange:a,children:h,elseEditor:p,addNew:l,removeLast:u})}return n.createElement(s.ConditionEditor,{ast:t,onChange:a,children:h,addNew:l,removeLast:u})}function U(e){var t=e.ast,a=e.onChange,r=j.useContainer().theme,s={ast:t.lhs,onChange:function(e){return a(Object.assign({},t,{lhs:e}))}},o={ast:t.rhs,onChange:function(e){return a(Object.assign({},t,{rhs:e}))}},i=n.createElement(w,Object.assign({},s)),c=n.createElement(w,Object.assign({},o));return n.createElement(r.BindEditor,{ast:t,onChange:a,lhs:i,rhs:c,rhsProps:o,lhsProps:s})}function F(e){var t=e.ast,a=e.onChange,r=j.useContainer(),s=r.theme,o=r.defaultProvider,i=t.lhs.map(function(e,r){var s=function(n,s){var o=[].concat(t.lhs),i=[].concat(e);i[s]=n,o[r]=i,a(Object.assign({},t,{lhs:o}))},o={ast:e[0],onChange:function(e){return s(e,0)}},i={ast:e[1],onChange:function(e){return s(e,1)}};return{key:n.createElement(w,Object.assign({},o,{cols:"12"})),value:n.createElement(w,Object.assign({},i,{cols:"12"})),remove:function(){return function(e){return a(Object.assign({},t,{lhs:t.lhs.filter(function(t,n){return n!==e})}))}(r)},keyProps:o,valueProps:i}});return n.createElement(s.ObjectUnaryEditor,{ast:t,onChange:a,children:i,addNew:function(){var e=[o.defaultString(),o.defaultComparison()];a(Object.assign({},t,{lhs:t.lhs.concat([e])}))},removeLast:function(){a(Object.assign({},t,{lhs:t.lhs.slice(0,-1)}))}})}function J(e){var t=e.ast,a=e.onChange,r=j.useContainer(),s=r.theme,o=r.defaultProvider,i=t.expressions.map(function(e,r){var s=function(e){var n=[].concat(t.expressions);n[r]=e,a(Object.assign({},t,{expressions:n}))};return{editor:n.createElement(w,{ast:e,onChange:function(e){return s(e)},cols:"12"}),remove:function(){var e=function(e,t){return e.slice(0,t).concat(e.slice(t+1))}(t.expressions,r);a(Object.assign({},t,{expressions:e}))},ast:e,onChange:s}});return n.createElement(s.ArrayUnaryEditor,{ast:t,onChange:a,children:i,addNew:function(){a(Object.assign({},t,{expressions:t.expressions.concat([o.defaultComparison()])}))},removeLast:function(){a(Object.assign({},t,{expressions:t.expressions.slice(0,-1)}))}})}function z(e){var t=j.useContainer().theme,a=function e(t,n){if("apply"===t.type){var a={ast:t.rhs,onChange:function(e){n(Object.assign({},t,{rhs:e}))}};if("apply"===t.lhs.type){var r=e(t.lhs,function(e){n(Object.assign({},t,{lhs:e}))});return{baseLeft:r.baseLeft,chain:r.chain.concat([a])}}return{baseLeft:{ast:t.lhs,onChange:function(e){n(Object.assign({},t,{lhs:e}))}},chain:[a]}}return{baseLeft:{ast:t,onChange:n},chain:[]}}(e.ast,e.onChange),r=a.baseLeft,s=a.chain,o=n.createElement(w,Object.assign({},r)),i=s.map(function(e){return{editor:n.createElement(w,{ast:e.ast,onChange:e.onChange}),ast:e.ast,onChange:e.onChange}}),c=i.map(function(e){return e.editor});return n.createElement(t.ApplyEditor,{ast:e.ast,onChange:e.onChange,lhs:o,lhsProps:r,children:c,childNodes:i})}function R(e){var t=e.ast,a=e.onChange,r=j.useContainer().theme,s=t.arguments.map(function(e,r){var s=function(e){var n=[].concat(t.arguments);n[r]=e,a(Object.assign({},t,{arguments:n}))};return{editor:n.createElement(w,{ast:e,onChange:s}),ast:e,onChange:s}}),o=s.map(function(e){return e.editor});return n.createElement(r.FunctionEditor,{ast:t,onChange:a,args:o,argumentNodes:s,changeProcedure:function(e){return a(Object.assign({},t,{procedure:Object.assign({},t.procedure,{value:e})}))}})}function G(e){var r=j.useContainer(),o=r.theme,i=r.defaultProvider,c=t.useState(s.serializer(e.ast)),u=c[0],l=c[1],h=t.useState({inProgress:!1}),p=h[0],g=h[1],d=function e(t,a,r){return void 0===r&&(r=[]),P(t)?(e(t.lhs,function(e){return a(Object.assign({},t,{lhs:e}))},r),r.push({type:"operator",operator:t.value,onChangeOperator:function(e){if(!Object.keys(O.mathOperators).includes(e))throw new Error("Not a valid math operator");a(Object.assign({},t,{value:e}))}}),e(t.rhs,function(e){return a(Object.assign({},t,{rhs:e}))},r)):r.push({type:"ast",ast:t,onChange:a,editor:n.createElement(w,{ast:t,onChange:a})}),r}(e.ast,e.onChange);return n.createElement(o.MathEditor,Object.assign({text:u,children:d,textChange:function(t){var n=void 0;g({inProgress:!0,error:n});try{var r=a(t).ast();if(!P(r))throw new Error("that's not a math expressions");e.onChange(r)}catch(e){n="Parsing Error: "+e.message}finally{g({inProgress:!1,error:n}),l(t)}},parsing:p,changeType:function(){e.onChange(q(e.ast,i))}},e))}exports.SchemaProvider=C,exports.Consts=O,exports.PathSuggester=E,exports.Context=j,exports.isNumberNode=function(e){return"number"===e.type},exports.isPathNode=function(e){return"path"===e.type},exports.isMath=P,exports.Editor=function(e){var r=e.isValidBasicExpression;void 0===r&&(r=x);var i=e.text,c=function(){try{var t=a(e.text).ast(),n=r(t);return{toggleBlock:n,mode:null===n?o.NodeMode:o.IDEMode}}catch(e){return{toggleBlock:"Parsing error with expression",mode:"IDEMode"}}},u=t.useState(c),l=u[0],h=u[1],p=N(e.text,e.onChange,function(){return h(c())})[0],g=e.schema,d=e.schemaProvider,v=e.theme,m=e.defaultProvider;void 0===m&&(m={});var b=Object.assign({},f,m),C=g?y(g):d,O=l.toggleBlock,E=l.mode,P=E===o.NodeMode?n.createElement(k,{ast:a(i).ast(),onChange:function(e){var t=s.serializer(e);p(t)}}):n.createElement(S,{setToggleBlock:function(e){h(Object.assign({},l,{toggleBlock:e}))},isValidBasicExpression:r,onChange:p,text:i});return n.createElement(j.Provider,{initialState:{schemaProvider:C,theme:v,defaultProvider:b}},n.createElement(v.Base,{editor:P,toggleMode:function(){if(l.mode===o.NodeMode)h(Object.assign({},l,{mode:"IDEMode"}));else{var t=a(e.text).ast();h(Object.assign({},l,{ast:t,mode:"NodeMode"}))}},toggleBlock:O,mode:E}))},exports.defaultIsValidBasicExpression=x,exports.IDEEditor=S,exports.Modes=o; //# sourceMappingURL=AstEditor.js.map