Sha256: 7de5791c3ecbf6fddd44bcb5471fcfc8406a28e7013e35c2127d3799343c5330
Contents?: true
Size: 1.01 KB
Versions: 28
Compression:
Stored size: 1.01 KB
Contents
/* @flow */
import React from 'react'
import classnames from 'classnames'
import { buildCss } from '../utilities/props'
type CardPropTypes = {
children: Array<React.ReactNode> | React.ReactNode,
className?: String,
highlight?: {
position?: 'side' | 'top',
color?: String
},
padding?: 'none' | 'xs' | 'sm' | 'md' | 'lg' | 'xl',
selected?: Boolean,
shadow?: 'none' | 'shallow' | 'default' | 'deep' | 'deeper' | 'deepest',
}
const Card = ({
children,
className,
highlight = {},
padding = 'md',
selected = false,
shadow = 'none',
}: CardPropTypes) => {
const bodyCSS = buildCss('pb_card_body_kit', padding)
const cardCss = buildCss('pb_card_kit', `shadow_${shadow}`, {
selected,
deselected: !selected,
[`highlight_${highlight.position}`]: highlight.position,
[`highlight_${highlight.color}`]: highlight.color,
})
return (
<div className={classnames(cardCss, className)}>
<div className={bodyCSS}>
{children}
</div>
</div>
)
}
export default Card
Version data entries
28 entries across 28 versions & 1 rubygems