{"version":3,"sources":["App/components/Prism.js","Demo/UIElements/Basic/GridSystem.js","../node_modules/react-bootstrap/es/Container.js","../node_modules/react-bootstrap/es/Table.js"],"names":["react__WEBPACK_IMPORTED_MODULE_0__","__webpack_require__","react__WEBPACK_IMPORTED_MODULE_0___default","n","prism_react_renderer__WEBPACK_IMPORTED_MODULE_1__","prism","props","theme","require","a","createElement","Object","assign","defaultProps","code","language","_ref","className","style","tokens","getLineProps","getTokenProps","map","line","i","key","token","GridSystem","react__WEBPACK_IMPORTED_MODULE_5___default","_hoc_Aux__WEBPACK_IMPORTED_MODULE_11__","react_bootstrap__WEBPACK_IMPORTED_MODULE_6__","react_bootstrap__WEBPACK_IMPORTED_MODULE_7__","react_bootstrap__WEBPACK_IMPORTED_MODULE_8__","Header","Title","as","Body","Text","href","rel","target","react_bootstrap__WEBPACK_IMPORTED_MODULE_9__","sm","_App_components_Prism__WEBPACK_IMPORTED_MODULE_12__","react_bootstrap__WEBPACK_IMPORTED_MODULE_10__","bordered","striped","responsive","scope","colSpan","DEMO","BLANK_LINK","xs","lg","md","order","span","offset","React","Component","_babel_runtime_helpers_esm_extends__WEBPACK_IMPORTED_MODULE_0__","_babel_runtime_helpers_esm_objectWithoutPropertiesLoose__WEBPACK_IMPORTED_MODULE_1__","classnames__WEBPACK_IMPORTED_MODULE_2__","classnames__WEBPACK_IMPORTED_MODULE_2___default","react__WEBPACK_IMPORTED_MODULE_3__","react__WEBPACK_IMPORTED_MODULE_3___default","_ThemeProvider__WEBPACK_IMPORTED_MODULE_4__","Container","forwardRef","ref","bsPrefix","fluid","_ref$as","prefix","displayName","__webpack_exports__","_babel_runtime_helpers_esm_inheritsLoose__WEBPACK_IMPORTED_MODULE_2__","classnames__WEBPACK_IMPORTED_MODULE_3__","classnames__WEBPACK_IMPORTED_MODULE_3___default","react__WEBPACK_IMPORTED_MODULE_4__","react__WEBPACK_IMPORTED_MODULE_4___default","_ThemeProvider__WEBPACK_IMPORTED_MODULE_5__","Table","_React$Component","apply","this","arguments","prototype","render","_this$props","borderless","hover","size","variant","classes","table","responsiveClass"],"mappings":"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","file":"static/js/88.e1075c13.chunk.js","sourcesContent":["import React from 'react';\r\nimport Highlight, {defaultProps} from \"prism-react-renderer\";\r\n\r\nconst prism = (props) => {\r\n    const theme = require('prism-react-renderer/themes/dracula'); // dracula, duotoneDark, duotoneLight, nightOwl, oceanicNext, shadesOfPurple, vsDark, vsDarkPlus\r\n    return (\r\n        <Highlight {...defaultProps} theme={theme} code={props.code} language={props.language}>\r\n            {({ className, style, tokens, getLineProps, getTokenProps }) => (\r\n                <div className=\"m-t-15\">\r\n                    <pre className={className} style={style}>\r\n                        <code className=\"language-markup\">\r\n                            {tokens.map((line, i) => (\r\n                                <div {...getLineProps({ line, key: i })}>\r\n                                    {line.map((token, key) => (\r\n                                        <span {...getTokenProps({ token, key })} />\r\n                                    ))}\r\n                                </div>\r\n                            ))}\r\n                        </code>\r\n                    </pre>\r\n                </div>\r\n            )}\r\n        </Highlight>\r\n    );\r\n};\r\n\r\nexport default prism;","import React from 'react';\r\nimport {Row, Col, Card, Container, Table} from 'react-bootstrap';\r\n\r\nimport Aux from \"../../../hoc/_Aux\";\r\nimport Prism from '../../../App/components/Prism';\r\nimport DEMO from \"../../../store/constant\";\r\n\r\nclass GridSystem extends React.Component {\r\n\r\n    render() {\r\n        const basicCode = (\r\n`<Container>\r\n    <Row>\r\n        <Col sm> One of three columns </Col>\r\n        <Col sm> One of three columns </Col>\r\n        <Col sm> One of three columns </Col>\r\n    </Row>\r\n</Container>`);\r\n\r\n        const autoLayoutEqualWidth = (\r\n`<Container>\r\n    <Row>\r\n        <Col>1 of 2</Col>\r\n        <Col>2 of 2</Col>\r\n    </Row>\r\n    <Row>\r\n        <Col>1 of 3</Col>\r\n        <Col>2 of 3</Col>\r\n        <Col>3 of 3</Col>\r\n    </Row>\r\n</Container>`);\r\n\r\n        const autoLayoutMultiLine = (\r\n`<Container>\r\n    <Row>\r\n        <Col>Column</Col>\r\n        <Col>Column</Col>\r\n        <div className=\"w-100\" />\r\n        <Col>Column</Col>\r\n        <Col>Column</Col>\r\n    </Row>\r\n</Container>`);\r\n\r\n        const autoLayoutFixedOneColumn = (\r\n`<Container>\r\n    <Row>\r\n        <Col>1 of 3</Col>\r\n        <Col xs={6}>2 of 3 (wider)</Col>\r\n        <Col>3 of 3</Col>\r\n    </Row>\r\n    <Row>\r\n        <Col>1 of 3</Col>\r\n        <Col xs={5}>2 of 3 (wider)</Col>\r\n        <Col>3 of 3</Col>\r\n    </Row>\r\n</Container>`);\r\n\r\n        const autoLayoutVariableWidth = (\r\n`<Container>\r\n    <Row className=\"justify-content-md-center\">\r\n        <Col xs lg=\"2\">\r\n            1 of 3\r\n        </Col>\r\n        <Col md=\"auto\">Variable width content</Col>\r\n        <Col xs lg=\"2\">\r\n            3 of 3\r\n        </Col>\r\n    </Row>\r\n    <Row>\r\n        <Col>1 of 3</Col>\r\n        <Col md=\"auto\">Variable width content</Col>\r\n        <Col xs lg=\"2\">\r\n            3 of 3\r\n        </Col>\r\n    </Row>\r\n</Container>`);\r\n\r\n        const responsiveBasic = (\r\n`<Container>\r\n    <Row>\r\n        <Col>col</Col>\r\n        <Col>col</Col>\r\n        <Col>col</Col>\r\n        <Col>col</Col>\r\n    </Row>\r\n    <Row>\r\n        <Col xs={8}>xs=8</Col>\r\n        <Col xs={4}>xs=4</Col>\r\n    </Row>\r\n</Container>`);\r\n\r\n        const responsiveStacked = (\r\n`<Container>\r\n    <Row>\r\n        <Col sm={8}>sm=8</Col>\r\n        <Col sm={4}>sm=4</Col>\r\n    </Row>\r\n    <Row>\r\n        <Col sm>sm=true</Col>\r\n        <Col sm>sm=true</Col>\r\n        <Col sm>sm=true</Col>\r\n    </Row>\r\n</Container>`);\r\n\r\n        const responsiveMixMatch = (\r\n`<Container>\r\n    <Row>\r\n        <Col xs={12} md={8}>\r\n            xs=12 md=8\r\n        </Col>\r\n        <Col xs={6} md={4}>\r\n            xl=6 md=4\r\n        </Col>\r\n    </Row>\r\n    <Row>\r\n        <Col xs={6} md={4}>\r\n            xs=6 md=4\r\n        </Col>\r\n        <Col xs={6} md={4}>\r\n            xs=6 md=4\r\n        </Col>\r\n        <Col xs={6} md={4}>\r\n            xs=6 md=4\r\n        </Col>\r\n    </Row>\r\n    <Row>\r\n        <Col xs={6}>xs=6</Col>\r\n        <Col xs={6}>xs=6</Col>\r\n    </Row>\r\n</Container>`);\r\n\r\n        const reOrdering = (\r\n`<Container>\r\n    <Row>\r\n        <Col xs>First, but unordered</Col>\r\n        <Col xs={{ order: 12 }}>Second, but last</Col>\r\n        <Col xs={{ order: 1 }}>Third, but second</Col>\r\n    </Row>\r\n</Container>`);\r\n\r\n        const columnOffset = (\r\n`<Container>\r\n    <Row>\r\n        <Col md={4}>md=4</Col>\r\n        <Col md={{ span: 4, offset: 4 }}>{\\`md={{ span: 4, offset: 4 }}\\`}</Col>\r\n    </Row>\r\n    <Row>\r\n        <Col md={{ span: 3, offset: 3 }}>{\\`md={{ span: 3, offset: 3 }}\\`}</Col>\r\n        <Col md={{ span: 3, offset: 3 }}>{\\`md={{ span: 3, offset: 3 }}\\`}</Col>\r\n    </Row>\r\n    <Row>\r\n        <Col md={{ span: 6, offset: 3 }}>{\\`md={{ span: 6, offset: 3 }}\\`}</Col>\r\n    </Row>\r\n</Container>`);\r\n\r\n        return (\r\n            <Aux>\r\n                <Row>\r\n                    <Col>\r\n                        <Card>\r\n                            <Card.Header>\r\n                                <Card.Title as=\"h5\">Grid System</Card.Title>\r\n                            </Card.Header>\r\n                            <Card.Body>\r\n                                <Card.Text>\r\n                                    Use our powerful mobile-first flexbox grid to build layouts of all shapes and sizes thanks to a twelve column system, five default responsive tiers, Sass variables and mixins, and dozens of predefined classes.\r\n                                </Card.Text>\r\n                                <h5>How it works</h5>\r\n                                <hr/>\r\n                                <Card.Text>\r\n                                    Bootstrap’s grid system uses a series of containers, rows, and columns to layout and align content. It’s built with <a href=\"https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Flexible_Box_Layout/Basic_Concepts_of_Flexbox\" rel=\"noopener noreferrer\" target=\"_blank\">flexbox</a> and is fully responsive. Below is an example and an in-depth look at how the grid comes together.\r\n                                </Card.Text>\r\n                                <Card.Text>\r\n                                    New to or unfamiliar with flexbox? <a href=\"https://css-tricks.com/snippets/css/a-guide-to-flexbox/#flexbox-background\" rel=\"noopener noreferrer\" target=\"_blank\"> Read this CSS Tricks flexbox guide for</a> background, terminology, guidelines, and code snippets.\r\n                                </Card.Text>\r\n                                <div className=\"bd-example-row\">\r\n                                    <Container>\r\n                                        <Row>\r\n                                            <Col sm> One of three columns </Col>\r\n                                            <Col sm> One of three columns </Col>\r\n                                            <Col sm> One of three columns </Col>\r\n                                        </Row>\r\n                                    </Container>\r\n                                    <Prism code={basicCode} language=\"html\" />\r\n                                </div>\r\n                                <Card.Text>\r\n                                    The above example creates three equal-width columns on small, medium, large, and extra large devices using our predefined grid classes. Those columns are centered in the page with the parent <code>Container</code>.\r\n                                </Card.Text>\r\n                            </Card.Body>\r\n                        </Card>\r\n                        <Card>\r\n                            <Card.Header>\r\n                                <Card.Title as=\"h5\">Grid Options</Card.Title>\r\n                            </Card.Header>\r\n                            <Card.Body>\r\n                                <Card.Text>While Bootstrap uses <code className=\"highlighter-rouge\">em</code>s or <code className=\"highlighter-rouge\">rem</code>s for defining most sizes, <code className=\"highlighter-rouge\">px</code>s are used for grid breakpoints and container widths. This is because the viewport width is in pixels and does not change with the <a href=\"https://drafts.csswg.org/mediaqueries-3/#units\" rel=\"noopener noreferrer\"  target=\"_blank\">font size</a>.</Card.Text>\r\n                                <Card.Text>See how aspects of the Bootstrap grid system work across multiple devices with a handy table.</Card.Text>\r\n                                <Table bordered striped responsive>\r\n                                    <thead>\r\n                                    <tr>\r\n                                        <th />\r\n                                        <th className=\"text-center\">\r\n                                            Extra small\r\n                                            <br />\r\n                                            <small>&lt;576px</small>\r\n                                        </th>\r\n                                        <th className=\"text-center\">\r\n                                            Small\r\n                                            <br />\r\n                                            <small>&ge;576px</small>\r\n                                        </th>\r\n                                        <th className=\"text-center\">\r\n                                            Medium\r\n                                            <br />\r\n                                            <small>&ge;768px</small>\r\n                                        </th>\r\n                                        <th className=\"text-center\">\r\n                                            Large\r\n                                            <br />\r\n                                            <small>&ge;992px</small>\r\n                                        </th>\r\n                                        <th className=\"text-center\">\r\n                                            Extra large\r\n                                            <br />\r\n                                            <small>&ge;1200px</small>\r\n                                        </th>\r\n                                    </tr>\r\n                                    </thead>\r\n                                    <tbody>\r\n                                    <tr>\r\n                                        <th className=\"text-nowrap\" scope=\"row\">Max container width</th>\r\n                                        <td>None (auto)</td>\r\n                                        <td>540px</td>\r\n                                        <td>720px</td>\r\n                                        <td>960px</td>\r\n                                        <td>1140px</td>\r\n                                    </tr>\r\n                                    <tr>\r\n                                        <th className=\"text-nowrap\" scope=\"row\">Component/props</th>\r\n                                        <td><code>Col</code></td>\r\n                                        <td><code>sm</code></td>\r\n                                        <td><code>md</code></td>\r\n                                        <td><code>lg</code></td>\r\n                                        <td><code>xl</code></td>\r\n                                    </tr>\r\n                                    <tr>\r\n                                        <th className=\"text-nowrap\" scope=\"row\"># of columns</th>\r\n                                        <td colSpan=\"5\">12</td>\r\n                                    </tr>\r\n                                    <tr>\r\n                                        <th className=\"text-nowrap\" scope=\"row\">Gutter width</th>\r\n                                        <td colSpan=\"5\">30px (15px on each side of a column)</td>\r\n                                    </tr>\r\n                                    <tr>\r\n                                        <th className=\"text-nowrap\" scope=\"row\">Nestable</th>\r\n                                        <td colSpan=\"5\">Yes</td>\r\n                                    </tr>\r\n                                    <tr>\r\n                                        <th className=\"text-nowrap\" scope=\"row\">Column ordering</th>\r\n                                        <td colSpan=\"5\">Yes</td>\r\n                                    </tr>\r\n                                    </tbody>\r\n                                </Table>\r\n                            </Card.Body>\r\n                        </Card>\r\n                        <Card>\r\n                            <Card.Header>\r\n                                <Card.Title as='h5'>Auto-layout Columns</Card.Title>\r\n                            </Card.Header>\r\n                            <Card.Body>\r\n                                <Card.Text>Utilize breakpoint-specific column classes for easy column sizing without an explicit numbered class like <code className=\"highlighter-rouge\">.col-sm-6</code>.</Card.Text>\r\n                                <h5>Equal-width</h5>\r\n                                <hr/>\r\n                                <Card.Text>For example, here are two grid layouts that apply to every device and viewport, from <code className=\"highlighter-rouge\">xs</code> to <code className=\"highlighter-rouge\">xl</code>. Add any number of unit-less classes for each breakpoint you need and every column will be the same width.</Card.Text>\r\n                                <div className=\"bd-example-row\">\r\n                                    <Container>\r\n                                        <Row>\r\n                                            <Col>1 of 2</Col>\r\n                                            <Col>2 of 2</Col>\r\n                                        </Row>\r\n                                        <Row>\r\n                                            <Col>1 of 3</Col>\r\n                                            <Col>2 of 3</Col>\r\n                                            <Col>3 of 3</Col>\r\n                                        </Row>\r\n                                    </Container>\r\n                                    <Prism code={autoLayoutEqualWidth} language=\"html\"/>\r\n                                </div>\r\n                                <h5 className=\"mt-1\">Equal-width Multi-row</h5>\r\n                                <hr/>\r\n                                <Card.Text>Equal-width columns can be broken into multiple lines, but there was a <a href=\"https://github.com/philipwalton/flexbugs#flexbug-11\" rel=\"noopener noreferrer\" target=\"_blank\">Safari flexbox bug</a> that prevented this from working without an explicit <code className=\"highlighter-rouge\">flex-basis</code> or <code className=\"highlighter-rouge\">border</code>. There are workarounds for older browser versions, but they shouldn’t be necessary if you’re up-to-date.</Card.Text>\r\n                                <Card.Text>Create equal-width columns that span multiple rows by inserting a <code className=\"highlighter-rouge\">.w-100</code> where you want the columns to break to a new line. Make the breaks responsive by mixing the <code className=\"hlighter-rouge\">.w-100</code> with some <a href={DEMO.BLANK_LINK}>responsive display utilities</a>.</Card.Text>\r\n\r\n                                <div className=\"bd-example-row\">\r\n                                    <Container>\r\n                                        <Row>\r\n                                            <Col>Column</Col>\r\n                                            <Col>Column</Col>\r\n                                            <div className=\"w-100\" />\r\n                                            <Col>Column</Col>\r\n                                            <Col>Column</Col>\r\n                                        </Row>\r\n                                    </Container>\r\n                                    <Prism code={autoLayoutMultiLine} language=\"html\"/>\r\n                                </div>\r\n                                <h5 className=\"mt-1\">Setting one column width</h5>\r\n                                <hr/>\r\n                                <Card.Text>Auto-layout for flexbox grid columns also means you can set the width of one column and have the sibling columns automatically resize around it. You may use predefined grid classes (as shown below), grid mixins, or inline widths. Note that the other columns will resize no matter the width of the center column.</Card.Text>\r\n                                <div className=\"bd-example-row\">\r\n                                    <Container>\r\n                                        <Row>\r\n                                            <Col>1 of 3</Col>\r\n                                            <Col xs={6}>2 of 3 (wider)</Col>\r\n                                            <Col>3 of 3</Col>\r\n                                        </Row>\r\n                                        <Row>\r\n                                            <Col>1 of 3</Col>\r\n                                            <Col xs={5}>2 of 3 (wider)</Col>\r\n                                            <Col>3 of 3</Col>\r\n                                        </Row>\r\n                                    </Container>\r\n                                    <Prism code={autoLayoutFixedOneColumn} language=\"html\"/>\r\n                                </div>\r\n                                <h5 className=\"mt-1\">Variable width content</h5>\r\n                                <hr/>\r\n                                <Card.Text>Set the column value (for any breakpoint size) to <code>\"auto\"</code> to size columns based on the natural width of their content.</Card.Text>\r\n                                <div className=\"bd-example-row\">\r\n                                    <Container>\r\n                                        <Row className=\"justify-content-md-center\">\r\n                                            <Col xs lg=\"2\">\r\n                                                1 of 3\r\n                                            </Col>\r\n                                            <Col md=\"auto\">Variable width content</Col>\r\n                                            <Col xs lg=\"2\">\r\n                                                3 of 3\r\n                                            </Col>\r\n                                        </Row>\r\n                                        <Row>\r\n                                            <Col>1 of 3</Col>\r\n                                            <Col md=\"auto\">Variable width content</Col>\r\n                                            <Col xs lg=\"2\">\r\n                                                3 of 3\r\n                                            </Col>\r\n                                        </Row>\r\n                                    </Container>\r\n                                    <Prism code={autoLayoutVariableWidth} language=\"html\"/>\r\n                                </div>\r\n                            </Card.Body>\r\n                        </Card>\r\n                        <Card>\r\n                            <Card.Header>\r\n                                <Card.Title as=\"h5\">Responsive Grid</Card.Title>\r\n                            </Card.Header>\r\n                            <Card.Body>\r\n                                <Card.Text>Bootstrap’s grid includes five tiers of predefined classes for building complex responsive layouts. Customize the size of your columns on extra small, small, medium, large, or extra large devices however you see fit.</Card.Text>\r\n                                <h5 className=\"mt-1\">All breakpoints</h5>\r\n                                <hr/>\r\n                                <Card.Text>The <code>Col</code> lets you specify column widths across 5 breakpoint sizes (xs, sm, md, large, and xl).</Card.Text>\r\n                                <div className=\"bd-example-row\">\r\n                                    <Container>\r\n                                        <Row>\r\n                                            <Col>col</Col>\r\n                                            <Col>col</Col>\r\n                                            <Col>col</Col>\r\n                                            <Col>col</Col>\r\n                                        </Row>\r\n                                        <Row>\r\n                                            <Col xs={8}>xs=8</Col>\r\n                                            <Col xs={4}>xs=4</Col>\r\n                                        </Row>\r\n                                    </Container>\r\n                                    <Prism code={responsiveBasic} language=\"html\"/>\r\n                                </div>\r\n                                <h5 className=\"mt-1\">Stacked to horizontal</h5>\r\n                                <hr/>\r\n                                <Card.Text>For every breakpoint, you can specify the amount of columns to span, or set the prop to <code>Col with lg=true</code> for auto layout widths.</Card.Text>\r\n                                <div className=\"bd-example-row\">\r\n                                    <Container>\r\n                                        <Row>\r\n                                            <Col sm={8}>sm=8</Col>\r\n                                            <Col sm={4}>sm=4</Col>\r\n                                        </Row>\r\n                                        <Row>\r\n                                            <Col sm>sm=true</Col>\r\n                                            <Col sm>sm=true</Col>\r\n                                            <Col sm>sm=true</Col>\r\n                                        </Row>\r\n                                    </Container>\r\n                                    <Prism code={responsiveStacked} language=\"html\"/>\r\n                                </div>\r\n                                <h5 className=\"mt-1\">Mix and match</h5>\r\n                                <hr/>\r\n                                <Card.Text>You can also mix and match breakpoints to create different grids depending on the screen size.</Card.Text>\r\n                                <div className=\"bd-example-row\">\r\n                                    <Container>\r\n                                        <Row>\r\n                                            <Col xs={12} md={8}>\r\n                                                xs=12 md=8\r\n                                            </Col>\r\n                                            <Col xs={6} md={4}>\r\n                                                xl=6 md=4\r\n                                            </Col>\r\n                                        </Row>\r\n                                        <Row>\r\n                                            <Col xs={6} md={4}>\r\n                                                xs=6 md=4\r\n                                            </Col>\r\n                                            <Col xs={6} md={4}>\r\n                                                xs=6 md=4\r\n                                            </Col>\r\n                                            <Col xs={6} md={4}>\r\n                                                xs=6 md=4\r\n                                            </Col>\r\n                                        </Row>\r\n                                        <Row>\r\n                                            <Col xs={6}>xs=6</Col>\r\n                                            <Col xs={6}>xs=6</Col>\r\n                                        </Row>\r\n                                    </Container>\r\n                                    <Prism code={responsiveMixMatch} language=\"html\"/>\r\n                                </div>\r\n                            </Card.Body>\r\n                        </Card>\r\n                        <Card>\r\n                            <Card.Header>\r\n                                <Card.Title as=\"h5\">Reordering</Card.Title>\r\n                            </Card.Header>\r\n                            <Card.Body>\r\n                                <Card.Text> The <code>Col</code> breakpoint props also have a more complicated <code>object</code> prop form: <code>{`{span: number, order: number, offset: number}`}</code> for specifying offsets and ordering affects. </Card.Text>\r\n                                <Card.Text>You can use the <code>`order`</code> property to control the <code>visual order</code> of your content.</Card.Text>\r\n                                <div className=\"bd-example-row\">\r\n                                    <Container>\r\n                                        <Row>\r\n                                            <Col xs>First, but unordered</Col>\r\n                                            <Col xs={{ order: 12 }}>Second, but last</Col>\r\n                                            <Col xs={{ order: 1 }}>Third, but second</Col>\r\n                                        </Row>\r\n                                    </Container>\r\n                                    <Prism code={reOrdering} language=\"html\" />\r\n                                </div>\r\n                            </Card.Body>\r\n                        </Card>\r\n                        <Card>\r\n                            <Card.Header>\r\n                                <Card.Title as=\"h5\">Column Offset</Card.Title>\r\n                            </Card.Header>\r\n                            <Card.Body>\r\n                                <Card.Text>For offsetting grid columns you can set an <code>`offset`</code> value, or, for more general layout, use the margin class utilities.</Card.Text>\r\n                                <div className=\"bd-example-row\">\r\n                                    <Container>\r\n                                        <Row>\r\n                                            <Col md={4}>md=4</Col>\r\n                                            <Col md={{ span: 4, offset: 4 }}>{`md={{ span: 4, offset: 4 }}`}</Col>\r\n                                        </Row>\r\n                                        <Row>\r\n                                            <Col md={{ span: 3, offset: 3 }}>{`md={{ span: 3, offset: 3 }}`}</Col>\r\n                                            <Col md={{ span: 3, offset: 3 }}>{`md={{ span: 3, offset: 3 }}`}</Col>\r\n                                        </Row>\r\n                                        <Row>\r\n                                            <Col md={{ span: 6, offset: 3 }}>{`md={{ span: 6, offset: 3 }}`}</Col>\r\n                                        </Row>\r\n                                    </Container>\r\n                                    <Prism code={columnOffset} language=\"html\" />\r\n                                </div>\r\n                            </Card.Body>\r\n                        </Card>\r\n                    </Col>\r\n                </Row>\r\n            </Aux>\r\n        );\r\n    }\r\n}\r\n\r\nexport default GridSystem;\r\n","import _extends from \"@babel/runtime/helpers/esm/extends\";\nimport _objectWithoutPropertiesLoose from \"@babel/runtime/helpers/esm/objectWithoutPropertiesLoose\";\nimport classNames from 'classnames';\nimport React from 'react';\nimport { useBootstrapPrefix } from './ThemeProvider';\nvar defaultProps = {\n  fluid: false\n};\nvar Container = React.forwardRef( // Need to define the default \"as\" during prop destructuring to be compatible with styled-components github.com/react-bootstrap/react-bootstrap/issues/3595\nfunction (_ref, ref) {\n  var bsPrefix = _ref.bsPrefix,\n      fluid = _ref.fluid,\n      _ref$as = _ref.as,\n      Component = _ref$as === void 0 ? 'div' : _ref$as,\n      className = _ref.className,\n      props = _objectWithoutPropertiesLoose(_ref, [\"bsPrefix\", \"fluid\", \"as\", \"className\"]);\n\n  var prefix = useBootstrapPrefix(bsPrefix, 'container');\n  return React.createElement(Component, _extends({\n    ref: ref\n  }, props, {\n    className: classNames(className, fluid ? prefix + \"-fluid\" : prefix)\n  }));\n});\nContainer.displayName = 'Container';\nContainer.defaultProps = defaultProps;\nexport default Container;","import _extends from \"@babel/runtime/helpers/esm/extends\";\nimport _objectWithoutPropertiesLoose from \"@babel/runtime/helpers/esm/objectWithoutPropertiesLoose\";\nimport _inheritsLoose from \"@babel/runtime/helpers/esm/inheritsLoose\";\nimport classNames from 'classnames';\nimport React from 'react';\nimport { createBootstrapComponent } from './ThemeProvider';\n\nvar Table =\n/*#__PURE__*/\nfunction (_React$Component) {\n  _inheritsLoose(Table, _React$Component);\n\n  function Table() {\n    return _React$Component.apply(this, arguments) || this;\n  }\n\n  var _proto = Table.prototype;\n\n  _proto.render = function render() {\n    var _this$props = this.props,\n        bsPrefix = _this$props.bsPrefix,\n        className = _this$props.className,\n        striped = _this$props.striped,\n        bordered = _this$props.bordered,\n        borderless = _this$props.borderless,\n        hover = _this$props.hover,\n        size = _this$props.size,\n        variant = _this$props.variant,\n        responsive = _this$props.responsive,\n        props = _objectWithoutPropertiesLoose(_this$props, [\"bsPrefix\", \"className\", \"striped\", \"bordered\", \"borderless\", \"hover\", \"size\", \"variant\", \"responsive\"]);\n\n    var classes = classNames(bsPrefix, className, variant && bsPrefix + \"-\" + variant, size && bsPrefix + \"-\" + size, striped && bsPrefix + \"-striped\", bordered && bsPrefix + \"-bordered\", borderless && bsPrefix + \"-borderless\", hover && bsPrefix + \"-hover\");\n    var table = React.createElement(\"table\", _extends({}, props, {\n      className: classes\n    }));\n\n    if (responsive) {\n      var responsiveClass = bsPrefix + \"-responsive\";\n\n      if (typeof responsive === 'string') {\n        responsiveClass = responsiveClass + \"-\" + responsive;\n      }\n\n      return React.createElement(\"div\", {\n        className: responsiveClass\n      }, table);\n    }\n\n    return table;\n  };\n\n  return Table;\n}(React.Component);\n\nexport default createBootstrapComponent(Table, 'table');"],"sourceRoot":""}