Mobile only: Button is not pressable if I change color from undefined to value and back at onPointerUp event #374

const UnstyledButton = () => {
  const [isActive, setActive] = React.useState(false);

  return (
    <h.button
      style={isActive && styles.active}
      type="button"
      role="button"
      onClick={() => alert('!')}
      onPointerDown={() => setActive(true)}
      onPointerUp={() => setActive(false)}
      onPointerOut={() => setActive(false)}
      onPointerCancel={() => setActive(false)}
      onKeyDown={({ key }) => {
        if (key === "Enter" || key === " " || key === "Space") {
          setActive(true);
        }
      }}
      onKeyUp={() => setActive(false)}
      {...props}
    >
      Test Button
    </h.button>
  );
};
UnstyledButton.displayName = "UnstyledButton";

const styles = css.create({
  active: {
    color: '#0f0',
  },
});