diff --git a/src/Flex/Flex.jsx b/src/Flex/Flex.jsx deleted file mode 100644 index 010e26a4..00000000 --- a/src/Flex/Flex.jsx +++ /dev/null @@ -1,66 +0,0 @@ -import React from 'react'; -import PropTypes from 'prop-types'; - -import { FLEX_PROPS } from './Flex.types'; -import { FlexWrapper } from './FlexWrapper.styles'; - -const Flex = ({ className, children, ...props }) => ( - - {children} - -); - -Flex.propTypes = { - alignItems: PropTypes.oneOf(Object.values(FLEX_PROPS.alignItems)), - alignSelf: PropTypes.oneOf(Object.values(FLEX_PROPS.alignSelf)), - className: PropTypes.string, - /** - If `true`, `display: flex;` otherwise `display: block;` - */ - container: PropTypes.bool, - flex: PropTypes.oneOfType([PropTypes.number, PropTypes.string]), - flexBasis: PropTypes.string, - flexDirection: PropTypes.oneOf(Object.values(FLEX_PROPS.flexDirection)), - flexGrow: PropTypes.number, - flexShrink: PropTypes.number, - flexWrap: PropTypes.oneOf(Object.values(FLEX_PROPS.flexWrap)), - /** - rem or px - */ - height: PropTypes.string, - justifyContent: PropTypes.oneOf(Object.values(FLEX_PROPS.justifyContent)), - justifySelf: PropTypes.oneOf(Object.values(FLEX_PROPS.justifySelf)), - /** - rem or px - */ - maxHeight: PropTypes.string, - /** - rem or px - */ - maxWidth: PropTypes.string, - /** - rem or px - */ - width: PropTypes.string, -}; - -Flex.defaultProps = { - alignItems: undefined, - alignSelf: undefined, - className: undefined, - container: undefined, - flex: undefined, - flexBasis: undefined, - flexDirection: undefined, - flexGrow: undefined, - flexShrink: undefined, - flexWrap: undefined, - height: undefined, - justifyContent: undefined, - justifySelf: undefined, - maxHeight: undefined, - maxWidth: undefined, - width: undefined, -}; - -export default Flex; diff --git a/src/Flex/Flex.stories.jsx b/src/Flex/Flex.stories.jsx deleted file mode 100644 index 8e290e89..00000000 --- a/src/Flex/Flex.stories.jsx +++ /dev/null @@ -1,162 +0,0 @@ -import React from 'react'; - -import { - boolean, - radios, - text, - withKnobs, -} from '@storybook/addon-knobs'; - -import Flex from './Flex'; -import { FLEX_PROPS } from './Flex.types'; -import ProfileCell from '../ProfileCell'; - -import mdx from './Flex.mdx'; - -export default { - title: 'Layouts/Flex', - component: Flex, - decorators: [withKnobs], - parameters: { - docs: { - page: mdx, - }, - }, -}; - -const userNoImage = { - initials: 'RR', - name: 'Riley Researcher', -}; - -export const Default = () => ( - - - - - - - - - ); - -export const FlexContainer = () => ( - <> -

Properties for the parent (flex container)

- - - - - - - - - -); - -export const FlexItem = () => ( - <> -

Properties for the children (flex item)

- - - - - - - - - - - - -); diff --git a/src/Flex/Flex.types.js b/src/Flex/Flex.types.js deleted file mode 100644 index b00bb4f0..00000000 --- a/src/Flex/Flex.types.js +++ /dev/null @@ -1,43 +0,0 @@ -export const FLEX_PROPS = { - alignItems: { - stretch: 'stretch', - center: 'center', - flexStart: 'flex-start', - flexEnd: 'flex-end', - baseline: 'baseline', - initial: 'initial', - inherit: 'inherit', - }, - alignSelf: { - stretch: 'stretch', - center: 'center', - start: 'start', - end: 'end', - }, - flexDirection: { - column: 'column', - columnReverse: 'column-reverse', - row: 'row', - rowReverse: 'row-reverse', - }, - flexWrap: { - wrap: 'wrap', - noWrap: 'no-wrap', - wrapReverse: 'wrap-reverse', - }, - justifyContent: { - flexStart: 'flex-start', - flexEnd: 'flex-end', - spaceBetween: 'space-between', - spaceAround: 'space-around', - center: 'center', - initial: 'initial', - inherit: 'inherit', - }, - justifySelf: { - stretch: 'stretch', - center: 'center', - start: 'start', - end: 'end', - }, -}; diff --git a/src/Flex/index.js b/src/Flex/index.js deleted file mode 100644 index 06063081..00000000 --- a/src/Flex/index.js +++ /dev/null @@ -1,7 +0,0 @@ -import Flex from './Flex'; -import { FLEX_PROPS } from './Flex.types'; - -export { - Flex, - FLEX_PROPS, -}; diff --git a/src/Heading/Heading.jsx b/src/Heading/Heading.jsx deleted file mode 100644 index 2ec7d2c1..00000000 --- a/src/Heading/Heading.jsx +++ /dev/null @@ -1,49 +0,0 @@ -import { createElement } from 'react'; -import PropTypes from 'prop-types'; - -import classNames from 'classnames'; - -import { HEADING_PROPS } from './Heading.types'; -import './Heading.scss'; - -const Heading = ({ - children, - className, - level, - size, - textAlign, - weight, - ...props -}) => createElement( - `h${level}`, - { - style: { textAlign }, - className: classNames( - className, - 'Heading', - { - [`Heading--${size}`]: !!size, - [`Heading--${weight}`]: !!weight, - }, - ), - ...props, - }, children, -); - -Heading.propTypes = { - className: PropTypes.string, - level: PropTypes.oneOf([1, 2, 3, 4, 5, 6]), - size: PropTypes.string, - textAlign: PropTypes.string, - weight: PropTypes.string, -}; - -Heading.defaultProps = { - className: undefined, - level: 2, - size: 'xxl', - textAlign: undefined, - weight: HEADING_PROPS.weight.bold, -}; - -export default Heading; diff --git a/src/Heading/Heading.stories.jsx b/src/Heading/Heading.stories.jsx deleted file mode 100644 index 5dfe5171..00000000 --- a/src/Heading/Heading.stories.jsx +++ /dev/null @@ -1,46 +0,0 @@ -import React from 'react'; - -import Heading from './Heading'; -import mdx from './Heading.mdx'; - -export default { - title: 'Components/Heading', - component: Heading, - parameters: { - docs: { - page: mdx, - }, - }, -}; - -export const Default = () => ( - The fastest way to recruit research participants -); - -export const Levels = () => ( - <> - The fastest way to recruit research participants - The fastest way to recruit research participants - The fastest way to recruit research participants - The fastest way to recruit research participants - The fastest way to recruit research participants - The fastest way to recruit research participants - The fastest way to recruit research participants - -); - -export const Weights = () => ( - <> - The fastest way to recruit research participants - The fastest way to recruit research participants - The fastest way to recruit research participants - -); - -export const Alignment = () => ( - <> - The fastest way to recruit research participants - The fastest way to recruit research participants - The fastest way to recruit research participants - -); diff --git a/src/Heading/Heading.types.js b/src/Heading/Heading.types.js deleted file mode 100644 index ad5d3c0b..00000000 --- a/src/Heading/Heading.types.js +++ /dev/null @@ -1,21 +0,0 @@ -export const HEADING_PROPS = { - textAlign: { - left: 'left', - center: 'center', - right: 'right', - }, - size: { - xxxl: 'xxxl', - xxl: 'xxl', - xl: 'xl', - lg: 'lg', - md: 'md', - sm: 'sm', - xs: 'xs', - }, - weight: { - bold: 'bold', - medium: 'medium', - regular: 'regular', - }, -}; diff --git a/src/Heading/index.js b/src/Heading/index.js deleted file mode 100644 index 7c16ec1f..00000000 --- a/src/Heading/index.js +++ /dev/null @@ -1,7 +0,0 @@ -import Heading from './Heading'; -import { HEADING_PROPS } from './Heading.types'; - -export { - Heading, - HEADING_PROPS, -};