diff --git a/apps/x/package.json b/apps/x/package.json index 07d688d..c5bdfd8 100644 --- a/apps/x/package.json +++ b/apps/x/package.json @@ -15,8 +15,8 @@ "@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", + "@types/react": "18.3.3", + "@types/react-dom": "^18.3.0", "@types/react-transition-group": "^4.4.10", "@urban-ui/tsconfig": "workspace:*", "typescript": "^5.4.3" @@ -24,15 +24,14 @@ "dependencies": { "@stylexjs/stylex": "^0.7.5", "@urban-ui/flex": "workspace:*", - "@urban-ui/testx": "workspace:*", "@urban-ui/theme": "workspace:*", "clsx": "^2.0.0", "cva": "npm:class-variance-authority@^0.7.0", "lorem-ipsum": "^2.0.8", - "next": "14.1.4", - "react": "^18.2.0", + "next": "14.2.4", + "react": "^18.3.1", "react-aria": "^3.33.0", - "react-dom": "18.2.0", + "react-dom": "18.3.1", "react-stately": "^3.31.0", "react-transition-group": "^4.4.5", "ts-pattern": "^5.1.0" diff --git a/apps/x/src/app/components/button.tsx b/apps/x/src/app/components/button.tsx index 3dfb761..464bcb6 100644 --- a/apps/x/src/app/components/button.tsx +++ b/apps/x/src/app/components/button.tsx @@ -22,7 +22,9 @@ const styles = stylex.create({ }, }) -export interface ButtonProps extends AriaButtonProps {} +export interface ButtonProps extends AriaButtonProps { + contentEditable: 'inherit' +} export function Button(props: ButtonProps) { const ref = useRef(null) diff --git a/bun.lockb b/bun.lockb index a36c89b..357c525 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 de76f76..13c0c6a 100644 --- a/packages/core/theme/package.json +++ b/packages/core/theme/package.json @@ -27,8 +27,8 @@ }, "devDependencies": { "@types/node": "^20.12.2", - "@types/react": "^18.2.0", - "@types/react-dom": "^18.2.0", + "@types/react": "18.3.3", + "@types/react-dom": "^18.3.0", "@urban-ui/tsconfig": "workspace:*", "del-cli": "^5.1.0", "react": "^18.2.0", diff --git a/packages/layout/flex/__package.json b/packages/layout/flex/__package.json new file mode 100644 index 0000000..c83bad4 --- /dev/null +++ b/packages/layout/flex/__package.json @@ -0,0 +1,50 @@ +{ + "name": "@urban-ui/flex", + "version": "0.4.0", + "type": "module", + "module": "./dist/index.js", + "main": "./dist/index.js", + "types": "./dist/index.d.ts", + "exports": { + ".": { + "types": "./dist/index.d.ts", + "import": "./dist/index.js", + "require": "./dist/index.cjs" + } + }, + "license": "MIT", + "scripts": { + "lint": "biome lint src", + "format": "biome format src --write", + "typecheck": "tsc", + "clean": "del dist", + "dev": "arc watch", + "build": "arc build", + "test": "bun test" + }, + "dependencies": { + "@radix-ui/react-slot": "^1.0.2", + "@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.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.3.3", + "@types/react-dom": "^18.3.0", + "@urban-ui/tsconfig": "workspace:*", + "bun-plugin-stylex": "^1.0.3", + "del-cli": "^5.1.0", + "react": "^18.3.0", + "typescript": "^5.4.3" + } +} diff --git a/packages/layout/flex/arc.config.ts b/packages/layout/flex/arc.config.ts index 0d421df..6f53d0d 100644 --- a/packages/layout/flex/arc.config.ts +++ b/packages/layout/flex/arc.config.ts @@ -14,25 +14,14 @@ const config: Config = { rootDir: tsconfig.compilerOptions?.rootDir ?? 'src', events: { complete: async () => { + // -- Example of spawning stylex cli to generate css for this package 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) - // }) - // }) + // await spawn('del', ['disttest2']) + // console.log(process.cwd(), __dirname) + // await spawn('stylex', [ + // '--config', + // path.join(__dirname, 'stylex.config.jsonc'), + // ]) console.log('❤️') }, }, diff --git a/packages/layout/flex/build.ts b/packages/layout/flex/build.ts new file mode 100644 index 0000000..0ab14b2 --- /dev/null +++ b/packages/layout/flex/build.ts @@ -0,0 +1,27 @@ +import path from 'node:path' +import createStylexPlugin from 'bun-plugin-stylex' + +/** + * Example using bun-plugin-stylex to generate css + * + * The main problem is that this also generates the tokens, which makes sense as it needs those css variables + */ + +const [stylexPlugin, generateCSS] = createStylexPlugin({ + dev: false, + useCSSLayers: true, +}) + +await Bun.build({ + entrypoints: ['./src/index.ts'], + outdir: './dist2', + minify: false, + plugins: [stylexPlugin], + external: ['@stylexjs/stylex', 'react'], +}) + +const generatedCSS = await generateCSS() + +if (generatedCSS) { + await Bun.write(path.resolve(__dirname, 'dist2/styles.css'), generatedCSS) +} diff --git a/packages/layout/flex/package.json b/packages/layout/flex/package.json index 193319e..4f0d623 100644 --- a/packages/layout/flex/package.json +++ b/packages/layout/flex/package.json @@ -6,11 +6,7 @@ "main": "./dist/index.js", "types": "./dist/index.d.ts", "exports": { - ".": { - "types": "./dist/index.d.ts", - "import": "./dist/index.js", - "require": "./dist/index.cjs" - } + ".": "./dist/index.js" }, "license": "MIT", "scripts": { @@ -39,11 +35,12 @@ "@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", + "@types/react": "18.3.3", + "@types/react-dom": "^18.3.0", "@urban-ui/tsconfig": "workspace:*", + "bun-plugin-stylex": "^1.0.3", "del-cli": "^5.1.0", - "react": "^18.2.0", + "react": "^18.3.0", "typescript": "^5.4.3" } } diff --git a/scripts/arc/src/transform.ts b/scripts/arc/src/transform.ts index fb917d8..4d776b1 100644 --- a/scripts/arc/src/transform.ts +++ b/scripts/arc/src/transform.ts @@ -119,22 +119,22 @@ const compile = createTask( }) }, ), - traceFn( - fileEvents['compile::cjs'], - ctx.ftrace.getTrace(filepath), - async () => { - return await transformFile({ - code: file, - filename: filepath, - overrides: { - module: { - type: 'commonjs', - }, - }, - plugins: [transformImports('cjs')], - }) - }, - ), + // traceFn( + // fileEvents['compile::cjs'], + // ctx.ftrace.getTrace(filepath), + // async () => { + // return await transformFile({ + // code: file, + // filename: filepath, + // overrides: { + // module: { + // type: 'commonjs', + // }, + // }, + // plugins: [transformImports('cjs')], + // }) + // }, + // ), ]) ctx.ftrace.getTrace(filepath).track(mCompile.end) @@ -143,7 +143,7 @@ const compile = createTask( filepath: filepath, files: { esm: codeBlocks[0], - cjs: codeBlocks[1], + // cjs: codeBlocks[1], }, } }), @@ -170,10 +170,10 @@ const write = createTask( outDir: ctx.outDir, }) - const cjsFilepath = generateOutputPath(files.cjs.filepath, 'cjs', { - strip: ctx.rootDir, - outDir: ctx.outDir, - }) + // const cjsFilepath = generateOutputPath(files.cjs.filepath, 'cjs', { + // strip: ctx.rootDir, + // outDir: ctx.outDir, + // }) ctx.ftrace.getTrace(filepath).track(measurement.start) await Promise.all([ @@ -195,24 +195,24 @@ const write = createTask( return file }, ), - pipe( - async () => await writeFile(cjsFilepath, files.cjs.code), - async (file) => { - debug('Write file:', file) - ctx.ftrace.getSizes(filepath).cjs = file.size - return file - }, - ), - files.cjs.map && - pipe( - async () => - await writeFile(`${cjsFilepath}.map`, files.cjs.map as string), - async (file) => { - debug('Write file:', file) - ctx.ftrace.getSizes(filepath)['cjs::map'] = file.size - return file - }, - ), + // pipe( + // async () => await writeFile(cjsFilepath, files.cjs.code), + // async (file) => { + // debug('Write file:', file) + // ctx.ftrace.getSizes(filepath).cjs = file.size + // return file + // }, + // ), + // files.cjs.map && + // pipe( + // async () => + // await writeFile(`${cjsFilepath}.map`, files.cjs.map as string), + // async (file) => { + // debug('Write file:', file) + // ctx.ftrace.getSizes(filepath)['cjs::map'] = file.size + // return file + // }, + // ), ]) ctx.ftrace.getTrace(filepath).track(measurement.end) }), diff --git a/scripts/arc/src/transform/analytics.ts b/scripts/arc/src/transform/analytics.ts index 88e885f..cc3c620 100644 --- a/scripts/arc/src/transform/analytics.ts +++ b/scripts/arc/src/transform/analytics.ts @@ -14,7 +14,7 @@ export const fileEvents = { parse: 'parse', compile: 'compile', 'compile::esm': 'compile::esm', - 'compile::cjs': 'compile::cjs', + // 'compile::cjs': 'compile::cjs', // 'compile::umd': 'compile::umd', write: 'write', }