diff --git a/src/style-sheet/index.ts b/src/style-sheet/index.ts
index 655ef51..098a4d9 100644
--- a/src/style-sheet/index.ts
+++ b/src/style-sheet/index.ts
@@ -11,7 +11,7 @@ export const NativeWindStyleSheet = {
setDimensions: runtime.setDimensions.bind(runtime),
setAppearance: runtime.setAppearance.bind(runtime),
setPlatform: runtime.setPlatform.bind(runtime),
- setPreprocessed: runtime.setPreprocessed.bind(runtime),
+ setCSS: runtime.setPreprocessed.bind(runtime),
setDangerouslyCompileStyles:
runtime.setDangerouslyCompileStyles.bind(runtime),
};
diff --git a/src/style-sheet/runtime.ts b/src/style-sheet/runtime.ts
index 9929a09..b494b3f 100644
--- a/src/style-sheet/runtime.ts
+++ b/src/style-sheet/runtime.ts
@@ -123,13 +123,13 @@ export class StyleSheetRuntime extends ColorSchemeStore {
setDimensions(dimensions: Dimensions) {
this.window = dimensions.get("window");
- const screen = dimensions.get("screen");
- this.orientation = screen.height >= screen.width ? "portrait" : "landscape";
+ this.orientation =
+ this.window.height >= this.window.width ? "portrait" : "landscape";
this.dimensionListener?.remove();
this.dimensionListener = dimensions.addEventListener(
"change",
- ({ window, screen }) => {
+ ({ window }) => {
const topics: string[] = ["window"];
if (window.width !== this.window.width) topics.push("width");
@@ -138,7 +138,7 @@ export class StyleSheetRuntime extends ColorSchemeStore {
this.window = window;
const orientation =
- screen.height >= screen.width ? "portrait" : "landscape";
+ window.height >= window.width ? "portrait" : "landscape";
if (orientation !== this.orientation) topics.push("orientation");
this.orientation = orientation;
diff --git a/website/docs/api/native-wind-style-sheet.md b/website/docs/api/native-wind-style-sheet.md
new file mode 100644
index 0000000..687f00e
--- /dev/null
+++ b/website/docs/api/native-wind-style-sheet.md
@@ -0,0 +1,21 @@
+# NativeWindStyleSheet
+
+A StyleSheet is an abstraction similar to CSS StyleSheets and React Native's StyleSheet.
+
+## Methods
+
+### setPlatform(platform: Platform.OS)
+
+Override the platform used by the platform prefixes. Defaults to Platform.OS
+
+### setCss(boolean)
+
+Override if the StyleSheet should use setCss or native styles. Defaults to `true` if Platform.OS === `web` && React Native Web >0.18.
+
+### setDimensions(dimensions: Dimensions)
+
+Override how window dimensions are calculated. Defaults to Dimensions from React Native.
+
+### setAppearance(appearance: Appearance)
+
+Override the app's appearance. Defaults to Appearance from React Native.
diff --git a/website/docs/api/tailwind-provider.md b/website/docs/api/tailwind-provider.md
deleted file mode 100644
index e51fc37..0000000
--- a/website/docs/api/tailwind-provider.md
+++ /dev/null
@@ -1,29 +0,0 @@
----
-title: TailwindProvider
-sidebar_label:
----
-
-All components need to be within the context of the TailwindProvider.
-
-```tsx
-import { TailwindProvider } from "tailwindcss-react-native";
-
-function MyAppsProviders({ children }) {
- return {children};
-}
-```
-
-## Options
-
-| Prop | Values | Default | Description |
-| ------------------ | ----------------- | ----------------------------------------- | ------------------------------------- |
-| initialColorScheme | `ColorSchemeName` | `Appearance.getColorScheme() ?? 'light'` | Set an ColorScheme value. |
-| webOutput | `css`, `native` | `ReactNativeWeb >=0.8 ? 'css' : 'native'` | Specify how web styles are outputted. |
-
-## Advanced options
-
-| Prop | Values | Default | Description |
-| -------- | ------------------------ | ----------- | ----------------------------------------------------------- |
-| platform | Override the Platform.OS | Platform.OS | Used to match platform media queries |
-| style | Compiled style object | `undefined` | For manual injection via the [CLI](../guides/cli-native.md) |
-| media | Compiled media object | `undefined` | For manual injection via the [CLI](../guides/cli-native.md) |
diff --git a/website/docs/guides/tailwindcss-react-native.md b/website/docs/guides/tailwindcss-react-native.md
index 35f5221..f60eab3 100644
--- a/website/docs/guides/tailwindcss-react-native.md
+++ b/website/docs/guides/tailwindcss-react-native.md
@@ -10,7 +10,7 @@ The TailwindProvider is no longer required, unless you wish to inject styles or
Nativewind defaults to CSS for web if using React Native Web >=0.18
-You can control this setting via the `webOutput` option on `TailwindProvider`.
+You can control this setting via the `NativeWindStyleSheet.setPreprocessed(false)`
## useTailwind()
diff --git a/website/sidebars.js b/website/sidebars.js
index 9a5c385..49bba66 100644
--- a/website/sidebars.js
+++ b/website/sidebars.js
@@ -69,8 +69,8 @@ const sidebars = {
items: [
"api/styled",
"api/StyledComponent",
- "api/tailwind-provider",
"api/use-color-scheme",
+ "api/native-wind-style-sheet",
"api/use-tailwind",
],
},