Press n or j to go to the next uncovered block, b, p or k for the previous block.
| 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 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 | 1x 4x 4x 4x 1x 1x | import {forwardRef} from 'react'
import PropTypes from 'prop-types'
import PrimitiveInjector from '@s-ui/react-primitive-injector'
import {LINK_TYPES} from '../constants.js'
import AtomTagActionableIcon from './AtomTagActionableIcon.js'
import ActionableTagContainer from './Container.js'
import {getClassNames, ICON_PLACEMENTS} from './settings.js'
import TagLink from './TagLink.js'
const ActionableTag = forwardRef(
(
{
icon,
href,
iconPlacement,
label,
onClick,
target,
rel,
linkFactory = TagLink,
className,
readOnly,
disabled,
title,
as: As,
value = null,
pressed,
defaultPressed,
...props
},
forwardedRef
) => {
const isActionableTagContainer = As === undefined
const Component = isActionableTagContainer ? ActionableTagContainer : As
return (
<PrimitiveInjector
className={getClassNames({className})}
href={href}
target={target}
rel={rel}
pressed={pressed}
defaultPressed={defaultPressed}
>
<Component
link={linkFactory}
ref={forwardedRef}
onClick={onClick}
readOnly={readOnly}
disabled={disabled}
value={value}
label={label}
{...props}
>
<AtomTagActionableIcon
{...(iconPlacement === ICON_PLACEMENTS.LEFT && {icon})}
iconPlacement={ICON_PLACEMENTS.LEFT}
/>
{label ? (
<span className="sui-AtomTag-label" title={title || label}>
{label}
</span>
) : null}
<AtomTagActionableIcon
{...(iconPlacement === ICON_PLACEMENTS.RIGHT && {icon})}
iconPlacement={ICON_PLACEMENTS.RIGHT}
/>
</Component>
</PrimitiveInjector>
)
}
)
ActionableTag.displayName = 'ActionableTag'
ActionableTag.propTypes = {
className: PropTypes.string,
disabled: PropTypes.bool,
readOnly: PropTypes.bool,
label: PropTypes.oneOfType([PropTypes.string, PropTypes.node]).isRequired,
icon: PropTypes.node,
href: PropTypes.string,
iconPlacement: PropTypes.oneOf(Object.values(ICON_PLACEMENTS)),
onClick: PropTypes.func,
target: PropTypes.oneOf(['_self', '_blank', '_parent', '_top']),
rel: PropTypes.arrayOf(PropTypes.oneOf(Object.values(LINK_TYPES))),
linkFactory: PropTypes.elementType,
title: PropTypes.string,
value: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
as: PropTypes.elementType,
pressed: PropTypes.bool,
defaultPressed: PropTypes.bool
}
export default ActionableTag
|