@measured/puck 0.16.0-canary.abe8c52 → 0.16.0-canary.c379051
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- 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 };
|