@measured/puck 0.16.0-canary.4ee30eb → 0.16.0-canary.538cb05

Sign up to get free protection for your applications and to get access to all the features.
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, I as ItemSelector, c as DropZoneProps, V as Viewports, d as DefaultComponentProps, M as MappedItem, R as RootDataWithProps, e as RootData, f as ComponentData } from './Config-041c35a2.js';
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-041c35a2.js';
2
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-041c35a2.js';
3
- import * as react_jsx_runtime from 'react/jsx-runtime';
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, initialHistories, }: {
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
- initialHistories?: {
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: Partial<PuckHistory>;
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.head.querySelectorAll(styleSelector).forEach((style) => {
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(initialHistories) {
33319
+ function useHistoryStore(initialHistory) {
33285
33320
  var _a, _b;
33286
33321
  const [histories, setHistories] = (0, import_react27.useState)(
33287
- (_a = initialHistories == null ? void 0 : initialHistories.histories) != null ? _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 = initialHistories == null ? void 0 : initialHistories.index) != null ? _b : EMPTY_HISTORY_INDEX
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
- setHistories((prev) => {
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
- initialHistories
33806
+ initialHistory
33770
33807
  }) {
33771
33808
  var _a;
33772
- const historyStore = useHistoryStore(initialHistories);
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/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@measured/puck",
3
- "version": "0.16.0-canary.4ee30eb",
3
+ "version": "0.16.0-canary.538cb05",
4
4
  "author": "Measured Corporation Ltd <hello@measured.co>",
5
5
  "repository": "measuredco/puck",
6
6
  "bugs": "https://github.com/measuredco/puck/issues",