@simple-builder/react 1.0.2 → 1.0.3

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -1,25 +1,25 @@
1
+ 'use client';
1
2
  'use strict';
2
3
 
3
- Object.defineProperty(exports, '__esModule', { value: true });
4
-
5
- var chunk3S4FFEHM_js = require('./chunk-3S4FFEHM.js');
6
- var chunkVMHWPKU4_js = require('./chunk-VMHWPKU4.js');
7
- var React15 = require('react');
4
+ require('./chunk-N2X3IJBG.js');
5
+ var chunkGSOMMLCG_js = require('./chunk-GSOMMLCG.js');
6
+ var chunkUZFAGH6G_js = require('./chunk-UZFAGH6G.js');
7
+ var React13 = require('react');
8
8
  var lucideReact = require('lucide-react');
9
+ var AlertDialogPrimitive = require('@radix-ui/react-alert-dialog');
10
+ var PopoverPrimitive = require('@radix-ui/react-popover');
9
11
  var zod$1 = require('@hookform/resolvers/zod');
10
- var dateFns = require('date-fns');
11
12
  var reactHookForm = require('react-hook-form');
12
13
  var zod = require('zod');
13
- var AlertDialogPrimitive = require('@radix-ui/react-alert-dialog');
14
14
  var reactSlot = require('@radix-ui/react-slot');
15
15
  var LabelPrimitive = require('@radix-ui/react-label');
16
16
  var classVarianceAuthority = require('class-variance-authority');
17
- var PopoverPrimitive = require('@radix-ui/react-popover');
18
17
  var TabsPrimitive = require('@radix-ui/react-tabs');
19
18
  var NextImage = require('next/image');
20
- var reactDayPicker = require('react-day-picker');
21
19
  var SwitchPrimitives = require('@radix-ui/react-switch');
22
20
  var TogglePrimitive = require('@radix-ui/react-toggle');
21
+ var dateFns = require('date-fns');
22
+ var reactDayPicker = require('react-day-picker');
23
23
 
24
24
  function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
25
25
 
@@ -41,10 +41,10 @@ function _interopNamespace(e) {
41
41
  return Object.freeze(n);
42
42
  }
43
43
 
44
- var React15__namespace = /*#__PURE__*/_interopNamespace(React15);
44
+ var React13__namespace = /*#__PURE__*/_interopNamespace(React13);
45
45
  var AlertDialogPrimitive__namespace = /*#__PURE__*/_interopNamespace(AlertDialogPrimitive);
46
- var LabelPrimitive__namespace = /*#__PURE__*/_interopNamespace(LabelPrimitive);
47
46
  var PopoverPrimitive__namespace = /*#__PURE__*/_interopNamespace(PopoverPrimitive);
47
+ var LabelPrimitive__namespace = /*#__PURE__*/_interopNamespace(LabelPrimitive);
48
48
  var TabsPrimitive__namespace = /*#__PURE__*/_interopNamespace(TabsPrimitive);
49
49
  var NextImage__default = /*#__PURE__*/_interopDefault(NextImage);
50
50
  var SwitchPrimitives__namespace = /*#__PURE__*/_interopNamespace(SwitchPrimitives);
@@ -53,10 +53,10 @@ var TogglePrimitive__namespace = /*#__PURE__*/_interopNamespace(TogglePrimitive)
53
53
  var AlertDialog = AlertDialogPrimitive__namespace.Root;
54
54
  var AlertDialogTrigger = AlertDialogPrimitive__namespace.Trigger;
55
55
  var AlertDialogPortal = AlertDialogPrimitive__namespace.Portal;
56
- var AlertDialogOverlay = React15__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ React15__namespace.createElement(
56
+ var AlertDialogOverlay = React13__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ React13__namespace.createElement(
57
57
  AlertDialogPrimitive__namespace.Overlay,
58
58
  {
59
- className: chunk3S4FFEHM_js.cn(
59
+ className: chunkGSOMMLCG_js.cn(
60
60
  "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",
61
61
  className
62
62
  ),
@@ -65,11 +65,11 @@ var AlertDialogOverlay = React15__namespace.forwardRef(({ className, ...props },
65
65
  }
66
66
  ));
67
67
  AlertDialogOverlay.displayName = AlertDialogPrimitive__namespace.Overlay.displayName;
68
- var AlertDialogContent = React15__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ React15__namespace.createElement(AlertDialogPortal, null, /* @__PURE__ */ React15__namespace.createElement(AlertDialogOverlay, null), /* @__PURE__ */ React15__namespace.createElement(
68
+ var AlertDialogContent = React13__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ React13__namespace.createElement(AlertDialogPortal, null, /* @__PURE__ */ React13__namespace.createElement(AlertDialogOverlay, null), /* @__PURE__ */ React13__namespace.createElement(
69
69
  AlertDialogPrimitive__namespace.Content,
70
70
  {
71
71
  ref,
72
- className: chunk3S4FFEHM_js.cn(
72
+ className: chunkGSOMMLCG_js.cn(
73
73
  "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",
74
74
  className
75
75
  ),
@@ -80,10 +80,10 @@ AlertDialogContent.displayName = AlertDialogPrimitive__namespace.Content.display
80
80
  var AlertDialogFooter = ({
81
81
  className,
82
82
  ...props
83
- }) => /* @__PURE__ */ React15__namespace.createElement(
83
+ }) => /* @__PURE__ */ React13__namespace.createElement(
84
84
  "div",
85
85
  {
86
- className: chunk3S4FFEHM_js.cn(
86
+ className: chunkGSOMMLCG_js.cn(
87
87
  "sb-flex sb-flex-col-reverse sm:sb-flex-row sm:sb-justify-end sm:sb-space-x-2",
88
88
  className
89
89
  ),
@@ -91,39 +91,39 @@ var AlertDialogFooter = ({
91
91
  }
92
92
  );
93
93
  AlertDialogFooter.displayName = "AlertDialogFooter";
94
- var AlertDialogTitle = React15__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ React15__namespace.createElement(
94
+ var AlertDialogTitle = React13__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ React13__namespace.createElement(
95
95
  AlertDialogPrimitive__namespace.Title,
96
96
  {
97
97
  ref,
98
- className: chunk3S4FFEHM_js.cn("sb-text-lg sb-font-semibold", className),
98
+ className: chunkGSOMMLCG_js.cn("sb-text-lg sb-font-semibold", className),
99
99
  ...props
100
100
  }
101
101
  ));
102
102
  AlertDialogTitle.displayName = AlertDialogPrimitive__namespace.Title.displayName;
103
- var AlertDialogDescription = React15__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ React15__namespace.createElement(
103
+ var AlertDialogDescription = React13__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ React13__namespace.createElement(
104
104
  AlertDialogPrimitive__namespace.Description,
105
105
  {
106
106
  ref,
107
- className: chunk3S4FFEHM_js.cn("sb-text-sm sb-text-muted-foreground", className),
107
+ className: chunkGSOMMLCG_js.cn("sb-text-sm sb-text-muted-foreground", className),
108
108
  ...props
109
109
  }
110
110
  ));
111
111
  AlertDialogDescription.displayName = AlertDialogPrimitive__namespace.Description.displayName;
112
- var AlertDialogAction = React15__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ React15__namespace.createElement(
112
+ var AlertDialogAction = React13__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ React13__namespace.createElement(
113
113
  AlertDialogPrimitive__namespace.Action,
114
114
  {
115
115
  ref,
116
- className: chunk3S4FFEHM_js.cn(chunk3S4FFEHM_js.buttonVariants(), className),
116
+ className: chunkGSOMMLCG_js.cn(chunkGSOMMLCG_js.buttonVariants(), className),
117
117
  ...props
118
118
  }
119
119
  ));
120
120
  AlertDialogAction.displayName = AlertDialogPrimitive__namespace.Action.displayName;
121
- var AlertDialogCancel = React15__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ React15__namespace.createElement(
121
+ var AlertDialogCancel = React13__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ React13__namespace.createElement(
122
122
  AlertDialogPrimitive__namespace.Cancel,
123
123
  {
124
124
  ref,
125
- className: chunk3S4FFEHM_js.cn(
126
- chunk3S4FFEHM_js.buttonVariants({ variant: "outline" }),
125
+ className: chunkGSOMMLCG_js.cn(
126
+ chunkGSOMMLCG_js.buttonVariants({ variant: "outline" }),
127
127
  "sb-mt-2 sm:sb-mt-0",
128
128
  className
129
129
  ),
@@ -131,14 +131,31 @@ var AlertDialogCancel = React15__namespace.forwardRef(({ className, ...props },
131
131
  }
132
132
  ));
133
133
  AlertDialogCancel.displayName = AlertDialogPrimitive__namespace.Cancel.displayName;
134
+ var Popover = PopoverPrimitive__namespace.Root;
135
+ var PopoverTrigger = PopoverPrimitive__namespace.Trigger;
136
+ var PopoverClose = PopoverPrimitive__namespace.Close;
137
+ var PopoverContent = React13__namespace.forwardRef(({ className, align = "center", sideOffset = 4, ...props }, ref) => /* @__PURE__ */ React13__namespace.createElement(PopoverPrimitive__namespace.Portal, null, /* @__PURE__ */ React13__namespace.createElement(
138
+ PopoverPrimitive__namespace.Content,
139
+ {
140
+ ref,
141
+ align,
142
+ sideOffset,
143
+ className: chunkGSOMMLCG_js.cn(
144
+ "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",
145
+ className
146
+ ),
147
+ ...props
148
+ }
149
+ )));
150
+ PopoverContent.displayName = PopoverPrimitive__namespace.Content.displayName;
134
151
  var labelVariants = classVarianceAuthority.cva(
135
152
  "sb-text-sm sb-font-medium sb-font-roboto sb-leading-none peer-disabled:sb-cursor-not-allowed peer-disabled:sb-opacity-70"
136
153
  );
137
- var Label = React15__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ React15__namespace.createElement(
154
+ var Label = React13__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ React13__namespace.createElement(
138
155
  LabelPrimitive__namespace.Root,
139
156
  {
140
157
  ref,
141
- className: chunk3S4FFEHM_js.cn(labelVariants(), className),
158
+ className: chunkGSOMMLCG_js.cn(labelVariants(), className),
142
159
  ...props
143
160
  }
144
161
  ));
@@ -146,17 +163,17 @@ Label.displayName = LabelPrimitive__namespace.Root.displayName;
146
163
 
147
164
  // src/components/ui/form.tsx
148
165
  var Form = reactHookForm.FormProvider;
149
- var FormFieldContext = React15__namespace.createContext(
166
+ var FormFieldContext = React13__namespace.createContext(
150
167
  {}
151
168
  );
152
169
  var FormField = ({
153
170
  ...props
154
171
  }) => {
155
- return /* @__PURE__ */ React15__namespace.createElement(FormFieldContext.Provider, { value: { name: props.name } }, /* @__PURE__ */ React15__namespace.createElement(reactHookForm.Controller, { ...props }));
172
+ return /* @__PURE__ */ React13__namespace.createElement(FormFieldContext.Provider, { value: { name: props.name } }, /* @__PURE__ */ React13__namespace.createElement(reactHookForm.Controller, { ...props }));
156
173
  };
157
174
  var useFormField = () => {
158
- const fieldContext = React15__namespace.useContext(FormFieldContext);
159
- const itemContext = React15__namespace.useContext(FormItemContext);
175
+ const fieldContext = React13__namespace.useContext(FormFieldContext);
176
+ const itemContext = React13__namespace.useContext(FormItemContext);
160
177
  const { getFieldState, formState } = reactHookForm.useFormContext();
161
178
  const fieldState = getFieldState(fieldContext.name, formState);
162
179
  if (!fieldContext) {
@@ -172,30 +189,30 @@ var useFormField = () => {
172
189
  ...fieldState
173
190
  };
174
191
  };
175
- var FormItemContext = React15__namespace.createContext(
192
+ var FormItemContext = React13__namespace.createContext(
176
193
  {}
177
194
  );
178
- var FormItem = React15__namespace.forwardRef(({ className, ...props }, ref) => {
179
- const id = React15__namespace.useId();
180
- return /* @__PURE__ */ React15__namespace.createElement(FormItemContext.Provider, { value: { id } }, /* @__PURE__ */ React15__namespace.createElement("div", { ref, className: chunk3S4FFEHM_js.cn("sb-space-y-2", className), ...props }));
195
+ var FormItem = React13__namespace.forwardRef(({ className, ...props }, ref) => {
196
+ const id = React13__namespace.useId();
197
+ return /* @__PURE__ */ React13__namespace.createElement(FormItemContext.Provider, { value: { id } }, /* @__PURE__ */ React13__namespace.createElement("div", { ref, className: chunkGSOMMLCG_js.cn("sb-space-y-2", className), ...props }));
181
198
  });
182
199
  FormItem.displayName = "FormItem";
183
- var FormLabel = React15__namespace.forwardRef(({ className, ...props }, ref) => {
200
+ var FormLabel = React13__namespace.forwardRef(({ className, ...props }, ref) => {
184
201
  const { error, formItemId } = useFormField();
185
- return /* @__PURE__ */ React15__namespace.createElement(
202
+ return /* @__PURE__ */ React13__namespace.createElement(
186
203
  Label,
187
204
  {
188
205
  ref,
189
- className: chunk3S4FFEHM_js.cn(error && "sb-text-destructive", className),
206
+ className: chunkGSOMMLCG_js.cn(error && "sb-text-destructive", className),
190
207
  htmlFor: formItemId,
191
208
  ...props
192
209
  }
193
210
  );
194
211
  });
195
212
  FormLabel.displayName = "FormLabel";
196
- var FormControl = React15__namespace.forwardRef(({ ...props }, ref) => {
213
+ var FormControl = React13__namespace.forwardRef(({ ...props }, ref) => {
197
214
  const { error, formItemId, formDescriptionId, formMessageId } = useFormField();
198
- return /* @__PURE__ */ React15__namespace.createElement(
215
+ return /* @__PURE__ */ React13__namespace.createElement(
199
216
  reactSlot.Slot,
200
217
  {
201
218
  ref,
@@ -207,14 +224,14 @@ var FormControl = React15__namespace.forwardRef(({ ...props }, ref) => {
207
224
  );
208
225
  });
209
226
  FormControl.displayName = "FormControl";
210
- var FormDescription = React15__namespace.forwardRef(({ className, ...props }, ref) => {
227
+ var FormDescription = React13__namespace.forwardRef(({ className, ...props }, ref) => {
211
228
  const { formDescriptionId } = useFormField();
212
- return /* @__PURE__ */ React15__namespace.createElement(
229
+ return /* @__PURE__ */ React13__namespace.createElement(
213
230
  "p",
214
231
  {
215
232
  ref,
216
233
  id: formDescriptionId,
217
- className: chunk3S4FFEHM_js.cn(
234
+ className: chunkGSOMMLCG_js.cn(
218
235
  "sb-text-sm sb-font-roboto sb-text-muted-foreground",
219
236
  className
220
237
  ),
@@ -223,18 +240,18 @@ var FormDescription = React15__namespace.forwardRef(({ className, ...props }, re
223
240
  );
224
241
  });
225
242
  FormDescription.displayName = "FormDescription";
226
- var FormMessage = React15__namespace.forwardRef(({ className, children, ...props }, ref) => {
243
+ var FormMessage = React13__namespace.forwardRef(({ className, children, ...props }, ref) => {
227
244
  const { error, formMessageId } = useFormField();
228
245
  const body = error ? String(error?.message) : children;
229
246
  if (!body) {
230
247
  return null;
231
248
  }
232
- return /* @__PURE__ */ React15__namespace.createElement(
249
+ return /* @__PURE__ */ React13__namespace.createElement(
233
250
  "p",
234
251
  {
235
252
  ref,
236
253
  id: formMessageId,
237
- className: chunk3S4FFEHM_js.cn(
254
+ className: chunkGSOMMLCG_js.cn(
238
255
  "sb-text-sm sb-font-roboto sb-font-medium sb-text-destructive",
239
256
  className
240
257
  ),
@@ -244,29 +261,12 @@ var FormMessage = React15__namespace.forwardRef(({ className, children, ...props
244
261
  );
245
262
  });
246
263
  FormMessage.displayName = "FormMessage";
247
- var Popover = PopoverPrimitive__namespace.Root;
248
- var PopoverTrigger = PopoverPrimitive__namespace.Trigger;
249
- var PopoverClose = PopoverPrimitive__namespace.Close;
250
- var PopoverContent = React15__namespace.forwardRef(({ className, align = "center", sideOffset = 4, ...props }, ref) => /* @__PURE__ */ React15__namespace.createElement(PopoverPrimitive__namespace.Portal, null, /* @__PURE__ */ React15__namespace.createElement(
251
- PopoverPrimitive__namespace.Content,
252
- {
253
- ref,
254
- align,
255
- sideOffset,
256
- className: chunk3S4FFEHM_js.cn(
257
- "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",
258
- className
259
- ),
260
- ...props
261
- }
262
- )));
263
- PopoverContent.displayName = PopoverPrimitive__namespace.Content.displayName;
264
264
  var Tabs = TabsPrimitive__namespace.Root;
265
- var TabsList = React15__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ React15__namespace.createElement(
265
+ var TabsList = React13__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ React13__namespace.createElement(
266
266
  TabsPrimitive__namespace.List,
267
267
  {
268
268
  ref,
269
- className: chunk3S4FFEHM_js.cn(
269
+ className: chunkGSOMMLCG_js.cn(
270
270
  "sb-flex sb-items-center sb-border-b sb-px-4 sb-space-x-6",
271
271
  className
272
272
  ),
@@ -274,11 +274,11 @@ var TabsList = React15__namespace.forwardRef(({ className, ...props }, ref) => /
274
274
  }
275
275
  ));
276
276
  TabsList.displayName = TabsPrimitive__namespace.List.displayName;
277
- var TabsTrigger = React15__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ React15__namespace.createElement(
277
+ var TabsTrigger = React13__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ React13__namespace.createElement(
278
278
  TabsPrimitive__namespace.Trigger,
279
279
  {
280
280
  ref,
281
- className: chunk3S4FFEHM_js.cn(
281
+ className: chunkGSOMMLCG_js.cn(
282
282
  "sb-inline-flex sb-font-roboto sb-items-center sb-justify-center sb-whitespace-nowrap sb-py-3 sb-text-sm sb-font-medium sb-transition-all focus-visible:sb-outline-none disabled:sb-pointer-events-none disabled:sb-opacity-50 data-[state=active]:sb-border-black sb-border-b-2 sb-border-transparent data-[state=active]:sb-text-foreground sb-text-muted-foreground",
283
283
  className
284
284
  ),
@@ -286,11 +286,11 @@ var TabsTrigger = React15__namespace.forwardRef(({ className, ...props }, ref) =
286
286
  }
287
287
  ));
288
288
  TabsTrigger.displayName = TabsPrimitive__namespace.Trigger.displayName;
289
- var TabsContent = React15__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ React15__namespace.createElement(
289
+ var TabsContent = React13__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ React13__namespace.createElement(
290
290
  TabsPrimitive__namespace.Content,
291
291
  {
292
292
  ref,
293
- className: chunk3S4FFEHM_js.cn(
293
+ className: chunkGSOMMLCG_js.cn(
294
294
  "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",
295
295
  className
296
296
  ),
@@ -300,19 +300,19 @@ var TabsContent = React15__namespace.forwardRef(({ className, ...props }, ref) =
300
300
  TabsContent.displayName = TabsPrimitive__namespace.Content.displayName;
301
301
  var Image = (props) => {
302
302
  if (typeof NextImage__default.default !== "undefined") {
303
- return /* @__PURE__ */ React15__namespace.createElement(NextImage__default.default.default, { ...props });
303
+ return /* @__PURE__ */ React13__namespace.createElement(NextImage__default.default.default, { ...props });
304
304
  }
305
- return /* @__PURE__ */ React15__namespace.createElement("img", { ...props });
305
+ return /* @__PURE__ */ React13__namespace.createElement("img", { ...props });
306
306
  };
307
307
 
308
308
  // src/components/ui/media-input.tsx
309
309
  var MediaInput = (props) => {
310
310
  const { onFilesChange, limit = 32, multiple = false, onError } = props;
311
- const id = React15__namespace.useId();
312
- const [queue, setQueue] = React15__namespace.useState([]);
313
- const [sources, setSources] = React15__namespace.useState(props.files ?? []);
311
+ const id = React13__namespace.useId();
312
+ const [queue, setQueue] = React13__namespace.useState([]);
313
+ const [sources, setSources] = React13__namespace.useState(props.files ?? []);
314
314
  const maxConcurrentUploads = 3;
315
- const uploadingCountRef = React15__namespace.useRef(0);
315
+ const uploadingCountRef = React13__namespace.useRef(0);
316
316
  const handleFilesAdd = async (e) => {
317
317
  const files = e.target.files;
318
318
  if (!files || files.length === 0) {
@@ -383,7 +383,7 @@ var MediaInput = (props) => {
383
383
  body: JSON.stringify({ src })
384
384
  });
385
385
  };
386
- return /* @__PURE__ */ React15__namespace.createElement("div", { className: chunk3S4FFEHM_js.cn("flex flex-wrap gap-4", props.className) }, sources.map((src) => /* @__PURE__ */ React15__namespace.createElement(MediaInputItem, { key: src, className: chunk3S4FFEHM_js.cn("group", props.itemClassName) }, /* @__PURE__ */ React15__namespace.createElement(
386
+ return /* @__PURE__ */ React13__namespace.createElement("div", { className: chunkGSOMMLCG_js.cn("flex flex-wrap gap-4", props.className) }, sources.map((src) => /* @__PURE__ */ React13__namespace.createElement(MediaInputItem, { key: src, className: chunkGSOMMLCG_js.cn("group", props.itemClassName) }, /* @__PURE__ */ React13__namespace.createElement(
387
387
  Image,
388
388
  {
389
389
  src,
@@ -391,34 +391,34 @@ var MediaInput = (props) => {
391
391
  fill: true,
392
392
  className: "sb-absolute sb-inset-0 sb-object-cover sb-pointer-events-none"
393
393
  }
394
- ), /* @__PURE__ */ React15__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__ */ React15__namespace.createElement(
394
+ ), /* @__PURE__ */ React13__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__ */ React13__namespace.createElement(
395
395
  "button",
396
396
  {
397
397
  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",
398
398
  onClick: () => handleSourceDelete(src)
399
399
  },
400
- /* @__PURE__ */ React15__namespace.createElement(lucideReact.Trash2Icon, { className: "sb-h-4 sb-w-4" })
401
- )))), queue.map((_, i) => /* @__PURE__ */ React15__namespace.createElement(
400
+ /* @__PURE__ */ React13__namespace.createElement(lucideReact.Trash2Icon, { className: "sb-h-4 sb-w-4" })
401
+ )))), queue.map((_, i) => /* @__PURE__ */ React13__namespace.createElement(
402
402
  MediaInputItem,
403
403
  {
404
404
  key: i,
405
- className: chunk3S4FFEHM_js.cn(
405
+ className: chunkGSOMMLCG_js.cn(
406
406
  "sb-flex sb-h-28 sb-w-28 sb-items-center sb-justify-center",
407
407
  props.itemClassName
408
408
  )
409
409
  },
410
- /* @__PURE__ */ React15__namespace.createElement(lucideReact.Loader2Icon, { className: "sb-h-6 sb-w-6 sb-animate-spin" })
411
- )), multiple || !multiple && !sources.length && !queue.length ? /* @__PURE__ */ React15__namespace.createElement(
410
+ /* @__PURE__ */ React13__namespace.createElement(lucideReact.Loader2Icon, { className: "sb-h-6 sb-w-6 sb-animate-spin" })
411
+ )), multiple || !multiple && !sources.length && !queue.length ? /* @__PURE__ */ React13__namespace.createElement(
412
412
  "label",
413
413
  {
414
414
  htmlFor: id,
415
- className: chunk3S4FFEHM_js.cn(
415
+ className: chunkGSOMMLCG_js.cn(
416
416
  "sb-flex sb-h-28 sb-w-28 sb-cursor-pointer sb-items-center sb-justify-center sb-rounded-lg sb-border",
417
417
  props.itemClassName
418
418
  )
419
419
  },
420
- /* @__PURE__ */ React15__namespace.createElement(lucideReact.PlusIcon, { className: "sb-h-6 sb-w-6" }),
421
- /* @__PURE__ */ React15__namespace.createElement(
420
+ /* @__PURE__ */ React13__namespace.createElement(lucideReact.PlusIcon, { className: "sb-h-6 sb-w-6" }),
421
+ /* @__PURE__ */ React13__namespace.createElement(
422
422
  "input",
423
423
  {
424
424
  id,
@@ -432,10 +432,10 @@ var MediaInput = (props) => {
432
432
  ) : null);
433
433
  };
434
434
  var MediaInputItem = (props) => {
435
- return /* @__PURE__ */ React15__namespace.createElement(
435
+ return /* @__PURE__ */ React13__namespace.createElement(
436
436
  "div",
437
437
  {
438
- className: chunk3S4FFEHM_js.cn(
438
+ className: chunkGSOMMLCG_js.cn(
439
439
  "sb-relative sb-h-28 sb-w-28 sb-overflow-hidden sb-rounded-lg sb-border",
440
440
  props.className
441
441
  )
@@ -475,38 +475,38 @@ var BackgroundPicker = (props) => {
475
475
  "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)",
476
476
  "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)"
477
477
  ];
478
- const defaultTab = React15__namespace.useMemo(() => {
478
+ const defaultTab = React13__namespace.useMemo(() => {
479
479
  if (background.includes("url"))
480
480
  return "image";
481
481
  if (background.includes("gradient"))
482
482
  return "gradient";
483
483
  return "solid";
484
484
  }, [background]);
485
- return /* @__PURE__ */ React15__namespace.createElement(Popover, null, /* @__PURE__ */ React15__namespace.createElement(PopoverTrigger, { asChild: true }, /* @__PURE__ */ React15__namespace.createElement(
486
- chunk3S4FFEHM_js.Button,
485
+ return /* @__PURE__ */ React13__namespace.createElement(Popover, null, /* @__PURE__ */ React13__namespace.createElement(PopoverTrigger, { asChild: true }, /* @__PURE__ */ React13__namespace.createElement(
486
+ chunkGSOMMLCG_js.Button,
487
487
  {
488
488
  variant: "outline",
489
489
  size: "sm",
490
- className: chunk3S4FFEHM_js.cn(
490
+ className: chunkGSOMMLCG_js.cn(
491
491
  "sb-justify-start sb-text-left sb-font-normal sb-normal-case sb-w-full",
492
492
  !background && "sb-text-muted-foreground",
493
493
  className
494
494
  )
495
495
  },
496
- /* @__PURE__ */ React15__namespace.createElement("div", { className: "sb-w-full sb-flex sb-items-center sb-gap-2" }, background ? /* @__PURE__ */ React15__namespace.createElement(
496
+ /* @__PURE__ */ React13__namespace.createElement("div", { className: "sb-w-full sb-flex sb-items-center sb-gap-2" }, background ? /* @__PURE__ */ React13__namespace.createElement(
497
497
  "div",
498
498
  {
499
499
  className: "sb-h-4 sb-w-4 sb-rounded !sb-bg-center !sb-bg-cover sb-transition-all sb-border",
500
500
  style: { background }
501
501
  }
502
- ) : /* @__PURE__ */ React15__namespace.createElement(lucideReact.PaintbrushIcon, { className: "sb-h-4 sb-w-4" }), /* @__PURE__ */ React15__namespace.createElement("div", { className: "sb-truncate sb-flex-1" }, background ? background : "Kies een achtergrond"))
503
- )), /* @__PURE__ */ React15__namespace.createElement(PopoverContent, { className: "sb-w-64 sb-p-0" }, /* @__PURE__ */ React15__namespace.createElement(Tabs, { defaultValue: defaultTab }, /* @__PURE__ */ React15__namespace.createElement(TabsList, { className: "sb-w-full" }, /* @__PURE__ */ React15__namespace.createElement(TabsTrigger, { className: "sb-flex-1", value: "solid" }, "Solid"), /* @__PURE__ */ React15__namespace.createElement(TabsTrigger, { className: "sb-flex-1", value: "gradient" }, "Gradient"), /* @__PURE__ */ React15__namespace.createElement(TabsTrigger, { className: "sb-flex-1", value: "image" }, "Image")), /* @__PURE__ */ React15__namespace.createElement(
502
+ ) : /* @__PURE__ */ React13__namespace.createElement(lucideReact.PaintbrushIcon, { className: "sb-h-4 sb-w-4" }), /* @__PURE__ */ React13__namespace.createElement("div", { className: "sb-truncate sb-flex-1" }, background ? background : "Kies een achtergrond"))
503
+ )), /* @__PURE__ */ React13__namespace.createElement(PopoverContent, { className: "sb-w-64 sb-p-0" }, /* @__PURE__ */ React13__namespace.createElement(Tabs, { defaultValue: defaultTab }, /* @__PURE__ */ React13__namespace.createElement(TabsList, { className: "sb-w-full" }, /* @__PURE__ */ React13__namespace.createElement(TabsTrigger, { className: "sb-flex-1", value: "solid" }, "Solid"), /* @__PURE__ */ React13__namespace.createElement(TabsTrigger, { className: "sb-flex-1", value: "gradient" }, "Gradient"), /* @__PURE__ */ React13__namespace.createElement(TabsTrigger, { className: "sb-flex-1", value: "image" }, "Image")), /* @__PURE__ */ React13__namespace.createElement(
504
504
  TabsContent,
505
505
  {
506
506
  value: "solid",
507
507
  className: "data-[state=active]:sb-flex sb-flex-wrap sb-gap-1 sb-p-4"
508
508
  },
509
- solids.map((s) => /* @__PURE__ */ React15__namespace.createElement(
509
+ solids.map((s) => /* @__PURE__ */ React13__namespace.createElement(
510
510
  "div",
511
511
  {
512
512
  key: s,
@@ -515,13 +515,13 @@ var BackgroundPicker = (props) => {
515
515
  onClick: () => onBackgroundChange(s)
516
516
  }
517
517
  ))
518
- ), /* @__PURE__ */ React15__namespace.createElement(
518
+ ), /* @__PURE__ */ React13__namespace.createElement(
519
519
  TabsContent,
520
520
  {
521
521
  value: "gradient",
522
522
  className: "data-[state=active]:sb-flex sb-flex-wrap sb-gap-1 sb-p-4"
523
523
  },
524
- gradients.map((s) => /* @__PURE__ */ React15__namespace.createElement(
524
+ gradients.map((s) => /* @__PURE__ */ React13__namespace.createElement(
525
525
  "div",
526
526
  {
527
527
  key: s,
@@ -530,7 +530,7 @@ var BackgroundPicker = (props) => {
530
530
  onClick: () => onBackgroundChange(s)
531
531
  }
532
532
  ))
533
- ), /* @__PURE__ */ React15__namespace.createElement(TabsContent, { value: "image" }, /* @__PURE__ */ React15__namespace.createElement("div", { className: "sb-p-4 sb-border-b" }, /* @__PURE__ */ React15__namespace.createElement(
533
+ ), /* @__PURE__ */ React13__namespace.createElement(TabsContent, { value: "image" }, /* @__PURE__ */ React13__namespace.createElement("div", { className: "sb-p-4 sb-border-b" }, /* @__PURE__ */ React13__namespace.createElement(
534
534
  MediaInput,
535
535
  {
536
536
  className: "sb-grid sb-grid-cols-2 sb-gap-1",
@@ -546,7 +546,7 @@ var BackgroundPicker = (props) => {
546
546
  "media-input: Error: " + e?.description
547
547
  )
548
548
  }
549
- )), /* @__PURE__ */ React15__namespace.createElement("div", { className: "sb-grid sb-grid-cols-2 sb-gap-1 sb-p-4" }, images.map((s) => /* @__PURE__ */ React15__namespace.createElement(
549
+ )), /* @__PURE__ */ React13__namespace.createElement("div", { className: "sb-grid sb-grid-cols-2 sb-gap-1 sb-p-4" }, images.map((s) => /* @__PURE__ */ React13__namespace.createElement(
550
550
  "div",
551
551
  {
552
552
  key: s,
@@ -556,60 +556,6 @@ var BackgroundPicker = (props) => {
556
556
  }
557
557
  )))))));
558
558
  };
559
- function Calendar({
560
- className,
561
- classNames,
562
- showOutsideDays = true,
563
- ...props
564
- }) {
565
- return /* @__PURE__ */ React15__namespace.createElement(
566
- reactDayPicker.DayPicker,
567
- {
568
- showOutsideDays,
569
- className: chunk3S4FFEHM_js.cn("sb-p-3 sb-font-roboto", className),
570
- classNames: {
571
- months: "sb-flex sb-flex-col sm:sb-flex-row sb-space-y-4 sm:sb-space-x-4 sm:sb-space-y-0",
572
- month: "sb-space-y-4",
573
- caption: "sb-flex sb-justify-center sb-pt-1 sb-relative sb-items-center",
574
- caption_label: "sb-text-sm sb-font-medium",
575
- nav: "sb-space-x-1 sb-flex sb-items-center",
576
- nav_button: chunk3S4FFEHM_js.cn(
577
- chunk3S4FFEHM_js.buttonVariants({ variant: "outline" }),
578
- "sb-h-7 sb-w-7 sb-bg-transparent sb-p-0 sb-opacity-50 hover:sb-opacity-100"
579
- ),
580
- nav_button_previous: "sb-absolute sb-left-1",
581
- nav_button_next: "sb-absolute sb-right-1",
582
- table: "sb-w-full sb-border-collapse sb-space-y-1",
583
- head_row: "sb-flex",
584
- head_cell: "sb-text-muted-foreground sb-rounded-md sb-w-8 sb-font-normal sb-text-[0.8rem]",
585
- row: "sb-flex sb-w-full sb-mt-2",
586
- cell: chunk3S4FFEHM_js.cn(
587
- "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",
588
- 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"
589
- ),
590
- day: chunk3S4FFEHM_js.cn(
591
- chunk3S4FFEHM_js.buttonVariants({ variant: "ghost" }),
592
- "sb-h-8 sb-w-8 sb-p-0 sb-font-normal aria-selected:sb-opacity-100"
593
- ),
594
- day_range_start: "day-range-start",
595
- day_range_end: "day-range-end",
596
- day_selected: "sb-bg-primary sb-text-primary-foreground hover:sb-bg-primary hover:sb-text-primary-foreground focus:sb-bg-primary focus:sb-text-primary-foreground",
597
- day_today: "sb-bg-accent sb-text-accent-foreground",
598
- day_outside: "day-outside sb-text-muted-foreground sb-opacity-50 aria-selected:sb-bg-accent/50 aria-selected:sb-text-muted-foreground aria-selected:sb-opacity-30",
599
- day_disabled: "sb-text-muted-foreground sb-opacity-50",
600
- day_range_middle: "aria-selected:sb-bg-accent aria-selected:sb-text-accent-foreground",
601
- day_hidden: "invisible",
602
- ...classNames
603
- },
604
- components: {
605
- IconLeft: () => /* @__PURE__ */ React15__namespace.createElement(lucideReact.ChevronLeftIcon, { className: "sb-h-4 sb-w-4" }),
606
- IconRight: () => /* @__PURE__ */ React15__namespace.createElement(lucideReact.ChevronRightIcon, { className: "sb-h-4 sb-w-4" })
607
- },
608
- ...props
609
- }
610
- );
611
- }
612
- Calendar.displayName = "Calendar";
613
559
  var ColorPicker = (props) => {
614
560
  const { color, onColorChange, className } = props;
615
561
  const colors = props.colors ?? [
@@ -623,25 +569,25 @@ var ColorPicker = (props) => {
623
569
  "#009DD1",
624
570
  "#FF0000"
625
571
  ];
626
- return /* @__PURE__ */ React15__namespace.createElement(Popover, null, /* @__PURE__ */ React15__namespace.createElement(PopoverTrigger, { asChild: true }, /* @__PURE__ */ React15__namespace.createElement(
627
- chunk3S4FFEHM_js.Button,
572
+ return /* @__PURE__ */ React13__namespace.createElement(Popover, null, /* @__PURE__ */ React13__namespace.createElement(PopoverTrigger, { asChild: true }, /* @__PURE__ */ React13__namespace.createElement(
573
+ chunkGSOMMLCG_js.Button,
628
574
  {
629
575
  variant: "outline",
630
576
  size: "sm",
631
- className: chunk3S4FFEHM_js.cn(
577
+ className: chunkGSOMMLCG_js.cn(
632
578
  "sb-justify-start sb-text-left sb-font-normal sb-normal-case sb-w-full",
633
579
  !color && "sb-text-muted-foreground",
634
580
  className
635
581
  )
636
582
  },
637
- /* @__PURE__ */ React15__namespace.createElement("div", { className: "sb-w-full sb-flex sb-items-center sb-gap-2" }, color ? /* @__PURE__ */ React15__namespace.createElement(
583
+ /* @__PURE__ */ React13__namespace.createElement("div", { className: "sb-w-full sb-flex sb-items-center sb-gap-2" }, color ? /* @__PURE__ */ React13__namespace.createElement(
638
584
  "div",
639
585
  {
640
586
  className: "sb-h-4 sb-w-4 sb-rounded !sb-bg-center !sb-bg-cover sb-transition-all sb-border",
641
587
  style: { background: color }
642
588
  }
643
- ) : /* @__PURE__ */ React15__namespace.createElement(lucideReact.PaintbrushIcon, { className: "sb-h-4 sb-w-4" }), /* @__PURE__ */ React15__namespace.createElement("div", { className: "sb-truncate sb-flex-1" }, color ? color : "Kies een kleur"))
644
- )), /* @__PURE__ */ React15__namespace.createElement(PopoverContent, { className: "sb-w-64 sb-p-4 sb-flex sb-flex-wrap sb-gap-1" }, colors.map((s) => /* @__PURE__ */ React15__namespace.createElement(
589
+ ) : /* @__PURE__ */ React13__namespace.createElement(lucideReact.PaintbrushIcon, { className: "sb-h-4 sb-w-4" }), /* @__PURE__ */ React13__namespace.createElement("div", { className: "sb-truncate sb-flex-1" }, color ? color : "Kies een kleur"))
590
+ )), /* @__PURE__ */ React13__namespace.createElement(PopoverContent, { className: "sb-w-64 sb-p-4 sb-flex sb-flex-wrap sb-gap-1" }, colors.map((s) => /* @__PURE__ */ React13__namespace.createElement(
645
591
  "div",
646
592
  {
647
593
  key: s,
@@ -651,13 +597,13 @@ var ColorPicker = (props) => {
651
597
  }
652
598
  ))));
653
599
  };
654
- var Input = React15__namespace.forwardRef(
600
+ var Input = React13__namespace.forwardRef(
655
601
  ({ className, type, ...props }, ref) => {
656
- return /* @__PURE__ */ React15__namespace.createElement(
602
+ return /* @__PURE__ */ React13__namespace.createElement(
657
603
  "input",
658
604
  {
659
605
  type,
660
- className: chunk3S4FFEHM_js.cn(
606
+ className: chunkGSOMMLCG_js.cn(
661
607
  "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",
662
608
  className
663
609
  ),
@@ -668,48 +614,32 @@ var Input = React15__namespace.forwardRef(
668
614
  }
669
615
  );
670
616
  Input.displayName = "Input";
671
- var AdvancedInput = React15__namespace.forwardRef(
617
+ var AdvancedInput = React13__namespace.forwardRef(
672
618
  ({ prepend, append, ...props }, ref) => {
673
- return /* @__PURE__ */ React15__namespace.createElement("div", { className: "sb-relative" }, /* @__PURE__ */ React15__namespace.createElement(Input, { ref, className: "sb-pl-9 sb-pr-7 sb-text-right", ...props }), prepend && /* @__PURE__ */ React15__namespace.createElement("div", { className: "sb-absolute sb-font-roboto sb-top-1/2 sb-left-3 sb--translate-y-1/2" }, prepend), append && /* @__PURE__ */ React15__namespace.createElement("div", { className: "sb-absolute sb-font-roboto sb-top-1/2 sb-right-3 sb--translate-y-1/2" }, append));
619
+ return /* @__PURE__ */ React13__namespace.createElement("div", { className: "sb-relative" }, /* @__PURE__ */ React13__namespace.createElement(Input, { ref, className: "sb-pl-9 sb-pr-7 sb-text-right", ...props }), prepend && /* @__PURE__ */ React13__namespace.createElement("div", { className: "sb-absolute sb-font-roboto sb-top-1/2 sb-left-3 sb--translate-y-1/2" }, prepend), append && /* @__PURE__ */ React13__namespace.createElement("div", { className: "sb-absolute sb-font-roboto sb-top-1/2 sb-right-3 sb--translate-y-1/2" }, append));
674
620
  }
675
621
  );
676
622
  AdvancedInput.displayName = "AdvancedInput";
677
- var Switch = React15__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ React15__namespace.createElement(
623
+ var Switch = React13__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ React13__namespace.createElement(
678
624
  SwitchPrimitives__namespace.Root,
679
625
  {
680
- className: chunk3S4FFEHM_js.cn(
626
+ className: chunkGSOMMLCG_js.cn(
681
627
  "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",
682
628
  className
683
629
  ),
684
630
  ...props,
685
631
  ref
686
632
  },
687
- /* @__PURE__ */ React15__namespace.createElement(
633
+ /* @__PURE__ */ React13__namespace.createElement(
688
634
  SwitchPrimitives__namespace.Thumb,
689
635
  {
690
- className: chunk3S4FFEHM_js.cn(
636
+ className: chunkGSOMMLCG_js.cn(
691
637
  "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"
692
638
  )
693
639
  }
694
640
  )
695
641
  ));
696
642
  Switch.displayName = SwitchPrimitives__namespace.Root.displayName;
697
- var Textarea = React15__namespace.forwardRef(
698
- ({ className, ...props }, ref) => {
699
- return /* @__PURE__ */ React15__namespace.createElement(
700
- "textarea",
701
- {
702
- className: chunk3S4FFEHM_js.cn(
703
- "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",
704
- className
705
- ),
706
- ref,
707
- ...props
708
- }
709
- );
710
- }
711
- );
712
- Textarea.displayName = "Textarea";
713
643
  var toggleVariants = classVarianceAuthority.cva(
714
644
  "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",
715
645
  {
@@ -730,102 +660,17 @@ var toggleVariants = classVarianceAuthority.cva(
730
660
  }
731
661
  }
732
662
  );
733
- var Toggle = React15__namespace.forwardRef(({ className, variant, size, ...props }, ref) => /* @__PURE__ */ React15__namespace.createElement(
663
+ var Toggle = React13__namespace.forwardRef(({ className, variant, size, ...props }, ref) => /* @__PURE__ */ React13__namespace.createElement(
734
664
  TogglePrimitive__namespace.Root,
735
665
  {
736
666
  ref,
737
- className: chunk3S4FFEHM_js.cn(toggleVariants({ variant, size, className })),
667
+ className: chunkGSOMMLCG_js.cn(toggleVariants({ variant, size, className })),
738
668
  ...props
739
669
  }
740
670
  ));
741
671
  Toggle.displayName = TogglePrimitive__namespace.Root.displayName;
742
672
 
743
- // src/components/container-item-toolbar.tsx
744
- var ContainerItemToolbar = (props) => {
745
- const { contentId, canBringUp = false, canBringDown = false } = props;
746
- const { bringUp, bringDown } = chunk3S4FFEHM_js.useBuilder();
747
- return /* @__PURE__ */ React15__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__ */ React15__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__ */ React15__namespace.createElement(EditButton, { id: contentId }), /* @__PURE__ */ React15__namespace.createElement(
748
- chunk3S4FFEHM_js.Button,
749
- {
750
- variant: "ghost",
751
- className: "sb-w-8 sb-h-8 sb-p-0",
752
- onClick: () => bringUp(contentId),
753
- disabled: !canBringUp
754
- },
755
- /* @__PURE__ */ React15__namespace.createElement(lucideReact.ArrowUp, { className: "sb-h-5 sb-w-5" })
756
- ), /* @__PURE__ */ React15__namespace.createElement(
757
- chunk3S4FFEHM_js.Button,
758
- {
759
- variant: "ghost",
760
- className: "sb-w-8 sb-h-8 sb-p-0",
761
- onClick: () => bringDown(contentId),
762
- disabled: !canBringDown
763
- },
764
- /* @__PURE__ */ React15__namespace.createElement(lucideReact.ArrowDown, { className: "sb-h-5 sb-w-5" })
765
- ), /* @__PURE__ */ React15__namespace.createElement(DeleteButton, { contentId })));
766
- };
767
- var EditButton = ({ id }) => {
768
- return /* @__PURE__ */ React15__namespace.createElement(Popover, null, /* @__PURE__ */ React15__namespace.createElement(PopoverTrigger, { asChild: true }, /* @__PURE__ */ React15__namespace.createElement(chunk3S4FFEHM_js.Button, { variant: "ghost", className: "sb-w-8 sb-h-8 sb-p-0" }, /* @__PURE__ */ React15__namespace.createElement(lucideReact.Edit2Icon, { className: "sb-h-5 sb-w-5" }))), /* @__PURE__ */ React15__namespace.createElement(
769
- PopoverContent,
770
- {
771
- side: "left",
772
- align: "start",
773
- sideOffset: 16,
774
- alignOffset: -8,
775
- className: "sb-p-0",
776
- collisionPadding: 16
777
- },
778
- /* @__PURE__ */ React15__namespace.createElement(EditPopoverInner, { id })
779
- ));
780
- };
781
- var EditPopoverInner = (props) => {
782
- const { id } = props;
783
- const { getItem } = chunk3S4FFEHM_js.useBuilder();
784
- const item = getItem(id);
785
- if (!item) {
786
- throw new Error(
787
- `[simple-builder]: Item with id ${id} not found in container item form component`
788
- );
789
- }
790
- return /* @__PURE__ */ React15__namespace.createElement(Tabs, null, /* @__PURE__ */ React15__namespace.createElement(TabsList, { defaultValue: "content" }, /* @__PURE__ */ React15__namespace.createElement(TabsTrigger, { value: "content" }, "Inhoud"), /* @__PURE__ */ React15__namespace.createElement(TabsTrigger, { value: "design" }, "Design")), /* @__PURE__ */ React15__namespace.createElement(TabsContent, { value: "content" }, /* @__PURE__ */ React15__namespace.createElement(ContainerItemForm, { item })), /* @__PURE__ */ React15__namespace.createElement(TabsContent, { value: "design" }, /* @__PURE__ */ React15__namespace.createElement(ItemDesignForm, { item })));
791
- };
792
- var ContainerItemForm = (props) => {
793
- const { item } = props;
794
- const { patchItem } = chunk3S4FFEHM_js.useBuilder();
795
- const component = chunkVMHWPKU4_js.builder.getComponent(item.component);
796
- if (!component) {
797
- throw new Error(
798
- `[simple-builder]: Component with id ${item.component} not found in container item form component`
799
- );
800
- }
801
- const form = reactHookForm.useForm({
802
- defaultValues: (component.inputs || []).reduce(
803
- (acc, input) => ({
804
- ...acc,
805
- [input.name]: item?.props?.[input.name] ?? input.defaultValue
806
- }),
807
- {}
808
- )
809
- });
810
- const onSubmit = (values) => {
811
- patchItem(item.id, {
812
- props: values
813
- });
814
- };
815
- React15__namespace.useEffect(() => {
816
- const subscription = form.watch(() => form.handleSubmit(onSubmit)());
817
- return () => subscription.unsubscribe();
818
- }, [form.watch, form.handleSubmit]);
819
- return /* @__PURE__ */ React15__namespace.createElement(Form, { ...form }, /* @__PURE__ */ React15__namespace.createElement("form", { onSubmit: form.handleSubmit(onSubmit) }, /* @__PURE__ */ React15__namespace.createElement("div", { className: "sb-space-y-4 sb-p-4" }, (component.inputs || []).map((input) => /* @__PURE__ */ React15__namespace.createElement(
820
- FormField,
821
- {
822
- key: input.name,
823
- control: form.control,
824
- name: input.name,
825
- render: ({ field }) => /* @__PURE__ */ React15__namespace.createElement(RenderInput, { type: input.type, input, field })
826
- }
827
- )))));
828
- };
673
+ // src/components/item-design-form.tsx
829
674
  var spacingSchema = zod.z.discriminatedUnion("indipendent", [
830
675
  zod.z.object({
831
676
  indipendent: zod.z.literal(false),
@@ -849,9 +694,9 @@ var designSchema = zod.z.object({
849
694
  });
850
695
  var ItemDesignForm = (props) => {
851
696
  const { item } = props;
852
- const { patchItem } = chunk3S4FFEHM_js.useBuilder();
853
- const initialPadding = chunk3S4FFEHM_js.spacing.parse(item.styles?.padding ?? "");
854
- const initialMargin = chunk3S4FFEHM_js.spacing.parse(item.styles?.margin ?? "");
697
+ const { patchItem } = chunkGSOMMLCG_js.useBuilder();
698
+ const initialPadding = chunkGSOMMLCG_js.spacing.parse(item.styles?.padding ?? "");
699
+ const initialMargin = chunkGSOMMLCG_js.spacing.parse(item.styles?.margin ?? "");
855
700
  const form = reactHookForm.useForm({
856
701
  resolver: zod$1.zodResolver(designSchema),
857
702
  defaultValues: {
@@ -859,7 +704,7 @@ var ItemDesignForm = (props) => {
859
704
  background: item.styles?.background ?? "",
860
705
  color: item.styles?.color ?? "",
861
706
  padding: {
862
- indipendent: chunk3S4FFEHM_js.spacing.isIndipendent(
707
+ indipendent: chunkGSOMMLCG_js.spacing.isIndipendent(
863
708
  item.styles?.padding ?? ""
864
709
  ),
865
710
  horizontal: initialPadding.left,
@@ -870,7 +715,7 @@ var ItemDesignForm = (props) => {
870
715
  bottom: initialPadding.bottom
871
716
  },
872
717
  margin: {
873
- indipendent: chunk3S4FFEHM_js.spacing.isIndipendent(
718
+ indipendent: chunkGSOMMLCG_js.spacing.isIndipendent(
874
719
  item.styles?.margin ?? ""
875
720
  ),
876
721
  horizontal: initialMargin.left,
@@ -896,7 +741,7 @@ var ItemDesignForm = (props) => {
896
741
  }
897
742
  });
898
743
  };
899
- React15__namespace.useEffect(() => {
744
+ React13__namespace.useEffect(() => {
900
745
  const subscription = form.watch(() => form.handleSubmit(onSubmit)());
901
746
  return () => subscription.unsubscribe();
902
747
  }, [form.watch, form.handleSubmit]);
@@ -904,135 +749,135 @@ var ItemDesignForm = (props) => {
904
749
  "padding.indipendent",
905
750
  "margin.indipendent"
906
751
  ]);
907
- return /* @__PURE__ */ React15__namespace.createElement(Form, { ...form }, /* @__PURE__ */ React15__namespace.createElement("form", { onSubmit: form.handleSubmit(onSubmit) }, /* @__PURE__ */ React15__namespace.createElement("div", { className: "sb-space-y-4 sb-p-4" }, /* @__PURE__ */ React15__namespace.createElement(
752
+ return /* @__PURE__ */ React13__namespace.createElement(Form, { ...form }, /* @__PURE__ */ React13__namespace.createElement("form", { onSubmit: form.handleSubmit(onSubmit) }, /* @__PURE__ */ React13__namespace.createElement("div", { className: "sb-space-y-4 sb-p-4" }, /* @__PURE__ */ React13__namespace.createElement(
908
753
  FormField,
909
754
  {
910
755
  control: form.control,
911
756
  name: "background",
912
- render: ({ field }) => /* @__PURE__ */ React15__namespace.createElement(FormItem, null, /* @__PURE__ */ React15__namespace.createElement(FormLabel, null, "Achtergrond"), /* @__PURE__ */ React15__namespace.createElement(FormControl, null, /* @__PURE__ */ React15__namespace.createElement(
757
+ render: ({ field }) => /* @__PURE__ */ React13__namespace.createElement(FormItem, null, /* @__PURE__ */ React13__namespace.createElement(FormLabel, null, "Achtergrond"), /* @__PURE__ */ React13__namespace.createElement(FormControl, null, /* @__PURE__ */ React13__namespace.createElement(
913
758
  BackgroundPicker,
914
759
  {
915
760
  background: field.value,
916
761
  onBackgroundChange: field.onChange
917
762
  }
918
- )), /* @__PURE__ */ React15__namespace.createElement(FormMessage, null))
763
+ )), /* @__PURE__ */ React13__namespace.createElement(FormMessage, null))
919
764
  }
920
- ), /* @__PURE__ */ React15__namespace.createElement(
765
+ ), /* @__PURE__ */ React13__namespace.createElement(
921
766
  FormField,
922
767
  {
923
768
  control: form.control,
924
769
  name: "color",
925
- render: ({ field }) => /* @__PURE__ */ React15__namespace.createElement(FormItem, null, /* @__PURE__ */ React15__namespace.createElement(FormLabel, null, "Inhoud kleur"), /* @__PURE__ */ React15__namespace.createElement(FormControl, null, /* @__PURE__ */ React15__namespace.createElement(
770
+ render: ({ field }) => /* @__PURE__ */ React13__namespace.createElement(FormItem, null, /* @__PURE__ */ React13__namespace.createElement(FormLabel, null, "Inhoud kleur"), /* @__PURE__ */ React13__namespace.createElement(FormControl, null, /* @__PURE__ */ React13__namespace.createElement(
926
771
  ColorPicker,
927
772
  {
928
773
  color: field.value,
929
774
  onColorChange: field.onChange
930
775
  }
931
- )), /* @__PURE__ */ React15__namespace.createElement(FormMessage, null))
776
+ )), /* @__PURE__ */ React13__namespace.createElement(FormMessage, null))
932
777
  }
933
- ), /* @__PURE__ */ React15__namespace.createElement("hr", null), /* @__PURE__ */ React15__namespace.createElement(
778
+ ), /* @__PURE__ */ React13__namespace.createElement("hr", null), /* @__PURE__ */ React13__namespace.createElement(
934
779
  FormField,
935
780
  {
936
781
  control: form.control,
937
782
  name: "container",
938
- render: ({ field }) => /* @__PURE__ */ React15__namespace.createElement(FormItem, { className: "sb-flex sb-flex-row sb-items-center sb-justify-between sb-space-y-0" }, /* @__PURE__ */ React15__namespace.createElement(FormLabel, null, "Volledige breedte"), /* @__PURE__ */ React15__namespace.createElement(FormControl, null, /* @__PURE__ */ React15__namespace.createElement(
783
+ render: ({ field }) => /* @__PURE__ */ React13__namespace.createElement(FormItem, { className: "sb-flex sb-flex-row sb-items-center sb-justify-between sb-space-y-0" }, /* @__PURE__ */ React13__namespace.createElement(FormLabel, null, "Volledige breedte"), /* @__PURE__ */ React13__namespace.createElement(FormControl, null, /* @__PURE__ */ React13__namespace.createElement(
939
784
  Switch,
940
785
  {
941
786
  checked: !field.value,
942
787
  onCheckedChange: (v) => field.onChange(!v)
943
788
  }
944
- )), /* @__PURE__ */ React15__namespace.createElement(FormMessage, null))
789
+ )), /* @__PURE__ */ React13__namespace.createElement(FormMessage, null))
945
790
  }
946
- ), /* @__PURE__ */ React15__namespace.createElement("hr", null), /* @__PURE__ */ React15__namespace.createElement("div", { className: "sb-space-y-2" }, /* @__PURE__ */ React15__namespace.createElement(FormLabel, null, "Padding"), /* @__PURE__ */ React15__namespace.createElement("div", { className: "sb-grid sb-grid-cols-[1fr,auto] sb-gap-3" }, /* @__PURE__ */ React15__namespace.createElement("div", { className: "sb-grid sb-grid-cols-2 sb-items-center sb-gap-3" }, !indipendentPadding ? /* @__PURE__ */ React15__namespace.createElement(React15__namespace.Fragment, null, /* @__PURE__ */ React15__namespace.createElement(
791
+ ), /* @__PURE__ */ React13__namespace.createElement("hr", null), /* @__PURE__ */ React13__namespace.createElement("div", { className: "sb-space-y-2" }, /* @__PURE__ */ React13__namespace.createElement(FormLabel, null, "Padding"), /* @__PURE__ */ React13__namespace.createElement("div", { className: "sb-grid sb-grid-cols-[1fr,auto] sb-gap-3" }, /* @__PURE__ */ React13__namespace.createElement("div", { className: "sb-grid sb-grid-cols-2 sb-items-center sb-gap-3" }, !indipendentPadding ? /* @__PURE__ */ React13__namespace.createElement(React13__namespace.Fragment, null, /* @__PURE__ */ React13__namespace.createElement(
947
792
  FormField,
948
793
  {
949
794
  control: form.control,
950
795
  name: "padding.horizontal",
951
- render: ({ field }) => /* @__PURE__ */ React15__namespace.createElement(FormItem, null, /* @__PURE__ */ React15__namespace.createElement(FormControl, null, /* @__PURE__ */ React15__namespace.createElement(
796
+ render: ({ field }) => /* @__PURE__ */ React13__namespace.createElement(FormItem, null, /* @__PURE__ */ React13__namespace.createElement(FormControl, null, /* @__PURE__ */ React13__namespace.createElement(
952
797
  AdvancedInput,
953
798
  {
954
799
  ...field,
955
- prepend: /* @__PURE__ */ React15__namespace.createElement(lucideReact.AlignHorizontalSpaceAroundIcon, { className: "sb-h-4 sb-w-4" }),
956
- append: /* @__PURE__ */ React15__namespace.createElement("span", { className: "sb-text-muted-foreground" }, "px")
800
+ prepend: /* @__PURE__ */ React13__namespace.createElement(lucideReact.AlignHorizontalSpaceAroundIcon, { className: "sb-h-4 sb-w-4" }),
801
+ append: /* @__PURE__ */ React13__namespace.createElement("span", { className: "sb-text-muted-foreground" }, "px")
957
802
  }
958
803
  )))
959
804
  }
960
- ), /* @__PURE__ */ React15__namespace.createElement(
805
+ ), /* @__PURE__ */ React13__namespace.createElement(
961
806
  FormField,
962
807
  {
963
808
  control: form.control,
964
809
  name: "padding.vertical",
965
- render: ({ field }) => /* @__PURE__ */ React15__namespace.createElement(FormItem, null, /* @__PURE__ */ React15__namespace.createElement(FormControl, null, /* @__PURE__ */ React15__namespace.createElement(
810
+ render: ({ field }) => /* @__PURE__ */ React13__namespace.createElement(FormItem, null, /* @__PURE__ */ React13__namespace.createElement(FormControl, null, /* @__PURE__ */ React13__namespace.createElement(
966
811
  AdvancedInput,
967
812
  {
968
813
  ...field,
969
- prepend: /* @__PURE__ */ React15__namespace.createElement(lucideReact.AlignHorizontalSpaceAroundIcon, { className: "sb-h-4 sb-w-4 sb-rotate-90" }),
970
- append: /* @__PURE__ */ React15__namespace.createElement("span", { className: "sb-text-muted-foreground" }, "px")
814
+ prepend: /* @__PURE__ */ React13__namespace.createElement(lucideReact.AlignHorizontalSpaceAroundIcon, { className: "sb-h-4 sb-w-4 sb-rotate-90" }),
815
+ append: /* @__PURE__ */ React13__namespace.createElement("span", { className: "sb-text-muted-foreground" }, "px")
971
816
  }
972
817
  )))
973
818
  }
974
- )) : /* @__PURE__ */ React15__namespace.createElement(React15__namespace.Fragment, null, /* @__PURE__ */ React15__namespace.createElement(
819
+ )) : /* @__PURE__ */ React13__namespace.createElement(React13__namespace.Fragment, null, /* @__PURE__ */ React13__namespace.createElement(
975
820
  FormField,
976
821
  {
977
822
  control: form.control,
978
823
  name: "padding.left",
979
- render: ({ field }) => /* @__PURE__ */ React15__namespace.createElement(FormItem, null, /* @__PURE__ */ React15__namespace.createElement(FormControl, null, /* @__PURE__ */ React15__namespace.createElement(
824
+ render: ({ field }) => /* @__PURE__ */ React13__namespace.createElement(FormItem, null, /* @__PURE__ */ React13__namespace.createElement(FormControl, null, /* @__PURE__ */ React13__namespace.createElement(
980
825
  AdvancedInput,
981
826
  {
982
827
  ...field,
983
- prepend: /* @__PURE__ */ React15__namespace.createElement(lucideReact.AlignHorizontalJustifyStartIcon, { className: "sb-h-4 sb-w-4" }),
984
- append: /* @__PURE__ */ React15__namespace.createElement("span", { className: "sb-text-muted-foreground" }, "px")
828
+ prepend: /* @__PURE__ */ React13__namespace.createElement(lucideReact.AlignHorizontalJustifyStartIcon, { className: "sb-h-4 sb-w-4" }),
829
+ append: /* @__PURE__ */ React13__namespace.createElement("span", { className: "sb-text-muted-foreground" }, "px")
985
830
  }
986
831
  )))
987
832
  }
988
- ), /* @__PURE__ */ React15__namespace.createElement(
833
+ ), /* @__PURE__ */ React13__namespace.createElement(
989
834
  FormField,
990
835
  {
991
836
  control: form.control,
992
837
  name: "padding.top",
993
- render: ({ field }) => /* @__PURE__ */ React15__namespace.createElement(FormItem, null, /* @__PURE__ */ React15__namespace.createElement(FormControl, null, /* @__PURE__ */ React15__namespace.createElement(
838
+ render: ({ field }) => /* @__PURE__ */ React13__namespace.createElement(FormItem, null, /* @__PURE__ */ React13__namespace.createElement(FormControl, null, /* @__PURE__ */ React13__namespace.createElement(
994
839
  AdvancedInput,
995
840
  {
996
841
  ...field,
997
- prepend: /* @__PURE__ */ React15__namespace.createElement(lucideReact.AlignHorizontalJustifyStartIcon, { className: "sb-h-4 sb-w-4 sb-rotate-90" }),
998
- append: /* @__PURE__ */ React15__namespace.createElement("span", { className: "sb-text-muted-foreground" }, "px")
842
+ prepend: /* @__PURE__ */ React13__namespace.createElement(lucideReact.AlignHorizontalJustifyStartIcon, { className: "sb-h-4 sb-w-4 sb-rotate-90" }),
843
+ append: /* @__PURE__ */ React13__namespace.createElement("span", { className: "sb-text-muted-foreground" }, "px")
999
844
  }
1000
845
  )))
1001
846
  }
1002
- ), /* @__PURE__ */ React15__namespace.createElement(
847
+ ), /* @__PURE__ */ React13__namespace.createElement(
1003
848
  FormField,
1004
849
  {
1005
850
  control: form.control,
1006
851
  name: "padding.right",
1007
- render: ({ field }) => /* @__PURE__ */ React15__namespace.createElement(FormItem, null, /* @__PURE__ */ React15__namespace.createElement(FormControl, null, /* @__PURE__ */ React15__namespace.createElement(
852
+ render: ({ field }) => /* @__PURE__ */ React13__namespace.createElement(FormItem, null, /* @__PURE__ */ React13__namespace.createElement(FormControl, null, /* @__PURE__ */ React13__namespace.createElement(
1008
853
  AdvancedInput,
1009
854
  {
1010
855
  ...field,
1011
- prepend: /* @__PURE__ */ React15__namespace.createElement(lucideReact.AlignHorizontalJustifyStartIcon, { className: "sb-h-4 sb-w-4 sb-rotate-180" }),
1012
- append: /* @__PURE__ */ React15__namespace.createElement("span", { className: "sb-text-muted-foreground" }, "px")
856
+ prepend: /* @__PURE__ */ React13__namespace.createElement(lucideReact.AlignHorizontalJustifyStartIcon, { className: "sb-h-4 sb-w-4 sb-rotate-180" }),
857
+ append: /* @__PURE__ */ React13__namespace.createElement("span", { className: "sb-text-muted-foreground" }, "px")
1013
858
  }
1014
859
  )))
1015
860
  }
1016
- ), /* @__PURE__ */ React15__namespace.createElement(
861
+ ), /* @__PURE__ */ React13__namespace.createElement(
1017
862
  FormField,
1018
863
  {
1019
864
  control: form.control,
1020
865
  name: "padding.bottom",
1021
- render: ({ field }) => /* @__PURE__ */ React15__namespace.createElement(FormItem, null, /* @__PURE__ */ React15__namespace.createElement(FormControl, null, /* @__PURE__ */ React15__namespace.createElement(
866
+ render: ({ field }) => /* @__PURE__ */ React13__namespace.createElement(FormItem, null, /* @__PURE__ */ React13__namespace.createElement(FormControl, null, /* @__PURE__ */ React13__namespace.createElement(
1022
867
  AdvancedInput,
1023
868
  {
1024
869
  ...field,
1025
- prepend: /* @__PURE__ */ React15__namespace.createElement(lucideReact.AlignHorizontalJustifyStartIcon, { className: "sb-h-4 sb-w-4 sb--rotate-90" }),
1026
- append: /* @__PURE__ */ React15__namespace.createElement("span", { className: "sb-text-muted-foreground" }, "px")
870
+ prepend: /* @__PURE__ */ React13__namespace.createElement(lucideReact.AlignHorizontalJustifyStartIcon, { className: "sb-h-4 sb-w-4 sb--rotate-90" }),
871
+ append: /* @__PURE__ */ React13__namespace.createElement("span", { className: "sb-text-muted-foreground" }, "px")
1027
872
  }
1028
873
  )))
1029
874
  }
1030
- ))), /* @__PURE__ */ React15__namespace.createElement("div", { className: "sb-shrink-0" }, /* @__PURE__ */ React15__namespace.createElement(
875
+ ))), /* @__PURE__ */ React13__namespace.createElement("div", { className: "sb-shrink-0" }, /* @__PURE__ */ React13__namespace.createElement(
1031
876
  FormField,
1032
877
  {
1033
878
  control: form.control,
1034
879
  name: "padding.indipendent",
1035
- render: ({ field }) => /* @__PURE__ */ React15__namespace.createElement(FormControl, null, /* @__PURE__ */ React15__namespace.createElement(
880
+ render: ({ field }) => /* @__PURE__ */ React13__namespace.createElement(FormControl, null, /* @__PURE__ */ React13__namespace.createElement(
1036
881
  Toggle,
1037
882
  {
1038
883
  className: "sb-shrink-0 sb-flex sb-w-8 sb-h-8 sb-p-0",
@@ -1041,99 +886,99 @@ var ItemDesignForm = (props) => {
1041
886
  pressed: field.value,
1042
887
  onPressedChange: field.onChange
1043
888
  },
1044
- /* @__PURE__ */ React15__namespace.createElement(lucideReact.ScanIcon, { className: "sb-h-4 sb-w-4" })
889
+ /* @__PURE__ */ React13__namespace.createElement(lucideReact.ScanIcon, { className: "sb-h-4 sb-w-4" })
1045
890
  ))
1046
891
  }
1047
- ))), /* @__PURE__ */ React15__namespace.createElement(FormMessage, null)), /* @__PURE__ */ React15__namespace.createElement("div", { className: "sb-space-y-2" }, /* @__PURE__ */ React15__namespace.createElement(FormLabel, null, "Margin"), /* @__PURE__ */ React15__namespace.createElement("div", { className: "sb-grid sb-grid-cols-[1fr,auto] sb-gap-3" }, /* @__PURE__ */ React15__namespace.createElement("div", { className: "sb-grid sb-grid-cols-2 sb-items-center sb-gap-3" }, !indipendentMargin ? /* @__PURE__ */ React15__namespace.createElement(React15__namespace.Fragment, null, /* @__PURE__ */ React15__namespace.createElement(
892
+ ))), /* @__PURE__ */ React13__namespace.createElement(FormMessage, null)), /* @__PURE__ */ React13__namespace.createElement("div", { className: "sb-space-y-2" }, /* @__PURE__ */ React13__namespace.createElement(FormLabel, null, "Margin"), /* @__PURE__ */ React13__namespace.createElement("div", { className: "sb-grid sb-grid-cols-[1fr,auto] sb-gap-3" }, /* @__PURE__ */ React13__namespace.createElement("div", { className: "sb-grid sb-grid-cols-2 sb-items-center sb-gap-3" }, !indipendentMargin ? /* @__PURE__ */ React13__namespace.createElement(React13__namespace.Fragment, null, /* @__PURE__ */ React13__namespace.createElement(
1048
893
  FormField,
1049
894
  {
1050
895
  control: form.control,
1051
896
  name: "margin.horizontal",
1052
- render: ({ field }) => /* @__PURE__ */ React15__namespace.createElement(FormItem, null, /* @__PURE__ */ React15__namespace.createElement(FormControl, null, /* @__PURE__ */ React15__namespace.createElement(
897
+ render: ({ field }) => /* @__PURE__ */ React13__namespace.createElement(FormItem, null, /* @__PURE__ */ React13__namespace.createElement(FormControl, null, /* @__PURE__ */ React13__namespace.createElement(
1053
898
  AdvancedInput,
1054
899
  {
1055
900
  ...field,
1056
- prepend: /* @__PURE__ */ React15__namespace.createElement(lucideReact.AlignHorizontalSpaceAroundIcon, { className: "sb-h-4 sb-w-4" }),
1057
- append: /* @__PURE__ */ React15__namespace.createElement("span", { className: "sb-text-muted-foreground" }, "px")
901
+ prepend: /* @__PURE__ */ React13__namespace.createElement(lucideReact.AlignHorizontalSpaceAroundIcon, { className: "sb-h-4 sb-w-4" }),
902
+ append: /* @__PURE__ */ React13__namespace.createElement("span", { className: "sb-text-muted-foreground" }, "px")
1058
903
  }
1059
904
  )))
1060
905
  }
1061
- ), /* @__PURE__ */ React15__namespace.createElement(
906
+ ), /* @__PURE__ */ React13__namespace.createElement(
1062
907
  FormField,
1063
908
  {
1064
909
  control: form.control,
1065
910
  name: "margin.vertical",
1066
- render: ({ field }) => /* @__PURE__ */ React15__namespace.createElement(FormItem, null, /* @__PURE__ */ React15__namespace.createElement(FormControl, null, /* @__PURE__ */ React15__namespace.createElement(
911
+ render: ({ field }) => /* @__PURE__ */ React13__namespace.createElement(FormItem, null, /* @__PURE__ */ React13__namespace.createElement(FormControl, null, /* @__PURE__ */ React13__namespace.createElement(
1067
912
  AdvancedInput,
1068
913
  {
1069
914
  ...field,
1070
- prepend: /* @__PURE__ */ React15__namespace.createElement(lucideReact.AlignHorizontalSpaceAroundIcon, { className: "sb-h-4 sb-w-4 sb-rotate-90" }),
1071
- append: /* @__PURE__ */ React15__namespace.createElement("span", { className: "sb-text-muted-foreground" }, "px")
915
+ prepend: /* @__PURE__ */ React13__namespace.createElement(lucideReact.AlignHorizontalSpaceAroundIcon, { className: "sb-h-4 sb-w-4 sb-rotate-90" }),
916
+ append: /* @__PURE__ */ React13__namespace.createElement("span", { className: "sb-text-muted-foreground" }, "px")
1072
917
  }
1073
918
  )))
1074
919
  }
1075
- )) : /* @__PURE__ */ React15__namespace.createElement(React15__namespace.Fragment, null, /* @__PURE__ */ React15__namespace.createElement(
920
+ )) : /* @__PURE__ */ React13__namespace.createElement(React13__namespace.Fragment, null, /* @__PURE__ */ React13__namespace.createElement(
1076
921
  FormField,
1077
922
  {
1078
923
  control: form.control,
1079
924
  name: "margin.left",
1080
- render: ({ field }) => /* @__PURE__ */ React15__namespace.createElement(FormItem, null, /* @__PURE__ */ React15__namespace.createElement(FormControl, null, /* @__PURE__ */ React15__namespace.createElement(
925
+ render: ({ field }) => /* @__PURE__ */ React13__namespace.createElement(FormItem, null, /* @__PURE__ */ React13__namespace.createElement(FormControl, null, /* @__PURE__ */ React13__namespace.createElement(
1081
926
  AdvancedInput,
1082
927
  {
1083
928
  ...field,
1084
- prepend: /* @__PURE__ */ React15__namespace.createElement(lucideReact.AlignHorizontalJustifyStartIcon, { className: "sb-h-4 sb-w-4" }),
1085
- append: /* @__PURE__ */ React15__namespace.createElement("span", { className: "sb-text-muted-foreground" }, "px")
929
+ prepend: /* @__PURE__ */ React13__namespace.createElement(lucideReact.AlignHorizontalJustifyStartIcon, { className: "sb-h-4 sb-w-4" }),
930
+ append: /* @__PURE__ */ React13__namespace.createElement("span", { className: "sb-text-muted-foreground" }, "px")
1086
931
  }
1087
932
  )))
1088
933
  }
1089
- ), /* @__PURE__ */ React15__namespace.createElement(
934
+ ), /* @__PURE__ */ React13__namespace.createElement(
1090
935
  FormField,
1091
936
  {
1092
937
  control: form.control,
1093
938
  name: "margin.top",
1094
- render: ({ field }) => /* @__PURE__ */ React15__namespace.createElement(FormItem, null, /* @__PURE__ */ React15__namespace.createElement(FormControl, null, /* @__PURE__ */ React15__namespace.createElement(
939
+ render: ({ field }) => /* @__PURE__ */ React13__namespace.createElement(FormItem, null, /* @__PURE__ */ React13__namespace.createElement(FormControl, null, /* @__PURE__ */ React13__namespace.createElement(
1095
940
  AdvancedInput,
1096
941
  {
1097
942
  ...field,
1098
- prepend: /* @__PURE__ */ React15__namespace.createElement(lucideReact.AlignHorizontalJustifyStartIcon, { className: "sb-h-4 sb-w-4 sb-rotate-90" }),
1099
- append: /* @__PURE__ */ React15__namespace.createElement("span", { className: "sb-text-muted-foreground" }, "px")
943
+ prepend: /* @__PURE__ */ React13__namespace.createElement(lucideReact.AlignHorizontalJustifyStartIcon, { className: "sb-h-4 sb-w-4 sb-rotate-90" }),
944
+ append: /* @__PURE__ */ React13__namespace.createElement("span", { className: "sb-text-muted-foreground" }, "px")
1100
945
  }
1101
946
  )))
1102
947
  }
1103
- ), /* @__PURE__ */ React15__namespace.createElement(
948
+ ), /* @__PURE__ */ React13__namespace.createElement(
1104
949
  FormField,
1105
950
  {
1106
951
  control: form.control,
1107
952
  name: "margin.right",
1108
- render: ({ field }) => /* @__PURE__ */ React15__namespace.createElement(FormItem, null, /* @__PURE__ */ React15__namespace.createElement(FormControl, null, /* @__PURE__ */ React15__namespace.createElement(
953
+ render: ({ field }) => /* @__PURE__ */ React13__namespace.createElement(FormItem, null, /* @__PURE__ */ React13__namespace.createElement(FormControl, null, /* @__PURE__ */ React13__namespace.createElement(
1109
954
  AdvancedInput,
1110
955
  {
1111
956
  ...field,
1112
- prepend: /* @__PURE__ */ React15__namespace.createElement(lucideReact.AlignHorizontalJustifyStartIcon, { className: "sb-h-4 sb-w-4 sb-rotate-180" }),
1113
- append: /* @__PURE__ */ React15__namespace.createElement("span", { className: "sb-text-muted-foreground" }, "px")
957
+ prepend: /* @__PURE__ */ React13__namespace.createElement(lucideReact.AlignHorizontalJustifyStartIcon, { className: "sb-h-4 sb-w-4 sb-rotate-180" }),
958
+ append: /* @__PURE__ */ React13__namespace.createElement("span", { className: "sb-text-muted-foreground" }, "px")
1114
959
  }
1115
960
  )))
1116
961
  }
1117
- ), /* @__PURE__ */ React15__namespace.createElement(
962
+ ), /* @__PURE__ */ React13__namespace.createElement(
1118
963
  FormField,
1119
964
  {
1120
965
  control: form.control,
1121
966
  name: "margin.bottom",
1122
- render: ({ field }) => /* @__PURE__ */ React15__namespace.createElement(FormItem, null, /* @__PURE__ */ React15__namespace.createElement(FormControl, null, /* @__PURE__ */ React15__namespace.createElement(
967
+ render: ({ field }) => /* @__PURE__ */ React13__namespace.createElement(FormItem, null, /* @__PURE__ */ React13__namespace.createElement(FormControl, null, /* @__PURE__ */ React13__namespace.createElement(
1123
968
  AdvancedInput,
1124
969
  {
1125
970
  ...field,
1126
- prepend: /* @__PURE__ */ React15__namespace.createElement(lucideReact.AlignHorizontalJustifyStartIcon, { className: "sb-h-4 sb-w-4 sb--rotate-90" }),
1127
- append: /* @__PURE__ */ React15__namespace.createElement("span", { className: "sb-text-muted-foreground" }, "px")
971
+ prepend: /* @__PURE__ */ React13__namespace.createElement(lucideReact.AlignHorizontalJustifyStartIcon, { className: "sb-h-4 sb-w-4 sb--rotate-90" }),
972
+ append: /* @__PURE__ */ React13__namespace.createElement("span", { className: "sb-text-muted-foreground" }, "px")
1128
973
  }
1129
974
  )))
1130
975
  }
1131
- ))), /* @__PURE__ */ React15__namespace.createElement("div", { className: "sb-shrink-0" }, /* @__PURE__ */ React15__namespace.createElement(
976
+ ))), /* @__PURE__ */ React13__namespace.createElement("div", { className: "sb-shrink-0" }, /* @__PURE__ */ React13__namespace.createElement(
1132
977
  FormField,
1133
978
  {
1134
979
  control: form.control,
1135
980
  name: "margin.indipendent",
1136
- render: ({ field }) => /* @__PURE__ */ React15__namespace.createElement(FormControl, null, /* @__PURE__ */ React15__namespace.createElement(
981
+ render: ({ field }) => /* @__PURE__ */ React13__namespace.createElement(FormControl, null, /* @__PURE__ */ React13__namespace.createElement(
1137
982
  Toggle,
1138
983
  {
1139
984
  className: "sb-shrink-0 sb-flex sb-w-8 sb-h-8 sb-p-0",
@@ -1142,38 +987,147 @@ var ItemDesignForm = (props) => {
1142
987
  pressed: field.value,
1143
988
  onPressedChange: field.onChange
1144
989
  },
1145
- /* @__PURE__ */ React15__namespace.createElement(lucideReact.ScanIcon, { className: "sb-h-4 sb-w-4" })
990
+ /* @__PURE__ */ React13__namespace.createElement(lucideReact.ScanIcon, { className: "sb-h-4 sb-w-4" })
1146
991
  ))
1147
992
  }
1148
- ))), /* @__PURE__ */ React15__namespace.createElement(FormMessage, null)))));
993
+ ))), /* @__PURE__ */ React13__namespace.createElement(FormMessage, null)))));
994
+ };
995
+ function Calendar({
996
+ className,
997
+ classNames,
998
+ showOutsideDays = true,
999
+ ...props
1000
+ }) {
1001
+ return /* @__PURE__ */ React13__namespace.createElement(
1002
+ reactDayPicker.DayPicker,
1003
+ {
1004
+ showOutsideDays,
1005
+ className: chunkGSOMMLCG_js.cn("sb-p-3 sb-font-roboto", className),
1006
+ classNames: {
1007
+ months: "sb-flex sb-flex-col sm:sb-flex-row sb-space-y-4 sm:sb-space-x-4 sm:sb-space-y-0",
1008
+ month: "sb-space-y-4",
1009
+ caption: "sb-flex sb-justify-center sb-pt-1 sb-relative sb-items-center",
1010
+ caption_label: "sb-text-sm sb-font-medium",
1011
+ nav: "sb-space-x-1 sb-flex sb-items-center",
1012
+ nav_button: chunkGSOMMLCG_js.cn(
1013
+ chunkGSOMMLCG_js.buttonVariants({ variant: "outline" }),
1014
+ "sb-h-7 sb-w-7 sb-bg-transparent sb-p-0 sb-opacity-50 hover:sb-opacity-100"
1015
+ ),
1016
+ nav_button_previous: "sb-absolute sb-left-1",
1017
+ nav_button_next: "sb-absolute sb-right-1",
1018
+ table: "sb-w-full sb-border-collapse sb-space-y-1",
1019
+ head_row: "sb-flex",
1020
+ head_cell: "sb-text-muted-foreground sb-rounded-md sb-w-8 sb-font-normal sb-text-[0.8rem]",
1021
+ row: "sb-flex sb-w-full sb-mt-2",
1022
+ cell: chunkGSOMMLCG_js.cn(
1023
+ "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",
1024
+ 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"
1025
+ ),
1026
+ day: chunkGSOMMLCG_js.cn(
1027
+ chunkGSOMMLCG_js.buttonVariants({ variant: "ghost" }),
1028
+ "sb-h-8 sb-w-8 sb-p-0 sb-font-normal aria-selected:sb-opacity-100"
1029
+ ),
1030
+ day_range_start: "day-range-start",
1031
+ day_range_end: "day-range-end",
1032
+ day_selected: "sb-bg-primary sb-text-primary-foreground hover:sb-bg-primary hover:sb-text-primary-foreground focus:sb-bg-primary focus:sb-text-primary-foreground",
1033
+ day_today: "sb-bg-accent sb-text-accent-foreground",
1034
+ day_outside: "day-outside sb-text-muted-foreground sb-opacity-50 aria-selected:sb-bg-accent/50 aria-selected:sb-text-muted-foreground aria-selected:sb-opacity-30",
1035
+ day_disabled: "sb-text-muted-foreground sb-opacity-50",
1036
+ day_range_middle: "aria-selected:sb-bg-accent aria-selected:sb-text-accent-foreground",
1037
+ day_hidden: "invisible",
1038
+ ...classNames
1039
+ },
1040
+ components: {
1041
+ IconLeft: () => /* @__PURE__ */ React13__namespace.createElement(lucideReact.ChevronLeftIcon, { className: "sb-h-4 sb-w-4" }),
1042
+ IconRight: () => /* @__PURE__ */ React13__namespace.createElement(lucideReact.ChevronRightIcon, { className: "sb-h-4 sb-w-4" })
1043
+ },
1044
+ ...props
1045
+ }
1046
+ );
1047
+ }
1048
+ Calendar.displayName = "Calendar";
1049
+ var Textarea = React13__namespace.forwardRef(
1050
+ ({ className, ...props }, ref) => {
1051
+ return /* @__PURE__ */ React13__namespace.createElement(
1052
+ "textarea",
1053
+ {
1054
+ className: chunkGSOMMLCG_js.cn(
1055
+ "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",
1056
+ className
1057
+ ),
1058
+ ref,
1059
+ ...props
1060
+ }
1061
+ );
1062
+ }
1063
+ );
1064
+ Textarea.displayName = "Textarea";
1065
+
1066
+ // src/components/container-item-form.tsx
1067
+ var ContainerItemForm = (props) => {
1068
+ const { item } = props;
1069
+ const { patchItem } = chunkGSOMMLCG_js.useBuilder();
1070
+ const component = chunkUZFAGH6G_js.builder.getComponent(item.component);
1071
+ if (!component) {
1072
+ throw new Error(
1073
+ `[simple-builder]: Component with id ${item.component} not found in container item form component`
1074
+ );
1075
+ }
1076
+ const form = reactHookForm.useForm({
1077
+ defaultValues: (component.inputs || []).reduce(
1078
+ (acc, input) => ({
1079
+ ...acc,
1080
+ [input.name]: item?.props?.[input.name] ?? input.defaultValue
1081
+ }),
1082
+ {}
1083
+ )
1084
+ });
1085
+ const onSubmit = (values) => {
1086
+ patchItem(item.id, {
1087
+ props: values
1088
+ });
1089
+ };
1090
+ React13__namespace.useEffect(() => {
1091
+ const subscription = form.watch(() => form.handleSubmit(onSubmit)());
1092
+ return () => subscription.unsubscribe();
1093
+ }, [form.watch, form.handleSubmit]);
1094
+ return /* @__PURE__ */ React13__namespace.createElement(Form, { ...form }, /* @__PURE__ */ React13__namespace.createElement("form", { onSubmit: form.handleSubmit(onSubmit) }, /* @__PURE__ */ React13__namespace.createElement("div", { className: "sb-space-y-4 sb-p-4" }, (component.inputs || []).map((input) => /* @__PURE__ */ React13__namespace.createElement(
1095
+ FormField,
1096
+ {
1097
+ key: input.name,
1098
+ control: form.control,
1099
+ name: input.name,
1100
+ render: ({ field }) => /* @__PURE__ */ React13__namespace.createElement(RenderInput, { type: input.type, input, field })
1101
+ }
1102
+ )))));
1149
1103
  };
1150
1104
  var RenderInput = (props) => {
1151
1105
  const { type, input, field } = props;
1152
1106
  switch (type) {
1153
1107
  case "string":
1154
- return /* @__PURE__ */ React15__namespace.createElement(FormItem, null, /* @__PURE__ */ React15__namespace.createElement(FormLabel, null, input.friendlyName || input.name), /* @__PURE__ */ React15__namespace.createElement(FormControl, null, /* @__PURE__ */ React15__namespace.createElement(Input, { ...field })), input.helperText && /* @__PURE__ */ React15__namespace.createElement(FormDescription, null, input.helperText), /* @__PURE__ */ React15__namespace.createElement(FormMessage, null));
1108
+ return /* @__PURE__ */ React13__namespace.createElement(FormItem, null, /* @__PURE__ */ React13__namespace.createElement(FormLabel, null, input.friendlyName || input.name), /* @__PURE__ */ React13__namespace.createElement(FormControl, null, /* @__PURE__ */ React13__namespace.createElement(Input, { ...field })), input.helperText && /* @__PURE__ */ React13__namespace.createElement(FormDescription, null, input.helperText), /* @__PURE__ */ React13__namespace.createElement(FormMessage, null));
1155
1109
  case "longText":
1156
- return /* @__PURE__ */ React15__namespace.createElement(FormItem, null, /* @__PURE__ */ React15__namespace.createElement(FormLabel, null, input.friendlyName || input.name), /* @__PURE__ */ React15__namespace.createElement(FormControl, null, /* @__PURE__ */ React15__namespace.createElement(Textarea, { ...field })), input.helperText && /* @__PURE__ */ React15__namespace.createElement(FormDescription, null, input.helperText), /* @__PURE__ */ React15__namespace.createElement(FormMessage, null));
1110
+ return /* @__PURE__ */ React13__namespace.createElement(FormItem, null, /* @__PURE__ */ React13__namespace.createElement(FormLabel, null, input.friendlyName || input.name), /* @__PURE__ */ React13__namespace.createElement(FormControl, null, /* @__PURE__ */ React13__namespace.createElement(Textarea, { ...field })), input.helperText && /* @__PURE__ */ React13__namespace.createElement(FormDescription, null, input.helperText), /* @__PURE__ */ React13__namespace.createElement(FormMessage, null));
1157
1111
  case "richText":
1158
- return /* @__PURE__ */ React15__namespace.createElement(FormItem, null, /* @__PURE__ */ React15__namespace.createElement(FormLabel, null, input.friendlyName || input.name), /* @__PURE__ */ React15__namespace.createElement(FormControl, null, /* @__PURE__ */ React15__namespace.createElement(Textarea, { ...field })), input.helperText && /* @__PURE__ */ React15__namespace.createElement(FormDescription, null, input.helperText), /* @__PURE__ */ React15__namespace.createElement(FormMessage, null));
1112
+ return /* @__PURE__ */ React13__namespace.createElement(FormItem, null, /* @__PURE__ */ React13__namespace.createElement(FormLabel, null, input.friendlyName || input.name), /* @__PURE__ */ React13__namespace.createElement(FormControl, null, /* @__PURE__ */ React13__namespace.createElement(Textarea, { ...field })), input.helperText && /* @__PURE__ */ React13__namespace.createElement(FormDescription, null, input.helperText), /* @__PURE__ */ React13__namespace.createElement(FormMessage, null));
1159
1113
  case "number":
1160
- return /* @__PURE__ */ React15__namespace.createElement(FormItem, null, /* @__PURE__ */ React15__namespace.createElement(FormLabel, null, input.friendlyName || input.name), /* @__PURE__ */ React15__namespace.createElement(FormControl, null, /* @__PURE__ */ React15__namespace.createElement(Input, { type: "number", ...field })), input.helperText && /* @__PURE__ */ React15__namespace.createElement(FormDescription, null, input.helperText), /* @__PURE__ */ React15__namespace.createElement(FormMessage, null));
1114
+ return /* @__PURE__ */ React13__namespace.createElement(FormItem, null, /* @__PURE__ */ React13__namespace.createElement(FormLabel, null, input.friendlyName || input.name), /* @__PURE__ */ React13__namespace.createElement(FormControl, null, /* @__PURE__ */ React13__namespace.createElement(Input, { type: "number", ...field })), input.helperText && /* @__PURE__ */ React13__namespace.createElement(FormDescription, null, input.helperText), /* @__PURE__ */ React13__namespace.createElement(FormMessage, null));
1161
1115
  case "color":
1162
- return /* @__PURE__ */ React15__namespace.createElement(FormItem, null, /* @__PURE__ */ React15__namespace.createElement(FormLabel, null, input.friendlyName || input.name), /* @__PURE__ */ React15__namespace.createElement(FormControl, null, /* @__PURE__ */ React15__namespace.createElement(ColorPicker, { color: field.value, onColorChange: field.onChange })), input.helperText && /* @__PURE__ */ React15__namespace.createElement(FormDescription, null, input.helperText), /* @__PURE__ */ React15__namespace.createElement(FormMessage, null));
1116
+ return /* @__PURE__ */ React13__namespace.createElement(FormItem, null, /* @__PURE__ */ React13__namespace.createElement(FormLabel, null, input.friendlyName || input.name), /* @__PURE__ */ React13__namespace.createElement(FormControl, null, /* @__PURE__ */ React13__namespace.createElement(ColorPicker, { color: field.value, onColorChange: field.onChange })), input.helperText && /* @__PURE__ */ React13__namespace.createElement(FormDescription, null, input.helperText), /* @__PURE__ */ React13__namespace.createElement(FormMessage, null));
1163
1117
  case "date":
1164
- return /* @__PURE__ */ React15__namespace.createElement(FormItem, null, /* @__PURE__ */ React15__namespace.createElement(FormLabel, null, input.friendlyName || input.name), /* @__PURE__ */ React15__namespace.createElement(FormControl, null, /* @__PURE__ */ React15__namespace.createElement(Popover, null, /* @__PURE__ */ React15__namespace.createElement(PopoverTrigger, { asChild: true }, /* @__PURE__ */ React15__namespace.createElement(
1165
- chunk3S4FFEHM_js.Button,
1118
+ return /* @__PURE__ */ React13__namespace.createElement(FormItem, null, /* @__PURE__ */ React13__namespace.createElement(FormLabel, null, input.friendlyName || input.name), /* @__PURE__ */ React13__namespace.createElement(FormControl, null, /* @__PURE__ */ React13__namespace.createElement(Popover, null, /* @__PURE__ */ React13__namespace.createElement(PopoverTrigger, { asChild: true }, /* @__PURE__ */ React13__namespace.createElement(
1119
+ chunkGSOMMLCG_js.Button,
1166
1120
  {
1167
1121
  variant: "outline",
1168
1122
  size: "sm",
1169
- className: chunk3S4FFEHM_js.cn(
1123
+ className: chunkGSOMMLCG_js.cn(
1170
1124
  "sb-w-full sb-flex sb-justify-start sb-text-left sb-font-normal",
1171
1125
  !field.value && "sb-text-muted-foreground"
1172
1126
  )
1173
1127
  },
1174
- /* @__PURE__ */ React15__namespace.createElement(lucideReact.CalendarIcon, { className: "sb-mr-2 sb-h-4 sb-w-4" }),
1175
- field.value ? dateFns.format(field.value, "PPP") : /* @__PURE__ */ React15__namespace.createElement("span", null, "Pick a date")
1176
- )), /* @__PURE__ */ React15__namespace.createElement(PopoverContent, { className: "sb-w-auto sb-p-0", align: "start" }, /* @__PURE__ */ React15__namespace.createElement(
1128
+ /* @__PURE__ */ React13__namespace.createElement(lucideReact.CalendarIcon, { className: "sb-mr-2 sb-h-4 sb-w-4" }),
1129
+ field.value ? dateFns.format(field.value, "PPP") : /* @__PURE__ */ React13__namespace.createElement("span", null, "Pick a date")
1130
+ )), /* @__PURE__ */ React13__namespace.createElement(PopoverContent, { className: "sb-w-auto sb-p-0", align: "start" }, /* @__PURE__ */ React13__namespace.createElement(
1177
1131
  Calendar,
1178
1132
  {
1179
1133
  mode: "single",
@@ -1181,11 +1135,11 @@ var RenderInput = (props) => {
1181
1135
  onSelect: field.onChange,
1182
1136
  initialFocus: true
1183
1137
  }
1184
- )))), input.helperText && /* @__PURE__ */ React15__namespace.createElement(FormDescription, null, input.helperText), /* @__PURE__ */ React15__namespace.createElement(FormMessage, null));
1138
+ )))), input.helperText && /* @__PURE__ */ React13__namespace.createElement(FormDescription, null, input.helperText), /* @__PURE__ */ React13__namespace.createElement(FormMessage, null));
1185
1139
  case "boolean":
1186
- return /* @__PURE__ */ React15__namespace.createElement(FormItem, { className: "sb-flex sb-flex-row sb-items-center sb-justify-between sb-space-y-0" }, /* @__PURE__ */ React15__namespace.createElement(FormLabel, null, input.friendlyName || input.name), /* @__PURE__ */ React15__namespace.createElement(FormControl, null, /* @__PURE__ */ React15__namespace.createElement(Switch, { checked: field.value, onCheckedChange: field.onChange })), input.helperText && /* @__PURE__ */ React15__namespace.createElement(FormDescription, null, input.helperText), /* @__PURE__ */ React15__namespace.createElement(FormMessage, null));
1140
+ return /* @__PURE__ */ React13__namespace.createElement(FormItem, { className: "sb-flex sb-flex-row sb-items-center sb-justify-between sb-space-y-0" }, /* @__PURE__ */ React13__namespace.createElement(FormLabel, null, input.friendlyName || input.name), /* @__PURE__ */ React13__namespace.createElement(FormControl, null, /* @__PURE__ */ React13__namespace.createElement(Switch, { checked: field.value, onCheckedChange: field.onChange })), input.helperText && /* @__PURE__ */ React13__namespace.createElement(FormDescription, null, input.helperText), /* @__PURE__ */ React13__namespace.createElement(FormMessage, null));
1187
1141
  case "file":
1188
- return /* @__PURE__ */ React15__namespace.createElement(FormItem, null, /* @__PURE__ */ React15__namespace.createElement(FormLabel, null, input.friendlyName || input.name), /* @__PURE__ */ React15__namespace.createElement(FormControl, null, /* @__PURE__ */ React15__namespace.createElement(
1142
+ return /* @__PURE__ */ React13__namespace.createElement(FormItem, null, /* @__PURE__ */ React13__namespace.createElement(FormLabel, null, input.friendlyName || input.name), /* @__PURE__ */ React13__namespace.createElement(FormControl, null, /* @__PURE__ */ React13__namespace.createElement(
1189
1143
  MediaInput,
1190
1144
  {
1191
1145
  className: "sb-grid sb-grid-cols-2 sb-gap-1",
@@ -1197,26 +1151,76 @@ var RenderInput = (props) => {
1197
1151
  "media-input: Error: " + e?.description
1198
1152
  )
1199
1153
  }
1200
- )), input.helperText && /* @__PURE__ */ React15__namespace.createElement(FormDescription, null, input.helperText), /* @__PURE__ */ React15__namespace.createElement(FormMessage, null));
1154
+ )), input.helperText && /* @__PURE__ */ React13__namespace.createElement(FormDescription, null, input.helperText), /* @__PURE__ */ React13__namespace.createElement(FormMessage, null));
1201
1155
  default:
1202
1156
  throw new Error(
1203
1157
  `[simple-builder]: Input type "${props.type}" not supported`
1204
1158
  );
1205
1159
  }
1206
1160
  };
1161
+
1162
+ // src/components/container-item-toolbar.tsx
1163
+ var ContainerItemToolbar = (props) => {
1164
+ const { contentId, canBringUp = false, canBringDown = false } = props;
1165
+ const { bringUp, bringDown } = chunkGSOMMLCG_js.useBuilder();
1166
+ return /* @__PURE__ */ React13__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__ */ React13__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__ */ React13__namespace.createElement(EditButton, { id: contentId }), /* @__PURE__ */ React13__namespace.createElement(
1167
+ chunkGSOMMLCG_js.Button,
1168
+ {
1169
+ variant: "ghost",
1170
+ className: "sb-w-8 sb-h-8 sb-p-0",
1171
+ onClick: () => bringUp(contentId),
1172
+ disabled: !canBringUp
1173
+ },
1174
+ /* @__PURE__ */ React13__namespace.createElement(lucideReact.ArrowUp, { className: "sb-h-5 sb-w-5" })
1175
+ ), /* @__PURE__ */ React13__namespace.createElement(
1176
+ chunkGSOMMLCG_js.Button,
1177
+ {
1178
+ variant: "ghost",
1179
+ className: "sb-w-8 sb-h-8 sb-p-0",
1180
+ onClick: () => bringDown(contentId),
1181
+ disabled: !canBringDown
1182
+ },
1183
+ /* @__PURE__ */ React13__namespace.createElement(lucideReact.ArrowDown, { className: "sb-h-5 sb-w-5" })
1184
+ ), /* @__PURE__ */ React13__namespace.createElement(DeleteButton, { contentId })));
1185
+ };
1186
+ var EditButton = ({ id }) => {
1187
+ return /* @__PURE__ */ React13__namespace.createElement(Popover, null, /* @__PURE__ */ React13__namespace.createElement(PopoverTrigger, { asChild: true }, /* @__PURE__ */ React13__namespace.createElement(chunkGSOMMLCG_js.Button, { variant: "ghost", className: "sb-w-8 sb-h-8 sb-p-0" }, /* @__PURE__ */ React13__namespace.createElement(lucideReact.Edit2Icon, { className: "sb-h-5 sb-w-5" }))), /* @__PURE__ */ React13__namespace.createElement(
1188
+ PopoverContent,
1189
+ {
1190
+ side: "left",
1191
+ align: "start",
1192
+ sideOffset: 16,
1193
+ alignOffset: -8,
1194
+ className: "sb-p-0",
1195
+ collisionPadding: 16
1196
+ },
1197
+ /* @__PURE__ */ React13__namespace.createElement(EditPopoverInner, { id })
1198
+ ));
1199
+ };
1200
+ var EditPopoverInner = (props) => {
1201
+ const { id } = props;
1202
+ const { getItem } = chunkGSOMMLCG_js.useBuilder();
1203
+ const item = getItem(id);
1204
+ if (!item) {
1205
+ throw new Error(
1206
+ `[simple-builder]: Item with id ${id} not found in container item form component`
1207
+ );
1208
+ }
1209
+ return /* @__PURE__ */ React13__namespace.createElement(Tabs, null, /* @__PURE__ */ React13__namespace.createElement(TabsList, { defaultValue: "content" }, /* @__PURE__ */ React13__namespace.createElement(TabsTrigger, { value: "content" }, "Inhoud"), /* @__PURE__ */ React13__namespace.createElement(TabsTrigger, { value: "design" }, "Design")), /* @__PURE__ */ React13__namespace.createElement(TabsContent, { value: "content" }, /* @__PURE__ */ React13__namespace.createElement(ContainerItemForm, { item })), /* @__PURE__ */ React13__namespace.createElement(TabsContent, { value: "design" }, /* @__PURE__ */ React13__namespace.createElement(ItemDesignForm, { item })));
1210
+ };
1207
1211
  var DeleteButton = ({ contentId }) => {
1208
- const { deleteContent } = chunk3S4FFEHM_js.useBuilder();
1209
- return /* @__PURE__ */ React15__namespace.createElement(AlertDialog, null, /* @__PURE__ */ React15__namespace.createElement(AlertDialogTrigger, { asChild: true }, /* @__PURE__ */ React15__namespace.createElement(
1210
- chunk3S4FFEHM_js.Button,
1212
+ const { deleteContent } = chunkGSOMMLCG_js.useBuilder();
1213
+ return /* @__PURE__ */ React13__namespace.createElement(AlertDialog, null, /* @__PURE__ */ React13__namespace.createElement(AlertDialogTrigger, { asChild: true }, /* @__PURE__ */ React13__namespace.createElement(
1214
+ chunkGSOMMLCG_js.Button,
1211
1215
  {
1212
1216
  variant: "ghost",
1213
1217
  className: "sb-w-8 sb-h-8 sb-p-0 sb-text-destructive"
1214
1218
  },
1215
- /* @__PURE__ */ React15__namespace.createElement(lucideReact.Trash2Icon, { className: "sb-h-5 sb-w-5" })
1216
- )), /* @__PURE__ */ React15__namespace.createElement(AlertDialogContent, null, /* @__PURE__ */ React15__namespace.createElement(AlertDialogDescription, null, "Weet je zeker dat je dit blok wilt verwijderen?"), /* @__PURE__ */ React15__namespace.createElement(AlertDialogFooter, null, /* @__PURE__ */ React15__namespace.createElement(AlertDialogCancel, null, "Annuleren"), /* @__PURE__ */ React15__namespace.createElement(
1219
+ /* @__PURE__ */ React13__namespace.createElement(lucideReact.Trash2Icon, { className: "sb-h-5 sb-w-5" })
1220
+ )), /* @__PURE__ */ React13__namespace.createElement(AlertDialogContent, null, /* @__PURE__ */ React13__namespace.createElement(AlertDialogDescription, null, "Weet je zeker dat je dit blok wilt verwijderen?"), /* @__PURE__ */ React13__namespace.createElement(AlertDialogFooter, null, /* @__PURE__ */ React13__namespace.createElement(AlertDialogCancel, null, "Annuleren"), /* @__PURE__ */ React13__namespace.createElement(
1217
1221
  AlertDialogAction,
1218
1222
  {
1219
- className: chunk3S4FFEHM_js.buttonVariants({ variant: "destructive" }),
1223
+ className: chunkGSOMMLCG_js.buttonVariants({ variant: "destructive" }),
1220
1224
  onClick: () => deleteContent(contentId)
1221
1225
  },
1222
1226
  "Verwijderen"
@@ -1227,13 +1231,13 @@ var DesignWrapper = (props) => {
1227
1231
  const { container = true, background, ...rest } = styles || {};
1228
1232
  const matches = typeof background === "string" ? background.match(/url\(["']?(.*?)["']?\)/) : void 0;
1229
1233
  const src = matches ? matches[1] : void 0;
1230
- return /* @__PURE__ */ React15__namespace.createElement(
1234
+ return /* @__PURE__ */ React13__namespace.createElement(
1231
1235
  "div",
1232
1236
  {
1233
- className: chunk3S4FFEHM_js.cn("sb-relative", className),
1237
+ className: chunkGSOMMLCG_js.cn("sb-relative", className),
1234
1238
  style: { ...!src && { background }, ...rest }
1235
1239
  },
1236
- src && /* @__PURE__ */ React15__namespace.createElement(
1240
+ src && /* @__PURE__ */ React13__namespace.createElement(
1237
1241
  Image,
1238
1242
  {
1239
1243
  src,
@@ -1242,7 +1246,7 @@ var DesignWrapper = (props) => {
1242
1246
  className: "sb-object-cover sb-absolute sb-inset-0 sb-pointer-events-none sb--z-[1]"
1243
1247
  }
1244
1248
  ),
1245
- container ? /* @__PURE__ */ React15__namespace.createElement("div", { className: "sb-container sb-mx-auto" }, children) : children
1249
+ container ? /* @__PURE__ */ React13__namespace.createElement("div", { className: "sb-container sb-mx-auto" }, children) : children
1246
1250
  );
1247
1251
  };
1248
1252
 
@@ -1255,14 +1259,14 @@ var BuildContainerInner = (props) => {
1255
1259
  "[simple-builder]: Multiple content blocks detected when using property multiple false."
1256
1260
  );
1257
1261
  }
1258
- return /* @__PURE__ */ React15__namespace.createElement("div", null, items.length <= 0 ? /* @__PURE__ */ React15__namespace.createElement(AddContentPlaceholder, { parent: id, container: name, index: 0 }) : multiple && /* @__PURE__ */ React15__namespace.createElement(AddContentDividerButton, { parent: id, container: name, index: 0 }), items.map((item, i) => /* @__PURE__ */ React15__namespace.createElement(React15__namespace.Fragment, { key: item.id }, /* @__PURE__ */ React15__namespace.createElement("div", { className: "sb-relative sb-container-item" }, /* @__PURE__ */ React15__namespace.createElement(DesignWrapper, { styles: item.styles }, chunkVMHWPKU4_js.builder.bindComponent(item, true)), /* @__PURE__ */ React15__namespace.createElement(
1262
+ return /* @__PURE__ */ React13__namespace.createElement("div", null, items.length <= 0 ? /* @__PURE__ */ React13__namespace.createElement(AddContentPlaceholder, { parent: id, container: name, index: 0 }) : multiple && /* @__PURE__ */ React13__namespace.createElement(AddContentDividerButton, { parent: id, container: name, index: 0 }), items.map((item, i) => /* @__PURE__ */ React13__namespace.createElement(React13__namespace.Fragment, { key: item.id }, /* @__PURE__ */ React13__namespace.createElement("div", { className: "sb-relative sb-container-item" }, /* @__PURE__ */ React13__namespace.createElement(DesignWrapper, { styles: item.styles }, chunkUZFAGH6G_js.builder.bindComponent(item, true)), /* @__PURE__ */ React13__namespace.createElement(
1259
1263
  ContainerItemToolbar,
1260
1264
  {
1261
1265
  contentId: item.id,
1262
1266
  canBringUp: i > 0,
1263
1267
  canBringDown: i < items.length - 1
1264
1268
  }
1265
- )), multiple && /* @__PURE__ */ React15__namespace.createElement(
1269
+ )), multiple && /* @__PURE__ */ React13__namespace.createElement(
1266
1270
  AddContentDividerButton,
1267
1271
  {
1268
1272
  parent: id,
@@ -1273,12 +1277,12 @@ var BuildContainerInner = (props) => {
1273
1277
  };
1274
1278
  var build_container_client_default = BuildContainerInner;
1275
1279
  var AddContentButton = (props) => {
1276
- const components = chunkVMHWPKU4_js.builder.getComponents();
1277
- const { addContent } = chunk3S4FFEHM_js.useBuilder();
1278
- return /* @__PURE__ */ React15__namespace.createElement(Popover, null, /* @__PURE__ */ React15__namespace.createElement(PopoverTrigger, { asChild: true }, props.children), /* @__PURE__ */ React15__namespace.createElement(PopoverContent, { className: "sb-p-1" }, /* @__PURE__ */ React15__namespace.createElement("div", { className: "sb-grid sb-grid-cols-2 sb-gap-2" }, components.map((component) => {
1280
+ const components = chunkUZFAGH6G_js.builder.getComponents();
1281
+ const { addContent } = chunkGSOMMLCG_js.useBuilder();
1282
+ return /* @__PURE__ */ React13__namespace.createElement(Popover, null, /* @__PURE__ */ React13__namespace.createElement(PopoverTrigger, { asChild: true }, props.children), /* @__PURE__ */ React13__namespace.createElement(PopoverContent, { className: "sb-p-1" }, /* @__PURE__ */ React13__namespace.createElement("div", { className: "sb-grid sb-grid-cols-2 sb-gap-2" }, components.map((component) => {
1279
1283
  const Icon = component.icon ?? lucideReact.ImageIcon;
1280
- return /* @__PURE__ */ React15__namespace.createElement(PopoverClose, { key: component.name, asChild: true }, /* @__PURE__ */ React15__namespace.createElement(
1281
- chunk3S4FFEHM_js.Button,
1284
+ return /* @__PURE__ */ React13__namespace.createElement(PopoverClose, { key: component.name, asChild: true }, /* @__PURE__ */ React13__namespace.createElement(
1285
+ chunkGSOMMLCG_js.Button,
1282
1286
  {
1283
1287
  variant: "ghost",
1284
1288
  className: "sb-justify-start",
@@ -1291,25 +1295,24 @@ var AddContentButton = (props) => {
1291
1295
  );
1292
1296
  }
1293
1297
  },
1294
- /* @__PURE__ */ React15__namespace.createElement(Icon, { className: "sb-mr-2 sb-h-4 sb-w-4 sb-shrink-0" }),
1298
+ /* @__PURE__ */ React13__namespace.createElement(Icon, { className: "sb-mr-2 sb-h-4 sb-w-4 sb-shrink-0" }),
1295
1299
  component.friendlyName ?? component.name
1296
1300
  ));
1297
1301
  }))));
1298
1302
  };
1299
1303
  var AddContentPlaceholder = (props) => {
1300
- return /* @__PURE__ */ React15__namespace.createElement(AddContentButton, { ...props }, /* @__PURE__ */ React15__namespace.createElement("div", { className: "sb-flex sb-justify-center sb-bg-primary/50 p-4" }, /* @__PURE__ */ React15__namespace.createElement(chunk3S4FFEHM_js.Button, { size: "sm" }, /* @__PURE__ */ React15__namespace.createElement(lucideReact.PlusIcon, { className: "sb-mr-2 sb-h-4 sb-w-4" }), "Blok Toevoegen")));
1304
+ return /* @__PURE__ */ React13__namespace.createElement(AddContentButton, { ...props }, /* @__PURE__ */ React13__namespace.createElement("div", { className: "sb-flex sb-justify-center sb-bg-primary/50 p-4" }, /* @__PURE__ */ React13__namespace.createElement(chunkGSOMMLCG_js.Button, { size: "sm" }, /* @__PURE__ */ React13__namespace.createElement(lucideReact.PlusIcon, { className: "sb-mr-2 sb-h-4 sb-w-4" }), "Blok Toevoegen")));
1301
1305
  };
1302
1306
  var AddContentDividerButton = (props) => {
1303
- return /* @__PURE__ */ React15__namespace.createElement(AddContentButton, { ...props }, /* @__PURE__ */ React15__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__ */ React15__namespace.createElement(
1304
- chunk3S4FFEHM_js.Button,
1307
+ return /* @__PURE__ */ React13__namespace.createElement(AddContentButton, { ...props }, /* @__PURE__ */ React13__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__ */ React13__namespace.createElement(
1308
+ chunkGSOMMLCG_js.Button,
1305
1309
  {
1306
1310
  size: "sm",
1307
1311
  className: "sb-absolute sb-left-1/2 sb-top-1/2 sb--translate-y-1/2 sb--translate-x-1/2 sb-shadow"
1308
1312
  },
1309
- /* @__PURE__ */ React15__namespace.createElement(lucideReact.PlusIcon, { className: "sb-mr-2 sb-h-4 sb-w-4" }),
1313
+ /* @__PURE__ */ React13__namespace.createElement(lucideReact.PlusIcon, { className: "sb-mr-2 sb-h-4 sb-w-4" }),
1310
1314
  "Blok Toevoegen"
1311
1315
  )));
1312
1316
  };
1313
1317
 
1314
- exports.BuildContainerInner = BuildContainerInner;
1315
- exports.default = build_container_client_default;
1318
+ module.exports = build_container_client_default;