message: fix: focus and press state addition in web radio
diff: @@ -15,7 +15,6 @@ import { CircleIcon } from '../Icon/Icons';
  import { useHasResponsiveProps } from '../../../hooks/useHasResponsiveProps';
  import { combineContextAndProps, isEmptyObj } from '../../../utils';
  import { useFormControlContext } from '../../composites/FormControl';
  -
  const RadioComponent = memo(
  forwardRef(
  (
  @@ -26,6 +25,8 @@ const RadioComponent = memo(
  children,
  wrapperRef,
  isHovered: isHoveredProp,
  + isPressed: isPressedProp,
  + isFocused: isFocusedProp,
  isFocusVisible: isFocusVisibleProp,
  ...props
  }: any,
  @@ -37,7 +38,21 @@ const RadioComponent = memo(
  const { isHovered } = useHover({}, _ref);
  const mergedRefs = mergeRefs([_ref, wrapperRef]);
  const { focusProps, isFocusVisible } = useFocusRing();
  + const [isFocused, setFocused] = React.useState(isFocusedProp);
  + const [isPressed, setPressed] = React.useState(isPressedProp);
  + const handleFocus = () => {
  + setFocused(true);
  + };
  + const handleBlur = () => {
  + isFocusedProp ? setFocused(true) : setFocused(false);
  + };
  + const handlePressIn = () => {
  + setPressed(true);
  + };
  + const handlePressOut = () => {
  + isPressedProp ? setPressed(true) : setPressed(false);
  + };
  const {
  _interactionBox,
  _icon,
  @@ -47,11 +62,13 @@ const RadioComponent = memo(
  } = usePropsResolution('Radio', combinedProps, {
  isInvalid,
  isReadOnly,
  - isFocusVisible: isFocusVisibleProp || isFocusVisible,
  + isFocusVisible: isFocusVisibleProp || isFocused || isFocusVisible,
  isDisabled,
  isIndeterminate,
  isChecked,
  isHovered: isHoveredProp || isHovered,
  + isPressed,
  + isFocused,
  });
  // only calling below function when icon exist.
  @@ -89,10 +106,18 @@ const RadioComponent = memo(
  accessibilityRole="label"
  ref={mergedRefs}
  >
  + <div onMouseDown={handlePressIn} onMouseUp={handlePressOut}>
  <VisuallyHidden>
  - <input {...inputProps} {...focusProps} ref={ref} />
  + <input
  + {...inputProps}
  + {...focusProps}
  + ref={ref}
  + onFocus={handleFocus}
  + onBlur={handleBlur}
  + />
  </VisuallyHidden>
  {component}
  + </div>
  </Box>
  );
  }
  @@ -105,6 +130,8 @@ const Radio = (
  children,
  wrapperRef,
  isHovered: isHoveredProp,
  + isPressed,
  + isFocused: isFocusedProp,
  isFocusVisible: isFocusVisibleProp,
  ...props
  }: IRadioProps,
  @@ -154,6 +181,8 @@ const Radio = (
  icon={icon}
  wrapperRef={wrapperRef}
  isHovered={isHoveredProp}
  + isPressed={isPressed}
  + isFocused={isFocusedProp}
  isFocusVisible={isFocusVisibleProp}
  />
  );
  