import * as React from "react";
import props from "./props";
import example from "./examples";
import Prop from "../../../../../.storybook/components/Prop/Prop";
import Example from "../../../../../.storybook/components/Example/Example";
import Sandbox from "../../../../../.storybook/components/Sandbox/Sandbox";
/* tslint:disable:max-line-length */

class ${NAME} extends React.Component<any, any> {
	myProps = props.map((x) => <Prop key={x.prop} {...x}/>);

	render() {
		return (
			<div className="story">
				<header className="intro">
					<h1 className="component-story__intro-heading display-4">{"Name of Component"}</h1>
					<p className="component-story__intro-description">{"Description of Component"}</p>
				</header>

				<div className="ruler"/>

				<main className="row">
					<div className="col-md-12">
						<h2>Examples</h2>
						<Example
							title="Basic Usage"
							code={example}
						>
							<div style={{width: "500px"}}>
								{"example goes here"}
							</div>
						</Example>
						<div className="ruler"/>
						<h2 className="section-heading">Input Props</h2>
						{"props go here"}

					</div>
				</main>

				<Sandbox>
					<div style={{width: "1000px"}}>
						{"sand box item"}
					</div>
				</Sandbox>
			</div>
		);
	}
}

export default ${NAME};







import * as React from "react";

interface I${NAME}Props {
}

class ${NAME} extends React.Component<I${NAME}Props, {}> {
	constructor(props: I${NAME}Props) {
		super(props);
		this.state = {};
	}

	render() {
		return (
			<div/>
		);
	}
}

export default ${NAME};