| 1 | {"version":3,"sources":["../src/Grid.story.jsx"],"names":["defaultStyle","height","background","color","fontSize","Item","style","props","storiesOf","module","add"],"mappings":"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","sourcesContent":["import React from 'react';\nimport Story from '@lskjs/dev/Story';\nimport { Container, Row, Col } from './index';\n\nconst defaultStyle = {\n height: 100,\n background: '#3599c3',\n color: '#ddddce',\n fontSize: 16,\n};\nconst Item = ({ style, ...props }) => <div style={{ ...defaultStyle, ...style }} {...props} />;\n\nexport default ({ storiesOf }) => {\n storiesOf('grid/Grid', module)\n .add('Default', () => (\n <Story style={{ background: '#42cafd' }}>\n <Container>\n <Row>\n <Col lg={6} md={12}>\n <Item>\n lg-6 md-12\n </Item>\n </Col>\n <Col lg={2} md={4} xs={6}>\n <Item>\n lg-2 md-4 xs-6\n </Item>\n </Col>\n <Col lg={2} md={4} xs={6}>\n <Item>\n lg-2 md-4 xs-6\n </Item>\n </Col>\n <Col lg={2} md={4} xs={12}>\n <Item>\n lg-2 md-4 xs-12\n </Item>\n </Col>\n </Row>\n </Container>\n </Story>\n ))\n .add('Vertical offsets', () => (\n <Story style={{ background: '#42cafd' }}>\n <Container>\n <Row vertical>\n <Col lg={6} md={12}>\n <Item>\n lg-6 md-12\n </Item>\n </Col>\n <Col lg={2} md={4} xs={6}>\n <Item style={{ height: 50 }}>\n lg-2 md-4 xs-6\n </Item>\n </Col>\n <Col lg={2} md={4} xs={6}>\n <Item style={{ height: 150 }}>\n lg-2 md-4 xs-6\n </Item>\n </Col>\n <Col lg={2} md={4} xs={12}>\n <Item>\n lg-2 md-4 xs-12\n </Item>\n </Col>\n </Row>\n </Container>\n </Story>\n ))\n .add('Custom gap', () => (\n <Story style={{ background: '#42cafd' }}>\n <Container>\n <Row vertical gap={32}>\n <Col md={4}>\n <Item>\n Col 4\n </Item>\n </Col>\n <Col md={4}>\n <Item>\n Col 4\n </Item>\n </Col>\n <Col md={4}>\n <Item>\n Col 4\n </Item>\n </Col>\n </Row>\n </Container>\n </Story>\n ))\n .add('Vertical offsets with custom gap', () => (\n <Story style={{ background: '#42cafd' }}>\n <Container>\n <Row vertical gap={6}>\n <Col md={4}>\n <Item>\n Col 4\n </Item>\n </Col>\n <Col md={4}>\n <Item>\n Col 4\n </Item>\n </Col>\n <Col md={4}>\n <Item>\n Col 4\n </Item>\n </Col>\n <Col md={4}>\n <Item>\n Col 4\n </Item>\n </Col>\n <Col md={4}>\n <Item>\n Col 4\n </Item>\n </Col>\n <Col md={4}>\n <Item>\n Col 4\n </Item>\n </Col>\n </Row>\n </Container>\n </Story>\n ))\n .add('without container', () => (\n <Story style={{ background: '#42cafd' }}>\n <Row>\n <Col md={4}>\n <Item>\n Col 4\n </Item>\n </Col>\n <Col md={4}>\n <Item>\n Col 4\n </Item>\n </Col>\n <Col md={4}>\n <Item>\n Col 4\n </Item>\n </Col>\n </Row>\n </Story>\n ))\n .add('complex', () => (\n <Story style={{ background: '#42cafd' }}>\n <Container>\n <Row vertical>\n <Col md={4}>\n <Item>\n a\n </Item>\n </Col>\n <Col md={4}>\n <Item>\n a\n </Item>\n </Col>\n <Col md={4}>\n <Item>\n a\n </Item>\n </Col>\n <Col md={4}>\n <Item>\n a\n </Item>\n </Col>\n <Col md={4}>\n <Item>\n a\n </Item>\n </Col>\n <Col md={4}>\n <Item>\n <Row vertical>\n <Col md={6}>\n <Item style={{ background: '#68977c' }}>\n b\n </Item>\n </Col>\n <Col md={6}>\n <Item style={{ background: '#68977c' }}>\n b\n </Item>\n </Col>\n <Col md={6}>\n <Item style={{ background: '#68977c' }}>\n b\n </Item>\n </Col>\n <Col md={6}>\n <Item style={{ background: '#68977c' }}>\n b\n </Item>\n </Col>\n <Col md={6}>\n <Item style={{ background: '#68977c' }}>\n b\n </Item>\n </Col>\n <Col md={6}>\n <Item style={{ background: '#68977c' }}>\n b\n </Item>\n </Col>\n <Col md={6}>\n <Item style={{ background: '#68977c' }}>\n b\n </Item>\n </Col>\n <Col md={6}>\n <Item style={{ background: '#68977c' }}>\n b\n </Item>\n </Col>\n </Row>\n </Item>\n </Col>\n </Row>\n </Container>\n </Story>\n ));\n};\n"],"file":"Grid.story.js"} |