message: fix: hover and press issue in close icon button
diff: import React, { memo, forwardRef } from 'react';
  import { ModalContext } from './Context';
  import { usePropsResolution } from '../../../hooks';
  -import Button from '../../primitives/Button/Button';
  +import { Pressable } from '../../primitives/Pressable';
  import { CloseIcon } from '../../primitives/Icon/Icons';
  import type { IButtonProps } from '../../primitives/Button';
  import { useHasResponsiveProps } from '../../../hooks/useHasResponsiveProps';
  -import { useHover } from '@react-native-aria/interactions';
  -import { mergeRefs } from '../../../utils';
  +import {
  + useHover,
  + useFocus,
  + useIsPressed,
  +} from '../../primitives/Pressable/Pressable';
  +import { composeEventHandlers } from '../../../utils';
  +import { useFocusRing } from '@react-native-aria/focus';
  const ModalCloseButton = (props: IButtonProps, ref?: any) => {
  - const _ref = React.useRef(null);
  - const { isHovered } = useHover({}, _ref);
  - const { _icon, ...resolvedProps } = usePropsResolution(
  - 'ModalCloseButton',
  - props,
  - { isHovered }
  - );
  + const { hoverProps, isHovered } = useHover();
  + const { pressableProps, isPressed } = useIsPressed();
  + const { focusProps, isFocused } = useFocus();
  + const { isFocusVisible, focusProps: focusRingProps }: any = useFocusRing();
  +
  + const {
  + _icon,
  + onPressIn,
  + onPressOut,
  + onHoverIn,
  + onHoverOut,
  + onFocus,
  + onBlur,
  + ...resolvedProps
  + } = usePropsResolution('ModalCloseButton', props, {
  + isHovered,
  + isPressed,
  + isFocused,
  + isFocusVisible,
  + });
  const { handleClose } = React.useContext(ModalContext);
  //TODO: refactor for responsive prop
  if (useHasResponsiveProps(props)) {
  return null;
  }
  return (
  - <Button
  - variant="ghost"
  - {...resolvedProps}
  + <Pressable
  + accessibilityRole="button"
  + ref={ref}
  + onPressIn={composeEventHandlers(onPressIn, pressableProps.onPressIn)}
  + onPressOut={composeEventHandlers(onPressOut, pressableProps.onPressOut)}
  + // @ts-ignore - web only
  + onHoverIn={composeEventHandlers(onHoverIn, hoverProps.onHoverIn)}
  + // @ts-ignore - web only
  + onHoverOut={composeEventHandlers(onHoverOut, hoverProps.onHoverOut)}
  + // @ts-ignore - web only
  + onFocus={composeEventHandlers(
  + composeEventHandlers(onFocus, focusProps.onFocus),
  + focusRingProps.onFocus
  + )}
  + // @ts-ignore - web only
  + onBlur={composeEventHandlers(
  + composeEventHandlers(onBlur, focusProps.onBlur),
  + focusRingProps.onBlur
  + )}
  onPress={handleClose}
  - accessibilityLabel="Close dialog"
  - ref={mergeRefs([ref, _ref])}
  + {...resolvedProps}
  >
  <CloseIcon {..._icon} />
  - </Button>
  + </Pressable>
  );
  };
  