aboutsummaryrefslogtreecommitdiffstats
path: root/stories/react/utils/SourceToggle.js
diff options
context:
space:
mode:
authorIsrael Lavi <il0695@att.com>2018-08-07 10:54:17 +0300
committerIsrael Lavi <il0695@att.com>2018-08-07 11:06:44 +0300
commitb2a3acea0d0f66028c9ce5fad02d4ecc64abf70c (patch)
tree8d70110f34cb845965c42a5915e950bca967d2c3 /stories/react/utils/SourceToggle.js
parent05b37297177e8a342668c15e5d6f738b51f7aedd (diff)
Initial commit.
Adding files needed for Linux Foundation. Change-Id: I9f2b4851a5ae01f83800c7f8bab8608a2221c730 Issue-ID: SDC-1608 Signed-off-by: Israel Lavi <il0695@att.com>
Diffstat (limited to 'stories/react/utils/SourceToggle.js')
-rw-r--r--stories/react/utils/SourceToggle.js73
1 files changed, 0 insertions, 73 deletions
diff --git a/stories/react/utils/SourceToggle.js b/stories/react/utils/SourceToggle.js
deleted file mode 100644
index a05c8d0..0000000
--- a/stories/react/utils/SourceToggle.js
+++ /dev/null
@@ -1,73 +0,0 @@
-/* eslint-disable react/no-danger */
-import React from 'react';
-import jsxToString from './jsxToString.js';
-
-import Prism from 'prismjs';
-
-import PrismJsx from 'prismjs/components/prism-jsx.js'; // eslint-disable-line no-unused-vars
-
-const sources = {
- React: 'React',
- HTML: 'HTML'
-};
-
-export default class SourceToggle extends React.Component {
- constructor(props) {
- super(props);
- this.state = {
- source: sources.React
- };
- }
-
- renderFromSource() {
- let {jsx, html, renderFromJsx} = this.props;
- let {source} = this.state;
- let classname = 'source-toggle-example';
- switch (source) {
- case sources.HTML:
- return renderFromJsx ? <div className={classname}>{jsx}</div> : <div className={classname} dangerouslySetInnerHTML={{__html: html}} />;
- case sources.React:
- default:
- return <div className={classname}>{jsx}</div>;
- }
- }
-
- renderMarkdown() {
- let {jsx, html, exclude} = this.props;
- let {source} = this.state;
- switch (source) {
- case sources.HTML:
- return {__html: Prism.highlight(html, Prism.languages.html)};
- case sources.React:
- default:
- return {__html: Prism.highlight(jsxToString({jsx, exclude}), Prism.languages.jsx)};
- }
- }
-
- render() {
- let {title} = this.props;
- return (
- <div className='source-toggle-wrapper'>
- {title && <div className='source-toggle-title'>{title}</div>}
- <div className='source-toggle'>
- {this.renderFromSource()}
- <div className='source-toggle-code'>
- <div className='source-toggle-code-tabs'>
- {Object.keys(sources).map((source, i) => (
- <div
- key={i}
- className={`source-toggle-tab${this.state.source === source ? ' selected' : ''}`}
- onClick={() => this.setState({source})}>
- {source}
- </div>
- ))}
- </div>
- <pre>
- <code dangerouslySetInnerHTML={this.renderMarkdown()} />
- </pre>
- </div>
- </div>
- </div>
- );
- }
-}