fix(web): missing react-native-web and expo web support

[theonetheycallneo]

Can we stub out these for now for web?

import { Fragment } from "react"
import { View } from "react-native"

export const useA11yOrder = () => {
  return { Order: View, Index: Fragment }
}

[theonetheycallneo]

Love your work, btw!

[ArturKalach]

Hello @theonetheycallneo,

Thank you so much for your support and for creating the issue. I have seen that we can use the .web|.native extension, and I will try to test it this week.

Unfortunately, I don't have much experience with react-native-web and expo. Currently, my priority list is focused on classin ReactNative (Android and iOS), but perhaps in a few months, I will explore Expo as well.

[ArturKalach]

Hello @theonetheycallneo ,

I have tried to do my best with react-native-web, but unfortunately, the ordering is limited for the web (react-native-web). As I have seen, aria-flowto is hardly supported by screen readers, and tabindex is limited by react-native-web (only 0 or -1 is available).

I will add a "stub" this week, but I have no idea how to implement the order feature for the web.

Approx it will be like this:

//index.web.ts
import { createRef, forwardRef, useImperativeHandle, useRef } from 'react';
import { UIManager, View } from 'react-native';

/**
 * @deprecated The method should not be used
 * This API is going to be removed in future releases, you can find migration instruction here: https://github.com/ArturKalach/react-native-a11y-order?tab=readme-ov-file#migration
 */
export const useFocusOrder = () => ({
  a11yOrder: {
    ref: createRef(),
    onLayout: () => {},
  },
  refs: [],
  reset: () => {},
  setOrder: () => {},
});

/**
 * @deprecated The method should not be used
 * This API is going to be removed in future releases, you can find migration instruction here: https://github.com/ArturKalach/react-native-a11y-order?tab=readme-ov-file#migration
 */
export const useDynamicFocusOrder = () => ({
  a11yOrder: {
    ref: createRef(),
    onLayout: () => {},
  },
  registerOrder: () => createRef,
  reset: () => {},
  setOrder: () => {},
});

export const useA11yOrderManager = () => ({
  registerOrderRef: () => () => {},
  updateRefList: () => {},
  reset: () => {},
  setOrder: () => {},
});

/**
 * @deprecated The method should not be used
 * This API is going to be removed in future releases, you can find migration instruction here: https://github.com/ArturKalach/react-native-a11y-order?tab=readme-ov-file#migration
 */
export const A11yOrder = View;

const FocusableView = forwardRef((props, ref) => {
  const viewRef = useRef(undefined)
  useImperativeHandle(ref, () => ({
    focus: () => {
      if(viewRef.current) {
        UIManager.focus(viewRef.current)
      }
    }
  }))

  return <View {...props} ref={viewRef}/>
})

export const A11y = {
  Order: View,
  Group: View,
  Index: FocusableView,
};

[ArturKalach]

Hello @theonetheycallneo,

I have added the stub to the 0.2.1 version. Could you verify it on your side and help with updating the issue status? Thank you in advance