@measured/puck 0.16.0-canary.ef2e5ec → 0.16.0-canary.f0655f0

Sign up to get free protection for your applications and to get access to all the features.
@@ -68,7 +68,7 @@ type ObjectField<Props extends {
68
68
  [key: string]: any;
69
69
  }> = BaseField & {
70
70
  type: "object";
71
- objectFields: {
71
+ objectFields: Props extends any[] ? never : {
72
72
  [SubPropName in keyof Props]: Field<Props[SubPropName]>;
73
73
  };
74
74
  };
@@ -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>;
@@ -183,6 +184,12 @@ type ComponentConfig<ComponentProps extends DefaultComponentProps = DefaultCompo
183
184
  props?: Partial<ComponentProps>;
184
185
  readOnly?: Partial<Record<keyof ComponentProps, boolean>>;
185
186
  };
187
+ resolvePermissions?: (data: DataShape, params: {
188
+ changed: Partial<Record<keyof ComponentProps, boolean>>;
189
+ lastPermissions: Partial<Permissions> | undefined;
190
+ initialPermissions: Partial<Permissions>;
191
+ appState: AppState;
192
+ }) => Partial<Permissions>;
186
193
  };
187
194
  type Category<ComponentName> = {
188
195
  components?: ComponentName[];
@@ -258,5 +265,12 @@ type AppState = {
258
265
  data: Data;
259
266
  ui: UiState;
260
267
  };
268
+ type Permissions = {
269
+ drag: boolean;
270
+ duplicate: boolean;
271
+ delete: boolean;
272
+ edit: boolean;
273
+ insert: boolean;
274
+ } & Record<string, boolean>;
261
275
 
262
- export { 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, RootDataWithProps as R, SelectField as S, TextField as T, UiState as U, Viewports as V, FieldProps as a, DefaultRootProps as b, DropZoneProps as c, DefaultComponentProps as d, RootData 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 };
276
+ 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,65 @@
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_8nyey_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
+ min-height: 26px;
152
+ }
153
+ ._ActionBarComponent-actionsLabel_8nyey_15 {
154
+ color: var(--puck-color-grey-08);
155
+ display: flex;
156
+ font-size: var(--puck-font-size-xxxs);
157
+ font-weight: 500;
158
+ justify-content: center;
159
+ align-items: center;
160
+ padding-left: 8px;
161
+ padding-right: 8px;
162
+ text-overflow: ellipsis;
163
+ white-space: nowrap;
164
+ }
165
+ ._ActionBarComponent-action_8nyey_15:first-of-type {
166
+ border-left: 0.5px solid var(--puck-color-grey-05);
167
+ border-radius: 0;
168
+ padding-left: 16px;
169
+ }
170
+ ._ActionBarComponent-action_8nyey_15 {
171
+ background: transparent;
172
+ border: none;
173
+ color: var(--puck-color-grey-08);
174
+ cursor: pointer;
175
+ padding: 6px 8px;
176
+ border-radius: 4px;
177
+ overflow: hidden;
178
+ display: flex;
179
+ align-items: center;
180
+ justify-content: center;
181
+ transition: color 50ms ease-in;
182
+ }
183
+ ._ActionBarComponent-action_8nyey_15:focus-visible {
184
+ outline: 2px solid var(--puck-color-azure-05);
185
+ outline-offset: -2px;
186
+ }
187
+ @media (hover: hover) and (pointer: fine) {
188
+ ._ActionBarComponent-action_8nyey_15:hover {
189
+ color: var(--puck-color-azure-06);
190
+ transition: none;
191
+ }
192
+ }
193
+ ._ActionBarComponent-action_8nyey_15:active {
194
+ color: var(--puck-color-azure-07);
195
+ transition: none;
196
+ }
197
+
139
198
  /* css-module:/home/runner/work/puck/puck/packages/core/components/AutoField/styles.module.css/#css-module-data */
140
199
  ._Input_3pq3z_1 {
141
200
  color: var(--puck-color-grey-04);
@@ -523,14 +582,17 @@ textarea._Input-input_3pq3z_47 {
523
582
  }
524
583
 
525
584
  /* css-module:/home/runner/work/puck/puck/packages/core/components/DragIcon/styles.module.css/#css-module-data */
526
- ._DragIcon_1p5wn_1 {
585
+ ._DragIcon_17p8x_1 {
527
586
  color: var(--puck-color-grey-05);
528
587
  cursor: grab;
529
588
  padding: 4px;
530
589
  border-radius: 4px;
531
590
  }
591
+ ._DragIcon--disabled_17p8x_8 {
592
+ cursor: no-drop;
593
+ }
532
594
  @media (hover: hover) and (pointer: fine) {
533
- ._DragIcon_1p5wn_1:hover {
595
+ ._DragIcon_17p8x_1:not(._DragIcon--disabled_17p8x_8):hover {
534
596
  color: var(--puck-color-azure-05);
535
597
  background-color: var(--puck-color-azure-12);
536
598
  }
@@ -989,16 +1051,21 @@ textarea._Input-input_3pq3z_47 {
989
1051
  }
990
1052
 
991
1053
  /* css-module:/home/runner/work/puck/puck/packages/core/components/Drawer/styles.module.css/#css-module-data */
992
- ._Drawer_6zh0b_1 {
1054
+ ._Drawer_4yfqn_1 {
993
1055
  font-family: var(--puck-font-family);
994
1056
  }
995
- ._DrawerItem-default_6zh0b_5 ._DrawerItem-draggableWrapper_6zh0b_5 {
1057
+ ._DrawerItem--disabled_4yfqn_5 {
1058
+ background: var(--puck-color-grey-11);
1059
+ color: var(--puck-color-grey-05);
1060
+ cursor: not-allowed;
1061
+ }
1062
+ ._DrawerItem-default_4yfqn_11 ._DrawerItem-draggableWrapper_4yfqn_11 {
996
1063
  padding-bottom: 12px;
997
1064
  }
998
- ._DrawerItem_6zh0b_5:last-of-type ._DrawerItem-default_6zh0b_5 ._DrawerItem-draggableWrapper_6zh0b_5 {
1065
+ ._DrawerItem_4yfqn_5:last-of-type ._DrawerItem-default_4yfqn_11 ._DrawerItem-draggableWrapper_4yfqn_11 {
999
1066
  padding-bottom: 0;
1000
1067
  }
1001
- ._DrawerItem-draggable_6zh0b_5 {
1068
+ ._DrawerItem-draggable_4yfqn_11 {
1002
1069
  background: var(--puck-color-white);
1003
1070
  padding: 12px;
1004
1071
  display: flex;
@@ -1007,50 +1074,49 @@ textarea._Input-input_3pq3z_47 {
1007
1074
  font-size: var(--puck-font-size-xxs);
1008
1075
  justify-content: space-between;
1009
1076
  align-items: center;
1010
- cursor: grab;
1011
1077
  transition: background-color 50ms ease-in, color 50ms ease-in;
1012
1078
  }
1013
- ._DrawerItem_6zh0b_5:focus-visible {
1079
+ ._DrawerItem_4yfqn_5:focus-visible {
1014
1080
  outline: 0;
1015
1081
  }
1016
- ._Drawer_6zh0b_1:not(._Drawer--isDraggingFrom_6zh0b_31) ._DrawerItem_6zh0b_5:focus-visible ._DrawerItem-draggable_6zh0b_5 {
1082
+ ._Drawer_4yfqn_1:not(._Drawer--isDraggingFrom_4yfqn_36) ._DrawerItem_4yfqn_5:focus-visible ._DrawerItem-draggable_4yfqn_11 {
1017
1083
  border-radius: 4px;
1018
1084
  outline: 2px solid var(--puck-color-azure-05);
1019
1085
  outline-offset: 2px;
1020
1086
  }
1021
1087
  @media (hover: hover) and (pointer: fine) {
1022
- ._Drawer_6zh0b_1:not(._Drawer--isDraggingFrom_6zh0b_31) ._DrawerItem-draggable_6zh0b_5:hover {
1088
+ ._Drawer_4yfqn_1:not(._Drawer--isDraggingFrom_4yfqn_36) ._DrawerItem_4yfqn_5:not(._DrawerItem--disabled_4yfqn_5) ._DrawerItem-draggable_4yfqn_11:hover {
1023
1089
  background-color: var(--puck-color-azure-12);
1024
1090
  color: var(--puck-color-azure-04);
1025
1091
  transition: none;
1026
1092
  }
1027
1093
  }
1028
- ._DrawerItem-name_6zh0b_47 {
1094
+ ._DrawerItem-name_4yfqn_54 {
1029
1095
  overflow-x: hidden;
1030
1096
  text-overflow: ellipsis;
1031
1097
  white-space: nowrap;
1032
1098
  }
1033
1099
 
1034
1100
  /* css-module:/home/runner/work/puck/puck/packages/core/components/DraggableComponent/styles.module.css/#css-module-data */
1035
- ._DraggableComponent_59z7f_1 {
1101
+ ._DraggableComponent_1bhad_1 {
1036
1102
  pointer-events: auto;
1037
1103
  --overlay-background: color-mix( in srgb, var(--puck-color-azure-08) 30%, transparent );
1038
1104
  }
1039
- ._DraggableComponent--isDragging_59z7f_11 {
1105
+ ._DraggableComponent--isDragging_1bhad_11 {
1040
1106
  background: color-mix(in srgb, var(--puck-color-azure-08) 10%, transparent);
1041
1107
  overflow: hidden;
1042
1108
  }
1043
- ._DraggableComponent-contents_59z7f_16 {
1109
+ ._DraggableComponent-contents_1bhad_16 {
1044
1110
  position: relative;
1045
1111
  pointer-events: none;
1046
1112
  z-index: 0;
1047
1113
  }
1048
- ._DraggableComponent-contents_59z7f_16::before,
1049
- ._DraggableComponent-contents_59z7f_16::after {
1114
+ ._DraggableComponent-contents_1bhad_16::before,
1115
+ ._DraggableComponent-contents_1bhad_16::after {
1050
1116
  content: " ";
1051
1117
  display: table;
1052
1118
  }
1053
- ._DraggableComponent-overlay_59z7f_29 {
1119
+ ._DraggableComponent-overlay_1bhad_29 {
1054
1120
  cursor: pointer;
1055
1121
  height: 100%;
1056
1122
  width: 100%;
@@ -1061,13 +1127,13 @@ textarea._Input-input_3pq3z_47 {
1061
1127
  box-sizing: border-box;
1062
1128
  z-index: 1;
1063
1129
  }
1064
- ._DraggableComponent_59z7f_1:focus-visible > ._DraggableComponent-overlay_59z7f_29 {
1130
+ ._DraggableComponent_1bhad_1:focus-visible > ._DraggableComponent-overlay_1bhad_29 {
1065
1131
  outline: 1px solid var(--puck-color-azure-05);
1066
1132
  }
1067
- ._DraggableComponent--isDragging_59z7f_11 > ._DraggableComponent-overlay_59z7f_29 {
1133
+ ._DraggableComponent--isDragging_1bhad_11 > ._DraggableComponent-overlay_1bhad_29 {
1068
1134
  outline: 2px var(--puck-color-azure-09) solid !important;
1069
1135
  }
1070
- ._DraggableComponent-loadingOverlay_59z7f_49 {
1136
+ ._DraggableComponent-loadingOverlay_1bhad_49 {
1071
1137
  background: var(--puck-color-white);
1072
1138
  color: var(--puck-color-grey-03);
1073
1139
  border-radius: 4px;
@@ -1082,91 +1148,42 @@ textarea._Input-input_3pq3z_47 {
1082
1148
  opacity: 0.8;
1083
1149
  z-index: 1;
1084
1150
  }
1085
- ._DraggableComponent_59z7f_1:hover:not(._DraggableComponent--isLocked_59z7f_65) > ._DraggableComponent-overlay_59z7f_29 {
1151
+ ._DraggableComponent_1bhad_1:hover:not(._DraggableComponent--isLocked_1bhad_65) > ._DraggableComponent-overlay_1bhad_29 {
1086
1152
  background: var(--overlay-background);
1087
1153
  pointer-events: none;
1088
1154
  }
1089
- ._DraggableComponent--forceHover_59z7f_71 > ._DraggableComponent-overlay_59z7f_29 {
1155
+ ._DraggableComponent--forceHover_1bhad_71 > ._DraggableComponent-overlay_1bhad_29 {
1090
1156
  background: var(--overlay-background);
1091
1157
  pointer-events: none;
1092
1158
  }
1093
- ._DraggableComponent_59z7f_1:not(._DraggableComponent--isSelected_59z7f_76):hover > ._DraggableComponent-overlay_59z7f_29 {
1159
+ ._DraggableComponent_1bhad_1:not(._DraggableComponent--isSelected_1bhad_76):hover > ._DraggableComponent-overlay_1bhad_29 {
1094
1160
  outline: 2px var(--puck-color-azure-09) solid !important;
1095
1161
  }
1096
- ._DraggableComponent--indicativeHover_59z7f_81 > ._DraggableComponent-overlay_59z7f_29 {
1162
+ ._DraggableComponent--indicativeHover_1bhad_81 > ._DraggableComponent-overlay_1bhad_29 {
1097
1163
  pointer-events: none;
1098
1164
  }
1099
- ._DraggableComponent_59z7f_1:not(._DraggableComponent--isSelected_59z7f_76):has(._DraggableComponent_59z7f_1:hover > ._DraggableComponent-overlay_59z7f_29) > ._DraggableComponent-overlay_59z7f_29 {
1165
+ ._DraggableComponent_1bhad_1:not(._DraggableComponent--isSelected_1bhad_76):has(._DraggableComponent_1bhad_1:hover > ._DraggableComponent-overlay_1bhad_29) > ._DraggableComponent-overlay_1bhad_29 {
1100
1166
  display: none;
1101
1167
  }
1102
- ._DraggableComponent--isSelected_59z7f_76 > ._DraggableComponent-overlay_59z7f_29 {
1168
+ ._DraggableComponent--isSelected_1bhad_76 > ._DraggableComponent-overlay_1bhad_29 {
1103
1169
  outline: 2px var(--puck-color-azure-07) solid !important;
1104
1170
  }
1105
- ._DraggableComponent--isSelected_59z7f_76 > ._DraggableComponent-actionsOverlay_59z7f_97 {
1171
+ ._DraggableComponent--isSelected_1bhad_76 > ._DraggableComponent-actionsOverlay_1bhad_97 {
1106
1172
  display: block;
1107
1173
  position: sticky;
1108
1174
  z-index: 2;
1109
1175
  }
1110
- ._DraggableComponent-actions_59z7f_97 {
1176
+ ._DraggableComponent-actions_1bhad_97 {
1111
1177
  position: absolute;
1112
1178
  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
1179
  cursor: grab;
1120
1180
  display: none;
1121
- font-family: var(--puck-font-family);
1122
- gap: 4px;
1123
1181
  pointer-events: auto;
1124
1182
  box-sizing: border-box;
1125
1183
  transform-origin: right top;
1126
1184
  }
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;
1185
+ ._DraggableComponent--isSelected_1bhad_76 > ._DraggableComponent-actionsOverlay_1bhad_97 > ._DraggableComponent-actions_1bhad_97 {
1152
1186
  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
1187
  }
1171
1188
 
1172
1189
  /* css-module:/home/runner/work/puck/puck/packages/core/components/DropZone/styles.module.css/#css-module-data */