[zero] Identify zero runtime styled path (#40555)

mui · Jan 15, 2024 · a8102f8 · a8102f8
1 parent 9d7a370
commit a8102f8
Show file tree

Hide file tree

Showing 8 changed files with 49 additions and 4 deletions.
diff --git a/packages/mui-material/src/Badge/Badge.js b/packages/mui-material/src/Badge/Badge.js
@@ -6,7 +6,7 @@ import { usePreviousProps } from '@mui/utils';
 import { unstable_composeClasses as composeClasses } from '@mui/base/composeClasses';
 import { useBadge } from '@mui/base/useBadge';
 import { useSlotProps } from '@mui/base';
-import styled from '../styles/styled';
+import { styled } from '../zero-styled';
 import useThemeProps from '../styles/useThemeProps';
 import capitalize from '../utils/capitalize';
 import badgeClasses, { getBadgeUtilityClass } from './badgeClasses';

diff --git a/packages/mui-material/src/zero-styled/index.d.ts b/packages/mui-material/src/zero-styled/index.d.ts
@@ -0,0 +1,2 @@
+// eslint-disable-next-line import/prefer-default-export
+export { default as styled } from '../styles/styled';
diff --git a/packages/mui-material/src/zero-styled/index.js b/packages/mui-material/src/zero-styled/index.js
@@ -0,0 +1,2 @@
+// eslint-disable-next-line import/prefer-default-export
+export { default as styled } from '../styles/styled';
diff --git a/packages/zero-runtime/package.json b/packages/zero-runtime/package.json
@@ -87,8 +87,20 @@
       "import": "./utils/index.mjs",
       "require": "./utils/index.js"
     },
+    "./exports/generateAtomics": {
+      "default": "./exports/generateAtomics.js"
+    },
+    "./exports/keyframes": {
+      "default": "./exports/keyframes.js"
+    },
+    "./exports/styled": {
+      "default": "./exports/styled.js"
+    },
     "./exports/sx-plugin": {
       "default": "./exports/sx-plugin.js"
+    },
+    "./exports/sx": {
+      "default": "./exports/sx.js"
     }
   }
 }
diff --git a/packages/zero-runtime/src/processors/styled.ts b/packages/zero-runtime/src/processors/styled.ts
@@ -338,7 +338,10 @@ export class StyledProcessor extends BaseProcessor {
       );
     }
 
-    const styledImportIdentifier = t.addNamedImport(this.tagSource.imported, this.tagSource.source);
+    const styledImportIdentifier = t.addNamedImport(
+      this.tagSource.imported,
+      process.env.PACKAGE_NAME as string,
+    );
     const styledCall = t.callExpression(
       styledImportIdentifier,
       componentMetaExpression ? [componentName, componentMetaExpression] : [componentName],

diff --git a/packages/zero-unplugin/src/index.ts b/packages/zero-unplugin/src/index.ts
@@ -99,6 +99,7 @@ export const plugin = createUnplugin<PluginOptions, true>((options) => {
     sourceMap = false,
     transformSx = true,
     overrideContext,
+    tagResolver,
     ...rest
   } = options;
   const themeArgs = { theme };
@@ -166,6 +167,7 @@ export const plugin = createUnplugin<PluginOptions, true>((options) => {
           root: process.cwd(),
           preprocessor,
           pluginOptions: {
+            ...rest,
             themeArgs: {
               theme,
             },
@@ -179,7 +181,16 @@ export const plugin = createUnplugin<PluginOptions, true>((options) => {
               }
               return context;
             },
-            ...rest,
+            tagResolver(source: string, tag: string) {
+              const tagResult = tagResolver?.(source, tag);
+              if (tagResult) {
+                return tagResult;
+              }
+              if (source.endsWith('/zero-styled')) {
+                return `${process.env.RUNTIME_PACKAGE_NAME}/exports/${tag}`;
+              }
+              return null;
+            },
             babelOptions: {
               ...rest.babelOptions,
               plugins: [

diff --git a/packages/zero-vite-plugin/src/zero-vite-plugin.ts b/packages/zero-vite-plugin/src/zero-vite-plugin.ts
@@ -43,6 +43,7 @@ export default function zeroVitePlugin({
   preprocessor,
   transformLibraries = [],
   overrideContext,
+  tagResolver,
   ...rest
 }: VitePluginOptions = {}): Plugin {
   const filter = createFilter(include, exclude);
@@ -116,7 +117,7 @@ export default function zeroVitePlugin({
       let shouldReturn = url.includes('node_modules');
 
       if (shouldReturn) {
-        shouldReturn = !transformLibraries.some((libName) => url.includes(libName));
+        shouldReturn = !transformLibraries.some((libName: string) => url.includes(libName));
       }
 
       if (shouldReturn) {
@@ -195,6 +196,16 @@ export default function zeroVitePlugin({
                   }
                   return context;
                 },
+                tagResolver(source: string, tag: string) {
+                  const tagResult = tagResolver?.(source, tag);
+                  if (tagResult) {
+                    return tagResult;
+                  }
+                  if (source.endsWith('/zero-styled')) {
+                    return `${process.env.RUNTIME_PACKAGE_NAME}/exports/${tag}`;
+                  }
+                  return null;
+                },
               },
             },
             cache,

diff --git a/packages/zero-vite-plugin/tsup.config.ts b/packages/zero-vite-plugin/tsup.config.ts
@@ -1,12 +1,16 @@
 import { Options, defineConfig } from 'tsup';
 import config from '../../tsup.config';
+import zeroPkgJson from '../zero-runtime/package.json';
 
 const external = ['@mui/zero-runtime/utils'];
 
 const baseConfig: Options = {
   ...(config as Options),
   tsconfig: './tsconfig.build.json',
   external,
+  env: {
+    RUNTIME_PACKAGE_NAME: zeroPkgJson.name,
+  },
 };
 
 export default defineConfig([