Merge branch 'master' into feature/3300-updated-version-info

Author: shockey

README.md

@@ -144,6 +144,8 @@ modelPropertyMacro | MUST be a function. Function to set default values to each
 docExpansion | Controls the default expansion setting for the operations and tags. It can be 'list' (expands only the tags), 'full' (expands the tags and operations) or 'none' (expands nothing). The default is 'list'.
 displayOperationId | Controls the display of operationId in operations list. The default is `false`.
 displayRequestDuration | Controls the display of the request duration (in milliseconds) for `Try it out` requests. The default is `false`.
+maxDisplayedTags | If set, limits the number of tagged operations displayed to at most this many. The default is to show all operations.
+filter | If set, enables filtering. The top bar will show an edit box that you can use to filter the tagged operations that are shown. Can be true/false to enable or disable, or an explicit filter string in which case filtering will be enabled using that string as the filter expression. Filtering is case sensitive matching the filter expression anywhere inside the tag.
 
 ### Plugins
 

src/core/components/array-model.jsx

@@ -0,0 +1,44 @@
+import React, { Component } from "react"
+import PropTypes from "prop-types"
+
+const propStyle = { color: "#999", fontStyle: "italic" }
+
+export default class ArrayModel extends Component {
+  static propTypes = {
+    schema: PropTypes.object.isRequired,
+    getComponent: PropTypes.func.isRequired,
+    specSelectors: PropTypes.object.isRequired,
+    name: PropTypes.string,
+    required: PropTypes.bool,
+    expandDepth: PropTypes.number,
+    depth: PropTypes.number
+  }
+
+  render(){
+    let { getComponent, required, schema, depth, expandDepth } = this.props
+    let items = schema.get("items")
+    let properties = schema.filter( ( v, key) => ["type", "items", "$$ref"].indexOf(key) === -1 )
+
+    const ModelCollapse = getComponent("ModelCollapse")
+    const Model = getComponent("Model")
+
+    return <span className="model">
+      <span className="model-title">
+        <span className="model-title__text">{ schema.get("title") }</span>
+      </span>
+      <ModelCollapse collapsed={ depth > expandDepth } collapsedContent="[...]">
+        [
+          <span><Model { ...this.props } schema={ items } required={ false }/></span>
+        ]
+        {
+          properties.size ? <span>
+              { properties.entrySeq().map( ( [ key, v ] ) => <span key={`${key}-${v}`} style={propStyle}>
+                <br />{ `${key}:`}{ String(v) }</span>)
+              }<br /></span>
+            : null
+        }
+      </ModelCollapse>
+      { required && <span style={{ color: "red" }}>*</span>}
+    </span>
+  }
+}

src/core/components/enum-model.jsx

@@ -0,0 +1,19 @@
+import React from "react"
+import ImPropTypes from "react-immutable-proptypes"
+
+const EnumModel = ({ value, getComponent }) => {
+  let ModelCollapse = getComponent("ModelCollapse")
+  let collapsedContent = <span>Array [ { value.count() } ]</span>
+  return <span className="prop-enum">
+    Enum:<br />
+    <ModelCollapse collapsedContent={ collapsedContent }>
+      [ { value.join(", ") } ]
+    </ModelCollapse>
+  </span>
+}
+EnumModel.propTypes = {
+  value: ImPropTypes.iterable,
+  getComponent: ImPropTypes.func
+}
+
+export default EnumModel

src/core/components/layouts/base.jsx

@@ -26,7 +26,7 @@ export default class BaseLayout extends React.Component {
 
     let Info = getComponent("info")
     let Operations = getComponent("operations", true)
-    let Models = getComponent("models", true)
+    let Models = getComponent("Models", true)
     let AuthorizeBtn = getComponent("authorizeBtn", true)
     let Row = getComponent("Row")
     let Col = getComponent("Col")

src/core/components/model-collapse.jsx

@@ -0,0 +1,41 @@
+import React, { Component } from "react"
+import PropTypes from "prop-types"
+
+export default class ModelCollapse extends Component {
+  static propTypes = {
+    collapsedContent: PropTypes.any,
+    collapsed: PropTypes.bool,
+    children: PropTypes.any
+  }
+
+  static defaultProps = {
+    collapsedContent: "{...}",
+    collapsed: true,
+  }
+
+  constructor(props, context) {
+    super(props, context)
+
+    let { collapsed, collapsedContent } = this.props
+
+    this.state = {
+      collapsed: collapsed !== undefined ? collapsed : ModelCollapse.defaultProps.collapsed,
+      collapsedContent: collapsedContent || ModelCollapse.defaultProps.collapsedContent
+    }
+  }
+
+  toggleCollapsed=()=>{
+    this.setState({
+      collapsed: !this.state.collapsed
+    })
+  }
+
+  render () {
+    return (<span>
+      <span onClick={ this.toggleCollapsed } style={{ "cursor": "pointer" }}>
+        <span className={ "model-toggle" + ( this.state.collapsed ? " collapsed" : "" ) }></span>
+      </span>
+      { this.state.collapsed ? this.state.collapsedContent : this.props.children }
+    </span>)
+  }
+}

src/core/components/model-example.jsx

@@ -28,7 +28,7 @@ export default class ModelExample extends React.Component {
 
   render() {
     let { getComponent, specSelectors, schema, example, isExecute } = this.props
-    const Model = getComponent("model")
+    const ModelWrapper = getComponent("ModelWrapper")
 
     return <div>
       <ul className="tab">
@@ -44,7 +44,7 @@ export default class ModelExample extends React.Component {
           (isExecute || this.state.activeTab === "example") && example
         }
         {
-          !isExecute && this.state.activeTab === "model" && <Model schema={ schema }
+          !isExecute && this.state.activeTab === "model" && <ModelWrapper schema={ schema }
                                                      getComponent={ getComponent }
                                                      specSelectors={ specSelectors }
                                                      expandDepth={ 1 } />

src/core/components/model-wrapper.jsx

@@ -0,0 +1,23 @@
+import React, { Component, } from "react"
+import PropTypes from "prop-types"
+
+export default class ModelComponent extends Component {
+  static propTypes = {
+    schema: PropTypes.object.isRequired,
+    name: PropTypes.string,
+    getComponent: PropTypes.func.isRequired,
+    specSelectors: PropTypes.object.isRequired,
+    expandDepth: PropTypes.number
+  }
+
+  render(){
+    let { getComponent } = this.props
+    const Model = getComponent("Model")
+
+    return <div className="model-box">
+      <Model { ...this.props } depth={ 1 } expandDepth={ this.props.expandDepth || 0 }/>
+    </div>
+  }
+}
+
+