diff --git a/src/Busy/index.js b/src/Busy/index.js new file mode 100644 index 0000000..bb5515e --- /dev/null +++ b/src/Busy/index.js @@ -0,0 +1,14 @@ +import PropTypes from 'prop-types'; +import React from 'react'; + +// Storybook story lives in /Progress folder +const Busy = ({ className, children, ...rest }) => { + return ; +}; + +Busy.propTypes = { + paused: PropTypes.bool, + className: PropTypes.string, +}; + +export default Busy; diff --git a/src/Progress/index.js b/src/Progress/index.js new file mode 100644 index 0000000..4600d48 --- /dev/null +++ b/src/Progress/index.js @@ -0,0 +1,15 @@ +import PropTypes from 'prop-types'; +import React from 'react'; +import classnames from 'classnames'; +import useEventListener from '../hooks/useEventListener'; + +const Progress = ({ className, children, value, ...rest }) => { + return ; +}; + +Progress.propTypes = { + value: PropTypes.number, + className: PropTypes.string, +}; + +export default Progress; diff --git a/src/Progress/stories.js b/src/Progress/stories.js new file mode 100644 index 0000000..4b5cc2e --- /dev/null +++ b/src/Progress/stories.js @@ -0,0 +1,21 @@ +import React from 'react'; +import { boolean, number } from '@storybook/addon-knobs/react'; +import { storiesOf } from '@storybook/react'; +import Busy from '../Busy'; +import Progress from './index'; + +storiesOf('Loader', module) + .add('Busy', () => { + let paused = boolean('paused', false); + return ; + }) + .add('Progress', () => { + const options = { + range: true, + min: 0, + max: 100, + step: 1, + }; + let value = number('value', 40, options); + return ; + }); diff --git a/src/index.mjs b/src/index.mjs index 33e8fac..c00e075 100644 --- a/src/index.mjs +++ b/src/index.mjs @@ -1,6 +1,7 @@ /* Export helix-react definition */ import Alert from './Alert'; import Button from './Button'; +import Busy from './Busy'; import Checkbox from './Checkbox'; import ChoiceTile from './ChoiceTile'; import Disclosure from './Disclosure'; @@ -9,6 +10,7 @@ import Drawer from './Drawer'; import Icon from './Icon'; import Modal from './Modal'; import Pill from './Pill'; +import Progress from './Progress'; import Status from './Pill/Status'; import Popover from './Popover'; import Radio from './Radio'; @@ -24,6 +26,7 @@ import Tooltip from './Tooltip'; export { Alert, Button, + Busy, Checkbox, ChoiceTile, Disclosure, @@ -33,6 +36,7 @@ export { Modal, Pill, Popover, + Progress, Radio, RadioSet, Search,