Contents

import React from "react"
import SelectableCard from "../_selectable_card.jsx"
import Icon from "../../pb_icon/_icon.jsx"


class SelectableCardDefault extends React.Component {
  state = {
    selected_with_icon: true,
    selected_without_icon: true,
    unselected: false
  }

  handleSelect = event => {
    this.setState({
      [event.target.id]: event.target.checked
    })
  }

  render() {
    return (
      <div class="pb--doc-demo-row">

        <SelectableCard
            inputId="selected_with_icon"
            name="selected_with_icon"
            value="selected_with_icon"
            icon={true}
            checked={this.state.selected_with_icon}
            onChange={this.handleSelect}>
          {`Selected, with icon`}
        </SelectableCard>

        <SelectableCard
            inputId="selected_without_icon"
            name="selected_without_icon"
            value="selected_without_icon"
            icon={false}
            checked={this.state.selected_without_icon}
            onChange={this.handleSelect}>
          {`Selected, without icon`}
        </SelectableCard>

        <SelectableCard
            inputId="unselected"
            name="unselected"
            value="unselected"
            checked={this.state.unselected}
            onChange={this.handleSelect}>
          {`Unselected`}
        </SelectableCard>

        <SelectableCard
            inputId="disabled"
            name="disabled"
            value="disabled"
            disabled={true}
            checked={this.state.disabled}
            onChange={this.handleSelect}>
          {`Disabled`}
        </SelectableCard>

      </div>
    )
  }
}

export default SelectableCardDefault;

Version data entries

3 entries across 3 versions & 1 rubygems

Version	Path
playbook_ui-3.1.0	app/pb_kits/playbook/pb_selectable_card/docs/_selectable_card_default.jsx
playbook_ui-3.0.1	app/pb_kits/playbook/pb_selectable_card/docs/_selectable_card_default.jsx
playbook_ui-3.0.0	app/pb_kits/playbook/pb_selectable_card/docs/_selectable_card_default.jsx