@bpmn-io/form-js-playground 0.7.2 → 0.8.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/LICENSE +22 -22
- package/README.md +15 -5
- package/dist/assets/form-js-playground.css +250 -189
- package/dist/form-playground.umd.js +36542 -30408
- package/dist/index.cjs +204 -116
- package/dist/index.cjs.map +1 -1
- package/dist/index.es.js +197 -110
- package/dist/index.es.js.map +1 -1
- package/dist/types/Playground.d.ts +64 -0
- package/dist/types/components/EmbedModal.d.ts +1 -0
- package/dist/types/components/JSONEditor.d.ts +16 -0
- package/dist/types/components/Modal.d.ts +1 -0
- package/dist/types/components/PlaygroundRoot.d.ts +1 -0
- package/dist/types/components/Section.d.ts +4 -0
- package/dist/types/index.d.ts +1 -0
- package/package.json +24 -9
- package/karma.conf.js +0 -100
- package/resources/screenshot.png +0 -0
- package/rollup.config.js +0 -60
- package/src/FileDrop.css +0 -33
- package/src/JSONView.js +0 -78
- package/src/Playground.css +0 -158
- package/src/Playground.js +0 -375
- package/src/index.js +0 -1
- package/test/.eslintrc +0 -8
- package/test/TestHelper.js +0 -26
- package/test/coverageBundle.js +0 -9
- package/test/spec/Playground.spec.js +0 -90
- package/test/spec/form.json +0 -86
- package/test/spec/other-form.json +0 -11
- package/test/test.css +0 -9
- package/test/testBundle.js +0 -4
package/dist/index.cjs
CHANGED
|
@@ -2,83 +2,26 @@
|
|
|
2
2
|
|
|
3
3
|
Object.defineProperty(exports, '__esModule', { value: true });
|
|
4
4
|
|
|
5
|
-
var mitt = require('mitt');
|
|
6
|
-
var basicSetup = require('@codemirror/basic-setup');
|
|
7
|
-
var state = require('@codemirror/state');
|
|
8
|
-
var langJson = require('@codemirror/lang-json');
|
|
9
5
|
var preact = require('preact');
|
|
10
|
-
var hooks = require('preact/hooks');
|
|
11
6
|
var fileDrop = require('file-drops');
|
|
7
|
+
var mitt = require('mitt');
|
|
8
|
+
var hooks = require('preact/hooks');
|
|
12
9
|
var download = require('downloadjs');
|
|
13
|
-
var
|
|
10
|
+
var classNames = require('classnames');
|
|
11
|
+
var formJsViewer = require('@bpmn-io/form-js-viewer');
|
|
12
|
+
var formJsEditor = require('@bpmn-io/form-js-editor');
|
|
14
13
|
var jsxRuntime = require('preact/jsx-runtime');
|
|
14
|
+
var codemirror = require('codemirror');
|
|
15
|
+
var view = require('@codemirror/view');
|
|
16
|
+
var state = require('@codemirror/state');
|
|
17
|
+
var langJson = require('@codemirror/lang-json');
|
|
15
18
|
|
|
16
19
|
function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
|
|
17
20
|
|
|
18
|
-
var mitt__default = /*#__PURE__*/_interopDefaultLegacy(mitt);
|
|
19
21
|
var fileDrop__default = /*#__PURE__*/_interopDefaultLegacy(fileDrop);
|
|
22
|
+
var mitt__default = /*#__PURE__*/_interopDefaultLegacy(mitt);
|
|
20
23
|
var download__default = /*#__PURE__*/_interopDefaultLegacy(download);
|
|
21
|
-
|
|
22
|
-
function JSONEditor(options = {}) {
|
|
23
|
-
const emitter = mitt__default['default']();
|
|
24
|
-
const {
|
|
25
|
-
readonly = false
|
|
26
|
-
} = options;
|
|
27
|
-
let language = new state.Compartment().of(langJson.json());
|
|
28
|
-
let tabSize = new state.Compartment().of(state.EditorState.tabSize.of(2));
|
|
29
|
-
|
|
30
|
-
function createState(doc, extensions = []) {
|
|
31
|
-
return state.EditorState.create({
|
|
32
|
-
doc,
|
|
33
|
-
extensions: [basicSetup.basicSetup, language, tabSize, ...extensions]
|
|
34
|
-
});
|
|
35
|
-
}
|
|
36
|
-
|
|
37
|
-
function createView(readonly) {
|
|
38
|
-
const updateListener = basicSetup.EditorView.updateListener.of(update => {
|
|
39
|
-
if (update.docChanged) {
|
|
40
|
-
emitter.emit('changed', {
|
|
41
|
-
value: update.view.state.doc.toString()
|
|
42
|
-
});
|
|
43
|
-
}
|
|
44
|
-
});
|
|
45
|
-
const editable = basicSetup.EditorView.editable.of(!readonly);
|
|
46
|
-
const view = new basicSetup.EditorView({
|
|
47
|
-
state: createState('', [updateListener, editable])
|
|
48
|
-
});
|
|
49
|
-
|
|
50
|
-
view.setValue = function (value) {
|
|
51
|
-
this.setState(createState(value, [updateListener, editable]));
|
|
52
|
-
};
|
|
53
|
-
|
|
54
|
-
return view;
|
|
55
|
-
}
|
|
56
|
-
|
|
57
|
-
const view = createView(readonly);
|
|
58
|
-
|
|
59
|
-
this.setValue = function (value) {
|
|
60
|
-
view.setValue(value);
|
|
61
|
-
};
|
|
62
|
-
|
|
63
|
-
this.getValue = function () {
|
|
64
|
-
return view.state.doc.toString();
|
|
65
|
-
};
|
|
66
|
-
|
|
67
|
-
this.on = emitter.on;
|
|
68
|
-
this.off = emitter.off;
|
|
69
|
-
|
|
70
|
-
this.attachTo = function (container) {
|
|
71
|
-
container.appendChild(view.dom);
|
|
72
|
-
};
|
|
73
|
-
|
|
74
|
-
this.destroy = function () {
|
|
75
|
-
if (view.dom.parentNode) {
|
|
76
|
-
view.dom.parentNode.removeChild(view.dom);
|
|
77
|
-
}
|
|
78
|
-
|
|
79
|
-
view.destroy();
|
|
80
|
-
};
|
|
81
|
-
}
|
|
24
|
+
var classNames__default = /*#__PURE__*/_interopDefaultLegacy(classNames);
|
|
82
25
|
|
|
83
26
|
function Modal(props) {
|
|
84
27
|
hooks.useEffect(() => {
|
|
@@ -119,42 +62,6 @@ function Modal(props) {
|
|
|
119
62
|
});
|
|
120
63
|
}
|
|
121
64
|
|
|
122
|
-
function Section(props) {
|
|
123
|
-
const elements = Array.isArray(props.children) ? props.children : [props.children];
|
|
124
|
-
const {
|
|
125
|
-
headerItems,
|
|
126
|
-
children
|
|
127
|
-
} = elements.reduce((_, child) => {
|
|
128
|
-
const bucket = child.type === Section.HeaderItem ? _.headerItems : _.children;
|
|
129
|
-
bucket.push(child);
|
|
130
|
-
return _;
|
|
131
|
-
}, {
|
|
132
|
-
headerItems: [],
|
|
133
|
-
children: []
|
|
134
|
-
});
|
|
135
|
-
return jsxRuntime.jsxs("div", {
|
|
136
|
-
class: "fjs-pgl-section",
|
|
137
|
-
children: [jsxRuntime.jsxs("h1", {
|
|
138
|
-
class: "header",
|
|
139
|
-
children: [props.name, " ", headerItems.length ? jsxRuntime.jsx("span", {
|
|
140
|
-
class: "header-items",
|
|
141
|
-
children: headerItems
|
|
142
|
-
}) : null]
|
|
143
|
-
}), jsxRuntime.jsx("div", {
|
|
144
|
-
class: "body",
|
|
145
|
-
children: children
|
|
146
|
-
})]
|
|
147
|
-
});
|
|
148
|
-
}
|
|
149
|
-
|
|
150
|
-
Section.HeaderItem = function (props) {
|
|
151
|
-
return props.children;
|
|
152
|
-
};
|
|
153
|
-
|
|
154
|
-
function serializeValue(obj) {
|
|
155
|
-
return JSON.stringify(JSON.stringify(obj)).replace(/</g, '<').replace(/>/g, '>');
|
|
156
|
-
}
|
|
157
|
-
|
|
158
65
|
function EmbedModal(props) {
|
|
159
66
|
const schema = serializeValue(props.schema);
|
|
160
67
|
const data = serializeValue(props.data || {});
|
|
@@ -203,25 +110,145 @@ function EmbedModal(props) {
|
|
|
203
110
|
children: snippet
|
|
204
111
|
})]
|
|
205
112
|
});
|
|
113
|
+
} // helpers ///////////
|
|
114
|
+
|
|
115
|
+
function serializeValue(obj) {
|
|
116
|
+
return JSON.stringify(JSON.stringify(obj)).replace(/</g, '<').replace(/>/g, '>');
|
|
117
|
+
}
|
|
118
|
+
|
|
119
|
+
function JSONEditor(options = {}) {
|
|
120
|
+
const emitter = mitt__default['default']();
|
|
121
|
+
const {
|
|
122
|
+
readonly = false
|
|
123
|
+
} = options;
|
|
124
|
+
let language = new state.Compartment().of(langJson.json());
|
|
125
|
+
let tabSize = new state.Compartment().of(state.EditorState.tabSize.of(2));
|
|
126
|
+
|
|
127
|
+
function createState(doc, extensions = []) {
|
|
128
|
+
return state.EditorState.create({
|
|
129
|
+
doc,
|
|
130
|
+
extensions: [codemirror.basicSetup, language, tabSize, ...extensions]
|
|
131
|
+
});
|
|
132
|
+
}
|
|
133
|
+
|
|
134
|
+
function createView(readonly) {
|
|
135
|
+
const updateListener = view.EditorView.updateListener.of(update => {
|
|
136
|
+
if (update.docChanged) {
|
|
137
|
+
emitter.emit('changed', {
|
|
138
|
+
value: update.view.state.doc.toString()
|
|
139
|
+
});
|
|
140
|
+
}
|
|
141
|
+
});
|
|
142
|
+
const editable = view.EditorView.editable.of(!readonly);
|
|
143
|
+
const view$1 = new view.EditorView({
|
|
144
|
+
state: createState('', [updateListener, editable])
|
|
145
|
+
});
|
|
146
|
+
|
|
147
|
+
view$1.setValue = function (value) {
|
|
148
|
+
this.setState(createState(value, [updateListener, editable]));
|
|
149
|
+
};
|
|
150
|
+
|
|
151
|
+
return view$1;
|
|
152
|
+
}
|
|
153
|
+
|
|
154
|
+
const view$1 = createView(readonly);
|
|
155
|
+
|
|
156
|
+
this.setValue = function (value) {
|
|
157
|
+
view$1.setValue(value);
|
|
158
|
+
};
|
|
159
|
+
|
|
160
|
+
this.getValue = function () {
|
|
161
|
+
return view$1.state.doc.toString();
|
|
162
|
+
};
|
|
163
|
+
|
|
164
|
+
this.on = emitter.on;
|
|
165
|
+
this.off = emitter.off;
|
|
166
|
+
|
|
167
|
+
this.attachTo = function (container) {
|
|
168
|
+
container.appendChild(view$1.dom);
|
|
169
|
+
};
|
|
170
|
+
|
|
171
|
+
this.destroy = function () {
|
|
172
|
+
if (view$1.dom.parentNode) {
|
|
173
|
+
view$1.dom.parentNode.removeChild(view$1.dom);
|
|
174
|
+
}
|
|
175
|
+
|
|
176
|
+
view$1.destroy();
|
|
177
|
+
};
|
|
178
|
+
}
|
|
179
|
+
|
|
180
|
+
function Section(props) {
|
|
181
|
+
const elements = Array.isArray(props.children) ? props.children : [props.children];
|
|
182
|
+
const {
|
|
183
|
+
headerItems,
|
|
184
|
+
children
|
|
185
|
+
} = elements.reduce((_, child) => {
|
|
186
|
+
const bucket = child.type === Section.HeaderItem ? _.headerItems : _.children;
|
|
187
|
+
bucket.push(child);
|
|
188
|
+
return _;
|
|
189
|
+
}, {
|
|
190
|
+
headerItems: [],
|
|
191
|
+
children: []
|
|
192
|
+
});
|
|
193
|
+
return jsxRuntime.jsxs("div", {
|
|
194
|
+
class: "fjs-pgl-section",
|
|
195
|
+
children: [jsxRuntime.jsxs("h1", {
|
|
196
|
+
class: "header",
|
|
197
|
+
children: [props.name, " ", headerItems.length ? jsxRuntime.jsx("span", {
|
|
198
|
+
class: "header-items",
|
|
199
|
+
children: headerItems
|
|
200
|
+
}) : null]
|
|
201
|
+
}), jsxRuntime.jsx("div", {
|
|
202
|
+
class: "body",
|
|
203
|
+
children: children
|
|
204
|
+
})]
|
|
205
|
+
});
|
|
206
206
|
}
|
|
207
207
|
|
|
208
|
+
Section.HeaderItem = function (props) {
|
|
209
|
+
return props.children;
|
|
210
|
+
};
|
|
211
|
+
|
|
208
212
|
function PlaygroundRoot(props) {
|
|
213
|
+
const {
|
|
214
|
+
actions: actionsConfig = {},
|
|
215
|
+
editor: editorConfig = {},
|
|
216
|
+
emit
|
|
217
|
+
} = props;
|
|
218
|
+
const {
|
|
219
|
+
display: displayActions = true
|
|
220
|
+
} = actionsConfig;
|
|
221
|
+
const {
|
|
222
|
+
inlinePropertiesPanel = true
|
|
223
|
+
} = editorConfig;
|
|
224
|
+
const paletteContainerRef = hooks.useRef();
|
|
209
225
|
const editorContainerRef = hooks.useRef();
|
|
210
226
|
const formContainerRef = hooks.useRef();
|
|
211
227
|
const dataContainerRef = hooks.useRef();
|
|
212
228
|
const resultContainerRef = hooks.useRef();
|
|
229
|
+
const propertiesPanelContainerRef = hooks.useRef();
|
|
230
|
+
const paletteRef = hooks.useRef();
|
|
213
231
|
const formEditorRef = hooks.useRef();
|
|
214
232
|
const formRef = hooks.useRef();
|
|
215
233
|
const dataEditorRef = hooks.useRef();
|
|
216
234
|
const resultViewRef = hooks.useRef();
|
|
235
|
+
const propertiesPanelRef = hooks.useRef();
|
|
217
236
|
const [showEmbed, setShowEmbed] = hooks.useState(false);
|
|
218
237
|
const [initialData] = hooks.useState(props.data || {});
|
|
219
238
|
const [initialSchema, setInitialSchema] = hooks.useState(props.schema);
|
|
220
239
|
const [data, setData] = hooks.useState(props.data || {});
|
|
221
240
|
const [schema, setSchema] = hooks.useState(props.schema);
|
|
222
|
-
const [resultData, setResultData] = hooks.useState(props.data || {});
|
|
241
|
+
const [resultData, setResultData] = hooks.useState(props.data || {}); // pipe to playground API
|
|
242
|
+
|
|
223
243
|
hooks.useEffect(() => {
|
|
224
244
|
props.onInit({
|
|
245
|
+
attachDataContainer: node => dataEditorRef.current.attachTo(node),
|
|
246
|
+
attachEditorContainer: node => formEditorRef.current.attachTo(node),
|
|
247
|
+
attachFormContainer: node => formRef.current.attachTo(node),
|
|
248
|
+
attachPaletteContainer: node => paletteRef.current.attachTo(node),
|
|
249
|
+
attachPropertiesPanelContainer: node => propertiesPanelRef.current.attachTo(node),
|
|
250
|
+
attachResultContainer: node => resultViewRef.current.attachTo(node),
|
|
251
|
+
get: (name, strict) => formEditorRef.current.get(name, strict),
|
|
225
252
|
setSchema: setInitialSchema
|
|
226
253
|
});
|
|
227
254
|
});
|
|
@@ -236,15 +263,27 @@ function PlaygroundRoot(props) {
|
|
|
236
263
|
readonly: true,
|
|
237
264
|
value: toJSON(resultData)
|
|
238
265
|
});
|
|
239
|
-
const form = formRef.current = new
|
|
240
|
-
const formEditor = formEditorRef.current = new
|
|
266
|
+
const form = formRef.current = new formJsViewer.Form();
|
|
267
|
+
const formEditor = formEditorRef.current = new formJsEditor.FormEditor({
|
|
241
268
|
renderer: {
|
|
242
269
|
compact: true
|
|
270
|
+
},
|
|
271
|
+
palette: {
|
|
272
|
+
parent: paletteContainerRef.current
|
|
273
|
+
},
|
|
274
|
+
propertiesPanel: {
|
|
275
|
+
parent: !inlinePropertiesPanel && propertiesPanelContainerRef.current
|
|
243
276
|
}
|
|
244
277
|
});
|
|
278
|
+
paletteRef.current = formEditor.get('palette');
|
|
279
|
+
propertiesPanelRef.current = formEditor.get('propertiesPanel');
|
|
245
280
|
formEditor.on('changed', () => {
|
|
246
281
|
setSchema(formEditor.getSchema());
|
|
247
282
|
});
|
|
283
|
+
formEditor.on('formEditor.rendered', () => {
|
|
284
|
+
// notifiy interested parties after render
|
|
285
|
+
emit('formPlayground.rendered');
|
|
286
|
+
});
|
|
248
287
|
form.on('changed', event => {
|
|
249
288
|
setResultData(event.data);
|
|
250
289
|
});
|
|
@@ -297,7 +336,9 @@ function PlaygroundRoot(props) {
|
|
|
297
336
|
setShowEmbed(true);
|
|
298
337
|
}, []);
|
|
299
338
|
return jsxRuntime.jsxs("div", {
|
|
300
|
-
class:
|
|
339
|
+
class: classNames__default['default']('fjs-container', 'fjs-pgl-root', {
|
|
340
|
+
'fjs-pgl-inline-editor-panel': inlinePropertiesPanel
|
|
341
|
+
}),
|
|
301
342
|
children: [jsxRuntime.jsx("div", {
|
|
302
343
|
class: "fjs-pgl-modals",
|
|
303
344
|
children: showEmbed ? jsxRuntime.jsx(EmbedModal, {
|
|
@@ -305,18 +346,21 @@ function PlaygroundRoot(props) {
|
|
|
305
346
|
data: data,
|
|
306
347
|
onClose: hideEmbedModal
|
|
307
348
|
}) : null
|
|
349
|
+
}), jsxRuntime.jsx("div", {
|
|
350
|
+
class: "fjs-pgl-palette-container",
|
|
351
|
+
ref: paletteContainerRef
|
|
308
352
|
}), jsxRuntime.jsxs("div", {
|
|
309
353
|
class: "fjs-pgl-main",
|
|
310
354
|
children: [jsxRuntime.jsxs(Section, {
|
|
311
355
|
name: "Form Definition",
|
|
312
|
-
children: [jsxRuntime.jsx(Section.HeaderItem, {
|
|
356
|
+
children: [displayActions && jsxRuntime.jsx(Section.HeaderItem, {
|
|
313
357
|
children: jsxRuntime.jsx("button", {
|
|
314
358
|
class: "fjs-pgl-button",
|
|
315
359
|
title: "Download form definition",
|
|
316
360
|
onClick: handleDownload,
|
|
317
361
|
children: "Download"
|
|
318
362
|
})
|
|
319
|
-
}), jsxRuntime.jsx(Section.HeaderItem, {
|
|
363
|
+
}), displayActions && jsxRuntime.jsx(Section.HeaderItem, {
|
|
320
364
|
children: jsxRuntime.jsx("button", {
|
|
321
365
|
class: "fjs-pgl-button",
|
|
322
366
|
onClick: showEmbedModal,
|
|
@@ -345,15 +389,23 @@ function PlaygroundRoot(props) {
|
|
|
345
389
|
class: "fjs-pgl-text-container"
|
|
346
390
|
})
|
|
347
391
|
})]
|
|
392
|
+
}), jsxRuntime.jsx("div", {
|
|
393
|
+
class: "fjs-pgl-properties-container",
|
|
394
|
+
ref: propertiesPanelContainerRef
|
|
348
395
|
})]
|
|
349
396
|
});
|
|
397
|
+
} // helpers ///////////////
|
|
398
|
+
|
|
399
|
+
function toJSON(obj) {
|
|
400
|
+
return JSON.stringify(obj, null, ' ');
|
|
350
401
|
}
|
|
351
402
|
|
|
352
403
|
function Playground(options) {
|
|
353
404
|
const {
|
|
354
405
|
container: parent,
|
|
355
406
|
schema,
|
|
356
|
-
data
|
|
407
|
+
data,
|
|
408
|
+
...rest
|
|
357
409
|
} = options;
|
|
358
410
|
const emitter = mitt__default['default']();
|
|
359
411
|
let state = {
|
|
@@ -363,7 +415,11 @@ function Playground(options) {
|
|
|
363
415
|
let ref;
|
|
364
416
|
const container = document.createElement('div');
|
|
365
417
|
container.classList.add('fjs-pgl-parent');
|
|
366
|
-
|
|
418
|
+
|
|
419
|
+
if (parent) {
|
|
420
|
+
parent.appendChild(container);
|
|
421
|
+
}
|
|
422
|
+
|
|
367
423
|
const handleDrop = fileDrop__default['default']('Drop a form file', function (files) {
|
|
368
424
|
const file = files[0];
|
|
369
425
|
|
|
@@ -374,12 +430,25 @@ function Playground(options) {
|
|
|
374
430
|
}
|
|
375
431
|
}
|
|
376
432
|
});
|
|
433
|
+
|
|
434
|
+
const withRef = function (fn) {
|
|
435
|
+
return function (...args) {
|
|
436
|
+
if (!ref) {
|
|
437
|
+
throw new Error('Playground is not initialized.');
|
|
438
|
+
}
|
|
439
|
+
|
|
440
|
+
fn(...args);
|
|
441
|
+
};
|
|
442
|
+
};
|
|
443
|
+
|
|
377
444
|
container.addEventListener('dragover', handleDrop);
|
|
378
445
|
preact.render(jsxRuntime.jsx(PlaygroundRoot, {
|
|
379
446
|
schema: schema,
|
|
380
447
|
data: data,
|
|
381
448
|
onStateChanged: _state => state = _state,
|
|
382
|
-
onInit: _ref => ref = _ref
|
|
449
|
+
onInit: _ref => ref = _ref,
|
|
450
|
+
emit: emitter.emit,
|
|
451
|
+
...rest
|
|
383
452
|
}), container);
|
|
384
453
|
this.on = emitter.on;
|
|
385
454
|
this.off = emitter.off;
|
|
@@ -399,13 +468,32 @@ function Playground(options) {
|
|
|
399
468
|
return ref.setSchema(schema);
|
|
400
469
|
};
|
|
401
470
|
|
|
471
|
+
this.get = function (name, strict) {
|
|
472
|
+
return ref.get(name, strict);
|
|
473
|
+
};
|
|
474
|
+
|
|
402
475
|
this.destroy = function () {
|
|
403
476
|
this.emit('destroy');
|
|
404
477
|
};
|
|
405
|
-
}
|
|
406
478
|
|
|
407
|
-
function
|
|
408
|
-
|
|
479
|
+
this.attachEditorContainer = withRef(function (node) {
|
|
480
|
+
return ref.attachEditorContainer(node);
|
|
481
|
+
});
|
|
482
|
+
this.attachPreviewContainer = withRef(function (node) {
|
|
483
|
+
return ref.attachFormContainer(node);
|
|
484
|
+
});
|
|
485
|
+
this.attachDataContainer = withRef(function (node) {
|
|
486
|
+
return ref.attachDataContainer(node);
|
|
487
|
+
});
|
|
488
|
+
this.attachResultContainer = withRef(function (node) {
|
|
489
|
+
return ref.attachResultContainer(node);
|
|
490
|
+
});
|
|
491
|
+
this.attachPaletteContainer = withRef(function (node) {
|
|
492
|
+
return ref.attachPaletteContainer(node);
|
|
493
|
+
});
|
|
494
|
+
this.attachPropertiesPanelContainer = withRef(function (node) {
|
|
495
|
+
return ref.attachPropertiesPanelContainer(node);
|
|
496
|
+
});
|
|
409
497
|
}
|
|
410
498
|
|
|
411
499
|
exports.Playground = Playground;
|
package/dist/index.cjs.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.cjs","sources":["../src/JSONView.js","../src/Playground.js"],"sourcesContent":["import mitt from 'mitt';\n\nimport { basicSetup, EditorView } from '@codemirror/basic-setup';\nimport { EditorState, Compartment } from '@codemirror/state';\nimport { json } from '@codemirror/lang-json';\n\n\nexport default function JSONEditor(options = {}) {\n\n const emitter = mitt();\n\n const {\n readonly = false\n } = options;\n\n let language = new Compartment().of(json());\n let tabSize = new Compartment().of(EditorState.tabSize.of(2));\n\n function createState(doc, extensions=[]) {\n return EditorState.create({\n doc,\n extensions: [\n basicSetup,\n language,\n tabSize,\n ...extensions\n ]\n });\n }\n\n function createView(readonly) {\n\n const updateListener = EditorView.updateListener.of(update => {\n if (update.docChanged) {\n emitter.emit('changed', {\n value: update.view.state.doc.toString()\n });\n }\n });\n\n const editable = EditorView.editable.of(!readonly);\n\n const view = new EditorView({\n state: createState('', [ updateListener, editable ])\n });\n\n view.setValue = function(value) {\n this.setState(createState(value, [ updateListener, editable ]));\n };\n\n return view;\n }\n\n const view = createView(readonly);\n\n this.setValue = function(value) {\n view.setValue(value);\n };\n\n this.getValue = function() {\n return view.state.doc.toString();\n };\n\n this.on = emitter.on;\n this.off = emitter.off;\n\n this.attachTo = function(container) {\n container.appendChild(view.dom);\n };\n\n this.destroy = function() {\n if (view.dom.parentNode) {\n view.dom.parentNode.removeChild(view.dom);\n }\n\n view.destroy();\n };\n}\n","import JSONView from './JSONView';\n\nimport { render } from 'preact';\n\nimport { useRef, useEffect, useState, useCallback } from 'preact/hooks';\n\nimport fileDrop from 'file-drops';\n\nimport mitt from 'mitt';\n\nimport download from 'downloadjs';\n\nimport {\n Form,\n FormEditor\n} from '@bpmn-io/form-js';\n\nimport './FileDrop.css';\nimport './Playground.css';\n\n\nfunction Modal(props) {\n\n useEffect(() => {\n function handleKey(event) {\n\n if (event.key === 'Escape') {\n event.stopPropagation();\n\n props.onClose();\n }\n }\n\n document.addEventListener('keydown', handleKey);\n\n return () => {\n document.removeEventListener('keydown', handleKey);\n };\n });\n\n return (\n <div class=\"fjs-pgl-modal\">\n <div class=\"fjs-pgl-modal-backdrop\" onClick={ props.onClose }></div>\n <div class=\"fjs-pgl-modal-content\">\n <h1 class=\"fjs-pgl-modal-header\">{ props.name }</h1>\n <div class=\"fjs-pgl-modal-body\">\n { props.children }\n </div>\n <div class=\"fjs-pgl-modal-footer\">\n <button class=\"fjs-pgl-button fjs-pgl-button-default\" onClick={ props.onClose }>Close</button>\n </div>\n </div>\n </div>\n );\n}\n\nfunction Section(props) {\n\n const elements =\n Array.isArray(props.children)\n ? props.children :\n [ props.children ];\n\n const {\n headerItems,\n children\n } = elements.reduce((_, child) => {\n const bucket =\n child.type === Section.HeaderItem\n ? _.headerItems\n : _.children;\n\n bucket.push(child);\n\n return _;\n }, { headerItems: [], children: [] });\n\n return (\n <div class=\"fjs-pgl-section\">\n <h1 class=\"header\">{ props.name } { headerItems.length ? <span class=\"header-items\">{ headerItems }</span> : null }</h1>\n <div class=\"body\">\n { children }\n </div>\n </div>\n );\n}\n\nSection.HeaderItem = function(props) {\n return props.children;\n};\n\nfunction serializeValue(obj) {\n return JSON.stringify(JSON.stringify(obj)).replace(/</g, '<').replace(/>/g, '>');\n}\n\nfunction EmbedModal(props) {\n\n const schema = serializeValue(props.schema);\n const data = serializeValue(props.data || {});\n\n const fieldRef = useRef();\n\n const snippet = `<!-- styles needed for rendering -->\n<link rel=\"stylesheet\" href=\"https://unpkg.com/@bpmn-io/form-js@0.2.4/dist/assets/form-js.css\">\n\n<!-- container to render the form into -->\n<div class=\"fjs-pgl-form-container\"></div>\n\n<!-- scripts needed for embedding -->\n<script src=\"https://unpkg.com/@bpmn-io/form-js@0.2.4/dist/form-viewer.umd.js\"></script>\n\n<!-- actual script to instantiate the form and load form schema + data -->\n<script>\n const data = JSON.parse(${data});\n const schema = JSON.parse(${schema});\n\n const form = new FormViewer.Form({\n container: document.querySelector(\".fjs-pgl-form-container\")\n });\n\n form.on(\"submit\", (event) => {\n console.log(event.data, event.errors);\n });\n\n form.importSchema(schema, data).catch(err => {\n console.error(\"Failed to render form\", err);\n });\n</script>\n `.trim();\n\n useEffect(() => {\n fieldRef.current.select();\n });\n\n return (\n <Modal name=\"Embed form\" onClose={ props.onClose }>\n <p>Use the following HTML snippet to embed your form with <a href=\"https://github.com/bpmn-io/form-js\">form-js</a>:</p>\n\n <textarea spellCheck=\"false\" ref={ fieldRef }>{snippet}</textarea>\n </Modal>\n );\n}\n\nfunction PlaygroundRoot(props) {\n\n const editorContainerRef = useRef();\n const formContainerRef = useRef();\n const dataContainerRef = useRef();\n const resultContainerRef = useRef();\n\n const formEditorRef = useRef();\n const formRef = useRef();\n const dataEditorRef = useRef();\n const resultViewRef = useRef();\n\n const [ showEmbed, setShowEmbed ] = useState(false);\n\n const [ initialData ] = useState(props.data || {});\n const [ initialSchema, setInitialSchema ] = useState(props.schema);\n\n const [ data, setData ] = useState(props.data || {});\n const [ schema, setSchema ] = useState(props.schema);\n\n const [ resultData, setResultData ] = useState(props.data || {});\n\n useEffect(() => {\n props.onInit({\n setSchema: setInitialSchema\n });\n });\n\n useEffect(() => {\n setInitialSchema(props.schema || {});\n }, [ props.schema ]);\n\n useEffect(() => {\n const dataEditor = dataEditorRef.current = new JSONView({\n value: toJSON(data)\n });\n\n const resultView = resultViewRef.current = new JSONView({\n readonly: true,\n value: toJSON(resultData)\n });\n\n const form = formRef.current = new Form();\n const formEditor = formEditorRef.current = new FormEditor({\n renderer: {\n compact: true\n }\n });\n\n formEditor.on('changed', () => {\n setSchema(formEditor.getSchema());\n });\n\n form.on('changed', event => {\n setResultData(event.data);\n });\n\n dataEditor.on('changed', event => {\n try {\n setData(JSON.parse(event.value));\n } catch (err) {\n\n // TODO(nikku): indicate JSON parse error\n }\n });\n\n const formContainer = formContainerRef.current;\n const editorContainer = editorContainerRef.current;\n const dataContainer = dataContainerRef.current;\n const resultContainer = resultContainerRef.current;\n\n dataEditor.attachTo(dataContainer);\n resultView.attachTo(resultContainer);\n form.attachTo(formContainer);\n formEditor.attachTo(editorContainer);\n\n return () => {\n dataEditor.destroy();\n resultView.destroy();\n form.destroy();\n formEditor.destroy();\n };\n }, []);\n\n useEffect(() => {\n dataEditorRef.current.setValue(toJSON(initialData));\n }, [ initialData ]);\n\n useEffect(() => {\n formEditorRef.current.importSchema(initialSchema);\n }, [ initialSchema ]);\n\n useEffect(() => {\n formRef.current.importSchema(schema, data);\n }, [ schema, data ]);\n\n useEffect(() => {\n resultViewRef.current.setValue(toJSON(resultData));\n }, [ resultData ]);\n\n useEffect(() => {\n props.onStateChanged({\n schema,\n data\n });\n }, [ schema, data ]);\n\n const handleDownload = useCallback(() => {\n\n download(JSON.stringify(schema, null, ' '), 'form.json', 'text/json');\n }, [ schema ]);\n\n const hideEmbedModal = useCallback(() => {\n setShowEmbed(false);\n }, []);\n\n const showEmbedModal = useCallback(() => {\n setShowEmbed(true);\n }, []);\n\n return (\n <div class=\"fjs-pgl-root\">\n <div class=\"fjs-pgl-modals\">\n { showEmbed ? <EmbedModal schema={ schema } data={ data } onClose={ hideEmbedModal } /> : null }\n </div>\n <div class=\"fjs-pgl-main\">\n\n <Section name=\"Form Definition\">\n <Section.HeaderItem>\n <button\n class=\"fjs-pgl-button\"\n title=\"Download form definition\"\n onClick={ handleDownload }\n >Download</button>\n </Section.HeaderItem>\n <Section.HeaderItem>\n <button\n class=\"fjs-pgl-button\"\n onClick={ showEmbedModal }\n >Embed</button>\n </Section.HeaderItem>\n <div ref={ editorContainerRef } class=\"fjs-pgl-form-container\"></div>\n </Section>\n <Section name=\"Form Preview\">\n <div ref={ formContainerRef } class=\"fjs-pgl-form-container\"></div>\n </Section>\n <Section name=\"Form Data (Input)\">\n <div ref={ dataContainerRef } class=\"fjs-pgl-text-container\"></div>\n </Section>\n <Section name=\"Form Data (Submit)\">\n <div ref={ resultContainerRef } class=\"fjs-pgl-text-container\"></div>\n </Section>\n </div>\n </div>\n );\n}\n\n\nexport default function Playground(options) {\n\n const {\n container: parent,\n schema,\n data\n } = options;\n\n const emitter = mitt();\n\n let state = { data, schema };\n let ref;\n\n const container = document.createElement('div');\n\n container.classList.add('fjs-pgl-parent');\n\n parent.appendChild(container);\n\n const handleDrop = fileDrop('Drop a form file', function(files) {\n const file = files[0];\n\n if (file) {\n try {\n ref.setSchema(JSON.parse(file.contents));\n } catch (err) {\n\n // TODO(nikku): indicate JSON parse error\n }\n }\n });\n\n container.addEventListener('dragover', handleDrop);\n\n render(\n <PlaygroundRoot\n schema={ schema }\n data={ data }\n onStateChanged={ (_state) => state = _state }\n onInit={ _ref => ref = _ref }\n />,\n container\n );\n\n this.on = emitter.on;\n this.off = emitter.off;\n\n this.emit = emitter.emit;\n\n this.on('destroy', function() {\n render(null, container);\n });\n\n this.on('destroy', function() {\n parent.removeChild(container);\n });\n\n this.getState = function() {\n return state;\n };\n\n this.setSchema = function(schema) {\n return ref.setSchema(schema);\n };\n\n this.destroy = function() {\n this.emit('destroy');\n };\n}\n\n\nfunction toJSON(obj) {\n return JSON.stringify(obj, null, ' ');\n}"],"names":["JSONEditor","options","emitter","mitt","readonly","language","Compartment","of","json","tabSize","EditorState","createState","doc","extensions","create","basicSetup","createView","updateListener","EditorView","update","docChanged","emit","value","view","state","toString","editable","setValue","setState","getValue","on","off","attachTo","container","appendChild","dom","destroy","parentNode","removeChild","Modal","props","useEffect","handleKey","event","key","stopPropagation","onClose","document","addEventListener","removeEventListener","_jsxs","_jsx","name","children","Section","elements","Array","isArray","headerItems","reduce","_","child","bucket","type","HeaderItem","push","length","serializeValue","obj","JSON","stringify","replace","EmbedModal","schema","data","fieldRef","useRef","snippet","trim","current","select","PlaygroundRoot","editorContainerRef","formContainerRef","dataContainerRef","resultContainerRef","formEditorRef","formRef","dataEditorRef","resultViewRef","showEmbed","setShowEmbed","useState","initialData","initialSchema","setInitialSchema","setData","setSchema","resultData","setResultData","onInit","dataEditor","JSONView","toJSON","resultView","form","Form","formEditor","FormEditor","renderer","compact","getSchema","parse","err","formContainer","editorContainer","dataContainer","resultContainer","importSchema","onStateChanged","handleDownload","useCallback","download","hideEmbedModal","showEmbedModal","Playground","parent","ref","createElement","classList","add","handleDrop","fileDrop","files","file","contents","render","_state","_ref","getState"],"mappings":";;;;;;;;;;;;;;;;;;;;;AAOe,SAASA,UAAT,CAAoBC,OAAO,GAAG,EAA9B,EAAkC;AAE/C,QAAMC,OAAO,GAAGC,wBAAI,EAApB;AAEA,QAAM;AACJC,IAAAA,QAAQ,GAAG;AADP,MAEFH,OAFJ;AAIA,MAAII,QAAQ,GAAG,IAAIC,iBAAJ,GAAkBC,EAAlB,CAAqBC,aAAI,EAAzB,CAAf;AACA,MAAIC,OAAO,GAAG,IAAIH,iBAAJ,GAAkBC,EAAlB,CAAqBG,iBAAW,CAACD,OAAZ,CAAoBF,EAApB,CAAuB,CAAvB,CAArB,CAAd;;AAEA,WAASI,WAAT,CAAqBC,GAArB,EAA0BC,UAAU,GAAC,EAArC,EAAyC;AACvC,WAAOH,iBAAW,CAACI,MAAZ,CAAmB;AACxBF,MAAAA,GADwB;AAExBC,MAAAA,UAAU,EAAE,CACVE,qBADU,EAEVV,QAFU,EAGVI,OAHU,EAIV,GAAGI,UAJO;AAFY,KAAnB,CAAP;AASD;;AAED,WAASG,UAAT,CAAoBZ,QAApB,EAA8B;AAE5B,UAAMa,cAAc,GAAGC,qBAAU,CAACD,cAAX,CAA0BV,EAA1B,CAA6BY,MAAM,IAAI;AAC5D,UAAIA,MAAM,CAACC,UAAX,EAAuB;AACrBlB,QAAAA,OAAO,CAACmB,IAAR,CAAa,SAAb,EAAwB;AACtBC,UAAAA,KAAK,EAAEH,MAAM,CAACI,IAAP,CAAYC,KAAZ,CAAkBZ,GAAlB,CAAsBa,QAAtB;AADe,SAAxB;AAGD;AACF,KANsB,CAAvB;AAQA,UAAMC,QAAQ,GAAGR,qBAAU,CAACQ,QAAX,CAAoBnB,EAApB,CAAuB,CAACH,QAAxB,CAAjB;AAEA,UAAMmB,IAAI,GAAG,IAAIL,qBAAJ,CAAe;AAC1BM,MAAAA,KAAK,EAAEb,WAAW,CAAC,EAAD,EAAK,CAAEM,cAAF,EAAkBS,QAAlB,CAAL;AADQ,KAAf,CAAb;;AAIAH,IAAAA,IAAI,CAACI,QAAL,GAAgB,UAASL,KAAT,EAAgB;AAC9B,WAAKM,QAAL,CAAcjB,WAAW,CAACW,KAAD,EAAQ,CAAEL,cAAF,EAAkBS,QAAlB,CAAR,CAAzB;AACD,KAFD;;AAIA,WAAOH,IAAP;AACD;;AAED,QAAMA,IAAI,GAAGP,UAAU,CAACZ,QAAD,CAAvB;;AAEA,OAAKuB,QAAL,GAAgB,UAASL,KAAT,EAAgB;AAC9BC,IAAAA,IAAI,CAACI,QAAL,CAAcL,KAAd;AACD,GAFD;;AAIA,OAAKO,QAAL,GAAgB,YAAW;AACzB,WAAON,IAAI,CAACC,KAAL,CAAWZ,GAAX,CAAea,QAAf,EAAP;AACD,GAFD;;AAIA,OAAKK,EAAL,GAAU5B,OAAO,CAAC4B,EAAlB;AACA,OAAKC,GAAL,GAAW7B,OAAO,CAAC6B,GAAnB;;AAEA,OAAKC,QAAL,GAAgB,UAASC,SAAT,EAAoB;AAClCA,IAAAA,SAAS,CAACC,WAAV,CAAsBX,IAAI,CAACY,GAA3B;AACD,GAFD;;AAIA,OAAKC,OAAL,GAAe,YAAW;AACxB,QAAIb,IAAI,CAACY,GAAL,CAASE,UAAb,EAAyB;AACvBd,MAAAA,IAAI,CAACY,GAAL,CAASE,UAAT,CAAoBC,WAApB,CAAgCf,IAAI,CAACY,GAArC;AACD;;AAEDZ,IAAAA,IAAI,CAACa,OAAL;AACD,GAND;AAOD;;ACxDD,SAASG,KAAT,CAAeC,KAAf,EAAsB;AAEpBC,EAAAA,eAAS,CAAC,MAAM;AACd,aAASC,SAAT,CAAmBC,KAAnB,EAA0B;AAExB,UAAIA,KAAK,CAACC,GAAN,KAAc,QAAlB,EAA4B;AAC1BD,QAAAA,KAAK,CAACE,eAAN;AAEAL,QAAAA,KAAK,CAACM,OAAN;AACD;AACF;;AAEDC,IAAAA,QAAQ,CAACC,gBAAT,CAA0B,SAA1B,EAAqCN,SAArC;AAEA,WAAO,MAAM;AACXK,MAAAA,QAAQ,CAACE,mBAAT,CAA6B,SAA7B,EAAwCP,SAAxC;AACD,KAFD;AAGD,GAfQ,CAAT;AAiBA,SACEQ;AAAK,IAAA,KAAK,EAAC,eAAX;AAAA,eACEC;AAAK,MAAA,KAAK,EAAC,wBAAX;AAAoC,MAAA,OAAO,EAAGX,KAAK,CAACM;AAApD,MADF,EAEEI;AAAK,MAAA,KAAK,EAAC,uBAAX;AAAA,iBACEC;AAAI,QAAA,KAAK,EAAC,sBAAV;AAAA,kBAAmCX,KAAK,CAACY;AAAzC,QADF,EAEED;AAAK,QAAA,KAAK,EAAC,oBAAX;AAAA,kBACIX,KAAK,CAACa;AADV,QAFF,EAKEF;AAAK,QAAA,KAAK,EAAC,sBAAX;AAAA,kBACEA;AAAQ,UAAA,KAAK,EAAC,uCAAd;AAAsD,UAAA,OAAO,EAAGX,KAAK,CAACM,OAAtE;AAAA;AAAA;AADF,QALF;AAAA,MAFF;AAAA,IADF;AAcD;;AAED,SAASQ,OAAT,CAAiBd,KAAjB,EAAwB;AAEtB,QAAMe,QAAQ,GACZC,KAAK,CAACC,OAAN,CAAcjB,KAAK,CAACa,QAApB,IACIb,KAAK,CAACa,QADV,GAEE,CAAEb,KAAK,CAACa,QAAR,CAHJ;AAKA,QAAM;AACJK,IAAAA,WADI;AAEJL,IAAAA;AAFI,MAGFE,QAAQ,CAACI,MAAT,CAAgB,CAACC,CAAD,EAAIC,KAAJ,KAAc;AAChC,UAAMC,MAAM,GACVD,KAAK,CAACE,IAAN,KAAeT,OAAO,CAACU,UAAvB,GACIJ,CAAC,CAACF,WADN,GAEIE,CAAC,CAACP,QAHR;AAKAS,IAAAA,MAAM,CAACG,IAAP,CAAYJ,KAAZ;AAEA,WAAOD,CAAP;AACD,GATG,EASD;AAAEF,IAAAA,WAAW,EAAE,EAAf;AAAmBL,IAAAA,QAAQ,EAAE;AAA7B,GATC,CAHJ;AAcA,SACEH;AAAK,IAAA,KAAK,EAAC,iBAAX;AAAA,eACEA;AAAI,MAAA,KAAK,EAAC,QAAV;AAAA,iBAAqBV,KAAK,CAACY,IAA3B,OAAoCM,WAAW,CAACQ,MAAZ,GAAqBf;AAAM,QAAA,KAAK,EAAC,cAAZ;AAAA,kBAA6BO;AAA7B,QAArB,GAAyE,IAA7G;AAAA,MADF,EAEEP;AAAK,MAAA,KAAK,EAAC,MAAX;AAAA,gBACIE;AADJ,MAFF;AAAA,IADF;AAQD;;AAEDC,OAAO,CAACU,UAAR,GAAqB,UAASxB,KAAT,EAAgB;AACnC,SAAOA,KAAK,CAACa,QAAb;AACD,CAFD;;AAIA,SAASc,cAAT,CAAwBC,GAAxB,EAA6B;AAC3B,SAAOC,IAAI,CAACC,SAAL,CAAeD,IAAI,CAACC,SAAL,CAAeF,GAAf,CAAf,EAAoCG,OAApC,CAA4C,IAA5C,EAAkD,MAAlD,EAA0DA,OAA1D,CAAkE,IAAlE,EAAwE,MAAxE,CAAP;AACD;;AAED,SAASC,UAAT,CAAoBhC,KAApB,EAA2B;AAEzB,QAAMiC,MAAM,GAAGN,cAAc,CAAC3B,KAAK,CAACiC,MAAP,CAA7B;AACA,QAAMC,IAAI,GAAGP,cAAc,CAAC3B,KAAK,CAACkC,IAAN,IAAc,EAAf,CAA3B;AAEA,QAAMC,QAAQ,GAAGC,YAAM,EAAvB;AAEA,QAAMC,OAAO,GAAI;AACnB;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,4BAA4BH,IAAK;AACjC,8BAA8BD,MAAO;AACrC;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,GA1BkB,CA0BdK,IA1Bc,EAAhB;AA4BArC,EAAAA,eAAS,CAAC,MAAM;AACdkC,IAAAA,QAAQ,CAACI,OAAT,CAAiBC,MAAjB;AACD,GAFQ,CAAT;AAIA,SACE9B,gBAAC,KAAD;AAAO,IAAA,IAAI,EAAC,YAAZ;AAAyB,IAAA,OAAO,EAAGV,KAAK,CAACM,OAAzC;AAAA,eACEI;AAAA,4EAA0DC;AAAG,QAAA,IAAI,EAAC,oCAAR;AAAA;AAAA,QAA1D;AAAA,MADF,EAGEA;AAAU,MAAA,UAAU,EAAC,OAArB;AAA6B,MAAA,GAAG,EAAGwB,QAAnC;AAAA,gBAA+CE;AAA/C,MAHF;AAAA,IADF;AAOD;;AAED,SAASI,cAAT,CAAwBzC,KAAxB,EAA+B;AAE7B,QAAM0C,kBAAkB,GAAGN,YAAM,EAAjC;AACA,QAAMO,gBAAgB,GAAGP,YAAM,EAA/B;AACA,QAAMQ,gBAAgB,GAAGR,YAAM,EAA/B;AACA,QAAMS,kBAAkB,GAAGT,YAAM,EAAjC;AAEA,QAAMU,aAAa,GAAGV,YAAM,EAA5B;AACA,QAAMW,OAAO,GAAGX,YAAM,EAAtB;AACA,QAAMY,aAAa,GAAGZ,YAAM,EAA5B;AACA,QAAMa,aAAa,GAAGb,YAAM,EAA5B;AAEA,QAAM,CAAEc,SAAF,EAAaC,YAAb,IAA8BC,cAAQ,CAAC,KAAD,CAA5C;AAEA,QAAM,CAAEC,WAAF,IAAkBD,cAAQ,CAACpD,KAAK,CAACkC,IAAN,IAAc,EAAf,CAAhC;AACA,QAAM,CAAEoB,aAAF,EAAiBC,gBAAjB,IAAsCH,cAAQ,CAACpD,KAAK,CAACiC,MAAP,CAApD;AAEA,QAAM,CAAEC,IAAF,EAAQsB,OAAR,IAAoBJ,cAAQ,CAACpD,KAAK,CAACkC,IAAN,IAAc,EAAf,CAAlC;AACA,QAAM,CAAED,MAAF,EAAUwB,SAAV,IAAwBL,cAAQ,CAACpD,KAAK,CAACiC,MAAP,CAAtC;AAEA,QAAM,CAAEyB,UAAF,EAAcC,aAAd,IAAgCP,cAAQ,CAACpD,KAAK,CAACkC,IAAN,IAAc,EAAf,CAA9C;AAEAjC,EAAAA,eAAS,CAAC,MAAM;AACdD,IAAAA,KAAK,CAAC4D,MAAN,CAAa;AACXH,MAAAA,SAAS,EAAEF;AADA,KAAb;AAGD,GAJQ,CAAT;AAMAtD,EAAAA,eAAS,CAAC,MAAM;AACdsD,IAAAA,gBAAgB,CAACvD,KAAK,CAACiC,MAAN,IAAgB,EAAjB,CAAhB;AACD,GAFQ,EAEN,CAAEjC,KAAK,CAACiC,MAAR,CAFM,CAAT;AAIAhC,EAAAA,eAAS,CAAC,MAAM;AACd,UAAM4D,UAAU,GAAGb,aAAa,CAACT,OAAd,GAAwB,IAAIuB,UAAJ,CAAa;AACtDhF,MAAAA,KAAK,EAAEiF,MAAM,CAAC7B,IAAD;AADyC,KAAb,CAA3C;AAIA,UAAM8B,UAAU,GAAGf,aAAa,CAACV,OAAd,GAAwB,IAAIuB,UAAJ,CAAa;AACtDlG,MAAAA,QAAQ,EAAE,IAD4C;AAEtDkB,MAAAA,KAAK,EAAEiF,MAAM,CAACL,UAAD;AAFyC,KAAb,CAA3C;AAKA,UAAMO,IAAI,GAAGlB,OAAO,CAACR,OAAR,GAAkB,IAAI2B,WAAJ,EAA/B;AACA,UAAMC,UAAU,GAAGrB,aAAa,CAACP,OAAd,GAAwB,IAAI6B,iBAAJ,CAAe;AACxDC,MAAAA,QAAQ,EAAE;AACRC,QAAAA,OAAO,EAAE;AADD;AAD8C,KAAf,CAA3C;AAMAH,IAAAA,UAAU,CAAC7E,EAAX,CAAc,SAAd,EAAyB,MAAM;AAC7BmE,MAAAA,SAAS,CAACU,UAAU,CAACI,SAAX,EAAD,CAAT;AACD,KAFD;AAIAN,IAAAA,IAAI,CAAC3E,EAAL,CAAQ,SAAR,EAAmBa,KAAK,IAAI;AAC1BwD,MAAAA,aAAa,CAACxD,KAAK,CAAC+B,IAAP,CAAb;AACD,KAFD;AAIA2B,IAAAA,UAAU,CAACvE,EAAX,CAAc,SAAd,EAAyBa,KAAK,IAAI;AAChC,UAAI;AACFqD,QAAAA,OAAO,CAAC3B,IAAI,CAAC2C,KAAL,CAAWrE,KAAK,CAACrB,KAAjB,CAAD,CAAP;AACD,OAFD,CAEE,OAAO2F,GAAP,EAAY;AAGb;AACF,KAPD;AASA,UAAMC,aAAa,GAAG/B,gBAAgB,CAACJ,OAAvC;AACA,UAAMoC,eAAe,GAAGjC,kBAAkB,CAACH,OAA3C;AACA,UAAMqC,aAAa,GAAGhC,gBAAgB,CAACL,OAAvC;AACA,UAAMsC,eAAe,GAAGhC,kBAAkB,CAACN,OAA3C;AAEAsB,IAAAA,UAAU,CAACrE,QAAX,CAAoBoF,aAApB;AACAZ,IAAAA,UAAU,CAACxE,QAAX,CAAoBqF,eAApB;AACAZ,IAAAA,IAAI,CAACzE,QAAL,CAAckF,aAAd;AACAP,IAAAA,UAAU,CAAC3E,QAAX,CAAoBmF,eAApB;AAEA,WAAO,MAAM;AACXd,MAAAA,UAAU,CAACjE,OAAX;AACAoE,MAAAA,UAAU,CAACpE,OAAX;AACAqE,MAAAA,IAAI,CAACrE,OAAL;AACAuE,MAAAA,UAAU,CAACvE,OAAX;AACD,KALD;AAMD,GAlDQ,EAkDN,EAlDM,CAAT;AAoDAK,EAAAA,eAAS,CAAC,MAAM;AACd+C,IAAAA,aAAa,CAACT,OAAd,CAAsBpD,QAAtB,CAA+B4E,MAAM,CAACV,WAAD,CAArC;AACD,GAFQ,EAEN,CAAEA,WAAF,CAFM,CAAT;AAIApD,EAAAA,eAAS,CAAC,MAAM;AACd6C,IAAAA,aAAa,CAACP,OAAd,CAAsBuC,YAAtB,CAAmCxB,aAAnC;AACD,GAFQ,EAEN,CAAEA,aAAF,CAFM,CAAT;AAIArD,EAAAA,eAAS,CAAC,MAAM;AACd8C,IAAAA,OAAO,CAACR,OAAR,CAAgBuC,YAAhB,CAA6B7C,MAA7B,EAAqCC,IAArC;AACD,GAFQ,EAEN,CAAED,MAAF,EAAUC,IAAV,CAFM,CAAT;AAIAjC,EAAAA,eAAS,CAAC,MAAM;AACdgD,IAAAA,aAAa,CAACV,OAAd,CAAsBpD,QAAtB,CAA+B4E,MAAM,CAACL,UAAD,CAArC;AACD,GAFQ,EAEN,CAAEA,UAAF,CAFM,CAAT;AAIAzD,EAAAA,eAAS,CAAC,MAAM;AACdD,IAAAA,KAAK,CAAC+E,cAAN,CAAqB;AACnB9C,MAAAA,MADmB;AAEnBC,MAAAA;AAFmB,KAArB;AAID,GALQ,EAKN,CAAED,MAAF,EAAUC,IAAV,CALM,CAAT;AAOA,QAAM8C,cAAc,GAAGC,iBAAW,CAAC,MAAM;AAEvCC,IAAAA,4BAAQ,CAACrD,IAAI,CAACC,SAAL,CAAeG,MAAf,EAAuB,IAAvB,EAA6B,IAA7B,CAAD,EAAqC,WAArC,EAAkD,WAAlD,CAAR;AACD,GAHiC,EAG/B,CAAEA,MAAF,CAH+B,CAAlC;AAKA,QAAMkD,cAAc,GAAGF,iBAAW,CAAC,MAAM;AACvC9B,IAAAA,YAAY,CAAC,KAAD,CAAZ;AACD,GAFiC,EAE/B,EAF+B,CAAlC;AAIA,QAAMiC,cAAc,GAAGH,iBAAW,CAAC,MAAM;AACvC9B,IAAAA,YAAY,CAAC,IAAD,CAAZ;AACD,GAFiC,EAE/B,EAF+B,CAAlC;AAIA,SACEzC;AAAK,IAAA,KAAK,EAAC,cAAX;AAAA,eACEC;AAAK,MAAA,KAAK,EAAC,gBAAX;AAAA,gBACIuC,SAAS,GAAGvC,eAAC,UAAD;AAAY,QAAA,MAAM,EAAGsB,MAArB;AAA8B,QAAA,IAAI,EAAGC,IAArC;AAA4C,QAAA,OAAO,EAAGiD;AAAtD,QAAH,GAA+E;AAD5F,MADF,EAIEzE;AAAK,MAAA,KAAK,EAAC,cAAX;AAAA,iBAEEA,gBAAC,OAAD;AAAS,QAAA,IAAI,EAAC,iBAAd;AAAA,mBACEC,eAAC,OAAD,CAAS,UAAT;AAAA,oBACEA;AACE,YAAA,KAAK,EAAC,gBADR;AAEE,YAAA,KAAK,EAAC,0BAFR;AAGE,YAAA,OAAO,EAAGqE,cAHZ;AAAA;AAAA;AADF,UADF,EAQErE,eAAC,OAAD,CAAS,UAAT;AAAA,oBACEA;AACE,YAAA,KAAK,EAAC,gBADR;AAEE,YAAA,OAAO,EAAGyE,cAFZ;AAAA;AAAA;AADF,UARF,EAcEzE;AAAK,UAAA,GAAG,EAAG+B,kBAAX;AAAgC,UAAA,KAAK,EAAC;AAAtC,UAdF;AAAA,QAFF,EAkBE/B,eAAC,OAAD;AAAS,QAAA,IAAI,EAAC,cAAd;AAAA,kBACEA;AAAK,UAAA,GAAG,EAAGgC,gBAAX;AAA8B,UAAA,KAAK,EAAC;AAApC;AADF,QAlBF,EAqBEhC,eAAC,OAAD;AAAS,QAAA,IAAI,EAAC,mBAAd;AAAA,kBACEA;AAAK,UAAA,GAAG,EAAGiC,gBAAX;AAA8B,UAAA,KAAK,EAAC;AAApC;AADF,QArBF,EAwBEjC,eAAC,OAAD;AAAS,QAAA,IAAI,EAAC,oBAAd;AAAA,kBACEA;AAAK,UAAA,GAAG,EAAGkC,kBAAX;AAAgC,UAAA,KAAK,EAAC;AAAtC;AADF,QAxBF;AAAA,MAJF;AAAA,IADF;AAmCD;;AAGc,SAASwC,UAAT,CAAoB5H,OAApB,EAA6B;AAE1C,QAAM;AACJgC,IAAAA,SAAS,EAAE6F,MADP;AAEJrD,IAAAA,MAFI;AAGJC,IAAAA;AAHI,MAIFzE,OAJJ;AAMA,QAAMC,OAAO,GAAGC,wBAAI,EAApB;AAEA,MAAIqB,KAAK,GAAG;AAAEkD,IAAAA,IAAF;AAAQD,IAAAA;AAAR,GAAZ;AACA,MAAIsD,GAAJ;AAEA,QAAM9F,SAAS,GAAGc,QAAQ,CAACiF,aAAT,CAAuB,KAAvB,CAAlB;AAEA/F,EAAAA,SAAS,CAACgG,SAAV,CAAoBC,GAApB,CAAwB,gBAAxB;AAEAJ,EAAAA,MAAM,CAAC5F,WAAP,CAAmBD,SAAnB;AAEA,QAAMkG,UAAU,GAAGC,4BAAQ,CAAC,kBAAD,EAAqB,UAASC,KAAT,EAAgB;AAC9D,UAAMC,IAAI,GAAGD,KAAK,CAAC,CAAD,CAAlB;;AAEA,QAAIC,IAAJ,EAAU;AACR,UAAI;AACFP,QAAAA,GAAG,CAAC9B,SAAJ,CAAc5B,IAAI,CAAC2C,KAAL,CAAWsB,IAAI,CAACC,QAAhB,CAAd;AACD,OAFD,CAEE,OAAOtB,GAAP,EAAY;AAGb;AACF;AACF,GAX0B,CAA3B;AAaAhF,EAAAA,SAAS,CAACe,gBAAV,CAA2B,UAA3B,EAAuCmF,UAAvC;AAEAK,EAAAA,aAAM,CACJrF,eAAC,cAAD;AACE,IAAA,MAAM,EAAGsB,MADX;AAEE,IAAA,IAAI,EAAGC,IAFT;AAGE,IAAA,cAAc,EAAI+D,MAAD,IAAYjH,KAAK,GAAGiH,MAHvC;AAIE,IAAA,MAAM,EAAGC,IAAI,IAAIX,GAAG,GAAGW;AAJzB,IADI,EAOJzG,SAPI,CAAN;AAUA,OAAKH,EAAL,GAAU5B,OAAO,CAAC4B,EAAlB;AACA,OAAKC,GAAL,GAAW7B,OAAO,CAAC6B,GAAnB;AAEA,OAAKV,IAAL,GAAYnB,OAAO,CAACmB,IAApB;AAEA,OAAKS,EAAL,CAAQ,SAAR,EAAmB,YAAW;AAC5B0G,IAAAA,aAAM,CAAC,IAAD,EAAOvG,SAAP,CAAN;AACD,GAFD;AAIA,OAAKH,EAAL,CAAQ,SAAR,EAAmB,YAAW;AAC5BgG,IAAAA,MAAM,CAACxF,WAAP,CAAmBL,SAAnB;AACD,GAFD;;AAIA,OAAK0G,QAAL,GAAgB,YAAW;AACzB,WAAOnH,KAAP;AACD,GAFD;;AAIA,OAAKyE,SAAL,GAAiB,UAASxB,MAAT,EAAiB;AAChC,WAAOsD,GAAG,CAAC9B,SAAJ,CAAcxB,MAAd,CAAP;AACD,GAFD;;AAIA,OAAKrC,OAAL,GAAe,YAAW;AACxB,SAAKf,IAAL,CAAU,SAAV;AACD,GAFD;AAGD;;AAGD,SAASkF,MAAT,CAAgBnC,GAAhB,EAAqB;AACnB,SAAOC,IAAI,CAACC,SAAL,CAAeF,GAAf,EAAoB,IAApB,EAA0B,IAA1B,CAAP;AACD;;;;"}
|
|
1
|
+
{"version":3,"file":"index.cjs","sources":["../src/components/Modal.js","../src/components/EmbedModal.js","../src/components/JSONEditor.js","../src/components/Section.js","../src/components/PlaygroundRoot.js","../src/Playground.js"],"sourcesContent":["import { useEffect } from 'preact/hooks';\r\n\r\nexport function Modal(props) {\r\n\r\n useEffect(() => {\r\n function handleKey(event) {\r\n\r\n if (event.key === 'Escape') {\r\n event.stopPropagation();\r\n\r\n props.onClose();\r\n }\r\n }\r\n\r\n document.addEventListener('keydown', handleKey);\r\n\r\n return () => {\r\n document.removeEventListener('keydown', handleKey);\r\n };\r\n });\r\n\r\n return (\r\n <div class=\"fjs-pgl-modal\">\r\n <div class=\"fjs-pgl-modal-backdrop\" onClick={ props.onClose }></div>\r\n <div class=\"fjs-pgl-modal-content\">\r\n <h1 class=\"fjs-pgl-modal-header\">{ props.name }</h1>\r\n <div class=\"fjs-pgl-modal-body\">\r\n { props.children }\r\n </div>\r\n <div class=\"fjs-pgl-modal-footer\">\r\n <button class=\"fjs-pgl-button fjs-pgl-button-default\" onClick={ props.onClose }>Close</button>\r\n </div>\r\n </div>\r\n </div>\r\n );\r\n}\r\n","import { useEffect, useRef } from 'preact/hooks';\r\n\r\nimport { Modal } from './Modal';\r\n\r\n\r\nexport function EmbedModal(props) {\r\n\r\n const schema = serializeValue(props.schema);\r\n const data = serializeValue(props.data || {});\r\n\r\n const fieldRef = useRef();\r\n\r\n const snippet = `<!-- styles needed for rendering -->\r\n<link rel=\"stylesheet\" href=\"https://unpkg.com/@bpmn-io/form-js@0.2.4/dist/assets/form-js.css\">\r\n\r\n<!-- container to render the form into -->\r\n<div class=\"fjs-pgl-form-container\"></div>\r\n\r\n<!-- scripts needed for embedding -->\r\n<script src=\"https://unpkg.com/@bpmn-io/form-js@0.2.4/dist/form-viewer.umd.js\"></script>\r\n\r\n<!-- actual script to instantiate the form and load form schema + data -->\r\n<script>\r\n const data = JSON.parse(${data});\r\n const schema = JSON.parse(${schema});\r\n\r\n const form = new FormViewer.Form({\r\n container: document.querySelector(\".fjs-pgl-form-container\")\r\n });\r\n\r\n form.on(\"submit\", (event) => {\r\n console.log(event.data, event.errors);\r\n });\r\n\r\n form.importSchema(schema, data).catch(err => {\r\n console.error(\"Failed to render form\", err);\r\n });\r\n</script>\r\n `.trim();\r\n\r\n useEffect(() => {\r\n fieldRef.current.select();\r\n });\r\n\r\n return (\r\n <Modal name=\"Embed form\" onClose={ props.onClose }>\r\n <p>Use the following HTML snippet to embed your form with <a href=\"https://github.com/bpmn-io/form-js\">form-js</a>:</p>\r\n\r\n <textarea spellCheck=\"false\" ref={ fieldRef }>{snippet}</textarea>\r\n </Modal>\r\n );\r\n}\r\n\r\n\r\n// helpers ///////////\r\n\r\nfunction serializeValue(obj) {\r\n return JSON.stringify(JSON.stringify(obj)).replace(/</g, '<').replace(/>/g, '>');\r\n}","import mitt from 'mitt';\r\n\r\nimport { basicSetup } from 'codemirror';\r\nimport { EditorView } from '@codemirror/view';\r\nimport { EditorState, Compartment } from '@codemirror/state';\r\nimport { json } from '@codemirror/lang-json';\r\n\r\n\r\nexport function JSONEditor(options = {}) {\r\n\r\n const emitter = mitt();\r\n\r\n const {\r\n readonly = false\r\n } = options;\r\n\r\n let language = new Compartment().of(json());\r\n let tabSize = new Compartment().of(EditorState.tabSize.of(2));\r\n\r\n function createState(doc, extensions = []) {\r\n return EditorState.create({\r\n doc,\r\n extensions: [\r\n basicSetup,\r\n language,\r\n tabSize,\r\n ...extensions\r\n ]\r\n });\r\n }\r\n\r\n function createView(readonly) {\r\n\r\n const updateListener = EditorView.updateListener.of(update => {\r\n if (update.docChanged) {\r\n emitter.emit('changed', {\r\n value: update.view.state.doc.toString()\r\n });\r\n }\r\n });\r\n\r\n const editable = EditorView.editable.of(!readonly);\r\n\r\n const view = new EditorView({\r\n state: createState('', [ updateListener, editable ])\r\n });\r\n\r\n view.setValue = function(value) {\r\n this.setState(createState(value, [ updateListener, editable ]));\r\n };\r\n\r\n return view;\r\n }\r\n\r\n const view = createView(readonly);\r\n\r\n this.setValue = function(value) {\r\n view.setValue(value);\r\n };\r\n\r\n this.getValue = function() {\r\n return view.state.doc.toString();\r\n };\r\n\r\n this.on = emitter.on;\r\n this.off = emitter.off;\r\n\r\n this.attachTo = function(container) {\r\n container.appendChild(view.dom);\r\n };\r\n\r\n this.destroy = function() {\r\n if (view.dom.parentNode) {\r\n view.dom.parentNode.removeChild(view.dom);\r\n }\r\n\r\n view.destroy();\r\n };\r\n}\r\n","export function Section(props) {\r\n\r\n const elements =\r\n Array.isArray(props.children)\r\n ? props.children :\r\n [ props.children ];\r\n\r\n const {\r\n headerItems,\r\n children\r\n } = elements.reduce((_, child) => {\r\n const bucket =\r\n child.type === Section.HeaderItem\r\n ? _.headerItems\r\n : _.children;\r\n\r\n bucket.push(child);\r\n\r\n return _;\r\n }, { headerItems: [], children: [] });\r\n\r\n return (\r\n <div class=\"fjs-pgl-section\">\r\n <h1 class=\"header\">{ props.name } { headerItems.length ? <span class=\"header-items\">{ headerItems }</span> : null }</h1>\r\n <div class=\"body\">\r\n { children }\r\n </div>\r\n </div>\r\n );\r\n}\r\n\r\nSection.HeaderItem = function(props) {\r\n return props.children;\r\n};","import { useRef, useEffect, useState, useCallback } from 'preact/hooks';\r\n\r\nimport download from 'downloadjs';\r\n\r\nimport classNames from 'classnames';\r\n\r\nimport {\r\n Form\r\n} from '@bpmn-io/form-js-viewer';\r\n\r\nimport {\r\n FormEditor\r\n} from '@bpmn-io/form-js-editor';\r\n\r\nimport { EmbedModal } from './EmbedModal';\r\nimport { JSONEditor } from './JSONEditor';\r\nimport { Section } from './Section';\r\n\r\n\r\nimport './FileDrop.css';\r\nimport './PlaygroundRoot.css';\r\n\r\n\r\nexport function PlaygroundRoot(props) {\r\n\r\n const {\r\n actions: actionsConfig = {},\r\n editor: editorConfig = {},\r\n emit\r\n } = props;\r\n\r\n const {\r\n display: displayActions = true\r\n } = actionsConfig;\r\n\r\n const {\r\n inlinePropertiesPanel = true\r\n } = editorConfig;\r\n\r\n const paletteContainerRef = useRef();\r\n const editorContainerRef = useRef();\r\n const formContainerRef = useRef();\r\n const dataContainerRef = useRef();\r\n const resultContainerRef = useRef();\r\n const propertiesPanelContainerRef = useRef();\r\n\r\n const paletteRef = useRef();\r\n const formEditorRef = useRef();\r\n const formRef = useRef();\r\n const dataEditorRef = useRef();\r\n const resultViewRef = useRef();\r\n const propertiesPanelRef = useRef();\r\n\r\n const [ showEmbed, setShowEmbed ] = useState(false);\r\n\r\n const [ initialData ] = useState(props.data || {});\r\n const [ initialSchema, setInitialSchema ] = useState(props.schema);\r\n\r\n const [ data, setData ] = useState(props.data || {});\r\n const [ schema, setSchema ] = useState(props.schema);\r\n\r\n const [ resultData, setResultData ] = useState(props.data || {});\r\n\r\n // pipe to playground API\r\n useEffect(() => {\r\n props.onInit({\r\n attachDataContainer: (node) => dataEditorRef.current.attachTo(node),\r\n attachEditorContainer: (node) => formEditorRef.current.attachTo(node),\r\n attachFormContainer: (node) => formRef.current.attachTo(node),\r\n attachPaletteContainer: (node) => paletteRef.current.attachTo(node),\r\n attachPropertiesPanelContainer: (node) => propertiesPanelRef.current.attachTo(node),\r\n attachResultContainer: (node) => resultViewRef.current.attachTo(node),\r\n get: (name, strict) => formEditorRef.current.get(name, strict),\r\n setSchema: setInitialSchema\r\n });\r\n });\r\n\r\n useEffect(() => {\r\n setInitialSchema(props.schema || {});\r\n }, [ props.schema ]);\r\n\r\n useEffect(() => {\r\n const dataEditor = dataEditorRef.current = new JSONEditor({\r\n value: toJSON(data)\r\n });\r\n\r\n const resultView = resultViewRef.current = new JSONEditor({\r\n readonly: true,\r\n value: toJSON(resultData)\r\n });\r\n\r\n const form = formRef.current = new Form();\r\n const formEditor = formEditorRef.current = new FormEditor({\r\n renderer: {\r\n compact: true\r\n },\r\n palette: {\r\n parent: paletteContainerRef.current\r\n },\r\n propertiesPanel: {\r\n parent: !inlinePropertiesPanel && propertiesPanelContainerRef.current\r\n }\r\n });\r\n\r\n paletteRef.current = formEditor.get('palette');\r\n propertiesPanelRef.current = formEditor.get('propertiesPanel');\r\n\r\n formEditor.on('changed', () => {\r\n setSchema(formEditor.getSchema());\r\n });\r\n\r\n formEditor.on('formEditor.rendered', () => {\r\n\r\n // notifiy interested parties after render\r\n emit('formPlayground.rendered');\r\n });\r\n\r\n form.on('changed', event => {\r\n setResultData(event.data);\r\n });\r\n\r\n dataEditor.on('changed', event => {\r\n try {\r\n setData(JSON.parse(event.value));\r\n } catch (err) {\r\n\r\n // TODO(nikku): indicate JSON parse error\r\n }\r\n });\r\n\r\n const formContainer = formContainerRef.current;\r\n const editorContainer = editorContainerRef.current;\r\n const dataContainer = dataContainerRef.current;\r\n const resultContainer = resultContainerRef.current;\r\n\r\n dataEditor.attachTo(dataContainer);\r\n resultView.attachTo(resultContainer);\r\n form.attachTo(formContainer);\r\n formEditor.attachTo(editorContainer);\r\n\r\n return () => {\r\n dataEditor.destroy();\r\n resultView.destroy();\r\n form.destroy();\r\n formEditor.destroy();\r\n };\r\n }, []);\r\n\r\n useEffect(() => {\r\n dataEditorRef.current.setValue(toJSON(initialData));\r\n }, [ initialData ]);\r\n\r\n useEffect(() => {\r\n formEditorRef.current.importSchema(initialSchema);\r\n }, [ initialSchema ]);\r\n\r\n useEffect(() => {\r\n formRef.current.importSchema(schema, data);\r\n }, [ schema, data ]);\r\n\r\n useEffect(() => {\r\n resultViewRef.current.setValue(toJSON(resultData));\r\n }, [ resultData ]);\r\n\r\n useEffect(() => {\r\n props.onStateChanged({\r\n schema,\r\n data\r\n });\r\n }, [ schema, data ]);\r\n\r\n const handleDownload = useCallback(() => {\r\n\r\n download(JSON.stringify(schema, null, ' '), 'form.json', 'text/json');\r\n }, [ schema ]);\r\n\r\n const hideEmbedModal = useCallback(() => {\r\n setShowEmbed(false);\r\n }, []);\r\n\r\n const showEmbedModal = useCallback(() => {\r\n setShowEmbed(true);\r\n }, []);\r\n\r\n return (\r\n <div class={ classNames(\r\n 'fjs-container',\r\n 'fjs-pgl-root',\r\n { 'fjs-pgl-inline-editor-panel': inlinePropertiesPanel }) }>\r\n <div class=\"fjs-pgl-modals\">\r\n { showEmbed ? <EmbedModal schema={ schema } data={ data } onClose={ hideEmbedModal } /> : null }\r\n </div>\r\n <div class=\"fjs-pgl-palette-container\" ref={ paletteContainerRef } />\r\n <div class=\"fjs-pgl-main\">\r\n\r\n <Section name=\"Form Definition\">\r\n\r\n {\r\n displayActions && <Section.HeaderItem>\r\n <button\r\n class=\"fjs-pgl-button\"\r\n title=\"Download form definition\"\r\n onClick={ handleDownload }\r\n >Download</button>\r\n </Section.HeaderItem>\r\n }\r\n\r\n {\r\n displayActions && <Section.HeaderItem>\r\n <button\r\n class=\"fjs-pgl-button\"\r\n onClick={ showEmbedModal }\r\n >Embed</button>\r\n </Section.HeaderItem>\r\n }\r\n\r\n <div ref={ editorContainerRef } class=\"fjs-pgl-form-container\"></div>\r\n </Section>\r\n <Section name=\"Form Preview\">\r\n <div ref={ formContainerRef } class=\"fjs-pgl-form-container\"></div>\r\n </Section>\r\n <Section name=\"Form Data (Input)\">\r\n <div ref={ dataContainerRef } class=\"fjs-pgl-text-container\"></div>\r\n </Section>\r\n <Section name=\"Form Data (Submit)\">\r\n <div ref={ resultContainerRef } class=\"fjs-pgl-text-container\"></div>\r\n </Section>\r\n </div>\r\n <div class=\"fjs-pgl-properties-container\" ref={ propertiesPanelContainerRef } />\r\n </div>\r\n );\r\n}\r\n\r\n\r\n// helpers ///////////////\r\n\r\nfunction toJSON(obj) {\r\n return JSON.stringify(obj, null, ' ');\r\n}","import { render } from 'preact';\r\n\r\nimport fileDrop from 'file-drops';\r\n\r\nimport mitt from 'mitt';\r\n\r\nimport { PlaygroundRoot } from './components/PlaygroundRoot';\r\n\r\n/**\r\n * @typedef { {\r\n * container?: Element,\r\n * schema: any,\r\n * data: any,\r\n * editor?: { inlinePropertiesPanel: Boolean }\r\n * actions?: { display: Boolean }\r\n * } } FormPlaygroundOptions\r\n */\r\n\r\n/**\r\n * @param {FormPlaygroundOptions} options\r\n */\r\nexport default function Playground(options) {\r\n\r\n const {\r\n container: parent,\r\n schema,\r\n data,\r\n ...rest\r\n } = options;\r\n\r\n const emitter = mitt();\r\n\r\n let state = { data, schema };\r\n let ref;\r\n\r\n const container = document.createElement('div');\r\n\r\n container.classList.add('fjs-pgl-parent');\r\n\r\n if (parent) {\r\n parent.appendChild(container);\r\n }\r\n\r\n const handleDrop = fileDrop('Drop a form file', function(files) {\r\n const file = files[0];\r\n\r\n if (file) {\r\n try {\r\n ref.setSchema(JSON.parse(file.contents));\r\n } catch (err) {\r\n\r\n // TODO(nikku): indicate JSON parse error\r\n }\r\n }\r\n });\r\n\r\n const withRef = function(fn) {\r\n return function(...args) {\r\n if (!ref) {\r\n throw new Error('Playground is not initialized.');\r\n }\r\n\r\n fn(...args);\r\n };\r\n };\r\n\r\n container.addEventListener('dragover', handleDrop);\r\n\r\n render(\r\n <PlaygroundRoot\r\n schema={ schema }\r\n data={ data }\r\n onStateChanged={ (_state) => state = _state }\r\n onInit={ _ref => ref = _ref }\r\n emit={ emitter.emit }\r\n { ...rest }\r\n />,\r\n container\r\n );\r\n\r\n this.on = emitter.on;\r\n this.off = emitter.off;\r\n\r\n this.emit = emitter.emit;\r\n\r\n this.on('destroy', function() {\r\n render(null, container);\r\n });\r\n\r\n this.on('destroy', function() {\r\n parent.removeChild(container);\r\n });\r\n\r\n this.getState = function() {\r\n return state;\r\n };\r\n\r\n this.setSchema = function(schema) {\r\n return ref.setSchema(schema);\r\n };\r\n\r\n this.get = function(name, strict) {\r\n return ref.get(name, strict);\r\n };\r\n\r\n this.destroy = function() {\r\n this.emit('destroy');\r\n };\r\n\r\n this.attachEditorContainer = withRef(function(node) {\r\n return ref.attachEditorContainer(node);\r\n });\r\n\r\n this.attachPreviewContainer = withRef(function(node) {\r\n return ref.attachFormContainer(node);\r\n });\r\n\r\n this.attachDataContainer = withRef(function(node) {\r\n return ref.attachDataContainer(node);\r\n });\r\n\r\n this.attachResultContainer = withRef(function(node) {\r\n return ref.attachResultContainer(node);\r\n });\r\n\r\n this.attachPaletteContainer = withRef(function(node) {\r\n return ref.attachPaletteContainer(node);\r\n });\r\n\r\n this.attachPropertiesPanelContainer = withRef(function(node) {\r\n return ref.attachPropertiesPanelContainer(node);\r\n });\r\n}"],"names":["Modal","props","useEffect","handleKey","event","key","stopPropagation","onClose","document","addEventListener","removeEventListener","_jsxs","_jsx","name","children","EmbedModal","schema","serializeValue","data","fieldRef","useRef","snippet","trim","current","select","obj","JSON","stringify","replace","JSONEditor","options","emitter","mitt","readonly","language","Compartment","of","json","tabSize","EditorState","createState","doc","extensions","create","basicSetup","createView","updateListener","EditorView","update","docChanged","emit","value","view","state","toString","editable","setValue","setState","getValue","on","off","attachTo","container","appendChild","dom","destroy","parentNode","removeChild","Section","elements","Array","isArray","headerItems","reduce","_","child","bucket","type","HeaderItem","push","length","PlaygroundRoot","actions","actionsConfig","editor","editorConfig","display","displayActions","inlinePropertiesPanel","paletteContainerRef","editorContainerRef","formContainerRef","dataContainerRef","resultContainerRef","propertiesPanelContainerRef","paletteRef","formEditorRef","formRef","dataEditorRef","resultViewRef","propertiesPanelRef","showEmbed","setShowEmbed","useState","initialData","initialSchema","setInitialSchema","setData","setSchema","resultData","setResultData","onInit","attachDataContainer","node","attachEditorContainer","attachFormContainer","attachPaletteContainer","attachPropertiesPanelContainer","attachResultContainer","get","strict","dataEditor","toJSON","resultView","form","Form","formEditor","FormEditor","renderer","compact","palette","parent","propertiesPanel","getSchema","parse","err","formContainer","editorContainer","dataContainer","resultContainer","importSchema","onStateChanged","handleDownload","useCallback","download","hideEmbedModal","showEmbedModal","classNames","Playground","rest","ref","createElement","classList","add","handleDrop","fileDrop","files","file","contents","withRef","fn","args","Error","render","_state","_ref","getState","attachPreviewContainer"],"mappings":"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"}
|