refactor: remove conditional ThemeProvider

README.md

@@ -120,8 +120,6 @@ export * from '@fragment-build/ui';
 
 Now just import all the components you need from this file.
 
-Additionally you need to pass the `useNextJS` prop to the `FragmentUIProvider`.
-
 ## 🤝 Contributing
 
 Feel free to fork and make a Pull Request to this project. All the input is warmly welcome!

src/provider.tsx

@@ -6,15 +6,13 @@ import { FragmentUIContext, defaultContext } from "./context";
 
 interface FragmentUIProviderProps {
   children: React.ReactNode;
-  useNextJS?: boolean;
   locale?: NextUIProviderProps['locale'];
   navigate?: NextUIProviderProps['navigate'];
   defaults?: FragmentUIContext['defaults']
 }
 
 export const FragmentUIProvider: React.FC<FragmentUIProviderProps> = ({
   children,
-  useNextJS = false,
   defaults = {},
   ...rest
 }) => {
@@ -24,13 +22,13 @@ export const FragmentUIProvider: React.FC<FragmentUIProviderProps> = ({
     setContext((oldContext) => deepMerge(oldContext, { defaults }))
   }, [defaults])
 
-  const render = useNextJS
-    ? <ThemeProvider attribute="class">{children}</ThemeProvider>
-    : children;
-
   return (
     <FragmentUIContext.Provider value={context}>
-      <NextUIProvider {...rest}>{render}</NextUIProvider>
+      <NextUIProvider {...rest}>
+        <ThemeProvider attribute="class">
+          {children}
+        </ThemeProvider>
+      </NextUIProvider>
     </FragmentUIContext.Provider>
   );
 }

src/withFragment.tsx

@@ -1,18 +1,19 @@
-import {  useContext } from "react";
+import { forwardRef, useContext } from "react";
 import deepMerge from "deepmerge";
 import { FragmentUIContext } from "./context";
 
 // eslint-disable-next-line @typescript-eslint/no-explicit-any
-export function withFragment<P extends React.ComponentType<any>>(Component: P, configId: keyof FragmentUIContext['defaults']): P {
-  const ComponentWithContext = (props: React.ComponentProps<P>) => {
+export function withFragment<C extends React.ComponentType<any>>(Component: C, configId: keyof FragmentUIContext['defaults']): C {
+  const ComponentWithContext = forwardRef((props: React.ComponentProps<C>, ref) => {
     const context = useContext(FragmentUIContext);
-    return <Component {...deepMerge<P>(context['defaults'][configId] as React.ComponentProps<P> || {}, props) as React.ComponentProps<P>}/>
-  };
+    return <Component {...deepMerge(context['defaults'][configId] as React.ComponentProps<C> || {}, props)} ref={ref} />
+  });
 
   // fix react-aria collection
   if ('getCollectionNode' in Component) {
-    (ComponentWithContext as typeof Component).getCollectionNode = Component.getCollectionNode;
+    // eslint-disable-next-line @typescript-eslint/no-explicit-any
+    (ComponentWithContext as any).getCollectionNode = Component.getCollectionNode;
   }
 
-  return ComponentWithContext as P;
-}
+  return ComponentWithContext as unknown as C;
+}