@simple-builder/react 1.0.0 → 1.0.1

package/dist/{build-container-client-FBOVSG6E.mjs → build-container-client-6LLYJPDM.mjs}

@@ -1,4 +1,4 @@
-import { cn, buttonVariants, Button, useBuilder, spacing } from './chunk-KZNIT2AQ.mjs';
+import { cn, buttonVariants, Button, useBuilder, spacing } from './chunk-YHA5XZL4.mjs';
 import { builder } from './chunk-7K7IGTF3.mjs';
 import * as React15 from 'react';
 import { PlusIcon, ArrowUp, ArrowDown, Edit2Icon, AlignHorizontalSpaceAroundIcon, AlignHorizontalJustifyStartIcon, ScanIcon, CalendarIcon, Trash2Icon, ImageIcon, Loader2Icon, PaintbrushIcon, ChevronLeftIcon, ChevronRightIcon } from 'lucide-react';

package/dist/{build-container-client-JPFTBMJ3.js → build-container-client-DICNH7KJ.js}

@@ -2,7 +2,7 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var chunkTEAHH2DG_js = require('./chunk-TEAHH2DG.js');
+var chunkAAKS5YHL_js = require('./chunk-AAKS5YHL.js');
 var chunkVMHWPKU4_js = require('./chunk-VMHWPKU4.js');
 var React15 = require('react');
 var lucideReact = require('lucide-react');
@@ -56,7 +56,7 @@ var AlertDialogPortal = AlertDialogPrimitive__namespace.Portal;
 var AlertDialogOverlay = React15__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ React15__namespace.createElement(
   AlertDialogPrimitive__namespace.Overlay,
   {
-    className: chunkTEAHH2DG_js.cn(
+    className: chunkAAKS5YHL_js.cn(
       "fixed inset-0 z-50 bg-sb-background/80 backdrop-blur-sm data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0",
       className
     ),
@@ -69,7 +69,7 @@ var AlertDialogContent = React15__namespace.forwardRef(({ className, ...props },
   AlertDialogPrimitive__namespace.Content,
   {
     ref,
-    className: chunkTEAHH2DG_js.cn(
+    className: chunkAAKS5YHL_js.cn(
       "fixed left-[50%] top-[50%] z-50 grid w-full max-w-lg translate-x-[-50%] translate-y-[-50%] gap-4 border bg-sb-background p-6 shadow-lg duration-200 data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[state=closed]:slide-out-to-left-1/2 data-[state=closed]:slide-out-to-top-[48%] data-[state=open]:slide-in-from-left-1/2 data-[state=open]:slide-in-from-top-[48%] sm:rounded-lg",
       className
     ),
@@ -83,7 +83,7 @@ var AlertDialogFooter = ({
 }) => /* @__PURE__ */ React15__namespace.createElement(
   "div",
   {
-    className: chunkTEAHH2DG_js.cn(
+    className: chunkAAKS5YHL_js.cn(
       "flex flex-col-reverse sm:flex-row sm:justify-end sm:space-x-2",
       className
     ),
@@ -95,7 +95,7 @@ var AlertDialogTitle = React15__namespace.forwardRef(({ className, ...props }, r
   AlertDialogPrimitive__namespace.Title,
   {
     ref,
-    className: chunkTEAHH2DG_js.cn("text-lg font-semibold", className),
+    className: chunkAAKS5YHL_js.cn("text-lg font-semibold", className),
     ...props
   }
 ));
@@ -104,7 +104,7 @@ var AlertDialogDescription = React15__namespace.forwardRef(({ className, ...prop
   AlertDialogPrimitive__namespace.Description,
   {
     ref,
-    className: chunkTEAHH2DG_js.cn("text-sm text-sb-muted-foreground", className),
+    className: chunkAAKS5YHL_js.cn("text-sm text-sb-muted-foreground", className),
     ...props
   }
 ));
@@ -113,7 +113,7 @@ var AlertDialogAction = React15__namespace.forwardRef(({ className, ...props },
   AlertDialogPrimitive__namespace.Action,
   {
     ref,
-    className: chunkTEAHH2DG_js.cn(chunkTEAHH2DG_js.buttonVariants(), className),
+    className: chunkAAKS5YHL_js.cn(chunkAAKS5YHL_js.buttonVariants(), className),
     ...props
   }
 ));
@@ -122,8 +122,8 @@ var AlertDialogCancel = React15__namespace.forwardRef(({ className, ...props },
   AlertDialogPrimitive__namespace.Cancel,
   {
     ref,
-    className: chunkTEAHH2DG_js.cn(
-      chunkTEAHH2DG_js.buttonVariants({ variant: "outline" }),
+    className: chunkAAKS5YHL_js.cn(
+      chunkAAKS5YHL_js.buttonVariants({ variant: "outline" }),
       "mt-2 sm:mt-0",
       className
     ),
@@ -138,7 +138,7 @@ var Label = React15__namespace.forwardRef(({ className, ...props }, ref) => /* @
   LabelPrimitive__namespace.Root,
   {
     ref,
-    className: chunkTEAHH2DG_js.cn(labelVariants(), className),
+    className: chunkAAKS5YHL_js.cn(labelVariants(), className),
     ...props
   }
 ));
@@ -177,7 +177,7 @@ var FormItemContext = React15__namespace.createContext(
 );
 var FormItem = React15__namespace.forwardRef(({ className, ...props }, ref) => {
   const id = React15__namespace.useId();
-  return /* @__PURE__ */ React15__namespace.createElement(FormItemContext.Provider, { value: { id } }, /* @__PURE__ */ React15__namespace.createElement("div", { ref, className: chunkTEAHH2DG_js.cn("space-y-2", className), ...props }));
+  return /* @__PURE__ */ React15__namespace.createElement(FormItemContext.Provider, { value: { id } }, /* @__PURE__ */ React15__namespace.createElement("div", { ref, className: chunkAAKS5YHL_js.cn("space-y-2", className), ...props }));
 });
 FormItem.displayName = "FormItem";
 var FormLabel = React15__namespace.forwardRef(({ className, ...props }, ref) => {
@@ -186,7 +186,7 @@ var FormLabel = React15__namespace.forwardRef(({ className, ...props }, ref) =>
     Label,
     {
       ref,
-      className: chunkTEAHH2DG_js.cn(error && "text-sb-destructive", className),
+      className: chunkAAKS5YHL_js.cn(error && "text-sb-destructive", className),
       htmlFor: formItemId,
       ...props
     }
@@ -214,7 +214,7 @@ var FormDescription = React15__namespace.forwardRef(({ className, ...props }, re
     {
       ref,
       id: formDescriptionId,
-      className: chunkTEAHH2DG_js.cn("text-sm text-sb-muted-foreground", className),
+      className: chunkAAKS5YHL_js.cn("text-sm text-sb-muted-foreground", className),
       ...props
     }
   );
@@ -231,7 +231,7 @@ var FormMessage = React15__namespace.forwardRef(({ className, children, ...props
     {
       ref,
       id: formMessageId,
-      className: chunkTEAHH2DG_js.cn("text-sm font-medium text-sb-destructive", className),
+      className: chunkAAKS5YHL_js.cn("text-sm font-medium text-sb-destructive", className),
       ...props
     },
     body
@@ -247,7 +247,7 @@ var PopoverContent = React15__namespace.forwardRef(({ className, align = "center
     ref,
     align,
     sideOffset,
-    className: chunkTEAHH2DG_js.cn(
+    className: chunkAAKS5YHL_js.cn(
       "z-50 w-72 rounded-md border bg-sb-popover p-4 text-sb-popover-foreground shadow-md outline-none data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2",
       className
     ),
@@ -260,7 +260,7 @@ var TabsList = React15__namespace.forwardRef(({ className, ...props }, ref) => /
   TabsPrimitive__namespace.List,
   {
     ref,
-    className: chunkTEAHH2DG_js.cn("flex items-center border-b px-4 space-x-6", className),
+    className: chunkAAKS5YHL_js.cn("flex items-center border-b px-4 space-x-6", className),
     ...props
   }
 ));
@@ -269,7 +269,7 @@ var TabsTrigger = React15__namespace.forwardRef(({ className, ...props }, ref) =
   TabsPrimitive__namespace.Trigger,
   {
     ref,
-    className: chunkTEAHH2DG_js.cn(
+    className: chunkAAKS5YHL_js.cn(
       "inline-flex items-center justify-center whitespace-nowrap py-3 text-sm font-medium transition-all focus-visible:outline-none disabled:pointer-events-none disabled:opacity-50 data-[state=active]:border-black border-b-2 border-transparent data-[state=active]:text-sb-foreground text-sb-muted-sb-foreground",
       className
     ),
@@ -281,7 +281,7 @@ var TabsContent = React15__namespace.forwardRef(({ className, ...props }, ref) =
   TabsPrimitive__namespace.Content,
   {
     ref,
-    className: chunkTEAHH2DG_js.cn(
+    className: chunkAAKS5YHL_js.cn(
       "ring-offset-background focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2",
       className
     ),
@@ -374,7 +374,7 @@ var MediaInput = (props) => {
       body: JSON.stringify({ src })
     });
   };
-  return /* @__PURE__ */ React15__namespace.createElement("div", { className: chunkTEAHH2DG_js.cn("flex flex-wrap gap-4", props.className) }, sources.map((src) => /* @__PURE__ */ React15__namespace.createElement(MediaInputItem, { key: src, className: chunkTEAHH2DG_js.cn("group", props.itemClassName) }, /* @__PURE__ */ React15__namespace.createElement(
+  return /* @__PURE__ */ React15__namespace.createElement("div", { className: chunkAAKS5YHL_js.cn("flex flex-wrap gap-4", props.className) }, sources.map((src) => /* @__PURE__ */ React15__namespace.createElement(MediaInputItem, { key: src, className: chunkAAKS5YHL_js.cn("group", props.itemClassName) }, /* @__PURE__ */ React15__namespace.createElement(
     Image,
     {
       src,
@@ -393,7 +393,7 @@ var MediaInput = (props) => {
     MediaInputItem,
     {
       key: i,
-      className: chunkTEAHH2DG_js.cn(
+      className: chunkAAKS5YHL_js.cn(
         "flex h-28 w-28 items-center justify-center",
         props.itemClassName
       )
@@ -403,7 +403,7 @@ var MediaInput = (props) => {
     "label",
     {
       htmlFor: id,
-      className: chunkTEAHH2DG_js.cn(
+      className: chunkAAKS5YHL_js.cn(
         "flex h-28 w-28 cursor-pointer items-center justify-center rounded-lg border",
         props.itemClassName
       )
@@ -426,7 +426,7 @@ var MediaInputItem = (props) => {
   return /* @__PURE__ */ React15__namespace.createElement(
     "div",
     {
-      className: chunkTEAHH2DG_js.cn(
+      className: chunkAAKS5YHL_js.cn(
         "relative h-28 w-28 overflow-hidden rounded-lg border",
         props.className
       )
@@ -474,11 +474,11 @@ var BackgroundPicker = (props) => {
     return "solid";
   }, [background]);
   return /* @__PURE__ */ React15__namespace.createElement(Popover, null, /* @__PURE__ */ React15__namespace.createElement(PopoverTrigger, { asChild: true }, /* @__PURE__ */ React15__namespace.createElement(
-    chunkTEAHH2DG_js.Button,
+    chunkAAKS5YHL_js.Button,
     {
       variant: "outline",
       size: "sm",
-      className: chunkTEAHH2DG_js.cn(
+      className: chunkAAKS5YHL_js.cn(
         "justify-start text-left font-normal normal-case w-full",
         !background && "text-sb-muted-foreground",
         className
@@ -557,15 +557,15 @@ function Calendar({
     reactDayPicker.DayPicker,
     {
       showOutsideDays,
-      className: chunkTEAHH2DG_js.cn("p-3", className),
+      className: chunkAAKS5YHL_js.cn("p-3", className),
       classNames: {
         months: "flex flex-col sm:flex-row space-y-4 sm:space-x-4 sm:space-y-0",
         month: "space-y-4",
         caption: "flex justify-center pt-1 relative items-center",
         caption_label: "text-sm font-medium",
         nav: "space-x-1 flex items-center",
-        nav_button: chunkTEAHH2DG_js.cn(
-          chunkTEAHH2DG_js.buttonVariants({ variant: "outline" }),
+        nav_button: chunkAAKS5YHL_js.cn(
+          chunkAAKS5YHL_js.buttonVariants({ variant: "outline" }),
           "h-7 w-7 bg-transparent p-0 opacity-50 hover:opacity-100"
         ),
         nav_button_previous: "absolute left-1",
@@ -574,12 +574,12 @@ function Calendar({
         head_row: "flex",
         head_cell: "text-sb-muted-foreground rounded-md w-8 font-normal text-[0.8rem]",
         row: "flex w-full mt-2",
-        cell: chunkTEAHH2DG_js.cn(
+        cell: chunkAAKS5YHL_js.cn(
           "relative p-0 text-center text-sm focus-within:relative focus-within:z-20 [&:has([aria-selected])]:bg-sb-accent [&:has([aria-selected].day-outside)]:bg-sb-accent/50 [&:has([aria-selected].day-range-end)]:rounded-r-md",
           props.mode === "range" ? "[&:has(>.day-range-end)]:rounded-r-md [&:has(>.day-range-start)]:rounded-l-md first:[&:has([aria-selected])]:rounded-l-md last:[&:has([aria-selected])]:rounded-r-md" : "[&:has([aria-selected])]:rounded-md"
         ),
-        day: chunkTEAHH2DG_js.cn(
-          chunkTEAHH2DG_js.buttonVariants({ variant: "ghost" }),
+        day: chunkAAKS5YHL_js.cn(
+          chunkAAKS5YHL_js.buttonVariants({ variant: "ghost" }),
           "h-8 w-8 p-0 font-normal aria-selected:opacity-100"
         ),
         day_range_start: "day-range-start",
@@ -615,11 +615,11 @@ var ColorPicker = (props) => {
     "#FF0000"
   ];
   return /* @__PURE__ */ React15__namespace.createElement(Popover, null, /* @__PURE__ */ React15__namespace.createElement(PopoverTrigger, { asChild: true }, /* @__PURE__ */ React15__namespace.createElement(
-    chunkTEAHH2DG_js.Button,
+    chunkAAKS5YHL_js.Button,
     {
       variant: "outline",
       size: "sm",
-      className: chunkTEAHH2DG_js.cn(
+      className: chunkAAKS5YHL_js.cn(
         "justify-start text-left font-normal normal-case w-full",
         !color && "text-sb-muted-foreground",
         className
@@ -648,7 +648,7 @@ var Input = React15__namespace.forwardRef(
       "input",
       {
         type,
-        className: chunkTEAHH2DG_js.cn(
+        className: chunkAAKS5YHL_js.cn(
           "flex h-8 w-full rounded-md border border-sb-input bg-sb-background px-3 py-1 text-sm ring-offset-sb-background file:border-0 file:bg-transparent file:text-sm file:font-medium placeholder:text-sb-muted-foreground focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-sb-ring focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50",
           className
         ),
@@ -668,7 +668,7 @@ AdvancedInput.displayName = "AdvancedInput";
 var Switch = React15__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ React15__namespace.createElement(
   SwitchPrimitives__namespace.Root,
   {
-    className: chunkTEAHH2DG_js.cn(
+    className: chunkAAKS5YHL_js.cn(
       "peer inline-flex h-6 w-11 shrink-0 cursor-pointer items-center rounded-full border-2 border-transparent transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-sb-ring focus-visible:ring-offset-2 focus-visible:ring-offset-sb-background disabled:cursor-not-allowed disabled:opacity-50 data-[state=checked]:bg-sb-primary data-[state=unchecked]:bg-sb-input",
       className
     ),
@@ -678,7 +678,7 @@ var Switch = React15__namespace.forwardRef(({ className, ...props }, ref) => /*
   /* @__PURE__ */ React15__namespace.createElement(
     SwitchPrimitives__namespace.Thumb,
     {
-      className: chunkTEAHH2DG_js.cn(
+      className: chunkAAKS5YHL_js.cn(
         "pointer-events-none block h-5 w-5 rounded-full bg-sb-background shadow-lg ring-0 transition-transform data-[state=checked]:translate-x-5 data-[state=unchecked]:translate-x-0"
       )
     }
@@ -690,7 +690,7 @@ var Textarea = React15__namespace.forwardRef(
     return /* @__PURE__ */ React15__namespace.createElement(
       "textarea",
       {
-        className: chunkTEAHH2DG_js.cn(
+        className: chunkAAKS5YHL_js.cn(
           "flex min-h-[60px] w-full rounded-md border border-sb-input bg-transparent px-3 py-2 text-sm shadow-sm placeholder:text-sb-muted-foreground focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-sb-ring disabled:cursor-not-allowed disabled:opacity-50",
           className
         ),
@@ -725,7 +725,7 @@ var Toggle = React15__namespace.forwardRef(({ className, variant, size, ...props
   TogglePrimitive__namespace.Root,
   {
     ref,
-    className: chunkTEAHH2DG_js.cn(toggleVariants({ variant, size, className })),
+    className: chunkAAKS5YHL_js.cn(toggleVariants({ variant, size, className })),
     ...props
   }
 ));
@@ -734,9 +734,9 @@ Toggle.displayName = TogglePrimitive__namespace.Root.displayName;
 // src/components/container-item-toolbar.tsx
 var ContainerItemToolbar = (props) => {
   const { contentId, canBringUp = false, canBringDown = false } = props;
-  const { bringUp, bringDown } = chunkTEAHH2DG_js.useBuilder();
+  const { bringUp, bringDown } = chunkAAKS5YHL_js.useBuilder();
   return /* @__PURE__ */ React15__namespace.createElement("div", { className: "absolute z-20 top-1 right-1 rounded-md shadow flex flex-col gap-1 p-1 bg-sb-card text-sb-card-sb-foreground sb-item-toolbar opacity-0 transition-opacity" }, /* @__PURE__ */ React15__namespace.createElement("div", { className: "h-10 p-1 border border-sb-input bg-sb-background rounded-md text-sm font-medium flex gap-1 items-center justify-start" }, /* @__PURE__ */ React15__namespace.createElement(EditButton, { id: contentId }), /* @__PURE__ */ React15__namespace.createElement(
-    chunkTEAHH2DG_js.Button,
+    chunkAAKS5YHL_js.Button,
     {
       variant: "ghost",
       className: "w-8 h-8 p-0",
@@ -745,7 +745,7 @@ var ContainerItemToolbar = (props) => {
     },
     /* @__PURE__ */ React15__namespace.createElement(lucideReact.ArrowUp, { className: "h-5 w-5" })
   ), /* @__PURE__ */ React15__namespace.createElement(
-    chunkTEAHH2DG_js.Button,
+    chunkAAKS5YHL_js.Button,
     {
       variant: "ghost",
       className: "w-8 h-8 p-0",
@@ -756,7 +756,7 @@ var ContainerItemToolbar = (props) => {
   ), /* @__PURE__ */ React15__namespace.createElement(DeleteButton, { contentId })));
 };
 var EditButton = ({ id }) => {
-  return /* @__PURE__ */ React15__namespace.createElement(Popover, null, /* @__PURE__ */ React15__namespace.createElement(PopoverTrigger, { asChild: true }, /* @__PURE__ */ React15__namespace.createElement(chunkTEAHH2DG_js.Button, { variant: "ghost", className: "w-8 h-8 p-0" }, /* @__PURE__ */ React15__namespace.createElement(lucideReact.Edit2Icon, { className: "h-5 w-5" }))), /* @__PURE__ */ React15__namespace.createElement(
+  return /* @__PURE__ */ React15__namespace.createElement(Popover, null, /* @__PURE__ */ React15__namespace.createElement(PopoverTrigger, { asChild: true }, /* @__PURE__ */ React15__namespace.createElement(chunkAAKS5YHL_js.Button, { variant: "ghost", className: "w-8 h-8 p-0" }, /* @__PURE__ */ React15__namespace.createElement(lucideReact.Edit2Icon, { className: "h-5 w-5" }))), /* @__PURE__ */ React15__namespace.createElement(
     PopoverContent,
     {
       side: "left",
@@ -771,7 +771,7 @@ var EditButton = ({ id }) => {
 };
 var EditPopoverInner = (props) => {
   const { id } = props;
-  const { getItem } = chunkTEAHH2DG_js.useBuilder();
+  const { getItem } = chunkAAKS5YHL_js.useBuilder();
   const item = getItem(id);
   if (!item) {
     throw new Error(
@@ -782,7 +782,7 @@ var EditPopoverInner = (props) => {
 };
 var ContainerItemForm = (props) => {
   const { item } = props;
-  const { patchItem } = chunkTEAHH2DG_js.useBuilder();
+  const { patchItem } = chunkAAKS5YHL_js.useBuilder();
   const component = chunkVMHWPKU4_js.builder.getComponent(item.component);
   if (!component) {
     throw new Error(
@@ -840,9 +840,9 @@ var designSchema = zod.z.object({
 });
 var ItemDesignForm = (props) => {
   const { item } = props;
-  const { patchItem } = chunkTEAHH2DG_js.useBuilder();
-  const initialPadding = chunkTEAHH2DG_js.spacing.parse(item.styles?.padding ?? "");
-  const initialMargin = chunkTEAHH2DG_js.spacing.parse(item.styles?.margin ?? "");
+  const { patchItem } = chunkAAKS5YHL_js.useBuilder();
+  const initialPadding = chunkAAKS5YHL_js.spacing.parse(item.styles?.padding ?? "");
+  const initialMargin = chunkAAKS5YHL_js.spacing.parse(item.styles?.margin ?? "");
   const form = reactHookForm.useForm({
     resolver: zod$1.zodResolver(designSchema),
     defaultValues: {
@@ -850,7 +850,7 @@ var ItemDesignForm = (props) => {
       background: item.styles?.background ?? "",
       color: item.styles?.color ?? "",
       padding: {
-        indipendent: chunkTEAHH2DG_js.spacing.isIndipendent(
+        indipendent: chunkAAKS5YHL_js.spacing.isIndipendent(
           item.styles?.padding ?? ""
         ),
         horizontal: initialPadding.left,
@@ -861,7 +861,7 @@ var ItemDesignForm = (props) => {
         bottom: initialPadding.bottom
       },
       margin: {
-        indipendent: chunkTEAHH2DG_js.spacing.isIndipendent(
+        indipendent: chunkAAKS5YHL_js.spacing.isIndipendent(
           item.styles?.margin ?? ""
         ),
         horizontal: initialMargin.left,
@@ -1156,11 +1156,11 @@ var RenderInput = (props) => {
       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));
     case "date":
       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(
-        chunkTEAHH2DG_js.Button,
+        chunkAAKS5YHL_js.Button,
         {
           variant: "outline",
           size: "sm",
-          className: chunkTEAHH2DG_js.cn(
+          className: chunkAAKS5YHL_js.cn(
             "w-full flex justify-start text-left font-normal",
             !field.value && "text-muted-foreground"
           )
@@ -1199,11 +1199,11 @@ var RenderInput = (props) => {
   }
 };
 var DeleteButton = ({ contentId }) => {
-  const { deleteContent } = chunkTEAHH2DG_js.useBuilder();
-  return /* @__PURE__ */ React15__namespace.createElement(AlertDialog, null, /* @__PURE__ */ React15__namespace.createElement(AlertDialogTrigger, { asChild: true }, /* @__PURE__ */ React15__namespace.createElement(chunkTEAHH2DG_js.Button, { variant: "ghost", className: "w-8 h-8 p-0 text-sb-destructive" }, /* @__PURE__ */ React15__namespace.createElement(lucideReact.Trash2Icon, { className: "h-5 w-5" }))), /* @__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(
+  const { deleteContent } = chunkAAKS5YHL_js.useBuilder();
+  return /* @__PURE__ */ React15__namespace.createElement(AlertDialog, null, /* @__PURE__ */ React15__namespace.createElement(AlertDialogTrigger, { asChild: true }, /* @__PURE__ */ React15__namespace.createElement(chunkAAKS5YHL_js.Button, { variant: "ghost", className: "w-8 h-8 p-0 text-sb-destructive" }, /* @__PURE__ */ React15__namespace.createElement(lucideReact.Trash2Icon, { className: "h-5 w-5" }))), /* @__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(
     AlertDialogAction,
     {
-      className: chunkTEAHH2DG_js.buttonVariants({ variant: "destructive" }),
+      className: chunkAAKS5YHL_js.buttonVariants({ variant: "destructive" }),
       onClick: () => deleteContent(contentId)
     },
     "Verwijderen"
@@ -1217,7 +1217,7 @@ var DesignWrapper = (props) => {
   return /* @__PURE__ */ React15__namespace.createElement(
     "div",
     {
-      className: chunkTEAHH2DG_js.cn("relative", className),
+      className: chunkAAKS5YHL_js.cn("relative", className),
       style: { ...!src && { background }, ...rest }
     },
     src && /* @__PURE__ */ React15__namespace.createElement(
@@ -1261,11 +1261,11 @@ var BuildContainerInner = (props) => {
 var build_container_client_default = BuildContainerInner;
 var AddContentButton = (props) => {
   const components = chunkVMHWPKU4_js.builder.getComponents();
-  const { addContent } = chunkTEAHH2DG_js.useBuilder();
+  const { addContent } = chunkAAKS5YHL_js.useBuilder();
   return /* @__PURE__ */ React15__namespace.createElement(Popover, null, /* @__PURE__ */ React15__namespace.createElement(PopoverTrigger, { asChild: true }, props.children), /* @__PURE__ */ React15__namespace.createElement(PopoverContent, { className: "p-1" }, /* @__PURE__ */ React15__namespace.createElement("div", { className: "grid grid-cols-2 gap-2" }, components.map((component) => {
     const Icon = component.icon ?? lucideReact.ImageIcon;
     return /* @__PURE__ */ React15__namespace.createElement(PopoverClose, { key: component.name, asChild: true }, /* @__PURE__ */ React15__namespace.createElement(
-      chunkTEAHH2DG_js.Button,
+      chunkAAKS5YHL_js.Button,
       {
         variant: "ghost",
         className: "justify-start",
@@ -1284,11 +1284,11 @@ var AddContentButton = (props) => {
   }))));
 };
 var AddContentPlaceholder = (props) => {
-  return /* @__PURE__ */ React15__namespace.createElement(AddContentButton, { ...props }, /* @__PURE__ */ React15__namespace.createElement("div", { className: "flex justify-center bg-sb-primary/50 p-4" }, /* @__PURE__ */ React15__namespace.createElement(chunkTEAHH2DG_js.Button, { size: "sm" }, /* @__PURE__ */ React15__namespace.createElement(lucideReact.PlusIcon, { className: "mr-2 h-4 w-4" }), "Blok Toevoegen")));
+  return /* @__PURE__ */ React15__namespace.createElement(AddContentButton, { ...props }, /* @__PURE__ */ React15__namespace.createElement("div", { className: "flex justify-center bg-sb-primary/50 p-4" }, /* @__PURE__ */ React15__namespace.createElement(chunkAAKS5YHL_js.Button, { size: "sm" }, /* @__PURE__ */ React15__namespace.createElement(lucideReact.PlusIcon, { className: "mr-2 h-4 w-4" }), "Blok Toevoegen")));
 };
 var AddContentDividerButton = (props) => {
   return /* @__PURE__ */ React15__namespace.createElement(AddContentButton, { ...props }, /* @__PURE__ */ React15__namespace.createElement("div", { className: "w-full h-1 -my-[2px] bg-sb-primary relative z-20 opacity-0 add-content-divider-button transition-opacity" }, /* @__PURE__ */ React15__namespace.createElement(
-    chunkTEAHH2DG_js.Button,
+    chunkAAKS5YHL_js.Button,
     {
       size: "sm",
       className: "absolute left-1/2 top-1/2 -translate-y-1/2 -translate-x-1/2 shadow"

package/dist/{builder-content-XP2KWHHT.js → builder-content-4E6TBF6O.js}

@@ -1,7 +1,7 @@
 'use strict';
 
-var chunk4CD23J5W_js = require('./chunk-4CD23J5W.js');
-var chunkTEAHH2DG_js = require('./chunk-TEAHH2DG.js');
+var chunkW544L5I2_js = require('./chunk-W544L5I2.js');
+var chunkAAKS5YHL_js = require('./chunk-AAKS5YHL.js');
 require('./chunk-VMHWPKU4.js');
 var React2 = require('react');
 
@@ -26,17 +26,17 @@ function _interopNamespace(e) {
 var React2__namespace = /*#__PURE__*/_interopNamespace(React2);
 
 var BuilderHeader = () => {
-  const { save } = chunkTEAHH2DG_js.useBuilder();
-  return /* @__PURE__ */ React2__namespace.createElement("div", { className: "grid grid-cols-3 gap-4 items-center p-2 shadow-lg sticky inset-x-0 top-0 bg-sb-background z-30" }, /* @__PURE__ */ React2__namespace.createElement("div", { className: "flex gap-4 items-center" }, /* @__PURE__ */ React2__namespace.createElement(chunkTEAHH2DG_js.Button, { variant: "ghost", size: "sm", onClick: save }, "Opslaan")));
+  const { save } = chunkAAKS5YHL_js.useBuilder();
+  return /* @__PURE__ */ React2__namespace.createElement("div", { className: "grid grid-cols-3 gap-4 items-center p-2 shadow-lg sticky inset-x-0 top-0 bg-sb-background z-30" }, /* @__PURE__ */ React2__namespace.createElement("div", { className: "flex gap-4 items-center" }, /* @__PURE__ */ React2__namespace.createElement(chunkAAKS5YHL_js.Button, { variant: "ghost", size: "sm", onClick: save }, "Opslaan")));
 };
 
 // src/components/builder-content.tsx
 var BuilderContent = (props) => {
-  return /* @__PURE__ */ React2__namespace.createElement(chunkTEAHH2DG_js.BuilderProvider, { content: props.content }, /* @__PURE__ */ React2__namespace.createElement(BuilderContentInner, null));
+  return /* @__PURE__ */ React2__namespace.createElement(chunkAAKS5YHL_js.BuilderProvider, { content: props.content }, /* @__PURE__ */ React2__namespace.createElement(BuilderContentInner, null));
 };
 var BuilderContentInner = () => {
-  const { content } = chunkTEAHH2DG_js.useBuilder();
-  return /* @__PURE__ */ React2__namespace.createElement(React2__namespace.Fragment, null, /* @__PURE__ */ React2__namespace.createElement(BuilderHeader, null), /* @__PURE__ */ React2__namespace.createElement(chunk4CD23J5W_js.BuildContainer, { name: "root", edit: true, multiple: true, content }));
+  const { content } = chunkAAKS5YHL_js.useBuilder();
+  return /* @__PURE__ */ React2__namespace.createElement(React2__namespace.Fragment, null, /* @__PURE__ */ React2__namespace.createElement(BuilderHeader, null), /* @__PURE__ */ React2__namespace.createElement(chunkW544L5I2_js.BuildContainer, { name: "root", edit: true, multiple: true, content }));
 };
 var builder_content_default = BuilderContent;
 

package/dist/{builder-content-I65E3YF2.mjs → builder-content-DEBYN2B4.mjs}

@@ -1,5 +1,5 @@
-import { BuildContainer } from './chunk-LKNRLBTK.mjs';
-import { BuilderProvider, useBuilder, Button } from './chunk-KZNIT2AQ.mjs';
+import { BuildContainer } from './chunk-6C6XHDMD.mjs';
+import { BuilderProvider, useBuilder, Button } from './chunk-YHA5XZL4.mjs';
 import './chunk-7K7IGTF3.mjs';
 import * as React2 from 'react';
 

package/dist/{chunk-LKNRLBTK.mjs → chunk-6C6XHDMD.mjs}

@@ -2,7 +2,7 @@ import { builder } from './chunk-7K7IGTF3.mjs';
 import * as React from 'react';
 
 var BuildContainerInner = React.lazy(
-  () => import('./build-container-client-FBOVSG6E.mjs')
+  () => import('./build-container-client-6LLYJPDM.mjs')
 );
 var BuildContainer = (props) => {
   const { content, edit, name } = props;

package/dist/{chunk-TEAHH2DG.js → chunk-AAKS5YHL.js}

@@ -250,7 +250,7 @@ var findRecursive = (items, predicate, key = "content") => {
   }
 };
 var buttonVariants = classVarianceAuthority.cva(
-  "inline-flex uppercase items-center justify-center whitespace-nowrap rounded-md text-xs font-semibold ring-offset-sb-background transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-sb-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50",
+  "inline-flex uppercase font-roboto items-center justify-center whitespace-nowrap rounded-md text-xs font-semibold ring-offset-sb-background transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-sb-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50",
   {
     variants: {
       variant: {

package/dist/{chunk-4CD23J5W.js → chunk-W544L5I2.js}

@@ -24,7 +24,7 @@ function _interopNamespace(e) {
 var React__namespace = /*#__PURE__*/_interopNamespace(React);
 
 var BuildContainerInner = React__namespace.lazy(
-  () => import('./build-container-client-JPFTBMJ3.js')
+  () => import('./build-container-client-DICNH7KJ.js')
 );
 var BuildContainer = (props) => {
   const { content, edit, name } = props;

package/dist/{chunk-KZNIT2AQ.mjs → chunk-YHA5XZL4.mjs}

@@ -228,7 +228,7 @@ var findRecursive = (items, predicate, key = "content") => {
   }
 };
 var buttonVariants = cva(
-  "inline-flex uppercase items-center justify-center whitespace-nowrap rounded-md text-xs font-semibold ring-offset-sb-background transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-sb-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50",
+  "inline-flex uppercase font-roboto items-center justify-center whitespace-nowrap rounded-md text-xs font-semibold ring-offset-sb-background transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-sb-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50",
   {
     variants: {
       variant: {

package/dist/index.css

@@ -604,6 +604,9 @@
 .text-right {
   text-align: right;
 }
+.font-roboto {
+  font-family: Roboto, sans-serif;
+}
 .text-\[0\.8rem\] {
   font-size: 0.8rem;
 }
@@ -769,6 +772,72 @@
 .duration-200 {
   animation-duration: 200ms;
 }
+@font-face {
+  font-family: "Roboto";
+  src: local("Roboto"), url("./Roboto-Thin-SNTZUTYN.ttf") format("truetype");
+  font-weight: 100;
+}
+@font-face {
+  font-family: "Roboto";
+  src: local("Roboto"), url("./Roboto-ThinItalic-VWZDITN2.ttf") format("truetype");
+  font-weight: 100;
+  font-style: italic;
+}
+@font-face {
+  font-family: "Roboto";
+  src: local("Roboto"), url("./Roboto-Light-DLKQXCNL.ttf") format("truetype");
+  font-weight: 300;
+}
+@font-face {
+  font-family: "Roboto";
+  src: local("Roboto"), url("./Roboto-LightItalic-EZWBKOF2.ttf") format("truetype");
+  font-weight: 300;
+  font-style: italic;
+}
+@font-face {
+  font-family: "Roboto";
+  src: local("Roboto"), url("./Roboto-Regular-2C6IPKAZ.ttf") format("truetype");
+  font-weight: 400;
+}
+@font-face {
+  font-family: "Roboto";
+  src: local("Roboto"), url("./Roboto-Italic-P4UPYB3F.ttf") format("truetype");
+  font-weight: 400;
+  font-style: italic;
+}
+@font-face {
+  font-family: "Roboto";
+  src: local("Roboto"), url("./Roboto-Medium-SICMFKQK.ttf") format("truetype");
+  font-weight: 500;
+}
+@font-face {
+  font-family: "Roboto";
+  src: local("Roboto"), url("./Roboto-MediumItalic-X7VW5CZA.ttf") format("truetype");
+  font-weight: 500;
+  font-style: italic;
+}
+@font-face {
+  font-family: "Roboto";
+  src: local("Roboto"), url("./Roboto-Bold-YNVD7YCC.ttf") format("truetype");
+  font-weight: 700;
+}
+@font-face {
+  font-family: "Roboto";
+  src: local("Roboto"), url("./Roboto-BoldItalic-UDVRGYMT.ttf") format("truetype");
+  font-weight: 700;
+  font-style: italic;
+}
+@font-face {
+  font-family: "Roboto";
+  src: local("Roboto"), url("./Roboto-Black-N3JSMGNF.ttf") format("truetype");
+  font-weight: 900;
+}
+@font-face {
+  font-family: "Roboto";
+  src: local("Roboto"), url("./Roboto-BlackItalic-Q4DQVNXP.ttf") format("truetype");
+  font-weight: 900;
+  font-style: italic;
+}
 .add-content-divider-button:hover,
 .add-content-divider-button:has(> [data-state=open]),
 .add-content-divider-button:has(+ .sb-container-item:hover),

package/dist/index.js

@@ -1,6 +1,6 @@
 'use strict';
 
-var chunk4CD23J5W_js = require('./chunk-4CD23J5W.js');
+var chunkW544L5I2_js = require('./chunk-W544L5I2.js');
 var chunkVMHWPKU4_js = require('./chunk-VMHWPKU4.js');
 var React = require('react');
 
@@ -26,7 +26,7 @@ var React__namespace = /*#__PURE__*/_interopNamespace(React);
 
 var StaticContent = (props) => {
   return /* @__PURE__ */ React__namespace.createElement(
-    chunk4CD23J5W_js.BuildContainer,
+    chunkW544L5I2_js.BuildContainer,
     {
       name: "root",
       edit: false,
@@ -37,11 +37,11 @@ var StaticContent = (props) => {
 };
 
 // src/index.ts
-var BuilderContent = React.lazy(() => import('./builder-content-XP2KWHHT.js'));
+var BuilderContent = React.lazy(() => import('./builder-content-4E6TBF6O.js'));
 
 Object.defineProperty(exports, "BuildContainer", {
   enumerable: true,
-  get: function () { return chunk4CD23J5W_js.BuildContainer; }
+  get: function () { return chunkW544L5I2_js.BuildContainer; }
 });
 Object.defineProperty(exports, "builder", {
   enumerable: true,

package/dist/index.mjs

@@ -1,5 +1,5 @@
-import { BuildContainer } from './chunk-LKNRLBTK.mjs';
-export { BuildContainer } from './chunk-LKNRLBTK.mjs';
+import { BuildContainer } from './chunk-6C6XHDMD.mjs';
+export { BuildContainer } from './chunk-6C6XHDMD.mjs';
 export { builder } from './chunk-7K7IGTF3.mjs';
 import * as React from 'react';
 import { lazy } from 'react';
@@ -17,6 +17,6 @@ var StaticContent = (props) => {
 };
 
 // src/index.ts
-var BuilderContent = lazy(() => import('./builder-content-I65E3YF2.mjs'));
+var BuilderContent = lazy(() => import('./builder-content-DEBYN2B4.mjs'));
 
 export { BuilderContent, StaticContent };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@simple-builder/react",
-  "version": "1.0.0",
+  "version": "1.0.1",
   "private": false,
   "description": "React package for the simple builder package.",
   "repository": "https://github.com/pieter-berkel/simple-builder.git",