@measured/puck 0.14.0-canary.f975d87 → 0.14.0
Sign up to get free protection for your applications and to get access to all the features.
- package/README.md +8 -0
- package/dist/{Config-1444273f.d.ts → Config-09628f3c.d.ts} +43 -26
- package/dist/index.css +419 -266
- package/dist/index.d.ts +92 -51
- package/dist/index.js +1526 -723
- package/dist/rsc.d.ts +2 -2
- package/dist/rsc.js +4 -1
- package/package.json +4 -2
package/README.md
CHANGED
@@ -15,6 +15,9 @@ The visual editor for React.
|
|
15
15
|
<a aria-label="Join the community on Discord" href="https://discord.gg/D9e4E3MQVZ">
|
16
16
|
<img alt="" src="https://img.shields.io/badge/Join%20the%20Discord-blueviolet.svg?style=for-the-badge&logo=Discord&labelColor=000000&logoWidth=20">
|
17
17
|
</a>
|
18
|
+
<a aria-label="Browse the awesome-puck community repo" href="https://github.com/measuredco/awesome-puck">
|
19
|
+
<img alt="" src="https://img.shields.io/badge/repo-awesome--puck-fc60a8.svg?style=for-the-badge&labelColor=000000&logoWidth=20">
|
20
|
+
</a>
|
18
21
|
</p>
|
19
22
|
|
20
23
|
## Demo
|
@@ -96,6 +99,11 @@ Available recipes include:
|
|
96
99
|
- [**next**](https://github.com/measuredco/puck/tree/main/recipes/next): Next.js 13 app example, using App Router and static page generation
|
97
100
|
- [**remix**](https://github.com/measuredco/puck/tree/main/recipes/remix): Remix Run v2 app example, using dynamic routes at root-level
|
98
101
|
|
102
|
+
## Community
|
103
|
+
|
104
|
+
- [Discord server](https://discord.gg/D9e4E3MQVZ) for discussions
|
105
|
+
- [awesome-puck](https://github.com/measuredco/awesome-puck) community repo for plugins, custom fields & more
|
106
|
+
|
99
107
|
## Hire the Puck team
|
100
108
|
|
101
109
|
Puck is developed and maintained by **Measured**, a small group of industry veterans with decades of experience helping companies solve hard UI problems. We offer consultancy and development services for scale-ups, SMEs and enterprises.
|
@@ -1,5 +1,4 @@
|
|
1
|
-
import { CSSProperties,
|
2
|
-
import * as react_jsx_runtime from 'react/jsx-runtime';
|
1
|
+
import { CSSProperties, ReactNode, ReactElement } from 'react';
|
3
2
|
|
4
3
|
type ItemSelector = {
|
5
4
|
index: number;
|
@@ -12,7 +11,15 @@ type DropZoneProps = {
|
|
12
11
|
disallow?: string[];
|
13
12
|
style?: CSSProperties;
|
14
13
|
};
|
15
|
-
|
14
|
+
|
15
|
+
type iconTypes = "Smartphone" | "Monitor" | "Tablet";
|
16
|
+
type Viewport = {
|
17
|
+
width: number;
|
18
|
+
height?: number | "auto";
|
19
|
+
label?: string;
|
20
|
+
icon?: iconTypes | ReactNode;
|
21
|
+
};
|
22
|
+
type Viewports = Viewport[];
|
16
23
|
|
17
24
|
type WithPuckProps<Props> = Props & {
|
18
25
|
id: string;
|
@@ -55,6 +62,8 @@ type ArrayField<Props extends {
|
|
55
62
|
};
|
56
63
|
defaultItemProps?: Props[0];
|
57
64
|
getItemSummary?: (item: Props[0], index?: number) => string;
|
65
|
+
max?: number;
|
66
|
+
min?: number;
|
58
67
|
};
|
59
68
|
type ObjectField<Props extends {
|
60
69
|
[key: string]: any;
|
@@ -63,7 +72,7 @@ type ObjectField<Props extends {
|
|
63
72
|
}> = BaseField & {
|
64
73
|
type: "object";
|
65
74
|
objectFields: {
|
66
|
-
[SubPropName in keyof Props
|
75
|
+
[SubPropName in keyof Props]: Field<Props[SubPropName]>;
|
67
76
|
};
|
68
77
|
};
|
69
78
|
type Adaptor<AdaptorParams = {}, TableShape extends Record<string, any> = {}, PropShape = TableShape> = {
|
@@ -91,11 +100,15 @@ type ExternalField<Props extends {
|
|
91
100
|
placeholder?: string;
|
92
101
|
fetchList: (params: {
|
93
102
|
query: string;
|
103
|
+
filters: Record<string, any>;
|
94
104
|
}) => Promise<any[] | null>;
|
95
105
|
mapProp?: (value: any) => Props;
|
96
|
-
|
106
|
+
mapRow?: (value: any) => Record<string, string | number>;
|
107
|
+
getItemSummary?: (item: Props, index?: number) => string;
|
97
108
|
showSearch?: boolean;
|
98
109
|
initialQuery?: string;
|
110
|
+
filterFields?: Record<string, Field>;
|
111
|
+
initialFilters?: Record<string, any>;
|
99
112
|
};
|
100
113
|
type CustomField<Props extends {
|
101
114
|
[key: string]: any;
|
@@ -132,19 +145,26 @@ type Content<Props extends {
|
|
132
145
|
} = {
|
133
146
|
[key: string]: any;
|
134
147
|
}> = ComponentData<Props>[];
|
135
|
-
type PuckComponent<Props
|
148
|
+
type PuckComponent<Props> = (props: WithPuckProps<Props & {
|
136
149
|
puck: PuckContext;
|
137
150
|
}>) => JSX.Element;
|
138
151
|
type PuckContext = {
|
139
|
-
renderDropZone:
|
152
|
+
renderDropZone: React.FC<DropZoneProps>;
|
140
153
|
};
|
141
|
-
type ComponentConfig<ComponentProps extends DefaultComponentProps = DefaultComponentProps, DefaultProps = ComponentProps, DataShape = ComponentData<ComponentProps>> = {
|
154
|
+
type ComponentConfig<ComponentProps extends DefaultComponentProps = DefaultComponentProps, DefaultProps = ComponentProps, DataShape = Omit<ComponentData<ComponentProps>, "type">> = {
|
142
155
|
render: PuckComponent<ComponentProps>;
|
156
|
+
label?: string;
|
143
157
|
defaultProps?: DefaultProps;
|
144
158
|
fields?: Fields<ComponentProps>;
|
145
159
|
resolveData?: (data: DataShape, params: {
|
146
160
|
changed: Partial<Record<keyof ComponentProps, boolean>>;
|
147
|
-
}) => Promise<
|
161
|
+
}) => Promise<{
|
162
|
+
props?: Partial<ComponentProps>;
|
163
|
+
readOnly?: Partial<Record<keyof ComponentProps, boolean>>;
|
164
|
+
}> | {
|
165
|
+
props?: Partial<ComponentProps>;
|
166
|
+
readOnly?: Partial<Record<keyof ComponentProps, boolean>>;
|
167
|
+
};
|
148
168
|
};
|
149
169
|
type Category<ComponentName> = {
|
150
170
|
components?: ComponentName[];
|
@@ -152,22 +172,18 @@ type Category<ComponentName> = {
|
|
152
172
|
visible?: boolean;
|
153
173
|
defaultExpanded?: boolean;
|
154
174
|
};
|
155
|
-
type Config<Props extends {
|
156
|
-
[key: string]: any;
|
157
|
-
} = {
|
158
|
-
[key: string]: any;
|
159
|
-
}, RootProps extends DefaultRootProps = DefaultRootProps, CategoryName extends string = any> = {
|
175
|
+
type Config<Props extends Record<string, any> = Record<string, any>, RootProps extends DefaultRootProps = DefaultRootProps, CategoryName extends string = string> = {
|
160
176
|
categories?: Record<CategoryName, Category<keyof Props>> & {
|
161
|
-
other?: Category<Props>;
|
177
|
+
other?: Category<keyof Props>;
|
162
178
|
};
|
163
179
|
components: {
|
164
180
|
[ComponentName in keyof Props]: Omit<ComponentConfig<Props[ComponentName], Props[ComponentName]>, "type">;
|
165
181
|
};
|
166
182
|
root?: Partial<ComponentConfig<RootProps & {
|
167
|
-
children
|
183
|
+
children?: ReactNode;
|
168
184
|
}, Partial<RootProps & {
|
169
|
-
children
|
170
|
-
}>, RootDataWithProps
|
185
|
+
children?: ReactNode;
|
186
|
+
}>, RootDataWithProps>>;
|
171
187
|
};
|
172
188
|
type BaseData<Props extends {
|
173
189
|
[key: string]: any;
|
@@ -185,13 +201,6 @@ type RootDataWithProps<Props extends DefaultRootProps = DefaultRootProps> = {
|
|
185
201
|
};
|
186
202
|
type RootDataWithoutProps<Props extends DefaultRootProps = DefaultRootProps> = Props;
|
187
203
|
type RootData<Props extends DefaultRootProps = DefaultRootProps> = BaseData<Props> & Partial<RootDataWithProps<Props>> & Partial<RootDataWithoutProps<Props>>;
|
188
|
-
type ComponentDataWithOptionalProps<Props extends {
|
189
|
-
[key: string]: any;
|
190
|
-
} = {
|
191
|
-
[key: string]: any;
|
192
|
-
}> = Omit<ComponentData, "props"> & {
|
193
|
-
props: Partial<WithPuckProps<Props>>;
|
194
|
-
};
|
195
204
|
type MappedItem = ComponentData;
|
196
205
|
type Data<Props extends DefaultComponentProps = DefaultComponentProps, RootProps extends DefaultRootProps = DefaultRootProps> = {
|
197
206
|
root: RootData<RootProps>;
|
@@ -218,10 +227,18 @@ type UiState = {
|
|
218
227
|
expanded?: boolean;
|
219
228
|
}>;
|
220
229
|
isDragging: boolean;
|
230
|
+
viewports: {
|
231
|
+
current: {
|
232
|
+
width: number;
|
233
|
+
height: number | "auto";
|
234
|
+
};
|
235
|
+
controlsVisible: boolean;
|
236
|
+
options: Viewport[];
|
237
|
+
};
|
221
238
|
};
|
222
239
|
type AppState = {
|
223
240
|
data: Data;
|
224
241
|
ui: UiState;
|
225
242
|
};
|
226
243
|
|
227
|
-
export { AppState as A, BaseField as B, Config as C, Data as D, ExternalFieldWithAdaptor as E, Field as F, ItemSelector as I, MappedItem as M, NumberField as N, ObjectField as O, PuckComponent as P, RootDataWithProps as R, SelectField as S, TextField as T, UiState as U,
|
244
|
+
export { AppState as A, BaseField as B, Config as C, Data as D, ExternalFieldWithAdaptor as E, Field as F, ItemSelector as I, MappedItem as M, NumberField as N, ObjectField as O, PuckComponent as P, RootDataWithProps as R, SelectField as S, TextField as T, UiState as U, Viewports as V, DefaultRootProps as a, DropZoneProps as b, DefaultComponentProps as c, RootData as d, ComponentData as e, TextareaField as f, RadioField as g, ArrayField as h, Adaptor as i, ExternalField as j, CustomField as k, Fields as l, Content as m, PuckContext as n, ComponentConfig as o, BaseData as p, RootDataWithoutProps as q, ItemWithId as r, ArrayState as s };
|