@simple-builder/react 1.0.15 → 1.0.17

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.
@@ -1,10 +1,10 @@
1
1
  'use client';
2
2
  'use strict';
3
3
 
4
- require('./chunk-DO2DIXEI.js');
5
- var chunkYUXA4HAL_js = require('./chunk-YUXA4HAL.js');
6
- var chunkVLRLE4MP_js = require('./chunk-VLRLE4MP.js');
7
- var React11 = require('react');
4
+ require('./chunk-2TW2TJGG.js');
5
+ var chunkIB3LYMKX_js = require('./chunk-IB3LYMKX.js');
6
+ var chunkW2LT4IQQ_js = require('./chunk-W2LT4IQQ.js');
7
+ var React12 = require('react');
8
8
  var lucideReact = require('lucide-react');
9
9
  var AlertDialogPrimitive = require('@radix-ui/react-alert-dialog');
10
10
  var PopoverPrimitive = require('@radix-ui/react-popover');
@@ -13,6 +13,7 @@ var reactHookForm = require('react-hook-form');
13
13
  var reactDayPicker = require('react-day-picker');
14
14
  var reactSlot = require('@radix-ui/react-slot');
15
15
  var LabelPrimitive = require('@radix-ui/react-label');
16
+ var SelectPrimitive = require('@radix-ui/react-select');
16
17
  var SwitchPrimitives = require('@radix-ui/react-switch');
17
18
  var zod$1 = require('@hookform/resolvers/zod');
18
19
  var zod = require('zod');
@@ -38,10 +39,11 @@ function _interopNamespace(e) {
38
39
  return Object.freeze(n);
39
40
  }
40
41
 
41
- var React11__namespace = /*#__PURE__*/_interopNamespace(React11);
42
+ var React12__namespace = /*#__PURE__*/_interopNamespace(React12);
42
43
  var AlertDialogPrimitive__namespace = /*#__PURE__*/_interopNamespace(AlertDialogPrimitive);
43
44
  var PopoverPrimitive__namespace = /*#__PURE__*/_interopNamespace(PopoverPrimitive);
44
45
  var LabelPrimitive__namespace = /*#__PURE__*/_interopNamespace(LabelPrimitive);
46
+ var SelectPrimitive__namespace = /*#__PURE__*/_interopNamespace(SelectPrimitive);
45
47
  var SwitchPrimitives__namespace = /*#__PURE__*/_interopNamespace(SwitchPrimitives);
46
48
  var TabsPrimitive__namespace = /*#__PURE__*/_interopNamespace(TabsPrimitive);
47
49
  var TogglePrimitive__namespace = /*#__PURE__*/_interopNamespace(TogglePrimitive);
@@ -50,10 +52,10 @@ var ScrollAreaPrimitive__namespace = /*#__PURE__*/_interopNamespace(ScrollAreaPr
50
52
  var AlertDialog = AlertDialogPrimitive__namespace.Root;
51
53
  var AlertDialogTrigger = AlertDialogPrimitive__namespace.Trigger;
52
54
  var AlertDialogPortal = AlertDialogPrimitive__namespace.Portal;
53
- var AlertDialogOverlay = React11__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ React11__namespace.createElement(
55
+ var AlertDialogOverlay = React12__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ React12__namespace.createElement(
54
56
  AlertDialogPrimitive__namespace.Overlay,
55
57
  {
56
- className: chunkVLRLE4MP_js.cn(
58
+ className: chunkW2LT4IQQ_js.cn(
57
59
  "sb-fixed sb-inset-0 sb-z-50 sb-bg-background/80 sb-backdrop-blur-sm data-[state=open]:sb-animate-in data-[state=closed]:sb-animate-out data-[state=closed]:sb-fade-out-0 data-[state=open]:sb-fade-in-0",
58
60
  className
59
61
  ),
@@ -62,11 +64,11 @@ var AlertDialogOverlay = React11__namespace.forwardRef(({ className, ...props },
62
64
  }
63
65
  ));
64
66
  AlertDialogOverlay.displayName = AlertDialogPrimitive__namespace.Overlay.displayName;
65
- var AlertDialogContent = React11__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ React11__namespace.createElement(AlertDialogPortal, null, /* @__PURE__ */ React11__namespace.createElement(AlertDialogOverlay, null), /* @__PURE__ */ React11__namespace.createElement(
67
+ var AlertDialogContent = React12__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ React12__namespace.createElement(AlertDialogPortal, null, /* @__PURE__ */ React12__namespace.createElement(AlertDialogOverlay, null), /* @__PURE__ */ React12__namespace.createElement(
66
68
  AlertDialogPrimitive__namespace.Content,
67
69
  {
68
70
  ref,
69
- className: chunkVLRLE4MP_js.cn(
71
+ className: chunkW2LT4IQQ_js.cn(
70
72
  "sb-fixed sb-font-roboto sb-left-[50%] sb-top-[50%] sb-z-50 sb-grid sb-w-full sb-max-w-lg sb-translate-x-[-50%] sb-translate-y-[-50%] sb-gap-4 sb-border sb-bg-background sb-p-6 sb-shadow-lg sb-duration-200 data-[state=open]:sb-animate-in data-[state=closed]:sb-animate-out data-[state=closed]:sb-fade-out-0 data-[state=open]:sb-fade-in-0 data-[state=closed]:sb-zoom-out-95 data-[state=open]:sb-zoom-in-95 data-[state=closed]:sb-slide-out-to-left-1/2 data-[state=closed]:sb-slide-out-to-top-[48%] data-[state=open]:sb-slide-in-from-left-1/2 data-[state=open]:sb-slide-in-from-top-[48%] sm:sb-rounded-lg",
71
73
  className
72
74
  ),
@@ -77,10 +79,10 @@ AlertDialogContent.displayName = AlertDialogPrimitive__namespace.Content.display
77
79
  var AlertDialogFooter = ({
78
80
  className,
79
81
  ...props
80
- }) => /* @__PURE__ */ React11__namespace.createElement(
82
+ }) => /* @__PURE__ */ React12__namespace.createElement(
81
83
  "div",
82
84
  {
83
- className: chunkVLRLE4MP_js.cn(
85
+ className: chunkW2LT4IQQ_js.cn(
84
86
  "sb-flex sb-flex-col-reverse sm:sb-flex-row sm:sb-justify-end sm:sb-space-x-2",
85
87
  className
86
88
  ),
@@ -88,39 +90,39 @@ var AlertDialogFooter = ({
88
90
  }
89
91
  );
90
92
  AlertDialogFooter.displayName = "AlertDialogFooter";
91
- var AlertDialogTitle = React11__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ React11__namespace.createElement(
93
+ var AlertDialogTitle = React12__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ React12__namespace.createElement(
92
94
  AlertDialogPrimitive__namespace.Title,
93
95
  {
94
96
  ref,
95
- className: chunkVLRLE4MP_js.cn("sb-text-lg sb-font-semibold", className),
97
+ className: chunkW2LT4IQQ_js.cn("sb-text-lg sb-font-semibold", className),
96
98
  ...props
97
99
  }
98
100
  ));
99
101
  AlertDialogTitle.displayName = AlertDialogPrimitive__namespace.Title.displayName;
100
- var AlertDialogDescription = React11__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ React11__namespace.createElement(
102
+ var AlertDialogDescription = React12__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ React12__namespace.createElement(
101
103
  AlertDialogPrimitive__namespace.Description,
102
104
  {
103
105
  ref,
104
- className: chunkVLRLE4MP_js.cn("sb-text-sm sb-text-muted-foreground", className),
106
+ className: chunkW2LT4IQQ_js.cn("sb-text-sm sb-text-muted-foreground", className),
105
107
  ...props
106
108
  }
107
109
  ));
108
110
  AlertDialogDescription.displayName = AlertDialogPrimitive__namespace.Description.displayName;
109
- var AlertDialogAction = React11__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ React11__namespace.createElement(
111
+ var AlertDialogAction = React12__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ React12__namespace.createElement(
110
112
  AlertDialogPrimitive__namespace.Action,
111
113
  {
112
114
  ref,
113
- className: chunkVLRLE4MP_js.cn(chunkYUXA4HAL_js.buttonVariants(), className),
115
+ className: chunkW2LT4IQQ_js.cn(chunkIB3LYMKX_js.buttonVariants(), className),
114
116
  ...props
115
117
  }
116
118
  ));
117
119
  AlertDialogAction.displayName = AlertDialogPrimitive__namespace.Action.displayName;
118
- var AlertDialogCancel = React11__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ React11__namespace.createElement(
120
+ var AlertDialogCancel = React12__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ React12__namespace.createElement(
119
121
  AlertDialogPrimitive__namespace.Cancel,
120
122
  {
121
123
  ref,
122
- className: chunkVLRLE4MP_js.cn(
123
- chunkYUXA4HAL_js.buttonVariants({ variant: "outline" }),
124
+ className: chunkW2LT4IQQ_js.cn(
125
+ chunkIB3LYMKX_js.buttonVariants({ variant: "outline" }),
124
126
  "sb-mt-2 sm:sb-mt-0",
125
127
  className
126
128
  ),
@@ -131,13 +133,13 @@ AlertDialogCancel.displayName = AlertDialogPrimitive__namespace.Cancel.displayNa
131
133
  var Popover = PopoverPrimitive__namespace.Root;
132
134
  var PopoverTrigger = PopoverPrimitive__namespace.Trigger;
133
135
  var PopoverClose = PopoverPrimitive__namespace.Close;
134
- var PopoverContent = React11__namespace.forwardRef(({ className, align = "center", sideOffset = 4, ...props }, ref) => /* @__PURE__ */ React11__namespace.createElement(PopoverPrimitive__namespace.Portal, null, /* @__PURE__ */ React11__namespace.createElement(
136
+ var PopoverContent = React12__namespace.forwardRef(({ className, align = "center", sideOffset = 4, ...props }, ref) => /* @__PURE__ */ React12__namespace.createElement(PopoverPrimitive__namespace.Portal, null, /* @__PURE__ */ React12__namespace.createElement(
135
137
  PopoverPrimitive__namespace.Content,
136
138
  {
137
139
  ref,
138
140
  align,
139
141
  sideOffset,
140
- className: chunkVLRLE4MP_js.cn(
142
+ className: chunkW2LT4IQQ_js.cn(
141
143
  "sb-z-50 sb-w-72 sb-font-roboto sb-rounded-md sb-border sb-bg-popover sb-p-4 sb-text-popover-foreground sb-shadow-md sb-outline-none data-[state=open]:sb-animate-in data-[state=closed]:sb-animate-out data-[state=closed]:sb-fade-out-0 data-[state=open]:sb-fade-in-0 data-[state=closed]:sb-zoom-out-95 data-[state=open]:sb-zoom-in-95 data-[side=bottom]:sb-slide-in-from-top-2 data-[side=left]:sb-slide-in-from-right-2 data-[side=right]:sb-slide-in-from-left-2 data-[side=top]:sb-slide-in-from-bottom-2",
142
144
  className
143
145
  ),
@@ -151,19 +153,19 @@ function Calendar({
151
153
  showOutsideDays = true,
152
154
  ...props
153
155
  }) {
154
- return /* @__PURE__ */ React11__namespace.createElement(
156
+ return /* @__PURE__ */ React12__namespace.createElement(
155
157
  reactDayPicker.DayPicker,
156
158
  {
157
159
  showOutsideDays,
158
- className: chunkVLRLE4MP_js.cn("sb-p-3 sb-font-roboto", className),
160
+ className: chunkW2LT4IQQ_js.cn("sb-p-3 sb-font-roboto", className),
159
161
  classNames: {
160
162
  months: "sb-flex sb-flex-col sm:sb-flex-row sb-space-y-4 sm:sb-space-x-4 sm:sb-space-y-0",
161
163
  month: "sb-space-y-4",
162
164
  caption: "sb-flex sb-justify-center sb-pt-1 sb-relative sb-items-center",
163
165
  caption_label: "sb-text-sm sb-font-medium",
164
166
  nav: "sb-space-x-1 sb-flex sb-items-center",
165
- nav_button: chunkVLRLE4MP_js.cn(
166
- chunkYUXA4HAL_js.buttonVariants({ variant: "outline" }),
167
+ nav_button: chunkW2LT4IQQ_js.cn(
168
+ chunkIB3LYMKX_js.buttonVariants({ variant: "outline" }),
167
169
  "sb-h-7 sb-w-7 sb-bg-transparent sb-p-0 sb-opacity-50 hover:sb-opacity-100"
168
170
  ),
169
171
  nav_button_previous: "sb-absolute sb-left-1",
@@ -172,12 +174,12 @@ function Calendar({
172
174
  head_row: "sb-flex",
173
175
  head_cell: "sb-text-muted-foreground sb-rounded-md sb-w-8 sb-font-normal sb-text-[0.8rem]",
174
176
  row: "sb-flex sb-w-full sb-mt-2",
175
- cell: chunkVLRLE4MP_js.cn(
177
+ cell: chunkW2LT4IQQ_js.cn(
176
178
  "sb-relative sb-p-0 sb-text-center sb-text-sm focus-within:sb-relative focus-within:sb-z-20 [&:has([aria-selected])]:sb-bg-accent [&:has([aria-selected].day-outside)]:sb-bg-accent/50 [&:has([aria-selected].day-range-end)]:sb-rounded-r-md",
177
179
  props.mode === "range" ? "[&:has(>.day-range-end)]:sb-rounded-r-md [&:has(>.day-range-start)]:sb-rounded-l-md first:[&:has([aria-selected])]:sb-rounded-l-md last:[&:has([aria-selected])]:sb-rounded-r-md" : "[&:has([aria-selected])]:sb-rounded-md"
178
180
  ),
179
- day: chunkVLRLE4MP_js.cn(
180
- chunkYUXA4HAL_js.buttonVariants({ variant: "ghost" }),
181
+ day: chunkW2LT4IQQ_js.cn(
182
+ chunkIB3LYMKX_js.buttonVariants({ variant: "ghost" }),
181
183
  "sb-h-8 sb-w-8 sb-p-0 sb-font-normal aria-selected:sb-opacity-100"
182
184
  ),
183
185
  day_range_start: "day-range-start",
@@ -191,8 +193,8 @@ function Calendar({
191
193
  ...classNames
192
194
  },
193
195
  components: {
194
- IconLeft: () => /* @__PURE__ */ React11__namespace.createElement(lucideReact.ChevronLeftIcon, { className: "sb-h-4 sb-w-4" }),
195
- IconRight: () => /* @__PURE__ */ React11__namespace.createElement(lucideReact.ChevronRightIcon, { className: "sb-h-4 sb-w-4" })
196
+ IconLeft: () => /* @__PURE__ */ React12__namespace.createElement(lucideReact.ChevronLeftIcon, { className: "sb-h-4 sb-w-4" }),
197
+ IconRight: () => /* @__PURE__ */ React12__namespace.createElement(lucideReact.ChevronRightIcon, { className: "sb-h-4 sb-w-4" })
196
198
  },
197
199
  ...props
198
200
  }
@@ -212,25 +214,25 @@ var ColorPicker = (props) => {
212
214
  "#009DD1",
213
215
  "#FF0000"
214
216
  ];
215
- return /* @__PURE__ */ React11__namespace.createElement(Popover, null, /* @__PURE__ */ React11__namespace.createElement(PopoverTrigger, { asChild: true }, /* @__PURE__ */ React11__namespace.createElement(
216
- chunkYUXA4HAL_js.Button,
217
+ return /* @__PURE__ */ React12__namespace.createElement(Popover, null, /* @__PURE__ */ React12__namespace.createElement(PopoverTrigger, { asChild: true }, /* @__PURE__ */ React12__namespace.createElement(
218
+ chunkIB3LYMKX_js.Button,
217
219
  {
218
220
  variant: "outline",
219
221
  size: "sm",
220
- className: chunkVLRLE4MP_js.cn(
222
+ className: chunkW2LT4IQQ_js.cn(
221
223
  "sb-justify-start sb-text-left sb-font-normal sb-normal-case sb-w-full",
222
224
  !color && "sb-text-muted-foreground",
223
225
  className
224
226
  )
225
227
  },
226
- /* @__PURE__ */ React11__namespace.createElement("div", { className: "sb-w-full sb-flex sb-items-center sb-gap-2" }, color ? /* @__PURE__ */ React11__namespace.createElement(
228
+ /* @__PURE__ */ React12__namespace.createElement("div", { className: "sb-w-full sb-flex sb-items-center sb-gap-2" }, color ? /* @__PURE__ */ React12__namespace.createElement(
227
229
  "div",
228
230
  {
229
231
  className: "sb-h-4 sb-w-4 sb-rounded !sb-bg-center !sb-bg-cover sb-transition-all sb-border",
230
232
  style: { background: color }
231
233
  }
232
- ) : /* @__PURE__ */ React11__namespace.createElement(lucideReact.PaintbrushIcon, { className: "sb-h-4 sb-w-4" }), /* @__PURE__ */ React11__namespace.createElement("div", { className: "sb-truncate sb-flex-1" }, color ? color : "Kies een kleur"))
233
- )), /* @__PURE__ */ React11__namespace.createElement(PopoverContent, { className: "sb-w-64 sb-p-4 sb-flex sb-flex-wrap sb-gap-1" }, colors.map((s) => /* @__PURE__ */ React11__namespace.createElement(
234
+ ) : /* @__PURE__ */ React12__namespace.createElement(lucideReact.PaintbrushIcon, { className: "sb-h-4 sb-w-4" }), /* @__PURE__ */ React12__namespace.createElement("div", { className: "sb-truncate sb-flex-1" }, color ? color : "Kies een kleur"))
235
+ )), /* @__PURE__ */ React12__namespace.createElement(PopoverContent, { className: "sb-w-64 sb-p-4 sb-flex sb-flex-wrap sb-gap-1" }, colors.map((s) => /* @__PURE__ */ React12__namespace.createElement(
234
236
  "div",
235
237
  {
236
238
  key: s,
@@ -240,10 +242,10 @@ var ColorPicker = (props) => {
240
242
  }
241
243
  ))));
242
244
  };
243
- var labelVariants = chunkVLRLE4MP_js.tv({
245
+ var labelVariants = chunkW2LT4IQQ_js.tv({
244
246
  base: "sb-text-sm sb-font-medium sb-font-roboto sb-leading-none peer-disabled:sb-cursor-not-allowed peer-disabled:sb-opacity-70"
245
247
  });
246
- var Label = React11__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ React11__namespace.createElement(
248
+ var Label = React12__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ React12__namespace.createElement(
247
249
  LabelPrimitive__namespace.Root,
248
250
  {
249
251
  ref,
@@ -255,17 +257,17 @@ Label.displayName = LabelPrimitive__namespace.Root.displayName;
255
257
 
256
258
  // src/components/ui/form.tsx
257
259
  var Form = reactHookForm.FormProvider;
258
- var FormFieldContext = React11__namespace.createContext(
260
+ var FormFieldContext = React12__namespace.createContext(
259
261
  {}
260
262
  );
261
263
  var FormField = ({
262
264
  ...props
263
265
  }) => {
264
- return /* @__PURE__ */ React11__namespace.createElement(FormFieldContext.Provider, { value: { name: props.name } }, /* @__PURE__ */ React11__namespace.createElement(reactHookForm.Controller, { ...props }));
266
+ return /* @__PURE__ */ React12__namespace.createElement(FormFieldContext.Provider, { value: { name: props.name } }, /* @__PURE__ */ React12__namespace.createElement(reactHookForm.Controller, { ...props }));
265
267
  };
266
268
  var useFormField = () => {
267
- const fieldContext = React11__namespace.useContext(FormFieldContext);
268
- const itemContext = React11__namespace.useContext(FormItemContext);
269
+ const fieldContext = React12__namespace.useContext(FormFieldContext);
270
+ const itemContext = React12__namespace.useContext(FormItemContext);
269
271
  const { getFieldState, formState } = reactHookForm.useFormContext();
270
272
  const fieldState = getFieldState(fieldContext.name, formState);
271
273
  if (!fieldContext) {
@@ -281,30 +283,30 @@ var useFormField = () => {
281
283
  ...fieldState
282
284
  };
283
285
  };
284
- var FormItemContext = React11__namespace.createContext(
286
+ var FormItemContext = React12__namespace.createContext(
285
287
  {}
286
288
  );
287
- var FormItem = React11__namespace.forwardRef(({ className, ...props }, ref) => {
288
- const id = React11__namespace.useId();
289
- return /* @__PURE__ */ React11__namespace.createElement(FormItemContext.Provider, { value: { id } }, /* @__PURE__ */ React11__namespace.createElement("div", { ref, className: chunkVLRLE4MP_js.cn("sb-space-y-2", className), ...props }));
289
+ var FormItem = React12__namespace.forwardRef(({ className, ...props }, ref) => {
290
+ const id = React12__namespace.useId();
291
+ return /* @__PURE__ */ React12__namespace.createElement(FormItemContext.Provider, { value: { id } }, /* @__PURE__ */ React12__namespace.createElement("div", { ref, className: chunkW2LT4IQQ_js.cn("sb-space-y-2", className), ...props }));
290
292
  });
291
293
  FormItem.displayName = "FormItem";
292
- var FormLabel = React11__namespace.forwardRef(({ className, ...props }, ref) => {
294
+ var FormLabel = React12__namespace.forwardRef(({ className, ...props }, ref) => {
293
295
  const { error, formItemId } = useFormField();
294
- return /* @__PURE__ */ React11__namespace.createElement(
296
+ return /* @__PURE__ */ React12__namespace.createElement(
295
297
  Label,
296
298
  {
297
299
  ref,
298
- className: chunkVLRLE4MP_js.cn(error && "sb-text-destructive", className),
300
+ className: chunkW2LT4IQQ_js.cn(error && "sb-text-destructive", className),
299
301
  htmlFor: formItemId,
300
302
  ...props
301
303
  }
302
304
  );
303
305
  });
304
306
  FormLabel.displayName = "FormLabel";
305
- var FormControl = React11__namespace.forwardRef(({ ...props }, ref) => {
307
+ var FormControl = React12__namespace.forwardRef(({ ...props }, ref) => {
306
308
  const { error, formItemId, formDescriptionId, formMessageId } = useFormField();
307
- return /* @__PURE__ */ React11__namespace.createElement(
309
+ return /* @__PURE__ */ React12__namespace.createElement(
308
310
  reactSlot.Slot,
309
311
  {
310
312
  ref,
@@ -316,14 +318,14 @@ var FormControl = React11__namespace.forwardRef(({ ...props }, ref) => {
316
318
  );
317
319
  });
318
320
  FormControl.displayName = "FormControl";
319
- var FormDescription = React11__namespace.forwardRef(({ className, ...props }, ref) => {
321
+ var FormDescription = React12__namespace.forwardRef(({ className, ...props }, ref) => {
320
322
  const { formDescriptionId } = useFormField();
321
- return /* @__PURE__ */ React11__namespace.createElement(
323
+ return /* @__PURE__ */ React12__namespace.createElement(
322
324
  "p",
323
325
  {
324
326
  ref,
325
327
  id: formDescriptionId,
326
- className: chunkVLRLE4MP_js.cn(
328
+ className: chunkW2LT4IQQ_js.cn(
327
329
  "sb-text-sm sb-font-roboto sb-text-muted-foreground",
328
330
  className
329
331
  ),
@@ -332,18 +334,18 @@ var FormDescription = React11__namespace.forwardRef(({ className, ...props }, re
332
334
  );
333
335
  });
334
336
  FormDescription.displayName = "FormDescription";
335
- var FormMessage = React11__namespace.forwardRef(({ className, children, ...props }, ref) => {
337
+ var FormMessage = React12__namespace.forwardRef(({ className, children, ...props }, ref) => {
336
338
  const { error, formMessageId } = useFormField();
337
339
  const body = error ? String(error?.message) : children;
338
340
  if (!body) {
339
341
  return null;
340
342
  }
341
- return /* @__PURE__ */ React11__namespace.createElement(
343
+ return /* @__PURE__ */ React12__namespace.createElement(
342
344
  "p",
343
345
  {
344
346
  ref,
345
347
  id: formMessageId,
346
- className: chunkVLRLE4MP_js.cn(
348
+ className: chunkW2LT4IQQ_js.cn(
347
349
  "sb-text-sm sb-font-roboto sb-font-medium sb-text-destructive",
348
350
  className
349
351
  ),
@@ -353,13 +355,13 @@ var FormMessage = React11__namespace.forwardRef(({ className, children, ...props
353
355
  );
354
356
  });
355
357
  FormMessage.displayName = "FormMessage";
356
- var Input = React11__namespace.forwardRef(
358
+ var Input = React12__namespace.forwardRef(
357
359
  ({ className, type, ...props }, ref) => {
358
- return /* @__PURE__ */ React11__namespace.createElement(
360
+ return /* @__PURE__ */ React12__namespace.createElement(
359
361
  "input",
360
362
  {
361
363
  type,
362
- className: chunkVLRLE4MP_js.cn(
364
+ className: chunkW2LT4IQQ_js.cn(
363
365
  "sb-flex sb-h-8 sb-w-full sb-font-roboto sb-rounded-md sb-border sb-border-input sb-bg-background sb-px-3 sb-py-1 sb-text-sm sb-ring-offset-background file:sb-border-0 file:sb-bg-transparent file:sb-text-sm file:sb-font-medium placeholder:sb-text-muted-foreground focus-visible:sb-outline-none focus-visible:sb-ring-1 focus-visible:ring-sb-ring focus-visible:sb-ring-offset-2 disabled:sb-cursor-not-allowed disabled:sb-opacity-50",
364
366
  className
365
367
  ),
@@ -370,19 +372,19 @@ var Input = React11__namespace.forwardRef(
370
372
  }
371
373
  );
372
374
  Input.displayName = "Input";
373
- var AdvancedInput = React11__namespace.forwardRef(
375
+ var AdvancedInput = React12__namespace.forwardRef(
374
376
  ({ prepend, append, ...props }, ref) => {
375
- return /* @__PURE__ */ React11__namespace.createElement("div", { className: "sb-relative" }, /* @__PURE__ */ React11__namespace.createElement(Input, { ref, className: "sb-pl-9 sb-pr-7 sb-text-right", ...props }), prepend && /* @__PURE__ */ React11__namespace.createElement("div", { className: "sb-absolute sb-font-roboto sb-top-1/2 sb-left-3 sb--translate-y-1/2" }, prepend), append && /* @__PURE__ */ React11__namespace.createElement("div", { className: "sb-absolute sb-font-roboto sb-top-1/2 sb-right-3 sb--translate-y-1/2" }, append));
377
+ return /* @__PURE__ */ React12__namespace.createElement("div", { className: "sb-relative" }, /* @__PURE__ */ React12__namespace.createElement(Input, { ref, className: "sb-pl-9 sb-pr-7 sb-text-right", ...props }), prepend && /* @__PURE__ */ React12__namespace.createElement("div", { className: "sb-absolute sb-font-roboto sb-top-1/2 sb-left-3 sb--translate-y-1/2" }, prepend), append && /* @__PURE__ */ React12__namespace.createElement("div", { className: "sb-absolute sb-font-roboto sb-top-1/2 sb-right-3 sb--translate-y-1/2" }, append));
376
378
  }
377
379
  );
378
380
  AdvancedInput.displayName = "AdvancedInput";
379
381
  var MediaInput = (props) => {
380
382
  const { onFilesChange, limit = 32, multiple = false, onError } = props;
381
- const id = React11__namespace.useId();
382
- const [queue, setQueue] = React11__namespace.useState([]);
383
- const [sources, setSources] = React11__namespace.useState(props.files ?? []);
383
+ const id = React12__namespace.useId();
384
+ const [queue, setQueue] = React12__namespace.useState([]);
385
+ const [sources, setSources] = React12__namespace.useState(props.files ?? []);
384
386
  const maxConcurrentUploads = 3;
385
- const uploadingCountRef = React11__namespace.useRef(0);
387
+ const uploadingCountRef = React12__namespace.useRef(0);
386
388
  const handleFilesAdd = async (e) => {
387
389
  const files = e.target.files;
388
390
  if (!files || files.length === 0) {
@@ -453,42 +455,42 @@ var MediaInput = (props) => {
453
455
  body: JSON.stringify({ src })
454
456
  });
455
457
  };
456
- return /* @__PURE__ */ React11__namespace.createElement("div", { className: chunkVLRLE4MP_js.cn("flex flex-wrap gap-4", props.className) }, sources.map((src) => /* @__PURE__ */ React11__namespace.createElement(MediaInputItem, { key: src, className: chunkVLRLE4MP_js.cn("group", props.itemClassName) }, /* @__PURE__ */ React11__namespace.createElement(
457
- chunkVLRLE4MP_js.Image,
458
+ return /* @__PURE__ */ React12__namespace.createElement("div", { className: chunkW2LT4IQQ_js.cn("flex flex-wrap gap-4", props.className) }, sources.map((src) => /* @__PURE__ */ React12__namespace.createElement(MediaInputItem, { key: src, className: chunkW2LT4IQQ_js.cn("group", props.itemClassName) }, /* @__PURE__ */ React12__namespace.createElement(
459
+ chunkW2LT4IQQ_js.Image,
458
460
  {
459
461
  src,
460
462
  alt: "",
461
463
  fill: true,
462
464
  className: "sb-absolute sb-inset-0 sb-object-cover sb-pointer-events-none"
463
465
  }
464
- ), /* @__PURE__ */ React11__namespace.createElement("div", { className: "sb-absolute sb-right-1 sb-top-1 sb-z-30 sb-flex sb-items-center sb-justify-end sb-gap-3 sb-opacity-0 sb-transition-opacity group-hover:sb-opacity-100" }, /* @__PURE__ */ React11__namespace.createElement(
466
+ ), /* @__PURE__ */ React12__namespace.createElement("div", { className: "sb-absolute sb-right-1 sb-top-1 sb-z-30 sb-flex sb-items-center sb-justify-end sb-gap-3 sb-opacity-0 sb-transition-opacity group-hover:sb-opacity-100" }, /* @__PURE__ */ React12__namespace.createElement(
465
467
  "button",
466
468
  {
467
469
  className: "sb-flex sb-h-8 sb-w-8 sb-items-center sb-justify-center sb-rounded-full sb-border sb-bg-secondary sb-text-secondary-foreground sb-opacity-90 sb-shadow sb-transition-opacity hover:sb-opacity-100",
468
470
  onClick: () => handleSourceDelete(src)
469
471
  },
470
- /* @__PURE__ */ React11__namespace.createElement(lucideReact.Trash2Icon, { className: "sb-h-4 sb-w-4" })
471
- )))), queue.map((_, i) => /* @__PURE__ */ React11__namespace.createElement(
472
+ /* @__PURE__ */ React12__namespace.createElement(lucideReact.Trash2Icon, { className: "sb-h-4 sb-w-4" })
473
+ )))), queue.map((_, i) => /* @__PURE__ */ React12__namespace.createElement(
472
474
  MediaInputItem,
473
475
  {
474
476
  key: i,
475
- className: chunkVLRLE4MP_js.cn(
477
+ className: chunkW2LT4IQQ_js.cn(
476
478
  "sb-flex sb-h-28 sb-w-28 sb-items-center sb-justify-center",
477
479
  props.itemClassName
478
480
  )
479
481
  },
480
- /* @__PURE__ */ React11__namespace.createElement(lucideReact.Loader2Icon, { className: "sb-h-6 sb-w-6 sb-animate-spin" })
481
- )), multiple || !multiple && !sources.length && !queue.length ? /* @__PURE__ */ React11__namespace.createElement(
482
+ /* @__PURE__ */ React12__namespace.createElement(lucideReact.Loader2Icon, { className: "sb-h-6 sb-w-6 sb-animate-spin" })
483
+ )), multiple || !multiple && !sources.length && !queue.length ? /* @__PURE__ */ React12__namespace.createElement(
482
484
  "label",
483
485
  {
484
486
  htmlFor: id,
485
- className: chunkVLRLE4MP_js.cn(
487
+ className: chunkW2LT4IQQ_js.cn(
486
488
  "sb-flex sb-h-28 sb-w-28 sb-cursor-pointer sb-items-center sb-justify-center sb-rounded-lg sb-border",
487
489
  props.itemClassName
488
490
  )
489
491
  },
490
- /* @__PURE__ */ React11__namespace.createElement(lucideReact.PlusIcon, { className: "sb-h-6 sb-w-6" }),
491
- /* @__PURE__ */ React11__namespace.createElement(
492
+ /* @__PURE__ */ React12__namespace.createElement(lucideReact.PlusIcon, { className: "sb-h-6 sb-w-6" }),
493
+ /* @__PURE__ */ React12__namespace.createElement(
492
494
  "input",
493
495
  {
494
496
  id,
@@ -502,10 +504,10 @@ var MediaInput = (props) => {
502
504
  ) : null);
503
505
  };
504
506
  var MediaInputItem = (props) => {
505
- return /* @__PURE__ */ React11__namespace.createElement(
507
+ return /* @__PURE__ */ React12__namespace.createElement(
506
508
  "div",
507
509
  {
508
- className: chunkVLRLE4MP_js.cn(
510
+ className: chunkW2LT4IQQ_js.cn(
509
511
  "sb-relative sb-h-28 sb-w-28 sb-overflow-hidden sb-rounded-lg sb-border",
510
512
  props.className
511
513
  )
@@ -522,32 +524,135 @@ var MediaInputError = class extends Error {
522
524
  this.description = description;
523
525
  }
524
526
  };
525
- var Switch = React11__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ React11__namespace.createElement(
527
+ var Select = SelectPrimitive__namespace.Root;
528
+ var SelectValue = SelectPrimitive__namespace.Value;
529
+ var SelectTrigger = React12__namespace.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ React12__namespace.createElement(
530
+ SelectPrimitive__namespace.Trigger,
531
+ {
532
+ ref,
533
+ className: chunkW2LT4IQQ_js.cn(
534
+ "sb-flex sb-h-10 sb-w-full sb-items-center sb-justify-between sb-rounded-md sb-border sb-border-input sb-bg-background sb-px-3 sb-py-2 sb-text-sm sb-ring-offset-background placeholder:sb-text-muted-foreground focus:sb-outline-none focus:sb-ring-2 focus:sb-ring-ring focus:sb-ring-offset-2 disabled:sb-cursor-not-allowed disabled:sb-opacity-50 [&>span]:sb-line-clamp-1",
535
+ className
536
+ ),
537
+ ...props
538
+ },
539
+ children,
540
+ /* @__PURE__ */ React12__namespace.createElement(SelectPrimitive__namespace.Icon, { asChild: true }, /* @__PURE__ */ React12__namespace.createElement(lucideReact.ChevronDown, { className: "sb-h-4 sb-w-4 sb-opacity-50" }))
541
+ ));
542
+ SelectTrigger.displayName = SelectPrimitive__namespace.Trigger.displayName;
543
+ var SelectScrollUpButton = React12__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ React12__namespace.createElement(
544
+ SelectPrimitive__namespace.ScrollUpButton,
545
+ {
546
+ ref,
547
+ className: chunkW2LT4IQQ_js.cn(
548
+ "sb-flex sb-cursor-default sb-items-center sb-justify-center sb-py-1",
549
+ className
550
+ ),
551
+ ...props
552
+ },
553
+ /* @__PURE__ */ React12__namespace.createElement(lucideReact.ChevronUp, { className: "sb-h-4 sb-w-4" })
554
+ ));
555
+ SelectScrollUpButton.displayName = SelectPrimitive__namespace.ScrollUpButton.displayName;
556
+ var SelectScrollDownButton = React12__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ React12__namespace.createElement(
557
+ SelectPrimitive__namespace.ScrollDownButton,
558
+ {
559
+ ref,
560
+ className: chunkW2LT4IQQ_js.cn(
561
+ "sb-flex sb-cursor-default sb-items-center sb-justify-center sb-py-1",
562
+ className
563
+ ),
564
+ ...props
565
+ },
566
+ /* @__PURE__ */ React12__namespace.createElement(lucideReact.ChevronDown, { className: "sb-h-4 sb-w-4" })
567
+ ));
568
+ SelectScrollDownButton.displayName = SelectPrimitive__namespace.ScrollDownButton.displayName;
569
+ var SelectContent = React12__namespace.forwardRef(({ className, children, position = "popper", ...props }, ref) => /* @__PURE__ */ React12__namespace.createElement(SelectPrimitive__namespace.Portal, null, /* @__PURE__ */ React12__namespace.createElement(
570
+ SelectPrimitive__namespace.Content,
571
+ {
572
+ ref,
573
+ className: chunkW2LT4IQQ_js.cn(
574
+ "sb-relative sb-z-50 sb-max-h-96 sb-min-w-[8rem] sb-overflow-hidden sb-rounded-md sb-border sb-bg-popover sb-text-popover-foreground sb-shadow-md data-[state=open]:sb-animate-in data-[state=closed]:sb-animate-out data-[state=closed]:sb-fade-out-0 data-[state=open]:sb-fade-in-0 data-[state=closed]:sb-zoom-out-95 data-[state=open]:sb-zoom-in-95 data-[side=bottom]:sb-slide-in-from-top-2 data-[side=left]:sb-slide-in-from-right-2 data-[side=right]:sb-slide-in-from-left-2 data-[side=top]:sb-slide-in-from-bottom-2",
575
+ position === "popper" && "data-[side=bottom]:sb-translate-y-1 data-[side=left]:sb--translate-x-1 data-[side=right]:sb-translate-x-1 data-[side=top]:sb--translate-y-1",
576
+ className
577
+ ),
578
+ position,
579
+ ...props
580
+ },
581
+ /* @__PURE__ */ React12__namespace.createElement(SelectScrollUpButton, null),
582
+ /* @__PURE__ */ React12__namespace.createElement(
583
+ SelectPrimitive__namespace.Viewport,
584
+ {
585
+ className: chunkW2LT4IQQ_js.cn(
586
+ "sb-p-1",
587
+ position === "popper" && "sb-h-[var(--radix-select-trigger-height)] sb-w-full sb-min-w-[var(--radix-select-trigger-width)]"
588
+ )
589
+ },
590
+ children
591
+ ),
592
+ /* @__PURE__ */ React12__namespace.createElement(SelectScrollDownButton, null)
593
+ )));
594
+ SelectContent.displayName = SelectPrimitive__namespace.Content.displayName;
595
+ var SelectLabel = React12__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ React12__namespace.createElement(
596
+ SelectPrimitive__namespace.Label,
597
+ {
598
+ ref,
599
+ className: chunkW2LT4IQQ_js.cn(
600
+ "sb-py-1.5 sb-pl-8 sb-pr-2 sb-text-sm sb-font-semibold",
601
+ className
602
+ ),
603
+ ...props
604
+ }
605
+ ));
606
+ SelectLabel.displayName = SelectPrimitive__namespace.Label.displayName;
607
+ var SelectItem = React12__namespace.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ React12__namespace.createElement(
608
+ SelectPrimitive__namespace.Item,
609
+ {
610
+ ref,
611
+ className: chunkW2LT4IQQ_js.cn(
612
+ "sb-relative sb-flex sb-w-full sb-cursor-default sb-select-none sb-items-center sb-rounded-sm sb-py-1.5 sb-pl-8 sb-pr-2 sb-text-sm sb-outline-none focus:sb-bg-accent focus:sb-text-accent-foreground data-[disabled]:sb-pointer-events-none data-[disabled]:sb-opacity-50",
613
+ className
614
+ ),
615
+ ...props
616
+ },
617
+ /* @__PURE__ */ React12__namespace.createElement("span", { className: "sb-absolute sb-left-2 sb-flex sb-h-3.5 sb-w-3.5 sb-items-center sb-justify-center" }, /* @__PURE__ */ React12__namespace.createElement(SelectPrimitive__namespace.ItemIndicator, null, /* @__PURE__ */ React12__namespace.createElement(lucideReact.Check, { className: "sb-h-4 sb-w-4" }))),
618
+ /* @__PURE__ */ React12__namespace.createElement(SelectPrimitive__namespace.ItemText, null, children)
619
+ ));
620
+ SelectItem.displayName = SelectPrimitive__namespace.Item.displayName;
621
+ var SelectSeparator = React12__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ React12__namespace.createElement(
622
+ SelectPrimitive__namespace.Separator,
623
+ {
624
+ ref,
625
+ className: chunkW2LT4IQQ_js.cn("sb--mx-1 sb-my-1 sb-h-px sb-bg-muted", className),
626
+ ...props
627
+ }
628
+ ));
629
+ SelectSeparator.displayName = SelectPrimitive__namespace.Separator.displayName;
630
+ var Switch = React12__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ React12__namespace.createElement(
526
631
  SwitchPrimitives__namespace.Root,
527
632
  {
528
- className: chunkVLRLE4MP_js.cn(
633
+ className: chunkW2LT4IQQ_js.cn(
529
634
  "peer sb-inline-flex sb-h-6 sb-w-11 sb-shrink-0 sb-cursor-pointer sb-items-center sb-rounded-full sb-border-2 sb-border-transparent sb-transition-colors focus-visible:sb-outline-none focus-visible:sb-ring-2 focus-visible:sb-ring-ring focus-visible:sb-ring-offset-2 focus-visible:sb-ring-offset-background disabled:sb-cursor-not-allowed disabled:sb-opacity-50 data-[state=checked]:sb-bg-primary data-[state=unchecked]:sb-bg-input",
530
635
  className
531
636
  ),
532
637
  ...props,
533
638
  ref
534
639
  },
535
- /* @__PURE__ */ React11__namespace.createElement(
640
+ /* @__PURE__ */ React12__namespace.createElement(
536
641
  SwitchPrimitives__namespace.Thumb,
537
642
  {
538
- className: chunkVLRLE4MP_js.cn(
643
+ className: chunkW2LT4IQQ_js.cn(
539
644
  "sb-pointer-events-none sb-block sb-h-5 sb-w-5 sb-rounded-full sb-bg-background sb-shadow-lg sb-ring-0 sb-transition-transform data-[state=checked]:sb-translate-x-5 data-[state=unchecked]:sb-translate-x-0"
540
645
  )
541
646
  }
542
647
  )
543
648
  ));
544
649
  Switch.displayName = SwitchPrimitives__namespace.Root.displayName;
545
- var Textarea = React11__namespace.forwardRef(
650
+ var Textarea = React12__namespace.forwardRef(
546
651
  ({ className, ...props }, ref) => {
547
- return /* @__PURE__ */ React11__namespace.createElement(
652
+ return /* @__PURE__ */ React12__namespace.createElement(
548
653
  "textarea",
549
654
  {
550
- className: chunkVLRLE4MP_js.cn(
655
+ className: chunkW2LT4IQQ_js.cn(
551
656
  "sb-flex sb-min-h-[60px] sb-font-roboto sb-w-full sb-rounded-md sb-border sb-border-input sb-bg-transparent sb-px-3 sb-py-2 sb-text-sm sb-shadow-sm placeholder:sb-text-muted-foreground focus-visible:sb-outline-none focus-visible:sb-ring-1 focus-visible:sb-ring-ring disabled:sb-cursor-not-allowed disabled:sb-opacity-50",
552
657
  className
553
658
  ),
@@ -562,8 +667,8 @@ Textarea.displayName = "Textarea";
562
667
  // src/components/container-item-form.tsx
563
668
  var ContainerItemForm = (props) => {
564
669
  const { item } = props;
565
- const { patchItem } = chunkYUXA4HAL_js.useBuilder();
566
- const component = chunkVLRLE4MP_js.builder.getComponent(item.component);
670
+ const { patchItem } = chunkIB3LYMKX_js.useBuilder();
671
+ const component = chunkW2LT4IQQ_js.builder.getComponent(item.component);
567
672
  if (!component) {
568
673
  throw new Error(
569
674
  `[simple-builder]: Component with id ${item.component} not found in container item form component`
@@ -583,11 +688,11 @@ var ContainerItemForm = (props) => {
583
688
  props: values
584
689
  });
585
690
  };
586
- React11__namespace.useEffect(() => {
691
+ React12__namespace.useEffect(() => {
587
692
  const subscription = form.watch(() => form.handleSubmit(onSubmit)());
588
693
  return () => subscription.unsubscribe();
589
694
  }, [form.watch, form.handleSubmit]);
590
- return /* @__PURE__ */ React11__namespace.createElement(Form, { ...form }, /* @__PURE__ */ React11__namespace.createElement("form", { onSubmit: form.handleSubmit(onSubmit) }, /* @__PURE__ */ React11__namespace.createElement("div", { className: "sb-space-y-4 sb-p-4" }, (component.inputs || []).map((input) => /* @__PURE__ */ React11__namespace.createElement(
695
+ return /* @__PURE__ */ React12__namespace.createElement(Form, { ...form }, /* @__PURE__ */ React12__namespace.createElement("form", { onSubmit: form.handleSubmit(onSubmit) }, /* @__PURE__ */ React12__namespace.createElement("div", { className: "sb-space-y-4 sb-p-4" }, (component.inputs || []).map((input) => /* @__PURE__ */ React12__namespace.createElement(
591
696
  RenderFormField,
592
697
  {
593
698
  key: input.name,
@@ -604,16 +709,16 @@ var RenderFormField = (props) => {
604
709
  name: input.name
605
710
  });
606
711
  if (input.multiple) {
607
- return /* @__PURE__ */ React11__namespace.createElement("fieldset", { className: "sb-space-y-2" }, /* @__PURE__ */ React11__namespace.createElement(FormLabel, null, input.friendlyName || input.name), /* @__PURE__ */ React11__namespace.createElement("div", { className: "sb-space-y-4" }, fieldArray.fields.map(
608
- (field, i) => type !== "grouped" ? /* @__PURE__ */ React11__namespace.createElement(
712
+ return /* @__PURE__ */ React12__namespace.createElement("fieldset", { className: "sb-space-y-2" }, /* @__PURE__ */ React12__namespace.createElement(FormLabel, null, input.friendlyName || input.name), /* @__PURE__ */ React12__namespace.createElement("div", { className: "sb-space-y-4" }, fieldArray.fields.map(
713
+ (field, i) => type !== "grouped" ? /* @__PURE__ */ React12__namespace.createElement(
609
714
  FormField,
610
715
  {
611
716
  key: field.id,
612
717
  control: form.control,
613
718
  name: `${input.name}.${i}`,
614
- render: ({ field: field2 }) => /* @__PURE__ */ React11__namespace.createElement("div", { className: "sb-flex sb-items-center sb-gap-3" }, /* @__PURE__ */ React11__namespace.createElement(RenderInput, { field: field2, type: input.type }), /* @__PURE__ */ React11__namespace.createElement("button", { type: "button", onClick: () => fieldArray.remove(i) }, /* @__PURE__ */ React11__namespace.createElement(lucideReact.XIcon, { className: "sb-h-4 sb-w-4" })))
719
+ render: ({ field: field2 }) => /* @__PURE__ */ React12__namespace.createElement("div", { className: "sb-flex sb-items-center sb-gap-3" }, /* @__PURE__ */ React12__namespace.createElement(RenderInput, { field: field2, type: input.type }), /* @__PURE__ */ React12__namespace.createElement("button", { type: "button", onClick: () => fieldArray.remove(i) }, /* @__PURE__ */ React12__namespace.createElement(lucideReact.XIcon, { className: "sb-h-4 sb-w-4" })))
615
720
  }
616
- ) : /* @__PURE__ */ React11__namespace.createElement("div", { className: "sb-flex sb-items-center sb-relative" }, /* @__PURE__ */ React11__namespace.createElement(
721
+ ) : /* @__PURE__ */ React12__namespace.createElement("div", { className: "sb-flex sb-items-center sb-relative" }, /* @__PURE__ */ React12__namespace.createElement(
617
722
  RenderFormField,
618
723
  {
619
724
  key: field.id,
@@ -626,28 +731,28 @@ var RenderFormField = (props) => {
626
731
  friendlyName: ""
627
732
  }
628
733
  }
629
- ), /* @__PURE__ */ React11__namespace.createElement(
734
+ ), /* @__PURE__ */ React12__namespace.createElement(
630
735
  "button",
631
736
  {
632
737
  type: "button",
633
738
  onClick: () => fieldArray.remove(i),
634
739
  className: "sb-absolute sb-top-2 sb-right-2 sb-text-foreground/70 hover:sb-text-foreground"
635
740
  },
636
- /* @__PURE__ */ React11__namespace.createElement(lucideReact.XIcon, { className: "sb-h-4 sb-w-4" })
741
+ /* @__PURE__ */ React12__namespace.createElement(lucideReact.XIcon, { className: "sb-h-4 sb-w-4" })
637
742
  ))
638
- ), /* @__PURE__ */ React11__namespace.createElement(
639
- chunkYUXA4HAL_js.Button,
743
+ ), /* @__PURE__ */ React12__namespace.createElement(
744
+ chunkIB3LYMKX_js.Button,
640
745
  {
641
746
  type: "button",
642
747
  variant: "outline",
643
748
  size: "sm",
644
- className: chunkVLRLE4MP_js.cn(
749
+ className: chunkW2LT4IQQ_js.cn(
645
750
  "sb-w-[89%] sb-border-2 sb-border-dashed sb-text-muted-foreground",
646
751
  type === "grouped" && "sb-w-full"
647
752
  ),
648
753
  onClick: () => fieldArray.append(void 0)
649
754
  },
650
- /* @__PURE__ */ React11__namespace.createElement(lucideReact.PlusCircleIcon, { className: "sb-h-4 sb-w-4" })
755
+ /* @__PURE__ */ React12__namespace.createElement(lucideReact.PlusCircleIcon, { className: "sb-h-4 sb-w-4" })
651
756
  )));
652
757
  }
653
758
  switch (type) {
@@ -658,27 +763,27 @@ var RenderFormField = (props) => {
658
763
  case "color":
659
764
  case "date":
660
765
  case "file":
661
- return /* @__PURE__ */ React11__namespace.createElement(
766
+ return /* @__PURE__ */ React12__namespace.createElement(
662
767
  FormField,
663
768
  {
664
769
  key: input.name,
665
770
  control: form.control,
666
771
  name: input.name,
667
- render: ({ field }) => /* @__PURE__ */ React11__namespace.createElement(FormItem, null, /* @__PURE__ */ React11__namespace.createElement(FormLabel, null, input.friendlyName || input.name), /* @__PURE__ */ React11__namespace.createElement(FormControl, null, /* @__PURE__ */ React11__namespace.createElement(RenderInput, { type, field })), input.helperText && /* @__PURE__ */ React11__namespace.createElement(FormDescription, null, input.helperText), /* @__PURE__ */ React11__namespace.createElement(FormMessage, null))
772
+ render: ({ field }) => /* @__PURE__ */ React12__namespace.createElement(FormItem, null, /* @__PURE__ */ React12__namespace.createElement(FormLabel, null, input.friendlyName || input.name), /* @__PURE__ */ React12__namespace.createElement(FormControl, null, /* @__PURE__ */ React12__namespace.createElement(RenderInput, { type, field, options: input?.enum })), input.helperText && /* @__PURE__ */ React12__namespace.createElement(FormDescription, null, input.helperText), /* @__PURE__ */ React12__namespace.createElement(FormMessage, null))
668
773
  }
669
774
  );
670
775
  case "boolean":
671
- return /* @__PURE__ */ React11__namespace.createElement(
776
+ return /* @__PURE__ */ React12__namespace.createElement(
672
777
  FormField,
673
778
  {
674
779
  key: input.name,
675
780
  control: form.control,
676
781
  name: input.name,
677
- render: ({ field }) => /* @__PURE__ */ React11__namespace.createElement(FormItem, { className: "sb-flex sb-flex-row sb-items-center sb-justify-between sb-space-y-0" }, /* @__PURE__ */ React11__namespace.createElement(FormLabel, null, input.friendlyName || input.name), /* @__PURE__ */ React11__namespace.createElement(FormControl, null, /* @__PURE__ */ React11__namespace.createElement(RenderInput, { type, field })), input.helperText && /* @__PURE__ */ React11__namespace.createElement(FormDescription, null, input.helperText), /* @__PURE__ */ React11__namespace.createElement(FormMessage, null))
782
+ render: ({ field }) => /* @__PURE__ */ React12__namespace.createElement(FormItem, { className: "sb-flex sb-flex-row sb-items-center sb-justify-between sb-space-y-0" }, /* @__PURE__ */ React12__namespace.createElement(FormLabel, null, input.friendlyName || input.name), /* @__PURE__ */ React12__namespace.createElement(FormControl, null, /* @__PURE__ */ React12__namespace.createElement(RenderInput, { type, field })), input.helperText && /* @__PURE__ */ React12__namespace.createElement(FormDescription, null, input.helperText), /* @__PURE__ */ React12__namespace.createElement(FormMessage, null))
678
783
  }
679
784
  );
680
785
  case "grouped":
681
- return /* @__PURE__ */ React11__namespace.createElement("div", { className: "sb-space-y-2 sb-w-full" }, input.friendlyName !== "" && /* @__PURE__ */ React11__namespace.createElement(FormLabel, null, input.friendlyName || input.name), /* @__PURE__ */ React11__namespace.createElement("div", { className: "sb-space-y-2 sb-p-3 sb-w-full sb-border sb-rounded-lg" }, input.inputs.map((sub) => /* @__PURE__ */ React11__namespace.createElement(
786
+ return /* @__PURE__ */ React12__namespace.createElement("div", { className: "sb-space-y-2 sb-w-full" }, input.friendlyName !== "" && /* @__PURE__ */ React12__namespace.createElement(FormLabel, null, input.friendlyName || input.name), /* @__PURE__ */ React12__namespace.createElement("div", { className: "sb-space-y-2 sb-p-3 sb-w-full sb-border sb-rounded-lg" }, input.inputs.map((sub) => /* @__PURE__ */ React12__namespace.createElement(
682
787
  RenderFormField,
683
788
  {
684
789
  key: `${input.name}.${sub.name}`,
@@ -697,31 +802,33 @@ var RenderFormField = (props) => {
697
802
  }
698
803
  };
699
804
  var RenderInput = (props) => {
700
- const { type, field } = props;
805
+ const { type, options, field } = props;
701
806
  switch (type) {
702
807
  case "string":
703
- return /* @__PURE__ */ React11__namespace.createElement(Input, { ...field });
808
+ if (!options)
809
+ return /* @__PURE__ */ React12__namespace.createElement(Input, { ...field });
810
+ return /* @__PURE__ */ React12__namespace.createElement(Select, { onValueChange: field.onChange, defaultValue: field.value }, /* @__PURE__ */ React12__namespace.createElement(SelectTrigger, null, /* @__PURE__ */ React12__namespace.createElement(SelectValue, null)), /* @__PURE__ */ React12__namespace.createElement(SelectContent, null, options.map((option) => /* @__PURE__ */ React12__namespace.createElement(SelectItem, { key: option, value: option }, option))));
704
811
  case "longText":
705
812
  case "richText":
706
- return /* @__PURE__ */ React11__namespace.createElement(Textarea, { ...field });
813
+ return /* @__PURE__ */ React12__namespace.createElement(Textarea, { ...field });
707
814
  case "number":
708
- return /* @__PURE__ */ React11__namespace.createElement(Input, { type: "number", ...field });
815
+ return /* @__PURE__ */ React12__namespace.createElement(Input, { type: "number", ...field });
709
816
  case "color":
710
- return /* @__PURE__ */ React11__namespace.createElement(ColorPicker, { color: field.value, onColorChange: field.onChange });
817
+ return /* @__PURE__ */ React12__namespace.createElement(ColorPicker, { color: field.value, onColorChange: field.onChange });
711
818
  case "date":
712
- return /* @__PURE__ */ React11__namespace.createElement(Popover, null, /* @__PURE__ */ React11__namespace.createElement(PopoverTrigger, { asChild: true }, /* @__PURE__ */ React11__namespace.createElement(
713
- chunkYUXA4HAL_js.Button,
819
+ return /* @__PURE__ */ React12__namespace.createElement(Popover, null, /* @__PURE__ */ React12__namespace.createElement(PopoverTrigger, { asChild: true }, /* @__PURE__ */ React12__namespace.createElement(
820
+ chunkIB3LYMKX_js.Button,
714
821
  {
715
822
  variant: "outline",
716
823
  size: "sm",
717
- className: chunkVLRLE4MP_js.cn(
824
+ className: chunkW2LT4IQQ_js.cn(
718
825
  "sb-w-full sb-flex sb-justify-start sb-text-left sb-font-normal",
719
826
  !field.value && "sb-text-muted-foreground"
720
827
  )
721
828
  },
722
- /* @__PURE__ */ React11__namespace.createElement(lucideReact.CalendarIcon, { className: "sb-mr-2 sb-h-4 sb-w-4" }),
723
- field.value ? dateFns.format(field.value, "PPP") : /* @__PURE__ */ React11__namespace.createElement("span", null, "Pick a date")
724
- )), /* @__PURE__ */ React11__namespace.createElement(PopoverContent, { className: "sb-w-auto sb-p-0", align: "start" }, /* @__PURE__ */ React11__namespace.createElement(
829
+ /* @__PURE__ */ React12__namespace.createElement(lucideReact.CalendarIcon, { className: "sb-mr-2 sb-h-4 sb-w-4" }),
830
+ field.value && !Array.isArray(field.value) ? dateFns.format(field.value, "PPP") : /* @__PURE__ */ React12__namespace.createElement("span", null, "Pick a date")
831
+ )), /* @__PURE__ */ React12__namespace.createElement(PopoverContent, { className: "sb-w-auto sb-p-0", align: "start" }, /* @__PURE__ */ React12__namespace.createElement(
725
832
  Calendar,
726
833
  {
727
834
  mode: "single",
@@ -731,9 +838,9 @@ var RenderInput = (props) => {
731
838
  }
732
839
  )));
733
840
  case "boolean":
734
- return /* @__PURE__ */ React11__namespace.createElement(Switch, { checked: field.value, onCheckedChange: field.onChange });
841
+ return /* @__PURE__ */ React12__namespace.createElement(Switch, { checked: field.value, onCheckedChange: field.onChange });
735
842
  case "file":
736
- return /* @__PURE__ */ React11__namespace.createElement(
843
+ return /* @__PURE__ */ React12__namespace.createElement(
737
844
  MediaInput,
738
845
  {
739
846
  className: "sb-grid sb-grid-cols-2 sb-gap-1",
@@ -753,7 +860,7 @@ var RenderInput = (props) => {
753
860
  }
754
861
  };
755
862
  var Tabs = TabsPrimitive__namespace.Root;
756
- var tabsListVariants = chunkVLRLE4MP_js.tv({
863
+ var tabsListVariants = chunkW2LT4IQQ_js.tv({
757
864
  variants: {
758
865
  variant: {
759
866
  contained: "sb-inline-flex sb-h-10 sb-items-center sb-justify-center sb-rounded-md sb-bg-muted sb-p-1 sb-text-muted-foreground",
@@ -764,7 +871,7 @@ var tabsListVariants = chunkVLRLE4MP_js.tv({
764
871
  variant: "contained"
765
872
  }
766
873
  });
767
- var TabsList = React11__namespace.forwardRef(({ variant, className, ...props }, ref) => /* @__PURE__ */ React11__namespace.createElement(
874
+ var TabsList = React12__namespace.forwardRef(({ variant, className, ...props }, ref) => /* @__PURE__ */ React12__namespace.createElement(
768
875
  TabsPrimitive__namespace.List,
769
876
  {
770
877
  ref,
@@ -773,7 +880,7 @@ var TabsList = React11__namespace.forwardRef(({ variant, className, ...props },
773
880
  }
774
881
  ));
775
882
  TabsList.displayName = TabsPrimitive__namespace.List.displayName;
776
- var tabsTriggerVariants = chunkVLRLE4MP_js.tv({
883
+ var tabsTriggerVariants = chunkW2LT4IQQ_js.tv({
777
884
  variants: {
778
885
  variant: {
779
886
  contained: "sb-inline-flex sb-items-center sb-justify-center sb-whitespace-nowrap sb-rounded-sm sb-px-3 sb-py-1.5 sb-text-sm sb-font-medium sb-ring-offset-background sb-transition-all focus-visible:sb-outline-none focus-visible:sb-ring-2 focus-visible:sb-ring-ring focus-visible:sb-ring-offset-2 disabled:sb-pointer-events-none disabled:sb-opacity-50 data-[state=active]:sb-bg-background data-[state=active]:sb-text-foreground data-[state=active]:sb-shadow-sm",
@@ -784,7 +891,7 @@ var tabsTriggerVariants = chunkVLRLE4MP_js.tv({
784
891
  variant: "contained"
785
892
  }
786
893
  });
787
- var TabsTrigger = React11__namespace.forwardRef(({ variant, className, ...props }, ref) => /* @__PURE__ */ React11__namespace.createElement(
894
+ var TabsTrigger = React12__namespace.forwardRef(({ variant, className, ...props }, ref) => /* @__PURE__ */ React12__namespace.createElement(
788
895
  TabsPrimitive__namespace.Trigger,
789
896
  {
790
897
  ref,
@@ -793,11 +900,11 @@ var TabsTrigger = React11__namespace.forwardRef(({ variant, className, ...props
793
900
  }
794
901
  ));
795
902
  TabsTrigger.displayName = TabsPrimitive__namespace.Trigger.displayName;
796
- var TabsContent = React11__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ React11__namespace.createElement(
903
+ var TabsContent = React12__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ React12__namespace.createElement(
797
904
  TabsPrimitive__namespace.Content,
798
905
  {
799
906
  ref,
800
- className: chunkVLRLE4MP_js.cn(
907
+ className: chunkW2LT4IQQ_js.cn(
801
908
  "sb-ring-offset-background sb-font-roboto focus-visible:sb-outline-none focus-visible:sb-ring-2 focus-visible:sb-ring-ring focus-visible:sb-ring-offset-2",
802
909
  className
803
910
  ),
@@ -828,38 +935,38 @@ var BackgroundPicker = (props) => {
828
935
  "url(https://images.unsplash.com/photo-1688822863426-8c5f9b257090?ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D&auto=format&fit=crop&w=2532&q=90)",
829
936
  "url(https://images.unsplash.com/photo-1691225850735-6e4e51834cad?ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D&auto=format&fit=crop&w=2532&q=90)"
830
937
  ];
831
- const defaultTab = React11__namespace.useMemo(() => {
938
+ const defaultTab = React12__namespace.useMemo(() => {
832
939
  if (background.includes("url"))
833
940
  return "image";
834
941
  if (background.includes("gradient"))
835
942
  return "gradient";
836
943
  return "solid";
837
944
  }, [background]);
838
- return /* @__PURE__ */ React11__namespace.createElement(Popover, null, /* @__PURE__ */ React11__namespace.createElement(PopoverTrigger, { asChild: true }, /* @__PURE__ */ React11__namespace.createElement(
839
- chunkYUXA4HAL_js.Button,
945
+ return /* @__PURE__ */ React12__namespace.createElement(Popover, null, /* @__PURE__ */ React12__namespace.createElement(PopoverTrigger, { asChild: true }, /* @__PURE__ */ React12__namespace.createElement(
946
+ chunkIB3LYMKX_js.Button,
840
947
  {
841
948
  variant: "outline",
842
949
  size: "sm",
843
- className: chunkVLRLE4MP_js.cn(
950
+ className: chunkW2LT4IQQ_js.cn(
844
951
  "sb-justify-start sb-text-left sb-font-normal sb-normal-case sb-w-full",
845
952
  !background && "sb-text-muted-foreground",
846
953
  className
847
954
  )
848
955
  },
849
- /* @__PURE__ */ React11__namespace.createElement("div", { className: "sb-w-full sb-flex sb-items-center sb-gap-2" }, background ? /* @__PURE__ */ React11__namespace.createElement(
956
+ /* @__PURE__ */ React12__namespace.createElement("div", { className: "sb-w-full sb-flex sb-items-center sb-gap-2" }, background ? /* @__PURE__ */ React12__namespace.createElement(
850
957
  "div",
851
958
  {
852
959
  className: "sb-h-4 sb-w-4 sb-rounded !sb-bg-center !sb-bg-cover sb-transition-all sb-border",
853
960
  style: { background }
854
961
  }
855
- ) : /* @__PURE__ */ React11__namespace.createElement(lucideReact.PaintbrushIcon, { className: "sb-h-4 sb-w-4" }), /* @__PURE__ */ React11__namespace.createElement("div", { className: "sb-truncate sb-flex-1" }, background ? background : "Kies een achtergrond"))
856
- )), /* @__PURE__ */ React11__namespace.createElement(PopoverContent, { className: "sb-w-64 sb-p-0" }, /* @__PURE__ */ React11__namespace.createElement(Tabs, { defaultValue: defaultTab }, /* @__PURE__ */ React11__namespace.createElement(TabsList, { className: "sb-w-full" }, /* @__PURE__ */ React11__namespace.createElement(TabsTrigger, { className: "sb-flex-1", value: "solid" }, "Solid"), /* @__PURE__ */ React11__namespace.createElement(TabsTrigger, { className: "sb-flex-1", value: "gradient" }, "Gradient"), /* @__PURE__ */ React11__namespace.createElement(TabsTrigger, { className: "sb-flex-1", value: "image" }, "Image")), /* @__PURE__ */ React11__namespace.createElement(
962
+ ) : /* @__PURE__ */ React12__namespace.createElement(lucideReact.PaintbrushIcon, { className: "sb-h-4 sb-w-4" }), /* @__PURE__ */ React12__namespace.createElement("div", { className: "sb-truncate sb-flex-1" }, background ? background : "Kies een achtergrond"))
963
+ )), /* @__PURE__ */ React12__namespace.createElement(PopoverContent, { className: "sb-w-64 sb-p-0" }, /* @__PURE__ */ React12__namespace.createElement(Tabs, { defaultValue: defaultTab }, /* @__PURE__ */ React12__namespace.createElement(TabsList, { className: "sb-w-full" }, /* @__PURE__ */ React12__namespace.createElement(TabsTrigger, { className: "sb-flex-1", value: "solid" }, "Solid"), /* @__PURE__ */ React12__namespace.createElement(TabsTrigger, { className: "sb-flex-1", value: "gradient" }, "Gradient"), /* @__PURE__ */ React12__namespace.createElement(TabsTrigger, { className: "sb-flex-1", value: "image" }, "Image")), /* @__PURE__ */ React12__namespace.createElement(
857
964
  TabsContent,
858
965
  {
859
966
  value: "solid",
860
967
  className: "data-[state=active]:sb-flex sb-flex-wrap sb-gap-1 sb-p-4"
861
968
  },
862
- solids.map((s) => /* @__PURE__ */ React11__namespace.createElement(
969
+ solids.map((s) => /* @__PURE__ */ React12__namespace.createElement(
863
970
  "div",
864
971
  {
865
972
  key: s,
@@ -868,13 +975,13 @@ var BackgroundPicker = (props) => {
868
975
  onClick: () => onBackgroundChange(s)
869
976
  }
870
977
  ))
871
- ), /* @__PURE__ */ React11__namespace.createElement(
978
+ ), /* @__PURE__ */ React12__namespace.createElement(
872
979
  TabsContent,
873
980
  {
874
981
  value: "gradient",
875
982
  className: "data-[state=active]:sb-flex sb-flex-wrap sb-gap-1 sb-p-4"
876
983
  },
877
- gradients.map((s) => /* @__PURE__ */ React11__namespace.createElement(
984
+ gradients.map((s) => /* @__PURE__ */ React12__namespace.createElement(
878
985
  "div",
879
986
  {
880
987
  key: s,
@@ -883,7 +990,7 @@ var BackgroundPicker = (props) => {
883
990
  onClick: () => onBackgroundChange(s)
884
991
  }
885
992
  ))
886
- ), /* @__PURE__ */ React11__namespace.createElement(TabsContent, { value: "image" }, /* @__PURE__ */ React11__namespace.createElement("div", { className: "sb-p-4 sb-border-b" }, /* @__PURE__ */ React11__namespace.createElement(
993
+ ), /* @__PURE__ */ React12__namespace.createElement(TabsContent, { value: "image" }, /* @__PURE__ */ React12__namespace.createElement("div", { className: "sb-p-4 sb-border-b" }, /* @__PURE__ */ React12__namespace.createElement(
887
994
  MediaInput,
888
995
  {
889
996
  className: "sb-grid sb-grid-cols-2 sb-gap-1",
@@ -899,7 +1006,7 @@ var BackgroundPicker = (props) => {
899
1006
  "media-input: Error: " + e?.description
900
1007
  )
901
1008
  }
902
- )), /* @__PURE__ */ React11__namespace.createElement("div", { className: "sb-grid sb-grid-cols-2 sb-gap-1 sb-p-4" }, images.map((s) => /* @__PURE__ */ React11__namespace.createElement(
1009
+ )), /* @__PURE__ */ React12__namespace.createElement("div", { className: "sb-grid sb-grid-cols-2 sb-gap-1 sb-p-4" }, images.map((s) => /* @__PURE__ */ React12__namespace.createElement(
903
1010
  "div",
904
1011
  {
905
1012
  key: s,
@@ -909,7 +1016,7 @@ var BackgroundPicker = (props) => {
909
1016
  }
910
1017
  )))))));
911
1018
  };
912
- var toggleVariants = chunkVLRLE4MP_js.tv({
1019
+ var toggleVariants = chunkW2LT4IQQ_js.tv({
913
1020
  base: "sb-inline-flex sb-items-center sb-justify-center sb-rounded-md sb-text-sm sb-font-medium sb-ring-offset-background sb-transition-colors hover:sb-bg-muted hover:sb-text-muted-foreground focus-visible:sb-outline-none focus-visible:sb-ring-1 focus-visible:sb-ring-ring focus-visible:sb-ring-offset-2 disabled:sb-pointer-events-none disabled:sb-opacity-50 data-[state=on]:sb-bg-accent data-[state=on]:sb-text-accent-foreground",
914
1021
  variants: {
915
1022
  variant: {
@@ -927,7 +1034,7 @@ var toggleVariants = chunkVLRLE4MP_js.tv({
927
1034
  size: "default"
928
1035
  }
929
1036
  });
930
- var Toggle = React11__namespace.forwardRef(({ className, variant, size, ...props }, ref) => /* @__PURE__ */ React11__namespace.createElement(
1037
+ var Toggle = React12__namespace.forwardRef(({ className, variant, size, ...props }, ref) => /* @__PURE__ */ React12__namespace.createElement(
931
1038
  TogglePrimitive__namespace.Root,
932
1039
  {
933
1040
  ref,
@@ -939,70 +1046,70 @@ Toggle.displayName = TogglePrimitive__namespace.Root.displayName;
939
1046
 
940
1047
  // src/components/ui/spacing-input.tsx
941
1048
  var SpacingInput = (props) => {
942
- const [value, setValue] = React11__namespace.useState(parse(props.value || "0px"));
943
- const [indipendent, setIndipendent] = React11__namespace.useState(
1049
+ const [value, setValue] = React12__namespace.useState(parse(props.value || "0px"));
1050
+ const [indipendent, setIndipendent] = React12__namespace.useState(
944
1051
  isIndipendent(parse(props.value || "0px"))
945
1052
  );
946
- React11__namespace.useEffect(() => {
1053
+ React12__namespace.useEffect(() => {
947
1054
  if (!props.onChange)
948
1055
  return;
949
1056
  props.onChange(stringify(value));
950
1057
  }, [value, props.onChange]);
951
- return /* @__PURE__ */ React11__namespace.createElement("div", { className: "sb-grid sb-grid-cols-[1fr,auto] sb-gap-3" }, /* @__PURE__ */ React11__namespace.createElement("div", { className: "sb-grid sb-grid-cols-2 sb-items-center sb-gap-3" }, !indipendent ? /* @__PURE__ */ React11__namespace.createElement(React11__namespace.Fragment, null, /* @__PURE__ */ React11__namespace.createElement(
1058
+ return /* @__PURE__ */ React12__namespace.createElement("div", { className: "sb-grid sb-grid-cols-[1fr,auto] sb-gap-3" }, /* @__PURE__ */ React12__namespace.createElement("div", { className: "sb-grid sb-grid-cols-2 sb-items-center sb-gap-3" }, !indipendent ? /* @__PURE__ */ React12__namespace.createElement(React12__namespace.Fragment, null, /* @__PURE__ */ React12__namespace.createElement(
952
1059
  AdvancedInput,
953
1060
  {
954
1061
  value: value.left,
955
1062
  pattern: "\\d+",
956
1063
  onChange: ({ target: { value: value2 } }) => setValue((prev) => ({ ...prev, left: +value2, right: +value2 })),
957
- prepend: /* @__PURE__ */ React11__namespace.createElement(lucideReact.AlignHorizontalSpaceAroundIcon, { className: "sb-h-4 sb-w-4" }),
958
- append: /* @__PURE__ */ React11__namespace.createElement("span", { className: "sb-text-muted-foreground" }, "px")
1064
+ prepend: /* @__PURE__ */ React12__namespace.createElement(lucideReact.AlignHorizontalSpaceAroundIcon, { className: "sb-h-4 sb-w-4" }),
1065
+ append: /* @__PURE__ */ React12__namespace.createElement("span", { className: "sb-text-muted-foreground" }, "px")
959
1066
  }
960
- ), /* @__PURE__ */ React11__namespace.createElement(
1067
+ ), /* @__PURE__ */ React12__namespace.createElement(
961
1068
  AdvancedInput,
962
1069
  {
963
1070
  value: value.top,
964
1071
  pattern: "\\d+",
965
1072
  onChange: ({ target: { value: value2 } }) => setValue((prev) => ({ ...prev, top: +value2, bottom: +value2 })),
966
- prepend: /* @__PURE__ */ React11__namespace.createElement(lucideReact.AlignHorizontalSpaceAroundIcon, { className: "sb-h-4 sb-w-4 sb-rotate-90" }),
967
- append: /* @__PURE__ */ React11__namespace.createElement("span", { className: "sb-text-muted-foreground" }, "px")
1073
+ prepend: /* @__PURE__ */ React12__namespace.createElement(lucideReact.AlignHorizontalSpaceAroundIcon, { className: "sb-h-4 sb-w-4 sb-rotate-90" }),
1074
+ append: /* @__PURE__ */ React12__namespace.createElement("span", { className: "sb-text-muted-foreground" }, "px")
968
1075
  }
969
- )) : /* @__PURE__ */ React11__namespace.createElement(React11__namespace.Fragment, null, /* @__PURE__ */ React11__namespace.createElement(
1076
+ )) : /* @__PURE__ */ React12__namespace.createElement(React12__namespace.Fragment, null, /* @__PURE__ */ React12__namespace.createElement(
970
1077
  AdvancedInput,
971
1078
  {
972
1079
  value: value.left,
973
1080
  pattern: "\\d+",
974
1081
  onChange: ({ target: { value: value2 } }) => setValue((prev) => ({ ...prev, left: +value2 })),
975
- prepend: /* @__PURE__ */ React11__namespace.createElement(lucideReact.AlignHorizontalJustifyStartIcon, { className: "sb-h-4 sb-w-4" }),
976
- append: /* @__PURE__ */ React11__namespace.createElement("span", { className: "sb-text-muted-foreground" }, "px")
1082
+ prepend: /* @__PURE__ */ React12__namespace.createElement(lucideReact.AlignHorizontalJustifyStartIcon, { className: "sb-h-4 sb-w-4" }),
1083
+ append: /* @__PURE__ */ React12__namespace.createElement("span", { className: "sb-text-muted-foreground" }, "px")
977
1084
  }
978
- ), /* @__PURE__ */ React11__namespace.createElement(
1085
+ ), /* @__PURE__ */ React12__namespace.createElement(
979
1086
  AdvancedInput,
980
1087
  {
981
1088
  value: value.top,
982
1089
  pattern: "\\d+",
983
1090
  onChange: ({ target: { value: value2 } }) => setValue((prev) => ({ ...prev, top: +value2 })),
984
- prepend: /* @__PURE__ */ React11__namespace.createElement(lucideReact.AlignHorizontalJustifyStartIcon, { className: "sb-h-4 sb-w-4 sb-rotate-90" }),
985
- append: /* @__PURE__ */ React11__namespace.createElement("span", { className: "sb-text-muted-foreground" }, "px")
1091
+ prepend: /* @__PURE__ */ React12__namespace.createElement(lucideReact.AlignHorizontalJustifyStartIcon, { className: "sb-h-4 sb-w-4 sb-rotate-90" }),
1092
+ append: /* @__PURE__ */ React12__namespace.createElement("span", { className: "sb-text-muted-foreground" }, "px")
986
1093
  }
987
- ), /* @__PURE__ */ React11__namespace.createElement(
1094
+ ), /* @__PURE__ */ React12__namespace.createElement(
988
1095
  AdvancedInput,
989
1096
  {
990
1097
  value: value.right,
991
1098
  pattern: "\\d+",
992
1099
  onChange: ({ target: { value: value2 } }) => setValue((prev) => ({ ...prev, right: +value2 })),
993
- prepend: /* @__PURE__ */ React11__namespace.createElement(lucideReact.AlignHorizontalJustifyStartIcon, { className: "sb-h-4 sb-w-4 sb-rotate-180" }),
994
- append: /* @__PURE__ */ React11__namespace.createElement("span", { className: "sb-text-muted-foreground" }, "px")
1100
+ prepend: /* @__PURE__ */ React12__namespace.createElement(lucideReact.AlignHorizontalJustifyStartIcon, { className: "sb-h-4 sb-w-4 sb-rotate-180" }),
1101
+ append: /* @__PURE__ */ React12__namespace.createElement("span", { className: "sb-text-muted-foreground" }, "px")
995
1102
  }
996
- ), /* @__PURE__ */ React11__namespace.createElement(
1103
+ ), /* @__PURE__ */ React12__namespace.createElement(
997
1104
  AdvancedInput,
998
1105
  {
999
1106
  value: value.bottom,
1000
1107
  pattern: "\\d+",
1001
1108
  onChange: ({ target: { value: value2 } }) => setValue((prev) => ({ ...prev, bottom: +value2 })),
1002
- prepend: /* @__PURE__ */ React11__namespace.createElement(lucideReact.AlignHorizontalJustifyStartIcon, { className: "sb-h-4 sb-w-4 sb--rotate-90" }),
1003
- append: /* @__PURE__ */ React11__namespace.createElement("span", { className: "sb-text-muted-foreground" }, "px")
1109
+ prepend: /* @__PURE__ */ React12__namespace.createElement(lucideReact.AlignHorizontalJustifyStartIcon, { className: "sb-h-4 sb-w-4 sb--rotate-90" }),
1110
+ append: /* @__PURE__ */ React12__namespace.createElement("span", { className: "sb-text-muted-foreground" }, "px")
1004
1111
  }
1005
- ))), /* @__PURE__ */ React11__namespace.createElement("div", { className: "sb-shrink-0" }, /* @__PURE__ */ React11__namespace.createElement(
1112
+ ))), /* @__PURE__ */ React12__namespace.createElement("div", { className: "sb-shrink-0" }, /* @__PURE__ */ React12__namespace.createElement(
1006
1113
  Toggle,
1007
1114
  {
1008
1115
  className: "sb-shrink-0 sb-flex sb-w-8 sb-h-8 sb-p-0",
@@ -1011,7 +1118,7 @@ var SpacingInput = (props) => {
1011
1118
  pressed: indipendent,
1012
1119
  onPressedChange: setIndipendent
1013
1120
  },
1014
- /* @__PURE__ */ React11__namespace.createElement(lucideReact.ScanIcon, { className: "sb-h-4 sb-w-4" })
1121
+ /* @__PURE__ */ React12__namespace.createElement(lucideReact.ScanIcon, { className: "sb-h-4 sb-w-4" })
1015
1122
  )));
1016
1123
  };
1017
1124
  var isIndipendent = (value) => {
@@ -1064,7 +1171,7 @@ var designSchema = zod.z.object({
1064
1171
  });
1065
1172
  var ItemDesignForm = (props) => {
1066
1173
  const { item } = props;
1067
- const component = chunkVLRLE4MP_js.builder.getComponent(item.component);
1174
+ const component = chunkW2LT4IQQ_js.builder.getComponent(item.component);
1068
1175
  if (!component) {
1069
1176
  throw new Error(
1070
1177
  `[simple-builder]: Component "${item.component}" not found`
@@ -1105,7 +1212,7 @@ var ItemDesignForm = (props) => {
1105
1212
  mobile: getDefaultDeviceValues("mobile")
1106
1213
  }
1107
1214
  });
1108
- const { patchItem } = chunkYUXA4HAL_js.useBuilder();
1215
+ const { patchItem } = chunkIB3LYMKX_js.useBuilder();
1109
1216
  const onSubmit = (values) => {
1110
1217
  const { container, desktop, mobile } = values;
1111
1218
  const dirtyFields = form.formState.dirtyFields;
@@ -1143,107 +1250,107 @@ var ItemDesignForm = (props) => {
1143
1250
  }
1144
1251
  });
1145
1252
  };
1146
- const [device, setDevice] = React11__namespace.useState("desktop");
1147
- React11__namespace.useEffect(() => {
1253
+ const [device, setDevice] = React12__namespace.useState("desktop");
1254
+ React12__namespace.useEffect(() => {
1148
1255
  const subscription = form.watch(() => form.handleSubmit(onSubmit)());
1149
1256
  return () => subscription.unsubscribe();
1150
1257
  }, [form.watch, form.handleSubmit]);
1151
- return /* @__PURE__ */ React11__namespace.createElement(Form, { ...form }, /* @__PURE__ */ React11__namespace.createElement("form", { onSubmit: form.handleSubmit(onSubmit) }, /* @__PURE__ */ React11__namespace.createElement("div", { className: "sb-space-y-4 sb-p-4" }, /* @__PURE__ */ React11__namespace.createElement(
1258
+ return /* @__PURE__ */ React12__namespace.createElement(Form, { ...form }, /* @__PURE__ */ React12__namespace.createElement("form", { onSubmit: form.handleSubmit(onSubmit) }, /* @__PURE__ */ React12__namespace.createElement("div", { className: "sb-space-y-4 sb-p-4" }, /* @__PURE__ */ React12__namespace.createElement(
1152
1259
  Tabs,
1153
1260
  {
1154
1261
  defaultValue: device,
1155
1262
  onValueChange: (device2) => setDevice(device2)
1156
1263
  },
1157
- /* @__PURE__ */ React11__namespace.createElement(TabsList, { className: "sb-h-9 sb-grid sb-w-full sb-grid-cols-2" }, /* @__PURE__ */ React11__namespace.createElement(TabsTrigger, { value: "desktop", className: "sb-text-xs" }, /* @__PURE__ */ React11__namespace.createElement(lucideReact.MonitorIcon, { className: "sb-h-4 sb-w-4 sb-mr-2" }), /* @__PURE__ */ React11__namespace.createElement("span", null, "Desktop")), /* @__PURE__ */ React11__namespace.createElement(TabsTrigger, { value: "mobile", className: "sb-text-xs" }, /* @__PURE__ */ React11__namespace.createElement(lucideReact.SmartphoneIcon, { className: "sb-h-4 sb-w-4 sb-mr-2" }), /* @__PURE__ */ React11__namespace.createElement("span", null, "Mobiel")))
1158
- ), /* @__PURE__ */ React11__namespace.createElement("div", { className: "sb-space-y-4" }, /* @__PURE__ */ React11__namespace.createElement(
1264
+ /* @__PURE__ */ React12__namespace.createElement(TabsList, { className: "sb-h-9 sb-grid sb-w-full sb-grid-cols-2" }, /* @__PURE__ */ React12__namespace.createElement(TabsTrigger, { value: "desktop", className: "sb-text-xs" }, /* @__PURE__ */ React12__namespace.createElement(lucideReact.MonitorIcon, { className: "sb-h-4 sb-w-4 sb-mr-2" }), /* @__PURE__ */ React12__namespace.createElement("span", null, "Desktop")), /* @__PURE__ */ React12__namespace.createElement(TabsTrigger, { value: "mobile", className: "sb-text-xs" }, /* @__PURE__ */ React12__namespace.createElement(lucideReact.SmartphoneIcon, { className: "sb-h-4 sb-w-4 sb-mr-2" }), /* @__PURE__ */ React12__namespace.createElement("span", null, "Mobiel")))
1265
+ ), /* @__PURE__ */ React12__namespace.createElement("div", { className: "sb-space-y-4" }, /* @__PURE__ */ React12__namespace.createElement(
1159
1266
  FormField,
1160
1267
  {
1161
1268
  control: form.control,
1162
1269
  key: `${device}.background`,
1163
1270
  name: `${device}.background`,
1164
- render: ({ field }) => /* @__PURE__ */ React11__namespace.createElement(FormItem, null, /* @__PURE__ */ React11__namespace.createElement(FormLabel, null, "Achtergrond"), /* @__PURE__ */ React11__namespace.createElement(FormControl, null, /* @__PURE__ */ React11__namespace.createElement(
1271
+ render: ({ field }) => /* @__PURE__ */ React12__namespace.createElement(FormItem, null, /* @__PURE__ */ React12__namespace.createElement(FormLabel, null, "Achtergrond"), /* @__PURE__ */ React12__namespace.createElement(FormControl, null, /* @__PURE__ */ React12__namespace.createElement(
1165
1272
  BackgroundPicker,
1166
1273
  {
1167
1274
  background: field.value,
1168
1275
  onBackgroundChange: field.onChange
1169
1276
  }
1170
- )), /* @__PURE__ */ React11__namespace.createElement(FormMessage, null))
1277
+ )), /* @__PURE__ */ React12__namespace.createElement(FormMessage, null))
1171
1278
  }
1172
- ), /* @__PURE__ */ React11__namespace.createElement(
1279
+ ), /* @__PURE__ */ React12__namespace.createElement(
1173
1280
  FormField,
1174
1281
  {
1175
1282
  control: form.control,
1176
1283
  key: `${device}.color`,
1177
1284
  name: `${device}.color`,
1178
- render: ({ field }) => /* @__PURE__ */ React11__namespace.createElement(FormItem, null, /* @__PURE__ */ React11__namespace.createElement(FormLabel, null, "Inhoud kleur"), /* @__PURE__ */ React11__namespace.createElement(FormControl, null, /* @__PURE__ */ React11__namespace.createElement(
1285
+ render: ({ field }) => /* @__PURE__ */ React12__namespace.createElement(FormItem, null, /* @__PURE__ */ React12__namespace.createElement(FormLabel, null, "Inhoud kleur"), /* @__PURE__ */ React12__namespace.createElement(FormControl, null, /* @__PURE__ */ React12__namespace.createElement(
1179
1286
  ColorPicker,
1180
1287
  {
1181
1288
  color: field.value,
1182
1289
  onColorChange: field.onChange
1183
1290
  }
1184
- )), /* @__PURE__ */ React11__namespace.createElement(FormMessage, null))
1291
+ )), /* @__PURE__ */ React12__namespace.createElement(FormMessage, null))
1185
1292
  }
1186
- ), /* @__PURE__ */ React11__namespace.createElement("hr", null), /* @__PURE__ */ React11__namespace.createElement(
1293
+ ), /* @__PURE__ */ React12__namespace.createElement("hr", null), /* @__PURE__ */ React12__namespace.createElement(
1187
1294
  FormField,
1188
1295
  {
1189
1296
  control: form.control,
1190
1297
  name: "container",
1191
- render: ({ field }) => /* @__PURE__ */ React11__namespace.createElement(FormItem, { className: "sb-flex sb-flex-row sb-items-center sb-justify-between sb-space-y-0" }, /* @__PURE__ */ React11__namespace.createElement(FormLabel, null, "Volledige breedte"), /* @__PURE__ */ React11__namespace.createElement(FormControl, null, /* @__PURE__ */ React11__namespace.createElement(
1298
+ render: ({ field }) => /* @__PURE__ */ React12__namespace.createElement(FormItem, { className: "sb-flex sb-flex-row sb-items-center sb-justify-between sb-space-y-0" }, /* @__PURE__ */ React12__namespace.createElement(FormLabel, null, "Volledige breedte"), /* @__PURE__ */ React12__namespace.createElement(FormControl, null, /* @__PURE__ */ React12__namespace.createElement(
1192
1299
  Switch,
1193
1300
  {
1194
1301
  checked: !field.value,
1195
1302
  onCheckedChange: (v) => field.onChange(!v)
1196
1303
  }
1197
- )), /* @__PURE__ */ React11__namespace.createElement(FormMessage, null))
1304
+ )), /* @__PURE__ */ React12__namespace.createElement(FormMessage, null))
1198
1305
  }
1199
- ), /* @__PURE__ */ React11__namespace.createElement("hr", null), /* @__PURE__ */ React11__namespace.createElement(
1306
+ ), /* @__PURE__ */ React12__namespace.createElement("hr", null), /* @__PURE__ */ React12__namespace.createElement(
1200
1307
  FormField,
1201
1308
  {
1202
1309
  control: form.control,
1203
1310
  key: `${device}.padding`,
1204
1311
  name: `${device}.padding`,
1205
- render: ({ field }) => /* @__PURE__ */ React11__namespace.createElement(FormItem, null, /* @__PURE__ */ React11__namespace.createElement(FormLabel, null, "Padding"), /* @__PURE__ */ React11__namespace.createElement(FormControl, null, /* @__PURE__ */ React11__namespace.createElement(
1312
+ render: ({ field }) => /* @__PURE__ */ React12__namespace.createElement(FormItem, null, /* @__PURE__ */ React12__namespace.createElement(FormLabel, null, "Padding"), /* @__PURE__ */ React12__namespace.createElement(FormControl, null, /* @__PURE__ */ React12__namespace.createElement(
1206
1313
  SpacingInput,
1207
1314
  {
1208
1315
  value: field.value,
1209
1316
  onChange: field.onChange
1210
1317
  }
1211
- )), /* @__PURE__ */ React11__namespace.createElement(FormMessage, null))
1318
+ )), /* @__PURE__ */ React12__namespace.createElement(FormMessage, null))
1212
1319
  }
1213
- ), /* @__PURE__ */ React11__namespace.createElement(
1320
+ ), /* @__PURE__ */ React12__namespace.createElement(
1214
1321
  FormField,
1215
1322
  {
1216
1323
  control: form.control,
1217
1324
  key: `${device}.margin`,
1218
1325
  name: `${device}.margin`,
1219
- render: ({ field }) => /* @__PURE__ */ React11__namespace.createElement(FormItem, null, /* @__PURE__ */ React11__namespace.createElement(FormLabel, null, "Margin"), /* @__PURE__ */ React11__namespace.createElement(FormControl, null, /* @__PURE__ */ React11__namespace.createElement(
1326
+ render: ({ field }) => /* @__PURE__ */ React12__namespace.createElement(FormItem, null, /* @__PURE__ */ React12__namespace.createElement(FormLabel, null, "Margin"), /* @__PURE__ */ React12__namespace.createElement(FormControl, null, /* @__PURE__ */ React12__namespace.createElement(
1220
1327
  SpacingInput,
1221
1328
  {
1222
1329
  value: field.value,
1223
1330
  onChange: field.onChange
1224
1331
  }
1225
- )), /* @__PURE__ */ React11__namespace.createElement(FormMessage, null))
1332
+ )), /* @__PURE__ */ React12__namespace.createElement(FormMessage, null))
1226
1333
  }
1227
1334
  )))));
1228
1335
  };
1229
- var ScrollArea = React11__namespace.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ React11__namespace.createElement(
1336
+ var ScrollArea = React12__namespace.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ React12__namespace.createElement(
1230
1337
  ScrollAreaPrimitive__namespace.Root,
1231
1338
  {
1232
1339
  ref,
1233
- className: chunkVLRLE4MP_js.cn("sb-relative sb-overflow-hidden", className),
1340
+ className: chunkW2LT4IQQ_js.cn("sb-relative sb-overflow-hidden", className),
1234
1341
  ...props
1235
1342
  },
1236
- /* @__PURE__ */ React11__namespace.createElement(ScrollAreaPrimitive__namespace.Viewport, { className: "sb-h-full sb-max-h-[80vh] sb-w-full sb-rounded-[inherit]" }, children),
1237
- /* @__PURE__ */ React11__namespace.createElement(ScrollBar, null),
1238
- /* @__PURE__ */ React11__namespace.createElement(ScrollAreaPrimitive__namespace.Corner, null)
1343
+ /* @__PURE__ */ React12__namespace.createElement(ScrollAreaPrimitive__namespace.Viewport, { className: "sb-h-full sb-max-h-[80vh] sb-w-full sb-rounded-[inherit]" }, children),
1344
+ /* @__PURE__ */ React12__namespace.createElement(ScrollBar, null),
1345
+ /* @__PURE__ */ React12__namespace.createElement(ScrollAreaPrimitive__namespace.Corner, null)
1239
1346
  ));
1240
1347
  ScrollArea.displayName = ScrollAreaPrimitive__namespace.Root.displayName;
1241
- var ScrollBar = React11__namespace.forwardRef(({ className, orientation = "vertical", ...props }, ref) => /* @__PURE__ */ React11__namespace.createElement(
1348
+ var ScrollBar = React12__namespace.forwardRef(({ className, orientation = "vertical", ...props }, ref) => /* @__PURE__ */ React12__namespace.createElement(
1242
1349
  ScrollAreaPrimitive__namespace.ScrollAreaScrollbar,
1243
1350
  {
1244
1351
  ref,
1245
1352
  orientation,
1246
- className: chunkVLRLE4MP_js.cn(
1353
+ className: chunkW2LT4IQQ_js.cn(
1247
1354
  "sb-flex sb-touch-none sb-select-none sb-transition-colors",
1248
1355
  orientation === "vertical" && "sb-h-full sb-w-2.5 sb-border-l sb-border-l-transparent sb-p-[1px]",
1249
1356
  orientation === "horizontal" && "sb-h-2.5 sb-flex-col sb-border-t sb-border-t-transparent sb-p-[1px]",
@@ -1251,36 +1358,36 @@ var ScrollBar = React11__namespace.forwardRef(({ className, orientation = "verti
1251
1358
  ),
1252
1359
  ...props
1253
1360
  },
1254
- /* @__PURE__ */ React11__namespace.createElement(ScrollAreaPrimitive__namespace.ScrollAreaThumb, { className: "sb-relative sb-flex-1 sb-rounded-full sb-bg-border" })
1361
+ /* @__PURE__ */ React12__namespace.createElement(ScrollAreaPrimitive__namespace.ScrollAreaThumb, { className: "sb-relative sb-flex-1 sb-rounded-full sb-bg-border" })
1255
1362
  ));
1256
1363
  ScrollBar.displayName = ScrollAreaPrimitive__namespace.ScrollAreaScrollbar.displayName;
1257
1364
 
1258
1365
  // src/components/container-item-toolbar.tsx
1259
1366
  var ContainerItemToolbar = (props) => {
1260
1367
  const { contentId, canBringUp = false, canBringDown = false } = props;
1261
- const { bringUp, bringDown } = chunkYUXA4HAL_js.useBuilder();
1262
- return /* @__PURE__ */ React11__namespace.createElement("div", { className: "sb-absolute sb-z-20 sb-top-1 sb-right-1 sb-rounded-md sb-shadow sb-flex sb-flex-col sb-gap-1 sb-p-1 sb-bg-card sb-text-card-foreground sb-item-toolbar sb-opacity-0 sb-transition-opacity" }, /* @__PURE__ */ React11__namespace.createElement("div", { className: "sb-h-10 sb-p-1 sb-border sb-border-input sb-bg-background sb-rounded-md sb-text-sm sb-font-medium sb-flex sb-gap-1 sb-items-center sb-justify-start" }, /* @__PURE__ */ React11__namespace.createElement(EditButton, { id: contentId }), /* @__PURE__ */ React11__namespace.createElement(
1263
- chunkYUXA4HAL_js.Button,
1368
+ const { bringUp, bringDown } = chunkIB3LYMKX_js.useBuilder();
1369
+ return /* @__PURE__ */ React12__namespace.createElement("div", { className: "sb-absolute sb-z-20 sb-top-1 sb-right-1 sb-rounded-md sb-shadow sb-flex sb-flex-col sb-gap-1 sb-p-1 sb-bg-card sb-text-card-foreground sb-item-toolbar sb-opacity-0 sb-transition-opacity" }, /* @__PURE__ */ React12__namespace.createElement("div", { className: "sb-h-10 sb-p-1 sb-border sb-border-input sb-bg-background sb-rounded-md sb-text-sm sb-font-medium sb-flex sb-gap-1 sb-items-center sb-justify-start" }, /* @__PURE__ */ React12__namespace.createElement(EditButton, { id: contentId }), /* @__PURE__ */ React12__namespace.createElement(
1370
+ chunkIB3LYMKX_js.Button,
1264
1371
  {
1265
1372
  variant: "ghost",
1266
1373
  className: "sb-w-8 sb-h-8 sb-p-0",
1267
1374
  onClick: () => bringUp(contentId),
1268
1375
  disabled: !canBringUp
1269
1376
  },
1270
- /* @__PURE__ */ React11__namespace.createElement(lucideReact.ArrowUp, { className: "sb-h-5 sb-w-5" })
1271
- ), /* @__PURE__ */ React11__namespace.createElement(
1272
- chunkYUXA4HAL_js.Button,
1377
+ /* @__PURE__ */ React12__namespace.createElement(lucideReact.ArrowUp, { className: "sb-h-5 sb-w-5" })
1378
+ ), /* @__PURE__ */ React12__namespace.createElement(
1379
+ chunkIB3LYMKX_js.Button,
1273
1380
  {
1274
1381
  variant: "ghost",
1275
1382
  className: "sb-w-8 sb-h-8 sb-p-0",
1276
1383
  onClick: () => bringDown(contentId),
1277
1384
  disabled: !canBringDown
1278
1385
  },
1279
- /* @__PURE__ */ React11__namespace.createElement(lucideReact.ArrowDown, { className: "sb-h-5 sb-w-5" })
1280
- ), /* @__PURE__ */ React11__namespace.createElement(DeleteButton, { contentId })));
1386
+ /* @__PURE__ */ React12__namespace.createElement(lucideReact.ArrowDown, { className: "sb-h-5 sb-w-5" })
1387
+ ), /* @__PURE__ */ React12__namespace.createElement(DeleteButton, { contentId })));
1281
1388
  };
1282
1389
  var EditButton = ({ id }) => {
1283
- return /* @__PURE__ */ React11__namespace.createElement(Popover, { modal: true }, /* @__PURE__ */ React11__namespace.createElement(PopoverTrigger, { asChild: true }, /* @__PURE__ */ React11__namespace.createElement(chunkYUXA4HAL_js.Button, { variant: "ghost", className: "sb-w-8 sb-h-8 sb-p-0" }, /* @__PURE__ */ React11__namespace.createElement(lucideReact.Edit2Icon, { className: "sb-h-5 sb-w-5" }))), /* @__PURE__ */ React11__namespace.createElement(
1390
+ return /* @__PURE__ */ React12__namespace.createElement(Popover, { modal: true }, /* @__PURE__ */ React12__namespace.createElement(PopoverTrigger, { asChild: true }, /* @__PURE__ */ React12__namespace.createElement(chunkIB3LYMKX_js.Button, { variant: "ghost", className: "sb-w-8 sb-h-8 sb-p-0" }, /* @__PURE__ */ React12__namespace.createElement(lucideReact.Edit2Icon, { className: "sb-h-5 sb-w-5" }))), /* @__PURE__ */ React12__namespace.createElement(
1284
1391
  PopoverContent,
1285
1392
  {
1286
1393
  side: "left",
@@ -1290,33 +1397,33 @@ var EditButton = ({ id }) => {
1290
1397
  className: "sb-p-0 sb-relative",
1291
1398
  collisionPadding: 16
1292
1399
  },
1293
- /* @__PURE__ */ React11__namespace.createElement(EditPopoverInner, { id })
1400
+ /* @__PURE__ */ React12__namespace.createElement(EditPopoverInner, { id })
1294
1401
  ));
1295
1402
  };
1296
1403
  var EditPopoverInner = (props) => {
1297
1404
  const { id } = props;
1298
- const { getItem } = chunkYUXA4HAL_js.useBuilder();
1405
+ const { getItem } = chunkIB3LYMKX_js.useBuilder();
1299
1406
  const item = getItem(id);
1300
1407
  if (!item) {
1301
1408
  throw new Error(
1302
1409
  `[simple-builder]: Item with id ${id} not found in container item form component`
1303
1410
  );
1304
1411
  }
1305
- return /* @__PURE__ */ React11__namespace.createElement(Tabs, null, /* @__PURE__ */ React11__namespace.createElement(TabsList, { variant: "text", defaultValue: "content" }, /* @__PURE__ */ React11__namespace.createElement(TabsTrigger, { variant: "text", value: "content" }, "Inhoud"), /* @__PURE__ */ React11__namespace.createElement(TabsTrigger, { variant: "text", value: "design" }, "Design")), /* @__PURE__ */ React11__namespace.createElement(TabsContent, { value: "content" }, /* @__PURE__ */ React11__namespace.createElement(ScrollArea, null, /* @__PURE__ */ React11__namespace.createElement(ContainerItemForm, { item }))), /* @__PURE__ */ React11__namespace.createElement(TabsContent, { value: "design" }, /* @__PURE__ */ React11__namespace.createElement(ItemDesignForm, { item })));
1412
+ return /* @__PURE__ */ React12__namespace.createElement(Tabs, null, /* @__PURE__ */ React12__namespace.createElement(TabsList, { variant: "text", defaultValue: "content" }, /* @__PURE__ */ React12__namespace.createElement(TabsTrigger, { variant: "text", value: "content" }, "Inhoud"), /* @__PURE__ */ React12__namespace.createElement(TabsTrigger, { variant: "text", value: "design" }, "Design")), /* @__PURE__ */ React12__namespace.createElement(TabsContent, { value: "content" }, /* @__PURE__ */ React12__namespace.createElement(ScrollArea, null, /* @__PURE__ */ React12__namespace.createElement(ContainerItemForm, { item }))), /* @__PURE__ */ React12__namespace.createElement(TabsContent, { value: "design" }, /* @__PURE__ */ React12__namespace.createElement(ItemDesignForm, { item })));
1306
1413
  };
1307
1414
  var DeleteButton = ({ contentId }) => {
1308
- const { deleteContent } = chunkYUXA4HAL_js.useBuilder();
1309
- return /* @__PURE__ */ React11__namespace.createElement(AlertDialog, null, /* @__PURE__ */ React11__namespace.createElement(AlertDialogTrigger, { asChild: true }, /* @__PURE__ */ React11__namespace.createElement(
1310
- chunkYUXA4HAL_js.Button,
1415
+ const { deleteContent } = chunkIB3LYMKX_js.useBuilder();
1416
+ return /* @__PURE__ */ React12__namespace.createElement(AlertDialog, null, /* @__PURE__ */ React12__namespace.createElement(AlertDialogTrigger, { asChild: true }, /* @__PURE__ */ React12__namespace.createElement(
1417
+ chunkIB3LYMKX_js.Button,
1311
1418
  {
1312
1419
  variant: "ghost",
1313
1420
  className: "sb-w-8 sb-h-8 sb-p-0 sb-text-destructive"
1314
1421
  },
1315
- /* @__PURE__ */ React11__namespace.createElement(lucideReact.Trash2Icon, { className: "sb-h-5 sb-w-5" })
1316
- )), /* @__PURE__ */ React11__namespace.createElement(AlertDialogContent, null, /* @__PURE__ */ React11__namespace.createElement(AlertDialogDescription, null, "Weet je zeker dat je dit blok wilt verwijderen?"), /* @__PURE__ */ React11__namespace.createElement(AlertDialogFooter, null, /* @__PURE__ */ React11__namespace.createElement(AlertDialogCancel, null, "Annuleren"), /* @__PURE__ */ React11__namespace.createElement(
1422
+ /* @__PURE__ */ React12__namespace.createElement(lucideReact.Trash2Icon, { className: "sb-h-5 sb-w-5" })
1423
+ )), /* @__PURE__ */ React12__namespace.createElement(AlertDialogContent, null, /* @__PURE__ */ React12__namespace.createElement(AlertDialogDescription, null, "Weet je zeker dat je dit blok wilt verwijderen?"), /* @__PURE__ */ React12__namespace.createElement(AlertDialogFooter, null, /* @__PURE__ */ React12__namespace.createElement(AlertDialogCancel, null, "Annuleren"), /* @__PURE__ */ React12__namespace.createElement(
1317
1424
  AlertDialogAction,
1318
1425
  {
1319
- className: chunkYUXA4HAL_js.buttonVariants({ variant: "destructive" }),
1426
+ className: chunkIB3LYMKX_js.buttonVariants({ variant: "destructive" }),
1320
1427
  onClick: () => deleteContent(contentId)
1321
1428
  },
1322
1429
  "Verwijderen"
@@ -1332,14 +1439,14 @@ var BuildContainerInner = (props) => {
1332
1439
  "[simple-builder]: Multiple content blocks detected when using property multiple false."
1333
1440
  );
1334
1441
  }
1335
- return /* @__PURE__ */ React11__namespace.createElement("div", null, items.length <= 0 ? /* @__PURE__ */ React11__namespace.createElement(AddContentPlaceholder, { parent: id, container: name, index: 0 }) : multiple && /* @__PURE__ */ React11__namespace.createElement(AddContentDividerButton, { parent: id, container: name, index: 0 }), items.map((item, i) => /* @__PURE__ */ React11__namespace.createElement(React11__namespace.Fragment, { key: item.id }, /* @__PURE__ */ React11__namespace.createElement("div", { className: "sb-relative sb-container-item" }, /* @__PURE__ */ React11__namespace.createElement(chunkVLRLE4MP_js.DesignWrapper, { styles: item.styles }, chunkVLRLE4MP_js.builder.bindComponent(item, true)), /* @__PURE__ */ React11__namespace.createElement(
1442
+ return /* @__PURE__ */ React12__namespace.createElement("div", null, items.length <= 0 ? /* @__PURE__ */ React12__namespace.createElement(AddContentPlaceholder, { parent: id, container: name, index: 0 }) : multiple && /* @__PURE__ */ React12__namespace.createElement(AddContentDividerButton, { parent: id, container: name, index: 0 }), items.map((item, i) => /* @__PURE__ */ React12__namespace.createElement(React12__namespace.Fragment, { key: item.id }, /* @__PURE__ */ React12__namespace.createElement("div", { className: "sb-relative sb-container-item" }, /* @__PURE__ */ React12__namespace.createElement(chunkW2LT4IQQ_js.DesignWrapper, { styles: item.styles }, chunkW2LT4IQQ_js.builder.bindComponent(item, true)), /* @__PURE__ */ React12__namespace.createElement(
1336
1443
  ContainerItemToolbar,
1337
1444
  {
1338
1445
  contentId: item.id,
1339
1446
  canBringUp: i > 0,
1340
1447
  canBringDown: i < items.length - 1
1341
1448
  }
1342
- )), multiple && /* @__PURE__ */ React11__namespace.createElement(
1449
+ )), multiple && /* @__PURE__ */ React12__namespace.createElement(
1343
1450
  AddContentDividerButton,
1344
1451
  {
1345
1452
  parent: id,
@@ -1350,12 +1457,12 @@ var BuildContainerInner = (props) => {
1350
1457
  };
1351
1458
  var build_container_client_default = BuildContainerInner;
1352
1459
  var AddContentButton = (props) => {
1353
- const components = chunkVLRLE4MP_js.builder.getComponents();
1354
- const { addContent } = chunkYUXA4HAL_js.useBuilder();
1355
- return /* @__PURE__ */ React11__namespace.createElement(Popover, null, /* @__PURE__ */ React11__namespace.createElement(PopoverTrigger, { asChild: true }, props.children), /* @__PURE__ */ React11__namespace.createElement(PopoverContent, { className: "sb-p-1" }, /* @__PURE__ */ React11__namespace.createElement("div", { className: "sb-grid sb-grid-cols-2 sb-gap-2" }, components.map((component) => {
1356
- const Icon = component.icon ?? lucideReact.ImageIcon;
1357
- return /* @__PURE__ */ React11__namespace.createElement(PopoverClose, { key: component.name, asChild: true }, /* @__PURE__ */ React11__namespace.createElement(
1358
- chunkYUXA4HAL_js.Button,
1460
+ const components = chunkW2LT4IQQ_js.builder.getComponents();
1461
+ const { addContent } = chunkIB3LYMKX_js.useBuilder();
1462
+ return /* @__PURE__ */ React12__namespace.createElement(Popover, null, /* @__PURE__ */ React12__namespace.createElement(PopoverTrigger, { asChild: true }, props.children), /* @__PURE__ */ React12__namespace.createElement(PopoverContent, { className: "sb-p-1" }, /* @__PURE__ */ React12__namespace.createElement("div", { className: "sb-grid sb-grid-cols-2 sb-gap-2" }, components.map((component) => {
1463
+ const Icon2 = component.icon ?? lucideReact.ImageIcon;
1464
+ return /* @__PURE__ */ React12__namespace.createElement(PopoverClose, { key: component.name, asChild: true }, /* @__PURE__ */ React12__namespace.createElement(
1465
+ chunkIB3LYMKX_js.Button,
1359
1466
  {
1360
1467
  variant: "ghost",
1361
1468
  className: "sb-justify-start",
@@ -1368,22 +1475,22 @@ var AddContentButton = (props) => {
1368
1475
  );
1369
1476
  }
1370
1477
  },
1371
- /* @__PURE__ */ React11__namespace.createElement(Icon, { className: "sb-mr-2 sb-h-4 sb-w-4 sb-shrink-0" }),
1478
+ /* @__PURE__ */ React12__namespace.createElement(Icon2, { className: "sb-mr-2 sb-h-4 sb-w-4 sb-shrink-0" }),
1372
1479
  component.friendlyName ?? component.name
1373
1480
  ));
1374
1481
  }))));
1375
1482
  };
1376
1483
  var AddContentPlaceholder = (props) => {
1377
- return /* @__PURE__ */ React11__namespace.createElement(AddContentButton, { ...props }, /* @__PURE__ */ React11__namespace.createElement("div", { className: "sb-flex sb-justify-center sb-bg-primary/50 p-4" }, /* @__PURE__ */ React11__namespace.createElement(chunkYUXA4HAL_js.Button, { size: "sm" }, /* @__PURE__ */ React11__namespace.createElement(lucideReact.PlusIcon, { className: "sb-mr-2 sb-h-4 sb-w-4" }), "Blok Toevoegen")));
1484
+ return /* @__PURE__ */ React12__namespace.createElement(AddContentButton, { ...props }, /* @__PURE__ */ React12__namespace.createElement("div", { className: "sb-flex sb-justify-center sb-bg-primary/50 p-4" }, /* @__PURE__ */ React12__namespace.createElement(chunkIB3LYMKX_js.Button, { size: "sm" }, /* @__PURE__ */ React12__namespace.createElement(lucideReact.PlusIcon, { className: "sb-mr-2 sb-h-4 sb-w-4" }), "Blok Toevoegen")));
1378
1485
  };
1379
1486
  var AddContentDividerButton = (props) => {
1380
- return /* @__PURE__ */ React11__namespace.createElement(AddContentButton, { ...props }, /* @__PURE__ */ React11__namespace.createElement("div", { className: "sb-w-full sb-h-1 sb--my-[2px] sb-bg-primary sb-relative sb-z-20 sb-opacity-0 add-content-divider-button sb-transition-opacity" }, /* @__PURE__ */ React11__namespace.createElement(
1381
- chunkYUXA4HAL_js.Button,
1487
+ return /* @__PURE__ */ React12__namespace.createElement(AddContentButton, { ...props }, /* @__PURE__ */ React12__namespace.createElement("div", { className: "sb-w-full sb-h-1 sb--my-[2px] sb-bg-primary sb-relative sb-z-20 sb-opacity-0 add-content-divider-button sb-transition-opacity" }, /* @__PURE__ */ React12__namespace.createElement(
1488
+ chunkIB3LYMKX_js.Button,
1382
1489
  {
1383
1490
  size: "sm",
1384
1491
  className: "sb-absolute sb-left-1/2 sb-top-1/2 sb--translate-y-1/2 sb--translate-x-1/2 sb-shadow"
1385
1492
  },
1386
- /* @__PURE__ */ React11__namespace.createElement(lucideReact.PlusIcon, { className: "sb-mr-2 sb-h-4 sb-w-4" }),
1493
+ /* @__PURE__ */ React12__namespace.createElement(lucideReact.PlusIcon, { className: "sb-mr-2 sb-h-4 sb-w-4" }),
1387
1494
  "Blok Toevoegen"
1388
1495
  )));
1389
1496
  };