@carbon/react/es/components/ComposedModal/ComposedModalPresence.js

React components for the Carbon Design System

/**
 * Copyright IBM Corp. 2016, 2023
 *
 * This source code is licensed under the Apache-2.0 license found in the
 * LICENSE file in the root directory of this source tree.
 */

import React, { createContext, useContext, useMemo } from 'react';
import { usePresenceContext } from '../../internal/usePresenceContext.js';
import { useComposedModalState } from './useComposedModalState.js';

const ComposedModalPresence = ({
  open,
  _presenceId: presenceId,
  _autoEnablePresence: autoEnablePresence = true,
  children
}) => {
  // Since the modal could be used without an onClose callback, we need to be aware of the internal isOpen state
  const modalState = useComposedModalState(open);
  const [isOpen] = modalState;
  const [isPresent, context] = usePresenceContext(isOpen, presenceId);
  const presenceContextValue = useMemo(() => ({
    modalState,
    autoEnablePresence,
    ...context
  }), [modalState, autoEnablePresence, context]);
  if (!isPresent) return null;
  return /*#__PURE__*/React.createElement(ComposedModalPresenceContext, {
    value: presenceContextValue
  }, children);
};
const ComposedModalPresenceContext = /*#__PURE__*/createContext(undefined);

/**
 * Handles occurrences where only a single composed modal must consume a context.
 */
const useExclusiveComposedModalPresenceContext = id => {
  const ctx = useContext(ComposedModalPresenceContext);
  return ctx?.isPresenceExclusive(id) ? ctx : undefined;
};

export { ComposedModalPresence, ComposedModalPresenceContext, useExclusiveComposedModalPresenceContext };