Start documentation

example/src/Demo.jsx

@@ -52,6 +52,7 @@ class Demo extends React.Component {
     this.setState({ docs: createDocs(oas, 'api-setting') });
   }
   render() {
+    console.log(this.state.docs);
     return (
       <div>
         <div className="api-list-header">
@@ -65,7 +66,7 @@ class Demo extends React.Component {
               oasFiles={{
                 'api-setting': Object.assign(extensions.defaults, this.state.oas),
               }}
-              flags={{ correctnewlines: false }}
+              flags={{ correctnewlines: true }}
               oauthUrl={this.props.oauthUrl}
             />
           )

packages/api-explorer-ui/README.md

@@ -13,6 +13,22 @@ npm install --save api-explorer-ui
 
 ## Usage
 
+### `<ApiExplorer docs={this.state.docs} oasFiles={{
+    'api-setting': Object.assign(extensions.defaults, this.state.oas),
+  }} flags={{ correctnewlines: false, stripe: true }} oauthUrl={this.props.oauthUrl} /> `
+
+- `docs` is an array of objects of each endpoint's path, method, and title.
+- `oasFiles` is an object of swagger extensions(https://readme.readme.io/v2.0/docs/swagger-extensions) that modify the display of components within ApiExplorer or  the AJAX request itself. The object also includes the documentation file of all endpoints.
+- `flags` is  an object of specified settings from readme that affect the display of ApiExplorer. The two main ones are correctnewlines -[docs](#correctnewlines) and stripe -[docs](#stripe).
+- `oauthUrl` is a string utilized for response result body to determine authentication for the response of the endpoint.
+
+### `correctnewlines`
+- `correctnewlines` is an object with a boolean value if false it adds line breaks. This can be seen when an image is embedded with a caption.
+
+### `stripe`
+- `stripe` is an object with a boolean value it affects that changes the theme of the layout to show a stripe effect.
+
+
 ## Credits
 [Dom Harrington](https://github.com/readme/)
 

packages/api-explorer-ui/src/Params.jsx

@@ -4,6 +4,8 @@ const Form = require('react-jsonschema-form').default;
 const UpDownWidget = require('react-jsonschema-form/lib/components/widgets/UpDownWidget').default;
 const TextWidget = require('react-jsonschema-form/lib/components/widgets/TextWidget').default;
 const FileWidget = require('react-jsonschema-form/lib/components/widgets/FileWidget').default;
+const DateTimeWidget = require('react-jsonschema-form/lib/components/widgets/DateTimeWidget')
+  .default;
 
 const ObjectField = require('./form-components/ObjectField');
 const SchemaField = require('./form-components/SchemaField');
@@ -39,7 +41,7 @@ function Params({ oas, operation, formData, onChange, onSubmit }) {
                   byte: TextWidget,
                   uuid: TextWidget,
                   duration: TextWidget,
-                  dateTime: TextWidget,
+                  dateTime: DateTimeWidget,
                   integer: UpDownWidget,
                   TextWidget,
                 }}