@measured/puck 0.10.1-canary.cc20c52 → 0.11.0-canary.5881e1b

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.
Files changed (5) hide show
  1. package/README.md +218 -24
  2. package/dist/index.css +295 -180
  3. package/dist/index.d.ts +134 -55
  4. package/dist/index.js +31015 -1135
  5. package/package.json +1 -1
package/dist/index.d.ts CHANGED
@@ -8,100 +8,158 @@ type ItemSelector = {
8
8
  zone?: string;
9
9
  };
10
10
 
11
- type Adaptor<AdaptorParams = {}> = {
12
- name: string;
13
- fetchList: (adaptorParams?: AdaptorParams) => Promise<Record<string, any>[] | null>;
14
- };
15
- type WithId<T> = T & {
11
+ type WithPuckProps<Props> = Props & {
16
12
  id: string;
17
13
  };
18
- type Field<Props extends {
14
+ type BaseField = {
15
+ label?: string;
16
+ };
17
+ type TextField = BaseField & {
18
+ type: "text" | "number" | "textarea";
19
+ };
20
+ type SelectField = BaseField & {
21
+ type: "select" | "radio";
22
+ options: {
23
+ label: string;
24
+ value: string | number | boolean;
25
+ }[];
26
+ };
27
+ type ArrayField<Props extends {
19
28
  [key: string]: any;
20
29
  } = {
21
30
  [key: string]: any;
22
- }> = {
23
- type: "text" | "textarea" | "number" | "select" | "array" | "external" | "radio" | "custom";
24
- label?: string;
25
- adaptor?: Adaptor;
26
- adaptorParams?: object;
27
- arrayFields?: {
28
- [SubPropName in keyof Props]: Field<Props[SubPropName][0]>;
31
+ }> = BaseField & {
32
+ type: "array";
33
+ arrayFields: {
34
+ [SubPropName in keyof Props[0]]: Field<Props[0][SubPropName]>;
29
35
  };
30
- getItemSummary?: (item: Props, index?: number) => string;
31
- defaultItemProps?: Props;
32
- render?: (props: {
33
- field: Field;
36
+ defaultItemProps?: Props[0];
37
+ getItemSummary?: (item: Props[0], index?: number) => string;
38
+ };
39
+ type Adaptor<AdaptorParams = {}, TableShape extends Record<string, any> = {}, PropShape = TableShape> = {
40
+ name: string;
41
+ fetchList: (adaptorParams?: AdaptorParams) => Promise<TableShape[] | null>;
42
+ mapProp?: (value: TableShape) => PropShape;
43
+ };
44
+ type ExternalFieldWithAdaptor<Props extends {
45
+ [key: string]: any;
46
+ } = {
47
+ [key: string]: any;
48
+ }> = BaseField & {
49
+ type: "external";
50
+ placeholder?: string;
51
+ adaptor: Adaptor<any, any, Props>;
52
+ adaptorParams?: object;
53
+ getItemSummary: (item: Props, index?: number) => string;
54
+ };
55
+ type ExternalField<Props extends {
56
+ [key: string]: any;
57
+ } = {
58
+ [key: string]: any;
59
+ }> = BaseField & {
60
+ type: "external";
61
+ placeholder?: string;
62
+ fetchList: () => Promise<any[] | null>;
63
+ mapProp?: (value: any) => Props;
64
+ getItemSummary: (item: Props, index?: number) => string;
65
+ };
66
+ type CustomField<Props extends {
67
+ [key: string]: any;
68
+ } = {
69
+ [key: string]: any;
70
+ }> = BaseField & {
71
+ type: "custom";
72
+ render: (props: {
73
+ field: CustomField;
34
74
  name: string;
35
75
  value: any;
36
- onChange: (value: any) => void;
76
+ onChange: (value: Props) => void;
37
77
  readOnly?: boolean;
38
78
  }) => ReactElement;
39
- options?: {
40
- label: string;
41
- value: string | number | boolean;
42
- }[];
43
79
  };
80
+ type Field<Props extends {
81
+ [key: string]: any;
82
+ } = {
83
+ [key: string]: any;
84
+ }> = TextField | SelectField | ArrayField<Props> | ExternalField<Props> | ExternalFieldWithAdaptor<Props> | CustomField;
44
85
  type DefaultRootProps = {
45
- children: ReactNode;
46
- title: string;
47
- editMode: boolean;
86
+ title?: string;
48
87
  [key: string]: any;
49
88
  };
89
+ type DefaultRootRenderProps = {
90
+ editMode: boolean;
91
+ } & DefaultRootProps;
50
92
  type DefaultComponentProps = {
51
93
  [key: string]: any;
52
94
  editMode?: boolean;
53
95
  };
54
96
  type Fields<ComponentProps extends DefaultComponentProps = DefaultComponentProps> = {
55
- [PropName in keyof Omit<Required<ComponentProps>, "children" | "editMode">]: Field<ComponentProps[PropName][0]>;
97
+ [PropName in keyof Omit<Required<ComponentProps>, "children" | "editMode">]: Field<ComponentProps[PropName]>;
56
98
  };
57
99
  type Content<Props extends {
58
100
  [key: string]: any;
59
101
  } = {
60
102
  [key: string]: any;
61
- }> = MappedItem<Props>[];
62
- type ComponentConfig<ComponentProps extends DefaultComponentProps = DefaultComponentProps, DefaultProps = ComponentProps> = {
63
- render: (props: WithId<ComponentProps>) => ReactElement;
103
+ }> = ComponentData<Props>[];
104
+ type ComponentConfig<ComponentProps extends DefaultComponentProps = DefaultComponentProps, DefaultProps = ComponentProps, DataShape = ComponentData<ComponentProps>> = {
105
+ render: (props: WithPuckProps<ComponentProps>) => ReactElement;
64
106
  defaultProps?: DefaultProps;
65
107
  fields?: Fields<ComponentProps>;
108
+ resolveData?: (data: DataShape, params: {
109
+ changed: Partial<Record<keyof ComponentProps, boolean>>;
110
+ }) => Promise<Partial<ComponentDataWithOptionalProps<ComponentProps>>> | Partial<ComponentDataWithOptionalProps<ComponentProps>>;
111
+ };
112
+ type Category<ComponentName> = {
113
+ components?: ComponentName[];
114
+ title?: string;
115
+ visible?: boolean;
116
+ defaultExpanded?: boolean;
66
117
  };
67
118
  type Config<Props extends {
68
119
  [key: string]: any;
69
120
  } = {
70
121
  [key: string]: any;
71
- }, RootProps extends DefaultRootProps = DefaultRootProps> = {
122
+ }, RootProps extends DefaultRootProps = DefaultRootProps, CategoryName extends string = string> = {
123
+ categories?: Record<CategoryName, Category<keyof Props>> & {
124
+ other?: Category<Props>;
125
+ };
72
126
  components: {
73
- [ComponentName in keyof Props]: ComponentConfig<Props[ComponentName], Props[ComponentName]>;
127
+ [ComponentName in keyof Props]: Omit<ComponentConfig<Props[ComponentName], Props[ComponentName]>, "type">;
74
128
  };
75
- root?: ComponentConfig<RootProps & {
129
+ root?: Partial<ComponentConfig<RootProps & {
76
130
  children: ReactNode;
77
131
  }, Partial<RootProps & {
78
132
  children: ReactNode;
79
- }>>;
133
+ }>, RootDataWithProps<RootProps>>>;
80
134
  };
81
- type MappedItem<Props extends {
135
+ type BaseData<Props extends {
82
136
  [key: string]: any;
83
137
  } = {
84
138
  [key: string]: any;
85
139
  }> = {
140
+ readOnly?: Partial<Record<keyof Props, boolean>>;
141
+ };
142
+ type ComponentData<Props extends DefaultComponentProps = DefaultComponentProps> = {
86
143
  type: keyof Props;
87
- props: WithId<{
88
- [key: string]: any;
89
- }>;
144
+ props: WithPuckProps<Props>;
145
+ } & BaseData<Props>;
146
+ type RootDataWithProps<Props extends DefaultRootProps = DefaultRootProps> = {
147
+ props: Props;
90
148
  };
91
- type Data<Props extends {
149
+ type RootDataWithoutProps<Props extends DefaultRootProps = DefaultRootProps> = Props;
150
+ type RootData<Props extends DefaultRootProps = DefaultRootProps> = BaseData<Props> & Partial<RootDataWithProps<Props>> & Partial<RootDataWithoutProps<Props>>;
151
+ type ComponentDataWithOptionalProps<Props extends {
92
152
  [key: string]: any;
93
153
  } = {
94
154
  [key: string]: any;
95
- }, RootProps extends {
96
- title: string;
97
- [key: string]: any;
98
- } = {
99
- title: string;
100
- [key: string]: any;
101
- }> = {
102
- root: RootProps;
103
- content: Content<Props>;
104
- zones?: Record<string, Content<Props>>;
155
+ }> = Omit<ComponentData, "props"> & {
156
+ props: Partial<WithPuckProps<Props>>;
157
+ };
158
+ type MappedItem = ComponentData;
159
+ type Data<Props extends DefaultComponentProps = DefaultComponentProps, RootProps extends DefaultRootProps = DefaultRootProps> = {
160
+ root: RootData<RootProps>;
161
+ content: Content<WithPuckProps<Props>>;
162
+ zones?: Record<string, Content<WithPuckProps<Props>>>;
105
163
  };
106
164
  type ItemWithId = {
107
165
  _arrayId: string;
@@ -115,6 +173,12 @@ type UiState = {
115
173
  leftSideBarVisible: boolean;
116
174
  itemSelector: ItemSelector | null;
117
175
  arrayState: Record<string, ArrayState | undefined>;
176
+ componentList: Record<string, {
177
+ components?: string[];
178
+ title?: string;
179
+ visible?: boolean;
180
+ expanded?: boolean;
181
+ }>;
118
182
  };
119
183
  type AppState = {
120
184
  data: Data;
@@ -170,13 +234,13 @@ type RemoveAction = {
170
234
  index: number;
171
235
  zone: string;
172
236
  };
173
- type SetStateAction = {
237
+ type SetUiAction = {
174
238
  type: "setUi";
175
- ui: Partial<UiState>;
239
+ ui: Partial<UiState> | ((previous: UiState) => Partial<UiState>);
176
240
  };
177
241
  type SetDataAction = {
178
242
  type: "setData";
179
- data: Partial<Data>;
243
+ data: Partial<Data> | ((previous: Data) => Partial<Data>);
180
244
  };
181
245
  type SetAction = {
182
246
  type: "set";
@@ -192,7 +256,7 @@ type UnregisterZoneAction = {
192
256
  };
193
257
  type PuckAction = {
194
258
  recordHistory?: boolean;
195
- } & (ReorderAction | InsertAction | MoveAction | ReplaceAction | RemoveAction | DuplicateAction | SetAction | SetDataAction | SetStateAction | RegisterZoneAction | UnregisterZoneAction);
259
+ } & (ReorderAction | InsertAction | MoveAction | ReplaceAction | RemoveAction | DuplicateAction | SetAction | SetDataAction | SetUiAction | RegisterZoneAction | UnregisterZoneAction);
196
260
 
197
261
  type PathData = Record<string, {
198
262
  path: string[];
@@ -201,6 +265,7 @@ type PathData = Record<string, {
201
265
  type DropZoneContext = {
202
266
  data: Data;
203
267
  config: Config;
268
+ componentState?: Record<string, any>;
204
269
  itemSelector?: ItemSelector | null;
205
270
  setItemSelector?: (newIndex: ItemSelector | null) => void;
206
271
  dispatch?: (action: PuckAction) => void;
@@ -265,12 +330,17 @@ type Plugin = {
265
330
  }) => ReactElement<any>;
266
331
  };
267
332
 
268
- declare function Puck({ config, data: initialData, onChange, onPublish, plugins, renderHeader, renderHeaderActions, headerTitle, headerPath, }: {
333
+ declare function Puck({ config, data: initialData, onChange, onPublish, plugins, renderComponentList, renderHeader, renderHeaderActions, headerTitle, headerPath, }: {
269
334
  config: Config;
270
335
  data: Data;
271
336
  onChange?: (data: Data) => void;
272
337
  onPublish: (data: Data) => void;
273
338
  plugins?: Plugin[];
339
+ renderComponentList?: (props: {
340
+ children: ReactNode;
341
+ dispatch: (action: PuckAction) => void;
342
+ state: AppState;
343
+ }) => ReactElement;
274
344
  renderHeader?: (props: {
275
345
  children: ReactNode;
276
346
  dispatch: (action: PuckAction) => void;
@@ -289,10 +359,19 @@ declare function Render({ config, data }: {
289
359
  data: Data;
290
360
  }): react_jsx_runtime.JSX.Element;
291
361
 
292
- declare const FieldLabel: ({ children, icon, label, }: {
362
+ declare const resolveAllData: (data: Data, config: Config, onResolveStart?: ((item: MappedItem) => void) | undefined, onResolveEnd?: ((item: MappedItem) => void) | undefined) => Promise<{
363
+ root: RootDataWithProps<DefaultRootProps> | RootData<DefaultRootProps>;
364
+ content: any[];
365
+ zones: Record<string, MappedItem[]>;
366
+ }>;
367
+
368
+ declare const FieldLabel: ({ children, icon, label, el, readOnly, className, }: {
293
369
  children?: ReactNode;
294
370
  icon?: ReactNode;
295
371
  label: string;
372
+ el?: "div" | "label" | undefined;
373
+ readOnly?: boolean | undefined;
374
+ className?: string | undefined;
296
375
  }) => react_jsx_runtime.JSX.Element;
297
376
 
298
- export { Adaptor, AppState, ArrayState, Button, ComponentConfig, Config, Content, Data, DefaultComponentProps, DefaultRootProps, DropZone, DropZoneProvider, Field, FieldLabel, Fields, IconButton, ItemWithId, MappedItem, Puck, Render, UiState, dropZoneContext };
377
+ export { Adaptor, AppState, ArrayField, ArrayState, BaseData, BaseField, Button, ComponentConfig, ComponentData, Config, Content, CustomField, Data, DefaultComponentProps, DefaultRootProps, DefaultRootRenderProps, DropZone, DropZoneProvider, ExternalField, ExternalFieldWithAdaptor, Field, FieldLabel, Fields, IconButton, ItemWithId, MappedItem, Puck, Render, RootData, RootDataWithProps, RootDataWithoutProps, SelectField, TextField, UiState, dropZoneContext, resolveAllData };