chore: update dependencies and type definitions

.flowconfig

@@ -1,5 +1,5 @@
 [version]
-0.245.2
+0.249.0
 
 [ignore]
 .*/build/.*

apps/cli-example/package.json

@@ -1,21 +1,21 @@
 {
   "name": "stylex-cli-example",
-  "version": "0.8.0",
+  "version": "0.9.0-beta.1",
   "private": true,
   "scripts": {
     "transform": "stylex --config .stylex.json5"
   },
   "dependencies": {
-    "@stylexjs/open-props": "0.8.0",
+    "@stylexjs/open-props": "0.9.0-beta.1",
     "react": "^18",
     "react-dom": "^18"
   },
   "devDependencies": {
-    "@babel/preset-react": "^7.24.1",
-    "@babel/preset-typescript": "^7.24.1",
-    "@stylexjs/cli": "0.8.0",
-    "@types/react": "^18",
-    "@types/react-dom": "^18",
+    "@babel/preset-react": "^7.25.7",
+    "@babel/preset-typescript": "^7.25.7",
+    "@stylexjs/cli": "0.9.0-beta.1",
+    "@types/react": "^18.3.11",
+    "@types/react-dom": "^18.3.1",
     "typescript": "^5"
   }
 }

apps/docs/package.json

@@ -19,18 +19,18 @@
     "@docusaurus/core": "2.4.1",
     "@docusaurus/preset-classic": "2.4.1",
     "@mdx-js/react": "^1.6.22",
-    "@stylexjs/stylex": "0.8.0",
+    "@stylexjs/stylex": "0.9.0-beta.1",
     "@vercel/analytics": "^1.1.1",
     "clsx": "^1.2.1",
     "react": "^17.0.2",
     "react-dom": "^17.0.2",
-    "react-syntax-highlighter": "^15.5.0"
+    "react-syntax-highlighter": "^15.6.1"
   },
   "devDependencies": {
-    "@babel/eslint-parser": "^7.23.10",
-    "@stylexjs/babel-plugin": "0.8.0",
+    "@babel/eslint-parser": "^7.25.8",
+    "@stylexjs/babel-plugin": "0.9.0-beta.1",
     "clean-css": "^5.3.2",
-    "eslint": "^8.56.0",
+    "eslint": "^8.57.1",
     "eslint-config-airbnb": "^19.0.4",
     "eslint-plugin-header": "^3.1.1",
     "eslint-plugin-import": "^2.29.1",

apps/esbuild-example/package.json

@@ -17,7 +17,7 @@
   "devDependencies": {
     "@stylexjs/esbuild-plugin": "^0.7.5",
     "@stylexjs/eslint-plugin": "^0.7.5",
-    "esbuild": "^0.19.12",
-    "eslint": "^8.55.0"
+    "esbuild": "^0.24.0",
+    "eslint": "^8.57.1"
   }
 }

apps/nextjs-example/package.json

@@ -14,7 +14,7 @@
   "dependencies": {
     "@stylexjs/stylex": "^0.7.5",
     "@stylexjs/open-props": "^0.7.5",
-    "bright": "^0.8.4",
+    "bright": "^0.8.5",
     "react": "^18",
     "react-dom": "^18",
     "next": "14.0.1"
@@ -23,13 +23,13 @@
     "@stylexjs/babel-plugin": "^0.7.5",
     "@stylexjs/eslint-plugin": "^0.7.5",
     "@stylexjs/nextjs-plugin": "^0.7.5",
-    "@types/node": "^20.10.4",
-    "@types/react": "^18.2.45",
-    "@types/react-dom": "^18.2.18",
-    "@typescript-eslint/parser": "^6.14.0",
-    "eslint": "^8.56.0",
+    "@types/node": "^22.7.6",
+    "@types/react": "^18.3.11",
+    "@types/react-dom": "^18.3.1",
+    "@typescript-eslint/parser": "^6.21.0",
+    "eslint": "^8.57.1",
     "eslint-config-next": "14.0.1",
-    "rimraf": "^5.0.5",
+    "rimraf": "^5.0.10",
     "typescript": "^5.3.3"
   }
 }

apps/nextjs-example/typetests/theming/ButtonTokenThemes.ts

@@ -0,0 +1,38 @@
+/**
+ * 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.
+ *
+ *
+ */
+
+import type { Theme } from '@stylexjs/stylex';
+
+import { ButtonTokens } from './ButtonTokens.stylex';
+
+import * as stylex from '@stylexjs/stylex';
+
+/* eslint-disable no-unused-vars */
+
+const fdsRed: Theme<typeof ButtonTokens> = stylex.createTheme(ButtonTokens, {
+  bgColor: 'red',
+  color: 'white',
+  height: 'var(--button-height-medium)',
+  opacity: '1',
+});
+
+const fdsBlue: Theme<typeof ButtonTokens> = stylex.createTheme(ButtonTokens, {
+  bgColor: 'blue',
+  color: 'white',
+  height: 'var(--button-height-medium)',
+  opacity: '1',
+});
+
+const styles = stylex.create({
+  test1: {
+    padding: 4,
+    color: ButtonTokens.color,
+    backgroundColor: `color-mix(in oklch, ${ButtonTokens.bgColor}, 'white')`,
+  },
+});

apps/nextjs-example/typetests/theming/ButtonTokens.stylex.ts

@@ -0,0 +1,27 @@
+/**
+ * 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.
+ *
+ *
+ */
+
+import type { VarGroup } from '@stylexjs/stylex';
+import * as stylex from '@stylexjs/stylex';
+
+declare const ButtonTokensTag: unique symbol;
+export const ButtonTokens: VarGroup<
+  Readonly<{
+    bgColor: string;
+    color: string;
+    height: string;
+    opacity: string;
+  }>,
+  typeof ButtonTokensTag
+> = stylex.defineVars({
+  bgColor: 'var(--secondary-button-background)',
+  color: 'currentcolor',
+  height: 'var(--button-height-medium)',
+  opacity: '1',
+});

apps/rollup-example/package.json

@@ -1,6 +1,6 @@
 {
   "name": "rollup-example",
-  "version": "0.8.0",
+  "version": "0.9.0-beta.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.8.0",
-    "@stylexjs/rollup-plugin": "0.8.0"
+    "@stylexjs/stylex": "0.9.0-beta.1",
+    "@stylexjs/rollup-plugin": "0.9.0-beta.1"
   }
 }

apps/webpack-example/package.json

@@ -1,6 +1,6 @@
 {
   "name": "webpack-example",
-  "version": "0.8.0",
+  "version": "0.9.0-beta.1",
   "description": "A simple webpack example to test stylexjs/webpack-plugin",
   "main": "index.js",
   "scripts": {
@@ -9,11 +9,11 @@
   },
   "license": "MIT",
   "dependencies": {
-    "@stylexjs/stylex": "0.8.0"
+    "@stylexjs/stylex": "0.9.0-beta.1"
   },
   "devDependencies": {
-    "@stylexjs/webpack-plugin": "0.8.0",
-    "html-webpack-plugin": "^5.5.3",
+    "@stylexjs/webpack-plugin": "0.9.0-beta.1",
+    "html-webpack-plugin": "^5.6.0",
     "webpack": "^5.75.0",
     "webpack-cli": "^5.0.0"
   }