import React from 'react';
import { Box, Text, Header, Button } from '../../index.js';
export default {
  title: 'DesignSystem/Atoms/Box',
  component: Box,
  parameters: {
    controls: {
      include: ['variant']
    }
  }
};
export const Default = props => /*#__PURE__*/React.createElement(Box, props, "Box example");
export const simpleWhiteGrayWrapper = () => /*#__PURE__*/React.createElement(Box, {
  variant: "grey"
}, /*#__PURE__*/React.createElement(Box, {
  variant: "white"
}, /*#__PURE__*/React.createElement(Text, null, "This is the default wrapper in the application")));
export const positioningButtons = () => /*#__PURE__*/React.createElement(Box, {
  variant: "grey"
}, /*#__PURE__*/React.createElement(Box, {
  variant: "white",
  flex: true,
  flexDirection: "row"
}, /*#__PURE__*/React.createElement(Box, {
  flexGrow: 1
}, /*#__PURE__*/React.createElement(Header.H3, null, "Some header")), /*#__PURE__*/React.createElement(Box, {
  flexShrink: 0
}, /*#__PURE__*/React.createElement(Button, null, "Example Button On The Right"))));