@measured/puck 0.16.0-canary.2c52d27 → 0.16.0-canary.2cce878

Sign up to get free protection for your applications and to get access to all the features.
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,92 +1148,43 @@ 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 {
1185
+ ._DraggableComponent--isSelected_1bhad_76 > ._DraggableComponent-actionsOverlay_1bhad_97 > ._DraggableComponent-actions_1bhad_97 {
1128
1186
  display: flex;
1129
1187
  }
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;
1152
- 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
- }
1171
1188
 
1172
1189
  /* css-module:/home/runner/work/puck/puck/packages/core/components/DropZone/styles.module.css/#css-module-data */
1173
1190
  ._DropZone_djoti_1 {
@@ -1715,7 +1732,7 @@ textarea._Input-input_3pq3z_47 {
1715
1732
  }
1716
1733
 
1717
1734
  /* css-module:/home/runner/work/puck/puck/packages/core/components/Puck/components/Canvas/styles.module.css/#css-module-data */
1718
- ._PuckCanvas_6zd4y_1 {
1735
+ ._PuckCanvas_esbg1_1 {
1719
1736
  background: var(--puck-color-grey-11);
1720
1737
  display: flex;
1721
1738
  grid-area: editor;
@@ -1724,15 +1741,15 @@ textarea._Input-input_3pq3z_47 {
1724
1741
  overflow: auto;
1725
1742
  }
1726
1743
  @media (min-width: 1198px) {
1727
- ._PuckCanvas_6zd4y_1 {
1744
+ ._PuckCanvas_esbg1_1 {
1728
1745
  padding: calc(var(--puck-space-px) * 1.5);
1729
1746
  padding-top: var(--puck-space-px);
1730
1747
  }
1731
- ._PuckCanvas_6zd4y_1:not(._PuckCanvas_6zd4y_1:has(._PuckCanvas-controls_6zd4y_16)) {
1748
+ ._PuckCanvas_esbg1_1:not(._PuckCanvas_esbg1_1:has(._PuckCanvas-controls_esbg1_16)) {
1732
1749
  padding-top: calc(var(--puck-space-px) * 1.5);
1733
1750
  }
1734
1751
  }
1735
- ._PuckCanvas-inner_6zd4y_21 {
1752
+ ._PuckCanvas-inner_esbg1_21 {
1736
1753
  box-sizing: border-box;
1737
1754
  display: flex;
1738
1755
  height: 100%;
@@ -1742,7 +1759,7 @@ textarea._Input-input_3pq3z_47 {
1742
1759
  position: relative;
1743
1760
  width: 100%;
1744
1761
  }
1745
- ._PuckCanvas-root_6zd4y_32 {
1762
+ ._PuckCanvas-root_esbg1_32 {
1746
1763
  background: white;
1747
1764
  border: 1px solid var(--puck-color-grey-09);
1748
1765
  box-sizing: border-box;
@@ -1754,16 +1771,32 @@ textarea._Input-input_3pq3z_47 {
1754
1771
  opacity: 0;
1755
1772
  }
1756
1773
  @media (min-width: 1198px) {
1757
- ._PuckCanvas-root_6zd4y_32 {
1774
+ ._PuckCanvas-root_esbg1_32 {
1758
1775
  min-width: unset;
1759
1776
  }
1760
1777
  }
1761
1778
  @media (prefers-reduced-motion: reduce) {
1762
- ._PuckCanvas-root_6zd4y_32 {
1779
+ ._PuckCanvas-root_esbg1_32 {
1763
1780
  transition: none !important;
1764
1781
  }
1765
1782
  }
1766
- ._PuckCanvas--ready_6zd4y_56 ._PuckCanvas-root_6zd4y_32 {
1783
+ ._PuckCanvas--ready_esbg1_56 ._PuckCanvas-root_esbg1_32 {
1767
1784
  opacity: 1;
1768
- transition: opacity 150ms ease-out;
1785
+ }
1786
+ ._PuckCanvas-loader_esbg1_60 {
1787
+ align-items: center;
1788
+ color: var(--puck-color-grey-06);
1789
+ display: flex;
1790
+ height: 100%;
1791
+ justify-content: center;
1792
+ transition: opacity 250ms ease-out;
1793
+ opacity: 0;
1794
+ }
1795
+ ._PuckCanvas--showLoader_esbg1_70 ._PuckCanvas-loader_esbg1_60 {
1796
+ opacity: 1;
1797
+ }
1798
+ ._PuckCanvas--showLoader_esbg1_70._PuckCanvas--ready_esbg1_56 ._PuckCanvas-loader_esbg1_60 {
1799
+ opacity: 0;
1800
+ height: 0;
1801
+ transition: none;
1769
1802
  }
@@ -0,0 +1,252 @@
1
+ import { F as Field, a as FieldProps, C as Config, D as Data, I as ItemSelector, P as PuckAction, b as DropZoneProps, E as ExtractPropsFromConfig, c as ExtractRootPropsFromConfig, U as UiState, O as OnAction, d as Permissions, e as Plugin, f as Overrides, A as AppState, V as Viewports, g as IframeConfig, h as DefaultComponentProps, i as DefaultRootFieldProps, j as ComponentData } from './actions-B02fIT66.mjs';
2
+ export { H as Adaptor, z as ArrayField, p as ArrayState, $ as AsFieldProps, B as BaseData, w as BaseField, r as ComponentConfig, u as ComponentDataMap, v as Content, L as CustomField, Y as DefaultRootProps, X as DefaultRootRenderProps, K as ExternalField, J as ExternalFieldWithAdaptor, m as FieldRenderFunctions, Q as Fields, n as ItemWithId, M as MappedItem, N as NumberField, G as ObjectField, l as OverrideKey, q as PuckComponent, W as PuckContext, y as RadioField, t as RootData, R as RootDataWithProps, s as RootDataWithoutProps, S as SelectField, T as TextField, x as TextareaField, k as Viewport, a0 as WithChildren, Z as WithId, _ as WithPuckProps, o as overrideKeys } from './actions-B02fIT66.mjs';
3
+ import * as react_jsx_runtime from 'react/jsx-runtime';
4
+ import * as react from 'react';
5
+ import { ReactNode, SyntheticEvent, ReactElement, CSSProperties } from 'react';
6
+ import { DragStart, DragUpdate } from '@measured/dnd';
7
+
8
+ declare const ActionBar: {
9
+ ({ label, children, }: {
10
+ label?: string;
11
+ children?: ReactNode;
12
+ }): react_jsx_runtime.JSX.Element;
13
+ Action: ({ children, label, onClick, }: {
14
+ children: ReactNode;
15
+ label?: string;
16
+ onClick: (e: SyntheticEvent) => void;
17
+ }) => react_jsx_runtime.JSX.Element;
18
+ };
19
+ declare const Action: ({ children, label, onClick, }: {
20
+ children: ReactNode;
21
+ label?: string;
22
+ onClick: (e: SyntheticEvent) => void;
23
+ }) => react_jsx_runtime.JSX.Element;
24
+
25
+ declare const FieldLabel: ({ children, icon, label, el, readOnly, className, }: {
26
+ children?: ReactNode;
27
+ icon?: ReactNode;
28
+ label: string;
29
+ el?: "label" | "div";
30
+ readOnly?: boolean;
31
+ className?: string;
32
+ }) => react_jsx_runtime.JSX.Element;
33
+ type FieldLabelPropsInternal = {
34
+ children?: ReactNode;
35
+ icon?: ReactNode;
36
+ label?: string;
37
+ el?: "label" | "div";
38
+ readOnly?: boolean;
39
+ };
40
+ declare const FieldLabelInternal: ({ children, icon, label, el, readOnly, }: FieldLabelPropsInternal) => react_jsx_runtime.JSX.Element;
41
+ type FieldPropsInternalOptional<ValueType = any, F = Field<any>> = FieldProps<ValueType, F> & {
42
+ Label?: React.FC<FieldLabelPropsInternal>;
43
+ label?: string;
44
+ name?: string;
45
+ };
46
+ type FieldPropsInternal<ValueType = any, F = Field<any>> = FieldProps<ValueType, F> & {
47
+ Label: React.FC<FieldLabelPropsInternal>;
48
+ label?: string;
49
+ id: string;
50
+ name?: string;
51
+ };
52
+ declare function AutoFieldPrivate<ValueType = any, FieldType extends Field<ValueType> = Field<ValueType>>(props: FieldPropsInternalOptional<ValueType, FieldType> & {
53
+ Label?: React.FC<FieldLabelPropsInternal>;
54
+ }): react_jsx_runtime.JSX.Element;
55
+ declare function AutoField<ValueType = any, FieldType extends Field<ValueType> = Field<ValueType>>(props: FieldProps<ValueType, FieldType>): react_jsx_runtime.JSX.Element;
56
+
57
+ declare const Button: ({ children, href, onClick, variant, type, disabled, tabIndex, newTab, fullWidth, icon, size, loading: loadingProp, }: {
58
+ children: ReactNode;
59
+ href?: string;
60
+ onClick?: (e: any) => void | Promise<void>;
61
+ variant?: "primary" | "secondary";
62
+ type?: "button" | "submit" | "reset";
63
+ disabled?: boolean;
64
+ tabIndex?: number;
65
+ newTab?: boolean;
66
+ fullWidth?: boolean;
67
+ icon?: ReactNode;
68
+ size?: "medium" | "large";
69
+ loading?: boolean;
70
+ }) => react_jsx_runtime.JSX.Element;
71
+
72
+ declare const Drawer: {
73
+ ({ children, droppableId: _droppableId, direction, }: {
74
+ children: ReactNode;
75
+ droppableId?: string;
76
+ direction?: "vertical" | "horizontal";
77
+ }): react_jsx_runtime.JSX.Element;
78
+ Item: ({ name, children, id, label, index, isDragDisabled, }: {
79
+ name: string;
80
+ children?: (props: {
81
+ children: ReactNode;
82
+ name: string;
83
+ }) => ReactElement;
84
+ id?: string;
85
+ label?: string;
86
+ index: number;
87
+ isDragDisabled?: boolean;
88
+ }) => react_jsx_runtime.JSX.Element;
89
+ };
90
+
91
+ type History<D = any> = {
92
+ id: string;
93
+ data: D;
94
+ };
95
+ type HistoryStore<D = any> = {
96
+ index: number;
97
+ hasPast: boolean;
98
+ hasFuture: boolean;
99
+ histories: History<D>[];
100
+ record: (data: D) => void;
101
+ back: VoidFunction;
102
+ forward: VoidFunction;
103
+ currentHistory: History;
104
+ nextHistory: History<D> | null;
105
+ prevHistory: History<D> | null;
106
+ setHistories: (histories: History[]) => void;
107
+ setHistoryIndex: (index: number) => void;
108
+ };
109
+
110
+ type PathData = Record<string, {
111
+ path: string[];
112
+ label: string;
113
+ }>;
114
+ type DropZoneContext<UserConfig extends Config = Config> = {
115
+ data: Data;
116
+ config: UserConfig;
117
+ componentState?: Record<string, any>;
118
+ itemSelector?: ItemSelector | null;
119
+ setItemSelector?: (newIndex: ItemSelector | null) => void;
120
+ dispatch?: (action: PuckAction) => void;
121
+ areaId?: string;
122
+ draggedItem?: DragStart & Partial<DragUpdate>;
123
+ placeholderStyle?: CSSProperties;
124
+ hoveringArea?: string | null;
125
+ setHoveringArea?: (area: string | null) => void;
126
+ hoveringZone?: string | null;
127
+ setHoveringZone?: (zone: string | null) => void;
128
+ hoveringComponent?: string | null;
129
+ setHoveringComponent?: (id: string | null) => void;
130
+ registerZoneArea?: (areaId: string) => void;
131
+ areasWithZones?: Record<string, boolean>;
132
+ registerZone?: (zoneCompound: string) => void;
133
+ unregisterZone?: (zoneCompound: string) => void;
134
+ activeZones?: Record<string, boolean>;
135
+ pathData?: PathData;
136
+ registerPath?: (selector: ItemSelector) => void;
137
+ mode?: "edit" | "render";
138
+ zoneWillDrag?: string;
139
+ setZoneWillDrag?: (zone: string) => void;
140
+ } | null;
141
+ declare const dropZoneContext: react.Context<DropZoneContext<Config>>;
142
+ declare const DropZoneProvider: ({ children, value, }: {
143
+ children: ReactNode;
144
+ value: DropZoneContext;
145
+ }) => react_jsx_runtime.JSX.Element;
146
+
147
+ declare function DropZone(props: DropZoneProps): react_jsx_runtime.JSX.Element;
148
+
149
+ declare const IconButton: ({ children, href, onClick, variant, type, disabled, tabIndex, newTab, fullWidth, title, }: {
150
+ children: ReactNode;
151
+ href?: string;
152
+ onClick?: (e: SyntheticEvent) => void | Promise<void>;
153
+ variant?: "primary" | "secondary";
154
+ type?: "button" | "submit" | "reset";
155
+ disabled?: boolean;
156
+ tabIndex?: number;
157
+ newTab?: boolean;
158
+ fullWidth?: boolean;
159
+ title: string;
160
+ }) => react_jsx_runtime.JSX.Element;
161
+
162
+ declare function Puck<UserConfig extends Config = Config, UserProps extends ExtractPropsFromConfig<UserConfig> = ExtractPropsFromConfig<UserConfig>, UserRootProps extends ExtractRootPropsFromConfig<UserConfig> = ExtractRootPropsFromConfig<UserConfig>, UserData extends Data<UserProps, UserRootProps> | Data = Data<UserProps, UserRootProps>>({ children, config, data: initialData, ui: initialUi, onChange, onPublish, onAction, permissions, plugins, overrides, renderHeader, renderHeaderActions, headerTitle, headerPath, viewports, iframe: _iframe, dnd, initialHistory, }: {
163
+ children?: ReactNode;
164
+ config: UserConfig;
165
+ data: Partial<UserData>;
166
+ ui?: Partial<UiState>;
167
+ onChange?: (data: UserData) => void;
168
+ onPublish?: (data: UserData) => void;
169
+ onAction?: OnAction<UserData>;
170
+ permissions?: Partial<Permissions>;
171
+ plugins?: Plugin[];
172
+ overrides?: Partial<Overrides>;
173
+ renderHeader?: (props: {
174
+ children: ReactNode;
175
+ dispatch: (action: PuckAction) => void;
176
+ state: AppState<UserData>;
177
+ }) => ReactElement;
178
+ renderHeaderActions?: (props: {
179
+ state: AppState<UserData>;
180
+ dispatch: (action: PuckAction) => void;
181
+ }) => ReactElement;
182
+ headerTitle?: string;
183
+ headerPath?: string;
184
+ viewports?: Viewports;
185
+ iframe?: IframeConfig;
186
+ dnd?: {
187
+ disableAutoScroll?: boolean;
188
+ };
189
+ initialHistory?: {
190
+ histories: History<any>[];
191
+ index: number;
192
+ };
193
+ }): react_jsx_runtime.JSX.Element;
194
+ declare namespace Puck {
195
+ var Components: () => react_jsx_runtime.JSX.Element;
196
+ var Fields: () => react_jsx_runtime.JSX.Element;
197
+ var Outline: () => react_jsx_runtime.JSX.Element;
198
+ var Preview: ({ id }: {
199
+ id?: string;
200
+ }) => react_jsx_runtime.JSX.Element;
201
+ }
202
+
203
+ declare function Render<UserConfig extends Config = Config, UserProps extends ExtractPropsFromConfig<UserConfig> = ExtractPropsFromConfig<UserConfig>, UserRootProps extends ExtractRootPropsFromConfig<UserConfig> = ExtractRootPropsFromConfig<UserConfig>, UserData extends Data<UserProps, UserRootProps> | Data = Data<UserProps, UserRootProps>>({ config, data }: {
204
+ config: UserConfig;
205
+ data: Partial<UserData>;
206
+ }): react_jsx_runtime.JSX.Element;
207
+
208
+ declare function migrate(data: Data): Data;
209
+
210
+ type PropTransform<Props extends DefaultComponentProps = DefaultComponentProps, RootProps extends DefaultComponentProps = DefaultRootFieldProps> = Partial<{
211
+ [ComponentName in keyof Props]: (props: Props[ComponentName] & {
212
+ [key: string]: any;
213
+ }) => Props[ComponentName];
214
+ } & {
215
+ root: (props: RootProps & {
216
+ [key: string]: any;
217
+ }) => RootProps;
218
+ }>;
219
+ declare function transformProps<Props extends DefaultComponentProps = DefaultComponentProps, RootProps extends DefaultComponentProps = DefaultRootFieldProps>(data: Partial<Data>, propTransforms: PropTransform<Props, RootProps>): Data;
220
+
221
+ declare function resolveAllData<Props extends DefaultComponentProps = DefaultComponentProps, RootProps extends Record<string, any> = DefaultRootFieldProps>(data: Partial<Data>, config: Config, onResolveStart?: (item: ComponentData) => void, onResolveEnd?: (item: ComponentData) => void): Promise<Data<Props, RootProps>>;
222
+
223
+ declare const usePuck: () => {
224
+ appState: AppState;
225
+ config: Config;
226
+ dispatch: (action: PuckAction) => void;
227
+ getPermissions: ({ item, type, }?: {
228
+ item?: ComponentData;
229
+ type?: keyof DefaultComponentProps;
230
+ }) => {
231
+ [x: string]: boolean | undefined;
232
+ drag?: boolean | undefined;
233
+ duplicate?: boolean | undefined;
234
+ delete?: boolean | undefined;
235
+ edit?: boolean | undefined;
236
+ insert?: boolean | undefined;
237
+ };
238
+ history: {
239
+ back: VoidFunction;
240
+ forward: VoidFunction;
241
+ setHistories: (histories: History[]) => void;
242
+ setHistoryIndex: (index: number) => void;
243
+ hasPast: boolean;
244
+ hasFuture: boolean;
245
+ histories: History<any>[];
246
+ index: number;
247
+ historyStore: HistoryStore | undefined;
248
+ };
249
+ selectedItem: ComponentData<any, string> | null;
250
+ };
251
+
252
+ export { Action, ActionBar, AppState, AutoField, AutoFieldPrivate, Button, ComponentData, Config, Data, DefaultComponentProps, DefaultRootFieldProps, Drawer, DropZone, DropZoneProvider, ExtractPropsFromConfig, ExtractRootPropsFromConfig, Field, FieldLabel, FieldLabelInternal, FieldProps, type FieldPropsInternal, type History, IconButton, IframeConfig, OnAction, Overrides, Permissions, Plugin, Puck, PuckAction, Render, UiState, Viewports, dropZoneContext, migrate, resolveAllData, transformProps, usePuck };