@pantheon-systems/puck-css 0.4.0

package/dist/versioning/components/version-compare/PropDiffPanel.d.ts

@@ -0,0 +1,30 @@
+/**
+ * PropDiffPanel Component
+ *
+ * Displays a panel showing all prop changes for a component.
+ */
+import React from 'react';
+import type { PropDiff } from '../../../core/types.js';
+export interface PropDiffPanelProps {
+    /**
+     * Component type name.
+     */
+    componentType: string;
+    /**
+     * Component ID.
+     */
+    componentId: string;
+    /**
+     * Array of prop diffs to display.
+     */
+    diffs: PropDiff[];
+    /**
+     * Additional CSS class name.
+     */
+    className?: string;
+}
+/**
+ * Renders a panel showing all prop changes for a component.
+ */
+export declare function PropDiffPanel({ componentType, componentId, diffs, className, }: PropDiffPanelProps): React.ReactElement;
+//# sourceMappingURL=PropDiffPanel.d.ts.map

package/dist/versioning/components/version-compare/PropDiffPanel.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"PropDiffPanel.d.ts","sourceRoot":"","sources":["../../../../src/versioning/components/version-compare/PropDiffPanel.tsx"],"names":[],"mappings":"AAAA;;;;GAIG;AAEH,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,wBAAwB,CAAC;AAGvD,MAAM,WAAW,kBAAkB;IACjC;;OAEG;IACH,aAAa,EAAE,MAAM,CAAC;IAEtB;;OAEG;IACH,WAAW,EAAE,MAAM,CAAC;IAEpB;;OAEG;IACH,KAAK,EAAE,QAAQ,EAAE,CAAC;IAElB;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAiBD;;GAEG;AACH,wBAAgB,aAAa,CAAC,EAC5B,aAAa,EACb,WAAW,EACX,KAAK,EACL,SAAc,GACf,EAAE,kBAAkB,GAAG,KAAK,CAAC,YAAY,CA+CzC"}

package/dist/versioning/components/version-compare/PropDiffPanel.js

@@ -0,0 +1,34 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { PropDiffRow } from './PropDiffRow.js';
+/**
+ * Counts prop diffs by type.
+ */
+function countPropDiffs(diffs) {
+    const counts = { added: 0, removed: 0, modified: 0 };
+    for (const diff of diffs) {
+        counts[diff.type]++;
+    }
+    return counts;
+}
+/**
+ * Renders a panel showing all prop changes for a component.
+ */
+export function PropDiffPanel({ componentType, componentId, diffs, className = '', }) {
+    const baseClass = 'prop-diff-panel';
+    const classes = [baseClass, className].filter(Boolean).join(' ');
+    const counts = countPropDiffs(diffs);
+    const hasDiffs = diffs.length > 0;
+    // Build summary parts
+    const summaryParts = [];
+    if (counts.added > 0) {
+        summaryParts.push(`${counts.added} added`);
+    }
+    if (counts.removed > 0) {
+        summaryParts.push(`${counts.removed} removed`);
+    }
+    if (counts.modified > 0) {
+        summaryParts.push(`${counts.modified} modified`);
+    }
+    return (_jsxs("div", { className: classes, children: [_jsxs("div", { className: `${baseClass}__header`, children: [_jsx("span", { className: `${baseClass}__type`, children: componentType }), _jsx("span", { className: `${baseClass}__id`, children: componentId })] }), hasDiffs && (_jsx("div", { className: `${baseClass}__summary`, children: summaryParts.join(', ') })), _jsx("div", { className: `${baseClass}__content`, children: hasDiffs ? (_jsx("div", { className: `${baseClass}__rows`, children: diffs.map((diff) => (_jsx(PropDiffRow, { diff: diff }, diff.propName))) })) : (_jsx("div", { className: `${baseClass}__empty`, children: "No prop changes" })) })] }));
+}
+//# sourceMappingURL=PropDiffPanel.js.map

package/dist/versioning/components/version-compare/PropDiffPanel.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"PropDiffPanel.js","sourceRoot":"","sources":["../../../../src/versioning/components/version-compare/PropDiffPanel.tsx"],"names":[],"mappings":";AAQA,OAAO,EAAE,WAAW,EAAE,MAAM,kBAAkB,CAAC;AAwB/C;;GAEG;AACH,SAAS,cAAc,CAAC,KAAiB;IAKvC,MAAM,MAAM,GAAG,EAAE,KAAK,EAAE,CAAC,EAAE,OAAO,EAAE,CAAC,EAAE,QAAQ,EAAE,CAAC,EAAE,CAAC;IACrD,KAAK,MAAM,IAAI,IAAI,KAAK,EAAE,CAAC;QACzB,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC,EAAE,CAAC;IACtB,CAAC;IACD,OAAO,MAAM,CAAC;AAChB,CAAC;AAED;;GAEG;AACH,MAAM,UAAU,aAAa,CAAC,EAC5B,aAAa,EACb,WAAW,EACX,KAAK,EACL,SAAS,GAAG,EAAE,GACK;IACnB,MAAM,SAAS,GAAG,iBAAiB,CAAC;IACpC,MAAM,OAAO,GAAG,CAAC,SAAS,EAAE,SAAS,CAAC,CAAC,MAAM,CAAC,OAAO,CAAC,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC;IAEjE,MAAM,MAAM,GAAG,cAAc,CAAC,KAAK,CAAC,CAAC;IACrC,MAAM,QAAQ,GAAG,KAAK,CAAC,MAAM,GAAG,CAAC,CAAC;IAElC,sBAAsB;IACtB,MAAM,YAAY,GAAa,EAAE,CAAC;IAClC,IAAI,MAAM,CAAC,KAAK,GAAG,CAAC,EAAE,CAAC;QACrB,YAAY,CAAC,IAAI,CAAC,GAAG,MAAM,CAAC,KAAK,QAAQ,CAAC,CAAC;IAC7C,CAAC;IACD,IAAI,MAAM,CAAC,OAAO,GAAG,CAAC,EAAE,CAAC;QACvB,YAAY,CAAC,IAAI,CAAC,GAAG,MAAM,CAAC,OAAO,UAAU,CAAC,CAAC;IACjD,CAAC;IACD,IAAI,MAAM,CAAC,QAAQ,GAAG,CAAC,EAAE,CAAC;QACxB,YAAY,CAAC,IAAI,CAAC,GAAG,MAAM,CAAC,QAAQ,WAAW,CAAC,CAAC;IACnD,CAAC;IAED,OAAO,CACL,eAAK,SAAS,EAAE,OAAO,aACrB,eAAK,SAAS,EAAE,GAAG,SAAS,UAAU,aACpC,eAAM,SAAS,EAAE,GAAG,SAAS,QAAQ,YAAG,aAAa,GAAQ,EAC7D,eAAM,SAAS,EAAE,GAAG,SAAS,MAAM,YAAG,WAAW,GAAQ,IACrD,EAEL,QAAQ,IAAI,CACX,cAAK,SAAS,EAAE,GAAG,SAAS,WAAW,YACpC,YAAY,CAAC,IAAI,CAAC,IAAI,CAAC,GACpB,CACP,EAED,cAAK,SAAS,EAAE,GAAG,SAAS,WAAW,YACpC,QAAQ,CAAC,CAAC,CAAC,CACV,cAAK,SAAS,EAAE,GAAG,SAAS,QAAQ,YACjC,KAAK,CAAC,GAAG,CAAC,CAAC,IAAI,EAAE,EAAE,CAAC,CACnB,KAAC,WAAW,IAAqB,IAAI,EAAE,IAAI,IAAzB,IAAI,CAAC,QAAQ,CAAgB,CAChD,CAAC,GACE,CACP,CAAC,CAAC,CAAC,CACF,cAAK,SAAS,EAAE,GAAG,SAAS,SAAS,gCAE/B,CACP,GACG,IACF,CACP,CAAC;AACJ,CAAC"}

package/dist/versioning/components/version-compare/PropDiffRow.d.ts

@@ -0,0 +1,22 @@
+/**
+ * PropDiffRow Component
+ *
+ * Displays a single prop difference with before/after values.
+ */
+import React from 'react';
+import type { PropDiff } from '../../../core/types.js';
+export interface PropDiffRowProps {
+    /**
+     * The prop diff to display.
+     */
+    diff: PropDiff;
+    /**
+     * Additional CSS class name.
+     */
+    className?: string;
+}
+/**
+ * Renders a single row showing a prop change.
+ */
+export declare function PropDiffRow({ diff, className, }: PropDiffRowProps): React.ReactElement;
+//# sourceMappingURL=PropDiffRow.d.ts.map

package/dist/versioning/components/version-compare/PropDiffRow.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"PropDiffRow.d.ts","sourceRoot":"","sources":["../../../../src/versioning/components/version-compare/PropDiffRow.tsx"],"names":[],"mappings":"AAAA;;;;GAIG;AAEH,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,wBAAwB,CAAC;AAGvD,MAAM,WAAW,gBAAgB;IAC/B;;OAEG;IACH,IAAI,EAAE,QAAQ,CAAC;IAEf;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED;;GAEG;AACH,wBAAgB,WAAW,CAAC,EAC1B,IAAI,EACJ,SAAc,GACf,EAAE,gBAAgB,GAAG,KAAK,CAAC,YAAY,CA6BvC"}

package/dist/versioning/components/version-compare/PropDiffRow.js

@@ -0,0 +1,12 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { PropValueDisplay } from './PropValueDisplay.js';
+/**
+ * Renders a single row showing a prop change.
+ */
+export function PropDiffRow({ diff, className = '', }) {
+    const baseClass = 'prop-diff-row';
+    const typeClass = `${baseClass}--${diff.type}`;
+    const classes = [baseClass, typeClass, className].filter(Boolean).join(' ');
+    return (_jsxs("div", { className: classes, children: [_jsx("div", { className: `${baseClass}__name`, children: diff.propName }), _jsxs("div", { className: `${baseClass}__values`, children: [_jsx("div", { className: `${baseClass}__before`, children: diff.type === 'added' ? (_jsx("span", { className: `${baseClass}__empty`, children: "\u2014" })) : (_jsx(PropValueDisplay, { value: diff.before, diffType: "removed" })) }), _jsx("div", { className: `${baseClass}__arrow`, children: "\u2192" }), _jsx("div", { className: `${baseClass}__after`, children: diff.type === 'removed' ? (_jsx("span", { className: `${baseClass}__empty`, children: "\u2014" })) : (_jsx(PropValueDisplay, { value: diff.after, diffType: "added" })) })] })] }));
+}
+//# sourceMappingURL=PropDiffRow.js.map

package/dist/versioning/components/version-compare/PropDiffRow.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"PropDiffRow.js","sourceRoot":"","sources":["../../../../src/versioning/components/version-compare/PropDiffRow.tsx"],"names":[],"mappings":";AAQA,OAAO,EAAE,gBAAgB,EAAE,MAAM,uBAAuB,CAAC;AAczD;;GAEG;AACH,MAAM,UAAU,WAAW,CAAC,EAC1B,IAAI,EACJ,SAAS,GAAG,EAAE,GACG;IACjB,MAAM,SAAS,GAAG,eAAe,CAAC;IAClC,MAAM,SAAS,GAAG,GAAG,SAAS,KAAK,IAAI,CAAC,IAAI,EAAE,CAAC;IAC/C,MAAM,OAAO,GAAG,CAAC,SAAS,EAAE,SAAS,EAAE,SAAS,CAAC,CAAC,MAAM,CAAC,OAAO,CAAC,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC;IAE5E,OAAO,CACL,eAAK,SAAS,EAAE,OAAO,aACrB,cAAK,SAAS,EAAE,GAAG,SAAS,QAAQ,YACjC,IAAI,CAAC,QAAQ,GACV,EACN,eAAK,SAAS,EAAE,GAAG,SAAS,UAAU,aACpC,cAAK,SAAS,EAAE,GAAG,SAAS,UAAU,YACnC,IAAI,CAAC,IAAI,KAAK,OAAO,CAAC,CAAC,CAAC,CACvB,eAAM,SAAS,EAAE,GAAG,SAAS,SAAS,uBAAU,CACjD,CAAC,CAAC,CAAC,CACF,KAAC,gBAAgB,IAAC,KAAK,EAAE,IAAI,CAAC,MAAM,EAAE,QAAQ,EAAC,SAAS,GAAG,CAC5D,GACG,EACN,cAAK,SAAS,EAAE,GAAG,SAAS,SAAS,uBAAS,EAC9C,cAAK,SAAS,EAAE,GAAG,SAAS,SAAS,YAClC,IAAI,CAAC,IAAI,KAAK,SAAS,CAAC,CAAC,CAAC,CACzB,eAAM,SAAS,EAAE,GAAG,SAAS,SAAS,uBAAU,CACjD,CAAC,CAAC,CAAC,CACF,KAAC,gBAAgB,IAAC,KAAK,EAAE,IAAI,CAAC,KAAK,EAAE,QAAQ,EAAC,OAAO,GAAG,CACzD,GACG,IACF,IACF,CACP,CAAC;AACJ,CAAC"}

package/dist/versioning/components/version-compare/PropValueDisplay.d.ts

@@ -0,0 +1,36 @@
+/**
+ * PropValueDisplay Component
+ *
+ * Smart renderer for prop values that displays different types appropriately:
+ * - Colors: Shows color swatch with hex/rgb value
+ * - Strings: Inline text with truncation for long values
+ * - Numbers: Numeric display
+ * - Booleans: Checkmark or X icon
+ * - Arrays: Summary with item count
+ * - Objects: Summary with key count
+ */
+import React from 'react';
+export interface PropValueDisplayProps {
+    /**
+     * The value to display.
+     */
+    value: unknown;
+    /**
+     * Maximum length for string values before truncation.
+     * @default 80
+     */
+    maxLength?: number;
+    /**
+     * Diff type for styling (added, removed, modified).
+     */
+    diffType?: 'added' | 'removed' | 'modified';
+    /**
+     * Additional CSS class name.
+     */
+    className?: string;
+}
+/**
+ * Smart prop value display component.
+ */
+export declare function PropValueDisplay({ value, maxLength, diffType, className, }: PropValueDisplayProps): React.ReactElement;
+//# sourceMappingURL=PropValueDisplay.d.ts.map

package/dist/versioning/components/version-compare/PropValueDisplay.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"PropValueDisplay.d.ts","sourceRoot":"","sources":["../../../../src/versioning/components/version-compare/PropValueDisplay.tsx"],"names":[],"mappings":"AAAA;;;;;;;;;;GAUG;AAEH,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,MAAM,WAAW,qBAAqB;IACpC;;OAEG;IACH,KAAK,EAAE,OAAO,CAAC;IAEf;;;OAGG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IAEnB;;OAEG;IACH,QAAQ,CAAC,EAAE,OAAO,GAAG,SAAS,GAAG,UAAU,CAAC;IAE5C;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AA8DD;;GAEG;AACH,wBAAgB,gBAAgB,CAAC,EAC/B,KAAK,EACL,SAAc,EACd,QAAQ,EACR,SAAc,GACf,EAAE,qBAAqB,GAAG,KAAK,CAAC,YAAY,CAoE5C"}

package/dist/versioning/components/version-compare/PropValueDisplay.js

@@ -0,0 +1,79 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+/**
+ * Checks if a string value represents a color.
+ */
+function isColorValue(value) {
+    // Hex colors
+    if (/^#([0-9a-fA-F]{3}|[0-9a-fA-F]{6}|[0-9a-fA-F]{8})$/.test(value)) {
+        return true;
+    }
+    // RGB/RGBA colors
+    if (/^rgba?\s*\([\d\s,%.]+\)$/i.test(value)) {
+        return true;
+    }
+    // HSL/HSLA colors
+    if (/^hsla?\s*\([\d\s,%deg.]+\)$/i.test(value)) {
+        return true;
+    }
+    return false;
+}
+/**
+ * Renders a color value with swatch.
+ */
+function ColorValue({ value }) {
+    return (_jsxs("span", { className: "prop-value-color", children: [_jsx("span", { className: "prop-value-color-swatch", style: { backgroundColor: value }, "aria-hidden": "true" }), _jsx("span", { className: "prop-value-color-text", children: value })] }));
+}
+/**
+ * Renders a string value with optional truncation.
+ */
+function StringValue({ value, maxLength, }) {
+    if (value === '') {
+        return _jsx("span", { className: "prop-value-empty", children: "(empty)" });
+    }
+    if (value.length > maxLength) {
+        return (_jsxs("span", { className: "prop-value-string prop-value-string--truncated", children: [value.slice(0, maxLength), "\u2026"] }));
+    }
+    return _jsx("span", { className: "prop-value-string", children: value });
+}
+/**
+ * Smart prop value display component.
+ */
+export function PropValueDisplay({ value, maxLength = 80, diffType, className = '', }) {
+    const baseClass = 'prop-value';
+    const diffClass = diffType ? `${baseClass}--${diffType}` : '';
+    const classes = [baseClass, diffClass, className].filter(Boolean).join(' ');
+    // Null/undefined
+    if (value === null) {
+        return _jsx("span", { className: classes, children: "null" });
+    }
+    if (value === undefined) {
+        return _jsx("span", { className: classes, children: "undefined" });
+    }
+    // Boolean
+    if (typeof value === 'boolean') {
+        return (_jsx("span", { className: `${classes} prop-value-boolean`, children: value ? '✓' : '✗' }));
+    }
+    // Number
+    if (typeof value === 'number') {
+        return (_jsx("span", { className: `${classes} prop-value-number`, children: String(value) }));
+    }
+    // String (check for color first)
+    if (typeof value === 'string') {
+        if (isColorValue(value)) {
+            return (_jsx("span", { className: classes, children: _jsx(ColorValue, { value: value }) }));
+        }
+        return (_jsx("span", { className: classes, children: _jsx(StringValue, { value: value, maxLength: maxLength }) }));
+    }
+    // Array
+    if (Array.isArray(value)) {
+        return (_jsxs("span", { className: `${classes} prop-value-array`, children: ["[", value.length, " items]"] }));
+    }
+    // Object
+    if (typeof value === 'object') {
+        const keyCount = Object.keys(value).length;
+        return (_jsx("span", { className: `${classes} prop-value-object`, children: '{' + keyCount + ' keys}' }));
+    }
+    // Fallback for any other type
+    return _jsx("span", { className: classes, children: String(value) });
+}
+//# sourceMappingURL=PropValueDisplay.js.map

package/dist/versioning/components/version-compare/PropValueDisplay.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"PropValueDisplay.js","sourceRoot":"","sources":["../../../../src/versioning/components/version-compare/PropValueDisplay.tsx"],"names":[],"mappings":"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"}

package/dist/versioning/components/version-compare/VersionComparePage.d.ts

@@ -0,0 +1,34 @@
+/**
+ * VersionComparePage Component
+ *
+ * Full-page view for comparing two versions of Puck data.
+ */
+import React from 'react';
+import type { ComponentDiffWithPosition } from '../../../core/types.js';
+export interface VersionComparePageProps {
+    /**
+     * The before version number.
+     */
+    beforeVersion: number;
+    /**
+     * The after version number.
+     */
+    afterVersion: number;
+    /**
+     * Array of component diffs with position information.
+     */
+    diffs: ComponentDiffWithPosition[];
+    /**
+     * Callback when the comparison is closed.
+     */
+    onClose: () => void;
+    /**
+     * Additional CSS class name.
+     */
+    className?: string;
+}
+/**
+ * Renders a full-page version comparison view.
+ */
+export declare function VersionComparePage({ beforeVersion, afterVersion, diffs, onClose, className, }: VersionComparePageProps): React.ReactElement;
+//# sourceMappingURL=VersionComparePage.d.ts.map

package/dist/versioning/components/version-compare/VersionComparePage.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"VersionComparePage.d.ts","sourceRoot":"","sources":["../../../../src/versioning/components/version-compare/VersionComparePage.tsx"],"names":[],"mappings":"AAAA;;;;GAIG;AAEH,OAAO,KAA4B,MAAM,OAAO,CAAC;AACjD,OAAO,KAAK,EAAE,yBAAyB,EAAY,MAAM,wBAAwB,CAAC;AAMlF,MAAM,WAAW,uBAAuB;IACtC;;OAEG;IACH,aAAa,EAAE,MAAM,CAAC;IAEtB;;OAEG;IACH,YAAY,EAAE,MAAM,CAAC;IAErB;;OAEG;IACH,KAAK,EAAE,yBAAyB,EAAE,CAAC;IAEnC;;OAEG;IACH,OAAO,EAAE,MAAM,IAAI,CAAC;IAEpB;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAqBD;;GAEG;AACH,wBAAgB,kBAAkB,CAAC,EACjC,aAAa,EACb,YAAY,EACZ,KAAK,EACL,OAAO,EACP,SAAc,GACf,EAAE,uBAAuB,GAAG,KAAK,CAAC,YAAY,CAgF9C"}

package/dist/versioning/components/version-compare/VersionComparePage.js

@@ -0,0 +1,61 @@
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+/**
+ * VersionComparePage Component
+ *
+ * Full-page view for comparing two versions of Puck data.
+ */
+import { useState, useMemo } from 'react';
+import { diffProps } from '../../utils/diff.js';
+import { DiffHeader } from './DiffHeader.js';
+import { ComponentTree } from './ComponentTree.js';
+import { PropDiffPanel } from './PropDiffPanel.js';
+/**
+ * Counts diffs by type.
+ */
+function countDiffs(diffs) {
+    const counts = { added: 0, removed: 0, modified: 0, reordered: 0 };
+    for (const diff of diffs) {
+        if (diff.type === 'added')
+            counts.added++;
+        else if (diff.type === 'removed')
+            counts.removed++;
+        else if (diff.type === 'modified')
+            counts.modified++;
+        else if (diff.type === 'reordered')
+            counts.reordered++;
+    }
+    return counts;
+}
+/**
+ * Renders a full-page version comparison view.
+ */
+export function VersionComparePage({ beforeVersion, afterVersion, diffs, onClose, className = '', }) {
+    const baseClass = 'version-compare-page';
+    const classes = [baseClass, className].filter(Boolean).join(' ');
+    const [selectedComponentId, setSelectedComponentId] = useState(null);
+    const counts = useMemo(() => countDiffs(diffs), [diffs]);
+    const isEmpty = diffs.length === 0;
+    // Find the selected diff
+    const selectedDiff = useMemo(() => {
+        if (!selectedComponentId)
+            return null;
+        return diffs.find((d) => d.componentId === selectedComponentId) ?? null;
+    }, [diffs, selectedComponentId]);
+    // Get prop diffs for the selected component
+    const propDiffs = useMemo(() => {
+        if (!selectedDiff)
+            return [];
+        if (selectedDiff.type === 'unchanged')
+            return [];
+        const beforeData = selectedDiff.before;
+        const afterData = selectedDiff.after;
+        const beforeProps = beforeData?.props ?? {};
+        const afterProps = afterData?.props ?? {};
+        return diffProps(beforeProps, afterProps);
+    }, [selectedDiff]);
+    const handleSelectComponent = (diff) => {
+        setSelectedComponentId(diff.componentId);
+    };
+    return (_jsxs("div", { className: classes, children: [_jsx(DiffHeader, { beforeVersion: beforeVersion, afterVersion: afterVersion, added: counts.added, removed: counts.removed, modified: counts.modified, reordered: counts.reordered, onClose: onClose }), _jsx("div", { className: `${baseClass}__content`, children: isEmpty ? (_jsx("div", { className: `${baseClass}__empty`, children: "No changes between versions" })) : (_jsxs(_Fragment, { children: [_jsxs("div", { className: `${baseClass}__trees`, children: [_jsx(ComponentTree, { diffs: diffs, side: "before", selectedComponentId: selectedComponentId ?? undefined, onSelectComponent: handleSelectComponent }), _jsx(ComponentTree, { diffs: diffs, side: "after", selectedComponentId: selectedComponentId ?? undefined, onSelectComponent: handleSelectComponent })] }), selectedDiff && (_jsx("div", { className: `${baseClass}__detail`, children: _jsx(PropDiffPanel, { componentType: selectedDiff.componentType, componentId: selectedDiff.componentId, diffs: propDiffs }) }))] })) })] }));
+}
+//# sourceMappingURL=VersionComparePage.js.map

package/dist/versioning/components/version-compare/VersionComparePage.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"VersionComparePage.js","sourceRoot":"","sources":["../../../../src/versioning/components/version-compare/VersionComparePage.tsx"],"names":[],"mappings":"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"}

package/dist/versioning/components/version-compare/VisualBranchCompare.d.ts

@@ -0,0 +1,41 @@
+/**
+ * VisualBranchCompare Component
+ *
+ * Side-by-side visual comparison of two branch snapshots with diff highlighting.
+ * Supports multiple documents with a dropdown selector.
+ * Uses Puck's Render component to display actual rendered content.
+ */
+import React from 'react';
+import type { DocumentDiffSummary } from '../../utils/branchDiff.js';
+import type { PuckConfig } from '../../utils/highlightConfig.js';
+export interface VisualBranchCompareProps {
+    /**
+     * Name of the source branch.
+     */
+    sourceBranchName: string;
+    /**
+     * Name of the target branch.
+     */
+    targetBranchName: string;
+    /**
+     * All documents with source/target snapshots to compare.
+     */
+    documents: DocumentDiffSummary[];
+    /**
+     * The Puck configuration for rendering components.
+     */
+    config: PuckConfig;
+    /**
+     * Callback when the comparison is closed.
+     */
+    onClose: () => void;
+    /**
+     * Additional CSS class name.
+     */
+    className?: string;
+}
+/**
+ * Renders a side-by-side visual comparison of two branches across multiple documents.
+ */
+export declare function VisualBranchCompare({ sourceBranchName, targetBranchName, documents, config, onClose, className, }: VisualBranchCompareProps): React.ReactElement;
+//# sourceMappingURL=VisualBranchCompare.d.ts.map

package/dist/versioning/components/version-compare/VisualBranchCompare.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"VisualBranchCompare.d.ts","sourceRoot":"","sources":["../../../../src/versioning/components/version-compare/VisualBranchCompare.tsx"],"names":[],"mappings":"AAAA;;;;;;GAMG;AAEH,OAAO,KAA4B,MAAM,OAAO,CAAC;AAEjD,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,2BAA2B,CAAC;AAGrE,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,gCAAgC,CAAC;AAcjE,MAAM,WAAW,wBAAwB;IACvC;;OAEG;IACH,gBAAgB,EAAE,MAAM,CAAC;IAEzB;;OAEG;IACH,gBAAgB,EAAE,MAAM,CAAC;IAEzB;;OAEG;IACH,SAAS,EAAE,mBAAmB,EAAE,CAAC;IAEjC;;OAEG;IACH,MAAM,EAAE,UAAU,CAAC;IAEnB;;OAEG;IACH,OAAO,EAAE,MAAM,IAAI,CAAC;IAEpB;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED;;GAEG;AACH,wBAAgB,mBAAmB,CAAC,EAClC,gBAAgB,EAChB,gBAAgB,EAChB,SAAS,EACT,MAAM,EACN,OAAO,EACP,SAAc,GACf,EAAE,wBAAwB,GAAG,KAAK,CAAC,YAAY,CA4K/C"}

package/dist/versioning/components/version-compare/VisualBranchCompare.js

@@ -0,0 +1,84 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+/**
+ * VisualBranchCompare Component
+ *
+ * Side-by-side visual comparison of two branch snapshots with diff highlighting.
+ * Supports multiple documents with a dropdown selector.
+ * Uses Puck's Render component to display actual rendered content.
+ */
+import { useState, useMemo } from 'react';
+import { Render } from '@puckeditor/core';
+import { createBranchDocumentComparison } from '../../utils/branchDiff.js';
+import { createDiffMap, createHighlightedConfig } from '../../utils/highlightConfig.js';
+import { BranchDiffHeader } from './BranchDiffHeader.js';
+/**
+ * Renders a side-by-side visual comparison of two branches across multiple documents.
+ */
+export function VisualBranchCompare({ sourceBranchName, targetBranchName, documents, config, onClose, className = '', }) {
+    const baseClass = 'visual-version-compare';
+    const classes = [baseClass, className].filter(Boolean).join(' ');
+    // Compute comparisons for all documents
+    const allComparisons = useMemo(() => {
+        return documents.map((doc) => createBranchDocumentComparison(doc.documentId, doc.documentPath, doc.sourceSnapshot, doc.targetSnapshot));
+    }, [documents]);
+    // Filter to only documents with actual changes (new, deleted, or modified)
+    const changedEntries = useMemo(() => {
+        const entries = [];
+        for (let i = 0; i < documents.length; i++) {
+            const doc = documents[i];
+            const comp = allComparisons[i];
+            if (!doc || !comp)
+                continue;
+            const hasChanges = comp.diffs.some((d) => d.type !== 'unchanged');
+            const isNew = doc.sourceSnapshot != null && doc.targetSnapshot == null;
+            const isDeleted = doc.sourceSnapshot == null && doc.targetSnapshot != null;
+            if (hasChanges || isNew || isDeleted) {
+                entries.push({ doc, comparison: comp });
+            }
+        }
+        return entries;
+    }, [documents, allComparisons]);
+    const [selectedIndex, setSelectedIndex] = useState(0);
+    const selected = changedEntries[selectedIndex];
+    const selectedComparison = selected?.comparison ?? null;
+    const selectedDocument = selected?.doc ?? null;
+    // Create diff map and highlighted configs for the selected document
+    const diffMap = useMemo(() => (selectedComparison ? createDiffMap(selectedComparison.diffs) : new Map()), [selectedComparison]);
+    // Source is the "after" (new/changed state), target is the "before" (baseline)
+    const sourceConfig = useMemo(() => createHighlightedConfig(config, diffMap, 'after'), [config, diffMap]);
+    const targetConfig = useMemo(() => createHighlightedConfig(config, diffMap, 'before'), [config, diffMap]);
+    // Get source and target data for rendering
+    const sourceData = selectedDocument?.sourceSnapshot;
+    const targetData = selectedDocument?.targetSnapshot;
+    const emptyData = { content: [], root: { props: {} } };
+    // Determine document status for the selected entry
+    const isNewDocument = sourceData != null && targetData == null;
+    const isDeletedDocument = sourceData == null && targetData != null;
+    // Aggregate change counts across all changed documents for the header
+    const totalCounts = useMemo(() => {
+        const totals = { added: 0, removed: 0, modified: 0 };
+        for (const entry of changedEntries) {
+            totals.added += entry.comparison.counts.added;
+            totals.removed += entry.comparison.counts.removed;
+            totals.modified += entry.comparison.counts.modified;
+        }
+        return totals;
+    }, [changedEntries]);
+    return (_jsxs("div", { className: classes, children: [_jsx(BranchDiffHeader, { sourceBranchName: sourceBranchName, targetBranchName: targetBranchName, added: totalCounts.added, removed: totalCounts.removed, modified: totalCounts.modified, onClose: onClose }), _jsxs("div", { className: `${baseClass}__legend`, children: [changedEntries.length > 1 && (_jsx("select", { className: "css-plugin-select", style: { width: 'auto', maxWidth: '300px', marginRight: '1rem', padding: '0.25rem 0.5rem', fontSize: '0.75rem' }, value: selectedIndex, onChange: (e) => setSelectedIndex(Number(e.target.value)), children: changedEntries.map((entry, i) => {
+                            const isNew = entry.doc.sourceSnapshot != null && entry.doc.targetSnapshot == null;
+                            const isDel = entry.doc.sourceSnapshot == null && entry.doc.targetSnapshot != null;
+                            const docChanges = entry.comparison.counts.added + entry.comparison.counts.removed + entry.comparison.counts.modified;
+                            let label = entry.doc.documentPath;
+                            if (isNew) {
+                                label += ' (new)';
+                            }
+                            else if (isDel) {
+                                label += ' (deleted)';
+                            }
+                            else if (docChanges > 0) {
+                                label += ` (${docChanges} change${docChanges !== 1 ? 's' : ''})`;
+                            }
+                            return (_jsx("option", { value: i, children: label }, entry.doc.documentId));
+                        }) })), _jsxs("span", { className: `${baseClass}__legend-item ${baseClass}__legend-item--added`, children: [_jsx("span", { className: `${baseClass}__legend-color` }), " Added"] }), _jsxs("span", { className: `${baseClass}__legend-item ${baseClass}__legend-item--removed`, children: [_jsx("span", { className: `${baseClass}__legend-color` }), " Removed"] }), _jsxs("span", { className: `${baseClass}__legend-item ${baseClass}__legend-item--modified`, children: [_jsx("span", { className: `${baseClass}__legend-color` }), " Modified"] })] }), _jsx("div", { className: `${baseClass}__content`, children: changedEntries.length === 0 ? (_jsx("div", { className: `${baseClass}__empty`, children: "No changes between Drafts" })) : (_jsxs("div", { className: `${baseClass}__panels`, children: [_jsxs("div", { className: `${baseClass}__panel ${baseClass}__panel--before`, children: [_jsxs("div", { className: `${baseClass}__panel-header`, children: [_jsx("span", { className: `${baseClass}__panel-label`, children: "New Changes" }), _jsx("span", { className: `${baseClass}__panel-version`, children: sourceBranchName })] }), _jsx("div", { className: `${baseClass}__panel-content`, children: isDeletedDocument ? (_jsx("div", { className: `${baseClass}__empty`, children: "Document deleted in this Draft" })) : (_jsx(Render, { config: sourceConfig, data: (sourceData ?? emptyData) })) })] }), _jsxs("div", { className: `${baseClass}__panel ${baseClass}__panel--after`, children: [_jsxs("div", { className: `${baseClass}__panel-header`, children: [_jsx("span", { className: `${baseClass}__panel-label`, children: "Current State" }), _jsx("span", { className: `${baseClass}__panel-version`, children: targetBranchName })] }), _jsx("div", { className: `${baseClass}__panel-content`, children: isNewDocument ? (_jsx("div", { className: `${baseClass}__empty`, children: "Document does not exist on this Draft" })) : (_jsx(Render, { config: targetConfig, data: (targetData ?? emptyData) })) })] })] })) })] }));
+}
+//# sourceMappingURL=VisualBranchCompare.js.map

package/dist/versioning/components/version-compare/VisualBranchCompare.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"VisualBranchCompare.js","sourceRoot":"","sources":["../../../../src/versioning/components/version-compare/VisualBranchCompare.tsx"],"names":[],"mappings":"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"}

package/dist/versioning/components/version-compare/VisualVersionCompare.d.ts

@@ -0,0 +1,67 @@
+/**
+ * VisualVersionCompare Component
+ *
+ * Side-by-side visual comparison of two Puck page versions with diff highlighting.
+ * Uses Puck's Render component to display actual rendered content.
+ */
+import React from 'react';
+import type { ComponentDiffWithPosition } from '../../../core/types.js';
+/**
+ * Puck Data structure (flexible to accept various sources)
+ */
+interface PuckData {
+    content: Array<{
+        type: string;
+        props: Record<string, unknown> & {
+            id: string;
+        };
+    }>;
+    root: {
+        props?: Record<string, unknown>;
+    };
+}
+/**
+ * Puck Config structure (flexible to accept Puck's Config type)
+ * Uses a loose type to accept any Puck config
+ */
+type PuckConfig = Record<string, any>;
+export interface VisualVersionCompareProps {
+    /**
+     * The before version number.
+     */
+    beforeVersion: number;
+    /**
+     * The after version number.
+     */
+    afterVersion: number;
+    /**
+     * The Puck data from the before version.
+     */
+    beforeData: PuckData;
+    /**
+     * The Puck data from the after version.
+     */
+    afterData: PuckData;
+    /**
+     * The Puck configuration for rendering components.
+     */
+    config: PuckConfig;
+    /**
+     * Array of component diffs with position information.
+     */
+    diffs: ComponentDiffWithPosition[];
+    /**
+     * Callback when the comparison is closed.
+     */
+    onClose: () => void;
+    /**
+     * Additional CSS class name.
+     */
+    className?: string;
+}
+/**
+ * Renders a side-by-side visual comparison of two Puck page versions.
+ */
+export declare function VisualVersionCompare({ beforeVersion, afterVersion, beforeData, afterData, config, diffs, onClose, className, }: VisualVersionCompareProps): React.ReactElement;
+export {};
+//# sourceMappingURL=VisualVersionCompare.d.ts.map

package/dist/versioning/components/version-compare/VisualVersionCompare.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"VisualVersionCompare.d.ts","sourceRoot":"","sources":["../../../../src/versioning/components/version-compare/VisualVersionCompare.tsx"],"names":[],"mappings":"AAAA;;;;;GAKG;AAEH,OAAO,KAAkB,MAAM,OAAO,CAAC;AAEvC,OAAO,KAAK,EAAE,yBAAyB,EAAE,MAAM,wBAAwB,CAAC;AAGxE;;GAEG;AACH,UAAU,QAAQ;IAChB,OAAO,EAAE,KAAK,CAAC;QACb,IAAI,EAAE,MAAM,CAAC;QACb,KAAK,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,GAAG;YAAE,EAAE,EAAE,MAAM,CAAA;SAAE,CAAC;KACjD,CAAC,CAAC;IACH,IAAI,EAAE;QAAE,KAAK,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAA;KAAE,CAAC;CAC3C;AAED;;;GAGG;AAEH,KAAK,UAAU,GAAG,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,CAAC;AAEtC,MAAM,WAAW,yBAAyB;IACxC;;OAEG;IACH,aAAa,EAAE,MAAM,CAAC;IAEtB;;OAEG;IACH,YAAY,EAAE,MAAM,CAAC;IAErB;;OAEG;IACH,UAAU,EAAE,QAAQ,CAAC;IAErB;;OAEG;IACH,SAAS,EAAE,QAAQ,CAAC;IAEpB;;OAEG;IACH,MAAM,EAAE,UAAU,CAAC;IAEnB;;OAEG;IACH,KAAK,EAAE,yBAAyB,EAAE,CAAC;IAEnC;;OAEG;IACH,OAAO,EAAE,MAAM,IAAI,CAAC;IAEpB;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AA+FD;;GAEG;AACH,wBAAgB,oBAAoB,CAAC,EACnC,aAAa,EACb,YAAY,EACZ,UAAU,EACV,SAAS,EACT,MAAM,EACN,KAAK,EACL,OAAO,EACP,SAAc,GACf,EAAE,yBAAyB,GAAG,KAAK,CAAC,YAAY,CAgFhD"}