zitejs 0.9.71 → 0.9.73

package/dist/cjs/vite/index.d.ts

@@ -0,0 +1,2 @@
+import type { Plugin } from "vite";
+export declare function ziteId(): Plugin;

package/dist/cjs/vite/index.js

@@ -0,0 +1,88 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.ziteId = ziteId;
+const parser_1 = require("@babel/parser");
+const magic_string_1 = __importDefault(require("magic-string"));
+const path_1 = __importDefault(require("path"));
+const estree_walker_1 = require("estree-walker");
+const validExtensions = new Set([".jsx", ".tsx"]);
+function getComponentName(elementName) {
+    if (elementName.type === "JSXIdentifier") {
+        return elementName.name;
+    }
+    if (elementName.type === "JSXMemberExpression") {
+        const object = getComponentName(elementName.object);
+        const property = elementName.property.name;
+        return object ? `${object}.${property}` : property;
+    }
+    return null;
+}
+function isNativeElement(name) {
+    return /^[a-z]/.test(name) && !name.includes(".");
+}
+function ziteId() {
+    const cwd = process.cwd();
+    return {
+        name: "vite-plugin-zite-id",
+        enforce: "pre",
+        async transform(code, id) {
+            if (!validExtensions.has(path_1.default.extname(id)) ||
+                id.includes("node_modules")) {
+                return null;
+            }
+            const relativePath = path_1.default.relative(cwd, id);
+            try {
+                const ast = (0, parser_1.parse)(code, {
+                    sourceType: "module",
+                    plugins: ["jsx", "typescript"],
+                });
+                const magicString = new magic_string_1.default(code);
+                (0, estree_walker_1.walk)(ast, {
+                    enter(_node) {
+                        const node = _node;
+                        if (node.type === "JSXElement") {
+                            const openingElement = node.openingElement;
+                            const children = node.children;
+                            const elementName = openingElement.name;
+                            const isFragment = (elementName.type === "JSXMemberExpression" &&
+                                elementName.object.name === "React" &&
+                                elementName.property.name === "Fragment") ||
+                                (elementName.type === "JSXIdentifier" &&
+                                    elementName.name === "Fragment");
+                            if (isFragment) {
+                                return;
+                            }
+                            const line = openingElement.loc?.start?.line ?? 0;
+                            const col = openingElement.loc?.start?.column ?? 0;
+                            const dataComponentId = `${relativePath}|${line}|${col}`;
+                            let attributes = ` data-zite-id="${dataComponentId}"`;
+                            const componentName = getComponentName(openingElement.name);
+                            if (componentName && !isNativeElement(componentName)) {
+                                attributes += ` data-zite-component="${componentName}"`;
+                            }
+                            if (children.length === 1 &&
+                                (children[0].type === "JSXText" ||
+                                    children[0].type === "StringLiteral" ||
+                                    (children[0].type === "JSXExpressionContainer" &&
+                                        children[0].expression.type === "StringLiteral"))) {
+                                attributes += ` data-zite-editable="true"`;
+                            }
+                            magicString.appendLeft(openingElement.name.end ?? 0, attributes);
+                        }
+                    },
+                });
+                return {
+                    code: magicString.toString(),
+                    map: magicString.generateMap({ hires: true }),
+                };
+            }
+            catch (error) {
+                console.error(`Error processing file ${relativePath}:`, error);
+                return null;
+            }
+        },
+    };
+}

package/dist/esm/vite/index.d.ts

@@ -0,0 +1,2 @@
+import type { Plugin } from "vite";
+export declare function ziteId(): Plugin;

package/dist/esm/vite/index.js

@@ -0,0 +1,82 @@
+import { parse } from "@babel/parser";
+import MagicString from "magic-string";
+import path from "path";
+import { walk } from "estree-walker";
+const validExtensions = new Set([".jsx", ".tsx"]);
+function getComponentName(elementName) {
+    if (elementName.type === "JSXIdentifier") {
+        return elementName.name;
+    }
+    if (elementName.type === "JSXMemberExpression") {
+        const object = getComponentName(elementName.object);
+        const property = elementName.property.name;
+        return object ? `${object}.${property}` : property;
+    }
+    return null;
+}
+function isNativeElement(name) {
+    return /^[a-z]/.test(name) && !name.includes(".");
+}
+export function ziteId() {
+    const cwd = process.cwd();
+    return {
+        name: "vite-plugin-zite-id",
+        enforce: "pre",
+        async transform(code, id) {
+            if (!validExtensions.has(path.extname(id)) ||
+                id.includes("node_modules")) {
+                return null;
+            }
+            const relativePath = path.relative(cwd, id);
+            try {
+                const ast = parse(code, {
+                    sourceType: "module",
+                    plugins: ["jsx", "typescript"],
+                });
+                const magicString = new MagicString(code);
+                walk(ast, {
+                    enter(_node) {
+                        const node = _node;
+                        if (node.type === "JSXElement") {
+                            const openingElement = node.openingElement;
+                            const children = node.children;
+                            const elementName = openingElement.name;
+                            const isFragment = (elementName.type === "JSXMemberExpression" &&
+                                elementName.object.name === "React" &&
+                                elementName.property.name === "Fragment") ||
+                                (elementName.type === "JSXIdentifier" &&
+                                    elementName.name === "Fragment");
+                            if (isFragment) {
+                                return;
+                            }
+                            const line = openingElement.loc?.start?.line ?? 0;
+                            const col = openingElement.loc?.start?.column ?? 0;
+                            const dataComponentId = `${relativePath}|${line}|${col}`;
+                            let attributes = ` data-zite-id="${dataComponentId}"`;
+                            const componentName = getComponentName(openingElement.name);
+                            if (componentName && !isNativeElement(componentName)) {
+                                attributes += ` data-zite-component="${componentName}"`;
+                            }
+                            if (children.length === 1 &&
+                                (children[0].type === "JSXText" ||
+                                    children[0].type === "StringLiteral" ||
+                                    (children[0].type === "JSXExpressionContainer" &&
+                                        children[0].expression.type === "StringLiteral"))) {
+                                attributes += ` data-zite-editable="true"`;
+                            }
+                            magicString.appendLeft(openingElement.name.end ?? 0, attributes);
+                        }
+                    },
+                });
+                return {
+                    code: magicString.toString(),
+                    map: magicString.generateMap({ hires: true }),
+                };
+            }
+            catch (error) {
+                console.error(`Error processing file ${relativePath}:`, error);
+                return null;
+            }
+        },
+    };
+}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "zitejs",
-  "version": "0.9.71",
+  "version": "0.9.73",
   "description": "The Zite framework — build apps on Zite Database",
   "type": "module",
   "main": "./dist/cjs/index.js",
@@ -76,6 +76,12 @@
       "types": "./dist/esm/sync/index.d.ts",
       "import": "./dist/esm/sync/index.js",
       "require": "./dist/cjs/sync/index.js"
+    },
+    "./vite-plugin": {
+      "types": "./dist/esm/vite/index.d.ts",
+      "import": "./dist/esm/vite/index.js",
+      "require": "./dist/cjs/vite/index.js",
+      "default": "./dist/esm/vite/index.js"
     }
   },
   "scripts": {
@@ -125,12 +131,16 @@
       ],
       "meta": [
         "dist/esm/meta/index.d.ts"
+      ],
+      "vite-plugin": [
+        "dist/esm/vite/index.d.ts"
       ]
     }
   },
   "peerDependencies": {
     "@tanstack/react-query": ">=5",
-    "react": ">=18"
+    "react": ">=18",
+    "vite": ">=5"
   },
   "peerDependenciesMeta": {
     "react": {
@@ -138,6 +148,9 @@
     },
     "@tanstack/react-query": {
       "optional": true
+    },
+    "vite": {
+      "optional": true
     }
   },
   "devDependencies": {
@@ -164,6 +177,8 @@
     "@babel/parser": "^7.29.7",
     "dotenv": "^17.4.2",
     "esbuild": "^0.28.0",
+    "estree-walker": "^3.0.3",
+    "magic-string": "^0.30.17",
     "zod": "^4.1.12"
   }
 }