{"ast":null,"code":"var __jsx = React.createElement;\nimport { EventContext, ValueContext } from '~/components/RadioGroup';\nimport React, { useCallback, useContext } from 'react';\nimport { backgroundColor, borderColor, borderFocusedColor, borderRadius, borderRadiusShortHand, ellipsis, em, primaryColor, sameBorder, textColor, textInvertColor, transitionProps } from '~/utils/style';\nimport styled from 'styled-components';\nvar height = em(36);\nvar minWidth = em(72);\nvar maxWidth = em(144);\nvar Button = styled.a.withConfig({\n  displayName: \"RadioButton__Button\",\n  componentId: \"sc-15cq2bi-0\"\n})([\"cursor:pointer;background-color:\", \";color:\", \";height:\", \";line-height:calc(\", \" - 2px);min-width:\", \";text-align:center;\", \" \", \";\", \" \", \" &:hover{border-color:\", \";}&:first-of-type{\", \"}&:last-of-type{\", \"}& + &{margin-left:-1px;}\"], function (props) {\n  return props.selected ? primaryColor : backgroundColor;\n}, function (props) {\n  return props.selected ? textInvertColor : textColor;\n}, height, height, minWidth, ellipsis(maxWidth), function (props) {\n  return sameBorder({\n    color: props.selected ? primaryColor : borderColor\n  });\n}, transitionProps(['color', 'border-color', 'background-color']), function (props) {\n  return props.selected ? 'position: relative;' : '';\n}, function (props) {\n  return props.selected ? primaryColor : borderFocusedColor;\n}, borderRadiusShortHand('left', borderRadius), borderRadiusShortHand('right', borderRadius));\n\nvar RadioButton = function RadioButton(_ref) {\n  var className = _ref.className,\n      value = _ref.value,\n      selected = _ref.selected,\n      title = _ref.title,\n      children = _ref.children;\n  var groupValue = useContext(ValueContext);\n  var onChange = useContext(EventContext);\n  var onClick = useCallback(function () {\n    if (value && onChange && groupValue !== value) {\n      onChange(value);\n    }\n  }, [value, onChange, groupValue]);\n  return __jsx(Button, {\n    className: className,\n    title: title,\n    selected: groupValue === value || selected,\n    onClick: onClick\n  }, children);\n};\n\nexport default RadioButton;","map":null,"metadata":{},"sourceType":"module"}