@flairjs/parcel-transformer 0.0.1-beta.6 → 0.0.1-beta.9

package/README.md

@@ -0,0 +1,154 @@
+# @flairjs/parcel-transformer
+
+Parcel transformer for Flair CSS-in-JSX.
+
+## Installation
+
+```bash
+npm install @flairjs/parcel-transformer
+```
+
+## Usage
+
+Add the transformer to your `.parcelrc` file:
+
+```json
+{
+  "extends": "@parcel/config-default",
+  "transformers": {
+    "*.{tsx,jsx}": ["@flairjs/parcel-transformer", "..."]
+  }
+}
+```
+
+## Configuration
+
+You can configure the transformer by adding options to your `package.json`:
+
+```json
+{
+  "@flairjs/parcel-transformer": {
+    "include": ["src/**/*.{tsx,jsx}"],
+    "exclude": ["**/*.test.{tsx,jsx}"],
+    "classNameList": ["className", "class"]
+  }
+}
+```
+
+### Configuration Options
+
+```typescript
+interface FlairJsParcelTransformerOptions {
+  /**
+   * Preprocess the extracted CSS before it is passed to lightningcss
+   * @experimental
+   */
+  cssPreprocessor?: (css: string, id: string) => string
+  
+  /**
+   * Files to include (default: all .tsx/.jsx files)
+   */
+  include?: string | string[]
+  
+  /**
+   * Files to exclude (default: node_modules)
+   */
+  exclude?: string | string[]
+  
+  /**
+   * Override the default theme file content
+   */
+  buildThemeFile?: (theme: FlairThemeConfig) => string
+  
+  /**
+   * List of class names used in the project. Supports regex.
+   */
+  classNameList?: string[]
+}
+```
+
+## Complete Parcel Setup
+
+### 1. Install Dependencies
+
+```bash
+npm install parcel @flairjs/client @flairjs/core @flairjs/parcel-transformer
+```
+
+### 2. Create .parcelrc
+
+```json
+{
+  "extends": "@parcel/config-default",
+  "transformers": {
+    "*.{tsx,jsx}": ["@flairjs/parcel-transformer", "..."]
+  }
+}
+```
+
+### 3. Package.json Scripts
+
+```json
+{
+  "scripts": {
+    "dev": "parcel src/index.html",
+    "build": "parcel build src/index.html"
+  }
+}
+```
+
+### 4. Create Theme File
+
+```typescript
+// flair.theme.ts
+import { defineConfig } from '@flairjs/client'
+
+export default defineConfig({
+  tokens: {
+    colors: {
+      primary: '#3b82f6',
+      secondary: '#64748b'
+    }
+  }
+})
+```
+
+### 5. Import Theme CSS
+
+```js
+// src/index.js
+import '@flairjs/client/theme.css'
+import { App } from './App'
+
+// Render your app
+```
+
+## React Setup
+
+```jsx
+// src/App.jsx
+import { flair } from '@flairjs/client'
+
+const App = () => {
+  return (
+    <div className="app">
+      <h1>Hello Flair!</h1>
+    </div>
+  )
+}
+
+App.flair = flair({
+  '.app': {
+    fontFamily: 'system-ui, sans-serif',
+    padding: '$space.4',
+    backgroundColor: '$colors.primary',
+    color: 'white'
+  }
+})
+
+export { App }
+```
+
+## License
+
+MIT

package/dist/cjs/index.js

@@ -159,13 +159,14 @@ const setupGeneratedCssDir = async (options) => {
 	}
 	return flairGeneratedCssDir;
 };
-const setupUserThemeFile = async ({ buildThemeFile, onThemeFileChange }) => {
+const setupUserThemeFile = async ({ buildThemeFile, onThemeFileChange, deleteBeforeWrite = false }) => {
 	const flairThemeFile = require$1.resolve("@flairjs/client/theme.css");
 	let userTheme = await getUserTheme();
 	const buildThemeCSS = buildThemeFile ?? buildThemeTokens;
 	if (userTheme) {
 		const themeCSS = buildThemeCSS(userTheme.theme);
 		store.setLastThemeUpdate(Date.now());
+		if (deleteBeforeWrite) await (0, node_fs_promises.rm)(flairThemeFile, { force: true });
 		await (0, node_fs_promises.writeFile)(flairThemeFile, themeCSS, "utf-8");
 		(0, node_fs.watch)(userTheme.originalPath, async () => {
 			userTheme = await getUserTheme();
@@ -233,7 +234,7 @@ const SourceMap = __parcel_source_map.default.default ?? __parcel_source_map.def
 let initialized = false;
 const transformer = new __parcel_plugin.Transformer({
 	async loadConfig({ config }) {
-		const getConfigResult = await config.getConfig(["tool.config.js"]);
+		const getConfigResult = await config.getConfig(["flair.config.js"]);
 		const filePath = getConfigResult?.filePath;
 		const configContents = getConfigResult?.contents;
 		if (filePath?.endsWith(".js")) config.invalidateOnStartup();

package/dist/esm/index.js

@@ -124,13 +124,14 @@ const setupGeneratedCssDir = async (options) => {
 	}
 	return flairGeneratedCssDir;
 };
-const setupUserThemeFile = async ({ buildThemeFile, onThemeFileChange }) => {
+const setupUserThemeFile = async ({ buildThemeFile, onThemeFileChange, deleteBeforeWrite = false }) => {
 	const flairThemeFile = require.resolve("@flairjs/client/theme.css");
 	let userTheme = await getUserTheme();
 	const buildThemeCSS = buildThemeFile ?? buildThemeTokens;
 	if (userTheme) {
 		const themeCSS = buildThemeCSS(userTheme.theme);
 		store.setLastThemeUpdate(Date.now());
+		if (deleteBeforeWrite) await rm(flairThemeFile, { force: true });
 		await writeFile(flairThemeFile, themeCSS, "utf-8");
 		watch(userTheme.originalPath, async () => {
 			userTheme = await getUserTheme();
@@ -198,7 +199,7 @@ const SourceMap = SourceMapImport.default ?? SourceMapImport;
 let initialized = false;
 const transformer = new Transformer({
 	async loadConfig({ config }) {
-		const getConfigResult = await config.getConfig(["tool.config.js"]);
+		const getConfigResult = await config.getConfig(["flair.config.js"]);
 		const filePath = getConfigResult?.filePath;
 		const configContents = getConfigResult?.contents;
 		if (filePath?.endsWith(".js")) config.invalidateOnStartup();

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@flairjs/parcel-transformer",
-  "version": "0.0.1-beta.6",
+  "version": "0.0.1-beta.9",
   "main": "./dist/cjs/index.js",
   "module": "./dist/esm/index.js",
   "types": "./dist/types/index.d.ts",
@@ -13,7 +13,7 @@
   },
   "peerDependencies": {
     "parcel": ">=2.0.0",
-    "@flairjs/core": "0.0.1-beta.6"
+    "@flairjs/core": "0.0.1-beta.8"
   },
   "devDependencies": {
     "@biomejs/biome": "^2.2.4",
@@ -23,8 +23,8 @@
     "rimraf": "^6.0.1",
     "rolldown": "1.0.0-beta.37",
     "typescript": "^5.8.2",
-    "@flairjs/bundler-shared": "0.0.1-beta.10",
-    "@flairjs/core": "0.0.1-beta.6"
+    "@flairjs/bundler-shared": "0.0.1-beta.13",
+    "@flairjs/core": "0.0.1-beta.8"
   },
   "engines": {
     "parcel": ">=2.0.0"