Sha256: 4507417ef0d41a8c5687447e748991774a5ddc884446f08f95321d682ff7540d

Contents?: true

Size: 1.75 KB

Versions: 10

Compression:

Stored size: 1.75 KB

Contents

import React from 'react'
import classnames from 'classnames'
import { buildAriaProps, buildCss, buildDataProps, buildHtmlProps, noop } from '../utilities/props'
import { globalProps } from '../utilities/globalProps'

import Button from '../pb_button/_button'
import Icon from '../pb_icon/_icon'

type CircleIconButtonProps = {
  aria?: { [key: string]: string },
  className?: string,
  dark?: boolean,
  data?: { [key: string]: string },
  disabled?: boolean,
  icon: string,
  htmlOptions?: {[key: string]: string | number | boolean | Function},
  id?: string,
  link?: string,
  onClick?: React.MouseEventHandler<HTMLElement>,
  newWindow?: boolean,
  type?: 'button' | 'submit' | 'reset' | undefined,
  variant?: 'primary' | 'secondary' | 'link',
}

const CircleIconButton = (props: CircleIconButtonProps): React.ReactElement => {
  const {
    aria = {},
    className,
    dark,
    data = {},
    disabled,
    htmlOptions = {},
    icon,
    id,
    onClick = noop,
    type,
    link,
    newWindow,
    variant,
  } = props

  const ariaProps = buildAriaProps(aria)
  const dataProps = buildDataProps(data)
  const htmlProps = buildHtmlProps(htmlOptions)
  const classes = classnames(
    buildCss('pb_circle_icon_button_kit'),
    globalProps(props),
    className
  )

  return (
    <div
        {...ariaProps}
        {...dataProps}
        {...htmlProps}
        className={classes}
        id={id}
    >
      <Button
          dark={dark}
          disabled={disabled}
          htmlType={type}
          link={link}
          newWindow={newWindow}
          onClick={onClick}
          text={null}
          variant={variant}
      >
        <Icon
            fixedWidth
            icon={icon}
        />
      </Button>
    </div>
  )
}

export default CircleIconButton

Version data entries

10 entries across 10 versions & 1 rubygems

Version Path
playbook_ui-13.14.0.pre.alpha.PLAY1109bugdisplaypropblocksfontcolor1784 app/pb_kits/playbook/pb_circle_icon_button/_circle_icon_button.tsx
playbook_ui-13.14.0.pre.alpha.play1106filter1751 app/pb_kits/playbook/pb_circle_icon_button/_circle_icon_button.tsx
playbook_ui-13.14.0.pre.alpha.play1106filter1748 app/pb_kits/playbook/pb_circle_icon_button/_circle_icon_button.tsx
playbook_ui-13.14.0 app/pb_kits/playbook/pb_circle_icon_button/_circle_icon_button.tsx
playbook_ui-13.13.0.pre.alpha.PLAY1097linterenhancedelement1728 app/pb_kits/playbook/pb_circle_icon_button/_circle_icon_button.tsx
playbook_ui-13.13.0.pre.alpha.play10221678 app/pb_kits/playbook/pb_circle_icon_button/_circle_icon_button.tsx
playbook_ui-13.13.0.pre.alpha.PLAY1090csstokens1675 app/pb_kits/playbook/pb_circle_icon_button/_circle_icon_button.tsx
playbook_ui-13.13.0.pre.alpha.play900startratingasinput1657 app/pb_kits/playbook/pb_circle_icon_button/_circle_icon_button.tsx
playbook_ui-13.13.0 app/pb_kits/playbook/pb_circle_icon_button/_circle_icon_button.tsx
playbook_ui-13.12.0.pre.alpha.play10281596 app/pb_kits/playbook/pb_circle_icon_button/_circle_icon_button.tsx