├── .gitignore ├── .npmignore ├── .travis.yml ├── .vscode └── settings.json ├── LICENSE ├── README.md ├── docs ├── asset-manifest.json ├── favicon.ico ├── index.html ├── manifest.json ├── service-worker.js └── static │ ├── css │ ├── main.1d316427.css │ └── main.1d316427.css.map │ ├── js │ ├── main.f2da4b7a.js │ └── main.f2da4b7a.js.map │ └── media │ ├── dynamic_docs.c45dd5e7.md │ ├── form_docs.c680d6e1.md │ ├── forms.aec5c7b8.png │ ├── getting_started.2be5c59d.md │ ├── glyphicons-halflings-regular.448c34a5.woff2 │ ├── glyphicons-halflings-regular.89889688.svg │ ├── glyphicons-halflings-regular.e18bbf61.ttf │ ├── glyphicons-halflings-regular.f4769f9b.eot │ ├── glyphicons-halflings-regular.fa277232.woff │ ├── intro.fda87512.md │ ├── list_docs.12101c16.md │ └── schema_docs.01abfc75.md ├── lerna.json ├── package.json └── packages ├── react-dynamic-forms ├── .babelrc ├── .eslintrc ├── CONTRIBUTING.md ├── LICENSE ├── README.md ├── lib │ ├── components │ │ ├── CheckBoxes.js │ │ ├── Chooser.js │ │ ├── DateEdit.js │ │ ├── Field.js │ │ ├── Form.js │ │ ├── List.js │ │ ├── RadioButtons.js │ │ ├── Schema.js │ │ ├── TagsEdit.js │ │ ├── TextArea.js │ │ ├── TextEdit.js │ │ └── View.js │ ├── css │ │ ├── chooser.css │ │ ├── dateedit.css │ │ ├── group.css │ │ ├── icon.css │ │ ├── list.css │ │ ├── select.css │ │ ├── tagsedit.css │ │ ├── textarea.css │ │ └── textedit.css │ ├── index.js │ └── js │ │ ├── constants.js │ │ ├── formGroup.js │ │ └── formList.js ├── package-lock.json ├── package.json ├── public │ ├── favicon.ico │ └── index.html ├── src │ ├── components │ │ ├── CheckBoxes.js │ │ ├── Chooser.js │ │ ├── DateEdit.js │ │ ├── Field.js │ │ ├── Form.js │ │ ├── List.js │ │ ├── RadioButtons.js │ │ ├── Schema.js │ │ ├── TagsEdit.js │ │ ├── TextArea.js │ │ ├── TextEdit.js │ │ └── View.js │ ├── css │ │ ├── chooser.css │ │ ├── dateedit.css │ │ ├── group.css │ │ ├── icon.css │ │ ├── list.css │ │ ├── select.css │ │ ├── tagsedit.css │ │ ├── textarea.css │ │ └── textedit.css │ ├── index.js │ └── js │ │ ├── constants.js │ │ ├── formGroup.js │ │ └── formList.js ├── tests │ ├── ChooserTests.js │ ├── TextEditTests.js │ ├── __snapshots__ │ │ └── textedit.test.js.snap │ ├── components_test │ │ ├── ChooserExamples.js │ │ └── TextEditExamples.js │ └── textedit.test.js └── yarn.lock └── website ├── .gitignore ├── README.md ├── forms.png ├── package-lock.json ├── package.json ├── public ├── favicon.ico ├── index.html └── manifest.json ├── src ├── App.css ├── App.js ├── Header.js ├── Sidebar.js ├── api │ └── docs.json ├── components │ ├── API.js │ ├── APIDoc.js │ ├── Example.js │ ├── Guide.js │ └── Highlighter.js ├── examples │ ├── dynamic │ │ ├── Index.js │ │ ├── dynamic_docs.md │ │ └── dynamic_thumbnail.png │ ├── examples.js │ ├── examples.json │ ├── form │ │ ├── Index.js │ │ ├── form_docs.md │ │ └── form_thumbnail.png │ ├── list │ │ ├── Index.js │ │ ├── list_docs.md │ │ └── list_thumbnail.png │ └── schema │ │ ├── Index.js │ │ ├── schema_docs.md │ │ └── schema_thumbnail.png ├── guides │ ├── getting_started.md │ ├── guides.js │ └── intro.md ├── img │ ├── forms.png │ └── github.png ├── index.css ├── index.js ├── renderers.js └── styles.js └── yarn.lock /.gitignore: -------------------------------------------------------------------------------- 1 | node_modules 2 | *.log 3 | .DS_Store 4 | npm-debug.log 5 | examples-bundle.js -------------------------------------------------------------------------------- /.npmignore: -------------------------------------------------------------------------------- 1 | src/ 2 | examples/ 3 | screenshots/ 4 | docs/ 5 | bin/ 6 | build/global 7 | index.html 8 | .eslintrc 9 | .gitignore 10 | CONTRIBUTING.md 11 | examples-bundle.js 12 | examples-bundle.js.map 13 | *.config.js 14 | .DS_Store 15 | npm-debug.log 16 | -------------------------------------------------------------------------------- /.travis.yml: -------------------------------------------------------------------------------- 1 | sudo: false 2 | language: node_js 3 | node_js: 4 | - "0.12" 5 | notifications: 6 | email: false 7 | -------------------------------------------------------------------------------- /.vscode/settings.json: -------------------------------------------------------------------------------- 1 | { 2 | "git.ignoreLimitWarning": true 3 | } -------------------------------------------------------------------------------- /LICENSE: -------------------------------------------------------------------------------- 1 | "ESnet React Forms Library, Copyright (c) 2015-2017, The Regents of the 2 | University of California, through Lawrence Berkeley National Laboratory 3 | (subject to receipt of any required approvals from the U.S. Dept. of Energy). 4 | All rights reserved." 5 | 6 | Redistribution and use in source and binary forms, with or without 7 | modification, are permitted provided that the following conditions are met: 8 | 9 | (1) Redistributions of source code must retain the above copyright notice, this 10 | list of conditions and the following disclaimer. 11 | 12 | (2) Redistributions in binary form must reproduce the above copyright notice, 13 | this list of conditions and the following disclaimer in the documentation and/ 14 | or other materials provided with the distribution. 15 | 16 | (3) Neither the name of the University of California, Lawrence Berkeley 17 | National Laboratory, U.S. Dept. of Energy nor the names of its contributors may 18 | be used to endorse or promote products derived from this software without 19 | specific prior written permission. 20 | 21 | THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS "AS IS" AND 22 | ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE IMPLIED 23 | WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE ARE 24 | DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT OWNER OR CONTRIBUTORS BE LIABLE FOR 25 | ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES 26 | (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; 27 | LOSS OF USE, DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON 28 | ANY THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT 29 | (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE OF THIS 30 | SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE. 31 | 32 | You are under no obligation whatsoever to provide any bug fixes, patches, or 33 | upgrades to the features, functionality or performance of the source code 34 | ("Enhancements") to anyone; however, if you choose to make your Enhancements 35 | available either publicly, or directly to Lawrence Berkeley National 36 | Laboratory, without imposing a separate written license agreement for such 37 | Enhancements, then you hereby grant the following license: a non-exclusive, 38 | royalty-free perpetual license to install, use, modify, prepare derivative 39 | works, incorporate into other computer software, distribute, and sublicense 40 | such enhancements or derivative works thereof, in binary and source code form. -------------------------------------------------------------------------------- /docs/asset-manifest.json: -------------------------------------------------------------------------------- 1 | { 2 | "main.css": "static/css/main.1d316427.css", 3 | "main.css.map": "static/css/main.1d316427.css.map", 4 | "main.js": "static/js/main.f2da4b7a.js", 5 | "main.js.map": "static/js/main.f2da4b7a.js.map", 6 | "static/media/dynamic_docs.md": "static/media/dynamic_docs.c45dd5e7.md", 7 | "static/media/form_docs.md": "static/media/form_docs.c680d6e1.md", 8 | "static/media/forms.png": "static/media/forms.aec5c7b8.png", 9 | "static/media/getting_started.md": "static/media/getting_started.2be5c59d.md", 10 | "static/media/glyphicons-halflings-regular.eot": "static/media/glyphicons-halflings-regular.f4769f9b.eot", 11 | "static/media/glyphicons-halflings-regular.svg": "static/media/glyphicons-halflings-regular.89889688.svg", 12 | "static/media/glyphicons-halflings-regular.ttf": "static/media/glyphicons-halflings-regular.e18bbf61.ttf", 13 | "static/media/glyphicons-halflings-regular.woff": "static/media/glyphicons-halflings-regular.fa277232.woff", 14 | "static/media/glyphicons-halflings-regular.woff2": "static/media/glyphicons-halflings-regular.448c34a5.woff2", 15 | "static/media/intro.md": "static/media/intro.fda87512.md", 16 | "static/media/list_docs.md": "static/media/list_docs.12101c16.md", 17 | "static/media/schema_docs.md": "static/media/schema_docs.01abfc75.md" 18 | } -------------------------------------------------------------------------------- /docs/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/esnet/react-dynamic-forms/0f24c808fa1cadb3df6b1635cde377a0959acdd6/docs/favicon.ico -------------------------------------------------------------------------------- /docs/index.html: -------------------------------------------------------------------------------- 1 | React Dynamic Forms
-------------------------------------------------------------------------------- /docs/manifest.json: -------------------------------------------------------------------------------- 1 | { 2 | "short_name": "React App", 3 | "name": "Create React App Sample", 4 | "icons": [ 5 | { 6 | "src": "favicon.ico", 7 | "sizes": "64x64 32x32 24x24 16x16", 8 | "type": "image/x-icon" 9 | } 10 | ], 11 | "start_url": "./index.html", 12 | "display": "standalone", 13 | "theme_color": "#000000", 14 | "background_color": "#ffffff" 15 | } 16 | -------------------------------------------------------------------------------- /docs/service-worker.js: -------------------------------------------------------------------------------- 1 | "use strict";var precacheConfig=[["/react-dynamic-forms/index.html","55629829bed102766b685e46075e2579"],["/react-dynamic-forms/static/css/main.1d316427.css","cb8f3e7561ccd1df6b5ad8d24ecdb60a"],["/react-dynamic-forms/static/js/main.f2da4b7a.js","dedd342e0fd9383c169d1dd71831e8d5"],["/react-dynamic-forms/static/media/dynamic_docs.c45dd5e7.md","c45dd5e78fa2eee95bda79c8db5af2a5"],["/react-dynamic-forms/static/media/form_docs.c680d6e1.md","c680d6e1735aa3e59e9b5c1405bfa6de"],["/react-dynamic-forms/static/media/forms.aec5c7b8.png","aec5c7b8a344873d9d4f6cbd5cbdd81c"],["/react-dynamic-forms/static/media/getting_started.2be5c59d.md","2be5c59d289c1d198b7f5a75ec92ec2c"],["/react-dynamic-forms/static/media/glyphicons-halflings-regular.448c34a5.woff2","448c34a56d699c29117adc64c43affeb"],["/react-dynamic-forms/static/media/glyphicons-halflings-regular.89889688.svg","89889688147bd7575d6327160d64e760"],["/react-dynamic-forms/static/media/glyphicons-halflings-regular.e18bbf61.ttf","e18bbf611f2a2e43afc071aa2f4e1512"],["/react-dynamic-forms/static/media/glyphicons-halflings-regular.f4769f9b.eot","f4769f9bdb7466be65088239c12046d1"],["/react-dynamic-forms/static/media/glyphicons-halflings-regular.fa277232.woff","fa2772327f55d8198301fdb8bcfc8158"],["/react-dynamic-forms/static/media/intro.fda87512.md","fda875123c517186590247e34c3ec8bf"],["/react-dynamic-forms/static/media/list_docs.12101c16.md","12101c16b67ac38ae6f98be1647a558e"],["/react-dynamic-forms/static/media/schema_docs.01abfc75.md","01abfc750a0c942167651c40d088531d"]],cacheName="sw-precache-v3-sw-precache-webpack-plugin-"+(self.registration?self.registration.scope:""),ignoreUrlParametersMatching=[/^utm_/],addDirectoryIndex=function(e,t){var a=new URL(e);return"/"===a.pathname.slice(-1)&&(a.pathname+=t),a.toString()},cleanResponse=function(t){return t.redirected?("body"in t?Promise.resolve(t.body):t.blob()).then(function(e){return new Response(e,{headers:t.headers,status:t.status,statusText:t.statusText})}):Promise.resolve(t)},createCacheKey=function(e,t,a,r){var n=new URL(e);return r&&n.pathname.match(r)||(n.search+=(n.search?"&":"")+encodeURIComponent(t)+"="+encodeURIComponent(a)),n.toString()},isPathWhitelisted=function(e,t){if(0===e.length)return!0;var a=new URL(t).pathname;return e.some(function(e){return a.match(e)})},stripIgnoredUrlParameters=function(e,a){var t=new URL(e);return t.hash="",t.search=t.search.slice(1).split("&").map(function(e){return e.split("=")}).filter(function(t){return a.every(function(e){return!e.test(t[0])})}).map(function(e){return e.join("=")}).join("&"),t.toString()},hashParamName="_sw-precache",urlsToCacheKeys=new Map(precacheConfig.map(function(e){var t=e[0],a=e[1],r=new URL(t,self.location),n=createCacheKey(r,hashParamName,a,/\.\w{8}\./);return[r.toString(),n]}));function setOfCachedUrls(e){return e.keys().then(function(e){return e.map(function(e){return e.url})}).then(function(e){return new Set(e)})}self.addEventListener("install",function(e){e.waitUntil(caches.open(cacheName).then(function(r){return setOfCachedUrls(r).then(function(a){return Promise.all(Array.from(urlsToCacheKeys.values()).map(function(t){if(!a.has(t)){var e=new Request(t,{credentials:"same-origin"});return fetch(e).then(function(e){if(!e.ok)throw new Error("Request for "+t+" returned a response with status "+e.status);return cleanResponse(e).then(function(e){return r.put(t,e)})})}}))})}).then(function(){return self.skipWaiting()}))}),self.addEventListener("activate",function(e){var a=new Set(urlsToCacheKeys.values());e.waitUntil(caches.open(cacheName).then(function(t){return t.keys().then(function(e){return Promise.all(e.map(function(e){if(!a.has(e.url))return t.delete(e)}))})}).then(function(){return self.clients.claim()}))}),self.addEventListener("fetch",function(t){if("GET"===t.request.method){var e,a=stripIgnoredUrlParameters(t.request.url,ignoreUrlParametersMatching),r="index.html";(e=urlsToCacheKeys.has(a))||(a=addDirectoryIndex(a,r),e=urlsToCacheKeys.has(a));var n="/react-dynamic-forms/index.html";!e&&"navigate"===t.request.mode&&isPathWhitelisted(["^(?!\\/__).*"],t.request.url)&&(a=new URL(n,self.location).toString(),e=urlsToCacheKeys.has(a)),e&&t.respondWith(caches.open(cacheName).then(function(e){return e.match(urlsToCacheKeys.get(a)).then(function(e){if(e)return e;throw Error("The cached response that was expected is missing.")})}).catch(function(e){return console.warn('Couldn\'t serve response for "%s" from cache: %O',t.request.url,e),fetch(t.request)}))}}); -------------------------------------------------------------------------------- /docs/static/media/dynamic_docs.c45dd5e7.md: -------------------------------------------------------------------------------- 1 | ### Description 2 | 3 | The forms library allows you to create forms that dynamically change depending on other filled out fields. An example of this is a form which has a type field and that field controls several other fields that only apply to that type. In this case we want to: 4 | 5 | * Hide and show fields in reaction to a change in the type 6 | * Have hidden fields not be required, i.e. support conditional requires 7 | 8 | #### Render 9 | 10 | The above example begins with a pretty simple `renderForm()` implementation. In fact there's not much to see here. Regardless of the visibility that we'll control in a minute, we can just render all the fields and the forms code will take care of selectively hiding fields for us. Here is the rendered `
`, part of the `renderForm()` function, excluding a little code to get out bookmarks map for the Bookmark chooser choice list. 11 | 12 | ```jsx 13 | this.handleChange(formName, value)} 22 | onMissingCountChange={(formName, missing) => this.setState({ hasMissing: missing > 0 })} 23 | onErrorCountChange={(formName, errors) => this.setState({ hasErrors: errors > 0 })} 24 | > 25 |
Bookmarked endpoints
26 | 27 |
28 |
General information
29 | 30 |