diff --git a/apps/x/babel.config.json b/apps/x/babel.config.json
index da93b6f..4894b20 100644
--- a/apps/x/babel.config.json
+++ b/apps/x/babel.config.json
@@ -2,7 +2,7 @@
"presets": ["next/babel"],
"plugins": [[
"@stylexjs/babel-plugin", {
- "dev": true,
+ "dev": false,
"stylexSheetName": "<>",
"useCSSLayers": true,
"unstable_moduleResolution": {
diff --git a/apps/x/package.json b/apps/x/package.json
index 03ae5cd..07d688d 100644
--- a/apps/x/package.json
+++ b/apps/x/package.json
@@ -7,11 +7,13 @@
"dev": "next dev",
"build": "next build",
"start": "next start",
- "lint": "biome lint src"
+ "lint": "biome lint src",
+ "test:generate": "stylex --config stylex.config.jsonc"
},
"devDependencies": {
- "@stylexjs/babel-plugin": "^0.5.1",
- "@stylexjs/nextjs-plugin": "^0.5.1",
+ "@stylexjs/babel-plugin": "^0.7.5",
+ "@stylexjs/cli": "^0.7.5",
+ "@stylexjs/nextjs-plugin": "^0.7.5",
"@types/node": "^20.4.5",
"@types/react": "18.2.17",
"@types/react-dom": "^18.2.7",
@@ -20,7 +22,7 @@
"typescript": "^5.4.3"
},
"dependencies": {
- "@stylexjs/stylex": "^0.5.1",
+ "@stylexjs/stylex": "^0.7.5",
"@urban-ui/flex": "workspace:*",
"@urban-ui/testx": "workspace:*",
"@urban-ui/theme": "workspace:*",
diff --git a/apps/x/src/app/flex/page.tsx b/apps/x/src/app/flex/page.tsx
index 3ee3de9..c040ae3 100644
--- a/apps/x/src/app/flex/page.tsx
+++ b/apps/x/src/app/flex/page.tsx
@@ -1,39 +1,47 @@
-import stylex from "@stylexjs/stylex";
-import { Flex } from "@urban-ui/flex";
-import { spacing } from "@urban-ui/theme/spacing.stylex";
+import stylex from '@stylexjs/stylex'
+import { Flex } from '@urban-ui/flex'
+import { spacing } from '@urban-ui/theme/spacing.stylex'
const styles = stylex.create({
- block: {
- backgroundColor: "hotpink",
- width: spacing.xl,
- height: spacing.xl,
- },
-});
+ block: {
+ backgroundColor: 'hotpink',
+ width: spacing.xl,
+ height: spacing.xl,
+ },
+})
function Block() {
- return ;
+ return
}
export default function FlexPage() {
- return (
- <>
- Flex
-
- gap: sm
-
-
-
-
-
-
- gap: md
-
-
-
-
-
-
-
-
- );
+ return (
+ <>
+ Flex
+
+ gap: sm
+
+
+
+
+
+
+ gap: md
+
+
+
+
+
+
+ gap: lg
+
+
+
+
+
+
+
+
+
+ )
}
diff --git a/apps/x/stylex.config.jsonc b/apps/x/stylex.config.jsonc
new file mode 100644
index 0000000..f2cf52b
--- /dev/null
+++ b/apps/x/stylex.config.jsonc
@@ -0,0 +1,14 @@
+{
+ "input": "./src/app",
+ // "input": "./dist",
+ // "input": "./disttest",
+ "output": "./generated/stylex",
+ // "modules_EXPERIMENTAL": ["@stylexjs/open-props", "@urban-ui/theme"],
+ // "modules_EXPERIMENTAL": ["@stylexjs/open-props"],
+ // "babelPresets": [
+ // ["@babel/preset-typescript", { "allExtensions": true, "isTSX": true }],
+ // "@babel/preset-react"
+ // ],
+ "styleXBundleName": "stylex_bundle.css",
+ "watch": false
+}
diff --git a/bun.lockb b/bun.lockb
index c3e00c0..a36c89b 100755
Binary files a/bun.lockb and b/bun.lockb differ
diff --git a/packages/core/theme/package.json b/packages/core/theme/package.json
index 8ffa6e9..de76f76 100644
--- a/packages/core/theme/package.json
+++ b/packages/core/theme/package.json
@@ -20,7 +20,7 @@
"dependencies": {
"@capsizecss/core": "^3.1.1",
"@capsizecss/metrics": "^1.2.0",
- "@stylexjs/stylex": "^0.5.1"
+ "@stylexjs/stylex": "^0.7.5"
},
"peerDependencies": {
"react": "^18.2.0"
diff --git a/packages/layout/flex/___babel.config.json b/packages/layout/flex/___babel.config.json
new file mode 100644
index 0000000..da93b6f
--- /dev/null
+++ b/packages/layout/flex/___babel.config.json
@@ -0,0 +1,14 @@
+{
+ "presets": ["next/babel"],
+ "plugins": [[
+ "@stylexjs/babel-plugin", {
+ "dev": true,
+ "stylexSheetName": "<>",
+ "useCSSLayers": true,
+ "unstable_moduleResolution": {
+ "type": "commonJS",
+ "rootDir": "../../"
+ }
+ }
+ ]]
+}
diff --git a/packages/layout/flex/arc.config.ts b/packages/layout/flex/arc.config.ts
index b106741..0d421df 100644
--- a/packages/layout/flex/arc.config.ts
+++ b/packages/layout/flex/arc.config.ts
@@ -1,12 +1,51 @@
+import cp from 'node:child_process'
+import path from 'node:path'
+import util from 'node:util'
import type { Config } from '@urban-ui/arc'
import { getTsConfig } from '@urban-ui/arc/ts'
+// const spawn = util.promisify(cp.spawn)
+
const tsconfig = await getTsConfig()
const config: Config = {
include: [tsconfig.compilerOptions?.rootDir ?? 'src', '!**/*.test.ts*'],
outDir: 'dist',
rootDir: tsconfig.compilerOptions?.rootDir ?? 'src',
+ events: {
+ complete: async () => {
+ console.log('🎉')
+ await spawn('del', ['disttest2'])
+ console.log(process.cwd(), __dirname)
+ await spawn('stylex', [
+ '--config',
+ path.join(__dirname, 'stylex.config.jsonc'),
+ ])
+ // await new Promise((res) => {
+ // const pipe = cp.spawn('stylex', ['-i', 'disttest', '-o', 'disttest2'], {
+ // stdio: [0, 1, 2],
+ // })
+ // pipe.on('data', (chunk) => {
+ // console.log(chunk)
+ // })
+ // pipe.on('close', () => {
+ // console.log('👩🎤')
+ // res(null)
+ // })
+ // })
+ console.log('❤️')
+ },
+ },
}
export default config
+
+function spawn(cmd: string, params: Array) {
+ return new Promise((res) => {
+ const pipe = cp.spawn(cmd, params, {
+ stdio: [0, 1, 2],
+ })
+ pipe.on('data', console.log)
+ pipe.on('close', res)
+ })
+}
diff --git a/packages/layout/flex/package.json b/packages/layout/flex/package.json
index 40e9301..193319e 100644
--- a/packages/layout/flex/package.json
+++ b/packages/layout/flex/package.json
@@ -24,17 +24,20 @@
},
"dependencies": {
"@radix-ui/react-slot": "^1.0.2",
- "@stylexjs/stylex": "^0.5.1",
+ "@stylexjs/stylex": "^0.7.5",
"@urban-ui/theme": "^0.4.0"
},
"peerDependencies": {
"react": "^18.2.0"
},
"devDependencies": {
+ "@babel/preset-react": "^7.24.7",
+ "@babel/preset-typescript": "^7.24.7",
"@happy-dom/global-registrator": "^14.7.1",
- "@stylexjs/babel-plugin": "^0.5.1",
- "@stylexjs/dev-runtime": "^0.5.1",
- "@stylexjs/nextjs-plugin": "^0.5.1",
+ "@stylexjs/babel-plugin": "^0.7.5",
+ "@stylexjs/cli": "^0.7.5",
+ "@stylexjs/dev-runtime": "^0.7.5",
+ "@stylexjs/nextjs-plugin": "^0.7.5",
"@types/node": "^20.12.2",
"@types/react": "^18.2.0",
"@types/react-dom": "^18.2.0",
diff --git a/packages/layout/flex/stylex.config.jsonc b/packages/layout/flex/stylex.config.jsonc
new file mode 100644
index 0000000..f2ee79a
--- /dev/null
+++ b/packages/layout/flex/stylex.config.jsonc
@@ -0,0 +1,13 @@
+{
+ "input": "./src",
+ // "input": "./dist",
+ // "input": "./disttest",
+ "output": "./disttest2",
+ // "modules_EXPERIMENTAL": ["@stylexjs/open-props"],
+ "babelPresets": [
+ ["@babel/preset-typescript", { "allExtensions": true, "isTSX": true }],
+ "@babel/preset-react"
+ ],
+ "styleXBundleName": "stylex_bundle.css",
+ "watch": false
+}