@measured/puck 0.16.0-canary.54b5a87 → 0.16.0-canary.958dc25
Sign up to get free protection for your applications and to get access to all the features.
- 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