@measured/puck 0.16.0-canary.3298831 → 0.16.0-canary.39d63e0

Sign up to get free protection for your applications and to get access to all the features.
@@ -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, PuckComponent 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, PuckContext as h, ComponentConfig as i, RootDataWithoutProps as j, ItemWithId as k, ArrayState as l, BaseField as m, TextareaField as n, RadioField as o, ArrayField as p, Adaptor as q, ExternalField as r, CustomField as s, Fields as t };
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
- ._DraggableComponent_59z7f_1 {
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--isDragging_59z7f_11 {
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-contents_59z7f_16 {
1098
+ ._DraggableComponent-contents_1bhad_16 {
1044
1099
  position: relative;
1045
1100
  pointer-events: none;
1046
1101
  z-index: 0;
1047
1102
  }
1048
- ._DraggableComponent-contents_59z7f_16::before,
1049
- ._DraggableComponent-contents_59z7f_16::after {
1103
+ ._DraggableComponent-contents_1bhad_16::before,
1104
+ ._DraggableComponent-contents_1bhad_16::after {
1050
1105
  content: " ";
1051
1106
  display: table;
1052
1107
  }
1053
- ._DraggableComponent-overlay_59z7f_29 {
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
- ._DraggableComponent_59z7f_1:focus-visible > ._DraggableComponent-overlay_59z7f_29 {
1119
+ ._DraggableComponent_1bhad_1:focus-visible > ._DraggableComponent-overlay_1bhad_29 {
1065
1120
  outline: 1px solid var(--puck-color-azure-05);
1066
1121
  }
1067
- ._DraggableComponent--isDragging_59z7f_11 > ._DraggableComponent-overlay_59z7f_29 {
1122
+ ._DraggableComponent--isDragging_1bhad_11 > ._DraggableComponent-overlay_1bhad_29 {
1068
1123
  outline: 2px var(--puck-color-azure-09) solid !important;
1069
1124
  }
1070
- ._DraggableComponent-loadingOverlay_59z7f_49 {
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
- ._DraggableComponent_59z7f_1:hover:not(._DraggableComponent--isLocked_59z7f_65) > ._DraggableComponent-overlay_59z7f_29 {
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--forceHover_59z7f_71 > ._DraggableComponent-overlay_59z7f_29 {
1144
+ ._DraggableComponent--forceHover_1bhad_71 > ._DraggableComponent-overlay_1bhad_29 {
1090
1145
  background: var(--overlay-background);
1091
1146
  pointer-events: none;
1092
1147
  }
1093
- ._DraggableComponent_59z7f_1:not(._DraggableComponent--isSelected_59z7f_76):hover > ._DraggableComponent-overlay_59z7f_29 {
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--indicativeHover_59z7f_81 > ._DraggableComponent-overlay_59z7f_29 {
1151
+ ._DraggableComponent--indicativeHover_1bhad_81 > ._DraggableComponent-overlay_1bhad_29 {
1097
1152
  pointer-events: none;
1098
1153
  }
1099
- ._DraggableComponent_59z7f_1:not(._DraggableComponent--isSelected_59z7f_76):has(._DraggableComponent_59z7f_1:hover > ._DraggableComponent-overlay_59z7f_29) > ._DraggableComponent-overlay_59z7f_29 {
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--isSelected_59z7f_76 > ._DraggableComponent-overlay_59z7f_29 {
1157
+ ._DraggableComponent--isSelected_1bhad_76 > ._DraggableComponent-overlay_1bhad_29 {
1103
1158
  outline: 2px var(--puck-color-azure-07) solid !important;
1104
1159
  }
1105
- ._DraggableComponent--isSelected_59z7f_76 > ._DraggableComponent-actionsOverlay_59z7f_97 {
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-actions_59z7f_97 {
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--isSelected_59z7f_76 > ._DraggableComponent-actionsOverlay_59z7f_97 > ._DraggableComponent-actions_59z7f_97 {
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-VOJqVbHe.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-VOJqVbHe.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 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, CSSProperties, SyntheticEvent } from 'react';
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 };