Sha256: 14443b81c625e179d586907aefb21ac6d43d333ceffef8cf2e138309fc7cb964

Contents?: true

Size: 1.95 KB

Versions: 174

Compression:

Stored size: 1.95 KB

Contents

/* @flow */

import React from 'react'
import classnames from 'classnames'
import { Body, SelectableCard, SelectableIcon } from '../'
import { globalProps } from '../utilities/globalProps.js'

import {
  buildAriaProps,
  buildCss,
  buildDataProps,
} from '../utilities/props'

type SelectableCardIconProps = {
  aria?: Object,
  checked?: boolean,
  checkmark: boolean,
  className?: string,
  dark?: boolean,
  data?: Object,
  disabled?: boolean,
  icon?: string,
  inputId?: string,
  multi?: boolean,
  name?: string,
  titleText?: string,
  bodyText?: string,
  value?: string,
  onChange?: (e) => void,
}

const SelectableCardIcon = (props: SelectableCardIconProps) => {
  const {
    aria = {},
    checkmark = false,
    checked = false,
    className,
    dark = false,
    data = {},
    disabled = false,
    icon,
    inputId,
    multi = true,
    name,
    titleText,
    bodyText,
    value,
    onChange,
  } = props

  const ariaProps = buildAriaProps(aria)
  const dataProps = buildDataProps(data)

  const classes = classnames(
    buildCss('pb_selectable_card_icon_kit', {
      checked: checked,
      disabled: disabled,
      enabled: !disabled,
    }),
    globalProps(props),
    className
  )

  return (
    <div
        {...ariaProps}
        {...dataProps}
        className={classes}
    >
      <SelectableCard
          checked={checked}
          dark={dark}
          disabled={disabled}
          icon={checkmark}
          inputId={inputId}
          multi={multi}
          name={name}
          onChange={onChange}
          value={value}
      >
        {
          <>
            <SelectableIcon
                icon={icon}
                inputs="disabled"
                size="2x"
                text={titleText}
            />
            <Body
                color="light"
                dark={dark}
                text={bodyText}
            />
          </>
        }
      </SelectableCard>
    </div>
  )
}

export default SelectableCardIcon

Version data entries

174 entries across 174 versions & 1 rubygems

Version Path
playbook_ui-8.2.1 app/pb_kits/playbook/pb_selectable_card_icon/_selectable_card_icon.jsx
playbook_ui-8.1.3 app/pb_kits/playbook/pb_selectable_card_icon/_selectable_card_icon.jsx
playbook_ui-8.4.0.alpha.dependencies.2 app/pb_kits/playbook/pb_selectable_card_icon/_selectable_card_icon.jsx
playbook_ui-8.4.0.alpha.dependencies.1 app/pb_kits/playbook/pb_selectable_card_icon/_selectable_card_icon.jsx
playbook_ui-8.2.0.pre.alpha4 app/pb_kits/playbook/pb_selectable_card_icon/_selectable_card_icon.jsx
playbook_ui-8.2.0.pre.alpha3 app/pb_kits/playbook/pb_selectable_card_icon/_selectable_card_icon.jsx
playbook_ui-8.2.0 app/pb_kits/playbook/pb_selectable_card_icon/_selectable_card_icon.jsx
playbook_ui-8.1.2 app/pb_kits/playbook/pb_selectable_card_icon/_selectable_card_icon.jsx
playbook_ui-8.1.0.pre.alpha1 app/pb_kits/playbook/pb_selectable_card_icon/_selectable_card_icon.jsx
playbook_ui-8.0.3 app/pb_kits/playbook/pb_selectable_card_icon/_selectable_card_icon.jsx
playbook_ui-8.2.0.pre.alpha2 app/pb_kits/playbook/pb_selectable_card_icon/_selectable_card_icon.jsx
playbook_ui-8.1.1 app/pb_kits/playbook/pb_selectable_card_icon/_selectable_card_icon.jsx
playbook_ui-8.0.2 app/pb_kits/playbook/pb_selectable_card_icon/_selectable_card_icon.jsx
playbook_ui-8.2.0.pre.alpha1 app/pb_kits/playbook/pb_selectable_card_icon/_selectable_card_icon.jsx
playbook_ui-8.1.0 app/pb_kits/playbook/pb_selectable_card_icon/_selectable_card_icon.jsx
playbook_ui-8.0.1 app/pb_kits/playbook/pb_selectable_card_icon/_selectable_card_icon.jsx
playbook_ui-8.0.0 app/pb_kits/playbook/pb_selectable_card_icon/_selectable_card_icon.jsx
playbook_ui-8.0.0.pre.alpha5 app/pb_kits/playbook/pb_selectable_card_icon/_selectable_card_icon.jsx
playbook_ui-8.0.0.pre.alpha4 app/pb_kits/playbook/pb_selectable_card_icon/_selectable_card_icon.jsx
playbook_ui-8.0.0.pre.alpha1 app/pb_kits/playbook/pb_selectable_card_icon/_selectable_card_icon.jsx