react-native-unistyles 3.0.24 → 3.1.0

package/plugin/index.js

@@ -33,8 +33,8 @@ __export(index_exports, {
   default: () => index_default
 });
 module.exports = __toCommonJS(index_exports);
-var import_node_path2 = __toESM(require("node:path"));
 var t6 = __toESM(require("@babel/types"));
+var import_node_path2 = __toESM(require("node:path"));
 
 // plugin/src/consts.ts
 var REACT_NATIVE_COMPONENT_NAMES = [
@@ -81,75 +81,46 @@ var NATIVE_COMPONENTS_PATHS = {
 };
 
 // plugin/src/exotic.ts
+var t2 = __toESM(require("@babel/types"));
+
+// plugin/src/import.ts
 var t = __toESM(require("@babel/types"));
-function handleExoticImport(path2, state, exoticImport) {
-  const specifiers = path2.node.specifiers;
-  const source = path2.node.source;
-  if (path2.node.importKind !== "value") {
-    return;
+function getComponentPath(state, name) {
+  if (!state.opts.isLocal) {
+    return `react-native-unistyles/components/native/${name}`;
   }
-  specifiers.forEach((specifier) => {
-    for (const rule of exoticImport.imports) {
-      const hasMatchingImportType = !rule.isDefault && t.isImportSpecifier(specifier) || rule.isDefault && t.isImportDefaultSpecifier(specifier);
-      const hasMatchingImportName = rule.isDefault || !rule.isDefault && rule.name === specifier.local.name;
-      const hasMatchingPath = rule.path === source.value;
-      if (!hasMatchingImportType || !hasMatchingImportName || !hasMatchingPath) {
-        continue;
-      }
-      if (t.isImportDefaultSpecifier(specifier)) {
-        const newImport = t.importDeclaration(
-          [t.importDefaultSpecifier(t.identifier(specifier.local.name))],
-          t.stringLiteral(
-            state.opts.isLocal ? state.file.opts.filename?.split("react-native-unistyles").at(0)?.concat(`react-native-unistyles/components/native/${rule.mapTo}`) ?? "" : `react-native-unistyles/components/native/${rule.mapTo}`
-          )
-        );
-        path2.replaceWith(newImport);
-      } else {
-        const newImport = t.importDeclaration(
-          [t.importSpecifier(t.identifier(rule.mapTo), t.identifier(rule.mapTo))],
-          t.stringLiteral(
-            state.opts.isLocal ? state.file.opts.filename?.split("react-native-unistyles").at(0)?.concat(`react-native-unistyles/components/native/${rule.mapTo}`) ?? "" : `react-native-unistyles/components/native/${rule.mapTo}`
-          )
-        );
-        path2.node.specifiers = specifiers.filter((s) => s !== specifier);
-        if (path2.node.specifiers.length === 0) {
-          path2.replaceWith(newImport);
-        } else {
-          path2.insertBefore(newImport);
-        }
-      }
-      return;
-    }
-  });
+  if (state.opts.localPath) {
+    return `${state.opts.localPath}/src/components/native/${name}`;
+  }
+  return state.file.opts.filename?.split("react-native-unistyles").at(0)?.concat(`react-native-unistyles/src/components/native/${name}`) ?? "";
 }
-
-// plugin/src/import.ts
-var t2 = __toESM(require("@babel/types"));
 function addUnistylesImport(path2, state) {
   const localNames = Object.keys(state.reactNativeImports);
   const names = Object.values(state.reactNativeImports);
   const pairs = Object.entries(state.reactNativeImports);
   const nodesToRemove = [];
   path2.node.body.forEach((node) => {
-    if (t2.isImportDeclaration(node) && node.source.value === "react-native") {
-      node.specifiers = node.specifiers.filter((specifier) => !localNames.some((name) => name === specifier.local.name));
+    if (t.isImportDeclaration(node) && node.source.value === "react-native") {
+      node.specifiers = node.specifiers.filter(
+        (specifier) => !localNames.some((name) => name === specifier.local.name)
+      );
       if (node.specifiers.length === 0) {
         nodesToRemove.push(node);
       }
     }
   });
   names.forEach((name) => {
-    const rnWebImport = path2.node.body.find((node) => t2.isImportDeclaration(node) && node.source.value === `react-native-web/dist/exports/${name}`);
+    const rnWebImport = path2.node.body.find(
+      (node) => t.isImportDeclaration(node) && node.source.value === `react-native-web/dist/exports/${name}`
+    );
     if (rnWebImport) {
       rnWebImport.specifiers = [];
     }
   });
   pairs.forEach(([localName, name]) => {
-    const newImport = t2.importDeclaration(
-      [t2.importSpecifier(t2.identifier(localName), t2.identifier(name))],
-      t2.stringLiteral(
-        state.opts.isLocal ? state.file.opts.filename?.split("react-native-unistyles").at(0)?.concat(`react-native-unistyles/src/components/native/${name}`) ?? "" : `react-native-unistyles/components/native/${name}`
-      )
+    const newImport = t.importDeclaration(
+      [t.importSpecifier(t.identifier(localName), t.identifier(name))],
+      t.stringLiteral(getComponentPath(state, name))
     );
     path2.node.body.unshift(newImport);
   });
@@ -160,11 +131,11 @@ function isInsideNodeModules(state) {
 }
 function addUnistylesRequire(path2, state) {
   Object.entries(state.reactNativeImports).forEach(([componentName, uniqueName]) => {
-    const newRequire = t2.variableDeclaration("const", [
-      t2.variableDeclarator(
-        t2.identifier(uniqueName),
-        t2.callExpression(t2.identifier("require"), [
-          t2.stringLiteral(`react-native-unistyles/components/native/${componentName}`)
+    const newRequire = t.variableDeclaration("const", [
+      t.variableDeclarator(
+        t.identifier(uniqueName),
+        t.callExpression(t.identifier("require"), [
+          t.stringLiteral(`react-native-unistyles/components/native/${componentName}`)
         ])
       )
     ]);
@@ -172,6 +143,44 @@ function addUnistylesRequire(path2, state) {
   });
 }
 
+// plugin/src/exotic.ts
+function handleExoticImport(path2, state, exoticImport) {
+  const specifiers = path2.node.specifiers;
+  const source = path2.node.source;
+  if (path2.node.importKind !== "value") {
+    return;
+  }
+  specifiers.forEach((specifier) => {
+    for (const rule of exoticImport.imports) {
+      const hasMatchingImportType = !rule.isDefault && t2.isImportSpecifier(specifier) || rule.isDefault && t2.isImportDefaultSpecifier(specifier);
+      const hasMatchingImportName = rule.isDefault || !rule.isDefault && rule.name === specifier.local.name;
+      const hasMatchingPath = rule.path === source.value;
+      if (!hasMatchingImportType || !hasMatchingImportName || !hasMatchingPath) {
+        continue;
+      }
+      if (t2.isImportDefaultSpecifier(specifier)) {
+        const newImport = t2.importDeclaration(
+          [t2.importDefaultSpecifier(t2.identifier(specifier.local.name))],
+          t2.stringLiteral(getComponentPath(state, rule.mapTo))
+        );
+        path2.replaceWith(newImport);
+      } else {
+        const newImport = t2.importDeclaration(
+          [t2.importSpecifier(t2.identifier(rule.mapTo), t2.identifier(rule.mapTo))],
+          t2.stringLiteral(getComponentPath(state, rule.mapTo))
+        );
+        path2.node.specifiers = specifiers.filter((s) => s !== specifier);
+        if (path2.node.specifiers.length === 0) {
+          path2.replaceWith(newImport);
+        } else {
+          path2.insertBefore(newImport);
+        }
+      }
+      return;
+    }
+  });
+}
+
 // plugin/src/paths.ts
 var import_node_path = __toESM(require("node:path"));
 var isWindows = process.platform === "win32";
@@ -314,15 +323,6 @@ function getReturnStatementsFromBody(node, results = []) {
   }
   return results;
 }
-function stringToUniqueId(str) {
-  let hash = 0;
-  for (let i = 0; i < str.length; i++) {
-    hash = (hash << 5) - hash + str.charCodeAt(i);
-    hash |= 0;
-  }
-  const absHash = Math.abs(hash);
-  return absHash % 1e9;
-}
 function isUnistylesStyleSheet(path2, state) {
   const { callee } = path2.node;
   if (!t4.isMemberExpression(callee) || !t4.isIdentifier(callee.property)) {
@@ -384,11 +384,6 @@ function isKindOfStyleSheet(path2, state) {
   }
   return false;
 }
-function addStyleSheetTag(path2, state) {
-  const str = state.filename?.replace(state.cwd, "") ?? "";
-  const uniqueId = stringToUniqueId(str) + ++state.file.tagNumber;
-  path2.node.arguments.push(t4.numericLiteral(uniqueId));
-}
 function getStylesDependenciesFromObject(path2) {
   const detectedStylesWithVariants = /* @__PURE__ */ new Set();
   const stylesheet = path2.node.arguments[0];
@@ -426,10 +421,7 @@ function getStylesDependenciesFromObject(path2) {
   const variants = Array.from(detectedStylesWithVariants);
   return variants.reduce((acc, { key, label }) => {
     if (acc[key]) {
-      acc[key] = [
-        ...acc[key],
-        label
-      ];
+      acc[key] = [...acc[key], label];
       return acc;
     }
     acc[key] = [label];
@@ -546,7 +538,9 @@ function getStylesDependenciesFromFunction(funcPath) {
         return;
       }
       binding.referencePaths.forEach((refPath) => {
-        const containerProp = refPath.findParent((parent) => parent.isObjectProperty() && parent.parentPath === returnedObjectPath);
+        const containerProp = refPath.findParent(
+          (parent) => parent.isObjectProperty() && parent.parentPath === returnedObjectPath
+        );
         if (!containerProp) {
           return;
         }
@@ -607,7 +601,9 @@ function getStylesDependenciesFromFunction(funcPath) {
             }
           }
         }
-        const containerProp = refPath.findParent((parent2) => parent2.isObjectProperty() && parent2.parentPath === returnedObjectPath);
+        const containerProp = refPath.findParent(
+          (parent2) => parent2.isObjectProperty() && parent2.parentPath === returnedObjectPath
+        );
         if (!containerProp) {
           return;
         }
@@ -631,10 +627,7 @@ function getStylesDependenciesFromFunction(funcPath) {
   const rt = Array.from(detectedStylesWithRt);
   return theme.concat(rt).concat(variants).reduce((acc, { key, label }) => {
     if (acc[key]) {
-      acc[key] = [
-        ...acc[key],
-        label
-      ];
+      acc[key] = [...acc[key], label];
       return acc;
     }
     acc[key] = [label];
@@ -644,8 +637,14 @@ function getStylesDependenciesFromFunction(funcPath) {
 function addDependencies(state, styleName, unistyle, detectedDependencies) {
   const debugMessage = (deps) => {
     if (state.opts.debug) {
-      const mappedDeps = deps.map((dep) => Object.keys(UnistyleDependency).find((key) => UnistyleDependency[key] === dep)).join(", ");
-      console.log(`${state.filename?.replace(`${state.file.opts.root}/`, "")}: styles.${styleName}: [${mappedDeps}]`);
+      const mappedDeps = deps.map(
+        (dep) => Object.keys(UnistyleDependency).find(
+          (key) => UnistyleDependency[key] === dep
+        )
+      ).join(", ");
+      console.log(
+        `${state.filename?.replace(`${state.file.opts.root}/`, "")}: styles.${styleName}: [${mappedDeps}]`
+      );
     }
   };
   const styleDependencies = detectedDependencies.map(toUnistylesDependency);
@@ -660,9 +659,7 @@ function addDependencies(state, styleName, unistyle, detectedDependencies) {
       if (t4.isBlockStatement(unistyle.value.body)) {
         targets = getReturnStatementsFromBody(unistyle.value.body).map((node) => {
           if (t4.isIdentifier(node.argument)) {
-            node.argument = t4.objectExpression([
-              t4.spreadElement(node.argument)
-            ]);
+            node.argument = t4.objectExpression([t4.spreadElement(node.argument)]);
           }
           return node.argument;
         }).filter((node) => t4.isObjectExpression(node));
@@ -680,7 +677,9 @@ function addDependencies(state, styleName, unistyle, detectedDependencies) {
         target.properties.push(
           t4.objectProperty(
             t4.identifier("uni__dependencies"),
-            t4.arrayExpression(uniqueDependencies.filter((dep) => dep !== void 0 && dep !== null).map((dep) => t4.numericLiteral(dep)))
+            t4.arrayExpression(
+              uniqueDependencies.filter((dep) => dep !== void 0 && dep !== null).map((dep) => t4.numericLiteral(dep))
+            )
           )
         );
       });
@@ -691,7 +690,9 @@ function addDependencies(state, styleName, unistyle, detectedDependencies) {
 // plugin/src/variants.ts
 var t5 = __toESM(require("@babel/types"));
 function extractVariants(path2, state) {
-  const maybeVariants = path2.node.body.filter((node2) => t5.isExpressionStatement(node2) && t5.isCallExpression(node2.expression) && t5.isMemberExpression(node2.expression.callee));
+  const maybeVariants = path2.node.body.filter(
+    (node2) => t5.isExpressionStatement(node2) && t5.isCallExpression(node2.expression) && t5.isMemberExpression(node2.expression.callee)
+  );
   if (maybeVariants.length === 0) {
     return;
   }
@@ -727,15 +728,8 @@ function extractVariants(path2, state) {
   ]);
   const pathIndex = path2.node.body.findIndex((bodyPath) => bodyPath === targetVariant);
   const rest = path2.node.body.slice(pathIndex + 1);
-  const statement = t5.blockStatement([
-    finalDeclaration,
-    ...rest
-  ]);
-  path2.node.body = [
-    ...path2.node.body.slice(0, pathIndex),
-    shadowDeclaration,
-    statement
-  ];
+  const statement = t5.blockStatement([finalDeclaration, ...rest]);
+  path2.node.body = [...path2.node.body.slice(0, pathIndex), shadowDeclaration, statement];
   state.file.hasVariants = true;
 }
 
@@ -753,20 +747,25 @@ function index_default() {
       Program: {
         enter(path2, state) {
           if (!state.opts.root) {
-            throw new Error("Unistyles \u{1F984}: Babel plugin requires `root` option to be set. Please check https://www.unistyl.es/v3/other/babel-plugin#extra-configuration");
+            throw new Error(
+              "Unistyles \u{1F984}: Babel plugin requires `root` option to be set. Please check https://www.unistyl.es/v3/other/babel-plugin#extra-configuration"
+            );
           }
           const appRoot = toPlatformPath(import_node_path2.default.join(state.file.opts.root, state.opts.root));
           if (state.file.opts.root === appRoot) {
-            throw new Error("Unistyles \u{1F984}: Root option can't resolve to project root as it will include node_modules folder. Please check https://www.unistyl.es/v3/other/babel-plugin#extra-configuration");
+            throw new Error(
+              "Unistyles \u{1F984}: Root option can't resolve to project root as it will include node_modules folder. Please check https://www.unistyl.es/v3/other/babel-plugin#extra-configuration"
+            );
           }
-          state.file.replaceWithUnistyles = REPLACE_WITH_UNISTYLES_PATHS.concat(state.opts.autoProcessPaths ?? []).map(toPlatformPath).some((path3) => state.filename?.includes(path3));
+          state.file.replaceWithUnistyles = REPLACE_WITH_UNISTYLES_PATHS.concat(
+            state.opts.autoProcessPaths ?? []
+          ).map(toPlatformPath).some((path3) => state.filename?.includes(path3));
           state.file.hasAnyUnistyle = false;
           state.file.hasUnistylesImport = false;
           state.file.addUnistylesRequire = false;
           state.file.hasVariants = false;
           state.file.styleSheetLocalName = "";
           state.file.reactNativeCommonJSName = "";
-          state.file.tagNumber = 0;
           state.reactNativeImports = {};
           state.file.forceProcessing = state.filename?.includes(appRoot) ?? false;
           path2.traverse({
@@ -822,7 +821,9 @@ function index_default() {
         });
       },
       ImportDeclaration(path2, state) {
-        const exoticImport = REPLACE_WITH_UNISTYLES_EXOTIC_PATHS.concat(state.opts.autoRemapImports ?? []).find((exotic) => state.filename?.includes(exotic.path));
+        const exoticImport = REPLACE_WITH_UNISTYLES_EXOTIC_PATHS.concat(state.opts.autoRemapImports ?? []).find(
+          (exotic) => state.filename?.includes(exotic.path)
+        );
         if (exoticImport) {
           return handleExoticImport(path2, state, exoticImport);
         }
@@ -894,7 +895,6 @@ function index_default() {
           return;
         }
         state.file.hasAnyUnistyle = true;
-        addStyleSheetTag(path2, state);
         const arg = t6.isAssignmentExpression(path2.node.arguments[0]) ? path2.node.arguments[0].right : path2.node.arguments[0];
         if (t6.isObjectExpression(arg)) {
           const detectedDependencies = getStylesDependenciesFromObject(path2);
@@ -902,7 +902,12 @@ function index_default() {
             if (t6.isObjectExpression(arg)) {
               arg.properties.forEach((property) => {
                 if (t6.isObjectProperty(property) && t6.isIdentifier(property.key) && Object.prototype.hasOwnProperty.call(detectedDependencies, property.key.name)) {
-                  addDependencies(state, property.key.name, property, detectedDependencies[property.key.name] ?? []);
+                  addDependencies(
+                    state,
+                    property.key.name,
+                    property,
+                    detectedDependencies[property.key.name] ?? []
+                  );
                 }
               });
             }
@@ -916,7 +921,12 @@ function index_default() {
             if (t6.isObjectExpression(body)) {
               body.properties.forEach((property) => {
                 if (t6.isObjectProperty(property) && t6.isIdentifier(property.key) && Object.prototype.hasOwnProperty.call(detectedDependencies, property.key.name)) {
-                  addDependencies(state, property.key.name, property, detectedDependencies[property.key.name] ?? []);
+                  addDependencies(
+                    state,
+                    property.key.name,
+                    property,
+                    detectedDependencies[property.key.name] ?? []
+                  );
                 }
               });
             }

package/repack-plugin/index.d.ts

@@ -1,4 +1,4 @@
-import type {Compiler,LoaderContext,RspackPluginInstance } from '@rspack/core'
+import type { Compiler, LoaderContext, RspackPluginInstance } from '@rspack/core'
 import type { UnistylesPluginOptions } from 'react-native-unistyles/plugin'
 
 export declare const BASE_REPACK_EXCLUDE_PATHS: Array<RegExp>
@@ -14,6 +14,6 @@ export declare class RepackUnistylePlugin implements RspackPluginInstance {
     apply(compiler: Compiler): void
 }
 
-declare function unistylesLoader(this: LoaderContext<UnistylesLoaderOptions>, source: string): void;
+declare function unistylesLoader(this: LoaderContext<UnistylesLoaderOptions>, source: string): void
 
 export default unistylesLoader

package/src/components/AdaptiveTheme.tsx

@@ -1,7 +1,10 @@
-import React, { useLayoutEffect } from 'react'
 import type { PropsWithChildren } from 'react'
-import { useUnistyles } from '../core'
+
+import React, { useLayoutEffect } from 'react'
+
 import type { UnistylesThemes } from '../global'
+
+import { useUnistyles } from '../core'
 import { UnistylesShadowRegistry } from '../specs'
 import { ApplyScopedTheme } from './ApplyScopedTheme'
 
@@ -9,16 +12,13 @@ interface AdaptiveThemeProps extends PropsWithChildren {
     previousScopedTheme?: string
 }
 
-export const AdaptiveTheme: React.FunctionComponent<AdaptiveThemeProps> = ({
-    children,
-    previousScopedTheme
-}) => {
+export const AdaptiveTheme: React.FunctionComponent<AdaptiveThemeProps> = ({ children, previousScopedTheme }) => {
     const { rt } = useUnistyles()
     const name = (rt.colorScheme === 'dark' ? 'light' : 'dark') as keyof UnistylesThemes
     const mappedChildren = [
         <ApplyScopedTheme key={name} name={name} />,
         children,
-        <ApplyScopedTheme key='dispose' name={previousScopedTheme as keyof UnistylesThemes | undefined} />
+        <ApplyScopedTheme key="dispose" name={previousScopedTheme as keyof UnistylesThemes | undefined} />,
     ]
 
     useLayoutEffect(() => {
@@ -26,9 +26,5 @@ export const AdaptiveTheme: React.FunctionComponent<AdaptiveThemeProps> = ({
         UnistylesShadowRegistry.flush()
     })
 
-    return (
-        <React.Fragment key={name}>
-            {mappedChildren}
-        </React.Fragment>
-    )
+    return <React.Fragment key={name}>{mappedChildren}</React.Fragment>
 }

package/src/components/ApplyScopedTheme.tsx

@@ -1,5 +1,7 @@
 import { useLayoutEffect } from 'react'
+
 import type { UnistylesThemes } from '../global'
+
 import { UnistylesShadowRegistry } from '../specs'
 
 type ApplyScopedThemeProps = {

package/src/components/Display.tsx

@@ -1,4 +1,5 @@
 import React, { type PropsWithChildren } from 'react'
+
 import { useMedia } from '../hooks'
 
 type DisplayProps = { mq: symbol } & PropsWithChildren
@@ -6,7 +7,5 @@ type DisplayProps = { mq: symbol } & PropsWithChildren
 export const Display: React.FunctionComponent<DisplayProps> = ({ children, ...props }) => {
     const { isVisible } = useMedia(props)
 
-    return isVisible
-        ? children
-        : null
+    return isVisible ? children : null
 }

package/src/components/Hide.tsx

@@ -1,4 +1,5 @@
 import React, { type PropsWithChildren } from 'react'
+
 import { useMedia } from '../hooks'
 
 type HideProps = { mq: symbol } & PropsWithChildren
@@ -6,7 +7,5 @@ type HideProps = { mq: symbol } & PropsWithChildren
 export const Hide: React.FunctionComponent<HideProps> = ({ children, ...props }) => {
     const { isVisible } = useMedia(props)
 
-    return !isVisible
-        ? children
-        : null
+    return !isVisible ? children : null
 }

package/src/components/NamedTheme.tsx

@@ -1,23 +1,22 @@
-import React, { useLayoutEffect } from 'react'
 import type { PropsWithChildren } from 'react'
+
+import React, { useLayoutEffect } from 'react'
+
 import type { UnistylesThemes } from '../global'
+
 import { UnistylesShadowRegistry } from '../specs'
 import { ApplyScopedTheme } from './ApplyScopedTheme'
 
 interface NamedThemeProps extends PropsWithChildren {
-    name: keyof UnistylesThemes | undefined,
+    name: keyof UnistylesThemes | undefined
     previousScopedTheme?: string
 }
 
-export const NamedTheme: React.FunctionComponent<NamedThemeProps> = ({
-    name,
-    children,
-    previousScopedTheme
-}) => {
+export const NamedTheme: React.FunctionComponent<NamedThemeProps> = ({ name, children, previousScopedTheme }) => {
     const mappedChildren = [
-        <ApplyScopedTheme key='apply' name={name} />,
+        <ApplyScopedTheme key="apply" name={name} />,
         children,
-        <ApplyScopedTheme key='dispose' name={previousScopedTheme as keyof UnistylesThemes | undefined} />
+        <ApplyScopedTheme key="dispose" name={previousScopedTheme as keyof UnistylesThemes | undefined} />,
     ]
 
     useLayoutEffect(() => {
@@ -25,9 +24,5 @@ export const NamedTheme: React.FunctionComponent<NamedThemeProps> = ({
         UnistylesShadowRegistry.flush()
     })
 
-    return (
-        <React.Fragment>
-            {mappedChildren}
-        </React.Fragment>
-    )
+    return <React.Fragment>{mappedChildren}</React.Fragment>
 }

package/src/components/ScopedTheme.tsx

@@ -1,28 +1,33 @@
 import React from 'react'
+
 import type { UnistylesThemes } from '../global'
+
 import { UnistylesRuntime, UnistylesShadowRegistry } from '../specs'
 import { AdaptiveTheme } from './AdaptiveTheme'
 import { NamedTheme } from './NamedTheme'
 
-type ThemeProps = {
-    name: keyof UnistylesThemes,
-    invertedAdaptive?: never
-    reset?: never
-} | {
-    name?: never,
-    invertedAdaptive: boolean,
-    reset?: never
-} | {
-    name?: never,
-    invertedAdaptive?: never,
-    reset: boolean
-}
+type ThemeProps =
+    | {
+          name: keyof UnistylesThemes
+          invertedAdaptive?: never
+          reset?: never
+      }
+    | {
+          name?: never
+          invertedAdaptive: boolean
+          reset?: never
+      }
+    | {
+          name?: never
+          invertedAdaptive?: never
+          reset: boolean
+      }
 
 export const ScopedTheme: React.FunctionComponent<React.PropsWithChildren<ThemeProps>> = ({
     name,
     children,
     invertedAdaptive,
-    reset
+    reset,
 }) => {
     const hasAdaptiveThemes = UnistylesRuntime.hasAdaptiveThemes
     const isAdaptiveTheme = invertedAdaptive && hasAdaptiveThemes
@@ -31,25 +36,15 @@ export const ScopedTheme: React.FunctionComponent<React.PropsWithChildren<ThemeP
     switch (true) {
         case name !== undefined:
             return (
-                <NamedTheme
-                    name={name as keyof UnistylesThemes}
-                    previousScopedTheme={previousScopedTheme}
-                >
+                <NamedTheme name={name as keyof UnistylesThemes} previousScopedTheme={previousScopedTheme}>
                     {children}
                 </NamedTheme>
             )
         case isAdaptiveTheme:
-            return (
-                <AdaptiveTheme previousScopedTheme={previousScopedTheme}>
-                    {children}
-                </AdaptiveTheme>
-            )
+            return <AdaptiveTheme previousScopedTheme={previousScopedTheme}>{children}</AdaptiveTheme>
         case reset:
             return (
-                <NamedTheme
-                    name={undefined}
-                    previousScopedTheme={previousScopedTheme}
-                >
+                <NamedTheme name={undefined} previousScopedTheme={previousScopedTheme}>
                     {children}
                 </NamedTheme>
             )

package/src/components/native/ActivityIndicator.tsx

@@ -1,4 +1,5 @@
 import { ActivityIndicator as NativeActivityIndicator } from 'react-native'
+
 import { createUnistylesElement } from '../../core'
 
 export const ActivityIndicator = createUnistylesElement(NativeActivityIndicator)

package/src/components/native/Animated.tsx

@@ -1,4 +1,5 @@
 import { Animated as RNAnimated } from 'react-native'
+
 import { FlatList } from './FlatList'
 import { Image } from './Image'
 import { ScrollView } from './ScrollView'
@@ -13,5 +14,5 @@ export const Animated = {
     FlatList: RNAnimated.createAnimatedComponent(FlatList),
     Image: RNAnimated.createAnimatedComponent(Image),
     ScrollView: RNAnimated.createAnimatedComponent(ScrollView),
-    SectionList: RNAnimated.createAnimatedComponent(SectionList)
+    SectionList: RNAnimated.createAnimatedComponent(SectionList),
 }

package/src/components/native/FlatList.tsx

@@ -1,4 +1,5 @@
 import { FlatList as NativeFlatList } from 'react-native'
+
 import { createUnistylesElement } from '../../core'
 
 export const FlatList = createUnistylesElement(NativeFlatList)

package/src/components/native/Image.native.tsx

@@ -1,4 +1,5 @@
 import { Image as NativeImage } from 'react-native'
+
 import { createUnistylesElement } from '../../core'
 
 export const Image = createUnistylesElement(NativeImage)

package/src/components/native/Image.tsx

@@ -1,8 +1,10 @@
 import React, { type ComponentProps, forwardRef } from 'react'
 import { type ImageStyle, Image as NativeImage, type StyleProp, type ViewStyle } from 'react-native'
+
+import type { UnistylesValues } from '../../types'
+
 import { getClassName } from '../../core'
 import { maybeWarnAboutMultipleUnistyles } from '../../core/warn'
-import type { UnistylesValues } from '../../types'
 import { copyComponentProperties } from '../../utils'
 import { checkForProp } from '../../web/utils'
 import { createUnistylesRef } from '../../web/utils/createUnistylesRef'
@@ -23,12 +25,14 @@ const UnistylesImage = forwardRef<unknown, Props>((props, forwardedRef) => {
     return (
         <NativeImage
             {...props}
-            style={[
-                classNames,
-                // Clear inline width and height extracted from source
-                hasWidthStyle && { width: '' },
-                hasHeightStyle && { height: '' }
-            ] as StyleProp<ImageStyle>}
+            style={
+                [
+                    classNames,
+                    // Clear inline width and height extracted from source
+                    hasWidthStyle && { width: '' },
+                    hasHeightStyle && { height: '' },
+                ] as StyleProp<ImageStyle>
+            }
             ref={ref}
         />
     )