@measured/puck 0.16.0-canary.54b5a87 → 0.16.0-canary.958dc25
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/{Config-041c35a2.d.ts → Config-ab1c145c.d.ts} +1 -1
- package/dist/index.d.ts +95 -89
- package/dist/index.js +61 -14
- package/dist/rsc.d.ts +1 -1
- package/package.json +1 -1
package/dist/index.d.ts
CHANGED
@@ -1,8 +1,8 @@
|
|
1
|
-
import { U as UiState, D as Data, A as AppState, F as Field, a as FieldProps, C as Config, b as DefaultRootProps,
|
2
|
-
export { q as Adaptor, p as ArrayField, l as ArrayState, B as BaseData, m as BaseField, i as ComponentConfig, g as Content, s as CustomField, r as ExternalField, E as ExternalFieldWithAdaptor, t as Fields, k as ItemWithId, N as NumberField, O as ObjectField, P as PuckComponent, h as PuckContext, o as RadioField, j as RootDataWithoutProps, S as SelectField, T as TextField, n as TextareaField } from './Config-
|
3
|
-
import * as react_jsx_runtime from 'react/jsx-runtime';
|
1
|
+
import { U as UiState, D as Data, A as AppState, I as ItemSelector, F as Field, a as FieldProps, C as Config, b as DefaultRootProps, c as DropZoneProps, V as Viewports, d as DefaultComponentProps, M as MappedItem, R as RootDataWithProps, e as RootData, f as ComponentData } from './Config-ab1c145c.js';
|
2
|
+
export { q as Adaptor, p as ArrayField, l as ArrayState, B as BaseData, m as BaseField, i as ComponentConfig, g as Content, s as CustomField, r as ExternalField, E as ExternalFieldWithAdaptor, t as Fields, k as ItemWithId, N as NumberField, O as ObjectField, P as PuckComponent, h as PuckContext, o as RadioField, j as RootDataWithoutProps, S as SelectField, T as TextField, n as TextareaField } from './Config-ab1c145c.js';
|
4
3
|
import * as react from 'react';
|
5
4
|
import { ReactNode, ReactElement, CSSProperties, SyntheticEvent } from 'react';
|
5
|
+
import * as react_jsx_runtime from 'react/jsx-runtime';
|
6
6
|
import { DragStart, DragUpdate } from '@measured/dnd';
|
7
7
|
|
8
8
|
type InsertAction = {
|
@@ -64,6 +64,65 @@ type PuckAction = {
|
|
64
64
|
recordHistory?: boolean;
|
65
65
|
} & (ReorderAction | InsertAction | MoveAction | ReplaceAction | RemoveAction | DuplicateAction | SetAction | SetDataAction | SetUiAction | RegisterZoneAction | UnregisterZoneAction);
|
66
66
|
|
67
|
+
type RenderFunc<Props extends {
|
68
|
+
[key: string]: any;
|
69
|
+
} = {
|
70
|
+
children: ReactNode;
|
71
|
+
}> = (props: Props) => ReactElement;
|
72
|
+
declare const overrideKeys: readonly ["header", "headerActions", "fields", "fieldLabel", "components", "componentItem", "outline", "puck", "preview"];
|
73
|
+
type OverrideKey = (typeof overrideKeys)[number];
|
74
|
+
type OverridesGeneric<Shape extends {
|
75
|
+
[key in OverrideKey]: any;
|
76
|
+
}> = Shape;
|
77
|
+
type Overrides = OverridesGeneric<{
|
78
|
+
fieldTypes: Partial<FieldRenderFunctions>;
|
79
|
+
header: RenderFunc<{
|
80
|
+
actions: ReactNode;
|
81
|
+
children: ReactNode;
|
82
|
+
}>;
|
83
|
+
headerActions: RenderFunc<{
|
84
|
+
children: ReactNode;
|
85
|
+
}>;
|
86
|
+
preview: RenderFunc;
|
87
|
+
fields: RenderFunc<{
|
88
|
+
children: ReactNode;
|
89
|
+
isLoading: boolean;
|
90
|
+
itemSelector?: ItemSelector | null;
|
91
|
+
}>;
|
92
|
+
fieldLabel: RenderFunc<{
|
93
|
+
children?: ReactNode;
|
94
|
+
icon?: ReactNode;
|
95
|
+
label: string;
|
96
|
+
el?: "label" | "div";
|
97
|
+
readOnly?: boolean;
|
98
|
+
className?: string;
|
99
|
+
}>;
|
100
|
+
components: RenderFunc;
|
101
|
+
componentItem: RenderFunc<{
|
102
|
+
children: ReactNode;
|
103
|
+
name: string;
|
104
|
+
}>;
|
105
|
+
outline: RenderFunc;
|
106
|
+
puck: RenderFunc;
|
107
|
+
}>;
|
108
|
+
type FieldRenderFunctions = Omit<{
|
109
|
+
[Type in Field["type"]]: React.FunctionComponent<FieldProps<Extract<Field, {
|
110
|
+
type: Type;
|
111
|
+
}>> & {
|
112
|
+
children: ReactNode;
|
113
|
+
name: string;
|
114
|
+
}>;
|
115
|
+
}, "custom"> & {
|
116
|
+
[key: string]: React.FunctionComponent<FieldProps<any> & {
|
117
|
+
children: ReactNode;
|
118
|
+
name: string;
|
119
|
+
}>;
|
120
|
+
};
|
121
|
+
|
122
|
+
type Plugin = {
|
123
|
+
overrides: Partial<Overrides>;
|
124
|
+
};
|
125
|
+
|
67
126
|
declare const FieldLabel: ({ children, icon, label, el, readOnly, className, }: {
|
68
127
|
children?: ReactNode;
|
69
128
|
icon?: ReactNode;
|
@@ -129,6 +188,25 @@ declare const Drawer: {
|
|
129
188
|
}) => react_jsx_runtime.JSX.Element;
|
130
189
|
};
|
131
190
|
|
191
|
+
type History<D = any> = {
|
192
|
+
id: string;
|
193
|
+
data: D;
|
194
|
+
};
|
195
|
+
type HistoryStore<D = any> = {
|
196
|
+
index: number;
|
197
|
+
hasPast: boolean;
|
198
|
+
hasFuture: boolean;
|
199
|
+
histories: History<D>[];
|
200
|
+
record: (data: D) => void;
|
201
|
+
back: VoidFunction;
|
202
|
+
forward: VoidFunction;
|
203
|
+
currentHistory: History;
|
204
|
+
nextHistory: History<D> | null;
|
205
|
+
prevHistory: History<D> | null;
|
206
|
+
setHistories: (histories: History[]) => void;
|
207
|
+
setHistoryIndex: (index: number) => void;
|
208
|
+
};
|
209
|
+
|
132
210
|
type PathData = Record<string, {
|
133
211
|
path: string[];
|
134
212
|
label: string;
|
@@ -181,87 +259,11 @@ declare const IconButton: ({ children, href, onClick, variant, type, disabled, t
|
|
181
259
|
title: string;
|
182
260
|
}) => react_jsx_runtime.JSX.Element;
|
183
261
|
|
184
|
-
type RenderFunc<Props extends {
|
185
|
-
[key: string]: any;
|
186
|
-
} = {
|
187
|
-
children: ReactNode;
|
188
|
-
}> = (props: Props) => ReactElement;
|
189
|
-
declare const overrideKeys: readonly ["header", "headerActions", "fields", "fieldLabel", "components", "componentItem", "outline", "puck", "preview"];
|
190
|
-
type OverrideKey = (typeof overrideKeys)[number];
|
191
|
-
type OverridesGeneric<Shape extends {
|
192
|
-
[key in OverrideKey]: any;
|
193
|
-
}> = Shape;
|
194
|
-
type Overrides = OverridesGeneric<{
|
195
|
-
fieldTypes: Partial<FieldRenderFunctions>;
|
196
|
-
header: RenderFunc<{
|
197
|
-
actions: ReactNode;
|
198
|
-
children: ReactNode;
|
199
|
-
}>;
|
200
|
-
headerActions: RenderFunc<{
|
201
|
-
children: ReactNode;
|
202
|
-
}>;
|
203
|
-
preview: RenderFunc;
|
204
|
-
fields: RenderFunc<{
|
205
|
-
children: ReactNode;
|
206
|
-
isLoading: boolean;
|
207
|
-
itemSelector?: ItemSelector | null;
|
208
|
-
}>;
|
209
|
-
fieldLabel: RenderFunc<{
|
210
|
-
children?: ReactNode;
|
211
|
-
icon?: ReactNode;
|
212
|
-
label: string;
|
213
|
-
el?: "label" | "div";
|
214
|
-
readOnly?: boolean;
|
215
|
-
className?: string;
|
216
|
-
}>;
|
217
|
-
components: RenderFunc;
|
218
|
-
componentItem: RenderFunc<{
|
219
|
-
children: ReactNode;
|
220
|
-
name: string;
|
221
|
-
}>;
|
222
|
-
outline: RenderFunc;
|
223
|
-
puck: RenderFunc;
|
224
|
-
}>;
|
225
|
-
type FieldRenderFunctions = Omit<{
|
226
|
-
[Type in Field["type"]]: React.FunctionComponent<FieldProps<Extract<Field, {
|
227
|
-
type: Type;
|
228
|
-
}>> & {
|
229
|
-
children: ReactNode;
|
230
|
-
name: string;
|
231
|
-
}>;
|
232
|
-
}, "custom"> & {
|
233
|
-
[key: string]: React.FunctionComponent<FieldProps<any> & {
|
234
|
-
children: ReactNode;
|
235
|
-
name: string;
|
236
|
-
}>;
|
237
|
-
};
|
238
|
-
|
239
|
-
type Plugin = {
|
240
|
-
overrides: Partial<Overrides>;
|
241
|
-
};
|
242
|
-
|
243
|
-
type History<D = any> = {
|
244
|
-
id: string;
|
245
|
-
data: D;
|
246
|
-
};
|
247
|
-
type HistoryStore<D = any> = {
|
248
|
-
index: number;
|
249
|
-
currentHistory: History;
|
250
|
-
hasPast: boolean;
|
251
|
-
hasFuture: boolean;
|
252
|
-
record: (data: D) => void;
|
253
|
-
back: VoidFunction;
|
254
|
-
forward: VoidFunction;
|
255
|
-
nextHistory: History<D> | null;
|
256
|
-
prevHistory: History<D> | null;
|
257
|
-
histories: History<D>[];
|
258
|
-
};
|
259
|
-
|
260
262
|
type IframeConfig = {
|
261
263
|
enabled?: boolean;
|
262
264
|
};
|
263
265
|
|
264
|
-
declare function Puck<UserConfig extends Config = Config>({ children, config, data: initialData, ui: initialUi, onChange, onPublish, plugins, overrides, renderHeader, renderHeaderActions, headerTitle, headerPath, viewports, iframe, dnd,
|
266
|
+
declare function Puck<UserConfig extends Config = Config>({ children, config, data: initialData, ui: initialUi, onChange, onPublish, plugins, overrides, renderHeader, renderHeaderActions, headerTitle, headerPath, viewports, iframe, dnd, initialHistory, }: {
|
265
267
|
children?: ReactNode;
|
266
268
|
config: UserConfig;
|
267
269
|
data: Partial<Data>;
|
@@ -286,7 +288,7 @@ declare function Puck<UserConfig extends Config = Config>({ children, config, da
|
|
286
288
|
dnd?: {
|
287
289
|
disableAutoScroll?: boolean;
|
288
290
|
};
|
289
|
-
|
291
|
+
initialHistory?: {
|
290
292
|
histories: History<any>[];
|
291
293
|
index: number;
|
292
294
|
};
|
@@ -324,20 +326,24 @@ declare function resolveAllData(data: Partial<Data>, config: Config, onResolveSt
|
|
324
326
|
zones: Record<string, MappedItem[]>;
|
325
327
|
}>;
|
326
328
|
|
327
|
-
type PuckHistory = {
|
328
|
-
back: VoidFunction;
|
329
|
-
forward: VoidFunction;
|
330
|
-
historyStore: HistoryStore;
|
331
|
-
};
|
332
|
-
|
333
329
|
declare const usePuck: () => {
|
334
330
|
appState: AppState;
|
335
331
|
config: Config<Record<string, any>, DefaultRootProps, string>;
|
336
332
|
dispatch: (action: PuckAction) => void;
|
337
|
-
history:
|
333
|
+
history: {
|
334
|
+
back: VoidFunction;
|
335
|
+
forward: VoidFunction;
|
336
|
+
setHistories: (histories: History<any>[]) => void;
|
337
|
+
setHistoryIndex: (index: number) => void;
|
338
|
+
hasPast: boolean;
|
339
|
+
hasFuture: boolean;
|
340
|
+
histories: History<any>[];
|
341
|
+
index: number;
|
342
|
+
historyStore: HistoryStore<any> | undefined;
|
343
|
+
};
|
338
344
|
selectedItem: ComponentData<DefaultComponentProps & {
|
339
345
|
id: string;
|
340
346
|
}> | null;
|
341
347
|
};
|
342
348
|
|
343
|
-
export { AppState, AutoField, AutoFieldPrivate, Button, ComponentData, Config, Data, DefaultComponentProps, DefaultRootProps, Drawer, DropZone, DropZoneProvider, Field, FieldLabel, FieldLabelInternal, FieldProps, FieldPropsInternal, IconButton, MappedItem, Puck, PuckAction, Render, RootData, RootDataWithProps, UiState, dropZoneContext, migrate, resolveAllData, transformProps, usePuck };
|
349
|
+
export { AppState, AutoField, AutoFieldPrivate, Button, ComponentData, Config, Data, DefaultComponentProps, DefaultRootProps, Drawer, DropZone, DropZoneProvider, Field, FieldLabel, FieldLabelInternal, FieldProps, FieldPropsInternal, History, IconButton, MappedItem, Plugin, Puck, PuckAction, Render, RootData, RootDataWithProps, UiState, dropZoneContext, migrate, resolveAllData, transformProps, usePuck };
|
package/dist/index.js
CHANGED
@@ -29167,6 +29167,9 @@ init_react_import();
|
|
29167
29167
|
// types/Config.tsx
|
29168
29168
|
init_react_import();
|
29169
29169
|
|
29170
|
+
// types/Plugin.ts
|
29171
|
+
init_react_import();
|
29172
|
+
|
29170
29173
|
// types/Fields.ts
|
29171
29174
|
init_react_import();
|
29172
29175
|
|
@@ -32741,7 +32744,7 @@ var import_jsx_runtime30 = require("react/jsx-runtime");
|
|
32741
32744
|
var styleSelector = 'style, link[rel="stylesheet"]';
|
32742
32745
|
var collectStyles = (doc) => {
|
32743
32746
|
const collected = [];
|
32744
|
-
doc.
|
32747
|
+
doc.querySelectorAll(styleSelector).forEach((style) => {
|
32745
32748
|
collected.push(style);
|
32746
32749
|
});
|
32747
32750
|
return collected;
|
@@ -32765,6 +32768,14 @@ var getStyles = (styleSheet) => {
|
|
32765
32768
|
}
|
32766
32769
|
return "";
|
32767
32770
|
};
|
32771
|
+
var syncAttributes = (sourceElement, targetElement) => {
|
32772
|
+
const attributes = sourceElement.attributes;
|
32773
|
+
if ((attributes == null ? void 0 : attributes.length) > 0) {
|
32774
|
+
Array.from(attributes).forEach((attribute) => {
|
32775
|
+
targetElement.setAttribute(attribute.name, attribute.value);
|
32776
|
+
});
|
32777
|
+
}
|
32778
|
+
};
|
32768
32779
|
var defer = (fn) => setTimeout(fn, 0);
|
32769
32780
|
var CopyHostStyles = ({
|
32770
32781
|
children,
|
@@ -32882,6 +32893,10 @@ var CopyHostStyles = ({
|
|
32882
32893
|
const collectedStyles = collectStyles(parentDocument);
|
32883
32894
|
const hrefs = [];
|
32884
32895
|
let stylesLoaded = 0;
|
32896
|
+
const parentHtml = parentDocument.getElementsByTagName("html")[0];
|
32897
|
+
syncAttributes(parentHtml, doc.documentElement);
|
32898
|
+
const parentBody = parentDocument.getElementsByTagName("body")[0];
|
32899
|
+
syncAttributes(parentBody, doc.body);
|
32885
32900
|
Promise.all(
|
32886
32901
|
collectedStyles.map((styleNode, i) => __async(void 0, null, function* () {
|
32887
32902
|
if (styleNode.nodeName === "LINK") {
|
@@ -33266,13 +33281,33 @@ function usePuckHistory({
|
|
33266
33281
|
historyStore.forward();
|
33267
33282
|
}
|
33268
33283
|
};
|
33284
|
+
const setHistories = (histories) => {
|
33285
|
+
var _a;
|
33286
|
+
dispatch({
|
33287
|
+
type: "set",
|
33288
|
+
state: ((_a = histories[histories.length - 1]) == null ? void 0 : _a.data) || initialAppState
|
33289
|
+
});
|
33290
|
+
historyStore.setHistories(histories);
|
33291
|
+
};
|
33292
|
+
const setHistoryIndex = (index) => {
|
33293
|
+
var _a;
|
33294
|
+
if (historyStore.histories.length > index) {
|
33295
|
+
dispatch({
|
33296
|
+
type: "set",
|
33297
|
+
state: ((_a = historyStore.histories[index]) == null ? void 0 : _a.data) || initialAppState
|
33298
|
+
});
|
33299
|
+
historyStore.setHistoryIndex(index);
|
33300
|
+
}
|
33301
|
+
};
|
33269
33302
|
(0, import_react_hotkeys_hook.useHotkeys)("meta+z", back, { preventDefault: true });
|
33270
33303
|
(0, import_react_hotkeys_hook.useHotkeys)("meta+shift+z", forward, { preventDefault: true });
|
33271
33304
|
(0, import_react_hotkeys_hook.useHotkeys)("meta+y", forward, { preventDefault: true });
|
33272
33305
|
return {
|
33273
33306
|
back,
|
33274
33307
|
forward,
|
33275
|
-
historyStore
|
33308
|
+
historyStore,
|
33309
|
+
setHistories,
|
33310
|
+
setHistoryIndex
|
33276
33311
|
};
|
33277
33312
|
}
|
33278
33313
|
|
@@ -33281,13 +33316,17 @@ init_react_import();
|
|
33281
33316
|
var import_react27 = require("react");
|
33282
33317
|
var import_use_debounce3 = require("use-debounce");
|
33283
33318
|
var EMPTY_HISTORY_INDEX = -1;
|
33284
|
-
function useHistoryStore(
|
33319
|
+
function useHistoryStore(initialHistory) {
|
33285
33320
|
var _a, _b;
|
33286
33321
|
const [histories, setHistories] = (0, import_react27.useState)(
|
33287
|
-
(_a =
|
33322
|
+
(_a = initialHistory == null ? void 0 : initialHistory.histories) != null ? _a : []
|
33288
33323
|
);
|
33324
|
+
const updateHistories = (histories2) => {
|
33325
|
+
setHistories(histories2);
|
33326
|
+
setIndex(histories2.length - 1);
|
33327
|
+
};
|
33289
33328
|
const [index, setIndex] = (0, import_react27.useState)(
|
33290
|
-
(_b =
|
33329
|
+
(_b = initialHistory == null ? void 0 : initialHistory.index) != null ? _b : EMPTY_HISTORY_INDEX
|
33291
33330
|
);
|
33292
33331
|
const hasPast = index > EMPTY_HISTORY_INDEX;
|
33293
33332
|
const hasFuture = index < histories.length - 1;
|
@@ -33299,11 +33338,7 @@ function useHistoryStore(initialHistories) {
|
|
33299
33338
|
data,
|
33300
33339
|
id: generateId("history")
|
33301
33340
|
};
|
33302
|
-
|
33303
|
-
const newVal = [...prev.slice(0, index + 1), history];
|
33304
|
-
setIndex(newVal.length - 1);
|
33305
|
-
return newVal;
|
33306
|
-
});
|
33341
|
+
updateHistories([...histories.slice(0, index + 1), history]);
|
33307
33342
|
}, 250);
|
33308
33343
|
const back = () => {
|
33309
33344
|
setIndex(index - 1);
|
@@ -33321,7 +33356,9 @@ function useHistoryStore(initialHistories) {
|
|
33321
33356
|
forward,
|
33322
33357
|
nextHistory,
|
33323
33358
|
prevHistory,
|
33324
|
-
histories
|
33359
|
+
histories,
|
33360
|
+
setHistories: updateHistories,
|
33361
|
+
setHistoryIndex: setIndex
|
33325
33362
|
};
|
33326
33363
|
}
|
33327
33364
|
|
@@ -33766,10 +33803,10 @@ function Puck({
|
|
33766
33803
|
enabled: true
|
33767
33804
|
},
|
33768
33805
|
dnd,
|
33769
|
-
|
33806
|
+
initialHistory
|
33770
33807
|
}) {
|
33771
33808
|
var _a;
|
33772
|
-
const historyStore = useHistoryStore(
|
33809
|
+
const historyStore = useHistoryStore(initialHistory);
|
33773
33810
|
const [reducer] = (0, import_react30.useState)(
|
33774
33811
|
() => createReducer({ config, record: historyStore.record })
|
33775
33812
|
);
|
@@ -34325,7 +34362,17 @@ var usePuck = () => {
|
|
34325
34362
|
appState,
|
34326
34363
|
config,
|
34327
34364
|
dispatch,
|
34328
|
-
history
|
34365
|
+
history: {
|
34366
|
+
back: history.back,
|
34367
|
+
forward: history.forward,
|
34368
|
+
setHistories: history.setHistories,
|
34369
|
+
setHistoryIndex: history.setHistoryIndex,
|
34370
|
+
hasPast: history.historyStore.hasPast,
|
34371
|
+
hasFuture: history.historyStore.hasFuture,
|
34372
|
+
histories: history.historyStore.histories,
|
34373
|
+
index: history.historyStore.index,
|
34374
|
+
historyStore: history.historyStore
|
34375
|
+
},
|
34329
34376
|
selectedItem: selectedItem || null
|
34330
34377
|
};
|
34331
34378
|
};
|
package/dist/rsc.d.ts
CHANGED
@@ -1,5 +1,5 @@
|
|
1
1
|
import * as react_jsx_runtime from 'react/jsx-runtime';
|
2
|
-
import { C as Config, D as Data } from './Config-
|
2
|
+
import { C as Config, D as Data } from './Config-ab1c145c.js';
|
3
3
|
import 'react';
|
4
4
|
|
5
5
|
declare function Render<UserConfig extends Config = Config>({ config, data, }: {
|
package/package.json
CHANGED