-
Notifications
You must be signed in to change notification settings - Fork 66
/
index.tsx
49 lines (42 loc) · 1.19 KB
/
index.tsx
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
import { css } from 'glamor'
import React from 'react'
import PropTypes from 'prop-types'
import Button from '@pluralsight/ps-design-system-button'
import filterReactProps from '@pluralsight/ps-design-system-filter-react-props'
import { CaretLeftIcon } from '@pluralsight/ps-design-system-icon'
import stylesheet from '../css/index.js'
const styles = {
breadcrumb: _ => css(stylesheet['.psds-breadcrumb'])
}
const Breadcrumb = React.forwardRef((props, ref) => {
const { disabled, href, loading, onClick, ...rest } = props
return (
<div {...filterReactProps(rest)} {...styles.breadcrumb(props)}>
<Button
appearance={Button.appearances.flat}
href={href}
disabled={disabled}
icon={<CaretLeftIcon />}
loading={loading}
onClick={onClick}
ref={ref}
size={Button.sizes.small}
>
{props.children}
</Button>
</div>
)
})
Breadcrumb.propTypes = {
className: PropTypes.string,
children: PropTypes.node,
disabled: PropTypes.bool,
href: PropTypes.string,
loading: PropTypes.bool,
onClick: PropTypes.func,
style: PropTypes.object
}
Breadcrumb.defaultProps = {
disabled: false
}
export default Breadcrumb