How to create boundary in React?

Question

I have a form and a list. I want to put them inside a parent component (a boundary) and I want to change their form and behavior based on the detection of the presence of the boundary.

Here's my idea:

const ParentChildrenPage = () => {
    return <ParentChildren>
         <ParentForm />
         <ChildrenList />
    </ParentChildren>
}

Here are some notes:

1. ParentForm when rendred by itself, has a Cancel button that returns the user to the previous page. But when it's rendered inside the ParentChildren it should not show that Cancel button, and on Save it should not navigate user to the previous page, but should stay in that page.
2. ChildrenList has a Add button on top of it. When shown by itself it navigates user to a child creation form. But when it detects that it's rendered inside ParentChildren its Add button should show a dialog form.

Basically, I'm trying to create the notion of boundary and let children components detect that they are rendered inside that boundary and adjust their structure and behavior accordingly.

How can I do this?