Sha256: 3cd9f9d38bec209cf3b3c18dc444ae3f0949365b35c7539816073773452a6134
Contents?: true
Size: 1.35 KB
Versions: 1919
Compression:
Stored size: 1.35 KB
Contents
import React, { useState } from 'react'
import Body from '../../pb_body/_body'
import Image from '../../pb_image/_image'
import SelectableCard from '../../pb_selectable_card/_selectable_card'
const SelectableCardImage = (props) => {
const [selectedImage, setSelectedImage] = useState(true)
const [unselectedImage, setUnselectedImage] = useState(false)
return (
<div className="pb--doc-demo-row">
<SelectableCard
checked={selectedImage}
icon
inputId="selectableImage"
name="selectableImage"
onChange={() => setSelectedImage(!selectedImage)}
value="selectableImage"
{...props}
>
<Image
rounded
size="xl"
url="https://unsplash.it/500/400/?image=634"
{...props}
/>
<Body>{'Add text here'}</Body>
</SelectableCard>
<SelectableCard
checked={unselectedImage}
icon
inputId="unselectedImage"
name="unselectedImage"
onChange={() => setUnselectedImage(!unselectedImage)}
value="unselectedImage"
{...props}
>
<Image
rounded
size="xl"
url="https://unsplash.it/500/400/?image=634"
{...props}
/>
</SelectableCard>
</div>
)
}
export default SelectableCardImage
Version data entries
1,919 entries across 1,919 versions & 2 rubygems