@simple-builder/react 1.0.20 → 1.0.21

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.
Files changed (16) hide show
  1. package/dist/{build-container-client-LY4RX272.mjs → build-container-client-EGUVIJQE.mjs} +190 -180
  2. package/dist/{build-container-client-K5FTDOKZ.css → build-container-client-UTWTM32L.css} +19 -0
  3. package/dist/{build-container-client-RGQQTCKG.js → build-container-client-VLVAC2RM.js} +255 -245
  4. package/dist/{builder-content-PZYB2ILV.js → builder-content-BGBWMI6B.js} +7 -7
  5. package/dist/{builder-content-6XOZLKFJ.css → builder-content-JWIMCW6L.css} +19 -0
  6. package/dist/{builder-content-4TTGQUUJ.mjs → builder-content-RQZGNHGE.mjs} +2 -2
  7. package/dist/{chunk-IY3JM23H.js → chunk-GQ2NJQNP.js} +3 -3
  8. package/dist/{chunk-2Y3J2R5O.mjs → chunk-JDY3WVEQ.mjs} +1 -1
  9. package/dist/{chunk-J6SSP2IE.mjs → chunk-KD2J6VPO.mjs} +2 -2
  10. package/dist/{chunk-N6DUKS7Z.js → chunk-Q2EMWEEZ.js} +5 -5
  11. package/dist/{chunk-LLKCXOGO.js → chunk-SMX2JVU7.js} +19 -3
  12. package/dist/{chunk-SLA7GUFF.mjs → chunk-YM22QCRZ.mjs} +19 -3
  13. package/dist/index.css +19 -0
  14. package/dist/index.js +6 -6
  15. package/dist/index.mjs +2 -2
  16. package/package.json +2 -2
package/dist/{build-container-client-RGQQTCKG.js → build-container-client-VLVAC2RM.js} RENAMED
@@ -1,10 +1,10 @@
1
1
  'use client';
2
2
  'use strict';
3
3
 
4
- require('./chunk-IY3JM23H.js');
5
- var chunkN6DUKS7Z_js = require('./chunk-N6DUKS7Z.js');
6
- var chunkLLKCXOGO_js = require('./chunk-LLKCXOGO.js');
7
- var React12 = require('react');
4
+ require('./chunk-GQ2NJQNP.js');
5
+ var chunkQ2EMWEEZ_js = require('./chunk-Q2EMWEEZ.js');
6
+ var chunkSMX2JVU7_js = require('./chunk-SMX2JVU7.js');
7
+ var React17 = 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');
@@ -39,7 +39,7 @@ function _interopNamespace(e) {
39
39
  return Object.freeze(n);
40
40
  }
41
41
 
42
- var React12__namespace = /*#__PURE__*/_interopNamespace(React12);
42
+ var React17__namespace = /*#__PURE__*/_interopNamespace(React17);
43
43
  var AlertDialogPrimitive__namespace = /*#__PURE__*/_interopNamespace(AlertDialogPrimitive);
44
44
  var PopoverPrimitive__namespace = /*#__PURE__*/_interopNamespace(PopoverPrimitive);
45
45
  var LabelPrimitive__namespace = /*#__PURE__*/_interopNamespace(LabelPrimitive);
@@ -52,10 +52,10 @@ var ScrollAreaPrimitive__namespace = /*#__PURE__*/_interopNamespace(ScrollAreaPr
52
52
  var AlertDialog = AlertDialogPrimitive__namespace.Root;
53
53
  var AlertDialogTrigger = AlertDialogPrimitive__namespace.Trigger;
54
54
  var AlertDialogPortal = AlertDialogPrimitive__namespace.Portal;
55
- var AlertDialogOverlay = React12__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ React12__namespace.createElement(
55
+ var AlertDialogOverlay = React17__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ React17__namespace.createElement(
56
56
  AlertDialogPrimitive__namespace.Overlay,
57
57
  {
58
- className: chunkLLKCXOGO_js.cn(
58
+ className: chunkSMX2JVU7_js.cn(
59
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",
60
60
  className
61
61
  ),
@@ -64,11 +64,11 @@ var AlertDialogOverlay = React12__namespace.forwardRef(({ className, ...props },
64
64
  }
65
65
  ));
66
66
  AlertDialogOverlay.displayName = AlertDialogPrimitive__namespace.Overlay.displayName;
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(
67
+ var AlertDialogContent = React17__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ React17__namespace.createElement(AlertDialogPortal, null, /* @__PURE__ */ React17__namespace.createElement(AlertDialogOverlay, null), /* @__PURE__ */ React17__namespace.createElement(
68
68
  AlertDialogPrimitive__namespace.Content,
69
69
  {
70
70
  ref,
71
- className: chunkLLKCXOGO_js.cn(
71
+ className: chunkSMX2JVU7_js.cn(
72
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",
73
73
  className
74
74
  ),
@@ -79,10 +79,10 @@ AlertDialogContent.displayName = AlertDialogPrimitive__namespace.Content.display
79
79
  var AlertDialogFooter = ({
80
80
  className,
81
81
  ...props
82
- }) => /* @__PURE__ */ React12__namespace.createElement(
82
+ }) => /* @__PURE__ */ React17__namespace.createElement(
83
83
  "div",
84
84
  {
85
- className: chunkLLKCXOGO_js.cn(
85
+ className: chunkSMX2JVU7_js.cn(
86
86
  "sb-flex sb-flex-col-reverse sm:sb-flex-row sm:sb-justify-end sm:sb-space-x-2",
87
87
  className
88
88
  ),
@@ -90,39 +90,39 @@ var AlertDialogFooter = ({
90
90
  }
91
91
  );
92
92
  AlertDialogFooter.displayName = "AlertDialogFooter";
93
- var AlertDialogTitle = React12__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ React12__namespace.createElement(
93
+ var AlertDialogTitle = React17__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ React17__namespace.createElement(
94
94
  AlertDialogPrimitive__namespace.Title,
95
95
  {
96
96
  ref,
97
- className: chunkLLKCXOGO_js.cn("sb-text-lg sb-font-semibold", className),
97
+ className: chunkSMX2JVU7_js.cn("sb-text-lg sb-font-semibold", className),
98
98
  ...props
99
99
  }
100
100
  ));
101
101
  AlertDialogTitle.displayName = AlertDialogPrimitive__namespace.Title.displayName;
102
- var AlertDialogDescription = React12__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ React12__namespace.createElement(
102
+ var AlertDialogDescription = React17__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ React17__namespace.createElement(
103
103
  AlertDialogPrimitive__namespace.Description,
104
104
  {
105
105
  ref,
106
- className: chunkLLKCXOGO_js.cn("sb-text-sm sb-text-muted-foreground", className),
106
+ className: chunkSMX2JVU7_js.cn("sb-text-sm sb-text-muted-foreground", className),
107
107
  ...props
108
108
  }
109
109
  ));
110
110
  AlertDialogDescription.displayName = AlertDialogPrimitive__namespace.Description.displayName;
111
- var AlertDialogAction = React12__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ React12__namespace.createElement(
111
+ var AlertDialogAction = React17__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ React17__namespace.createElement(
112
112
  AlertDialogPrimitive__namespace.Action,
113
113
  {
114
114
  ref,
115
- className: chunkLLKCXOGO_js.cn(chunkN6DUKS7Z_js.buttonVariants(), className),
115
+ className: chunkSMX2JVU7_js.cn(chunkQ2EMWEEZ_js.buttonVariants(), className),
116
116
  ...props
117
117
  }
118
118
  ));
119
119
  AlertDialogAction.displayName = AlertDialogPrimitive__namespace.Action.displayName;
120
- var AlertDialogCancel = React12__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ React12__namespace.createElement(
120
+ var AlertDialogCancel = React17__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ React17__namespace.createElement(
121
121
  AlertDialogPrimitive__namespace.Cancel,
122
122
  {
123
123
  ref,
124
- className: chunkLLKCXOGO_js.cn(
125
- chunkN6DUKS7Z_js.buttonVariants({ variant: "outline" }),
124
+ className: chunkSMX2JVU7_js.cn(
125
+ chunkQ2EMWEEZ_js.buttonVariants({ variant: "outline" }),
126
126
  "sb-mt-2 sm:sb-mt-0",
127
127
  className
128
128
  ),
@@ -133,13 +133,13 @@ AlertDialogCancel.displayName = AlertDialogPrimitive__namespace.Cancel.displayNa
133
133
  var Popover = PopoverPrimitive__namespace.Root;
134
134
  var PopoverTrigger = PopoverPrimitive__namespace.Trigger;
135
135
  var PopoverClose = PopoverPrimitive__namespace.Close;
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(
136
+ var PopoverContent = React17__namespace.forwardRef(({ className, align = "center", sideOffset = 4, ...props }, ref) => /* @__PURE__ */ React17__namespace.createElement(PopoverPrimitive__namespace.Portal, null, /* @__PURE__ */ React17__namespace.createElement(
137
137
  PopoverPrimitive__namespace.Content,
138
138
  {
139
139
  ref,
140
140
  align,
141
141
  sideOffset,
142
- className: chunkLLKCXOGO_js.cn(
142
+ className: chunkSMX2JVU7_js.cn(
143
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",
144
144
  className
145
145
  ),
@@ -153,19 +153,19 @@ function Calendar({
153
153
  showOutsideDays = true,
154
154
  ...props
155
155
  }) {
156
- return /* @__PURE__ */ React12__namespace.createElement(
156
+ return /* @__PURE__ */ React17__namespace.createElement(
157
157
  reactDayPicker.DayPicker,
158
158
  {
159
159
  showOutsideDays,
160
- className: chunkLLKCXOGO_js.cn("sb-p-3 sb-font-roboto", className),
160
+ className: chunkSMX2JVU7_js.cn("sb-p-3 sb-font-roboto", className),
161
161
  classNames: {
162
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",
163
163
  month: "sb-space-y-4",
164
164
  caption: "sb-flex sb-justify-center sb-pt-1 sb-relative sb-items-center",
165
165
  caption_label: "sb-text-sm sb-font-medium",
166
166
  nav: "sb-space-x-1 sb-flex sb-items-center",
167
- nav_button: chunkLLKCXOGO_js.cn(
168
- chunkN6DUKS7Z_js.buttonVariants({ variant: "outline" }),
167
+ nav_button: chunkSMX2JVU7_js.cn(
168
+ chunkQ2EMWEEZ_js.buttonVariants({ variant: "outline" }),
169
169
  "sb-h-7 sb-w-7 sb-bg-transparent sb-p-0 sb-opacity-50 hover:sb-opacity-100"
170
170
  ),
171
171
  nav_button_previous: "sb-absolute sb-left-1",
@@ -174,12 +174,12 @@ function Calendar({
174
174
  head_row: "sb-flex",
175
175
  head_cell: "sb-text-muted-foreground sb-rounded-md sb-w-8 sb-font-normal sb-text-[0.8rem]",
176
176
  row: "sb-flex sb-w-full sb-mt-2",
177
- cell: chunkLLKCXOGO_js.cn(
177
+ cell: chunkSMX2JVU7_js.cn(
178
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",
179
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"
180
180
  ),
181
- day: chunkLLKCXOGO_js.cn(
182
- chunkN6DUKS7Z_js.buttonVariants({ variant: "ghost" }),
181
+ day: chunkSMX2JVU7_js.cn(
182
+ chunkQ2EMWEEZ_js.buttonVariants({ variant: "ghost" }),
183
183
  "sb-h-8 sb-w-8 sb-p-0 sb-font-normal aria-selected:sb-opacity-100"
184
184
  ),
185
185
  day_range_start: "day-range-start",
@@ -193,8 +193,8 @@ function Calendar({
193
193
  ...classNames
194
194
  },
195
195
  components: {
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
+ IconLeft: () => /* @__PURE__ */ React17__namespace.createElement(lucideReact.ChevronLeftIcon, { className: "sb-h-4 sb-w-4" }),
197
+ IconRight: () => /* @__PURE__ */ React17__namespace.createElement(lucideReact.ChevronRightIcon, { className: "sb-h-4 sb-w-4" })
198
198
  },
199
199
  ...props
200
200
  }
@@ -214,25 +214,25 @@ var ColorPicker = (props) => {
214
214
  "#009DD1",
215
215
  "#FF0000"
216
216
  ];
217
- return /* @__PURE__ */ React12__namespace.createElement(Popover, null, /* @__PURE__ */ React12__namespace.createElement(PopoverTrigger, { asChild: true }, /* @__PURE__ */ React12__namespace.createElement(
218
- chunkN6DUKS7Z_js.Button,
217
+ return /* @__PURE__ */ React17__namespace.createElement(Popover, null, /* @__PURE__ */ React17__namespace.createElement(PopoverTrigger, { asChild: true }, /* @__PURE__ */ React17__namespace.createElement(
218
+ chunkQ2EMWEEZ_js.Button,
219
219
  {
220
220
  variant: "outline",
221
221
  size: "sm",
222
- className: chunkLLKCXOGO_js.cn(
222
+ className: chunkSMX2JVU7_js.cn(
223
223
  "sb-justify-start sb-text-left sb-font-normal sb-normal-case sb-w-full",
224
224
  !color && "sb-text-muted-foreground",
225
225
  className
226
226
  )
227
227
  },
228
- /* @__PURE__ */ React12__namespace.createElement("div", { className: "sb-w-full sb-flex sb-items-center sb-gap-2" }, color ? /* @__PURE__ */ React12__namespace.createElement(
228
+ /* @__PURE__ */ React17__namespace.createElement("div", { className: "sb-w-full sb-flex sb-items-center sb-gap-2" }, color ? /* @__PURE__ */ React17__namespace.createElement(
229
229
  "div",
230
230
  {
231
231
  className: "sb-h-4 sb-w-4 sb-rounded !sb-bg-center !sb-bg-cover sb-transition-all sb-border",
232
232
  style: { background: color }
233
233
  }
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
+ ) : /* @__PURE__ */ React17__namespace.createElement(lucideReact.PaintbrushIcon, { className: "sb-h-4 sb-w-4" }), /* @__PURE__ */ React17__namespace.createElement("div", { className: "sb-truncate sb-flex-1" }, color ? color : "Kies een kleur"))
235
+ )), /* @__PURE__ */ React17__namespace.createElement(PopoverContent, { className: "sb-w-64 sb-p-4 sb-flex sb-flex-wrap sb-gap-1" }, colors.map((s) => /* @__PURE__ */ React17__namespace.createElement(
236
236
  "div",
237
237
  {
238
238
  key: s,
@@ -242,10 +242,10 @@ var ColorPicker = (props) => {
242
242
  }
243
243
  ))));
244
244
  };
245
- var labelVariants = chunkLLKCXOGO_js.tv({
245
+ var labelVariants = chunkSMX2JVU7_js.tv({
246
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"
247
247
  });
248
- var Label = React12__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ React12__namespace.createElement(
248
+ var Label = React17__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ React17__namespace.createElement(
249
249
  LabelPrimitive__namespace.Root,
250
250
  {
251
251
  ref,
@@ -257,17 +257,17 @@ Label.displayName = LabelPrimitive__namespace.Root.displayName;
257
257
 
258
258
  // src/components/ui/form.tsx
259
259
  var Form = reactHookForm.FormProvider;
260
- var FormFieldContext = React12__namespace.createContext(
260
+ var FormFieldContext = React17__namespace.createContext(
261
261
  {}
262
262
  );
263
263
  var FormField = ({
264
264
  ...props
265
265
  }) => {
266
- return /* @__PURE__ */ React12__namespace.createElement(FormFieldContext.Provider, { value: { name: props.name } }, /* @__PURE__ */ React12__namespace.createElement(reactHookForm.Controller, { ...props }));
266
+ return /* @__PURE__ */ React17__namespace.createElement(FormFieldContext.Provider, { value: { name: props.name } }, /* @__PURE__ */ React17__namespace.createElement(reactHookForm.Controller, { ...props }));
267
267
  };
268
268
  var useFormField = () => {
269
- const fieldContext = React12__namespace.useContext(FormFieldContext);
270
- const itemContext = React12__namespace.useContext(FormItemContext);
269
+ const fieldContext = React17__namespace.useContext(FormFieldContext);
270
+ const itemContext = React17__namespace.useContext(FormItemContext);
271
271
  const { getFieldState, formState } = reactHookForm.useFormContext();
272
272
  const fieldState = getFieldState(fieldContext.name, formState);
273
273
  if (!fieldContext) {
@@ -283,30 +283,30 @@ var useFormField = () => {
283
283
  ...fieldState
284
284
  };
285
285
  };
286
- var FormItemContext = React12__namespace.createContext(
286
+ var FormItemContext = React17__namespace.createContext(
287
287
  {}
288
288
  );
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: chunkLLKCXOGO_js.cn("sb-space-y-2", className), ...props }));
289
+ var FormItem = React17__namespace.forwardRef(({ className, ...props }, ref) => {
290
+ const id = React17__namespace.useId();
291
+ return /* @__PURE__ */ React17__namespace.createElement(FormItemContext.Provider, { value: { id } }, /* @__PURE__ */ React17__namespace.createElement("div", { ref, className: chunkSMX2JVU7_js.cn("sb-space-y-2", className), ...props }));
292
292
  });
293
293
  FormItem.displayName = "FormItem";
294
- var FormLabel = React12__namespace.forwardRef(({ className, ...props }, ref) => {
294
+ var FormLabel = React17__namespace.forwardRef(({ className, ...props }, ref) => {
295
295
  const { error, formItemId } = useFormField();
296
- return /* @__PURE__ */ React12__namespace.createElement(
296
+ return /* @__PURE__ */ React17__namespace.createElement(
297
297
  Label,
298
298
  {
299
299
  ref,
300
- className: chunkLLKCXOGO_js.cn(error && "sb-text-destructive", className),
300
+ className: chunkSMX2JVU7_js.cn(error && "sb-text-destructive", className),
301
301
  htmlFor: formItemId,
302
302
  ...props
303
303
  }
304
304
  );
305
305
  });
306
306
  FormLabel.displayName = "FormLabel";
307
- var FormControl = React12__namespace.forwardRef(({ ...props }, ref) => {
307
+ var FormControl = React17__namespace.forwardRef(({ ...props }, ref) => {
308
308
  const { error, formItemId, formDescriptionId, formMessageId } = useFormField();
309
- return /* @__PURE__ */ React12__namespace.createElement(
309
+ return /* @__PURE__ */ React17__namespace.createElement(
310
310
  reactSlot.Slot,
311
311
  {
312
312
  ref,
@@ -318,14 +318,14 @@ var FormControl = React12__namespace.forwardRef(({ ...props }, ref) => {
318
318
  );
319
319
  });
320
320
  FormControl.displayName = "FormControl";
321
- var FormDescription = React12__namespace.forwardRef(({ className, ...props }, ref) => {
321
+ var FormDescription = React17__namespace.forwardRef(({ className, ...props }, ref) => {
322
322
  const { formDescriptionId } = useFormField();
323
- return /* @__PURE__ */ React12__namespace.createElement(
323
+ return /* @__PURE__ */ React17__namespace.createElement(
324
324
  "p",
325
325
  {
326
326
  ref,
327
327
  id: formDescriptionId,
328
- className: chunkLLKCXOGO_js.cn(
328
+ className: chunkSMX2JVU7_js.cn(
329
329
  "sb-text-sm sb-font-roboto sb-text-muted-foreground",
330
330
  className
331
331
  ),
@@ -334,18 +334,18 @@ var FormDescription = React12__namespace.forwardRef(({ className, ...props }, re
334
334
  );
335
335
  });
336
336
  FormDescription.displayName = "FormDescription";
337
- var FormMessage = React12__namespace.forwardRef(({ className, children, ...props }, ref) => {
337
+ var FormMessage = React17__namespace.forwardRef(({ className, children, ...props }, ref) => {
338
338
  const { error, formMessageId } = useFormField();
339
339
  const body = error ? String(error?.message) : children;
340
340
  if (!body) {
341
341
  return null;
342
342
  }
343
- return /* @__PURE__ */ React12__namespace.createElement(
343
+ return /* @__PURE__ */ React17__namespace.createElement(
344
344
  "p",
345
345
  {
346
346
  ref,
347
347
  id: formMessageId,
348
- className: chunkLLKCXOGO_js.cn(
348
+ className: chunkSMX2JVU7_js.cn(
349
349
  "sb-text-sm sb-font-roboto sb-font-medium sb-text-destructive",
350
350
  className
351
351
  ),
@@ -355,13 +355,13 @@ var FormMessage = React12__namespace.forwardRef(({ className, children, ...props
355
355
  );
356
356
  });
357
357
  FormMessage.displayName = "FormMessage";
358
- var Input = React12__namespace.forwardRef(
358
+ var Input = React17__namespace.forwardRef(
359
359
  ({ className, type, ...props }, ref) => {
360
- return /* @__PURE__ */ React12__namespace.createElement(
360
+ return /* @__PURE__ */ React17__namespace.createElement(
361
361
  "input",
362
362
  {
363
363
  type,
364
- className: chunkLLKCXOGO_js.cn(
364
+ className: chunkSMX2JVU7_js.cn(
365
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",
366
366
  className
367
367
  ),
@@ -372,19 +372,19 @@ var Input = React12__namespace.forwardRef(
372
372
  }
373
373
  );
374
374
  Input.displayName = "Input";
375
- var AdvancedInput = React12__namespace.forwardRef(
375
+ var AdvancedInput = React17__namespace.forwardRef(
376
376
  ({ prepend, append, ...props }, ref) => {
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));
377
+ return /* @__PURE__ */ React17__namespace.createElement("div", { className: "sb-relative" }, /* @__PURE__ */ React17__namespace.createElement(Input, { ref, className: "sb-pl-9 sb-pr-7 sb-text-right", ...props }), prepend && /* @__PURE__ */ React17__namespace.createElement("div", { className: "sb-absolute sb-font-roboto sb-top-1/2 sb-left-3 sb--translate-y-1/2" }, prepend), append && /* @__PURE__ */ React17__namespace.createElement("div", { className: "sb-absolute sb-font-roboto sb-top-1/2 sb-right-3 sb--translate-y-1/2" }, append));
378
378
  }
379
379
  );
380
380
  AdvancedInput.displayName = "AdvancedInput";
381
381
  var MediaInput = (props) => {
382
382
  const { onFilesChange, limit = 32, multiple = false, onError } = props;
383
- const id = React12__namespace.useId();
384
- const [queue, setQueue] = React12__namespace.useState([]);
385
- const [sources, setSources] = React12__namespace.useState(props.files ?? []);
383
+ const id = React17__namespace.useId();
384
+ const [queue, setQueue] = React17__namespace.useState([]);
385
+ const [sources, setSources] = React17__namespace.useState(props.files ?? []);
386
386
  const maxConcurrentUploads = 3;
387
- const uploadingCountRef = React12__namespace.useRef(0);
387
+ const uploadingCountRef = React17__namespace.useRef(0);
388
388
  const handleFilesAdd = async (e) => {
389
389
  const files = e.target.files;
390
390
  if (!files || files.length === 0) {
@@ -455,42 +455,42 @@ var MediaInput = (props) => {
455
455
  body: JSON.stringify({ src })
456
456
  });
457
457
  };
458
- return /* @__PURE__ */ React12__namespace.createElement("div", { className: chunkLLKCXOGO_js.cn("flex flex-wrap gap-4", props.className) }, sources.map((src) => /* @__PURE__ */ React12__namespace.createElement(MediaInputItem, { key: src, className: chunkLLKCXOGO_js.cn("group", props.itemClassName) }, /* @__PURE__ */ React12__namespace.createElement(
459
- chunkLLKCXOGO_js.Image,
458
+ return /* @__PURE__ */ React17__namespace.createElement("div", { className: chunkSMX2JVU7_js.cn("flex flex-wrap gap-4", props.className) }, sources.map((src) => /* @__PURE__ */ React17__namespace.createElement(MediaInputItem, { key: src, className: chunkSMX2JVU7_js.cn("group", props.itemClassName) }, /* @__PURE__ */ React17__namespace.createElement(
459
+ chunkSMX2JVU7_js.Image,
460
460
  {
461
461
  src,
462
462
  alt: "",
463
463
  fill: true,
464
464
  className: "sb-absolute sb-inset-0 sb-object-cover sb-pointer-events-none"
465
465
  }
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(
466
+ ), /* @__PURE__ */ React17__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__ */ React17__namespace.createElement(
467
467
  "button",
468
468
  {
469
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",
470
470
  onClick: () => handleSourceDelete(src)
471
471
  },
472
- /* @__PURE__ */ React12__namespace.createElement(lucideReact.Trash2Icon, { className: "sb-h-4 sb-w-4" })
473
- )))), queue.map((_, i) => /* @__PURE__ */ React12__namespace.createElement(
472
+ /* @__PURE__ */ React17__namespace.createElement(lucideReact.Trash2Icon, { className: "sb-h-4 sb-w-4" })
473
+ )))), queue.map((_, i) => /* @__PURE__ */ React17__namespace.createElement(
474
474
  MediaInputItem,
475
475
  {
476
476
  key: i,
477
- className: chunkLLKCXOGO_js.cn(
477
+ className: chunkSMX2JVU7_js.cn(
478
478
  "sb-flex sb-h-28 sb-w-28 sb-items-center sb-justify-center",
479
479
  props.itemClassName
480
480
  )
481
481
  },
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
+ /* @__PURE__ */ React17__namespace.createElement(lucideReact.Loader2Icon, { className: "sb-h-6 sb-w-6 sb-animate-spin" })
483
+ )), multiple || !multiple && !sources.length && !queue.length ? /* @__PURE__ */ React17__namespace.createElement(
484
484
  "label",
485
485
  {
486
486
  htmlFor: id,
487
- className: chunkLLKCXOGO_js.cn(
487
+ className: chunkSMX2JVU7_js.cn(
488
488
  "sb-flex sb-h-28 sb-w-28 sb-cursor-pointer sb-items-center sb-justify-center sb-rounded-lg sb-border",
489
489
  props.itemClassName
490
490
  )
491
491
  },
492
- /* @__PURE__ */ React12__namespace.createElement(lucideReact.PlusIcon, { className: "sb-h-6 sb-w-6" }),
493
- /* @__PURE__ */ React12__namespace.createElement(
492
+ /* @__PURE__ */ React17__namespace.createElement(lucideReact.PlusIcon, { className: "sb-h-6 sb-w-6" }),
493
+ /* @__PURE__ */ React17__namespace.createElement(
494
494
  "input",
495
495
  {
496
496
  id,
@@ -504,10 +504,10 @@ var MediaInput = (props) => {
504
504
  ) : null);
505
505
  };
506
506
  var MediaInputItem = (props) => {
507
- return /* @__PURE__ */ React12__namespace.createElement(
507
+ return /* @__PURE__ */ React17__namespace.createElement(
508
508
  "div",
509
509
  {
510
- className: chunkLLKCXOGO_js.cn(
510
+ className: chunkSMX2JVU7_js.cn(
511
511
  "sb-relative sb-h-28 sb-w-28 sb-overflow-hidden sb-rounded-lg sb-border",
512
512
  props.className
513
513
  )
@@ -526,51 +526,51 @@ var MediaInputError = class extends Error {
526
526
  };
527
527
  var Select = SelectPrimitive__namespace.Root;
528
528
  var SelectValue = SelectPrimitive__namespace.Value;
529
- var SelectTrigger = React12__namespace.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ React12__namespace.createElement(
529
+ var SelectTrigger = React17__namespace.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ React17__namespace.createElement(
530
530
  SelectPrimitive__namespace.Trigger,
531
531
  {
532
532
  ref,
533
- className: chunkLLKCXOGO_js.cn(
533
+ className: chunkSMX2JVU7_js.cn(
534
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
535
  className
536
536
  ),
537
537
  ...props
538
538
  },
539
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" }))
540
+ /* @__PURE__ */ React17__namespace.createElement(SelectPrimitive__namespace.Icon, { asChild: true }, /* @__PURE__ */ React17__namespace.createElement(lucideReact.ChevronDown, { className: "sb-h-4 sb-w-4 sb-opacity-50" }))
541
541
  ));
542
542
  SelectTrigger.displayName = SelectPrimitive__namespace.Trigger.displayName;
543
- var SelectScrollUpButton = React12__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ React12__namespace.createElement(
543
+ var SelectScrollUpButton = React17__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ React17__namespace.createElement(
544
544
  SelectPrimitive__namespace.ScrollUpButton,
545
545
  {
546
546
  ref,
547
- className: chunkLLKCXOGO_js.cn(
547
+ className: chunkSMX2JVU7_js.cn(
548
548
  "sb-flex sb-cursor-default sb-items-center sb-justify-center sb-py-1",
549
549
  className
550
550
  ),
551
551
  ...props
552
552
  },
553
- /* @__PURE__ */ React12__namespace.createElement(lucideReact.ChevronUp, { className: "sb-h-4 sb-w-4" })
553
+ /* @__PURE__ */ React17__namespace.createElement(lucideReact.ChevronUp, { className: "sb-h-4 sb-w-4" })
554
554
  ));
555
555
  SelectScrollUpButton.displayName = SelectPrimitive__namespace.ScrollUpButton.displayName;
556
- var SelectScrollDownButton = React12__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ React12__namespace.createElement(
556
+ var SelectScrollDownButton = React17__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ React17__namespace.createElement(
557
557
  SelectPrimitive__namespace.ScrollDownButton,
558
558
  {
559
559
  ref,
560
- className: chunkLLKCXOGO_js.cn(
560
+ className: chunkSMX2JVU7_js.cn(
561
561
  "sb-flex sb-cursor-default sb-items-center sb-justify-center sb-py-1",
562
562
  className
563
563
  ),
564
564
  ...props
565
565
  },
566
- /* @__PURE__ */ React12__namespace.createElement(lucideReact.ChevronDown, { className: "sb-h-4 sb-w-4" })
566
+ /* @__PURE__ */ React17__namespace.createElement(lucideReact.ChevronDown, { className: "sb-h-4 sb-w-4" })
567
567
  ));
568
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(
569
+ var SelectContent = React17__namespace.forwardRef(({ className, children, position = "popper", ...props }, ref) => /* @__PURE__ */ React17__namespace.createElement(SelectPrimitive__namespace.Portal, null, /* @__PURE__ */ React17__namespace.createElement(
570
570
  SelectPrimitive__namespace.Content,
571
571
  {
572
572
  ref,
573
- className: chunkLLKCXOGO_js.cn(
573
+ className: chunkSMX2JVU7_js.cn(
574
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
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
576
  className
@@ -578,25 +578,25 @@ var SelectContent = React12__namespace.forwardRef(({ className, children, positi
578
578
  position,
579
579
  ...props
580
580
  },
581
- /* @__PURE__ */ React12__namespace.createElement(SelectScrollUpButton, null),
582
- /* @__PURE__ */ React12__namespace.createElement(
581
+ /* @__PURE__ */ React17__namespace.createElement(SelectScrollUpButton, null),
582
+ /* @__PURE__ */ React17__namespace.createElement(
583
583
  SelectPrimitive__namespace.Viewport,
584
584
  {
585
- className: chunkLLKCXOGO_js.cn(
585
+ className: chunkSMX2JVU7_js.cn(
586
586
  "sb-p-1",
587
587
  position === "popper" && "sb-h-[var(--radix-select-trigger-height)] sb-w-full sb-min-w-[var(--radix-select-trigger-width)]"
588
588
  )
589
589
  },
590
590
  children
591
591
  ),
592
- /* @__PURE__ */ React12__namespace.createElement(SelectScrollDownButton, null)
592
+ /* @__PURE__ */ React17__namespace.createElement(SelectScrollDownButton, null)
593
593
  )));
594
594
  SelectContent.displayName = SelectPrimitive__namespace.Content.displayName;
595
- var SelectLabel = React12__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ React12__namespace.createElement(
595
+ var SelectLabel = React17__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ React17__namespace.createElement(
596
596
  SelectPrimitive__namespace.Label,
597
597
  {
598
598
  ref,
599
- className: chunkLLKCXOGO_js.cn(
599
+ className: chunkSMX2JVU7_js.cn(
600
600
  "sb-py-1.5 sb-pl-8 sb-pr-2 sb-text-sm sb-font-semibold",
601
601
  className
602
602
  ),
@@ -604,55 +604,55 @@ var SelectLabel = React12__namespace.forwardRef(({ className, ...props }, ref) =
604
604
  }
605
605
  ));
606
606
  SelectLabel.displayName = SelectPrimitive__namespace.Label.displayName;
607
- var SelectItem = React12__namespace.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ React12__namespace.createElement(
607
+ var SelectItem = React17__namespace.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ React17__namespace.createElement(
608
608
  SelectPrimitive__namespace.Item,
609
609
  {
610
610
  ref,
611
- className: chunkLLKCXOGO_js.cn(
611
+ className: chunkSMX2JVU7_js.cn(
612
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
613
  className
614
614
  ),
615
615
  ...props
616
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)
617
+ /* @__PURE__ */ React17__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__ */ React17__namespace.createElement(SelectPrimitive__namespace.ItemIndicator, null, /* @__PURE__ */ React17__namespace.createElement(lucideReact.Check, { className: "sb-h-4 sb-w-4" }))),
618
+ /* @__PURE__ */ React17__namespace.createElement(SelectPrimitive__namespace.ItemText, null, children)
619
619
  ));
620
620
  SelectItem.displayName = SelectPrimitive__namespace.Item.displayName;
621
- var SelectSeparator = React12__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ React12__namespace.createElement(
621
+ var SelectSeparator = React17__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ React17__namespace.createElement(
622
622
  SelectPrimitive__namespace.Separator,
623
623
  {
624
624
  ref,
625
- className: chunkLLKCXOGO_js.cn("sb--mx-1 sb-my-1 sb-h-px sb-bg-muted", className),
625
+ className: chunkSMX2JVU7_js.cn("sb--mx-1 sb-my-1 sb-h-px sb-bg-muted", className),
626
626
  ...props
627
627
  }
628
628
  ));
629
629
  SelectSeparator.displayName = SelectPrimitive__namespace.Separator.displayName;
630
- var Switch = React12__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ React12__namespace.createElement(
630
+ var Switch = React17__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ React17__namespace.createElement(
631
631
  SwitchPrimitives__namespace.Root,
632
632
  {
633
- className: chunkLLKCXOGO_js.cn(
633
+ className: chunkSMX2JVU7_js.cn(
634
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",
635
635
  className
636
636
  ),
637
637
  ...props,
638
638
  ref
639
639
  },
640
- /* @__PURE__ */ React12__namespace.createElement(
640
+ /* @__PURE__ */ React17__namespace.createElement(
641
641
  SwitchPrimitives__namespace.Thumb,
642
642
  {
643
- className: chunkLLKCXOGO_js.cn(
643
+ className: chunkSMX2JVU7_js.cn(
644
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"
645
645
  )
646
646
  }
647
647
  )
648
648
  ));
649
649
  Switch.displayName = SwitchPrimitives__namespace.Root.displayName;
650
- var Textarea = React12__namespace.forwardRef(
650
+ var Textarea = React17__namespace.forwardRef(
651
651
  ({ className, ...props }, ref) => {
652
- return /* @__PURE__ */ React12__namespace.createElement(
652
+ return /* @__PURE__ */ React17__namespace.createElement(
653
653
  "textarea",
654
654
  {
655
- className: chunkLLKCXOGO_js.cn(
655
+ className: chunkSMX2JVU7_js.cn(
656
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",
657
657
  className
658
658
  ),
@@ -667,8 +667,8 @@ Textarea.displayName = "Textarea";
667
667
  // src/components/container-item-form.tsx
668
668
  var ContainerItemForm = (props) => {
669
669
  const { item } = props;
670
- const { patchItem } = chunkN6DUKS7Z_js.useBuilder();
671
- const component = chunkLLKCXOGO_js.builder.getComponent(item.component);
670
+ const { patchItem } = chunkQ2EMWEEZ_js.useBuilder();
671
+ const component = chunkSMX2JVU7_js.builder.getComponent(item.component);
672
672
  if (!component) {
673
673
  throw new Error(
674
674
  `[simple-builder]: Component with id ${item.component} not found in container item form component`
@@ -688,11 +688,11 @@ var ContainerItemForm = (props) => {
688
688
  props: values
689
689
  });
690
690
  };
691
- React12__namespace.useEffect(() => {
691
+ React17__namespace.useEffect(() => {
692
692
  const subscription = form.watch(() => form.handleSubmit(onSubmit)());
693
693
  return () => subscription.unsubscribe();
694
694
  }, [form.watch, form.handleSubmit]);
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(
695
+ return /* @__PURE__ */ React17__namespace.createElement(Form, { ...form }, /* @__PURE__ */ React17__namespace.createElement("form", { onSubmit: form.handleSubmit(onSubmit) }, /* @__PURE__ */ React17__namespace.createElement("div", { className: "sb-space-y-4 sb-p-4" }, (component.inputs || []).map((input) => /* @__PURE__ */ React17__namespace.createElement(
696
696
  RenderFormField,
697
697
  {
698
698
  key: input.name,
@@ -709,16 +709,16 @@ var RenderFormField = (props) => {
709
709
  name: input.name
710
710
  });
711
711
  if (input.multiple) {
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(
712
+ return /* @__PURE__ */ React17__namespace.createElement("fieldset", { className: "sb-space-y-2" }, /* @__PURE__ */ React17__namespace.createElement(FormLabel, null, input.friendlyName || input.name), /* @__PURE__ */ React17__namespace.createElement("div", { className: "sb-space-y-4" }, fieldArray.fields.map(
713
+ (field, i) => type !== "grouped" ? /* @__PURE__ */ React17__namespace.createElement(
714
714
  FormField,
715
715
  {
716
716
  key: field.id,
717
717
  control: form.control,
718
718
  name: `${input.name}.${i}`,
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" })))
719
+ render: ({ field: field2 }) => /* @__PURE__ */ React17__namespace.createElement("div", { className: "sb-flex sb-items-center sb-gap-3" }, /* @__PURE__ */ React17__namespace.createElement(RenderInput, { field: field2, type: input.type }), /* @__PURE__ */ React17__namespace.createElement("button", { type: "button", onClick: () => fieldArray.remove(i) }, /* @__PURE__ */ React17__namespace.createElement(lucideReact.XIcon, { className: "sb-h-4 sb-w-4" })))
720
720
  }
721
- ) : /* @__PURE__ */ React12__namespace.createElement("div", { className: "sb-flex sb-items-center sb-relative" }, /* @__PURE__ */ React12__namespace.createElement(
721
+ ) : /* @__PURE__ */ React17__namespace.createElement("div", { className: "sb-flex sb-items-center sb-relative" }, /* @__PURE__ */ React17__namespace.createElement(
722
722
  RenderFormField,
723
723
  {
724
724
  key: field.id,
@@ -731,28 +731,28 @@ var RenderFormField = (props) => {
731
731
  friendlyName: ""
732
732
  }
733
733
  }
734
- ), /* @__PURE__ */ React12__namespace.createElement(
734
+ ), /* @__PURE__ */ React17__namespace.createElement(
735
735
  "button",
736
736
  {
737
737
  type: "button",
738
738
  onClick: () => fieldArray.remove(i),
739
739
  className: "sb-absolute sb-top-2 sb-right-2 sb-text-foreground/70 hover:sb-text-foreground"
740
740
  },
741
- /* @__PURE__ */ React12__namespace.createElement(lucideReact.XIcon, { className: "sb-h-4 sb-w-4" })
741
+ /* @__PURE__ */ React17__namespace.createElement(lucideReact.XIcon, { className: "sb-h-4 sb-w-4" })
742
742
  ))
743
- ), /* @__PURE__ */ React12__namespace.createElement(
744
- chunkN6DUKS7Z_js.Button,
743
+ ), /* @__PURE__ */ React17__namespace.createElement(
744
+ chunkQ2EMWEEZ_js.Button,
745
745
  {
746
746
  type: "button",
747
747
  variant: "outline",
748
748
  size: "sm",
749
- className: chunkLLKCXOGO_js.cn(
749
+ className: chunkSMX2JVU7_js.cn(
750
750
  "sb-w-[89%] sb-border-2 sb-border-dashed sb-text-muted-foreground",
751
751
  type === "grouped" && "sb-w-full"
752
752
  ),
753
753
  onClick: () => fieldArray.append(void 0)
754
754
  },
755
- /* @__PURE__ */ React12__namespace.createElement(lucideReact.PlusCircleIcon, { className: "sb-h-4 sb-w-4" })
755
+ /* @__PURE__ */ React17__namespace.createElement(lucideReact.PlusCircleIcon, { className: "sb-h-4 sb-w-4" })
756
756
  )));
757
757
  }
758
758
  switch (type) {
@@ -763,27 +763,27 @@ var RenderFormField = (props) => {
763
763
  case "color":
764
764
  case "date":
765
765
  case "file":
766
- return /* @__PURE__ */ React12__namespace.createElement(
766
+ return /* @__PURE__ */ React17__namespace.createElement(
767
767
  FormField,
768
768
  {
769
769
  key: input.name,
770
770
  control: form.control,
771
771
  name: input.name,
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))
772
+ render: ({ field }) => /* @__PURE__ */ React17__namespace.createElement(FormItem, null, /* @__PURE__ */ React17__namespace.createElement(FormLabel, null, input.friendlyName || input.name), /* @__PURE__ */ React17__namespace.createElement(FormControl, null, /* @__PURE__ */ React17__namespace.createElement(RenderInput, { type, field, options: input?.enum })), input.helperText && /* @__PURE__ */ React17__namespace.createElement(FormDescription, null, input.helperText), /* @__PURE__ */ React17__namespace.createElement(FormMessage, null))
773
773
  }
774
774
  );
775
775
  case "boolean":
776
- return /* @__PURE__ */ React12__namespace.createElement(
776
+ return /* @__PURE__ */ React17__namespace.createElement(
777
777
  FormField,
778
778
  {
779
779
  key: input.name,
780
780
  control: form.control,
781
781
  name: input.name,
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))
782
+ render: ({ field }) => /* @__PURE__ */ React17__namespace.createElement(FormItem, { className: "sb-flex sb-flex-row sb-items-center sb-justify-between sb-space-y-0" }, /* @__PURE__ */ React17__namespace.createElement(FormLabel, null, input.friendlyName || input.name), /* @__PURE__ */ React17__namespace.createElement(FormControl, null, /* @__PURE__ */ React17__namespace.createElement(RenderInput, { type, field })), input.helperText && /* @__PURE__ */ React17__namespace.createElement(FormDescription, null, input.helperText), /* @__PURE__ */ React17__namespace.createElement(FormMessage, null))
783
783
  }
784
784
  );
785
785
  case "grouped":
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(
786
+ return /* @__PURE__ */ React17__namespace.createElement("div", { className: "sb-space-y-2 sb-w-full" }, input.friendlyName !== "" && /* @__PURE__ */ React17__namespace.createElement(FormLabel, null, input.friendlyName || input.name), /* @__PURE__ */ React17__namespace.createElement("div", { className: "sb-space-y-2 sb-p-3 sb-w-full sb-border sb-rounded-lg" }, input.inputs.map((sub) => /* @__PURE__ */ React17__namespace.createElement(
787
787
  RenderFormField,
788
788
  {
789
789
  key: `${input.name}.${sub.name}`,
@@ -806,29 +806,29 @@ var RenderInput = (props) => {
806
806
  switch (type) {
807
807
  case "string":
808
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))));
809
+ return /* @__PURE__ */ React17__namespace.createElement(Input, { ...field });
810
+ return /* @__PURE__ */ React17__namespace.createElement(Select, { onValueChange: field.onChange, defaultValue: field.value }, /* @__PURE__ */ React17__namespace.createElement(SelectTrigger, null, /* @__PURE__ */ React17__namespace.createElement(SelectValue, null)), /* @__PURE__ */ React17__namespace.createElement(SelectContent, null, options.map((option) => /* @__PURE__ */ React17__namespace.createElement(SelectItem, { key: option, value: option }, option))));
811
811
  case "longText":
812
812
  case "richText":
813
- return /* @__PURE__ */ React12__namespace.createElement(Textarea, { ...field });
813
+ return /* @__PURE__ */ React17__namespace.createElement(Textarea, { ...field });
814
814
  case "number":
815
- return /* @__PURE__ */ React12__namespace.createElement(Input, { type: "number", ...field });
815
+ return /* @__PURE__ */ React17__namespace.createElement(Input, { type: "number", ...field });
816
816
  case "color":
817
- return /* @__PURE__ */ React12__namespace.createElement(ColorPicker, { color: field.value, onColorChange: field.onChange });
817
+ return /* @__PURE__ */ React17__namespace.createElement(ColorPicker, { color: field.value, onColorChange: field.onChange });
818
818
  case "date":
819
- return /* @__PURE__ */ React12__namespace.createElement(Popover, null, /* @__PURE__ */ React12__namespace.createElement(PopoverTrigger, { asChild: true }, /* @__PURE__ */ React12__namespace.createElement(
820
- chunkN6DUKS7Z_js.Button,
819
+ return /* @__PURE__ */ React17__namespace.createElement(Popover, null, /* @__PURE__ */ React17__namespace.createElement(PopoverTrigger, { asChild: true }, /* @__PURE__ */ React17__namespace.createElement(
820
+ chunkQ2EMWEEZ_js.Button,
821
821
  {
822
822
  variant: "outline",
823
823
  size: "sm",
824
- className: chunkLLKCXOGO_js.cn(
824
+ className: chunkSMX2JVU7_js.cn(
825
825
  "sb-w-full sb-flex sb-justify-start sb-text-left sb-font-normal",
826
826
  !field.value && "sb-text-muted-foreground"
827
827
  )
828
828
  },
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(
829
+ /* @__PURE__ */ React17__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__ */ React17__namespace.createElement("span", null, "Pick a date")
831
+ )), /* @__PURE__ */ React17__namespace.createElement(PopoverContent, { className: "sb-w-auto sb-p-0", align: "start" }, /* @__PURE__ */ React17__namespace.createElement(
832
832
  Calendar,
833
833
  {
834
834
  mode: "single",
@@ -838,9 +838,9 @@ var RenderInput = (props) => {
838
838
  }
839
839
  )));
840
840
  case "boolean":
841
- return /* @__PURE__ */ React12__namespace.createElement(Switch, { checked: field.value, onCheckedChange: field.onChange });
841
+ return /* @__PURE__ */ React17__namespace.createElement(Switch, { checked: field.value, onCheckedChange: field.onChange });
842
842
  case "file":
843
- return /* @__PURE__ */ React12__namespace.createElement(
843
+ return /* @__PURE__ */ React17__namespace.createElement(
844
844
  MediaInput,
845
845
  {
846
846
  className: "sb-grid sb-grid-cols-2 sb-gap-1",
@@ -861,7 +861,7 @@ var RenderInput = (props) => {
861
861
  }
862
862
  };
863
863
  var Tabs = TabsPrimitive__namespace.Root;
864
- var tabsListVariants = chunkLLKCXOGO_js.tv({
864
+ var tabsListVariants = chunkSMX2JVU7_js.tv({
865
865
  variants: {
866
866
  variant: {
867
867
  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",
@@ -872,7 +872,7 @@ var tabsListVariants = chunkLLKCXOGO_js.tv({
872
872
  variant: "contained"
873
873
  }
874
874
  });
875
- var TabsList = React12__namespace.forwardRef(({ variant, className, ...props }, ref) => /* @__PURE__ */ React12__namespace.createElement(
875
+ var TabsList = React17__namespace.forwardRef(({ variant, className, ...props }, ref) => /* @__PURE__ */ React17__namespace.createElement(
876
876
  TabsPrimitive__namespace.List,
877
877
  {
878
878
  ref,
@@ -881,7 +881,7 @@ var TabsList = React12__namespace.forwardRef(({ variant, className, ...props },
881
881
  }
882
882
  ));
883
883
  TabsList.displayName = TabsPrimitive__namespace.List.displayName;
884
- var tabsTriggerVariants = chunkLLKCXOGO_js.tv({
884
+ var tabsTriggerVariants = chunkSMX2JVU7_js.tv({
885
885
  variants: {
886
886
  variant: {
887
887
  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",
@@ -892,7 +892,7 @@ var tabsTriggerVariants = chunkLLKCXOGO_js.tv({
892
892
  variant: "contained"
893
893
  }
894
894
  });
895
- var TabsTrigger = React12__namespace.forwardRef(({ variant, className, ...props }, ref) => /* @__PURE__ */ React12__namespace.createElement(
895
+ var TabsTrigger = React17__namespace.forwardRef(({ variant, className, ...props }, ref) => /* @__PURE__ */ React17__namespace.createElement(
896
896
  TabsPrimitive__namespace.Trigger,
897
897
  {
898
898
  ref,
@@ -901,11 +901,11 @@ var TabsTrigger = React12__namespace.forwardRef(({ variant, className, ...props
901
901
  }
902
902
  ));
903
903
  TabsTrigger.displayName = TabsPrimitive__namespace.Trigger.displayName;
904
- var TabsContent = React12__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ React12__namespace.createElement(
904
+ var TabsContent = React17__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ React17__namespace.createElement(
905
905
  TabsPrimitive__namespace.Content,
906
906
  {
907
907
  ref,
908
- className: chunkLLKCXOGO_js.cn(
908
+ className: chunkSMX2JVU7_js.cn(
909
909
  "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",
910
910
  className
911
911
  ),
@@ -936,38 +936,38 @@ var BackgroundPicker = (props) => {
936
936
  "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)",
937
937
  "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)"
938
938
  ];
939
- const defaultTab = React12__namespace.useMemo(() => {
939
+ const defaultTab = React17__namespace.useMemo(() => {
940
940
  if (background.includes("url"))
941
941
  return "image";
942
942
  if (background.includes("gradient"))
943
943
  return "gradient";
944
944
  return "solid";
945
945
  }, [background]);
946
- return /* @__PURE__ */ React12__namespace.createElement(Popover, null, /* @__PURE__ */ React12__namespace.createElement(PopoverTrigger, { asChild: true }, /* @__PURE__ */ React12__namespace.createElement(
947
- chunkN6DUKS7Z_js.Button,
946
+ return /* @__PURE__ */ React17__namespace.createElement(Popover, null, /* @__PURE__ */ React17__namespace.createElement(PopoverTrigger, { asChild: true }, /* @__PURE__ */ React17__namespace.createElement(
947
+ chunkQ2EMWEEZ_js.Button,
948
948
  {
949
949
  variant: "outline",
950
950
  size: "sm",
951
- className: chunkLLKCXOGO_js.cn(
951
+ className: chunkSMX2JVU7_js.cn(
952
952
  "sb-justify-start sb-text-left sb-font-normal sb-normal-case sb-w-full",
953
953
  !background && "sb-text-muted-foreground",
954
954
  className
955
955
  )
956
956
  },
957
- /* @__PURE__ */ React12__namespace.createElement("div", { className: "sb-w-full sb-flex sb-items-center sb-gap-2" }, background ? /* @__PURE__ */ React12__namespace.createElement(
957
+ /* @__PURE__ */ React17__namespace.createElement("div", { className: "sb-w-full sb-flex sb-items-center sb-gap-2" }, background ? /* @__PURE__ */ React17__namespace.createElement(
958
958
  "div",
959
959
  {
960
960
  className: "sb-h-4 sb-w-4 sb-rounded !sb-bg-center !sb-bg-cover sb-transition-all sb-border",
961
961
  style: { background }
962
962
  }
963
- ) : /* @__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"))
964
- )), /* @__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(
963
+ ) : /* @__PURE__ */ React17__namespace.createElement(lucideReact.PaintbrushIcon, { className: "sb-h-4 sb-w-4" }), /* @__PURE__ */ React17__namespace.createElement("div", { className: "sb-truncate sb-flex-1" }, background ? background : "Kies een achtergrond"))
964
+ )), /* @__PURE__ */ React17__namespace.createElement(PopoverContent, { className: "sb-w-64 sb-p-0" }, /* @__PURE__ */ React17__namespace.createElement(Tabs, { defaultValue: defaultTab }, /* @__PURE__ */ React17__namespace.createElement(TabsList, { className: "sb-w-full" }, /* @__PURE__ */ React17__namespace.createElement(TabsTrigger, { className: "sb-flex-1", value: "solid" }, "Solid"), /* @__PURE__ */ React17__namespace.createElement(TabsTrigger, { className: "sb-flex-1", value: "gradient" }, "Gradient"), /* @__PURE__ */ React17__namespace.createElement(TabsTrigger, { className: "sb-flex-1", value: "image" }, "Image")), /* @__PURE__ */ React17__namespace.createElement(
965
965
  TabsContent,
966
966
  {
967
967
  value: "solid",
968
968
  className: "data-[state=active]:sb-flex sb-flex-wrap sb-gap-1 sb-p-4"
969
969
  },
970
- solids.map((s) => /* @__PURE__ */ React12__namespace.createElement(
970
+ solids.map((s) => /* @__PURE__ */ React17__namespace.createElement(
971
971
  "div",
972
972
  {
973
973
  key: s,
@@ -976,13 +976,13 @@ var BackgroundPicker = (props) => {
976
976
  onClick: () => onBackgroundChange(s)
977
977
  }
978
978
  ))
979
- ), /* @__PURE__ */ React12__namespace.createElement(
979
+ ), /* @__PURE__ */ React17__namespace.createElement(
980
980
  TabsContent,
981
981
  {
982
982
  value: "gradient",
983
983
  className: "data-[state=active]:sb-flex sb-flex-wrap sb-gap-1 sb-p-4"
984
984
  },
985
- gradients.map((s) => /* @__PURE__ */ React12__namespace.createElement(
985
+ gradients.map((s) => /* @__PURE__ */ React17__namespace.createElement(
986
986
  "div",
987
987
  {
988
988
  key: s,
@@ -991,7 +991,7 @@ var BackgroundPicker = (props) => {
991
991
  onClick: () => onBackgroundChange(s)
992
992
  }
993
993
  ))
994
- ), /* @__PURE__ */ React12__namespace.createElement(TabsContent, { value: "image" }, /* @__PURE__ */ React12__namespace.createElement("div", { className: "sb-p-4 sb-border-b" }, /* @__PURE__ */ React12__namespace.createElement(
994
+ ), /* @__PURE__ */ React17__namespace.createElement(TabsContent, { value: "image" }, /* @__PURE__ */ React17__namespace.createElement("div", { className: "sb-p-4 sb-border-b" }, /* @__PURE__ */ React17__namespace.createElement(
995
995
  MediaInput,
996
996
  {
997
997
  className: "sb-grid sb-grid-cols-2 sb-gap-1",
@@ -1007,7 +1007,7 @@ var BackgroundPicker = (props) => {
1007
1007
  "media-input: Error: " + e?.description
1008
1008
  )
1009
1009
  }
1010
- )), /* @__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(
1010
+ )), /* @__PURE__ */ React17__namespace.createElement("div", { className: "sb-grid sb-grid-cols-2 sb-gap-1 sb-p-4" }, images.map((s) => /* @__PURE__ */ React17__namespace.createElement(
1011
1011
  "div",
1012
1012
  {
1013
1013
  key: s,
@@ -1017,7 +1017,7 @@ var BackgroundPicker = (props) => {
1017
1017
  }
1018
1018
  )))))));
1019
1019
  };
1020
- var toggleVariants = chunkLLKCXOGO_js.tv({
1020
+ var toggleVariants = chunkSMX2JVU7_js.tv({
1021
1021
  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",
1022
1022
  variants: {
1023
1023
  variant: {
@@ -1035,7 +1035,7 @@ var toggleVariants = chunkLLKCXOGO_js.tv({
1035
1035
  size: "default"
1036
1036
  }
1037
1037
  });
1038
- var Toggle = React12__namespace.forwardRef(({ className, variant, size, ...props }, ref) => /* @__PURE__ */ React12__namespace.createElement(
1038
+ var Toggle = React17__namespace.forwardRef(({ className, variant, size, ...props }, ref) => /* @__PURE__ */ React17__namespace.createElement(
1039
1039
  TogglePrimitive__namespace.Root,
1040
1040
  {
1041
1041
  ref,
@@ -1047,70 +1047,70 @@ Toggle.displayName = TogglePrimitive__namespace.Root.displayName;
1047
1047
 
1048
1048
  // src/components/ui/spacing-input.tsx
1049
1049
  var SpacingInput = (props) => {
1050
- const [value, setValue] = React12__namespace.useState(parse(props.value || "0px"));
1051
- const [indipendent, setIndipendent] = React12__namespace.useState(
1050
+ const [value, setValue] = React17__namespace.useState(parse(props.value || "0px"));
1051
+ const [indipendent, setIndipendent] = React17__namespace.useState(
1052
1052
  isIndipendent(parse(props.value || "0px"))
1053
1053
  );
1054
- React12__namespace.useEffect(() => {
1054
+ React17__namespace.useEffect(() => {
1055
1055
  if (!props.onChange)
1056
1056
  return;
1057
1057
  props.onChange(stringify(value));
1058
1058
  }, [value, props.onChange]);
1059
- 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(
1059
+ return /* @__PURE__ */ React17__namespace.createElement("div", { className: "sb-grid sb-grid-cols-[1fr,auto] sb-gap-3" }, /* @__PURE__ */ React17__namespace.createElement("div", { className: "sb-grid sb-grid-cols-2 sb-items-center sb-gap-3" }, !indipendent ? /* @__PURE__ */ React17__namespace.createElement(React17__namespace.Fragment, null, /* @__PURE__ */ React17__namespace.createElement(
1060
1060
  AdvancedInput,
1061
1061
  {
1062
1062
  value: value.left,
1063
1063
  pattern: "\\d+",
1064
1064
  onChange: ({ target: { value: value2 } }) => setValue((prev) => ({ ...prev, left: +value2, right: +value2 })),
1065
- prepend: /* @__PURE__ */ React12__namespace.createElement(lucideReact.AlignHorizontalSpaceAroundIcon, { className: "sb-h-4 sb-w-4" }),
1066
- append: /* @__PURE__ */ React12__namespace.createElement("span", { className: "sb-text-muted-foreground" }, "px")
1065
+ prepend: /* @__PURE__ */ React17__namespace.createElement(lucideReact.AlignHorizontalSpaceAroundIcon, { className: "sb-h-4 sb-w-4" }),
1066
+ append: /* @__PURE__ */ React17__namespace.createElement("span", { className: "sb-text-muted-foreground" }, "px")
1067
1067
  }
1068
- ), /* @__PURE__ */ React12__namespace.createElement(
1068
+ ), /* @__PURE__ */ React17__namespace.createElement(
1069
1069
  AdvancedInput,
1070
1070
  {
1071
1071
  value: value.top,
1072
1072
  pattern: "\\d+",
1073
1073
  onChange: ({ target: { value: value2 } }) => setValue((prev) => ({ ...prev, top: +value2, bottom: +value2 })),
1074
- prepend: /* @__PURE__ */ React12__namespace.createElement(lucideReact.AlignHorizontalSpaceAroundIcon, { className: "sb-h-4 sb-w-4 sb-rotate-90" }),
1075
- append: /* @__PURE__ */ React12__namespace.createElement("span", { className: "sb-text-muted-foreground" }, "px")
1074
+ prepend: /* @__PURE__ */ React17__namespace.createElement(lucideReact.AlignHorizontalSpaceAroundIcon, { className: "sb-h-4 sb-w-4 sb-rotate-90" }),
1075
+ append: /* @__PURE__ */ React17__namespace.createElement("span", { className: "sb-text-muted-foreground" }, "px")
1076
1076
  }
1077
- )) : /* @__PURE__ */ React12__namespace.createElement(React12__namespace.Fragment, null, /* @__PURE__ */ React12__namespace.createElement(
1077
+ )) : /* @__PURE__ */ React17__namespace.createElement(React17__namespace.Fragment, null, /* @__PURE__ */ React17__namespace.createElement(
1078
1078
  AdvancedInput,
1079
1079
  {
1080
1080
  value: value.left,
1081
1081
  pattern: "\\d+",
1082
1082
  onChange: ({ target: { value: value2 } }) => setValue((prev) => ({ ...prev, left: +value2 })),
1083
- prepend: /* @__PURE__ */ React12__namespace.createElement(lucideReact.AlignHorizontalJustifyStartIcon, { className: "sb-h-4 sb-w-4" }),
1084
- append: /* @__PURE__ */ React12__namespace.createElement("span", { className: "sb-text-muted-foreground" }, "px")
1083
+ prepend: /* @__PURE__ */ React17__namespace.createElement(lucideReact.AlignHorizontalJustifyStartIcon, { className: "sb-h-4 sb-w-4" }),
1084
+ append: /* @__PURE__ */ React17__namespace.createElement("span", { className: "sb-text-muted-foreground" }, "px")
1085
1085
  }
1086
- ), /* @__PURE__ */ React12__namespace.createElement(
1086
+ ), /* @__PURE__ */ React17__namespace.createElement(
1087
1087
  AdvancedInput,
1088
1088
  {
1089
1089
  value: value.top,
1090
1090
  pattern: "\\d+",
1091
1091
  onChange: ({ target: { value: value2 } }) => setValue((prev) => ({ ...prev, top: +value2 })),
1092
- prepend: /* @__PURE__ */ React12__namespace.createElement(lucideReact.AlignHorizontalJustifyStartIcon, { className: "sb-h-4 sb-w-4 sb-rotate-90" }),
1093
- append: /* @__PURE__ */ React12__namespace.createElement("span", { className: "sb-text-muted-foreground" }, "px")
1092
+ prepend: /* @__PURE__ */ React17__namespace.createElement(lucideReact.AlignHorizontalJustifyStartIcon, { className: "sb-h-4 sb-w-4 sb-rotate-90" }),
1093
+ append: /* @__PURE__ */ React17__namespace.createElement("span", { className: "sb-text-muted-foreground" }, "px")
1094
1094
  }
1095
- ), /* @__PURE__ */ React12__namespace.createElement(
1095
+ ), /* @__PURE__ */ React17__namespace.createElement(
1096
1096
  AdvancedInput,
1097
1097
  {
1098
1098
  value: value.right,
1099
1099
  pattern: "\\d+",
1100
1100
  onChange: ({ target: { value: value2 } }) => setValue((prev) => ({ ...prev, right: +value2 })),
1101
- prepend: /* @__PURE__ */ React12__namespace.createElement(lucideReact.AlignHorizontalJustifyStartIcon, { className: "sb-h-4 sb-w-4 sb-rotate-180" }),
1102
- append: /* @__PURE__ */ React12__namespace.createElement("span", { className: "sb-text-muted-foreground" }, "px")
1101
+ prepend: /* @__PURE__ */ React17__namespace.createElement(lucideReact.AlignHorizontalJustifyStartIcon, { className: "sb-h-4 sb-w-4 sb-rotate-180" }),
1102
+ append: /* @__PURE__ */ React17__namespace.createElement("span", { className: "sb-text-muted-foreground" }, "px")
1103
1103
  }
1104
- ), /* @__PURE__ */ React12__namespace.createElement(
1104
+ ), /* @__PURE__ */ React17__namespace.createElement(
1105
1105
  AdvancedInput,
1106
1106
  {
1107
1107
  value: value.bottom,
1108
1108
  pattern: "\\d+",
1109
1109
  onChange: ({ target: { value: value2 } }) => setValue((prev) => ({ ...prev, bottom: +value2 })),
1110
- prepend: /* @__PURE__ */ React12__namespace.createElement(lucideReact.AlignHorizontalJustifyStartIcon, { className: "sb-h-4 sb-w-4 sb--rotate-90" }),
1111
- append: /* @__PURE__ */ React12__namespace.createElement("span", { className: "sb-text-muted-foreground" }, "px")
1110
+ prepend: /* @__PURE__ */ React17__namespace.createElement(lucideReact.AlignHorizontalJustifyStartIcon, { className: "sb-h-4 sb-w-4 sb--rotate-90" }),
1111
+ append: /* @__PURE__ */ React17__namespace.createElement("span", { className: "sb-text-muted-foreground" }, "px")
1112
1112
  }
1113
- ))), /* @__PURE__ */ React12__namespace.createElement("div", { className: "sb-shrink-0" }, /* @__PURE__ */ React12__namespace.createElement(
1113
+ ))), /* @__PURE__ */ React17__namespace.createElement("div", { className: "sb-shrink-0" }, /* @__PURE__ */ React17__namespace.createElement(
1114
1114
  Toggle,
1115
1115
  {
1116
1116
  className: "sb-shrink-0 sb-flex sb-w-8 sb-h-8 sb-p-0",
@@ -1119,7 +1119,7 @@ var SpacingInput = (props) => {
1119
1119
  pressed: indipendent,
1120
1120
  onPressedChange: setIndipendent
1121
1121
  },
1122
- /* @__PURE__ */ React12__namespace.createElement(lucideReact.ScanIcon, { className: "sb-h-4 sb-w-4" })
1122
+ /* @__PURE__ */ React17__namespace.createElement(lucideReact.ScanIcon, { className: "sb-h-4 sb-w-4" })
1123
1123
  )));
1124
1124
  };
1125
1125
  var isIndipendent = (value) => {
@@ -1157,6 +1157,7 @@ var stringify = (value) => {
1157
1157
  // src/components/item-design-form.tsx
1158
1158
  var designSchema = zod.z.object({
1159
1159
  container: zod.z.coerce.boolean(),
1160
+ hidden: zod.z.enum(["always", "mobile", "desktop", "never"]),
1160
1161
  desktop: zod.z.object({
1161
1162
  background: zod.z.string(),
1162
1163
  color: zod.z.string(),
@@ -1172,7 +1173,7 @@ var designSchema = zod.z.object({
1172
1173
  });
1173
1174
  var ItemDesignForm = (props) => {
1174
1175
  const { item } = props;
1175
- const component = chunkLLKCXOGO_js.builder.getComponent(item.component);
1176
+ const component = chunkSMX2JVU7_js.builder.getComponent(item.component);
1176
1177
  if (!component) {
1177
1178
  throw new Error(
1178
1179
  `[simple-builder]: Component "${item.component}" not found`
@@ -1209,13 +1210,14 @@ var ItemDesignForm = (props) => {
1209
1210
  resolver: zod$1.zodResolver(designSchema),
1210
1211
  values: {
1211
1212
  container: item.styles?.container ?? true,
1213
+ hidden: item.styles?.hidden ?? "never",
1212
1214
  desktop: getDefaultDeviceValues("desktop"),
1213
1215
  mobile: getDefaultDeviceValues("mobile")
1214
1216
  }
1215
1217
  });
1216
- const { patchItem } = chunkN6DUKS7Z_js.useBuilder();
1218
+ const { patchItem } = chunkQ2EMWEEZ_js.useBuilder();
1217
1219
  const onSubmit = (values) => {
1218
- const { container, desktop, mobile } = values;
1220
+ const { container, hidden, desktop, mobile } = values;
1219
1221
  const dirtyFields = form.formState.dirtyFields;
1220
1222
  const desktopPatch = Object.entries(desktop).reduce(
1221
1223
  (acc, [key, value]) => ({
@@ -1246,112 +1248,120 @@ var ItemDesignForm = (props) => {
1246
1248
  patchItem(item.id, {
1247
1249
  styles: {
1248
1250
  ...container === false && { container },
1251
+ ...hidden !== "never" && { hidden },
1249
1252
  ...Object.keys(desktopPatch).length && { desktop: desktopPatch },
1250
1253
  ...Object.keys(mobilePatch).length && { mobile: mobilePatch }
1251
1254
  }
1252
1255
  });
1253
1256
  };
1254
- const [device, setDevice] = React12__namespace.useState("desktop");
1255
- React12__namespace.useEffect(() => {
1257
+ const [device, setDevice] = React17__namespace.useState("desktop");
1258
+ React17__namespace.useEffect(() => {
1256
1259
  const subscription = form.watch(() => form.handleSubmit(onSubmit)());
1257
1260
  return () => subscription.unsubscribe();
1258
1261
  }, [form.watch, form.handleSubmit]);
1259
- 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(
1262
+ return /* @__PURE__ */ React17__namespace.createElement(Form, { ...form }, /* @__PURE__ */ React17__namespace.createElement("form", { onSubmit: form.handleSubmit(onSubmit) }, /* @__PURE__ */ React17__namespace.createElement("div", { className: "sb-space-y-4 sb-p-4" }, /* @__PURE__ */ React17__namespace.createElement(
1260
1263
  Tabs,
1261
1264
  {
1262
1265
  defaultValue: device,
1263
1266
  onValueChange: (device2) => setDevice(device2)
1264
1267
  },
1265
- /* @__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")))
1266
- ), /* @__PURE__ */ React12__namespace.createElement("div", { className: "sb-space-y-4" }, /* @__PURE__ */ React12__namespace.createElement(
1268
+ /* @__PURE__ */ React17__namespace.createElement(TabsList, { className: "sb-h-9 sb-grid sb-w-full sb-grid-cols-2" }, /* @__PURE__ */ React17__namespace.createElement(TabsTrigger, { value: "desktop", className: "sb-text-xs" }, /* @__PURE__ */ React17__namespace.createElement(lucideReact.MonitorIcon, { className: "sb-h-4 sb-w-4 sb-mr-2" }), /* @__PURE__ */ React17__namespace.createElement("span", null, "Desktop")), /* @__PURE__ */ React17__namespace.createElement(TabsTrigger, { value: "mobile", className: "sb-text-xs" }, /* @__PURE__ */ React17__namespace.createElement(lucideReact.SmartphoneIcon, { className: "sb-h-4 sb-w-4 sb-mr-2" }), /* @__PURE__ */ React17__namespace.createElement("span", null, "Mobiel")))
1269
+ ), /* @__PURE__ */ React17__namespace.createElement("div", { className: "sb-space-y-4" }, /* @__PURE__ */ React17__namespace.createElement(
1267
1270
  FormField,
1268
1271
  {
1269
1272
  control: form.control,
1270
1273
  key: `${device}.background`,
1271
1274
  name: `${device}.background`,
1272
- 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(
1275
+ render: ({ field }) => /* @__PURE__ */ React17__namespace.createElement(FormItem, null, /* @__PURE__ */ React17__namespace.createElement(FormLabel, null, "Achtergrond"), /* @__PURE__ */ React17__namespace.createElement(FormControl, null, /* @__PURE__ */ React17__namespace.createElement(
1273
1276
  BackgroundPicker,
1274
1277
  {
1275
1278
  background: field.value,
1276
1279
  onBackgroundChange: field.onChange
1277
1280
  }
1278
- )), /* @__PURE__ */ React12__namespace.createElement(FormMessage, null))
1281
+ )), /* @__PURE__ */ React17__namespace.createElement(FormMessage, null))
1279
1282
  }
1280
- ), /* @__PURE__ */ React12__namespace.createElement(
1283
+ ), /* @__PURE__ */ React17__namespace.createElement(
1281
1284
  FormField,
1282
1285
  {
1283
1286
  control: form.control,
1284
1287
  key: `${device}.color`,
1285
1288
  name: `${device}.color`,
1286
- 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(
1289
+ render: ({ field }) => /* @__PURE__ */ React17__namespace.createElement(FormItem, null, /* @__PURE__ */ React17__namespace.createElement(FormLabel, null, "Inhoud kleur"), /* @__PURE__ */ React17__namespace.createElement(FormControl, null, /* @__PURE__ */ React17__namespace.createElement(
1287
1290
  ColorPicker,
1288
1291
  {
1289
1292
  color: field.value,
1290
1293
  onColorChange: field.onChange
1291
1294
  }
1292
- )), /* @__PURE__ */ React12__namespace.createElement(FormMessage, null))
1295
+ )), /* @__PURE__ */ React17__namespace.createElement(FormMessage, null))
1293
1296
  }
1294
- ), /* @__PURE__ */ React12__namespace.createElement("hr", null), /* @__PURE__ */ React12__namespace.createElement(
1297
+ ), /* @__PURE__ */ React17__namespace.createElement("hr", null), /* @__PURE__ */ React17__namespace.createElement(
1298
+ FormField,
1299
+ {
1300
+ control: form.control,
1301
+ name: "hidden",
1302
+ render: ({ field }) => /* @__PURE__ */ React17__namespace.createElement(FormItem, null, /* @__PURE__ */ React17__namespace.createElement(FormLabel, null, "Verbergen"), /* @__PURE__ */ React17__namespace.createElement(FormControl, null, /* @__PURE__ */ React17__namespace.createElement(Select, { value: field.value, onValueChange: field.onChange }, /* @__PURE__ */ React17__namespace.createElement(SelectTrigger, null, /* @__PURE__ */ React17__namespace.createElement(SelectValue, null)), /* @__PURE__ */ React17__namespace.createElement(SelectContent, null, /* @__PURE__ */ React17__namespace.createElement(SelectItem, { value: "never" }, "Nooit"), /* @__PURE__ */ React17__namespace.createElement(SelectItem, { value: "desktop" }, "Op desktop"), /* @__PURE__ */ React17__namespace.createElement(SelectItem, { value: "mobile" }, "Op mobiel"), /* @__PURE__ */ React17__namespace.createElement(SelectItem, { value: "always" }, "Altijd")))), /* @__PURE__ */ React17__namespace.createElement(FormMessage, null))
1303
+ }
1304
+ ), /* @__PURE__ */ React17__namespace.createElement("hr", null), /* @__PURE__ */ React17__namespace.createElement(
1295
1305
  FormField,
1296
1306
  {
1297
1307
  control: form.control,
1298
1308
  name: "container",
1299
- 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(
1309
+ render: ({ field }) => /* @__PURE__ */ React17__namespace.createElement(FormItem, { className: "sb-flex sb-flex-row sb-items-center sb-justify-between sb-space-y-0" }, /* @__PURE__ */ React17__namespace.createElement(FormLabel, null, "Volledige breedte"), /* @__PURE__ */ React17__namespace.createElement(FormControl, null, /* @__PURE__ */ React17__namespace.createElement(
1300
1310
  Switch,
1301
1311
  {
1302
1312
  checked: !field.value,
1303
1313
  onCheckedChange: (v) => field.onChange(!v)
1304
1314
  }
1305
- )), /* @__PURE__ */ React12__namespace.createElement(FormMessage, null))
1315
+ )), /* @__PURE__ */ React17__namespace.createElement(FormMessage, null))
1306
1316
  }
1307
- ), /* @__PURE__ */ React12__namespace.createElement("hr", null), /* @__PURE__ */ React12__namespace.createElement(
1317
+ ), /* @__PURE__ */ React17__namespace.createElement("hr", null), /* @__PURE__ */ React17__namespace.createElement(
1308
1318
  FormField,
1309
1319
  {
1310
1320
  control: form.control,
1311
1321
  key: `${device}.padding`,
1312
1322
  name: `${device}.padding`,
1313
- 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(
1323
+ render: ({ field }) => /* @__PURE__ */ React17__namespace.createElement(FormItem, null, /* @__PURE__ */ React17__namespace.createElement(FormLabel, null, "Padding"), /* @__PURE__ */ React17__namespace.createElement(FormControl, null, /* @__PURE__ */ React17__namespace.createElement(
1314
1324
  SpacingInput,
1315
1325
  {
1316
1326
  value: field.value,
1317
1327
  onChange: field.onChange
1318
1328
  }
1319
- )), /* @__PURE__ */ React12__namespace.createElement(FormMessage, null))
1329
+ )), /* @__PURE__ */ React17__namespace.createElement(FormMessage, null))
1320
1330
  }
1321
- ), /* @__PURE__ */ React12__namespace.createElement(
1331
+ ), /* @__PURE__ */ React17__namespace.createElement(
1322
1332
  FormField,
1323
1333
  {
1324
1334
  control: form.control,
1325
1335
  key: `${device}.margin`,
1326
1336
  name: `${device}.margin`,
1327
- 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(
1337
+ render: ({ field }) => /* @__PURE__ */ React17__namespace.createElement(FormItem, null, /* @__PURE__ */ React17__namespace.createElement(FormLabel, null, "Margin"), /* @__PURE__ */ React17__namespace.createElement(FormControl, null, /* @__PURE__ */ React17__namespace.createElement(
1328
1338
  SpacingInput,
1329
1339
  {
1330
1340
  value: field.value,
1331
1341
  onChange: field.onChange
1332
1342
  }
1333
- )), /* @__PURE__ */ React12__namespace.createElement(FormMessage, null))
1343
+ )), /* @__PURE__ */ React17__namespace.createElement(FormMessage, null))
1334
1344
  }
1335
1345
  )))));
1336
1346
  };
1337
- var ScrollArea = React12__namespace.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ React12__namespace.createElement(
1347
+ var ScrollArea = React17__namespace.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ React17__namespace.createElement(
1338
1348
  ScrollAreaPrimitive__namespace.Root,
1339
1349
  {
1340
1350
  ref,
1341
- className: chunkLLKCXOGO_js.cn("sb-relative sb-overflow-hidden", className),
1351
+ className: chunkSMX2JVU7_js.cn("sb-relative sb-overflow-hidden", className),
1342
1352
  ...props
1343
1353
  },
1344
- /* @__PURE__ */ React12__namespace.createElement(ScrollAreaPrimitive__namespace.Viewport, { className: "sb-h-full sb-max-h-[80vh] sb-w-full sb-rounded-[inherit]" }, children),
1345
- /* @__PURE__ */ React12__namespace.createElement(ScrollBar, null),
1346
- /* @__PURE__ */ React12__namespace.createElement(ScrollAreaPrimitive__namespace.Corner, null)
1354
+ /* @__PURE__ */ React17__namespace.createElement(ScrollAreaPrimitive__namespace.Viewport, { className: "sb-h-full sb-max-h-[80vh] sb-w-full sb-rounded-[inherit]" }, children),
1355
+ /* @__PURE__ */ React17__namespace.createElement(ScrollBar, null),
1356
+ /* @__PURE__ */ React17__namespace.createElement(ScrollAreaPrimitive__namespace.Corner, null)
1347
1357
  ));
1348
1358
  ScrollArea.displayName = ScrollAreaPrimitive__namespace.Root.displayName;
1349
- var ScrollBar = React12__namespace.forwardRef(({ className, orientation = "vertical", ...props }, ref) => /* @__PURE__ */ React12__namespace.createElement(
1359
+ var ScrollBar = React17__namespace.forwardRef(({ className, orientation = "vertical", ...props }, ref) => /* @__PURE__ */ React17__namespace.createElement(
1350
1360
  ScrollAreaPrimitive__namespace.ScrollAreaScrollbar,
1351
1361
  {
1352
1362
  ref,
1353
1363
  orientation,
1354
- className: chunkLLKCXOGO_js.cn(
1364
+ className: chunkSMX2JVU7_js.cn(
1355
1365
  "sb-flex sb-touch-none sb-select-none sb-transition-colors",
1356
1366
  orientation === "vertical" && "sb-h-full sb-w-2.5 sb-border-l sb-border-l-transparent sb-p-[1px]",
1357
1367
  orientation === "horizontal" && "sb-h-2.5 sb-flex-col sb-border-t sb-border-t-transparent sb-p-[1px]",
@@ -1359,36 +1369,36 @@ var ScrollBar = React12__namespace.forwardRef(({ className, orientation = "verti
1359
1369
  ),
1360
1370
  ...props
1361
1371
  },
1362
- /* @__PURE__ */ React12__namespace.createElement(ScrollAreaPrimitive__namespace.ScrollAreaThumb, { className: "sb-relative sb-flex-1 sb-rounded-full sb-bg-border" })
1372
+ /* @__PURE__ */ React17__namespace.createElement(ScrollAreaPrimitive__namespace.ScrollAreaThumb, { className: "sb-relative sb-flex-1 sb-rounded-full sb-bg-border" })
1363
1373
  ));
1364
1374
  ScrollBar.displayName = ScrollAreaPrimitive__namespace.ScrollAreaScrollbar.displayName;
1365
1375
 
1366
1376
  // src/components/container-item-toolbar.tsx
1367
1377
  var ContainerItemToolbar = (props) => {
1368
1378
  const { contentId, canBringUp = false, canBringDown = false } = props;
1369
- const { bringUp, bringDown } = chunkN6DUKS7Z_js.useBuilder();
1370
- 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(
1371
- chunkN6DUKS7Z_js.Button,
1379
+ const { bringUp, bringDown } = chunkQ2EMWEEZ_js.useBuilder();
1380
+ return /* @__PURE__ */ React17__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__ */ React17__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__ */ React17__namespace.createElement(EditButton, { id: contentId }), /* @__PURE__ */ React17__namespace.createElement(
1381
+ chunkQ2EMWEEZ_js.Button,
1372
1382
  {
1373
1383
  variant: "ghost",
1374
1384
  className: "sb-w-8 sb-h-8 sb-p-0",
1375
1385
  onClick: () => bringUp(contentId),
1376
1386
  disabled: !canBringUp
1377
1387
  },
1378
- /* @__PURE__ */ React12__namespace.createElement(lucideReact.ArrowUp, { className: "sb-h-5 sb-w-5" })
1379
- ), /* @__PURE__ */ React12__namespace.createElement(
1380
- chunkN6DUKS7Z_js.Button,
1388
+ /* @__PURE__ */ React17__namespace.createElement(lucideReact.ArrowUp, { className: "sb-h-5 sb-w-5" })
1389
+ ), /* @__PURE__ */ React17__namespace.createElement(
1390
+ chunkQ2EMWEEZ_js.Button,
1381
1391
  {
1382
1392
  variant: "ghost",
1383
1393
  className: "sb-w-8 sb-h-8 sb-p-0",
1384
1394
  onClick: () => bringDown(contentId),
1385
1395
  disabled: !canBringDown
1386
1396
  },
1387
- /* @__PURE__ */ React12__namespace.createElement(lucideReact.ArrowDown, { className: "sb-h-5 sb-w-5" })
1388
- ), /* @__PURE__ */ React12__namespace.createElement(DeleteButton, { contentId })));
1397
+ /* @__PURE__ */ React17__namespace.createElement(lucideReact.ArrowDown, { className: "sb-h-5 sb-w-5" })
1398
+ ), /* @__PURE__ */ React17__namespace.createElement(DeleteButton, { contentId })));
1389
1399
  };
1390
1400
  var EditButton = ({ id }) => {
1391
- return /* @__PURE__ */ React12__namespace.createElement(Popover, { modal: true }, /* @__PURE__ */ React12__namespace.createElement(PopoverTrigger, { asChild: true }, /* @__PURE__ */ React12__namespace.createElement(chunkN6DUKS7Z_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(
1401
+ return /* @__PURE__ */ React17__namespace.createElement(Popover, { modal: true }, /* @__PURE__ */ React17__namespace.createElement(PopoverTrigger, { asChild: true }, /* @__PURE__ */ React17__namespace.createElement(chunkQ2EMWEEZ_js.Button, { variant: "ghost", className: "sb-w-8 sb-h-8 sb-p-0" }, /* @__PURE__ */ React17__namespace.createElement(lucideReact.Edit2Icon, { className: "sb-h-5 sb-w-5" }))), /* @__PURE__ */ React17__namespace.createElement(
1392
1402
  PopoverContent,
1393
1403
  {
1394
1404
  side: "left",
@@ -1398,33 +1408,33 @@ var EditButton = ({ id }) => {
1398
1408
  className: "sb-p-0 sb-relative",
1399
1409
  collisionPadding: 16
1400
1410
  },
1401
- /* @__PURE__ */ React12__namespace.createElement(EditPopoverInner, { id })
1411
+ /* @__PURE__ */ React17__namespace.createElement(EditPopoverInner, { id })
1402
1412
  ));
1403
1413
  };
1404
1414
  var EditPopoverInner = (props) => {
1405
1415
  const { id } = props;
1406
- const { getItem } = chunkN6DUKS7Z_js.useBuilder();
1416
+ const { getItem } = chunkQ2EMWEEZ_js.useBuilder();
1407
1417
  const item = getItem(id);
1408
1418
  if (!item) {
1409
1419
  throw new Error(
1410
1420
  `[simple-builder]: Item with id ${id} not found in container item form component`
1411
1421
  );
1412
1422
  }
1413
- 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 })));
1423
+ return /* @__PURE__ */ React17__namespace.createElement(Tabs, null, /* @__PURE__ */ React17__namespace.createElement(TabsList, { variant: "text", defaultValue: "content" }, /* @__PURE__ */ React17__namespace.createElement(TabsTrigger, { variant: "text", value: "content" }, "Inhoud"), /* @__PURE__ */ React17__namespace.createElement(TabsTrigger, { variant: "text", value: "design" }, "Design")), /* @__PURE__ */ React17__namespace.createElement(TabsContent, { value: "content" }, /* @__PURE__ */ React17__namespace.createElement(ScrollArea, null, /* @__PURE__ */ React17__namespace.createElement(ContainerItemForm, { item }))), /* @__PURE__ */ React17__namespace.createElement(TabsContent, { value: "design" }, /* @__PURE__ */ React17__namespace.createElement(ItemDesignForm, { item })));
1414
1424
  };
1415
1425
  var DeleteButton = ({ contentId }) => {
1416
- const { deleteContent } = chunkN6DUKS7Z_js.useBuilder();
1417
- return /* @__PURE__ */ React12__namespace.createElement(AlertDialog, null, /* @__PURE__ */ React12__namespace.createElement(AlertDialogTrigger, { asChild: true }, /* @__PURE__ */ React12__namespace.createElement(
1418
- chunkN6DUKS7Z_js.Button,
1426
+ const { deleteContent } = chunkQ2EMWEEZ_js.useBuilder();
1427
+ return /* @__PURE__ */ React17__namespace.createElement(AlertDialog, null, /* @__PURE__ */ React17__namespace.createElement(AlertDialogTrigger, { asChild: true }, /* @__PURE__ */ React17__namespace.createElement(
1428
+ chunkQ2EMWEEZ_js.Button,
1419
1429
  {
1420
1430
  variant: "ghost",
1421
1431
  className: "sb-w-8 sb-h-8 sb-p-0 sb-text-destructive"
1422
1432
  },
1423
- /* @__PURE__ */ React12__namespace.createElement(lucideReact.Trash2Icon, { className: "sb-h-5 sb-w-5" })
1424
- )), /* @__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(
1433
+ /* @__PURE__ */ React17__namespace.createElement(lucideReact.Trash2Icon, { className: "sb-h-5 sb-w-5" })
1434
+ )), /* @__PURE__ */ React17__namespace.createElement(AlertDialogContent, null, /* @__PURE__ */ React17__namespace.createElement(AlertDialogDescription, null, "Weet je zeker dat je dit blok wilt verwijderen?"), /* @__PURE__ */ React17__namespace.createElement(AlertDialogFooter, null, /* @__PURE__ */ React17__namespace.createElement(AlertDialogCancel, null, "Annuleren"), /* @__PURE__ */ React17__namespace.createElement(
1425
1435
  AlertDialogAction,
1426
1436
  {
1427
- className: chunkN6DUKS7Z_js.buttonVariants({ variant: "destructive" }),
1437
+ className: chunkQ2EMWEEZ_js.buttonVariants({ variant: "destructive" }),
1428
1438
  onClick: () => deleteContent(contentId)
1429
1439
  },
1430
1440
  "Verwijderen"
@@ -1440,14 +1450,14 @@ var BuildContainerInner = (props) => {
1440
1450
  "[simple-builder]: Multiple content blocks detected when using property multiple false."
1441
1451
  );
1442
1452
  }
1443
- 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(chunkLLKCXOGO_js.DesignWrapper, { styles: item.styles }, chunkLLKCXOGO_js.builder.bindComponent(item, true)), /* @__PURE__ */ React12__namespace.createElement(
1453
+ return /* @__PURE__ */ React17__namespace.createElement("div", null, items.length <= 0 ? /* @__PURE__ */ React17__namespace.createElement(AddContentPlaceholder, { parent: id, container: name, index: 0 }) : multiple && /* @__PURE__ */ React17__namespace.createElement(AddContentDividerButton, { parent: id, container: name, index: 0 }), items.map((item, i) => /* @__PURE__ */ React17__namespace.createElement(React17__namespace.Fragment, { key: item.id }, /* @__PURE__ */ React17__namespace.createElement("div", { className: "sb-relative sb-container-item" }, /* @__PURE__ */ React17__namespace.createElement(chunkSMX2JVU7_js.DesignWrapper, { building: true, styles: item.styles }, chunkSMX2JVU7_js.builder.bindComponent(item, true)), /* @__PURE__ */ React17__namespace.createElement(
1444
1454
  ContainerItemToolbar,
1445
1455
  {
1446
1456
  contentId: item.id,
1447
1457
  canBringUp: i > 0,
1448
1458
  canBringDown: i < items.length - 1
1449
1459
  }
1450
- )), multiple && /* @__PURE__ */ React12__namespace.createElement(
1460
+ )), multiple && /* @__PURE__ */ React17__namespace.createElement(
1451
1461
  AddContentDividerButton,
1452
1462
  {
1453
1463
  parent: id,
@@ -1458,12 +1468,12 @@ var BuildContainerInner = (props) => {
1458
1468
  };
1459
1469
  var build_container_client_default = BuildContainerInner;
1460
1470
  var AddContentButton = (props) => {
1461
- const components = chunkLLKCXOGO_js.builder.getComponents();
1462
- const { addContent } = chunkN6DUKS7Z_js.useBuilder();
1463
- 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) => {
1471
+ const components = chunkSMX2JVU7_js.builder.getComponents();
1472
+ const { addContent } = chunkQ2EMWEEZ_js.useBuilder();
1473
+ return /* @__PURE__ */ React17__namespace.createElement(Popover, null, /* @__PURE__ */ React17__namespace.createElement(PopoverTrigger, { asChild: true }, props.children), /* @__PURE__ */ React17__namespace.createElement(PopoverContent, { className: "sb-p-1" }, /* @__PURE__ */ React17__namespace.createElement("div", { className: "sb-grid sb-grid-cols-2 sb-gap-2" }, components.map((component) => {
1464
1474
  const Icon2 = component.icon ?? lucideReact.ImageIcon;
1465
- return /* @__PURE__ */ React12__namespace.createElement(PopoverClose, { key: component.name, asChild: true }, /* @__PURE__ */ React12__namespace.createElement(
1466
- chunkN6DUKS7Z_js.Button,
1475
+ return /* @__PURE__ */ React17__namespace.createElement(PopoverClose, { key: component.name, asChild: true }, /* @__PURE__ */ React17__namespace.createElement(
1476
+ chunkQ2EMWEEZ_js.Button,
1467
1477
  {
1468
1478
  variant: "ghost",
1469
1479
  className: "sb-justify-start",
@@ -1476,22 +1486,22 @@ var AddContentButton = (props) => {
1476
1486
  );
1477
1487
  }
1478
1488
  },
1479
- /* @__PURE__ */ React12__namespace.createElement(Icon2, { className: "sb-mr-2 sb-h-4 sb-w-4 sb-shrink-0" }),
1489
+ /* @__PURE__ */ React17__namespace.createElement(Icon2, { className: "sb-mr-2 sb-h-4 sb-w-4 sb-shrink-0" }),
1480
1490
  component.friendlyName ?? component.name
1481
1491
  ));
1482
1492
  }))));
1483
1493
  };
1484
1494
  var AddContentPlaceholder = (props) => {
1485
- 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(chunkN6DUKS7Z_js.Button, { size: "sm" }, /* @__PURE__ */ React12__namespace.createElement(lucideReact.PlusIcon, { className: "sb-mr-2 sb-h-4 sb-w-4" }), "Blok Toevoegen")));
1495
+ return /* @__PURE__ */ React17__namespace.createElement(AddContentButton, { ...props }, /* @__PURE__ */ React17__namespace.createElement("div", { className: "sb-flex sb-justify-center sb-bg-primary/50 p-4" }, /* @__PURE__ */ React17__namespace.createElement(chunkQ2EMWEEZ_js.Button, { size: "sm" }, /* @__PURE__ */ React17__namespace.createElement(lucideReact.PlusIcon, { className: "sb-mr-2 sb-h-4 sb-w-4" }), "Blok Toevoegen")));
1486
1496
  };
1487
1497
  var AddContentDividerButton = (props) => {
1488
- 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(
1489
- chunkN6DUKS7Z_js.Button,
1498
+ return /* @__PURE__ */ React17__namespace.createElement(AddContentButton, { ...props }, /* @__PURE__ */ React17__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__ */ React17__namespace.createElement(
1499
+ chunkQ2EMWEEZ_js.Button,
1490
1500
  {
1491
1501
  size: "sm",
1492
1502
  className: "sb-absolute sb-left-1/2 sb-top-1/2 sb--translate-y-1/2 sb--translate-x-1/2 sb-shadow"
1493
1503
  },
1494
- /* @__PURE__ */ React12__namespace.createElement(lucideReact.PlusIcon, { className: "sb-mr-2 sb-h-4 sb-w-4" }),
1504
+ /* @__PURE__ */ React17__namespace.createElement(lucideReact.PlusIcon, { className: "sb-mr-2 sb-h-4 sb-w-4" }),
1495
1505
  "Blok Toevoegen"
1496
1506
  )));
1497
1507
  };