@retailmenot/anchor
Version:
A React UI Library by RetailMeNot
34 lines • 1.67 kB
JavaScript
// REACT
import * as React from 'react';
// STORYBOOK
import { storiesOf } from '@storybook/react';
import { text, color } from '@storybook/addon-knobs';
// VENDOR
import styled, { ThemeProvider } from '@xstyled/styled-components';
// COMPONENT
import { Layout, DEFAULT_LAYOUT_WIDTH, DEFAULT_CONTENT_WIDTH, TRANSPARENT, } from './Layout.component';
import { RootTheme } from '../theme';
import { Footer } from './Footer';
import { Page } from './Page';
// README
import * as README from './README.md';
// Styled Components
// ------------------------------------------------------------------------------------------------------------------
const StyledStory = styled('div') `
background: white;
`;
// Stories
// ------------------------------------------------------------------------------------------------------------------
storiesOf('Components/Layout', module)
.addParameters({
readme: {
sidebar: README,
},
})
.add('Default', () => (React.createElement(ThemeProvider, { theme: RootTheme },
React.createElement(StyledStory, null,
React.createElement(Page, { footer: React.createElement(Footer, null) },
React.createElement(Layout, { layoutWidth: text('Layout Width', DEFAULT_LAYOUT_WIDTH), contentWidth: text('Content Width', DEFAULT_CONTENT_WIDTH), layoutBackgroundColor: color('Layout Background Color', TRANSPARENT), contentBackgroundColor: color('Content Background Color', TRANSPARENT) },
React.createElement("h1", null, "Default Layout"),
React.createElement("h2", null, "This example uses the Page component as a wrapper.")))))));
//# sourceMappingURL=Layout.stories.js.map