여러 OverlayProvider가 필요한 경우의 권장 패턴 및 experimental_createOverlayContext 안정화 계획

[manNomi]

안녕하세요! 네비게이션 스택 환경에서 오버레이 스코프를 분리하는 방법을 찾다가 질문 드리게 됐습니다.

배경

Stackflow, React Navigation 같은 네비게이션 스택 환경에서 activity/screen별로 독립된 오버레이 스코프가 필요한 상황이 있는데요, 기본 OverlayProvider를 여러 곳에 마운트하면 모든 Provider가 동일한 이벤트 채널을 구독하기 때문에 overlay.open() 호출 시 오버레이가 중복 렌더되는 문제가 발생합니다.

현재 적용 중인 패턴

experimental_createOverlayContext를 React Context로 감싸 "가장 가까운 Provider" 동작을 구현하는 방식으로 해결하고 있습니다.

const OverlayContext = createContext(null);

function OverlayProvider({ children }) {
  const { overlay, OverlayProvider: InternalProvider } = useMemo(
    () => experimental_createOverlayContext(),
    []
  );
  return (
    <OverlayContext.Provider value={overlay}>
      <InternalProvider>{children}</InternalProvider>
    </OverlayContext.Provider>
  );
}

function useOverlay() {
  return useContext(OverlayContext); // 가장 가까운 Provider의 overlay 반환
}

이 패턴을 사용하면 중첩된 Provider 환경에서 useOverlay().open()이 가장 가까운 Provider에만 오버레이를 렌더합니다.

질문 1

위 패턴이 experimental_createOverlayContext의 의도된 사용 방식인지 궁금합니다. 만약 그렇다면 공식 문서나 예제에 추가될 계획이 있으신가요?

질문 2

experimental_ prefix가 언제쯤 제거될 예정인지 여쭤봐도 될까요? 프로덕션에서 안정적으로 사용하기 위한 로드맵이 있다면 공유해 주시면 감사하겠습니다.

추가 제안: 기본 동작 변경

위 패턴이 꽤 유용하다고 느끼면서, 아예 라이브러리 기본 동작으로 흡수하면 어떨까 하는 생각도 들었습니다.

현재는 여러 Provider가 동일한 이벤트 채널을 구독하면 모두 실행되는데, 마운트 순서를 추적해 마지막으로 마운트된 Provider만 이벤트를 처리하도록 변경하는 방향입니다.

// 모듈 레벨에서 활성 Provider 스택 관리
let activeProviderCount = 0;

function OverlayProvider() {
  const myPriority = ++activeProviderCount; // 마운트 시 우선순위 부여

  useOverlayEvent({
    open: (args) => {
      if (myPriority !== activeProviderCount) return; // 마지막 Provider만 처리
      overlayDispatch(...)
    }
  });

  useEffect(() => {
    return () => { activeProviderCount--; }; // 언마운트 시 반환
  }, []);
}

예상 동작은 아래와 같습니다.

ProviderA 마운트 → priority 1 (active)
ProviderB 마운트 → priority 2 (active), A는 대기
overlay.open() → B만 처리

ProviderB 언마운트 → A가 다시 active
overlay.open() → A가 처리

네비게이션 스택처럼 Provider가 중첩되는 환경에서 별도의 Context 래핑 없이도 자연스러운 스코프 분리가 가능해질 것 같아서 제안드립니다. 구현 방향이나 트레이드오프에 대한 의견이 있으시면 말씀해 주시면 감사하겠습니다!