prepare

Author: MrWangJustToDo

README.md

@@ -119,12 +119,12 @@ file.buildSplitDiffLines();
 - ✅ **Extend Data** - Attach and render custom data per line
 - ✅ **Web Worker Support** - Offload processing for better performance
 - ✅ **SSR & RSC** - Full server-side rendering support for React and Vue
-- ✅ **Diff Match Patch** - Enhanced line-level diff with FastDiff template (experimental)
+- ✅ **Diff Match Patch** - Enhanced line-level diff with FastDiff template
 - ✅ **Multiple Platforms** - React, Vue, Solid, Svelte, and CLI
 
 ## ⚡ Advanced Features
 
-### FastDiff Template (Experimental)
+### FastDiff Template
 
 Enhanced line-by-line diff visualization for better readability.
 

packages/cli/.eslintrc.cjs

@@ -0,0 +1,24 @@
+module.exports = {
+  extends: [require.resolve("project-tool/baseLint"), require.resolve("project-tool/reactLint")],
+  env: {
+    browser: true,
+    es2021: true,
+  },
+  parserOptions: {
+    ecmaFeatures: {
+      jsx: true,
+    },
+    sourceType: "module",
+    tsconfigRootDir: __dirname,
+    project: "./tsconfig.json",
+  },
+  rules: {
+    "@typescript-eslint/no-unused-vars": [
+      "error",
+      {
+        argsIgnorePattern: "^_",
+        varsIgnorePattern: "React",
+      },
+    ],
+  },
+};

packages/cli/package.json

@@ -3,7 +3,7 @@
   "description": "@git-diff-view/cli",
   "author": "MrWangJustToDo",
   "license": "MIT",
-  "version": "0.1.2",
+  "version": "0.1.3",
   "main": "index.mjs",
   "type": "module",
   "types": "index.d.ts",
@@ -51,7 +51,7 @@
     "cli diff component"
   ],
   "dependencies": {
-    "@git-diff-view/core": "^0.1.2",
+    "@git-diff-view/core": "^0.1.3",
     "@types/hast": "^3.0.0",
     "chalk": "^5.6.2",
     "highlight.js": "^11.11.0",

packages/cli/src/components/CodeContent.tsx

@@ -167,7 +167,7 @@ const CodeSyntax = React.memo(
       }
 
       return buildAnsiStringWithLineBreaks(chars, width);
-    }, [bg, width, theme, rawLine, syntaxLine, enableTabSpace, tabWidth]);
+    }, [bg, width, theme, syntaxLine, enableTabSpace, tabWidth]);
 
     // Fallback to CodeString if no syntax line
     if (!syntaxLine) {

packages/cli/src/components/CodeView.tsx

@@ -115,7 +115,7 @@ CodeLine.displayName = "CodeLine";
 /**
  * CodeViewContent - renders all code lines using terminal size from context
  */
-const CodeViewContent = memo(({ file, theme, width }: { file: File; theme: "light" | "dark", width?: number }) => {
+const CodeViewContent = memo(({ file, theme, width }: { file: File; theme: "light" | "dark"; width?: number }) => {
   const { useCodeContext } = useCodeViewContext();
 
   const enableHighlight = useCodeContext((s) => s.enableHighlight);
@@ -180,9 +180,10 @@ const InternalCodeView = <T,>(
     codeViewTheme,
   } = props;
 
-  const fileId = useMemo(() => file.fileName || "code-file", [file.fileName]);
+  const fileId = file.getId();
 
   // Performance optimization using store
+  // eslint-disable-next-line react-hooks/exhaustive-deps
   const useCodeContext = useMemo(() => createCodeConfigStore(props, fileId), []);
 
   useEffect(() => {
@@ -238,6 +239,8 @@ const InternalCodeView = <T,>(
     renderExtendLine,
     codeViewTabSpace,
     codeViewTabWidth,
+    props.extendData,
+    props.renderExtendLine,
   ]);
 
   useEffect(() => {

packages/cli/src/components/DiffContent.tsx

@@ -348,7 +348,7 @@ const DiffSyntax = React.memo(
 
       // Use width - 2 because the operator column takes 1 character and end padding takes 1 character
       return buildAnsiStringWithLineBreaks(chars, width - 2);
-    }, [bg, width, theme, rawLine, diffLine, operator, syntaxLine, enableTabSpace, tabWidth]);
+    }, [bg, width, theme, diffLine, operator, syntaxLine, enableTabSpace, tabWidth]);
 
     // Fallback to DiffString if no syntax line
     if (!syntaxLine) {

packages/cli/src/components/DiffView.tsx

@@ -89,6 +89,7 @@ const InternalDiffView = <T extends unknown>(
   const diffFileId = useMemo(() => diffFile.getId(), [diffFile]);
 
   // performance optimization
+  // eslint-disable-next-line react-hooks/exhaustive-deps
   const useDiffContext = useMemo(() => createDiffConfigStore(props, diffFileId), []);
 
   useEffect(() => {
@@ -158,6 +159,8 @@ const InternalDiffView = <T extends unknown>(
     diffViewTabSpace,
     diffViewTabWidth,
     diffViewHideOperator,
+    props.extendData,
+    props.renderExtendLine,
   ]);
 
   useEffect(() => {

packages/cli/src/hooks/useCodeTerminalSize.ts

@@ -44,7 +44,7 @@ export function useCodeTerminalSize(): { columns: number } {
     return () => {
       process.stdout.off("resize", debounceUpdate);
     };
-  }, [wrapper]);
+  }, [hasWidth, wrapper]);
 
   return { columns: size };
 }

packages/cli/src/hooks/useUnmount.ts

@@ -5,5 +5,6 @@ export const useUnmount = (cb: () => void, deps: any[]) => {
 
   ref.current = cb;
 
+  // eslint-disable-next-line react-hooks/exhaustive-deps
   useEffect(() => ref.current, deps);
 };

packages/cli/tsconfig.json

@@ -6,6 +6,6 @@
     "moduleResolution": "Bundler",
     "jsx": "react"
   },
-  "include": ["./src"],
+  "include": ["./src", ".eslintrc.cjs"],
   "exclude": ["node_modules"]
 }