unplugin-stylex 0.0.1

package/.eslintrc.json

@@ -0,0 +1,5 @@
+{
+  "rules": {
+    "semi": ["error", "always"]
+  }
+}

package/LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2023 cin
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/README.md

@@ -0,0 +1,98 @@
+# unplugin-stylex
+
+## Installation
+
+Install the package from the following command
+
+```shell
+npm install unplugin-stylex --save-dev
+```
+
+or with yarn:
+
+```shell
+yarn add unplugin-stylex --save-dev
+```
+
+or with pnpm:
+
+```shell
+pnpm i unplugin-stylex --save-dev
+```
+
+## Configuration
+
+<details>
+<summary>Vite</summary><br>
+
+```ts
+// vite.config.js
+import { defineConfig } from 'vite'
+import stylexPlugin from 'unplugin-stylex/vite'
+
+export default defineConfig({
+  plugins: [
+    stylexPlugin({ /* options */}),
+  ],
+})
+```
+
+</br></details>
+
+<details>
+<summary>esbuild</summary><br>
+
+```ts
+// esbuild.config.js
+import { build } from 'esbuild'
+import stylexPlugin from 'unplugin-stylex/esbuild'
+
+export default {
+  plugins: [
+    stylexPlugin({ /* options */ }),
+  ],
+}
+```
+
+</br></details>
+
+<details>
+<summary>rspack</summary><br>
+
+```ts
+// rspack.config.js
+import stylexPlugin from 'unplugin-stylex/rspack'
+
+module.exports = {
+  // other rspack config
+  plugins: [
+    stylexPlugin({ /* options */}),
+  ],
+}
+```
+
+</br></details>
+
+## Options
+
+### options.dev
+
+### options.enforce
+
+### options.stylex
+
+#### options.stylex.runtimeInjection
+
+#### options.stylex.classNamePrefix
+
+#### options.stylex.useCSSLayers
+
+#### options.stylex.babelConfig
+
+#### options.stylex.stylexImports
+
+#### options.stylex.unstable_moduleResolution
+
+## License
+
+StyleX is [MIT licensed](./LICENSE)

package/dist/chunk-36ARBXVP.js

@@ -0,0 +1,8 @@
+// src/core/constants.ts
+var PLUGIN_NAME = "unplugin-stylex";
+var isDevelopment = process.env.NODE_ENV !== "production" || process.env.BABEL_ENV !== "production";
+
+export {
+  PLUGIN_NAME,
+  isDevelopment
+};

package/dist/chunk-5FLQNHMU.cjs

@@ -0,0 +1,131 @@
+"use strict";Object.defineProperty(exports, "__esModule", {value: true}); function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } else { var newObj = {}; if (obj != null) { for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) { newObj[key] = obj[key]; } } } newObj.default = obj; return newObj; } } function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+
+var _chunkN4Z3Z2PUcjs = require('./chunk-N4Z3Z2PU.cjs');
+
+// src/index.ts
+var _pluginutils = require('@rollup/pluginutils');
+var _babelplugin = require('@stylexjs/babel-plugin'); var _babelplugin2 = _interopRequireDefault(_babelplugin);
+var _unplugin = require('unplugin');
+
+// src/core/utils.ts
+function getOptions(options = {}) {
+  const stylex = options.stylex || {};
+  return {
+    ...options,
+    dev: options.dev || _chunkN4Z3Z2PUcjs.isDevelopment,
+    include: options.include || [/\.[jt]sx?$/],
+    exclude: options.exclude || [/node_modules/, /\.git/],
+    enforce: options.enforce || "pre",
+    stylex: {
+      ...stylex,
+      filename: stylex.filename || "stylex.css",
+      stylexImports: stylex.stylexImports || ["stylex", "@stylexjs/stylex"],
+      useCSSLayers: stylex.useCSSLayers || false,
+      unstable_moduleResolution: stylex.unstable_moduleResolution || { type: "commonJS", rootDir: process.cwd() },
+      babelConfig: {
+        babelrc: (stylex.babelConfig || {}).babelrc || false,
+        plugins: (stylex.babelConfig || {}).plugins || [],
+        presets: (stylex.babelConfig || {}).presets || []
+      }
+    }
+  };
+}
+
+// src/core/transformer.ts
+var _promises = require('fs/promises'); var fs = _interopRequireWildcard(_promises);
+var _path = require('path'); var path = _interopRequireWildcard(_path);
+var _core = require('@babel/core');
+var _pluginsyntaxflow = require('@babel/plugin-syntax-flow'); var _pluginsyntaxflow2 = _interopRequireDefault(_pluginsyntaxflow);
+var _pluginsyntaxjsx = require('@babel/plugin-syntax-jsx'); var _pluginsyntaxjsx2 = _interopRequireDefault(_pluginsyntaxjsx);
+var _pluginsyntaxtypescript = require('@babel/plugin-syntax-typescript'); var _pluginsyntaxtypescript2 = _interopRequireDefault(_pluginsyntaxtypescript);
+
+async function transformer(context) {
+  const { id, source, options } = context;
+  const stylex = options.stylex;
+  const extname2 = path.extname(id);
+  const stylexRules = {};
+  if (stylex.stylexImports.some((importName) => source.includes(importName))) {
+    const originSource = stylex.babelConfig.babelrc ? await fs.readFile(id, "utf-8") : source;
+    const { code, map, metadata } = await _core.transformAsync.call(void 0, 
+      originSource,
+      {
+        babelrc: stylex.babelConfig.babelrc,
+        filename: id,
+        plugins: [
+          ...stylex.babelConfig.plugins || [],
+          extname2 === ".ts" ? _pluginsyntaxtypescript2.default : extname2 === ".tsx" ? [_pluginsyntaxtypescript2.default, { isTSX: true }] : _pluginsyntaxflow2.default,
+          _pluginsyntaxjsx2.default,
+          [
+            _babelplugin2.default,
+            {
+              dev: options.dev,
+              unstable_moduleResolution: stylex.unstable_moduleResolution,
+              importSources: stylex.stylexImports,
+              ...stylex
+            }
+          ]
+        ],
+        presets: stylex.babelConfig.presets
+      }
+    );
+    if (metadata.stylex && metadata.stylex.length > 0) {
+      stylexRules[id] = metadata.stylex;
+    }
+    if (!stylex.babelConfig.babelrc) {
+      return { code, map, stylexRules };
+    }
+    return { code, stylexRules };
+  }
+  return { code: source };
+}
+
+// src/index.ts
+var unpluginFactory = (rawOptions = {}, meta) => {
+  const options = getOptions(rawOptions);
+  const filter = _pluginutils.createFilter.call(void 0, options.include, options.exclude);
+  const stylexRules = {};
+  return {
+    name: _chunkN4Z3Z2PUcjs.PLUGIN_NAME,
+    enforce: options.enforce,
+    transformInclude(id) {
+      return filter(id);
+    },
+    async transform(source, id) {
+      const context = {
+        pluginContext: this,
+        options,
+        source,
+        id
+      };
+      try {
+        const result = await transformer(context);
+        if (result.stylexRules && result.stylexRules[id]) {
+          stylexRules[id] = result.stylexRules[id];
+        }
+        return result;
+      } catch (error) {
+        this.error(error);
+      }
+    },
+    buildEnd() {
+      const rules = Object.values(stylexRules).flat();
+      if (rules.length > 0) {
+        const collectedCSS = _babelplugin2.default.processStylexRules(rules, options.stylex.useCSSLayers);
+        this.emitFile({
+          fileName: options.stylex.filename,
+          source: collectedCSS,
+          type: "asset"
+        });
+      }
+    }
+  };
+};
+var unplugin = _unplugin.createUnplugin.call(void 0, unpluginFactory);
+var src_default = unplugin;
+
+
+
+
+
+exports.unpluginFactory = unpluginFactory; exports.unplugin = unplugin; exports.src_default = src_default;

package/dist/chunk-N4Z3Z2PU.cjs

@@ -0,0 +1,8 @@
+"use strict";Object.defineProperty(exports, "__esModule", {value: true});// src/core/constants.ts
+var PLUGIN_NAME = "unplugin-stylex";
+var isDevelopment = process.env.NODE_ENV !== "production" || process.env.BABEL_ENV !== "production";
+
+
+
+
+exports.PLUGIN_NAME = PLUGIN_NAME; exports.isDevelopment = isDevelopment;

package/dist/chunk-R3ITJTXO.js

@@ -0,0 +1,131 @@
+import {
+  PLUGIN_NAME,
+  isDevelopment
+} from "./chunk-36ARBXVP.js";
+
+// src/index.ts
+import { createFilter } from "@rollup/pluginutils";
+import stylexBabelPlugin2 from "@stylexjs/babel-plugin";
+import { createUnplugin } from "unplugin";
+
+// src/core/utils.ts
+function getOptions(options = {}) {
+  const stylex = options.stylex || {};
+  return {
+    ...options,
+    dev: options.dev || isDevelopment,
+    include: options.include || [/\.[jt]sx?$/],
+    exclude: options.exclude || [/node_modules/, /\.git/],
+    enforce: options.enforce || "pre",
+    stylex: {
+      ...stylex,
+      filename: stylex.filename || "stylex.css",
+      stylexImports: stylex.stylexImports || ["stylex", "@stylexjs/stylex"],
+      useCSSLayers: stylex.useCSSLayers || false,
+      unstable_moduleResolution: stylex.unstable_moduleResolution || { type: "commonJS", rootDir: process.cwd() },
+      babelConfig: {
+        babelrc: (stylex.babelConfig || {}).babelrc || false,
+        plugins: (stylex.babelConfig || {}).plugins || [],
+        presets: (stylex.babelConfig || {}).presets || []
+      }
+    }
+  };
+}
+
+// src/core/transformer.ts
+import * as fs from "fs/promises";
+import * as path from "path";
+import { transformAsync } from "@babel/core";
+import flowSyntaxPlugin from "@babel/plugin-syntax-flow";
+import jsxSyntaxPlugin from "@babel/plugin-syntax-jsx";
+import typescriptSyntaxPlugin from "@babel/plugin-syntax-typescript";
+import stylexBabelPlugin from "@stylexjs/babel-plugin";
+async function transformer(context) {
+  const { id, source, options } = context;
+  const stylex = options.stylex;
+  const extname2 = path.extname(id);
+  const stylexRules = {};
+  if (stylex.stylexImports.some((importName) => source.includes(importName))) {
+    const originSource = stylex.babelConfig.babelrc ? await fs.readFile(id, "utf-8") : source;
+    const { code, map, metadata } = await transformAsync(
+      originSource,
+      {
+        babelrc: stylex.babelConfig.babelrc,
+        filename: id,
+        plugins: [
+          ...stylex.babelConfig.plugins || [],
+          extname2 === ".ts" ? typescriptSyntaxPlugin : extname2 === ".tsx" ? [typescriptSyntaxPlugin, { isTSX: true }] : flowSyntaxPlugin,
+          jsxSyntaxPlugin,
+          [
+            stylexBabelPlugin,
+            {
+              dev: options.dev,
+              unstable_moduleResolution: stylex.unstable_moduleResolution,
+              importSources: stylex.stylexImports,
+              ...stylex
+            }
+          ]
+        ],
+        presets: stylex.babelConfig.presets
+      }
+    );
+    if (metadata.stylex && metadata.stylex.length > 0) {
+      stylexRules[id] = metadata.stylex;
+    }
+    if (!stylex.babelConfig.babelrc) {
+      return { code, map, stylexRules };
+    }
+    return { code, stylexRules };
+  }
+  return { code: source };
+}
+
+// src/index.ts
+var unpluginFactory = (rawOptions = {}, meta) => {
+  const options = getOptions(rawOptions);
+  const filter = createFilter(options.include, options.exclude);
+  const stylexRules = {};
+  return {
+    name: PLUGIN_NAME,
+    enforce: options.enforce,
+    transformInclude(id) {
+      return filter(id);
+    },
+    async transform(source, id) {
+      const context = {
+        pluginContext: this,
+        options,
+        source,
+        id
+      };
+      try {
+        const result = await transformer(context);
+        if (result.stylexRules && result.stylexRules[id]) {
+          stylexRules[id] = result.stylexRules[id];
+        }
+        return result;
+      } catch (error) {
+        this.error(error);
+      }
+    },
+    buildEnd() {
+      const rules = Object.values(stylexRules).flat();
+      if (rules.length > 0) {
+        const collectedCSS = stylexBabelPlugin2.processStylexRules(rules, options.stylex.useCSSLayers);
+        this.emitFile({
+          fileName: options.stylex.filename,
+          source: collectedCSS,
+          type: "asset"
+        });
+      }
+    }
+  };
+};
+var unplugin = createUnplugin(unpluginFactory);
+var src_default = unplugin;
+
+export {
+  unpluginFactory,
+  unplugin,
+  src_default
+};

package/dist/esbuild.cjs

@@ -0,0 +1,11 @@
+"use strict";Object.defineProperty(exports, "__esModule", {value: true});
+
+var _chunk5FLQNHMUcjs = require('./chunk-5FLQNHMU.cjs');
+require('./chunk-N4Z3Z2PU.cjs');
+
+// src/esbuild.ts
+var _unplugin = require('unplugin');
+var esbuild_default = _unplugin.createEsbuildPlugin.call(void 0, _chunk5FLQNHMUcjs.unpluginFactory);
+
+
+exports.default = esbuild_default;

package/dist/esbuild.d.cts

@@ -0,0 +1,7 @@
+import * as unplugin from 'unplugin';
+import { UnpluginStylexOptions } from './types.cjs';
+import '@rollup/pluginutils';
+
+declare const _default: (options?: UnpluginStylexOptions) => unplugin.EsbuildPlugin;
+
+export { _default as default };

package/dist/esbuild.d.ts

@@ -0,0 +1,7 @@
+import * as unplugin from 'unplugin';
+import { UnpluginStylexOptions } from './types.js';
+import '@rollup/pluginutils';
+
+declare const _default: (options?: UnpluginStylexOptions) => unplugin.EsbuildPlugin;
+
+export { _default as default };

package/dist/esbuild.js

@@ -0,0 +1,11 @@
+import {
+  unpluginFactory
+} from "./chunk-R3ITJTXO.js";
+import "./chunk-36ARBXVP.js";
+
+// src/esbuild.ts
+import { createEsbuildPlugin } from "unplugin";
+var esbuild_default = createEsbuildPlugin(unpluginFactory);
+export {
+  esbuild_default as default
+};

package/dist/index.cjs

@@ -0,0 +1,11 @@
+"use strict";Object.defineProperty(exports, "__esModule", {value: true});
+
+
+
+var _chunk5FLQNHMUcjs = require('./chunk-5FLQNHMU.cjs');
+require('./chunk-N4Z3Z2PU.cjs');
+
+
+
+
+exports.default = _chunk5FLQNHMUcjs.src_default; exports.unplugin = _chunk5FLQNHMUcjs.unplugin; exports.unpluginFactory = _chunk5FLQNHMUcjs.unpluginFactory;

package/dist/index.d.cts

@@ -0,0 +1,9 @@
+import * as unplugin$1 from 'unplugin';
+import { UnpluginFactory } from 'unplugin';
+import { UnpluginStylexOptions } from './types.cjs';
+import '@rollup/pluginutils';
+
+declare const unpluginFactory: UnpluginFactory<UnpluginStylexOptions | undefined>;
+declare const unplugin: unplugin$1.UnpluginInstance<UnpluginStylexOptions, boolean>;
+
+export { unplugin as default, unplugin, unpluginFactory };

package/dist/index.d.ts

@@ -0,0 +1,9 @@
+import * as unplugin$1 from 'unplugin';
+import { UnpluginFactory } from 'unplugin';
+import { UnpluginStylexOptions } from './types.js';
+import '@rollup/pluginutils';
+
+declare const unpluginFactory: UnpluginFactory<UnpluginStylexOptions | undefined>;
+declare const unplugin: unplugin$1.UnpluginInstance<UnpluginStylexOptions, boolean>;
+
+export { unplugin as default, unplugin, unpluginFactory };

package/dist/index.js

@@ -0,0 +1,11 @@
+import {
+  src_default,
+  unplugin,
+  unpluginFactory
+} from "./chunk-R3ITJTXO.js";
+import "./chunk-36ARBXVP.js";
+export {
+  src_default as default,
+  unplugin,
+  unpluginFactory
+};

package/dist/rollup.cjs

@@ -0,0 +1,13 @@
+"use strict";Object.defineProperty(exports, "__esModule", {value: true});
+
+var _chunkN4Z3Z2PUcjs = require('./chunk-N4Z3Z2PU.cjs');
+
+// src/rollup.ts
+var rollup_default = (options) => {
+  if (_chunkN4Z3Z2PUcjs.isDevelopment || (options == null ? void 0 : options.dev)) {
+    throw new Error(`If you want to use this plugin through rollup, please use "@stylexjs/rollup-plugin" instead`);
+  }
+};
+
+
+exports.default = rollup_default;

package/dist/rollup.d.cts

@@ -0,0 +1,3 @@
+declare const _default: (options?: any) => void;
+
+export { _default as default };

package/dist/rollup.d.ts

@@ -0,0 +1,3 @@
+declare const _default: (options?: any) => void;
+
+export { _default as default };

package/dist/rollup.js

@@ -0,0 +1,13 @@
+import {
+  isDevelopment
+} from "./chunk-36ARBXVP.js";
+
+// src/rollup.ts
+var rollup_default = (options) => {
+  if (isDevelopment || (options == null ? void 0 : options.dev)) {
+    throw new Error(`If you want to use this plugin through rollup, please use "@stylexjs/rollup-plugin" instead`);
+  }
+};
+export {
+  rollup_default as default
+};

package/dist/rspack.cjs

@@ -0,0 +1,11 @@
+"use strict";Object.defineProperty(exports, "__esModule", {value: true});
+
+var _chunk5FLQNHMUcjs = require('./chunk-5FLQNHMU.cjs');
+require('./chunk-N4Z3Z2PU.cjs');
+
+// src/rspack.ts
+var _unplugin = require('unplugin');
+var rspack_default = _unplugin.createRspackPlugin.call(void 0, _chunk5FLQNHMUcjs.unpluginFactory);
+
+
+exports.default = rspack_default;

package/dist/rspack.d.cts

@@ -0,0 +1,3 @@
+declare const _default: any;
+
+export { _default as default };

package/dist/rspack.d.ts

@@ -0,0 +1,3 @@
+declare const _default: any;
+
+export { _default as default };

package/dist/rspack.js

@@ -0,0 +1,11 @@
+import {
+  unpluginFactory
+} from "./chunk-R3ITJTXO.js";
+import "./chunk-36ARBXVP.js";
+
+// src/rspack.ts
+import { createRspackPlugin } from "unplugin";
+var rspack_default = createRspackPlugin(unpluginFactory);
+export {
+  rspack_default as default
+};

package/dist/types.cjs

@@ -0,0 +1 @@
+"use strict";

package/dist/types.d.cts

@@ -0,0 +1,27 @@
+import { FilterPattern } from '@rollup/pluginutils';
+
+type BabelConfig = {
+    plugins: any[];
+    presets: any[];
+    babelrc: boolean;
+};
+type StylexOptions = {
+    filename?: string;
+    stylexImports?: string[];
+    classNamePrefix?: string;
+    useCSSLayers?: boolean;
+    unstable_moduleResolution?: {
+        type: "commonjs" | "haste";
+        rootDir: string;
+    };
+    babelConfig?: BabelConfig;
+};
+type UnpluginStylexOptions = {
+    dev?: boolean;
+    include?: FilterPattern;
+    exclude?: FilterPattern;
+    enforce?: "post" | "pre";
+    stylex?: StylexOptions;
+};
+
+export type { BabelConfig, UnpluginStylexOptions };

package/dist/types.d.ts

@@ -0,0 +1,27 @@
+import { FilterPattern } from '@rollup/pluginutils';
+
+type BabelConfig = {
+    plugins: any[];
+    presets: any[];
+    babelrc: boolean;
+};
+type StylexOptions = {
+    filename?: string;
+    stylexImports?: string[];
+    classNamePrefix?: string;
+    useCSSLayers?: boolean;
+    unstable_moduleResolution?: {
+        type: "commonjs" | "haste";
+        rootDir: string;
+    };
+    babelConfig?: BabelConfig;
+};
+type UnpluginStylexOptions = {
+    dev?: boolean;
+    include?: FilterPattern;
+    exclude?: FilterPattern;
+    enforce?: "post" | "pre";
+    stylex?: StylexOptions;
+};
+
+export type { BabelConfig, UnpluginStylexOptions };

package/dist/vite.cjs

@@ -0,0 +1,11 @@
+"use strict";Object.defineProperty(exports, "__esModule", {value: true});
+
+var _chunk5FLQNHMUcjs = require('./chunk-5FLQNHMU.cjs');
+require('./chunk-N4Z3Z2PU.cjs');
+
+// src/vite.ts
+var _unplugin = require('unplugin');
+var vite_default = _unplugin.createVitePlugin.call(void 0, _chunk5FLQNHMUcjs.unpluginFactory);
+
+
+exports.default = vite_default;

package/dist/vite.d.cts

@@ -0,0 +1,3 @@
+declare const _default: any;
+
+export { _default as default };

package/dist/vite.d.ts

@@ -0,0 +1,3 @@
+declare const _default: any;
+
+export { _default as default };

package/dist/vite.js

@@ -0,0 +1,11 @@
+import {
+  unpluginFactory
+} from "./chunk-R3ITJTXO.js";
+import "./chunk-36ARBXVP.js";
+
+// src/vite.ts
+import { createVitePlugin } from "unplugin";
+var vite_default = createVitePlugin(unpluginFactory);
+export {
+  vite_default as default
+};

package/dist/webpack.cjs

@@ -0,0 +1,13 @@
+"use strict";Object.defineProperty(exports, "__esModule", {value: true});
+
+var _chunkN4Z3Z2PUcjs = require('./chunk-N4Z3Z2PU.cjs');
+
+// src/webpack.ts
+var webpack_default = (options) => {
+  if (_chunkN4Z3Z2PUcjs.isDevelopment || (options == null ? void 0 : options.dev)) {
+    throw new Error(`If you want to use this plugin through webpack, please use "@stylexjs/webpack-plugin" instead`);
+  }
+};
+
+
+exports.default = webpack_default;

package/dist/webpack.d.cts

@@ -0,0 +1,3 @@
+declare const _default: (options?: any) => void;
+
+export { _default as default };

package/dist/webpack.d.ts

@@ -0,0 +1,3 @@
+declare const _default: (options?: any) => void;
+
+export { _default as default };

package/dist/webpack.js

@@ -0,0 +1,13 @@
+import {
+  isDevelopment
+} from "./chunk-36ARBXVP.js";
+
+// src/webpack.ts
+var webpack_default = (options) => {
+  if (isDevelopment || (options == null ? void 0 : options.dev)) {
+    throw new Error(`If you want to use this plugin through webpack, please use "@stylexjs/webpack-plugin" instead`);
+  }
+};
+export {
+  webpack_default as default
+};

package/package.json

@@ -0,0 +1,75 @@
+{
+  "name": "unplugin-stylex",
+  "version": "0.0.1",
+  "packageManager": "pnpm@8.11.0",
+  "description": "Unplugin for stylex",
+  "repository": "https://github.com/eryue0220/unplugin-stylex",
+  "keywords": [
+    "unplugin",
+    "stylex",
+    "stylex-plugin",
+    "esbuild",
+    "rspack",
+    "vite"
+  ],
+  "author": "eryue0220<eryue0220@gmail.com>",
+  "license": "MIT",
+  "type": "module",
+  "main": "./dist/index.js",
+  "module": "./dist/index.js",
+  "types": "./dist/index.d.ts",
+  "exports": {
+    ".": {
+      "types": "./dist/index.d.ts",
+      "require": "./dist/index.cjs",
+      "import": "./dist/index.js"
+    },
+    "./esbuild": {
+      "types": "./dist/esbuild.d.ts",
+      "require": "./dist/esbuild.cjs",
+      "import": "./dist/esbuild.js"
+    },
+    "./vite": {
+      "types": "./dist/vite.d.ts",
+      "require": "./dist/vite.cjs",
+      "import": "./dist/vite.js"
+    },
+    "./rspack": {
+      "types": "./dist/rspack.d.ts",
+      "require": "./dist/rspack.cjs",
+      "import": "./dist/rspack.js"
+    },
+    "./types": {
+      "types": "./dist/types.d.ts",
+      "import": "./dist/types.js",
+      "require": "./dist/types.cjs"
+    },
+    "./*": "./*"
+  },
+  "scripts": {
+    "dev": "tsup src/*ts --watch src",
+    "build": "tsup src/*.ts --format cjs,esm --dts --splitting --clean",
+    "test": "vitest",
+    "test:update": "vitest -u",
+    "test:coverage": "vitest --coverage"
+  },
+  "engines": {
+    "node": ">=16.14.0"
+  },
+  "dependencies": {
+    "@babel/core": "^7.23.6",
+    "@babel/plugin-syntax-flow": "^7.23.3",
+    "@babel/plugin-syntax-jsx": "^7.23.3",
+    "@babel/plugin-syntax-typescript": "^7.23.3",
+    "@rollup/pluginutils": "^5.1.0",
+    "@stylexjs/babel-plugin": "^0.3.0",
+    "unplugin": "^1.5.1"
+  },
+  "devDependencies": {
+    "@types/node": "^20.10.5",
+    "tsup": "^8.0.1",
+    "typescript": "^5.3.3",
+    "vite": "^5.0.10",
+    "vitest": "^1.1.0"
+  }
+}

package/pnpm-workspace.yaml

@@ -0,0 +1,2 @@
+packages:
+  - examples/*

package/src/core/constants.ts

@@ -0,0 +1,7 @@
+export const PLUGIN_NAME = 'unplugin-stylex'
+
+export const isDevelopment = (
+  process.env.NODE_ENV !== 'production' ||
+  process.env.BABEL_ENV !== 'production'
+)
+

package/src/core/transformer.ts

@@ -0,0 +1,61 @@
+import * as fs from 'fs/promises'
+import * as path from 'path'
+
+import { transformAsync } from '@babel/core'
+import flowSyntaxPlugin from '@babel/plugin-syntax-flow'
+import jsxSyntaxPlugin from '@babel/plugin-syntax-jsx'
+import typescriptSyntaxPlugin from '@babel/plugin-syntax-typescript'
+import stylexBabelPlugin from '@stylexjs/babel-plugin'
+
+export async function transformer(context) {
+  const { id, source, options } = context
+  const stylex = options.stylex
+  const extname = path.extname(id)
+  const stylexRules = {}
+
+  if (stylex.stylexImports.some((importName) => source.includes(importName))) {
+    const originSource = stylex.babelConfig.babelrc
+      ? await fs.readFile(id, 'utf-8')
+      : source
+
+    const { code, map, metadata } = await transformAsync(
+      originSource,
+      {
+        babelrc: stylex.babelConfig.babelrc,
+        filename: id,
+        plugins: [
+          ...(stylex.babelConfig.plugins || []),
+          extname === '.ts'
+            ? typescriptSyntaxPlugin
+            : extname === '.tsx'
+              ? [typescriptSyntaxPlugin, { isTSX: true }]
+              : flowSyntaxPlugin,
+
+          jsxSyntaxPlugin,
+          [
+            stylexBabelPlugin,
+            {
+              dev: options.dev,
+              unstable_moduleResolution: stylex.unstable_moduleResolution,
+              importSources: stylex.stylexImports,
+              ...stylex,
+            }
+          ],
+        ],
+        presets: stylex.babelConfig.presets,
+      }
+    )
+
+    if (metadata.stylex && metadata.stylex.length > 0) {
+      stylexRules[id] = metadata.stylex
+    }
+
+    if (!stylex.babelConfig.babelrc) {
+      return { code, map, stylexRules }
+    }
+
+    return { code, stylexRules }
+  }
+
+  return { code: source }
+}

package/src/core/utils.ts

@@ -0,0 +1,26 @@
+import type { UnpluginStylexOptions, BabelConfig } from '@/types'
+import { isDevelopment } from './constants'
+
+export function getOptions(options: UnpluginStylexOptions = ({} as UnpluginStylexOptions)) {
+  const stylex = options.stylex || {}
+
+  return {
+    ...options,
+    dev: options.dev || isDevelopment,
+    include: options.include || [/\.[jt]sx?$/],
+    exclude: options.exclude || [/node_modules/, /\.git/],
+    enforce: options.enforce || 'pre',
+    stylex: {
+      ...stylex,
+      filename: stylex.filename || 'stylex.css',
+      stylexImports: stylex.stylexImports || ['stylex', '@stylexjs/stylex'],
+      useCSSLayers: stylex.useCSSLayers || false,
+      unstable_moduleResolution: stylex.unstable_moduleResolution || { type: 'commonJS', rootDir: process.cwd() },
+      babelConfig: {
+        babelrc: (stylex.babelConfig || {}).babelrc || false,
+        plugins: (stylex.babelConfig || {}).plugins || [],
+        presets: (stylex.babelConfig || {}).presets || [],
+      },
+    },
+  }
+}

package/src/esbuild.ts

@@ -0,0 +1,4 @@
+import { createEsbuildPlugin } from 'unplugin'
+import { unpluginFactory } from '.'
+
+export default createEsbuildPlugin(unpluginFactory)

package/src/index.ts

@@ -0,0 +1,61 @@
+import { createFilter } from '@rollup/pluginutils'
+import stylexBabelPlugin from '@stylexjs/babel-plugin'
+import { createUnplugin } from 'unplugin'
+import type { UnpluginFactory } from 'unplugin'
+
+import { PLUGIN_NAME } from './core/constants'
+import { getOptions } from './core/utils'
+import { transformer } from './core/transformer'
+import type { UnpluginStylexOptions } from './types'
+
+export const unpluginFactory: UnpluginFactory<UnpluginStylexOptions | undefined> = (rawOptions = {}, meta) => {
+  const options = getOptions(rawOptions)
+  const filter = createFilter(options.include, options.exclude)
+  const stylexRules = {}
+
+  return {
+    name: PLUGIN_NAME,
+    enforce: options.enforce,
+
+    transformInclude(id) {
+      return filter(id)
+    },
+
+    async transform(source, id) {
+      const context = {
+        pluginContext: this,
+        options,
+        source,
+        id,
+      }
+
+      try {
+        const result = await transformer(context)
+
+        if (result.stylexRules && result.stylexRules[id]) {
+          stylexRules[id] = result.stylexRules[id]
+        }
+
+        return result
+      } catch (error) {
+        this.error(error)
+      }
+    },
+
+    buildEnd() {
+      const rules = Object.values(stylexRules).flat()
+      if (rules.length > 0) {
+        const collectedCSS = (stylexBabelPlugin as any).processStylexRules(rules, options.stylex.useCSSLayers)
+        this.emitFile({
+          fileName: options.stylex.filename,
+          source: collectedCSS,
+          type: 'asset',
+        })
+      }
+    },
+  }
+}
+
+export const unplugin = createUnplugin(unpluginFactory)
+
+export default unplugin

package/src/rollup.ts

@@ -0,0 +1,7 @@
+import { isDevelopment } from './core/constants'
+
+export default (options?) => {
+  if (isDevelopment || options?.dev) {
+    throw new Error(`If you want to use this plugin through rollup, please use "@stylexjs/rollup-plugin" instead`)
+  }
+}

package/src/rspack.ts

@@ -0,0 +1,4 @@
+import { createRspackPlugin } from 'unplugin'
+import { unpluginFactory } from '.'
+
+export default createRspackPlugin(unpluginFactory) as any

package/src/types.ts

@@ -0,0 +1,27 @@
+import type { FilterPattern } from '@rollup/pluginutils'
+
+export type BabelConfig = {
+  plugins: any[]
+  presets: any[]
+  babelrc: boolean
+}
+
+type StylexOptions = {
+  filename?: string
+  stylexImports?: string[]
+  classNamePrefix?: string
+  useCSSLayers?:  boolean
+  unstable_moduleResolution?: {
+    type: "commonjs" | "haste"
+    rootDir: string
+  }
+  babelConfig?: BabelConfig
+}
+
+export type UnpluginStylexOptions = {
+  dev?: boolean
+  include?: FilterPattern
+  exclude?: FilterPattern
+  enforce?: "post" | "pre"
+  stylex?: StylexOptions
+}

package/src/vite.ts

@@ -0,0 +1,4 @@
+import { createVitePlugin } from 'unplugin'
+import { unpluginFactory } from '.'
+
+export default createVitePlugin(unpluginFactory) as any

package/src/webpack.ts

@@ -0,0 +1,7 @@
+import { isDevelopment } from './core/constants'
+
+export default (options?) => {
+  if (isDevelopment || options?.dev) {
+    throw new Error(`If you want to use this plugin through webpack, please use "@stylexjs/webpack-plugin" instead`)
+  }
+}

package/tsconfig.json

@@ -0,0 +1,18 @@
+{
+  "compilerOptions": {
+    "baseUrl": ".",
+    "declaration": true,
+    "declarationMap": true,
+    "declarationDir": "dist",
+    "outDir": "./dist",
+    "lib": ["ESNext"],
+    "moduleResolution": "Node",
+    "preserveSymlinks": true,
+    "paths": {
+      "@/*": ["./src/*"]
+    }
+  },
+  "include": [
+    "src"
+  ]
+}