virtual-react-json-diff 1.0.1

package/dist/cjs/types/src/components/DiffViewer/Diff.stories.d.ts

@@ -0,0 +1,46 @@
+import type { StoryObj } from "@storybook/react";
+declare const meta: {
+    title: string;
+    component: import("react").FC<import("./types").VirtualizedDiffViewerProps>;
+    parameters: {
+        layout: string;
+    };
+    tags: string[];
+    argTypes: {
+        className: {
+            description: string;
+            control: "text";
+        };
+        leftTitle: {
+            description: string;
+            control: "text";
+        };
+        rightTitle: {
+            description: string;
+            control: "text";
+        };
+        hideSearch: {
+            description: string;
+            control: "boolean";
+        };
+        height: {
+            description: string;
+            control: "number";
+        };
+        oldValue: {
+            description: string;
+            control: "object";
+        };
+        newValue: {
+            description: string;
+            control: "object";
+        };
+        differOptions: {
+            description: string;
+            control: "object";
+        };
+    };
+};
+export default meta;
+type Story = StoryObj<typeof meta>;
+export declare const Primary: Story;

package/dist/cjs/types/src/components/DiffViewer/components/DiffMinimap.d.ts

@@ -0,0 +1,3 @@
+import React from "react";
+import { DiffMinimapProps } from "../types";
+export declare const DiffMinimap: React.FC<DiffMinimapProps>;

package/dist/cjs/types/src/components/DiffViewer/components/VirtualizedDiffViewer.d.ts

@@ -0,0 +1,5 @@
+import React from "react";
+import { VirtualizedDiffViewerProps } from "../types";
+import "../styles/JsonDiffCustomTheme.css";
+export declare const VirtualizedDiffViewer: React.FC<VirtualizedDiffViewerProps>;
+export default VirtualizedDiffViewer;

package/dist/cjs/types/src/components/DiffViewer/index.d.ts

@@ -0,0 +1 @@
+export { default } from "./components/VirtualizedDiffViewer";

package/dist/cjs/types/src/components/DiffViewer/types/index.d.ts

@@ -0,0 +1,50 @@
+import { DiffResult, DifferOptions } from "json-diff-kit";
+export interface DiffRow extends DiffResult {
+    originalIndex: number;
+}
+export type DiffRowOrCollapsed = DiffRow | CollapsedLine;
+export interface SegmentItem {
+    start: number;
+    end: number;
+    isEqual: boolean;
+    isExpanded?: boolean;
+    originalStart?: number;
+    originalEnd?: number;
+}
+export interface HiddenUnchangedLinesInfo extends SegmentItem {
+    hasLinesBefore: boolean;
+    hasLinesAfter: boolean;
+}
+export interface CollapsedLine {
+    type: "collapsed";
+    segmentIndex: number;
+    originalIndex: number;
+    level: number;
+    text: string;
+}
+export interface SearchState {
+    term: string;
+    results: number[];
+    currentIndex: number;
+}
+export interface VirtualizedDiffViewerProps {
+    oldValue: object;
+    newValue: object;
+    height: number;
+    hideSearch?: boolean;
+    searchTerm?: string;
+    leftTitle?: string;
+    rightTitle?: string;
+    onSearchMatch?: (index: number) => void;
+    differOptions?: DifferOptions;
+    className?: string;
+}
+export interface DiffMinimapProps {
+    leftDiff: DiffRowOrCollapsed[];
+    rightDiff: DiffRowOrCollapsed[];
+    height: number;
+    onScroll: (scrollTop: number) => void;
+    currentScrollTop: number;
+    searchResults?: number[];
+    currentMatchIndex?: number;
+}

package/dist/cjs/types/src/components/DiffViewer/utils/diffSearchUtils.d.ts

@@ -0,0 +1,3 @@
+import { DiffRowOrCollapsed } from "../types";
+export declare const performSearch: (term: string, leftView: DiffRowOrCollapsed[]) => number[];
+export declare const highlightMatches: (term: string, className?: string) => void;

package/dist/cjs/types/src/components/DiffViewer/utils/preprocessDiff.d.ts

@@ -0,0 +1,5 @@
+import { DiffResult } from "json-diff-kit";
+import { SegmentItem, DiffRowOrCollapsed } from "../types";
+export declare function preprocessDiffs(diff: DiffResult[], contextSize?: number, collapseThreshold?: number): DiffRowOrCollapsed[];
+export declare function generateSegments(diff: DiffResult[], contextSize?: number): SegmentItem[];
+export declare function buildViewFromSegments(segments: SegmentItem[], diff: DiffResult[], contextSize?: number): DiffRowOrCollapsed[];

package/dist/cjs/types/src/components/SearchIcon.d.ts

@@ -0,0 +1 @@
+export declare const SearchIcon: () => import("react/jsx-runtime").JSX.Element;

package/dist/cjs/types/src/index.d.ts

@@ -0,0 +1 @@
+export { default as VirtualDiffViewer } from "./components/DiffViewer";

package/dist/index.d.ts

@@ -0,0 +1,19 @@
+import React from 'react';
+import { DifferOptions } from 'json-diff-kit';
+
+interface VirtualizedDiffViewerProps {
+    oldValue: object;
+    newValue: object;
+    height: number;
+    hideSearch?: boolean;
+    searchTerm?: string;
+    leftTitle?: string;
+    rightTitle?: string;
+    onSearchMatch?: (index: number) => void;
+    differOptions?: DifferOptions;
+    className?: string;
+}
+
+declare const VirtualizedDiffViewer: React.FC<VirtualizedDiffViewerProps>;
+
+export { VirtualizedDiffViewer as VirtualDiffViewer };

package/package.json

@@ -0,0 +1,76 @@
+{
+  "name": "virtual-react-json-diff",
+  "version": "1.0.1",
+  "description": "A React UI component for visually comparing large JSON objects with virtual scrolling, search, and theming — built on top of json-diff-kit.",
+  "main": "dist/cjs/index.js",
+  "types": "dist/index.d.ts",
+  "files": [
+    "dist"
+  ],
+  "scripts": {
+    "build": "bun run rollup",
+    "prepublishOnly": "bun run build",
+    "rollup": "rollup -c --bundleConfigAsCjs",
+    "storybook": "storybook dev -p 6006",
+    "build-storybook": "storybook build"
+  },
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/utkuakyuz/virtual-react-json-diff"
+  },
+  "bugs": {
+    "url": "https://github.com/utkuakyuz/virtual-react-json-diff/issues"
+  },
+  "homepage": "https://virtual-react-json-diff.netlify.app",
+  "author": {
+    "name": "Utku Akyüz"
+  },
+  "license": "MIT",
+  "type": "module",
+  "keywords": [
+    "react",
+    "json",
+    "diff",
+    "json-diff",
+    "viewer",
+    "json-diff-kit",
+    "virtual-scroll",
+    "theme",
+    "search"
+  ],
+  "devDependencies": {
+    "@fontsource/inter": "^5.1.1",
+    "@rollup/plugin-commonjs": "^25.0.3",
+    "@rollup/plugin-image": "^3.0.3",
+    "@rollup/plugin-node-resolve": "^15.1.0",
+    "@rollup/plugin-terser": "^0.4.3",
+    "@rollup/plugin-typescript": "^11.1.2",
+    "@storybook/addon-essentials": "8.6.0-alpha.0",
+    "@storybook/addon-interactions": "8.6.0-alpha.0",
+    "@storybook/addon-onboarding": "8.6.0-alpha.0",
+    "@storybook/addon-styling-webpack": "^1.0.1",
+    "@storybook/blocks": "8.6.0-alpha.0",
+    "@storybook/react": "8.6.0-alpha.0",
+    "@storybook/react-vite": "8.6.0-alpha.0",
+    "@types/node": "^22.14.1",
+    "@types/react": "^18.2.15",
+    "@types/react-window": "^1.8.8",
+    "postcss": "^8.5.1",
+    "prettier": "^2.5.1",
+    "react": "^18.2.0",
+    "rollup": "^3.26.3",
+    "rollup-plugin-dts": "^5.3.0",
+    "rollup-plugin-peer-deps-external": "^2.2.4",
+    "rollup-plugin-postcss": "^4.0.2",
+    "storybook": "8.6.0-alpha.0",
+    "tslib": "^2.6.0",
+    "typescript": "^5.1.6"
+  },
+  "peerDependencies": {
+    "react": "^18.0.0"
+  },
+  "dependencies": {
+    "json-diff-kit": "^1.0.31",
+    "react-window": "^1.8.11"
+  }
+}