Components use first theme provider instead of the closes one

[tbntdima]

Here is a basic example:

      <ThemeProvider
        theme={{theme}
      >
         <ThemeProvider
           theme={{ ...theme, breakpoints: ["40em", "100em", "200em"] }}
         >
            <Box /> // it's using first theme breakpoints
        </ThemeProvider>
     </ThemeProvider>

Is it how it suppose to work, or I am doing something wrong?