diff --git a/.flowconfig b/.flowconfig index 456aa352..cd5ec42c 100644 --- a/.flowconfig +++ b/.flowconfig @@ -30,7 +30,7 @@ module.name_mapper='^@stylexjs\/shared\/lib\/\([a-zA-Z0-9_\-]+\)$' -> ' '/packages/stylex/src/stylex.js' module.name_mapper='^@stylexjs/stylex\/lib\/\([a-zA-Z0-9_\-]+\)$' -> '/packages/stylex/src/\1' module.name_mapper='^@stylexjs/babel-plugin$' -> '/packages/babel-plugin/src/index.js' -module.name_mapper='^@stylexjs/babel-plugin\/lib\/\([a-zA-Z0-9_\-]+\)$' -> '/packages/babel-plugin/src/\1' +module.name_mapper='^@stylexjs/babel-plugin\/lib\/\(.+\)$' -> '/packages/babel-plugin/src/\1' ; type-stubs module.system.node.resolve_dirname=flow_modules module.system.node.resolve_dirname=node_modules diff --git a/apps/cli-example/package.json b/apps/cli-example/package.json index c93c0276..1ca0a4f6 100644 --- a/apps/cli-example/package.json +++ b/apps/cli-example/package.json @@ -1,19 +1,19 @@ { "name": "stylex-cli-example", - "version": "0.10.0", + "version": "0.10.1", "private": true, "scripts": { "transform": "stylex --config .stylex.json5" }, "dependencies": { - "@stylexjs/open-props": "0.10.0", + "@stylexjs/open-props": "0.10.1", "react": "^18", "react-dom": "^18" }, "devDependencies": { "@babel/preset-react": "^7.25.7", "@babel/preset-typescript": "^7.25.7", - "@stylexjs/cli": "0.10.0", + "@stylexjs/cli": "0.10.1", "@types/react": "^18.3.11", "@types/react-dom": "^18.3.1", "typescript": "^5" diff --git a/apps/docs/blog/2025-01-17-Release-v0.10.1.mdx b/apps/docs/blog/2025-01-17-Release-v0.10.1.mdx new file mode 100644 index 00000000..3c425d64 --- /dev/null +++ b/apps/docs/blog/2025-01-17-Release-v0.10.1.mdx @@ -0,0 +1,25 @@ +--- +# Copyright (c) Meta Platforms, Inc. and affiliates. +# +# This source code is licensed under the MIT license found in the +# LICENSE file in the root directory of this source tree. +slug: v0.10.1 +title: Release 0.10.1 +authors: + - nmn +tags: + - release +--- + + + +# Release 0.10.1 + +## Release Notes + +- Fixed a bug where variables with camelCase names were incorrectly converted to kebab-case (Thanks [yasuhiro-yamamoto](https://github.com/yasuhiro-yamamoto)) +- Fixed a bug in the eslint `valid-styles` rule where it would incorrectly flag when importing a file with an extension (Thanks [beaumontjonathan](https://github.com/beaumontjonathan)) +- Added support for `.js` resolved file extension imports from `.ts` files (Thanks [beaumontjonathan](https://github.com/beaumontjonathan)) +- Replaced `crypto` with `murmurhash` for CLI caching +- Fixed a bug where the `import resolve` function would not respect the Windows system (Thanks [nonzzz](https://github.com/nonzzz)) +- Fixed a bug where the `initial-value` in `@Property` was invalid diff --git a/apps/docs/docs/learn/06-recipes/03-descendant styles.mdx b/apps/docs/docs/learn/06-recipes/03-descendant styles.mdx index 13933fd9..a957e09d 100644 --- a/apps/docs/docs/learn/06-recipes/03-descendant styles.mdx +++ b/apps/docs/docs/learn/06-recipes/03-descendant styles.mdx @@ -6,9 +6,6 @@ sidebar_position: 3 --- -import Tabs from '@theme/Tabs'; -import TabItem from '@theme/TabItem'; - # Variables for descendant styles It is not uncommon to define styles on an element that are dependent on a parent element's state, diff --git a/apps/docs/docs/learn/06-recipes/04-reset-themes.mdx b/apps/docs/docs/learn/06-recipes/04-reset-themes.mdx new file mode 100644 index 00000000..4f59a076 --- /dev/null +++ b/apps/docs/docs/learn/06-recipes/04-reset-themes.mdx @@ -0,0 +1,30 @@ +--- +# Copyright (c) Meta Platforms, Inc. and affiliates. +# +# This source code is licensed under the MIT license found in the +# LICENSE file in the root directory of this source tree. +sidebar_position: 4 +--- + +# Reset Theme + +The `stylex.defineVars` function is used to create a set of CSS variables, +called `VarGroup`s. Further, the `stylex.createTheme` function can be used to create +`Theme`s, that override the values of the variables defined within `VarGroup`s. + +Many `VarGroup`s can be defined which can then be independently overridden with `Theme`s. +However, `Theme`s for the *same* `VarGroup` are mutually exclusive and do not merge. +Any variable in a `VarGroup` that is not explicitly overridden in a `Theme` for that `VarGroup` +is set to its default value. + +This characteristic of `Theme`s can be used to define a "empty" theme that resets all variables +to their default values. + +## Example + +```tsx +import * as stylex from '@stylexjs/stylex'; +import { vars } from './variables.stylex'; + +export const resetVars = stylex.createTheme(vars, {}); +``` \ No newline at end of file diff --git a/apps/docs/docs/learn/06-recipes/05-merge-themes.mdx b/apps/docs/docs/learn/06-recipes/05-merge-themes.mdx new file mode 100644 index 00000000..4d9231e7 --- /dev/null +++ b/apps/docs/docs/learn/06-recipes/05-merge-themes.mdx @@ -0,0 +1,42 @@ +--- +# Copyright (c) Meta Platforms, Inc. and affiliates. +# +# This source code is licensed under the MIT license found in the +# LICENSE file in the root directory of this source tree. +sidebar_position: 5 +--- + +# Merge Themes + +`Theme`s for the *same* `VarGroup` are mutually exclusive and do not merge. +Any variable in a `VarGroup` that is not explicitly overridden in a `Theme` for that `VarGroup` +is set to its default value. + +However, you can reuse common constants when defining multiple themes for a particular +`VarGroup` and avoid excessive repetition. + +## Example + +```tsx +import * as stylex from '@stylexjs/stylex'; +import { vars } from './variables.stylex'; + +const themeBlueVars = { + backgroundColor: 'blue', +}; +const themeBlue = stylex.createTheme(vars, themeBlueVars); + +const themeBigVars = { + size: '128px', +}; +const themeBig = stylex.createTheme(vars, themeBigVars); + +const themeBigBlueVars = {...themeBlueVars, ...themeBigVars}; +const themeBigBlue = stylex.createTheme(vars, themeBigBlueVars); +``` + +The StyleX compiler is able to resolve local object constants and merge them. +This is useful to be able to define a `Theme` that merges the values of two or more +other `Theme`s without repetition. + + diff --git a/apps/docs/docs/learn/06-recipes/06-light-dark-themes.mdx b/apps/docs/docs/learn/06-recipes/06-light-dark-themes.mdx new file mode 100644 index 00000000..07640f05 --- /dev/null +++ b/apps/docs/docs/learn/06-recipes/06-light-dark-themes.mdx @@ -0,0 +1,79 @@ +--- +# Copyright (c) Meta Platforms, Inc. and affiliates. +# +# This source code is licensed under the MIT license found in the +# LICENSE file in the root directory of this source tree. +sidebar_position: 6 +--- + +# Light and Dark Themes + +It is a common pattern to define separate `light`, `dark` and system themes +to provide the ability to switch between different color schemes. + +This would typically be done by defining three separate `Theme`s: + +```tsx +const lightVars = { + primaryColor: 'black', + ... +}; +export const light = stylex.createTheme(vars, lightVars); + +const darkVars = { + primaryColor: 'white', + ... +}; +export const dark = stylex.createTheme(vars, darkVars); + +const systemVars = { + primaryColor: { + default: 'black', + '@media (prefers-color-scheme: dark)': 'white', + }, + ... +}; +export const system = stylex.createTheme(vars, systemVars); +``` +This pattern is well supported and will work in all browsers that support CSS variables. + +## Using the `light-dark()` CSS function + +In modern browsers, we suggest using the +[`light-dark()`](https://developer.mozilla.org/en-US/docs/Web/CSS/color_value/light-dark) +CSS function instead which will simplify the code and remove the need to define themes. + +```tsx +export const vars = stylex.defineVars({ + primaryColor: 'light-dark(black, white)', + ... +}); +``` + +You can now control the color scheme applied by using the `color-scheme` CSS property. + +```tsx +const styles = stylex.create({ + light: { + colorScheme: 'light', + }, + dark: { + colorScheme: 'dark', + }, + system: { + colorScheme: 'light dark', + }, +}); + +
+ ... +
+``` + +You *can* still define custom themes for other use-cases and use `light-dark()` within them. + +### Limitations + +1. The `light-dark()` CSS function can only be used for color values. +2. The `light-dark()` function is not supported in older browsers. + diff --git a/apps/docs/package.json b/apps/docs/package.json index ee5f6664..dfba59f0 100644 --- a/apps/docs/package.json +++ b/apps/docs/package.json @@ -23,7 +23,7 @@ "@fortawesome/free-solid-svg-icons": "^6.7.1", "@fortawesome/react-fontawesome": "^0.2.2", "@mdx-js/react": "^1.6.22", - "@stylexjs/stylex": "0.10.0", + "@stylexjs/stylex": "0.10.1", "@vercel/analytics": "^1.1.1", "@webcontainer/api": "^1.3.0", "clsx": "^1.2.1", @@ -36,7 +36,7 @@ "devDependencies": { "@babel/eslint-parser": "^7.25.8", "@stylexjs/eslint-plugin": "0.8.0", - "@stylexjs/babel-plugin": "0.10.0", + "@stylexjs/babel-plugin": "0.10.1", "clean-css": "^5.3.2", "eslint": "^8.57.1", "eslint-config-airbnb": "^19.0.4", diff --git a/apps/nextjs-example/package.json b/apps/nextjs-example/package.json index 161e686f..5e2515b4 100644 --- a/apps/nextjs-example/package.json +++ b/apps/nextjs-example/package.json @@ -18,7 +18,7 @@ }, "devDependencies": { "@stylexjs/eslint-plugin": "^0.7.5", - "@stylexjs/postcss-plugin": "0.10.0", + "@stylexjs/postcss-plugin": "0.10.1", "@types/node": "^22.7.6", "@types/react": "^18.3.11", "@types/react-dom": "^18.3.1", diff --git a/apps/rollup-example/package.json b/apps/rollup-example/package.json index 251d296b..35edd6a8 100644 --- a/apps/rollup-example/package.json +++ b/apps/rollup-example/package.json @@ -1,6 +1,6 @@ { "name": "rollup-example", - "version": "0.10.0", + "version": "0.10.1", "description": "A simple rollup example to test stylexjs/rollup-plugin", "main": "index.js", "scripts": { @@ -9,7 +9,7 @@ }, "license": "MIT", "dependencies": { - "@stylexjs/stylex": "0.10.0", - "@stylexjs/rollup-plugin": "0.10.0" + "@stylexjs/stylex": "0.10.1", + "@stylexjs/rollup-plugin": "0.10.1" } } diff --git a/apps/webpack-example/package.json b/apps/webpack-example/package.json index 2ed84f91..19a90e0f 100644 --- a/apps/webpack-example/package.json +++ b/apps/webpack-example/package.json @@ -1,6 +1,6 @@ { "name": "webpack-example", - "version": "0.10.0", + "version": "0.10.1", "description": "A simple webpack example to test stylexjs/webpack-plugin", "main": "index.js", "scripts": { @@ -9,10 +9,10 @@ }, "license": "MIT", "dependencies": { - "@stylexjs/stylex": "0.10.0" + "@stylexjs/stylex": "0.10.1" }, "devDependencies": { - "@stylexjs/webpack-plugin": "0.10.0", + "@stylexjs/webpack-plugin": "0.10.1", "html-webpack-plugin": "^5.6.0", "webpack": "^5.75.0", "webpack-cli": "^5.0.0" diff --git a/package-lock.json b/package-lock.json index 5c4f5873..692a7d91 100644 --- a/package-lock.json +++ b/package-lock.json @@ -1,12 +1,12 @@ { "name": "stylex-monorepo", - "version": "0.10.0", + "version": "0.10.1", "lockfileVersion": 2, "requires": true, "packages": { "": { "name": "stylex-monorepo", - "version": "0.10.0", + "version": "0.10.1", "hasInstallScript": true, "license": "MIT", "workspaces": [ @@ -57,16 +57,16 @@ }, "apps/cli-example": { "name": "stylex-cli-example", - "version": "0.10.0", + "version": "0.10.1", "dependencies": { - "@stylexjs/open-props": "0.10.0", + "@stylexjs/open-props": "0.10.1", "react": "^18", "react-dom": "^18" }, "devDependencies": { "@babel/preset-react": "^7.25.7", "@babel/preset-typescript": "^7.25.7", - "@stylexjs/cli": "0.10.0", + "@stylexjs/cli": "0.10.1", "@types/react": "^18.3.11", "@types/react-dom": "^18.3.1", "typescript": "^5" @@ -113,7 +113,7 @@ "@fortawesome/free-solid-svg-icons": "^6.7.1", "@fortawesome/react-fontawesome": "^0.2.2", "@mdx-js/react": "^1.6.22", - "@stylexjs/stylex": "0.10.0", + "@stylexjs/stylex": "0.10.1", "@vercel/analytics": "^1.1.1", "@webcontainer/api": "^1.3.0", "clsx": "^1.2.1", @@ -125,7 +125,7 @@ }, "devDependencies": { "@babel/eslint-parser": "^7.25.8", - "@stylexjs/babel-plugin": "0.10.0", + "@stylexjs/babel-plugin": "0.10.1", "@stylexjs/eslint-plugin": "0.8.0", "clean-css": "^5.3.2", "eslint": "^8.57.1", @@ -1007,7 +1007,7 @@ }, "devDependencies": { "@stylexjs/eslint-plugin": "^0.7.5", - "@stylexjs/postcss-plugin": "0.10.0", + "@stylexjs/postcss-plugin": "0.10.1", "@types/json-schema": "^7.0.15", "@types/node": "^22.7.6", "@types/react": "^18.3.11", @@ -1673,21 +1673,21 @@ } }, "apps/rollup-example": { - "version": "0.10.0", + "version": "0.10.1", "license": "MIT", "dependencies": { - "@stylexjs/rollup-plugin": "0.10.0", - "@stylexjs/stylex": "0.10.0" + "@stylexjs/rollup-plugin": "0.10.1", + "@stylexjs/stylex": "0.10.1" } }, "apps/webpack-example": { - "version": "0.10.0", + "version": "0.10.1", "license": "MIT", "dependencies": { - "@stylexjs/stylex": "0.10.0" + "@stylexjs/stylex": "0.10.1" }, "devDependencies": { - "@stylexjs/webpack-plugin": "0.10.0", + "@stylexjs/webpack-plugin": "0.10.1", "html-webpack-plugin": "^5.6.0", "webpack": "^5.75.0", "webpack-cli": "^5.0.0" @@ -27326,7 +27326,7 @@ }, "packages/babel-plugin": { "name": "@stylexjs/babel-plugin", - "version": "0.10.0", + "version": "0.10.1", "license": "MIT", "dependencies": { "@babel/core": "^7.25.8", @@ -27334,20 +27334,20 @@ "@babel/traverse": "^7.25.7", "@babel/types": "^7.25.8", "@dual-bundle/import-meta-resolve": "^4.1.0", - "@stylexjs/shared": "0.10.0", - "@stylexjs/stylex": "0.10.0" + "@stylexjs/shared": "0.10.1", + "@stylexjs/stylex": "0.10.1" } }, "packages/cli": { "name": "@stylexjs/cli", - "version": "0.10.0", + "version": "0.10.1", "license": "MIT", "dependencies": { "@babel/core": "7.25.8", "@babel/plugin-syntax-jsx": "^7.25.7", "@babel/plugin-syntax-typescript": "^7.25.7", "@babel/types": "^7.25.8", - "@stylexjs/babel-plugin": "0.10.0", + "@stylexjs/babel-plugin": "0.10.1", "ansis": "^3.3.2", "fb-watchman": "^2.0.2", "json5": "^2.2.3", @@ -27358,28 +27358,28 @@ "stylex": "lib/index.js" }, "devDependencies": { - "@stylexjs/scripts": "0.10.0" + "@stylexjs/scripts": "0.10.1" } }, "packages/dev-runtime": { "name": "@stylexjs/dev-runtime", - "version": "0.10.0", + "version": "0.10.1", "license": "MIT", "dependencies": { - "@stylexjs/shared": "0.10.0" + "@stylexjs/shared": "0.10.1" } }, "packages/esbuild-plugin": { "name": "@stylexjs/esbuild-plugin", - "version": "0.10.0", + "version": "0.10.1", "license": "MIT", "dependencies": { "@babel/core": "^7.25.8", "@babel/plugin-syntax-flow": "^7.25.7", "@babel/plugin-syntax-jsx": "^7.25.7", "@babel/plugin-syntax-typescript": "^7.25.7", - "@stylexjs/babel-plugin": "0.10.0", - "@stylexjs/shared": "0.10.0", + "@stylexjs/babel-plugin": "0.10.1", + "@stylexjs/shared": "0.10.1", "babel-plugin-syntax-hermes-parser": "^0.25.0", "esbuild": "^0.24.0" }, @@ -27401,7 +27401,7 @@ }, "packages/eslint-plugin": { "name": "@stylexjs/eslint-plugin", - "version": "0.10.0", + "version": "0.10.1", "license": "MIT", "dependencies": { "css-shorthand-expand": "^1.2.0", @@ -27410,14 +27410,14 @@ }, "packages/nextjs-plugin": { "name": "@stylexjs/nextjs-plugin", - "version": "0.10.0", + "version": "0.10.1", "license": "MIT", "dependencies": { "@babel/core": "^7.25.8", "@babel/plugin-syntax-flow": "^7.25.7", "@babel/plugin-syntax-jsx": "^7.25.7", "@babel/plugin-syntax-typescript": "^7.25.7", - "@stylexjs/babel-plugin": "0.10.0" + "@stylexjs/babel-plugin": "0.10.1" }, "devDependencies": { "next": "^14.0.1", @@ -27718,22 +27718,22 @@ }, "packages/open-props": { "name": "@stylexjs/open-props", - "version": "0.10.0", + "version": "0.10.1", "license": "MIT", "dependencies": { - "@stylexjs/stylex": "0.10.0" + "@stylexjs/stylex": "0.10.1" }, "devDependencies": { - "@stylexjs/scripts": "0.10.0" + "@stylexjs/scripts": "0.10.1" } }, "packages/postcss-plugin": { "name": "@stylexjs/postcss-plugin", - "version": "0.10.0", + "version": "0.10.1", "license": "MIT", "dependencies": { "@babel/core": "^7.25.8", - "@stylexjs/babel-plugin": "0.10.0", + "@stylexjs/babel-plugin": "0.10.1", "fast-glob": "^3.3.2", "glob-parent": "^6.0.2", "is-glob": "^4.0.3", @@ -27753,20 +27753,20 @@ }, "packages/rollup-plugin": { "name": "@stylexjs/rollup-plugin", - "version": "0.10.0", + "version": "0.10.1", "license": "MIT", "dependencies": { "@babel/core": "^7.25.8", "@babel/plugin-syntax-flow": "^7.25.7", "@babel/plugin-syntax-jsx": "^7.25.7", "@babel/plugin-syntax-typescript": "^7.25.7", - "@stylexjs/babel-plugin": "0.10.0", + "@stylexjs/babel-plugin": "0.10.1", "lightningcss": "^1.27.0" } }, "packages/scripts": { "name": "@stylexjs/scripts", - "version": "0.10.0", + "version": "0.10.1", "license": "MIT", "dependencies": { "brotli-size": "^4.0.0", @@ -27782,18 +27782,18 @@ }, "packages/shared": { "name": "@stylexjs/shared", - "version": "0.10.0", + "version": "0.10.1", "license": "MIT", "dependencies": { "postcss-value-parser": "^4.1.0" }, "devDependencies": { - "@stylexjs/scripts": "0.10.0" + "@stylexjs/scripts": "0.10.1" } }, "packages/stylex": { "name": "@stylexjs/stylex", - "version": "0.10.0", + "version": "0.10.1", "license": "MIT", "dependencies": { "css-mediaquery": "^0.1.2", @@ -27801,20 +27801,20 @@ "styleq": "0.1.3" }, "devDependencies": { - "@stylexjs/scripts": "0.10.0", + "@stylexjs/scripts": "0.10.1", "cross-env": "^7.0.3" } }, "packages/webpack-plugin": { "name": "@stylexjs/webpack-plugin", - "version": "0.10.0", + "version": "0.10.1", "license": "MIT", "dependencies": { "@babel/core": "^7.25.8", "@babel/plugin-syntax-flow": "^7.25.7", "@babel/plugin-syntax-jsx": "^7.25.7", "@babel/plugin-syntax-typescript": "^7.25.7", - "@stylexjs/babel-plugin": "0.10.0" + "@stylexjs/babel-plugin": "0.10.1" }, "devDependencies": { "@babel/plugin-transform-modules-commonjs": "^7.25.7", @@ -32343,8 +32343,8 @@ "@babel/traverse": "^7.25.7", "@babel/types": "^7.25.8", "@dual-bundle/import-meta-resolve": "^4.1.0", - "@stylexjs/shared": "0.10.0", - "@stylexjs/stylex": "0.10.0" + "@stylexjs/shared": "0.10.1", + "@stylexjs/stylex": "0.10.1" } }, "@stylexjs/cli": { @@ -32354,8 +32354,8 @@ "@babel/plugin-syntax-jsx": "^7.25.7", "@babel/plugin-syntax-typescript": "^7.25.7", "@babel/types": "^7.25.8", - "@stylexjs/babel-plugin": "0.10.0", - "@stylexjs/scripts": "0.10.0", + "@stylexjs/babel-plugin": "0.10.1", + "@stylexjs/scripts": "0.10.1", "ansis": "^3.3.2", "fb-watchman": "^2.0.2", "json5": "^2.2.3", @@ -32366,7 +32366,7 @@ "@stylexjs/dev-runtime": { "version": "file:packages/dev-runtime", "requires": { - "@stylexjs/shared": "0.10.0" + "@stylexjs/shared": "0.10.1" } }, "@stylexjs/esbuild-plugin": { @@ -32376,8 +32376,8 @@ "@babel/plugin-syntax-flow": "^7.25.7", "@babel/plugin-syntax-jsx": "^7.25.7", "@babel/plugin-syntax-typescript": "^7.25.7", - "@stylexjs/babel-plugin": "0.10.0", - "@stylexjs/shared": "0.10.0", + "@stylexjs/babel-plugin": "0.10.1", + "@stylexjs/shared": "0.10.1", "@stylexjs/stylex": "^0.7.5", "babel-plugin-syntax-hermes-parser": "^0.25.0", "esbuild": "^0.24.0", @@ -32411,7 +32411,7 @@ "@babel/plugin-syntax-flow": "^7.25.7", "@babel/plugin-syntax-jsx": "^7.25.7", "@babel/plugin-syntax-typescript": "^7.25.7", - "@stylexjs/babel-plugin": "0.10.0", + "@stylexjs/babel-plugin": "0.10.1", "next": "^14.0.1", "react": "^18.2.0", "react-dom": "^18.2.0" @@ -32570,15 +32570,15 @@ "@stylexjs/open-props": { "version": "file:packages/open-props", "requires": { - "@stylexjs/scripts": "0.10.0", - "@stylexjs/stylex": "0.10.0" + "@stylexjs/scripts": "0.10.1", + "@stylexjs/stylex": "0.10.1" } }, "@stylexjs/postcss-plugin": { "version": "file:packages/postcss-plugin", "requires": { "@babel/core": "^7.25.8", - "@stylexjs/babel-plugin": "0.10.0", + "@stylexjs/babel-plugin": "0.10.1", "fast-glob": "^3.3.2", "glob-parent": "^6.0.2", "is-glob": "^4.0.3", @@ -32602,7 +32602,7 @@ "@babel/plugin-syntax-flow": "^7.25.7", "@babel/plugin-syntax-jsx": "^7.25.7", "@babel/plugin-syntax-typescript": "^7.25.7", - "@stylexjs/babel-plugin": "0.10.0", + "@stylexjs/babel-plugin": "0.10.1", "lightningcss": "^1.27.0" } }, @@ -32619,14 +32619,14 @@ "@stylexjs/shared": { "version": "file:packages/shared", "requires": { - "@stylexjs/scripts": "0.10.0", + "@stylexjs/scripts": "0.10.1", "postcss-value-parser": "^4.1.0" } }, "@stylexjs/stylex": { "version": "file:packages/stylex", "requires": { - "@stylexjs/scripts": "0.10.0", + "@stylexjs/scripts": "0.10.1", "cross-env": "^7.0.3", "css-mediaquery": "^0.1.2", "invariant": "^2.2.4", @@ -32641,7 +32641,7 @@ "@babel/plugin-syntax-jsx": "^7.25.7", "@babel/plugin-syntax-typescript": "^7.25.7", "@babel/plugin-transform-modules-commonjs": "^7.25.7", - "@stylexjs/babel-plugin": "0.10.0", + "@stylexjs/babel-plugin": "0.10.1", "webpack": "^5.88.2" } }, @@ -35290,9 +35290,9 @@ "@fortawesome/free-solid-svg-icons": "^6.7.1", "@fortawesome/react-fontawesome": "^0.2.2", "@mdx-js/react": "^1.6.22", - "@stylexjs/babel-plugin": "0.10.0", + "@stylexjs/babel-plugin": "0.10.1", "@stylexjs/eslint-plugin": "0.8.0", - "@stylexjs/stylex": "0.10.0", + "@stylexjs/stylex": "0.10.1", "@vercel/analytics": "^1.1.1", "@webcontainer/api": "^1.3.0", "clean-css": "^5.3.2", @@ -41771,7 +41771,7 @@ "requires": { "@stylexjs/eslint-plugin": "^0.7.5", "@stylexjs/open-props": "^0.7.5", - "@stylexjs/postcss-plugin": "0.10.0", + "@stylexjs/postcss-plugin": "0.10.1", "@stylexjs/stylex": "^0.7.5", "@types/json-schema": "^7.0.15", "@types/node": "^22.7.6", @@ -44068,8 +44068,8 @@ "rollup-example": { "version": "file:apps/rollup-example", "requires": { - "@stylexjs/rollup-plugin": "0.10.0", - "@stylexjs/stylex": "0.10.0" + "@stylexjs/rollup-plugin": "0.10.1", + "@stylexjs/stylex": "0.10.1" } }, "rtl-detect": { @@ -44981,8 +44981,8 @@ "requires": { "@babel/preset-react": "^7.25.7", "@babel/preset-typescript": "^7.25.7", - "@stylexjs/cli": "0.10.0", - "@stylexjs/open-props": "0.10.0", + "@stylexjs/cli": "0.10.1", + "@stylexjs/open-props": "0.10.1", "@types/react": "^18.3.11", "@types/react-dom": "^18.3.1", "react": "^18", @@ -46274,8 +46274,8 @@ "webpack-example": { "version": "file:apps/webpack-example", "requires": { - "@stylexjs/stylex": "0.10.0", - "@stylexjs/webpack-plugin": "0.10.0", + "@stylexjs/stylex": "0.10.1", + "@stylexjs/webpack-plugin": "0.10.1", "html-webpack-plugin": "^5.6.0", "webpack": "^5.75.0", "webpack-cli": "^5.0.0" diff --git a/package.json b/package.json index df59f44b..246bd864 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "stylex-monorepo", - "version": "0.10.0", + "version": "0.10.1", "license": "MIT", "private": true, "scripts": { diff --git a/packages/babel-plugin/__tests__/evaluation/stylex-import-evaluation-test.js b/packages/babel-plugin/__tests__/evaluation/stylex-import-evaluation-test.js index 9e23cdfc..95c93ca8 100644 --- a/packages/babel-plugin/__tests__/evaluation/stylex-import-evaluation-test.js +++ b/packages/babel-plugin/__tests__/evaluation/stylex-import-evaluation-test.js @@ -371,7 +371,7 @@ describe('Evaluation of imported values works based on configuration', () => { import 'otherFile.stylex'; import { MyTheme } from 'otherFile.stylex'; _inject2(".__hashed_var__b69i2g{--__hashed_var__1jqb1tb:var(----__hashed_var__1jqb1tb)}", 1); - _inject2("@property ----__hashed_var__1jqb1tb { syntax: \\"*\\"; inherits: false; initial-value: \\"*\\";}", 0); + _inject2("@property ----__hashed_var__1jqb1tb { syntax: \\"*\\"; inherits: false;}", 0); const styles = { color: color => [{ "--__hashed_var__1jqb1tb": color == null ? null : "__hashed_var__b69i2g", @@ -395,7 +395,7 @@ describe('Evaluation of imported values works based on configuration', () => { [ "----__hashed_var__1jqb1tb", { - "ltr": "@property ----__hashed_var__1jqb1tb { syntax: "*"; inherits: false; initial-value: "*";}", + "ltr": "@property ----__hashed_var__1jqb1tb { syntax: "*"; inherits: false;}", "rtl": null, }, 0, diff --git a/packages/babel-plugin/__tests__/stylex-transform-create-test.js b/packages/babel-plugin/__tests__/stylex-transform-create-test.js index 1f8fbeba..843cae52 100644 --- a/packages/babel-plugin/__tests__/stylex-transform-create-test.js +++ b/packages/babel-plugin/__tests__/stylex-transform-create-test.js @@ -1323,7 +1323,7 @@ describe('@stylexjs/babel-plugin', () => { import stylex from 'stylex'; _inject2(".xrkmrrc{background-color:red}", 3000); _inject2(".xfx01vb{color:var(--color)}", 3000); - _inject2("@property --color { syntax: \\"*\\"; inherits: false; initial-value: \\"*\\";}", 0); + _inject2("@property --color { syntax: \\"*\\"; inherits: false;}", 0); export const styles = { default: color => [{ backgroundColor: "xrkmrrc", @@ -1353,7 +1353,7 @@ describe('@stylexjs/babel-plugin', () => { import stylex from 'stylex'; _inject2(".xrkmrrc{background-color:red}", 3000); _inject2(".x1bl4301{width:var(--width)}", 4000); - _inject2("@property --width { syntax: \\"*\\"; inherits: false; initial-value: \\"*\\";}", 0); + _inject2("@property --width { syntax: \\"*\\"; inherits: false;}", 0); export const styles = { default: width => [{ backgroundColor: "xrkmrrc", @@ -1387,7 +1387,7 @@ describe('@stylexjs/babel-plugin', () => { _inject2(".xrkmrrc{background-color:red}", 3000); _inject2(".xfx01vb{color:var(--color)}", 3000); _inject2(".x1mqxbix{color:black}", 3000); - _inject2("@property --color { syntax: \\"*\\"; inherits: false; initial-value: \\"*\\";}", 0); + _inject2("@property --color { syntax: \\"*\\"; inherits: false;}", 0); export const styles = { default: color => [{ backgroundColor: "xrkmrrc", @@ -1419,7 +1419,7 @@ describe('@stylexjs/babel-plugin', () => { var _inject2 = _inject; import stylex from 'stylex'; _inject2(".x15mgraa{--background-color:var(----background-color)}", 1); - _inject2("@property ----background-color { syntax: \\"*\\"; inherits: false; initial-value: \\"*\\";}", 0); + _inject2("@property ----background-color { syntax: \\"*\\"; inherits: false;}", 0); export const styles = { default: bgColor => [{ "--background-color": bgColor == null ? null : "x15mgraa", @@ -1449,7 +1449,7 @@ describe('@stylexjs/babel-plugin', () => { import stylex from 'stylex'; _inject2(".x1gykpug:hover{background-color:red}", 3130); _inject2(".xtyu0qe:hover{color:var(--1ijzsae)}", 3130); - _inject2("@property --1ijzsae { syntax: \\"*\\"; inherits: false; initial-value: \\"*\\";}", 0); + _inject2("@property --1ijzsae { syntax: \\"*\\"; inherits: false;}", 0); export const styles = { default: color => [{ ":hover_backgroundColor": "x1gykpug", @@ -1482,7 +1482,7 @@ describe('@stylexjs/babel-plugin', () => { _inject2(".xrkmrrc{background-color:red}", 3000); _inject2(".xfx01vb{color:var(--color)}", 3000); _inject2(".x1mqxbix{color:black}", 3000); - _inject2("@property --color { syntax: \\"*\\"; inherits: false; initial-value: \\"*\\";}", 0); + _inject2("@property --color { syntax: \\"*\\"; inherits: false;}", 0); export const styles = { default: color => [{ backgroundColor: "xrkmrrc", @@ -1514,7 +1514,7 @@ describe('@stylexjs/babel-plugin', () => { var _inject2 = _inject; import stylex from 'stylex'; _inject2(".x15mgraa{--background-color:var(----background-color)}", 1); - _inject2("@property ----background-color { syntax: \\"*\\"; inherits: false; initial-value: \\"*\\";}", 0); + _inject2("@property ----background-color { syntax: \\"*\\"; inherits: false;}", 0); export const styles = { default: bgColor => [{ "--background-color": bgColor == null ? null : "x15mgraa", @@ -1550,7 +1550,7 @@ describe('@stylexjs/babel-plugin', () => { _inject2(".x1n25116{color:var(--4xs81a)}", 3000); _inject2("@media (min-width: 1000px){.xtljkjt.xtljkjt:hover{color:green}}", 3330); _inject2(".x17z2mba:hover{color:blue}", 3130); - _inject2("@property --4xs81a { syntax: \\"*\\"; inherits: false; initial-value: \\"*\\";}", 0); + _inject2("@property --4xs81a { syntax: \\"*\\"; inherits: false;}", 0); export const styles = { default: color => [{ backgroundColor: "xrkmrrc", @@ -1587,8 +1587,8 @@ describe('@stylexjs/babel-plugin', () => { _inject2(".x1n25116{color:var(--4xs81a)}", 3000); _inject2("@media (min-width: 1000px){.xtljkjt.xtljkjt:hover{color:green}}", 3330); _inject2(".x1d4gdy3:hover{color:var(--w5m4kq)}", 3130); - _inject2("@property --4xs81a { syntax: \\"*\\"; inherits: false; initial-value: \\"*\\";}", 0); - _inject2("@property --w5m4kq { syntax: \\"*\\"; inherits: false; initial-value: \\"*\\";}", 0); + _inject2("@property --4xs81a { syntax: \\"*\\"; inherits: false;}", 0); + _inject2("@property --w5m4kq { syntax: \\"*\\"; inherits: false;}", 0); export const styles = { default: color => [{ backgroundColor: "xrkmrrc", @@ -1632,9 +1632,9 @@ describe('@stylexjs/babel-plugin', () => { _inject2(".x1k44ad6{margin-left:var(--14mfytm)}", 3000, ".x1k44ad6{margin-right:var(--14mfytm)}"); _inject2(".x10ktymb:hover{margin-left:var(--yepcm9)}", 3130, ".x10ktymb:hover{margin-right:var(--yepcm9)}"); _inject2(".x17zef60{margin-top:var(--marginTop)}", 4000); - _inject2("@property --14mfytm { syntax: \\"*\\"; inherits: false; initial-value: \\"*\\";}", 0); - _inject2("@property --yepcm9 { syntax: \\"*\\"; inherits: false; initial-value: \\"*\\";}", 0); - _inject2("@property --marginTop { syntax: \\"*\\"; inherits: false; initial-value: \\"*\\";}", 0); + _inject2("@property --14mfytm { syntax: \\"*\\"; inherits: false;}", 0); + _inject2("@property --yepcm9 { syntax: \\"*\\"; inherits: false;}", 0); + _inject2("@property --marginTop { syntax: \\"*\\"; inherits: false;}", 0); export const styles = { default: margin => [{ backgroundColor: "xrkmrrc", diff --git a/packages/babel-plugin/package.json b/packages/babel-plugin/package.json index 99ff9097..1d9ecabb 100644 --- a/packages/babel-plugin/package.json +++ b/packages/babel-plugin/package.json @@ -1,6 +1,6 @@ { "name": "@stylexjs/babel-plugin", - "version": "0.10.0", + "version": "0.10.1", "description": "StyleX babel plugin.", "main": "lib/index.js", "repository": "https://github.com/facebook/stylex", @@ -14,8 +14,8 @@ }, "dependencies": { "@babel/helper-module-imports": "^7.22.15", - "@stylexjs/shared": "0.10.0", - "@stylexjs/stylex": "0.10.0", + "@stylexjs/shared": "0.10.1", + "@stylexjs/stylex": "0.10.1", "@babel/core": "^7.25.8", "@babel/traverse": "^7.25.7", "@babel/types": "^7.25.8", diff --git a/packages/babel-plugin/src/index.js b/packages/babel-plugin/src/index.js index 106ffc1a..5361066b 100644 --- a/packages/babel-plugin/src/index.js +++ b/packages/babel-plugin/src/index.js @@ -12,6 +12,12 @@ import type { NodePath } from '@babel/traverse'; import type { PluginObj } from '@babel/core'; import type { StyleXOptions } from './utils/state-manager'; import StateManager from './utils/state-manager'; +import { + EXTENSIONS, + filePathResolver, + matchesFileSuffix, + getRelativePath, +} from './utils/state-manager'; import { readImportDeclarations, readRequires } from './visitors/imports'; import transformStyleXCreate from './visitors/stylex-create'; import transformStyleXDefineVars from './visitors/stylex-define-vars'; @@ -74,6 +80,44 @@ function styleXTransform(): PluginObj<> { // variables entirely if they're not needed. exit: (path: NodePath) => { path.traverse({ + ImportDeclaration(path: NodePath) { + const filename = state.filename; + if (filename == null || !state.options.rewriteAliases) { + return; + } + + const source = path.node.source.value; + + const aliases = state.options.aliases; + + const themeFileExtension = '.stylex'; + if (!matchesFileSuffix(themeFileExtension)(source)) { + return; + } + const resolvedFilePath = filePathResolver( + source, + filename, + aliases, + ); + + if (resolvedFilePath == null) { + return; + } + + let relativeFilePath = getRelativePath( + filename, + resolvedFilePath, + ); + + const extension = EXTENSIONS.find((ext) => + relativeFilePath.endsWith(ext), + ); + if (extension != null) { + relativeFilePath = relativeFilePath.slice(0, -extension.length); + } + + path.node.source.value = relativeFilePath; + }, Identifier(path: NodePath) { // Look for variables bound to `stylex.create` calls that are used // outside of `stylex(...)` calls diff --git a/packages/babel-plugin/src/utils/state-manager.js b/packages/babel-plugin/src/utils/state-manager.js index 5be6f8d6..8b1c34e9 100644 --- a/packages/babel-plugin/src/utils/state-manager.js +++ b/packages/babel-plugin/src/utils/state-manager.js @@ -78,6 +78,7 @@ export type StyleXOptions = $ReadOnly<{ genConditionalClasses: boolean, unstable_moduleResolution?: ?ModuleResolution, aliases?: ?$ReadOnly<{ [string]: string | $ReadOnlyArray }>, + rewriteAliases?: boolean, ... }>; @@ -85,6 +86,7 @@ type StyleXStateOptions = $ReadOnly<{ ...StyleXOptions, runtimeInjection: ?string | $ReadOnly<{ from: string, as: ?string }>, aliases?: ?$ReadOnly<{ [string]: $ReadOnlyArray }>, + rewriteAliases: boolean, ... }>; @@ -289,6 +291,10 @@ export default class StateManager { styleResolution, unstable_moduleResolution, treeshakeCompensation, + rewriteAliases: + typeof options.rewriteAliases === 'boolean' + ? options.rewriteAliases + : false, }; return opts; } @@ -671,7 +677,7 @@ const getPossibleFilePaths = (filePath: string) => { // a function that resolves the absolute path of a file when given the // relative path of the file from the source file -const filePathResolver = ( +export const filePathResolver = ( relativeFilePath: string, sourceFilePath: string, aliases: StyleXStateOptions['aliases'], @@ -680,8 +686,9 @@ const filePathResolver = ( // Try to resolve relative paths as is if (importPathStr.startsWith('.')) { try { - return moduleResolve(importPathStr, url.pathToFileURL(sourceFilePath)) - .pathname; + return url.fileURLToPath( + moduleResolve(importPathStr, url.pathToFileURL(sourceFilePath)), + ); } catch { continue; } @@ -691,8 +698,9 @@ const filePathResolver = ( const allAliases = possibleAliasedPaths(importPathStr, aliases); for (const possiblePath of allAliases) { try { - return moduleResolve(possiblePath, url.pathToFileURL(sourceFilePath)) - .pathname; + return url.fileURLToPath( + moduleResolve(possiblePath, url.pathToFileURL(sourceFilePath)), + ); } catch { continue; } @@ -702,7 +710,7 @@ const filePathResolver = ( return null; }; -const EXTENSIONS = ['.js', '.ts', '.tsx', '.jsx', '.mjs', '.cjs']; +export const EXTENSIONS = ['.js', '.ts', '.tsx', '.jsx', '.mjs', '.cjs']; const addFileExtension = ( importedFilePath: string, @@ -719,10 +727,11 @@ const addFileExtension = ( return importedFilePath + fileExtension; }; -const matchesFileSuffix = (allowedSuffix: string) => (filename: string) => - ['', ...EXTENSIONS].some((extension) => - filename.endsWith(`${allowedSuffix}${extension}`), - ); +export const matchesFileSuffix: (string) => (string) => boolean = + (allowedSuffix) => (filename) => + ['', ...EXTENSIONS].some((extension) => + filename.endsWith(`${allowedSuffix}${extension}`), + ); const getProgramPath = (path: NodePath<>): null | NodePath => { let programPath = path; @@ -747,3 +756,16 @@ const getProgramStatement = (path: NodePath<>): NodePath<> => { } return programPath; }; + +export function getRelativePath(from: string, to: string): string { + const relativePath = path.relative(path.parse(from).dir, to); + return formatRelativePath(toPosixPath(relativePath)); +} + +function toPosixPath(filePath: string): string { + return filePath.split(path.sep).join(path.posix.sep); +} + +function formatRelativePath(filePath: string) { + return filePath.startsWith('.') ? filePath : './' + filePath; +} diff --git a/packages/babel-plugin/src/visitors/stylex-create/index.js b/packages/babel-plugin/src/visitors/stylex-create/index.js index 27713950..6360064e 100644 --- a/packages/babel-plugin/src/visitors/stylex-create/index.js +++ b/packages/babel-plugin/src/visitors/stylex-create/index.js @@ -134,7 +134,7 @@ export default function transformStyleXCreate( dynamicFnsNames.forEach((fnsName) => { injectedInheritStyles[fnsName] = { priority: 0, - ltr: `@property ${fnsName} { syntax: "*"; inherits: false; initial-value: "*";}`, + ltr: `@property ${fnsName} { syntax: "*"; inherits: false;}`, rtl: null, }; }); diff --git a/packages/cli/package.json b/packages/cli/package.json index 639a4276..c1d9b695 100644 --- a/packages/cli/package.json +++ b/packages/cli/package.json @@ -1,6 +1,6 @@ { "name": "@stylexjs/cli", - "version": "0.10.0", + "version": "0.10.1", "description": "A cli to compile a folder with StyleX", "main": "./lib/transform.js", "repository": "https://www.github.com/facebook/stylex", @@ -19,7 +19,7 @@ "@babel/plugin-syntax-jsx": "^7.25.7", "@babel/plugin-syntax-typescript": "^7.25.7", "@babel/types": "^7.25.8", - "@stylexjs/babel-plugin": "0.10.0", + "@stylexjs/babel-plugin": "0.10.1", "ansis": "^3.3.2", "fb-watchman": "^2.0.2", "json5": "^2.2.3", @@ -27,7 +27,7 @@ "yargs": "^17.7.2" }, "devDependencies": { - "@stylexjs/scripts": "0.10.0" + "@stylexjs/scripts": "0.10.1" }, "bin": { "stylex": "./lib/index.js" diff --git a/packages/cli/src/config.js b/packages/cli/src/config.js index 15ad9bd6..091551bf 100644 --- a/packages/cli/src/config.js +++ b/packages/cli/src/config.js @@ -8,7 +8,7 @@ * @flow strict */ -import type { Rule } from '@stylexjs/babel-plugin'; +import type { Rule, Options as StyleXOptions } from '@stylexjs/babel-plugin'; export type ModuleType = | string @@ -24,7 +24,7 @@ export type CliConfig = { babelPluginsPost?: $ReadOnlyArray, modules_EXPERIMENTAL: $ReadOnlyArray, useCSSLayers?: boolean, - styleXConfig?: { +[string]: mixed }, + styleXConfig?: StyleXOptions, }; export type TransformConfig = { diff --git a/packages/cli/src/index.js b/packages/cli/src/index.js index 35f4a868..aa8fbf15 100755 --- a/packages/cli/src/index.js +++ b/packages/cli/src/index.js @@ -8,7 +8,7 @@ * @flow strict */ -import type { Rule } from '@stylexjs/babel-plugin'; +import type { Rule, Options as StyleXOptions } from '@stylexjs/babel-plugin'; import yargs from 'yargs'; import path from 'path'; import ansis from 'ansis'; @@ -71,8 +71,7 @@ const babelPresets: $ReadOnlyArray = args.babelPresets; const babelPluginsPre: $ReadOnlyArray = args.babelPluginsPre; const babelPluginsPost: $ReadOnlyArray = args.babelPluginsPost; const useCSSLayers: boolean = args.useCSSLayers; -const styleXConfig: { +[string]: mixed } = - (config.styleXConfig as $FlowFixMe) ?? {}; +const styleXConfig: StyleXOptions = (config.styleXConfig as $FlowFixMe) ?? {}; const cliArgsConfig: CliConfig = { input, diff --git a/packages/cli/src/plugins.js b/packages/cli/src/plugins.js index cbd69e69..db9e2fdb 100644 --- a/packages/cli/src/plugins.js +++ b/packages/cli/src/plugins.js @@ -17,7 +17,10 @@ import * as nodePath from 'path'; type ImportModifierPlugin = $ReadOnly<{ visitor: { - Program: { enter(path: NodePath): void }, + Program: { + enter?: (path: NodePath) => void, + exit?: (path: NodePath) => void, + }, }, }>; diff --git a/packages/cli/src/transform.js b/packages/cli/src/transform.js index 5018de85..4a68ba11 100644 --- a/packages/cli/src/transform.js +++ b/packages/cli/src/transform.js @@ -29,7 +29,10 @@ import { readCache, computeFilePathHash, computeStyleXConfigHash, +<<<<<<< HEAD computeBabelRCHash, +======= +>>>>>>> b070c56cd35a388e64ea1c8d18cba379274d32f7 getDefaultCachePath, } from './cache'; import { @@ -180,6 +183,7 @@ export async function transformFile( rootDir: path.parse(config.output).dir, }, ...(config.styleXConfig as $FlowFixMe), + rewriteAliases: true, }, ], createImportPlugin(relativeImport), diff --git a/packages/dev-runtime/package.json b/packages/dev-runtime/package.json index 9dc3634d..3bf80c4f 100644 --- a/packages/dev-runtime/package.json +++ b/packages/dev-runtime/package.json @@ -1,6 +1,6 @@ { "name": "@stylexjs/dev-runtime", - "version": "0.10.0", + "version": "0.10.1", "description": "A development-only package that makes StyleX work entirely at runtime", "main": "lib/index.js", "repository": "https://www.github.com/facebook/stylex", @@ -11,7 +11,7 @@ "test": "jest" }, "dependencies": { - "@stylexjs/shared": "0.10.0" + "@stylexjs/shared": "0.10.1" }, "jest": { "verbose": true, diff --git a/packages/esbuild-plugin/package.json b/packages/esbuild-plugin/package.json index 96c439d2..e4cfac32 100644 --- a/packages/esbuild-plugin/package.json +++ b/packages/esbuild-plugin/package.json @@ -1,6 +1,6 @@ { "name": "@stylexjs/esbuild-plugin", - "version": "0.10.0", + "version": "0.10.1", "description": "StyleX esbuild plugin", "main": "lib/index.js", "type": "module", @@ -23,8 +23,8 @@ "@babel/plugin-syntax-flow": "^7.25.7", "@babel/plugin-syntax-jsx": "^7.25.7", "@babel/plugin-syntax-typescript": "^7.25.7", - "@stylexjs/babel-plugin": "0.10.0", - "@stylexjs/shared": "0.10.0", + "@stylexjs/babel-plugin": "0.10.1", + "@stylexjs/shared": "0.10.1", "babel-plugin-syntax-hermes-parser": "^0.25.0", "esbuild": "^0.24.0" }, diff --git a/packages/eslint-plugin/package.json b/packages/eslint-plugin/package.json index da7663f0..569ffa03 100644 --- a/packages/eslint-plugin/package.json +++ b/packages/eslint-plugin/package.json @@ -1,6 +1,6 @@ { "name": "@stylexjs/eslint-plugin", - "version": "0.10.0", + "version": "0.10.1", "description": "StyleX eslint plugin.", "main": "lib/index.js", "repository": "https://github.com/facebook/stylex", diff --git a/packages/nextjs-plugin/package.json b/packages/nextjs-plugin/package.json index 0ecfaaaf..55c4757d 100644 --- a/packages/nextjs-plugin/package.json +++ b/packages/nextjs-plugin/package.json @@ -1,6 +1,6 @@ { "name": "@stylexjs/nextjs-plugin", - "version": "0.10.0", + "version": "0.10.1", "description": "Next.js plugin for StyleX", "main": "src/index.js", "repository": "https://www.github.com/facebook/stylex", @@ -10,7 +10,7 @@ "@babel/plugin-syntax-flow": "^7.25.7", "@babel/plugin-syntax-jsx": "^7.25.7", "@babel/plugin-syntax-typescript": "^7.25.7", - "@stylexjs/babel-plugin": "0.10.0" + "@stylexjs/babel-plugin": "0.10.1" }, "peerDependencies": { "next": ">=14.0.1 || >=15.0.0 || 15.0.0-rc.0" diff --git a/packages/open-props/package.json b/packages/open-props/package.json index af6d3717..57b04778 100644 --- a/packages/open-props/package.json +++ b/packages/open-props/package.json @@ -1,6 +1,6 @@ { "name": "@stylexjs/open-props", - "version": "0.10.0", + "version": "0.10.1", "description": "A library common values as variables to be used with Stylex.", "type": "module", "exports": { @@ -33,10 +33,10 @@ "build": "babel src/ --out-dir lib/ --copy-files" }, "dependencies": { - "@stylexjs/stylex": "0.10.0" + "@stylexjs/stylex": "0.10.1" }, "devDependencies": { - "@stylexjs/scripts": "0.10.0" + "@stylexjs/scripts": "0.10.1" }, "jest": {}, "files": [ diff --git a/packages/postcss-plugin/package.json b/packages/postcss-plugin/package.json index f2d48449..b55e9fda 100644 --- a/packages/postcss-plugin/package.json +++ b/packages/postcss-plugin/package.json @@ -1,13 +1,13 @@ { "name": "@stylexjs/postcss-plugin", - "version": "0.10.0", + "version": "0.10.1", "description": "PostCSS plugin for StyleX", "main": "src/index.js", "repository": "https://www.github.com/facebook/stylex", "license": "MIT", "dependencies": { "@babel/core": "^7.25.8", - "@stylexjs/babel-plugin": "0.10.0", + "@stylexjs/babel-plugin": "0.10.1", "postcss": "^8.4.49", "fast-glob": "^3.3.2", "glob-parent": "^6.0.2", diff --git a/packages/rollup-plugin/package.json b/packages/rollup-plugin/package.json index a8e6d238..feb0d15c 100644 --- a/packages/rollup-plugin/package.json +++ b/packages/rollup-plugin/package.json @@ -1,6 +1,6 @@ { "name": "@stylexjs/rollup-plugin", - "version": "0.10.0", + "version": "0.10.1", "description": "Rollup plugin for StyleX", "main": "./lib/index.js", "module": "./lib/es/index.mjs", @@ -35,7 +35,7 @@ "@babel/plugin-syntax-flow": "^7.25.7", "@babel/plugin-syntax-jsx": "^7.25.7", "@babel/plugin-syntax-typescript": "^7.25.7", - "@stylexjs/babel-plugin": "0.10.0", + "@stylexjs/babel-plugin": "0.10.1", "lightningcss": "^1.27.0" }, "files": [ diff --git a/packages/scripts/package.json b/packages/scripts/package.json index d8c728e7..b0245d88 100644 --- a/packages/scripts/package.json +++ b/packages/scripts/package.json @@ -1,6 +1,6 @@ { "name": "@stylexjs/scripts", - "version": "0.10.0", + "version": "0.10.1", "description": "Helper scripts for stylex monorepo.", "license": "MIT", "bin": { diff --git a/packages/shared/package.json b/packages/shared/package.json index 6bb802fb..4af744be 100644 --- a/packages/shared/package.json +++ b/packages/shared/package.json @@ -1,6 +1,6 @@ { "name": "@stylexjs/shared", - "version": "0.10.0", + "version": "0.10.1", "main": "lib/index.js", "repository": "https://www.github.com/facebook/stylex", "license": "MIT", @@ -13,7 +13,7 @@ "postcss-value-parser": "^4.1.0" }, "devDependencies": { - "@stylexjs/scripts": "0.10.0" + "@stylexjs/scripts": "0.10.1" }, "jest": { "snapshotFormat": { diff --git a/packages/stylex/package.json b/packages/stylex/package.json index 1cce79ef..292bd363 100644 --- a/packages/stylex/package.json +++ b/packages/stylex/package.json @@ -1,6 +1,6 @@ { "name": "@stylexjs/stylex", - "version": "0.10.0", + "version": "0.10.1", "description": "A library for defining styles for optimized user interfaces.", "main": "./lib/stylex.js", "module": "./lib/es/stylex.mjs", @@ -45,7 +45,7 @@ "styleq": "0.1.3" }, "devDependencies": { - "@stylexjs/scripts": "0.10.0", + "@stylexjs/scripts": "0.10.1", "cross-env": "^7.0.3" }, "jest": {}, diff --git a/packages/webpack-plugin/package.json b/packages/webpack-plugin/package.json index ef055a88..56a90e2b 100644 --- a/packages/webpack-plugin/package.json +++ b/packages/webpack-plugin/package.json @@ -1,6 +1,6 @@ { "name": "@stylexjs/webpack-plugin", - "version": "0.10.0", + "version": "0.10.1", "description": "Webpack plugin for StyleX", "main": "src/index.js", "repository": "https://www.github.com/facebook/stylex", @@ -24,7 +24,7 @@ "@babel/plugin-syntax-flow": "^7.25.7", "@babel/plugin-syntax-jsx": "^7.25.7", "@babel/plugin-syntax-typescript": "^7.25.7", - "@stylexjs/babel-plugin": "0.10.0" + "@stylexjs/babel-plugin": "0.10.1" }, "peerDependencies": { "webpack": ">=5.0.0"