@bpmn-io/form-js-playground 0.7.2 → 0.8.0-alpha.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.
Files changed (21) hide show
  1. package/README.md +1 -0
  2. package/dist/form-playground.umd.js +3728 -1177
  3. package/dist/index.cjs.map +1 -1
  4. package/dist/index.es.js.map +1 -1
  5. package/package.json +7 -4
  6. package/karma.conf.js +0 -100
  7. package/resources/screenshot.png +0 -0
  8. package/rollup.config.js +0 -60
  9. package/src/FileDrop.css +0 -33
  10. package/src/JSONView.js +0 -78
  11. package/src/Playground.css +0 -158
  12. package/src/Playground.js +0 -375
  13. package/src/index.js +0 -1
  14. package/test/.eslintrc +0 -8
  15. package/test/TestHelper.js +0 -26
  16. package/test/coverageBundle.js +0 -9
  17. package/test/spec/Playground.spec.js +0 -90
  18. package/test/spec/form.json +0 -86
  19. package/test/spec/other-form.json +0 -11
  20. package/test/test.css +0 -9
  21. package/test/testBundle.js +0 -4
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, '&lt;').replace(/>/g, '&gt;');\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":"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"}
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, '&lt;').replace(/>/g, '&gt;');\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":"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"}
package/dist/index.es.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"index.es.js","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, '&lt;').replace(/>/g, '&gt;');\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":"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"}
1
+ {"version":3,"file":"index.es.js","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, '&lt;').replace(/>/g, '&gt;');\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":"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"}
package/package.json CHANGED
@@ -1,7 +1,10 @@
1
1
  {
2
2
  "name": "@bpmn-io/form-js-playground",
3
- "version": "0.7.2",
3
+ "version": "0.8.0-alpha.0",
4
4
  "description": "A form-js playground",
5
+ "files": [
6
+ "dist"
7
+ ],
5
8
  "exports": {
6
9
  ".": {
7
10
  "import": "./dist/index.es.js",
@@ -17,7 +20,7 @@
17
20
  "umd:main": "dist/form-playground.umd.js",
18
21
  "scripts": {
19
22
  "all": "run-s test build",
20
- "build": "rollup -c",
23
+ "build": "rollup -c --failAfterWarnings",
21
24
  "start": "SINGLE_START=basic npm run dev",
22
25
  "dev": "npm test -- --auto-watch --no-single-run",
23
26
  "test": "karma start",
@@ -34,7 +37,7 @@
34
37
  "url": "https://github.com/bpmn-io"
35
38
  },
36
39
  "dependencies": {
37
- "@bpmn-io/form-js": "^0.7.2",
40
+ "@bpmn-io/form-js": "^0.8.0-alpha.0",
38
41
  "@codemirror/basic-setup": "^0.18.2",
39
42
  "@codemirror/lang-json": "^0.18.0",
40
43
  "@codemirror/state": "^0.18.7",
@@ -51,5 +54,5 @@
51
54
  "rollup-plugin-css-only": "^3.1.0",
52
55
  "style-loader": "^3.3.0"
53
56
  },
54
- "gitHead": "46631f707eea5537cbeb81aa05423fd9be71a3c0"
57
+ "gitHead": "ffc5f0cedcf0b9a923b34ff56e7f63a34c362cf9"
55
58
  }
package/karma.conf.js DELETED
@@ -1,100 +0,0 @@
1
- const coverage = process.env.COVERAGE;
2
-
3
- // configures browsers to run test against
4
- // any of [ 'ChromeHeadless', 'Chrome', 'Firefox', 'IE', 'PhantomJS' ]
5
- const browsers = (process.env.TEST_BROWSERS || 'ChromeHeadless').split(',');
6
-
7
- const singleStart = process.env.SINGLE_START;
8
-
9
- // use puppeteer provided Chrome for testing
10
- process.env.CHROME_BIN = require('puppeteer').executablePath();
11
-
12
- const suite = coverage ? 'test/coverageBundle.js' : 'test/testBundle.js';
13
-
14
- module.exports = function(karma) {
15
-
16
- const config = {
17
-
18
- frameworks: [
19
- 'webpack',
20
- 'mocha',
21
- 'sinon-chai'
22
- ],
23
-
24
- files: [
25
- suite
26
- ],
27
-
28
- preprocessors: {
29
- [ suite ]: [ 'webpack', 'env' ]
30
- },
31
-
32
- reporters: [ 'progress' ].concat(coverage ? 'coverage' : []),
33
-
34
- coverageReporter: {
35
- reporters: [
36
- { type: 'lcov', subdir: '.' }
37
- ]
38
- },
39
-
40
- browsers,
41
-
42
- singleRun: true,
43
- autoWatch: false,
44
-
45
- webpack: {
46
- mode: 'development',
47
- resolve: {
48
- modules: [
49
- 'node_modules',
50
- __dirname
51
- ]
52
- },
53
- module: {
54
- rules: [
55
- {
56
- test: /\.css$/i,
57
- use: [
58
- 'style-loader',
59
- 'css-loader'
60
- ]
61
- },
62
- {
63
- test: /\.m?js$/,
64
- exclude: /node_modules/,
65
- use: {
66
- loader: 'babel-loader',
67
- options: {
68
- plugins: [
69
- [ '@babel/plugin-transform-react-jsx', {
70
- 'importSource': 'preact',
71
- 'runtime': 'automatic'
72
- } ]
73
- ]
74
- }
75
- }
76
- }
77
- ].concat(coverage ?
78
- {
79
- test: /\.js$/,
80
- use: {
81
- loader: 'istanbul-instrumenter-loader',
82
- options: { esModules: true }
83
- },
84
- enforce: 'post',
85
- include: /src\.*/,
86
- exclude: /node_modules/
87
- } : []
88
- )
89
- },
90
- devtool: 'eval-source-map'
91
- }
92
- };
93
-
94
- if (singleStart) {
95
- config.browsers = [].concat(config.browsers, 'Debug');
96
- config.envPreprocessor = [].concat(config.envPreprocessor || [], 'SINGLE_START');
97
- }
98
-
99
- karma.set(config);
100
- };
package/resources/screenshot.png DELETED
Binary file
package/rollup.config.js DELETED
@@ -1,60 +0,0 @@
1
- import css from 'rollup-plugin-css-only';
2
-
3
- import babel from '@rollup/plugin-babel';
4
-
5
- import commonjs from '@rollup/plugin-commonjs';
6
- import resolve from '@rollup/plugin-node-resolve';
7
-
8
- import pkg from './package.json';
9
-
10
- function pgl(plugins=[]) {
11
- return [
12
- babel({
13
- babelHelpers: 'bundled',
14
- plugins: [
15
- [ '@babel/plugin-transform-react-jsx', {
16
- 'importSource': 'preact',
17
- 'runtime': 'automatic'
18
- } ]
19
- ]
20
- }),
21
- css({
22
- output: 'assets/form-js-playground.css'
23
- }),
24
- ...plugins
25
- ];
26
-
27
- }
28
-
29
- export default [
30
- {
31
- input: 'src/index.js',
32
- output: [
33
- {
34
- sourcemap: true,
35
- format: 'commonjs',
36
- file: pkg.main
37
- },
38
- {
39
- sourcemap: true,
40
- format: 'esm',
41
- file: pkg.module
42
- }
43
- ],
44
- plugins: pgl()
45
- },
46
- {
47
- input: 'src/index.js',
48
- output: [
49
- {
50
- format: 'umd',
51
- file: pkg['umd:main'],
52
- name: 'FormPlayground'
53
- }
54
- ],
55
- plugins: pgl([
56
- resolve(),
57
- commonjs()
58
- ])
59
- }
60
- ];
package/src/FileDrop.css DELETED
@@ -1,33 +0,0 @@
1
- /**
2
- * file-drop.css
3
- */
4
- .drop-overlay {
5
- position: fixed;
6
- top: 0;
7
- left: 0;
8
- bottom: 0;
9
- right: 0;
10
-
11
- padding: 50px;
12
-
13
- background: rgba(255, 255, 255, .9);
14
-
15
- z-index: 1000;
16
- }
17
-
18
- .drop-overlay .box {
19
- text-align: center;
20
- border: dashed 4px #CCC;
21
- height: 100%;
22
- width: 100%;
23
- display: table;
24
- }
25
-
26
- .drop-overlay .label {
27
- font-size: 26px;
28
- color: #888;
29
- margin: auto;
30
-
31
- display: table-cell;
32
- vertical-align: middle;
33
- }
package/src/JSONView.js DELETED
@@ -1,78 +0,0 @@
1
- import mitt from 'mitt';
2
-
3
- import { basicSetup, EditorView } from '@codemirror/basic-setup';
4
- import { EditorState, Compartment } from '@codemirror/state';
5
- import { json } from '@codemirror/lang-json';
6
-
7
-
8
- export default function JSONEditor(options = {}) {
9
-
10
- const emitter = mitt();
11
-
12
- const {
13
- readonly = false
14
- } = options;
15
-
16
- let language = new Compartment().of(json());
17
- let tabSize = new Compartment().of(EditorState.tabSize.of(2));
18
-
19
- function createState(doc, extensions=[]) {
20
- return EditorState.create({
21
- doc,
22
- extensions: [
23
- basicSetup,
24
- language,
25
- tabSize,
26
- ...extensions
27
- ]
28
- });
29
- }
30
-
31
- function createView(readonly) {
32
-
33
- const updateListener = EditorView.updateListener.of(update => {
34
- if (update.docChanged) {
35
- emitter.emit('changed', {
36
- value: update.view.state.doc.toString()
37
- });
38
- }
39
- });
40
-
41
- const editable = EditorView.editable.of(!readonly);
42
-
43
- const view = new EditorView({
44
- state: createState('', [ updateListener, editable ])
45
- });
46
-
47
- view.setValue = function(value) {
48
- this.setState(createState(value, [ updateListener, editable ]));
49
- };
50
-
51
- return view;
52
- }
53
-
54
- const view = createView(readonly);
55
-
56
- this.setValue = function(value) {
57
- view.setValue(value);
58
- };
59
-
60
- this.getValue = function() {
61
- return view.state.doc.toString();
62
- };
63
-
64
- this.on = emitter.on;
65
- this.off = emitter.off;
66
-
67
- this.attachTo = function(container) {
68
- container.appendChild(view.dom);
69
- };
70
-
71
- this.destroy = function() {
72
- if (view.dom.parentNode) {
73
- view.dom.parentNode.removeChild(view.dom);
74
- }
75
-
76
- view.destroy();
77
- };
78
- }