Sha256: b7f4c1ca705a87ca1afad4cbd0301a562f6a50ab24d745b6e40baee60a84bba4
Contents?: true
Size: 1.64 KB
Versions: 1772
Compression:
Stored size: 1.64 KB
Contents
import React, { useState } from 'react'
import SelectableCard from '../_selectable_card.tsx'
const SelectableCardDefault = (props) => {
const [selectedWithIcon, setSelectedWithIcon] = useState(true)
const [selectedNoIcon, setSelectedNoIcon] = useState(true)
const [unselected, setUnselected] = useState(false)
const [disabled, setDisabled] = useState(false)
return (
<div className="pb--doc-demo-row">
<SelectableCard
checked={selectedWithIcon}
icon
inputId="selectedWithIcon"
name="selectedWithIcon"
onChange={() => setSelectedWithIcon(!selectedWithIcon)}
value="selectedWithIcon"
{...props}
>
{'Selected, with icon'}
</SelectableCard>
<SelectableCard
checked={selectedNoIcon}
inputId="selectedWithoutIcon"
name="selectedWithoutIcon"
onChange={() => setSelectedNoIcon(!selectedNoIcon)}
value="selectedWithoutIcon"
{...props}
>
{'Selected, without icon'}
</SelectableCard>
<SelectableCard
checked={unselected}
inputId="unselected"
name="unselected"
onChange={() => setUnselected(!unselected)}
value="unselected"
{...props}
>
{'Unselected'}
</SelectableCard>
<SelectableCard
checked={disabled}
disabled
inputId="disabled"
name="disabled"
onChange={() => setDisabled(!disabled)}
value="disabled"
{...props}
>
{'Disabled'}
</SelectableCard>
</div>
)
}
export default SelectableCardDefault
Version data entries
1,772 entries across 1,772 versions & 2 rubygems