@commercetools-demo/puck-version-history 0.2.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/index.d.mts +162 -0
- package/dist/index.d.ts +162 -0
- package/dist/index.js +13242 -0
- package/dist/index.js.map +1 -0
- package/dist/index.mjs +13219 -0
- package/dist/index.mjs.map +1 -0
- package/package.json +53 -0
package/dist/index.d.mts
ADDED
|
@@ -0,0 +1,162 @@
|
|
|
1
|
+
import { PuckData } from '@commercetools-demo/puck-types';
|
|
2
|
+
import React from 'react';
|
|
3
|
+
|
|
4
|
+
interface ComponentDiff {
|
|
5
|
+
id: string;
|
|
6
|
+
type: string;
|
|
7
|
+
status: 'added' | 'removed' | 'changed';
|
|
8
|
+
changedProps: string[];
|
|
9
|
+
}
|
|
10
|
+
interface PuckDataDiff {
|
|
11
|
+
components: ComponentDiff[];
|
|
12
|
+
rootChanges: string[];
|
|
13
|
+
hasChanges: boolean;
|
|
14
|
+
}
|
|
15
|
+
/**
|
|
16
|
+
* Generic version entry shape shared by pages and content items.
|
|
17
|
+
* Pages use `puckData`; content items use `data`.
|
|
18
|
+
*/
|
|
19
|
+
interface VersionEntry {
|
|
20
|
+
id: string;
|
|
21
|
+
timestamp: string;
|
|
22
|
+
puckData?: PuckData;
|
|
23
|
+
data?: PuckData;
|
|
24
|
+
}
|
|
25
|
+
|
|
26
|
+
interface VersionHistoryContextValue {
|
|
27
|
+
diff: PuckDataDiff | null;
|
|
28
|
+
isPreviewingHistory: boolean;
|
|
29
|
+
activeTab: 'components' | 'history';
|
|
30
|
+
openHistoryTab: () => void;
|
|
31
|
+
closeHistoryTab: () => void;
|
|
32
|
+
isHistoryTabActive: boolean;
|
|
33
|
+
versions: VersionEntry[];
|
|
34
|
+
isLoadingVersions: boolean;
|
|
35
|
+
selectedVersionId: string | null;
|
|
36
|
+
isApplying: boolean;
|
|
37
|
+
onVersionSelect: (id: string) => void;
|
|
38
|
+
onApply: () => void;
|
|
39
|
+
onDiscard: () => void;
|
|
40
|
+
}
|
|
41
|
+
interface VersionHistoryProviderProps {
|
|
42
|
+
diff: PuckDataDiff | null;
|
|
43
|
+
isPreviewingHistory: boolean;
|
|
44
|
+
versions: VersionEntry[];
|
|
45
|
+
isLoadingVersions: boolean;
|
|
46
|
+
selectedVersionId: string | null;
|
|
47
|
+
isApplying: boolean;
|
|
48
|
+
onVersionSelect: (id: string) => void;
|
|
49
|
+
onApply: () => void;
|
|
50
|
+
onDiscard: () => void;
|
|
51
|
+
/** Called when the History tab is first opened so versions can be fetched. */
|
|
52
|
+
onLoadVersions: () => Promise<void>;
|
|
53
|
+
children: React.ReactNode;
|
|
54
|
+
}
|
|
55
|
+
declare const VersionHistoryProvider: React.FC<VersionHistoryProviderProps>;
|
|
56
|
+
declare const useVersionHistoryContext: () => VersionHistoryContextValue;
|
|
57
|
+
|
|
58
|
+
/**
|
|
59
|
+
* Computes a structural diff between two PuckData snapshots.
|
|
60
|
+
*
|
|
61
|
+
* `versionData` is the historical snapshot; `currentData` is the live draft.
|
|
62
|
+
* Returns null when either input is null (no version selected, or editor not loaded).
|
|
63
|
+
*
|
|
64
|
+
* Semantics:
|
|
65
|
+
* - "added" → component exists in `currentData` but not in `versionData`
|
|
66
|
+
* - "removed" → component exists in `versionData` but not in `currentData`
|
|
67
|
+
* - "changed" → same id in both, but props differ
|
|
68
|
+
*/
|
|
69
|
+
declare function useVersionDiff(versionData: PuckData | null, currentData: PuckData | null): PuckDataDiff | null;
|
|
70
|
+
|
|
71
|
+
interface UseVersionHistoryPanelOptions {
|
|
72
|
+
versions: VersionEntry[];
|
|
73
|
+
loadVersions: () => Promise<void>;
|
|
74
|
+
/** The current live data shown in the editor (draft or published fallback). */
|
|
75
|
+
currentData: PuckData;
|
|
76
|
+
}
|
|
77
|
+
interface UseVersionHistoryPanelReturn {
|
|
78
|
+
isPanelOpen: boolean;
|
|
79
|
+
isPreviewingHistory: boolean;
|
|
80
|
+
isLoadingVersions: boolean;
|
|
81
|
+
selectedVersionId: string | null;
|
|
82
|
+
selectedVersion: VersionEntry | null;
|
|
83
|
+
/** When non-null, the editor should display this data instead of `currentData`. */
|
|
84
|
+
previewData: PuckData | null;
|
|
85
|
+
openPanel: () => Promise<void>;
|
|
86
|
+
closePanel: () => void;
|
|
87
|
+
selectVersion: (id: string) => void;
|
|
88
|
+
/** Clears the selected version but keeps the panel open. */
|
|
89
|
+
clearSelection: () => void;
|
|
90
|
+
/**
|
|
91
|
+
* Returns the PuckData of the selected version so the caller can call
|
|
92
|
+
* `saveDraft` with it. Closes the panel.
|
|
93
|
+
*/
|
|
94
|
+
applyVersion: () => PuckData | null;
|
|
95
|
+
}
|
|
96
|
+
declare function useVersionHistoryPanel({ versions, loadVersions, currentData, }: UseVersionHistoryPanelOptions): UseVersionHistoryPanelReturn;
|
|
97
|
+
|
|
98
|
+
interface VersionHistoryButtonProps {
|
|
99
|
+
disabled?: boolean;
|
|
100
|
+
}
|
|
101
|
+
/**
|
|
102
|
+
* Toggles the History tab in the Puck left sidebar.
|
|
103
|
+
* Reads active state from VersionHistoryContext — no onClick/isActive props needed.
|
|
104
|
+
*/
|
|
105
|
+
declare const VersionHistoryButton: React.FC<VersionHistoryButtonProps>;
|
|
106
|
+
|
|
107
|
+
/**
|
|
108
|
+
* Inline version history panel for Puck's left sidebar.
|
|
109
|
+
* Reads all state from VersionHistoryContext — no props needed.
|
|
110
|
+
*/
|
|
111
|
+
declare const VersionHistorySidebarContent: React.FC;
|
|
112
|
+
|
|
113
|
+
interface VersionCardProps {
|
|
114
|
+
version: VersionEntry;
|
|
115
|
+
isSelected: boolean;
|
|
116
|
+
isCurrent?: boolean;
|
|
117
|
+
onClick: (id: string) => void;
|
|
118
|
+
}
|
|
119
|
+
/**
|
|
120
|
+
* Renders a single version entry as a selectable card showing the timestamp.
|
|
121
|
+
*/
|
|
122
|
+
declare const VersionCard: React.FC<VersionCardProps>;
|
|
123
|
+
|
|
124
|
+
interface DiffSummaryProps {
|
|
125
|
+
diff: PuckDataDiff;
|
|
126
|
+
}
|
|
127
|
+
/**
|
|
128
|
+
* Renders a compact diff summary listing which components changed, were
|
|
129
|
+
* added, or were removed between the selected historical version and the
|
|
130
|
+
* current draft.
|
|
131
|
+
*/
|
|
132
|
+
declare const DiffSummary: React.FC<DiffSummaryProps>;
|
|
133
|
+
|
|
134
|
+
interface VersionPreviewBannerProps {
|
|
135
|
+
timestamp: string;
|
|
136
|
+
onApply: () => void;
|
|
137
|
+
onDiscard: () => void;
|
|
138
|
+
isApplying?: boolean;
|
|
139
|
+
}
|
|
140
|
+
/**
|
|
141
|
+
* Replaces the normal editor toolbar when previewing a historical version.
|
|
142
|
+
* Shows the version timestamp, an "Apply" button, and a "Discard" button.
|
|
143
|
+
* The normal Save / Publish / Revert to Published buttons must NOT be
|
|
144
|
+
* rendered alongside this component.
|
|
145
|
+
*/
|
|
146
|
+
declare const VersionPreviewBanner: React.FC<VersionPreviewBannerProps>;
|
|
147
|
+
|
|
148
|
+
interface VersionAwareFieldsPanelProps {
|
|
149
|
+
children: React.ReactNode;
|
|
150
|
+
isLoading: boolean;
|
|
151
|
+
}
|
|
152
|
+
/**
|
|
153
|
+
* Puck `fields` override that injects a "Changed props" banner above the
|
|
154
|
+
* fields panel whenever the editor is in version-preview mode and the
|
|
155
|
+
* currently selected component has properties that differ from the current draft.
|
|
156
|
+
*
|
|
157
|
+
* Usage:
|
|
158
|
+
* overrides={{ fields: VersionAwareFieldsPanel }}
|
|
159
|
+
*/
|
|
160
|
+
declare const VersionAwareFieldsPanel: React.FC<VersionAwareFieldsPanelProps>;
|
|
161
|
+
|
|
162
|
+
export { type ComponentDiff, DiffSummary, type PuckDataDiff, type UseVersionHistoryPanelReturn, VersionAwareFieldsPanel, VersionCard, type VersionEntry, VersionHistoryButton, VersionHistoryProvider, VersionHistorySidebarContent, VersionPreviewBanner, useVersionDiff, useVersionHistoryContext, useVersionHistoryPanel };
|
package/dist/index.d.ts
ADDED
|
@@ -0,0 +1,162 @@
|
|
|
1
|
+
import { PuckData } from '@commercetools-demo/puck-types';
|
|
2
|
+
import React from 'react';
|
|
3
|
+
|
|
4
|
+
interface ComponentDiff {
|
|
5
|
+
id: string;
|
|
6
|
+
type: string;
|
|
7
|
+
status: 'added' | 'removed' | 'changed';
|
|
8
|
+
changedProps: string[];
|
|
9
|
+
}
|
|
10
|
+
interface PuckDataDiff {
|
|
11
|
+
components: ComponentDiff[];
|
|
12
|
+
rootChanges: string[];
|
|
13
|
+
hasChanges: boolean;
|
|
14
|
+
}
|
|
15
|
+
/**
|
|
16
|
+
* Generic version entry shape shared by pages and content items.
|
|
17
|
+
* Pages use `puckData`; content items use `data`.
|
|
18
|
+
*/
|
|
19
|
+
interface VersionEntry {
|
|
20
|
+
id: string;
|
|
21
|
+
timestamp: string;
|
|
22
|
+
puckData?: PuckData;
|
|
23
|
+
data?: PuckData;
|
|
24
|
+
}
|
|
25
|
+
|
|
26
|
+
interface VersionHistoryContextValue {
|
|
27
|
+
diff: PuckDataDiff | null;
|
|
28
|
+
isPreviewingHistory: boolean;
|
|
29
|
+
activeTab: 'components' | 'history';
|
|
30
|
+
openHistoryTab: () => void;
|
|
31
|
+
closeHistoryTab: () => void;
|
|
32
|
+
isHistoryTabActive: boolean;
|
|
33
|
+
versions: VersionEntry[];
|
|
34
|
+
isLoadingVersions: boolean;
|
|
35
|
+
selectedVersionId: string | null;
|
|
36
|
+
isApplying: boolean;
|
|
37
|
+
onVersionSelect: (id: string) => void;
|
|
38
|
+
onApply: () => void;
|
|
39
|
+
onDiscard: () => void;
|
|
40
|
+
}
|
|
41
|
+
interface VersionHistoryProviderProps {
|
|
42
|
+
diff: PuckDataDiff | null;
|
|
43
|
+
isPreviewingHistory: boolean;
|
|
44
|
+
versions: VersionEntry[];
|
|
45
|
+
isLoadingVersions: boolean;
|
|
46
|
+
selectedVersionId: string | null;
|
|
47
|
+
isApplying: boolean;
|
|
48
|
+
onVersionSelect: (id: string) => void;
|
|
49
|
+
onApply: () => void;
|
|
50
|
+
onDiscard: () => void;
|
|
51
|
+
/** Called when the History tab is first opened so versions can be fetched. */
|
|
52
|
+
onLoadVersions: () => Promise<void>;
|
|
53
|
+
children: React.ReactNode;
|
|
54
|
+
}
|
|
55
|
+
declare const VersionHistoryProvider: React.FC<VersionHistoryProviderProps>;
|
|
56
|
+
declare const useVersionHistoryContext: () => VersionHistoryContextValue;
|
|
57
|
+
|
|
58
|
+
/**
|
|
59
|
+
* Computes a structural diff between two PuckData snapshots.
|
|
60
|
+
*
|
|
61
|
+
* `versionData` is the historical snapshot; `currentData` is the live draft.
|
|
62
|
+
* Returns null when either input is null (no version selected, or editor not loaded).
|
|
63
|
+
*
|
|
64
|
+
* Semantics:
|
|
65
|
+
* - "added" → component exists in `currentData` but not in `versionData`
|
|
66
|
+
* - "removed" → component exists in `versionData` but not in `currentData`
|
|
67
|
+
* - "changed" → same id in both, but props differ
|
|
68
|
+
*/
|
|
69
|
+
declare function useVersionDiff(versionData: PuckData | null, currentData: PuckData | null): PuckDataDiff | null;
|
|
70
|
+
|
|
71
|
+
interface UseVersionHistoryPanelOptions {
|
|
72
|
+
versions: VersionEntry[];
|
|
73
|
+
loadVersions: () => Promise<void>;
|
|
74
|
+
/** The current live data shown in the editor (draft or published fallback). */
|
|
75
|
+
currentData: PuckData;
|
|
76
|
+
}
|
|
77
|
+
interface UseVersionHistoryPanelReturn {
|
|
78
|
+
isPanelOpen: boolean;
|
|
79
|
+
isPreviewingHistory: boolean;
|
|
80
|
+
isLoadingVersions: boolean;
|
|
81
|
+
selectedVersionId: string | null;
|
|
82
|
+
selectedVersion: VersionEntry | null;
|
|
83
|
+
/** When non-null, the editor should display this data instead of `currentData`. */
|
|
84
|
+
previewData: PuckData | null;
|
|
85
|
+
openPanel: () => Promise<void>;
|
|
86
|
+
closePanel: () => void;
|
|
87
|
+
selectVersion: (id: string) => void;
|
|
88
|
+
/** Clears the selected version but keeps the panel open. */
|
|
89
|
+
clearSelection: () => void;
|
|
90
|
+
/**
|
|
91
|
+
* Returns the PuckData of the selected version so the caller can call
|
|
92
|
+
* `saveDraft` with it. Closes the panel.
|
|
93
|
+
*/
|
|
94
|
+
applyVersion: () => PuckData | null;
|
|
95
|
+
}
|
|
96
|
+
declare function useVersionHistoryPanel({ versions, loadVersions, currentData, }: UseVersionHistoryPanelOptions): UseVersionHistoryPanelReturn;
|
|
97
|
+
|
|
98
|
+
interface VersionHistoryButtonProps {
|
|
99
|
+
disabled?: boolean;
|
|
100
|
+
}
|
|
101
|
+
/**
|
|
102
|
+
* Toggles the History tab in the Puck left sidebar.
|
|
103
|
+
* Reads active state from VersionHistoryContext — no onClick/isActive props needed.
|
|
104
|
+
*/
|
|
105
|
+
declare const VersionHistoryButton: React.FC<VersionHistoryButtonProps>;
|
|
106
|
+
|
|
107
|
+
/**
|
|
108
|
+
* Inline version history panel for Puck's left sidebar.
|
|
109
|
+
* Reads all state from VersionHistoryContext — no props needed.
|
|
110
|
+
*/
|
|
111
|
+
declare const VersionHistorySidebarContent: React.FC;
|
|
112
|
+
|
|
113
|
+
interface VersionCardProps {
|
|
114
|
+
version: VersionEntry;
|
|
115
|
+
isSelected: boolean;
|
|
116
|
+
isCurrent?: boolean;
|
|
117
|
+
onClick: (id: string) => void;
|
|
118
|
+
}
|
|
119
|
+
/**
|
|
120
|
+
* Renders a single version entry as a selectable card showing the timestamp.
|
|
121
|
+
*/
|
|
122
|
+
declare const VersionCard: React.FC<VersionCardProps>;
|
|
123
|
+
|
|
124
|
+
interface DiffSummaryProps {
|
|
125
|
+
diff: PuckDataDiff;
|
|
126
|
+
}
|
|
127
|
+
/**
|
|
128
|
+
* Renders a compact diff summary listing which components changed, were
|
|
129
|
+
* added, or were removed between the selected historical version and the
|
|
130
|
+
* current draft.
|
|
131
|
+
*/
|
|
132
|
+
declare const DiffSummary: React.FC<DiffSummaryProps>;
|
|
133
|
+
|
|
134
|
+
interface VersionPreviewBannerProps {
|
|
135
|
+
timestamp: string;
|
|
136
|
+
onApply: () => void;
|
|
137
|
+
onDiscard: () => void;
|
|
138
|
+
isApplying?: boolean;
|
|
139
|
+
}
|
|
140
|
+
/**
|
|
141
|
+
* Replaces the normal editor toolbar when previewing a historical version.
|
|
142
|
+
* Shows the version timestamp, an "Apply" button, and a "Discard" button.
|
|
143
|
+
* The normal Save / Publish / Revert to Published buttons must NOT be
|
|
144
|
+
* rendered alongside this component.
|
|
145
|
+
*/
|
|
146
|
+
declare const VersionPreviewBanner: React.FC<VersionPreviewBannerProps>;
|
|
147
|
+
|
|
148
|
+
interface VersionAwareFieldsPanelProps {
|
|
149
|
+
children: React.ReactNode;
|
|
150
|
+
isLoading: boolean;
|
|
151
|
+
}
|
|
152
|
+
/**
|
|
153
|
+
* Puck `fields` override that injects a "Changed props" banner above the
|
|
154
|
+
* fields panel whenever the editor is in version-preview mode and the
|
|
155
|
+
* currently selected component has properties that differ from the current draft.
|
|
156
|
+
*
|
|
157
|
+
* Usage:
|
|
158
|
+
* overrides={{ fields: VersionAwareFieldsPanel }}
|
|
159
|
+
*/
|
|
160
|
+
declare const VersionAwareFieldsPanel: React.FC<VersionAwareFieldsPanelProps>;
|
|
161
|
+
|
|
162
|
+
export { type ComponentDiff, DiffSummary, type PuckDataDiff, type UseVersionHistoryPanelReturn, VersionAwareFieldsPanel, VersionCard, type VersionEntry, VersionHistoryButton, VersionHistoryProvider, VersionHistorySidebarContent, VersionPreviewBanner, useVersionDiff, useVersionHistoryContext, useVersionHistoryPanel };
|