diff --git a/examples/23_custom_query_language.html b/examples/23_custom_query_language.html
index c31ed24..f0d6d21 100644
--- a/examples/23_custom_query_language.html
+++ b/examples/23_custom_query_language.html
@@ -35,10 +35,12 @@
Click on the "Transform" button and try it out.
- The example uses lodash functions filter, sort, and pick.
+ This basic example uses lodash functions filter, sort, and pick,
+ but you can run any JavaScript code.
WARNING: this example uses new Function() which can be dangerous when executed with arbitrary code.
+ Don't use it in production.
diff --git a/src/js/Node.js b/src/js/Node.js
index 134c201..a2b357a 100644
--- a/src/js/Node.js
+++ b/src/js/Node.js
@@ -3865,8 +3865,12 @@ export class Node {
const anchor = this.editor.options.modalAnchor || DEFAULT_MODAL_ANCHOR
const json = node.getValue()
const { createQuery, executeQuery } = this.editor.options
- showTransformModal(anchor, json, createQuery, executeQuery, query => {
- node.transform(query)
+ showTransformModal({
+ anchor,
+ json,
+ createQuery,
+ executeQuery,
+ onTransform: query => { node.transform(query) }
})
}
diff --git a/src/js/previewmode.js b/src/js/previewmode.js
index b818373..4694d42 100644
--- a/src/js/previewmode.js
+++ b/src/js/previewmode.js
@@ -387,20 +387,24 @@ previewmode._showSortModal = function () {
* @private
*/
previewmode._showTransformModal = function () {
- const me = this
-
this.executeWithBusyMessage(() => {
- const anchor = me.options.modalAnchor || DEFAULT_MODAL_ANCHOR
- const json = me.get()
- const { createQuery, executeQuery } = this.editor.options
+ const anchor = this.options.modalAnchor || DEFAULT_MODAL_ANCHOR
+ const json = this.get()
+ const { createQuery, executeQuery } = this.options
- me._renderPreview() // update array count
+ this._renderPreview() // update array count
- showTransformModal(anchor, json, createQuery, executeQuery, query => {
- me.executeWithBusyMessage(() => {
- const updatedJson = this.options.executeQuery(json, query)
- me._setAndFireOnChange(updatedJson)
- }, 'transforming...')
+ showTransformModal({
+ anchor,
+ json,
+ createQuery,
+ executeQuery,
+ onTransform: query => {
+ this.executeWithBusyMessage(() => {
+ const updatedJson = this.options.executeQuery(json, query)
+ this._setAndFireOnChange(updatedJson)
+ }, 'transforming...')
+ }
})
}, 'parsing...')
}
diff --git a/src/js/showTransformModal.js b/src/js/showTransformModal.js
index 3f60767..20b8cb8 100644
--- a/src/js/showTransformModal.js
+++ b/src/js/showTransformModal.js
@@ -7,16 +7,17 @@ import { MAX_PREVIEW_CHARACTERS } from './constants'
/**
* Show advanced filter and transform modal using JMESPath
- * @param {HTMLElement} container The container where to center
- * the modal and create an overlay
- * @param {JSON} json The json data to be transformed
- * @param {function} createQuery Function called to create a query
- * from the wizard form
- * @param {function} executeQuery Execute a query for the preview pane
- * @param {function} onTransform Callback invoked with the created
- * query as callback
+ * @param {Object} params
+ * @property {HTMLElement} container The container where to center
+ * the modal and create an overlay
+ * @property {JSON} json The json data to be transformed
+ * @property {function} createQuery Function called to create a query
+ * from the wizard form
+ * @property {function} executeQuery Execute a query for the preview pane
+ * @property {function} onTransform Callback invoked with the created
+ * query as callback
*/
-export function showTransformModal (container, json, createQuery, executeQuery, onTransform) {
+export function showTransformModal ({ container, json, createQuery, executeQuery, onTransform }) {
const value = json
const content = '