import { createElement } from "react";
/**
 * WordPress dependencies
 */
import { forwardRef, useContext } from '@wordpress/element';

/**
 * External dependencies
 */
// eslint-disable-next-line no-restricted-imports
import * as Ariakit from '@ariakit/react';

/**
 * Internal dependencies
 */
import Button from '../button';
import { RadioGroupContext } from './context';
function UnforwardedRadio({
  value,
  children,
  ...props
}, ref) {
  const {
    store,
    disabled
  } = useContext(RadioGroupContext);
  const selectedValue = store?.useState('value');
  const isChecked = selectedValue !== undefined && selectedValue === value;
  return createElement(Ariakit.Radio, {
    disabled: disabled,
    store: store,
    ref: ref,
    value: value,
    render: createElement(Button, {
      variant: isChecked ? 'primary' : 'secondary',
      ...props
    })
  }, children || value);
}

/**
 * @deprecated Use `RadioControl` or `ToggleGroupControl` instead.
 */
export const Radio = forwardRef(UnforwardedRadio);
export default Radio;
//# sourceMappingURL=radio.js.map