@measured/puck 0.16.0-canary.7c79787 → 0.16.0-canary.a43914d
Sign up to get free protection for your applications and to get access to all the features.
- package/dist/{Config-VOJqVbHe.d.ts → Config-B7UadvMA.d.ts} +7 -1
- package/dist/index.css +73 -67
- package/dist/index.d.ts +33 -5
- package/dist/index.js +612 -518
- package/dist/rsc.d.ts +1 -1
- package/package.json +1 -1
@@ -166,6 +166,7 @@ type ComponentConfig<ComponentProps extends DefaultComponentProps = DefaultCompo
|
|
166
166
|
label?: string;
|
167
167
|
defaultProps?: DefaultProps;
|
168
168
|
fields?: Fields<ComponentProps>;
|
169
|
+
permissions?: Partial<Permissions>;
|
169
170
|
resolveFields?: (data: DataShape, params: {
|
170
171
|
changed: Partial<Record<keyof ComponentProps, boolean>>;
|
171
172
|
fields: Fields<ComponentProps>;
|
@@ -258,5 +259,10 @@ type AppState = {
|
|
258
259
|
data: Data;
|
259
260
|
ui: UiState;
|
260
261
|
};
|
262
|
+
type Permissions = {
|
263
|
+
drag: boolean;
|
264
|
+
duplicate: boolean;
|
265
|
+
delete: boolean;
|
266
|
+
} & Record<string, boolean>;
|
261
267
|
|
262
|
-
export type { AppState as A, BaseData 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,
|
268
|
+
export type { AppState as A, BaseData 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, Permissions as P, RootData as R, SelectField as S, TextField as T, UiState as U, Viewports as V, FieldProps as a, DropZoneProps as b, DefaultComponentProps as c, DefaultRootProps as d, RootDataWithProps as e, ComponentData as f, Content as g, PuckComponent as h, PuckContext as i, ComponentConfig as j, RootDataWithoutProps as k, ItemWithId as l, ArrayState as m, BaseField as n, TextareaField as o, RadioField as p, ArrayField as q, Adaptor as r, ExternalField as s, CustomField as t, Fields as u };
|
package/dist/index.css
CHANGED
@@ -136,6 +136,61 @@
|
|
136
136
|
|
137
137
|
/* styles.css */
|
138
138
|
|
139
|
+
/* css-module:/home/runner/work/puck/puck/packages/core/components/ActionBar/styles.module.css/#css-module-data */
|
140
|
+
._ActionBarComponent_16pc9_1 {
|
141
|
+
display: flex;
|
142
|
+
width: auto;
|
143
|
+
padding: 4px;
|
144
|
+
border-top-left-radius: 8px;
|
145
|
+
border-top-right-radius: 8px;
|
146
|
+
border-radius: 8px;
|
147
|
+
background: var(--puck-color-grey-01);
|
148
|
+
color: var(--puck-color-white);
|
149
|
+
font-family: var(--puck-font-family);
|
150
|
+
gap: 4px;
|
151
|
+
}
|
152
|
+
._ActionBarComponent-actionsLabel_16pc9_14 {
|
153
|
+
color: var(--puck-color-grey-08);
|
154
|
+
display: flex;
|
155
|
+
font-size: var(--puck-font-size-xxxs);
|
156
|
+
font-weight: 500;
|
157
|
+
justify-content: center;
|
158
|
+
align-items: center;
|
159
|
+
padding-left: 8px;
|
160
|
+
padding-right: 16px;
|
161
|
+
margin-right: 8px;
|
162
|
+
border-right: 0.5px solid var(--puck-color-grey-05);
|
163
|
+
text-overflow: ellipsis;
|
164
|
+
white-space: nowrap;
|
165
|
+
}
|
166
|
+
._ActionBarComponent-action_16pc9_14 {
|
167
|
+
background: transparent;
|
168
|
+
border: none;
|
169
|
+
color: var(--puck-color-grey-08);
|
170
|
+
cursor: pointer;
|
171
|
+
padding: 6px 8px;
|
172
|
+
border-radius: 4px;
|
173
|
+
overflow: hidden;
|
174
|
+
display: flex;
|
175
|
+
align-items: center;
|
176
|
+
justify-content: center;
|
177
|
+
transition: color 50ms ease-in;
|
178
|
+
}
|
179
|
+
._ActionBarComponent-action_16pc9_14:focus-visible {
|
180
|
+
outline: 2px solid var(--puck-color-azure-05);
|
181
|
+
outline-offset: -2px;
|
182
|
+
}
|
183
|
+
@media (hover: hover) and (pointer: fine) {
|
184
|
+
._ActionBarComponent-action_16pc9_14:hover {
|
185
|
+
color: var(--puck-color-azure-06);
|
186
|
+
transition: none;
|
187
|
+
}
|
188
|
+
}
|
189
|
+
._ActionBarComponent-action_16pc9_14:active {
|
190
|
+
color: var(--puck-color-azure-07);
|
191
|
+
transition: none;
|
192
|
+
}
|
193
|
+
|
139
194
|
/* css-module:/home/runner/work/puck/puck/packages/core/components/AutoField/styles.module.css/#css-module-data */
|
140
195
|
._Input_3pq3z_1 {
|
141
196
|
color: var(--puck-color-grey-04);
|
@@ -1032,25 +1087,25 @@ textarea._Input-input_3pq3z_47 {
|
|
1032
1087
|
}
|
1033
1088
|
|
1034
1089
|
/* css-module:/home/runner/work/puck/puck/packages/core/components/DraggableComponent/styles.module.css/#css-module-data */
|
1035
|
-
.
|
1090
|
+
._DraggableComponent_1bhad_1 {
|
1036
1091
|
pointer-events: auto;
|
1037
1092
|
--overlay-background: color-mix( in srgb, var(--puck-color-azure-08) 30%, transparent );
|
1038
1093
|
}
|
1039
|
-
._DraggableComponent--
|
1094
|
+
._DraggableComponent--isDragging_1bhad_11 {
|
1040
1095
|
background: color-mix(in srgb, var(--puck-color-azure-08) 10%, transparent);
|
1041
1096
|
overflow: hidden;
|
1042
1097
|
}
|
1043
|
-
._DraggableComponent-
|
1098
|
+
._DraggableComponent-contents_1bhad_16 {
|
1044
1099
|
position: relative;
|
1045
1100
|
pointer-events: none;
|
1046
1101
|
z-index: 0;
|
1047
1102
|
}
|
1048
|
-
._DraggableComponent-
|
1049
|
-
._DraggableComponent-
|
1103
|
+
._DraggableComponent-contents_1bhad_16::before,
|
1104
|
+
._DraggableComponent-contents_1bhad_16::after {
|
1050
1105
|
content: " ";
|
1051
1106
|
display: table;
|
1052
1107
|
}
|
1053
|
-
._DraggableComponent-
|
1108
|
+
._DraggableComponent-overlay_1bhad_29 {
|
1054
1109
|
cursor: pointer;
|
1055
1110
|
height: 100%;
|
1056
1111
|
width: 100%;
|
@@ -1061,13 +1116,13 @@ textarea._Input-input_3pq3z_47 {
|
|
1061
1116
|
box-sizing: border-box;
|
1062
1117
|
z-index: 1;
|
1063
1118
|
}
|
1064
|
-
.
|
1119
|
+
._DraggableComponent_1bhad_1:focus-visible > ._DraggableComponent-overlay_1bhad_29 {
|
1065
1120
|
outline: 1px solid var(--puck-color-azure-05);
|
1066
1121
|
}
|
1067
|
-
._DraggableComponent--
|
1122
|
+
._DraggableComponent--isDragging_1bhad_11 > ._DraggableComponent-overlay_1bhad_29 {
|
1068
1123
|
outline: 2px var(--puck-color-azure-09) solid !important;
|
1069
1124
|
}
|
1070
|
-
._DraggableComponent-
|
1125
|
+
._DraggableComponent-loadingOverlay_1bhad_49 {
|
1071
1126
|
background: var(--puck-color-white);
|
1072
1127
|
color: var(--puck-color-grey-03);
|
1073
1128
|
border-radius: 4px;
|
@@ -1082,91 +1137,42 @@ textarea._Input-input_3pq3z_47 {
|
|
1082
1137
|
opacity: 0.8;
|
1083
1138
|
z-index: 1;
|
1084
1139
|
}
|
1085
|
-
.
|
1140
|
+
._DraggableComponent_1bhad_1:hover:not(._DraggableComponent--isLocked_1bhad_65) > ._DraggableComponent-overlay_1bhad_29 {
|
1086
1141
|
background: var(--overlay-background);
|
1087
1142
|
pointer-events: none;
|
1088
1143
|
}
|
1089
|
-
._DraggableComponent--
|
1144
|
+
._DraggableComponent--forceHover_1bhad_71 > ._DraggableComponent-overlay_1bhad_29 {
|
1090
1145
|
background: var(--overlay-background);
|
1091
1146
|
pointer-events: none;
|
1092
1147
|
}
|
1093
|
-
.
|
1148
|
+
._DraggableComponent_1bhad_1:not(._DraggableComponent--isSelected_1bhad_76):hover > ._DraggableComponent-overlay_1bhad_29 {
|
1094
1149
|
outline: 2px var(--puck-color-azure-09) solid !important;
|
1095
1150
|
}
|
1096
|
-
._DraggableComponent--
|
1151
|
+
._DraggableComponent--indicativeHover_1bhad_81 > ._DraggableComponent-overlay_1bhad_29 {
|
1097
1152
|
pointer-events: none;
|
1098
1153
|
}
|
1099
|
-
.
|
1154
|
+
._DraggableComponent_1bhad_1:not(._DraggableComponent--isSelected_1bhad_76):has(._DraggableComponent_1bhad_1:hover > ._DraggableComponent-overlay_1bhad_29) > ._DraggableComponent-overlay_1bhad_29 {
|
1100
1155
|
display: none;
|
1101
1156
|
}
|
1102
|
-
._DraggableComponent--
|
1157
|
+
._DraggableComponent--isSelected_1bhad_76 > ._DraggableComponent-overlay_1bhad_29 {
|
1103
1158
|
outline: 2px var(--puck-color-azure-07) solid !important;
|
1104
1159
|
}
|
1105
|
-
._DraggableComponent--
|
1160
|
+
._DraggableComponent--isSelected_1bhad_76 > ._DraggableComponent-actionsOverlay_1bhad_97 {
|
1106
1161
|
display: block;
|
1107
1162
|
position: sticky;
|
1108
1163
|
z-index: 2;
|
1109
1164
|
}
|
1110
|
-
._DraggableComponent-
|
1165
|
+
._DraggableComponent-actions_1bhad_97 {
|
1111
1166
|
position: absolute;
|
1112
1167
|
width: auto;
|
1113
|
-
padding: 4px;
|
1114
|
-
border-top-left-radius: 8px;
|
1115
|
-
border-top-right-radius: 8px;
|
1116
|
-
border-radius: 8px;
|
1117
|
-
background: var(--puck-color-grey-01);
|
1118
|
-
color: var(--puck-color-white);
|
1119
1168
|
cursor: grab;
|
1120
1169
|
display: none;
|
1121
|
-
font-family: var(--puck-font-family);
|
1122
|
-
gap: 4px;
|
1123
1170
|
pointer-events: auto;
|
1124
1171
|
box-sizing: border-box;
|
1125
1172
|
transform-origin: right top;
|
1126
1173
|
}
|
1127
|
-
._DraggableComponent--
|
1128
|
-
display: flex;
|
1129
|
-
}
|
1130
|
-
._DraggableComponent-actionsLabel_59z7f_127 {
|
1131
|
-
color: var(--puck-color-grey-08);
|
1132
|
-
display: flex;
|
1133
|
-
font-size: var(--puck-font-size-xxxs);
|
1134
|
-
font-weight: 500;
|
1135
|
-
justify-content: center;
|
1136
|
-
align-items: center;
|
1137
|
-
padding-left: 8px;
|
1138
|
-
padding-right: 16px;
|
1139
|
-
margin-right: 8px;
|
1140
|
-
border-right: 0.5px solid var(--puck-color-grey-05);
|
1141
|
-
text-overflow: ellipsis;
|
1142
|
-
white-space: nowrap;
|
1143
|
-
}
|
1144
|
-
._DraggableComponent-action_59z7f_97 {
|
1145
|
-
background: transparent;
|
1146
|
-
border: none;
|
1147
|
-
color: var(--puck-color-grey-08);
|
1148
|
-
cursor: pointer;
|
1149
|
-
padding: 6px 8px;
|
1150
|
-
border-radius: 4px;
|
1151
|
-
overflow: hidden;
|
1174
|
+
._DraggableComponent--isSelected_1bhad_76 > ._DraggableComponent-actionsOverlay_1bhad_97 > ._DraggableComponent-actions_1bhad_97 {
|
1152
1175
|
display: flex;
|
1153
|
-
align-items: center;
|
1154
|
-
justify-content: center;
|
1155
|
-
transition: color 50ms ease-in;
|
1156
|
-
}
|
1157
|
-
._DraggableComponent-action_59z7f_97:focus-visible {
|
1158
|
-
outline: 2px solid var(--puck-color-azure-05);
|
1159
|
-
outline-offset: -2px;
|
1160
|
-
}
|
1161
|
-
@media (hover: hover) and (pointer: fine) {
|
1162
|
-
._DraggableComponent-action_59z7f_97:hover {
|
1163
|
-
color: var(--puck-color-azure-06);
|
1164
|
-
transition: none;
|
1165
|
-
}
|
1166
|
-
}
|
1167
|
-
._DraggableComponent-action_59z7f_97:active {
|
1168
|
-
color: var(--puck-color-azure-07);
|
1169
|
-
transition: none;
|
1170
1176
|
}
|
1171
1177
|
|
1172
1178
|
/* css-module:/home/runner/work/puck/puck/packages/core/components/DropZone/styles.module.css/#css-module-data */
|
package/dist/index.d.ts
CHANGED
@@ -1,7 +1,7 @@
|
|
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 DropZoneProps, V as Viewports, c as DefaultComponentProps, d as DefaultRootProps, M as MappedItem, R as RootData, e as RootDataWithProps, f as ComponentData } from './Config-
|
2
|
-
export {
|
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 DropZoneProps, P as Permissions, V as Viewports, c as DefaultComponentProps, d as DefaultRootProps, M as MappedItem, R as RootData, e as RootDataWithProps, f as ComponentData } from './Config-B7UadvMA.js';
|
2
|
+
export { r as Adaptor, q as ArrayField, m as ArrayState, B as BaseData, n as BaseField, j as ComponentConfig, g as Content, t as CustomField, s as ExternalField, E as ExternalFieldWithAdaptor, u as Fields, l as ItemWithId, N as NumberField, O as ObjectField, h as PuckComponent, i as PuckContext, p as RadioField, k as RootDataWithoutProps, S as SelectField, T as TextField, o as TextareaField } from './Config-B7UadvMA.js';
|
3
3
|
import * as react from 'react';
|
4
|
-
import { ReactNode, ReactElement,
|
4
|
+
import { ReactNode, ReactElement, SyntheticEvent, CSSProperties } from 'react';
|
5
5
|
import * as react_jsx_runtime from 'react/jsx-runtime';
|
6
6
|
import { DragStart, DragUpdate } from '@measured/dnd';
|
7
7
|
|
@@ -81,6 +81,10 @@ type Overrides = OverridesGeneric<{
|
|
81
81
|
actions: ReactNode;
|
82
82
|
children: ReactNode;
|
83
83
|
}>;
|
84
|
+
actionBar: RenderFunc<{
|
85
|
+
label?: string;
|
86
|
+
children: ReactNode;
|
87
|
+
}>;
|
84
88
|
headerActions: RenderFunc<{
|
85
89
|
children: ReactNode;
|
86
90
|
}>;
|
@@ -124,6 +128,23 @@ type Plugin = {
|
|
124
128
|
overrides: Partial<Overrides>;
|
125
129
|
};
|
126
130
|
|
131
|
+
declare const ActionBar: {
|
132
|
+
({ label, children, }: {
|
133
|
+
label?: string;
|
134
|
+
children?: ReactNode;
|
135
|
+
}): react_jsx_runtime.JSX.Element;
|
136
|
+
Action: ({ children, label, onClick, }: {
|
137
|
+
children: ReactNode;
|
138
|
+
label?: string;
|
139
|
+
onClick: (e: SyntheticEvent) => void;
|
140
|
+
}) => react_jsx_runtime.JSX.Element;
|
141
|
+
};
|
142
|
+
declare const Action: ({ children, label, onClick, }: {
|
143
|
+
children: ReactNode;
|
144
|
+
label?: string;
|
145
|
+
onClick: (e: SyntheticEvent) => void;
|
146
|
+
}) => react_jsx_runtime.JSX.Element;
|
147
|
+
|
127
148
|
declare const FieldLabel: ({ children, icon, label, el, readOnly, className, }: {
|
128
149
|
children?: ReactNode;
|
129
150
|
icon?: ReactNode;
|
@@ -266,7 +287,7 @@ type IframeConfig = {
|
|
266
287
|
enabled?: boolean;
|
267
288
|
};
|
268
289
|
|
269
|
-
declare function Puck<UserConfig extends Config = Config>({ children, config, data: initialData, ui: initialUi, onChange, onPublish, onAction, plugins, overrides, renderHeader, renderHeaderActions, headerTitle, headerPath, viewports, iframe, dnd, initialHistory, }: {
|
290
|
+
declare function Puck<UserConfig extends Config = Config>({ children, config, data: initialData, ui: initialUi, onChange, onPublish, onAction, permissions, plugins, overrides, renderHeader, renderHeaderActions, headerTitle, headerPath, viewports, iframe, dnd, initialHistory, }: {
|
270
291
|
children?: ReactNode;
|
271
292
|
config: UserConfig;
|
272
293
|
data: Partial<Data>;
|
@@ -274,6 +295,7 @@ declare function Puck<UserConfig extends Config = Config>({ children, config, da
|
|
274
295
|
onChange?: (data: Data) => void;
|
275
296
|
onPublish?: (data: Data) => void;
|
276
297
|
onAction?: OnAction;
|
298
|
+
permissions?: Partial<Permissions>;
|
277
299
|
plugins?: Plugin[];
|
278
300
|
overrides?: Partial<Overrides>;
|
279
301
|
renderHeader?: (props: {
|
@@ -334,6 +356,12 @@ declare const usePuck: () => {
|
|
334
356
|
appState: AppState;
|
335
357
|
config: Config;
|
336
358
|
dispatch: (action: PuckAction) => void;
|
359
|
+
getPermissions: (selectedItem?: ComponentData) => {
|
360
|
+
[x: string]: boolean | undefined;
|
361
|
+
drag?: boolean | undefined;
|
362
|
+
duplicate?: boolean | undefined;
|
363
|
+
delete?: boolean | undefined;
|
364
|
+
};
|
337
365
|
history: {
|
338
366
|
back: VoidFunction;
|
339
367
|
forward: VoidFunction;
|
@@ -350,4 +378,4 @@ declare const usePuck: () => {
|
|
350
378
|
}> | null;
|
351
379
|
};
|
352
380
|
|
353
|
-
export { AppState, AutoField, AutoFieldPrivate, Button, ComponentData, Config, Data, DefaultComponentProps, DefaultRootProps, Drawer, DropZone, DropZoneProvider, Field, FieldLabel, FieldLabelInternal, FieldProps, type FieldPropsInternal, type History, IconButton, MappedItem, type Plugin, Puck, type PuckAction, Render, RootData, RootDataWithProps, UiState, dropZoneContext, migrate, resolveAllData, transformProps, usePuck };
|
381
|
+
export { Action, ActionBar, AppState, AutoField, AutoFieldPrivate, Button, ComponentData, Config, Data, DefaultComponentProps, DefaultRootProps, Drawer, DropZone, DropZoneProvider, Field, FieldLabel, FieldLabelInternal, FieldProps, type FieldPropsInternal, type History, IconButton, MappedItem, Permissions, type Plugin, Puck, type PuckAction, Render, RootData, RootDataWithProps, UiState, dropZoneContext, migrate, resolveAllData, transformProps, usePuck };
|