Function RawButton

src/components/rawButton/RawButton.tsx:30–114

({
  index,
  selectedIndex,
  accessibilityLabel,
  children,
  style,
  animatedOnChange,
  onLongPress,
  onLayout,
}: RawButtonProps)

}

const RawButton = ({
  index,
  selectedIndex,
  accessibilityLabel,
  children,
  style,
  animatedOnChange,
  onLongPress,
  onLayout,
}: RawButtonProps) => {
  // refs
  const rootViewRef = useRef<Animated.View>(null);
  const longPressGestureHandlerRef = useRef<LongPressGestureHandler>(null);

  // tap gesture
  const tapGestureState = useValue(State.UNDETERMINED);
  const tapGestureHandler = useGestureHandler({ state: tapGestureState });

  // long press gesture
  const longPressGestureState = useValue(State.UNDETERMINED);
  const longPressGestureHandler = useGestureHandler({
    state: longPressGestureState,
  });

  // effects
  useCode(
    () => [
      onChange(
        tapGestureState,
        cond(eq(tapGestureState, State.END), animatedOnChange(index))
      ),
      onChange(
        longPressGestureState,
        cond(
          eq(longPressGestureState, State.ACTIVE),
          call([], () => {
            onLongPress(index);
          })
        )
      ),
      onChange(
        selectedIndex,
        call([selectedIndex], args => {
          // @ts-ignore
          rootViewRef.current.setNativeProps({
            accessibilityState: {
              selected: args[0] === index,
            },
          });
        })
      ),
    ],
    [index]
  );

  // callbacks
  const handleContainerLayout = useStableCallback(
    ({ nativeEvent: { layout } }: LayoutChangeEvent) =>