@measured/puck 0.16.0-canary.abe8c52 → 0.16.0-canary.c379051
Sign up to get free protection for your applications and to get access to all the features.
- package/dist/{Config-VOJqVbHe.d.ts → Config-CkVFT1_w.d.mts} +15 -1
- package/dist/Config-CkVFT1_w.d.ts +276 -0
- package/dist/chunk-TM7CT64S.mjs +113 -0
- package/dist/index.css +95 -78
- package/dist/index.d.mts +391 -0
- package/dist/index.d.ts +44 -6
- package/dist/index.js +742 -28974
- package/dist/index.mjs +5843 -0
- package/dist/rsc.d.mts +10 -0
- package/dist/rsc.d.ts +1 -1
- package/dist/rsc.mjs +80 -0
- package/package.json +12 -6
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
|
-
.
|
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
|
-
.
|
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
|
-
.
|
1054
|
+
._Drawer_4yfqn_1 {
|
993
1055
|
font-family: var(--puck-font-family);
|
994
1056
|
}
|
995
|
-
._DrawerItem
|
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
|
-
.
|
1065
|
+
._DrawerItem_4yfqn_5:last-of-type ._DrawerItem-default_4yfqn_11 ._DrawerItem-draggableWrapper_4yfqn_11 {
|
999
1066
|
padding-bottom: 0;
|
1000
1067
|
}
|
1001
|
-
._DrawerItem-
|
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
|
-
.
|
1079
|
+
._DrawerItem_4yfqn_5:focus-visible {
|
1014
1080
|
outline: 0;
|
1015
1081
|
}
|
1016
|
-
.
|
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
|
-
.
|
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-
|
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
|
-
.
|
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--
|
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-
|
1109
|
+
._DraggableComponent-contents_1bhad_16 {
|
1044
1110
|
position: relative;
|
1045
1111
|
pointer-events: none;
|
1046
1112
|
z-index: 0;
|
1047
1113
|
}
|
1048
|
-
._DraggableComponent-
|
1049
|
-
._DraggableComponent-
|
1114
|
+
._DraggableComponent-contents_1bhad_16::before,
|
1115
|
+
._DraggableComponent-contents_1bhad_16::after {
|
1050
1116
|
content: " ";
|
1051
1117
|
display: table;
|
1052
1118
|
}
|
1053
|
-
._DraggableComponent-
|
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
|
-
.
|
1130
|
+
._DraggableComponent_1bhad_1:focus-visible > ._DraggableComponent-overlay_1bhad_29 {
|
1065
1131
|
outline: 1px solid var(--puck-color-azure-05);
|
1066
1132
|
}
|
1067
|
-
._DraggableComponent--
|
1133
|
+
._DraggableComponent--isDragging_1bhad_11 > ._DraggableComponent-overlay_1bhad_29 {
|
1068
1134
|
outline: 2px var(--puck-color-azure-09) solid !important;
|
1069
1135
|
}
|
1070
|
-
._DraggableComponent-
|
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
|
-
.
|
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--
|
1155
|
+
._DraggableComponent--forceHover_1bhad_71 > ._DraggableComponent-overlay_1bhad_29 {
|
1090
1156
|
background: var(--overlay-background);
|
1091
1157
|
pointer-events: none;
|
1092
1158
|
}
|
1093
|
-
.
|
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--
|
1162
|
+
._DraggableComponent--indicativeHover_1bhad_81 > ._DraggableComponent-overlay_1bhad_29 {
|
1097
1163
|
pointer-events: none;
|
1098
1164
|
}
|
1099
|
-
.
|
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--
|
1168
|
+
._DraggableComponent--isSelected_1bhad_76 > ._DraggableComponent-overlay_1bhad_29 {
|
1103
1169
|
outline: 2px var(--puck-color-azure-07) solid !important;
|
1104
1170
|
}
|
1105
|
-
._DraggableComponent--
|
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-
|
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--
|
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 */
|
package/dist/index.d.mts
ADDED
@@ -0,0 +1,391 @@
|
|
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-CkVFT1_w.mjs';
|
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-CkVFT1_w.mjs';
|
3
|
+
import * as react from 'react';
|
4
|
+
import { ReactNode, ReactElement, SyntheticEvent, CSSProperties } from 'react';
|
5
|
+
import * as react_jsx_runtime from 'react/jsx-runtime';
|
6
|
+
import { DragStart, DragUpdate } from '@measured/dnd';
|
7
|
+
|
8
|
+
type InsertAction = {
|
9
|
+
type: "insert";
|
10
|
+
componentType: string;
|
11
|
+
destinationIndex: number;
|
12
|
+
destinationZone: string;
|
13
|
+
id?: string;
|
14
|
+
};
|
15
|
+
type DuplicateAction = {
|
16
|
+
type: "duplicate";
|
17
|
+
sourceIndex: number;
|
18
|
+
sourceZone: string;
|
19
|
+
};
|
20
|
+
type ReplaceAction = {
|
21
|
+
type: "replace";
|
22
|
+
destinationIndex: number;
|
23
|
+
destinationZone: string;
|
24
|
+
data: any;
|
25
|
+
};
|
26
|
+
type ReorderAction = {
|
27
|
+
type: "reorder";
|
28
|
+
sourceIndex: number;
|
29
|
+
destinationIndex: number;
|
30
|
+
destinationZone: string;
|
31
|
+
};
|
32
|
+
type MoveAction = {
|
33
|
+
type: "move";
|
34
|
+
sourceIndex: number;
|
35
|
+
sourceZone: string;
|
36
|
+
destinationIndex: number;
|
37
|
+
destinationZone: string;
|
38
|
+
};
|
39
|
+
type RemoveAction = {
|
40
|
+
type: "remove";
|
41
|
+
index: number;
|
42
|
+
zone: string;
|
43
|
+
};
|
44
|
+
type SetUiAction = {
|
45
|
+
type: "setUi";
|
46
|
+
ui: Partial<UiState> | ((previous: UiState) => Partial<UiState>);
|
47
|
+
};
|
48
|
+
type SetDataAction = {
|
49
|
+
type: "setData";
|
50
|
+
data: Partial<Data> | ((previous: Data) => Partial<Data>);
|
51
|
+
};
|
52
|
+
type SetAction = {
|
53
|
+
type: "set";
|
54
|
+
state: Partial<AppState> | ((previous: AppState) => Partial<AppState>);
|
55
|
+
};
|
56
|
+
type RegisterZoneAction = {
|
57
|
+
type: "registerZone";
|
58
|
+
zone: string;
|
59
|
+
};
|
60
|
+
type UnregisterZoneAction = {
|
61
|
+
type: "unregisterZone";
|
62
|
+
zone: string;
|
63
|
+
};
|
64
|
+
type PuckAction = {
|
65
|
+
recordHistory?: boolean;
|
66
|
+
} & (ReorderAction | InsertAction | MoveAction | ReplaceAction | RemoveAction | DuplicateAction | SetAction | SetDataAction | SetUiAction | RegisterZoneAction | UnregisterZoneAction);
|
67
|
+
|
68
|
+
type RenderFunc<Props extends {
|
69
|
+
[key: string]: any;
|
70
|
+
} = {
|
71
|
+
children: ReactNode;
|
72
|
+
}> = (props: Props) => ReactElement;
|
73
|
+
declare const overrideKeys: readonly ["header", "headerActions", "fields", "fieldLabel", "components", "componentItem", "outline", "puck", "preview"];
|
74
|
+
type OverrideKey = (typeof overrideKeys)[number];
|
75
|
+
type OverridesGeneric<Shape extends {
|
76
|
+
[key in OverrideKey]: any;
|
77
|
+
}> = Shape;
|
78
|
+
type Overrides = OverridesGeneric<{
|
79
|
+
fieldTypes: Partial<FieldRenderFunctions>;
|
80
|
+
header: RenderFunc<{
|
81
|
+
actions: ReactNode;
|
82
|
+
children: ReactNode;
|
83
|
+
}>;
|
84
|
+
actionBar: RenderFunc<{
|
85
|
+
label?: string;
|
86
|
+
children: ReactNode;
|
87
|
+
}>;
|
88
|
+
headerActions: RenderFunc<{
|
89
|
+
children: ReactNode;
|
90
|
+
}>;
|
91
|
+
preview: RenderFunc;
|
92
|
+
fields: RenderFunc<{
|
93
|
+
children: ReactNode;
|
94
|
+
isLoading: boolean;
|
95
|
+
itemSelector?: ItemSelector | null;
|
96
|
+
}>;
|
97
|
+
fieldLabel: RenderFunc<{
|
98
|
+
children?: ReactNode;
|
99
|
+
icon?: ReactNode;
|
100
|
+
label: string;
|
101
|
+
el?: "label" | "div";
|
102
|
+
readOnly?: boolean;
|
103
|
+
className?: string;
|
104
|
+
}>;
|
105
|
+
components: RenderFunc;
|
106
|
+
componentItem: RenderFunc<{
|
107
|
+
children: ReactNode;
|
108
|
+
name: string;
|
109
|
+
}>;
|
110
|
+
iframe: RenderFunc<{
|
111
|
+
children: ReactNode;
|
112
|
+
document?: Document;
|
113
|
+
}>;
|
114
|
+
outline: RenderFunc;
|
115
|
+
puck: RenderFunc;
|
116
|
+
}>;
|
117
|
+
type FieldRenderFunctions = Omit<{
|
118
|
+
[Type in Field["type"]]: React.FunctionComponent<FieldProps<Extract<Field, {
|
119
|
+
type: Type;
|
120
|
+
}>> & {
|
121
|
+
children: ReactNode;
|
122
|
+
name: string;
|
123
|
+
}>;
|
124
|
+
}, "custom"> & {
|
125
|
+
[key: string]: React.FunctionComponent<FieldProps<any> & {
|
126
|
+
children: ReactNode;
|
127
|
+
name: string;
|
128
|
+
}>;
|
129
|
+
};
|
130
|
+
|
131
|
+
type Plugin = {
|
132
|
+
overrides: Partial<Overrides>;
|
133
|
+
};
|
134
|
+
|
135
|
+
declare const ActionBar: {
|
136
|
+
({ label, children, }: {
|
137
|
+
label?: string;
|
138
|
+
children?: ReactNode;
|
139
|
+
}): react_jsx_runtime.JSX.Element;
|
140
|
+
Action: ({ children, label, onClick, }: {
|
141
|
+
children: ReactNode;
|
142
|
+
label?: string;
|
143
|
+
onClick: (e: SyntheticEvent) => void;
|
144
|
+
}) => react_jsx_runtime.JSX.Element;
|
145
|
+
};
|
146
|
+
declare const Action: ({ children, label, onClick, }: {
|
147
|
+
children: ReactNode;
|
148
|
+
label?: string;
|
149
|
+
onClick: (e: SyntheticEvent) => void;
|
150
|
+
}) => react_jsx_runtime.JSX.Element;
|
151
|
+
|
152
|
+
declare const FieldLabel: ({ children, icon, label, el, readOnly, className, }: {
|
153
|
+
children?: ReactNode;
|
154
|
+
icon?: ReactNode;
|
155
|
+
label: string;
|
156
|
+
el?: "label" | "div";
|
157
|
+
readOnly?: boolean;
|
158
|
+
className?: string;
|
159
|
+
}) => react_jsx_runtime.JSX.Element;
|
160
|
+
type FieldLabelPropsInternal = {
|
161
|
+
children?: ReactNode;
|
162
|
+
icon?: ReactNode;
|
163
|
+
label?: string;
|
164
|
+
el?: "label" | "div";
|
165
|
+
readOnly?: boolean;
|
166
|
+
};
|
167
|
+
declare const FieldLabelInternal: ({ children, icon, label, el, readOnly, }: FieldLabelPropsInternal) => react_jsx_runtime.JSX.Element;
|
168
|
+
type FieldPropsInternalOptional<ValueType = any, F = Field<any>> = FieldProps<ValueType, F> & {
|
169
|
+
Label?: React.FC<FieldLabelPropsInternal>;
|
170
|
+
label?: string;
|
171
|
+
name?: string;
|
172
|
+
};
|
173
|
+
type FieldPropsInternal<ValueType = any, F = Field<any>> = FieldProps<ValueType, F> & {
|
174
|
+
Label: React.FC<FieldLabelPropsInternal>;
|
175
|
+
label?: string;
|
176
|
+
id: string;
|
177
|
+
name?: string;
|
178
|
+
};
|
179
|
+
declare function AutoFieldPrivate<ValueType = any, FieldType extends Field<ValueType> = Field<ValueType>>(props: FieldPropsInternalOptional<ValueType, FieldType> & {
|
180
|
+
Label?: React.FC<FieldLabelPropsInternal>;
|
181
|
+
}): react_jsx_runtime.JSX.Element;
|
182
|
+
declare function AutoField<ValueType = any, FieldType extends Field<ValueType> = Field<ValueType>>(props: FieldProps<ValueType, FieldType>): react_jsx_runtime.JSX.Element;
|
183
|
+
|
184
|
+
declare const Button: ({ children, href, onClick, variant, type, disabled, tabIndex, newTab, fullWidth, icon, size, loading: loadingProp, }: {
|
185
|
+
children: ReactNode;
|
186
|
+
href?: string;
|
187
|
+
onClick?: (e: any) => void | Promise<void>;
|
188
|
+
variant?: "primary" | "secondary";
|
189
|
+
type?: "button" | "submit" | "reset";
|
190
|
+
disabled?: boolean;
|
191
|
+
tabIndex?: number;
|
192
|
+
newTab?: boolean;
|
193
|
+
fullWidth?: boolean;
|
194
|
+
icon?: ReactNode;
|
195
|
+
size?: "medium" | "large";
|
196
|
+
loading?: boolean;
|
197
|
+
}) => react_jsx_runtime.JSX.Element;
|
198
|
+
|
199
|
+
declare const Drawer: {
|
200
|
+
({ children, droppableId: _droppableId, direction, }: {
|
201
|
+
children: ReactNode;
|
202
|
+
droppableId?: string;
|
203
|
+
direction?: "vertical" | "horizontal";
|
204
|
+
}): react_jsx_runtime.JSX.Element;
|
205
|
+
Item: ({ name, children, id, label, index, isDragDisabled, }: {
|
206
|
+
name: string;
|
207
|
+
children?: (props: {
|
208
|
+
children: ReactNode;
|
209
|
+
name: string;
|
210
|
+
}) => ReactElement;
|
211
|
+
id?: string;
|
212
|
+
label?: string;
|
213
|
+
index: number;
|
214
|
+
isDragDisabled?: boolean;
|
215
|
+
}) => react_jsx_runtime.JSX.Element;
|
216
|
+
};
|
217
|
+
|
218
|
+
type History<D = any> = {
|
219
|
+
id: string;
|
220
|
+
data: D;
|
221
|
+
};
|
222
|
+
type HistoryStore<D = any> = {
|
223
|
+
index: number;
|
224
|
+
hasPast: boolean;
|
225
|
+
hasFuture: boolean;
|
226
|
+
histories: History<D>[];
|
227
|
+
record: (data: D) => void;
|
228
|
+
back: VoidFunction;
|
229
|
+
forward: VoidFunction;
|
230
|
+
currentHistory: History;
|
231
|
+
nextHistory: History<D> | null;
|
232
|
+
prevHistory: History<D> | null;
|
233
|
+
setHistories: (histories: History[]) => void;
|
234
|
+
setHistoryIndex: (index: number) => void;
|
235
|
+
};
|
236
|
+
|
237
|
+
type OnAction = (action: PuckAction, appState: AppState, prevAppState: AppState) => void;
|
238
|
+
|
239
|
+
type PathData = Record<string, {
|
240
|
+
path: string[];
|
241
|
+
label: string;
|
242
|
+
}>;
|
243
|
+
type DropZoneContext<UserConfig extends Config = Config> = {
|
244
|
+
data: Data;
|
245
|
+
config: UserConfig;
|
246
|
+
componentState?: Record<string, any>;
|
247
|
+
itemSelector?: ItemSelector | null;
|
248
|
+
setItemSelector?: (newIndex: ItemSelector | null) => void;
|
249
|
+
dispatch?: (action: PuckAction) => void;
|
250
|
+
areaId?: string;
|
251
|
+
draggedItem?: DragStart & Partial<DragUpdate>;
|
252
|
+
placeholderStyle?: CSSProperties;
|
253
|
+
hoveringArea?: string | null;
|
254
|
+
setHoveringArea?: (area: string | null) => void;
|
255
|
+
hoveringZone?: string | null;
|
256
|
+
setHoveringZone?: (zone: string | null) => void;
|
257
|
+
hoveringComponent?: string | null;
|
258
|
+
setHoveringComponent?: (id: string | null) => void;
|
259
|
+
registerZoneArea?: (areaId: string) => void;
|
260
|
+
areasWithZones?: Record<string, boolean>;
|
261
|
+
registerZone?: (zoneCompound: string) => void;
|
262
|
+
unregisterZone?: (zoneCompound: string) => void;
|
263
|
+
activeZones?: Record<string, boolean>;
|
264
|
+
pathData?: PathData;
|
265
|
+
registerPath?: (selector: ItemSelector) => void;
|
266
|
+
mode?: "edit" | "render";
|
267
|
+
zoneWillDrag?: string;
|
268
|
+
setZoneWillDrag?: (zone: string) => void;
|
269
|
+
} | null;
|
270
|
+
declare const dropZoneContext: react.Context<DropZoneContext<Config>>;
|
271
|
+
declare const DropZoneProvider: ({ children, value, }: {
|
272
|
+
children: ReactNode;
|
273
|
+
value: DropZoneContext;
|
274
|
+
}) => react_jsx_runtime.JSX.Element;
|
275
|
+
|
276
|
+
declare function DropZone(props: DropZoneProps): react_jsx_runtime.JSX.Element;
|
277
|
+
|
278
|
+
declare const IconButton: ({ children, href, onClick, variant, type, disabled, tabIndex, newTab, fullWidth, title, }: {
|
279
|
+
children: ReactNode;
|
280
|
+
href?: string;
|
281
|
+
onClick?: (e: SyntheticEvent) => void | Promise<void>;
|
282
|
+
variant?: "primary" | "secondary";
|
283
|
+
type?: "button" | "submit" | "reset";
|
284
|
+
disabled?: boolean;
|
285
|
+
tabIndex?: number;
|
286
|
+
newTab?: boolean;
|
287
|
+
fullWidth?: boolean;
|
288
|
+
title: string;
|
289
|
+
}) => react_jsx_runtime.JSX.Element;
|
290
|
+
|
291
|
+
type IframeConfig = {
|
292
|
+
enabled?: boolean;
|
293
|
+
};
|
294
|
+
|
295
|
+
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, }: {
|
296
|
+
children?: ReactNode;
|
297
|
+
config: UserConfig;
|
298
|
+
data: Partial<Data>;
|
299
|
+
ui?: Partial<UiState>;
|
300
|
+
onChange?: (data: Data) => void;
|
301
|
+
onPublish?: (data: Data) => void;
|
302
|
+
onAction?: OnAction;
|
303
|
+
permissions?: Partial<Permissions>;
|
304
|
+
plugins?: Plugin[];
|
305
|
+
overrides?: Partial<Overrides>;
|
306
|
+
renderHeader?: (props: {
|
307
|
+
children: ReactNode;
|
308
|
+
dispatch: (action: PuckAction) => void;
|
309
|
+
state: AppState;
|
310
|
+
}) => ReactElement;
|
311
|
+
renderHeaderActions?: (props: {
|
312
|
+
state: AppState;
|
313
|
+
dispatch: (action: PuckAction) => void;
|
314
|
+
}) => ReactElement;
|
315
|
+
headerTitle?: string;
|
316
|
+
headerPath?: string;
|
317
|
+
viewports?: Viewports;
|
318
|
+
iframe?: IframeConfig;
|
319
|
+
dnd?: {
|
320
|
+
disableAutoScroll?: boolean;
|
321
|
+
};
|
322
|
+
initialHistory?: {
|
323
|
+
histories: History<any>[];
|
324
|
+
index: number;
|
325
|
+
};
|
326
|
+
}): react_jsx_runtime.JSX.Element;
|
327
|
+
declare namespace Puck {
|
328
|
+
var Components: () => react_jsx_runtime.JSX.Element;
|
329
|
+
var Fields: () => react_jsx_runtime.JSX.Element;
|
330
|
+
var Outline: () => react_jsx_runtime.JSX.Element;
|
331
|
+
var Preview: ({ id }: {
|
332
|
+
id?: string;
|
333
|
+
}) => react_jsx_runtime.JSX.Element;
|
334
|
+
}
|
335
|
+
|
336
|
+
declare function Render<UserConfig extends Config = Config>({ config, data, }: {
|
337
|
+
config: UserConfig;
|
338
|
+
data: Partial<Data>;
|
339
|
+
}): react_jsx_runtime.JSX.Element;
|
340
|
+
|
341
|
+
declare function migrate(data: Data): Data;
|
342
|
+
|
343
|
+
type PropTransform<Props extends DefaultComponentProps = DefaultComponentProps, RootProps extends DefaultRootProps = DefaultRootProps> = Partial<{
|
344
|
+
[ComponentName in keyof Props]: (props: Props[ComponentName] & {
|
345
|
+
[key: string]: any;
|
346
|
+
}) => Props[ComponentName];
|
347
|
+
} & {
|
348
|
+
root: (props: RootProps & {
|
349
|
+
[key: string]: any;
|
350
|
+
}) => RootProps;
|
351
|
+
}>;
|
352
|
+
declare function transformProps<Props extends DefaultComponentProps = DefaultComponentProps, RootProps extends DefaultComponentProps = DefaultComponentProps>(data: Partial<Data>, propTransforms: PropTransform<Props, RootProps>): Data;
|
353
|
+
|
354
|
+
declare function resolveAllData(data: Partial<Data>, config: Config, onResolveStart?: (item: MappedItem) => void, onResolveEnd?: (item: MappedItem) => void): Promise<{
|
355
|
+
root: RootData<DefaultRootProps> | RootDataWithProps;
|
356
|
+
content: any;
|
357
|
+
zones: Record<string, MappedItem[]>;
|
358
|
+
}>;
|
359
|
+
|
360
|
+
declare const usePuck: () => {
|
361
|
+
appState: AppState;
|
362
|
+
config: Config;
|
363
|
+
dispatch: (action: PuckAction) => void;
|
364
|
+
getPermissions: ({ item, type, }?: {
|
365
|
+
item?: ComponentData;
|
366
|
+
type?: keyof DefaultComponentProps;
|
367
|
+
}) => {
|
368
|
+
[x: string]: boolean | undefined;
|
369
|
+
drag?: boolean | undefined;
|
370
|
+
duplicate?: boolean | undefined;
|
371
|
+
delete?: boolean | undefined;
|
372
|
+
edit?: boolean | undefined;
|
373
|
+
insert?: boolean | undefined;
|
374
|
+
};
|
375
|
+
history: {
|
376
|
+
back: VoidFunction;
|
377
|
+
forward: VoidFunction;
|
378
|
+
setHistories: (histories: History[]) => void;
|
379
|
+
setHistoryIndex: (index: number) => void;
|
380
|
+
hasPast: boolean;
|
381
|
+
hasFuture: boolean;
|
382
|
+
histories: History<any>[];
|
383
|
+
index: number;
|
384
|
+
historyStore: HistoryStore | undefined;
|
385
|
+
};
|
386
|
+
selectedItem: ComponentData<DefaultComponentProps & {
|
387
|
+
id: string;
|
388
|
+
}> | null;
|
389
|
+
};
|
390
|
+
|
391
|
+
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 };
|