How to create a dynamic theme with good practices for my component?

I need to create a dynamic theme for a given Component or several others, where the same is used techniques of clean code and good practices referring to folder structuring, Separation of files by types among others.

I'm using styled-component (this tag does not exist in the Brazilian community ) for the stylization of my components, where in this documentation says the following about " Theming":

Theming:

Styled-components has full theme support by exporting a wrapper component . This component provides a theme for all React components behind the context API. In the render tree, all styled components will have access to the provided theme, even when they have multiple levels of depth.

Note: returns your children to the Render, therefore, should involve only a single child node, as it can be used as the root of the render () method .

For more details on the same go to this direct link of the documentation

What are my problems?

• difficulty integrating this into my component
• difficulty in integrating using all the best practices of folder structuring, file type separation and features

Note:

I do not have an initial code to post, because as I said above in my problems I am having difficulty integrating the "Theming" of styled-component with React + ReactJS logic.