JavaScript storybook-readme/with-readme示例

示例#1

文件： index.js 项目： yashshah/react-realtime-map

const moment = require("moment");

function removeFirstLine(str, num = 1) {
	let n = num - 1;
	while (n) {
		str = str.substring(str.indexOf("\n") + 1);
		n -= 1;
	}
	return str;
}

storiesOf("GeoDistanceSlider", module)
	.addDecorator(withKnobs)
	.add("Basic", withReadme(removeFirstLine(GeoDistanceSliderReadme), () => (
		<GeoDistanceSliderDefault />
	)))
	.add("With Title", withReadme(removeFirstLine(GeoDistanceSliderReadme), () => (
		<GeoDistanceSliderDefault
			defaultSelected={{
				distance: 50
			}}
			unit="mi"
			title="Geo Distance Search"
			placeholder="Search Location"
		/>
	)))
	.add("With Range Labels", withReadme(removeFirstLine(GeoDistanceSliderReadme), () => (
		<GeoDistanceSliderDefault
			defaultSelected={{
				distance: 50

示例#2

文件： index.js 项目： jsonkao/react-intersection-observer

import React from 'react';
import withReadme from 'storybook-readme/with-readme';
import Readme from './README.md';
import WindowRoot from './WindowRoot';

export default withReadme(Readme, () => <WindowRoot />);

示例#3

文件： index.js 项目： jsonkao/react-intersection-observer

import React from 'react';
import withReadme from 'storybook-readme/with-readme';
import Readme from './README.md';
import OnlyOnce from './OnlyOnce';

export default withReadme(Readme, () => <OnlyOnce />);

示例#4

文件： index.js 项目： jsonkao/react-intersection-observer

import React from 'react';
import withReadme from 'storybook-readme/with-readme';
import Readme from './README.md';
import ImpressionTracking from './ImpressionTracking';

export default withReadme(Readme, () => <ImpressionTracking />);