bloko-studio 0.0.7 → 0.0.9

package/dist/server/chunks/{_page.svelte-DHEMTmbt.js → _page.svelte-Ub7Ba9gK.js}

@@ -1,7 +1,7 @@
-import { e as ensure_array_like, b as attr, s as stringify, d as store_get, u as unsubscribe_stores, a as attr_class } from './index2-uFRsVE8P.js';
+import { e as ensure_array_like, b as attr, s as stringify, d as store_get, u as unsubscribe_stores, a as attr_class, c as bind_props } from './index2-uFRsVE8P.js';
 import { I as Input } from './TextArrayInput.svelte_svelte_type_style_lang-Ig77xHy3.js';
 import { e as escape_html } from './escaping-CqgfEcN3.js';
-import { B as Button, F as FormField } from './FormField-Bca1pP2m.js';
+import { B as Button, F as FormField } from './FormField-kISg9x93.js';
 import { D as Dropdown } from './Dropdown-hjJxTAOQ.js';
 import { L as LabeledText } from './LabeledText-Dmlq__C0.js';
 import { L as LanguageTabs } from './LanguageTabs-1Ob1qCZy.js';
@@ -9,7 +9,7 @@ import { n as notifications } from './Notification-l1T_wIgW.js';
 import { T as Textarea } from './Textarea-DLscroTm.js';
 import { i as invalidate, g as goto } from './client-BnOvIOT-.js';
 import { p as page } from './stores-DebHkzdu.js';
-import { b as deleteRelation, g as getNodesForRelation, c as createRelation, e as deleteNode, f as updateNode, h as updateContent } from './data.remote-BmWRRAbj.js';
+import { b as deleteRelation, g as getNodesForRelation, c as createRelation, e as deleteNode, f as updateNode, h as deleteImage, i as updateContent } from './data.remote-cih_Yv-0.js';
 import { d as detailedMode } from './globals.svelte-DwdZJG2V.js';
 import './utils2-2iR6NHZC.js';
 import './context-CLjmrgKK.js';
@@ -21,7 +21,7 @@ import './shared-CAxGHzOK.js';
 import './index-Djsj11qr.js';
 import './bloko-Cg3PRr44.js';
 import 'bloko';
-import './contents-wm2JkTIK.js';
+import './contents-nsgWAhd4.js';
 
 function BlockPreview($$renderer, $$props) {
   let {
@@ -81,93 +81,117 @@ function BlockPreview($$renderer, $$props) {
   }
   $$renderer.push(`<!--]--></div></div>`);
 }
-function ImagePicker($$renderer, $$props) {
+function ImageDropzone($$renderer, $$props) {
   $$renderer.component(($$renderer2) => {
     let {
-      value = null,
-      imageUrl = null,
-      images = [],
+      src = "",
       onchange,
-      disabled = false
+      disabled = false,
+      accept = "image/*",
+      actionSize = "28"
     } = $$props;
-    let showPicker = false;
-    let uploading = false;
+    let dragging = false;
+    let objectUrl = "";
     function openPicker() {
       if (disabled) return;
-      showPicker = true;
     }
     function clearImage() {
       if (disabled) return;
+      if (objectUrl) URL.revokeObjectURL(objectUrl);
+      objectUrl = "";
+      src = "";
       onchange?.(null);
     }
-    function openFilePicker() {
-    }
-    $$renderer2.push(`<div class="image-picker svelte-1cvd7ih">`);
-    if (imageUrl) {
+    $$renderer2.push(`<div${attr_class("dropzone svelte-t96qzx", void 0, { "dragging": dragging, "disabled": disabled })} role="button"${attr("tabindex", disabled ? -1 : 0)}${attr("aria-disabled", disabled)}>`);
+    if (src) {
       $$renderer2.push("<!--[-->");
-      $$renderer2.push(`<div class="preview-container svelte-1cvd7ih"><img class="preview svelte-1cvd7ih"${attr("src", imageUrl)} alt=""/> <div class="overlay svelte-1cvd7ih">`);
+      $$renderer2.push(`<img class="preview svelte-t96qzx"${attr("src", src)} alt="" aria-hidden="true" draggable="false"/> <div class="overlay svelte-t96qzx">`);
       Button($$renderer2, {
-        label: "Change",
-        size: "28",
+        label: "Replace",
+        size: actionSize,
         intent: "primary",
         onclick: openPicker,
         disabled
       });
       $$renderer2.push(`<!----> `);
       Button($$renderer2, {
-        label: "Remove",
-        size: "28",
+        label: "Delete",
+        size: actionSize,
         intent: "danger",
         onclick: clearImage,
         disabled
       });
-      $$renderer2.push(`<!----></div></div>`);
+      $$renderer2.push(`<!----></div>`);
     } else {
       $$renderer2.push("<!--[!-->");
-      $$renderer2.push(`<button class="empty-state svelte-1cvd7ih"${attr("disabled", disabled, true)} type="button"><div class="icon svelte-1cvd7ih">🖼️</div> <div class="text svelte-1cvd7ih">Select cover image</div></button>`);
-    }
-    $$renderer2.push(`<!--]--> <input type="file" accept="image/*" hidden=""/></div> `);
-    if (showPicker) {
-      $$renderer2.push("<!--[-->");
-      $$renderer2.push(`<div class="modal-backdrop svelte-1cvd7ih" role="presentation"><div class="modal svelte-1cvd7ih" role="dialog"><div class="modal-header svelte-1cvd7ih"><h3 class="svelte-1cvd7ih">Select Image</h3> <button class="close-btn svelte-1cvd7ih" type="button">×</button></div> <div class="modal-body svelte-1cvd7ih"><div class="upload-section svelte-1cvd7ih">`);
+      $$renderer2.push(`<div class="empty svelte-t96qzx"><div class="icon svelte-t96qzx">🖼️</div> <div class="text svelte-t96qzx">Drop image here or</div> `);
       Button($$renderer2, {
-        label: "Upload New Image",
-        size: "32",
+        label: "Browse",
+        size: actionSize,
         intent: "primary",
-        onclick: openFilePicker,
-        disabled: uploading
+        onclick: openPicker,
+        disabled
       });
-      $$renderer2.push(`<!----></div> `);
-      if (images.length > 0) {
-        $$renderer2.push("<!--[-->");
-        $$renderer2.push(`<div class="divider svelte-1cvd7ih"><span>or select from library</span></div> <div class="image-grid svelte-1cvd7ih"><!--[-->`);
-        const each_array = ensure_array_like(images);
-        for (let $$index = 0, $$length = each_array.length; $$index < $$length; $$index++) {
-          let image = each_array[$$index];
-          $$renderer2.push(`<button${attr_class("image-item svelte-1cvd7ih", void 0, { "selected": value === image.id })} type="button"><img${attr("src", image.url)}${attr("alt", image.file_name)} class="svelte-1cvd7ih"/> `);
-          if (value === image.id) {
-            $$renderer2.push("<!--[-->");
-            $$renderer2.push(`<div class="selected-badge svelte-1cvd7ih">✓</div>`);
-          } else {
-            $$renderer2.push("<!--[!-->");
-          }
-          $$renderer2.push(`<!--]--></button>`);
+      $$renderer2.push(`<!----></div>`);
+    }
+    $$renderer2.push(`<!--]--> <input type="file"${attr("accept", accept)} hidden=""/></div>`);
+    bind_props($$props, { src });
+  });
+}
+function MultiImageUpload($$renderer, $$props) {
+  $$renderer.component(($$renderer2) => {
+    let { images = [], onupload, ondelete, disabled = false } = $$props;
+    let uploading = false;
+    let dragging = false;
+    function openPicker() {
+      if (disabled || uploading) return;
+    }
+    $$renderer2.push(`<div${attr_class("gallery svelte-1tlyvbx", void 0, { "dragging": dragging, "disabled": disabled })} role="region" aria-label="Multi-image upload area">`);
+    if (images.length > 0) {
+      $$renderer2.push("<!--[-->");
+      $$renderer2.push(`<div class="imageGrid svelte-1tlyvbx"><!--[-->`);
+      const each_array = ensure_array_like(images);
+      for (let $$index = 0, $$length = each_array.length; $$index < $$length; $$index++) {
+        let image = each_array[$$index];
+        $$renderer2.push(`<div class="imageItem svelte-1tlyvbx"><img${attr("src", image.url)}${attr("alt", image.file_name || "")} class="svelte-1tlyvbx"/> `);
+        if (ondelete && !disabled) {
+          $$renderer2.push("<!--[-->");
+          $$renderer2.push(`<button class="deleteBtn svelte-1tlyvbx" type="button" aria-label="Remove image">×</button>`);
+        } else {
+          $$renderer2.push("<!--[!-->");
         }
         $$renderer2.push(`<!--]--></div>`);
-      } else {
-        $$renderer2.push("<!--[!-->");
-        $$renderer2.push(`<div class="no-images svelte-1cvd7ih"><p class="svelte-1cvd7ih">No images in library yet.</p> <p class="svelte-1cvd7ih">Upload your first image above.</p></div>`);
       }
-      $$renderer2.push(`<!--]--></div></div></div>`);
+      $$renderer2.push(`<!--]--></div>`);
     } else {
       $$renderer2.push("<!--[!-->");
     }
-    $$renderer2.push(`<!--]-->`);
+    $$renderer2.push(`<!--]--> <div${attr_class("uploadArea svelte-1tlyvbx", void 0, { "empty": images.length === 0 })}>`);
+    {
+      $$renderer2.push("<!--[!-->");
+      $$renderer2.push(`<div class="uploadPrompt svelte-1tlyvbx"><span class="dropText svelte-1tlyvbx">Drop images here or</span> `);
+      Button($$renderer2, {
+        label: "Browse",
+        size: "28",
+        intent: "secondary",
+        onclick: openPicker,
+        disabled
+      });
+      $$renderer2.push(`<!----></div>`);
+    }
+    $$renderer2.push(`<!--]--></div> <input type="file" accept="image/*" multiple hidden=""/></div>`);
   });
 }
 function ContentForm($$renderer, $$props) {
   $$renderer.component(($$renderer2) => {
-    let { data, block, node, contentValue } = $$props;
+    let {
+      data,
+      block,
+      node,
+      contentValue,
+      contentImageUrl = null,
+      contentImages = []
+    } = $$props;
     let editValue = contentValue || "";
     let saving = false;
     let contentExists = block.content?.id != null;
@@ -308,55 +332,128 @@ function ContentForm($$renderer, $$props) {
     function updateTitledListItem(index, field, value) {
       titledListItems[index] = { ...titledListItems[index], [field]: value };
     }
+    async function uploadImage(file) {
+      const arrayBuffer = await file.arrayBuffer();
+      const base64Data = btoa(new Uint8Array(arrayBuffer).reduce((data2, byte) => data2 + String.fromCharCode(byte), ""));
+      const response = await fetch("/api/images/upload-json", {
+        method: "POST",
+        headers: { "Content-Type": "application/json" },
+        body: JSON.stringify({
+          base64Data,
+          fileName: file.name,
+          mimeType: file.type,
+          nodeId: node.id
+        })
+      });
+      if (!response.ok) {
+        const errorData = await response.json().catch(() => ({}));
+        throw new Error(errorData.message || errorData.body?.message || "Upload failed");
+      }
+      return response.json();
+    }
+    async function onImageChange(file) {
+      if (!file) {
+        saving = true;
+        try {
+          if (contentValue) {
+            await deleteImage({ imageId: contentValue });
+          }
+          await updateContent({ _node: node.id, _block: block.id, value: null });
+          await invalidate("app:nodes");
+          notifications.success("Image removed");
+        } catch (error) {
+          console.error("Image delete error:", error);
+          notifications.error("Failed to remove image");
+        } finally {
+          saving = false;
+        }
+        return;
+      }
+      saving = true;
+      try {
+        if (contentValue) {
+          await deleteImage({ imageId: contentValue });
+        }
+        const result = await uploadImage(file);
+        await updateContent({ _node: node.id, _block: block.id, value: result.image.id });
+        await invalidate("app:nodes");
+        notifications.success("Image updated");
+      } catch (error) {
+        console.error("Image upload error:", error);
+        notifications.error(error.message || "Failed to upload image");
+      } finally {
+        saving = false;
+      }
+    }
+    async function onImageListUpload(file) {
+      saving = true;
+      try {
+        const result = await uploadImage(file);
+        const currentIds = Array.isArray(contentValue) ? contentValue : [];
+        const newIds = [...currentIds, result.image.id];
+        await updateContent({ _node: node.id, _block: block.id, value: newIds });
+        await invalidate("app:nodes");
+        notifications.success("Image added");
+      } catch (error) {
+        console.error("Image upload error:", error);
+        notifications.error(error.message || "Failed to upload image");
+        throw error;
+      } finally {
+        saving = false;
+      }
+    }
+    async function onImageListDelete(imageId) {
+      saving = true;
+      try {
+        const currentIds = Array.isArray(contentValue) ? contentValue : [];
+        const newIds = currentIds.filter((id) => id !== imageId);
+        await updateContent({ _node: node.id, _block: block.id, value: newIds });
+        await deleteImage({ imageId });
+        await invalidate("app:nodes");
+        notifications.success("Image removed");
+      } catch (error) {
+        console.error("Image delete error:", error);
+        notifications.error("Failed to remove image");
+      } finally {
+        saving = false;
+      }
+    }
     let $$settled = true;
     let $$inner_renderer;
     function $$render_inner($$renderer3) {
       $$renderer3.push(`<div class="contentFormWrapper svelte-17bp990">`);
-      if (contentExists) {
+      if (block.content_type === "image") {
         $$renderer3.push("<!--[-->");
-        $$renderer3.push(`<div class="inputWrapper svelte-17bp990">`);
-        if (block.content_type === "text") {
+        $$renderer3.push(`<div class="imageWrapper svelte-17bp990">`);
+        ImageDropzone($$renderer3, {
+          src: contentImageUrl?.url || null,
+          onchange: onImageChange,
+          disabled: saving
+        });
+        $$renderer3.push(`<!----></div>`);
+      } else {
+        $$renderer3.push("<!--[!-->");
+        if (block.content_type === "image_list") {
           $$renderer3.push("<!--[-->");
-          Input($$renderer3, {
-            id: `content-${stringify(block.id)}-${stringify(data.languageId)}`,
-            size: "32",
-            placeholder: "Enter text",
-            onblur: onBlur,
-            disabled: saving,
-            get value() {
-              return editValue;
-            },
-            set value($$value) {
-              editValue = $$value;
-              $$settled = false;
-            }
+          $$renderer3.push(`<div class="imageListWrapper svelte-17bp990">`);
+          MultiImageUpload($$renderer3, {
+            images: contentImages,
+            onupload: onImageListUpload,
+            ondelete: onImageListDelete,
+            disabled: saving
           });
+          $$renderer3.push(`<!----></div>`);
         } else {
           $$renderer3.push("<!--[!-->");
-          if (block.content_type === "paragraph") {
+          if (contentExists) {
             $$renderer3.push("<!--[-->");
-            Textarea($$renderer3, {
-              id: `content-${stringify(block.id)}-${stringify(data.languageId)}`,
-              placeholder: "Enter paragraph",
-              onblur: onBlur,
-              disabled: saving,
-              get value() {
-                return editValue;
-              },
-              set value($$value) {
-                editValue = $$value;
-                $$settled = false;
-              }
-            });
-          } else {
-            $$renderer3.push("<!--[!-->");
-            if (block.content_type === "number") {
+            $$renderer3.push(`<div class="inputWrapper svelte-17bp990">`);
+            if (block.content_type === "text") {
               $$renderer3.push("<!--[-->");
               Input($$renderer3, {
                 id: `content-${stringify(block.id)}-${stringify(data.languageId)}`,
                 size: "32",
-                type: "number",
-                placeholder: "Enter number",
+                placeholder: "Enter text",
                 onblur: onBlur,
                 disabled: saving,
                 get value() {
@@ -369,122 +466,162 @@ function ContentForm($$renderer, $$props) {
               });
             } else {
               $$renderer3.push("<!--[!-->");
-              if (block.content_type === "text_list") {
+              if (block.content_type === "paragraph") {
                 $$renderer3.push("<!--[-->");
-                $$renderer3.push(`<div class="textListWrapper svelte-17bp990"><!--[-->`);
-                const each_array = ensure_array_like(listItems);
-                for (let index = 0, $$length = each_array.length; index < $$length; index++) {
-                  let item = each_array[index];
-                  $$renderer3.push(`<div class="listItemRow svelte-17bp990">`);
-                  Input($$renderer3, {
-                    id: `content-${stringify(block.id)}-${stringify(data.languageId)}-${stringify(index)}`,
-                    size: "32",
-                    placeholder: `List item ${stringify(index + 1)}`,
-                    value: item,
-                    oninput: (e) => updateListItem(index, e.target.value),
-                    onblur: saveContent,
-                    disabled: saving
-                  });
-                  $$renderer3.push(`<!----> `);
-                  Button($$renderer3, {
-                    label: "×",
-                    intent: "danger",
-                    size: "24",
-                    type: "button",
-                    onclick: () => removeListItem(index),
-                    disabled: saving
-                  });
-                  $$renderer3.push(`<!----></div>`);
-                }
-                $$renderer3.push(`<!--]--> `);
-                Button($$renderer3, {
-                  label: "+ Add Item",
-                  intent: "secondary",
-                  size: "24",
-                  type: "button",
-                  onclick: addListItem,
-                  disabled: saving
+                Textarea($$renderer3, {
+                  id: `content-${stringify(block.id)}-${stringify(data.languageId)}`,
+                  placeholder: "Enter paragraph",
+                  onblur: onBlur,
+                  disabled: saving,
+                  get value() {
+                    return editValue;
+                  },
+                  set value($$value) {
+                    editValue = $$value;
+                    $$settled = false;
+                  }
                 });
-                $$renderer3.push(`<!----></div>`);
               } else {
                 $$renderer3.push("<!--[!-->");
-                if (block.content_type === "titled_list") {
+                if (block.content_type === "number") {
                   $$renderer3.push("<!--[-->");
-                  $$renderer3.push(`<div class="titledListWrapper svelte-17bp990"><!--[-->`);
-                  const each_array_1 = ensure_array_like(titledListItems);
-                  for (let index = 0, $$length = each_array_1.length; index < $$length; index++) {
-                    let item = each_array_1[index];
-                    $$renderer3.push(`<div class="titledListItemCard svelte-17bp990"><div class="titledListItemHeader svelte-17bp990"><span class="itemNumber svelte-17bp990">${escape_html(index + 1)}</span> `);
+                  Input($$renderer3, {
+                    id: `content-${stringify(block.id)}-${stringify(data.languageId)}`,
+                    size: "32",
+                    type: "number",
+                    placeholder: "Enter number",
+                    onblur: onBlur,
+                    disabled: saving,
+                    get value() {
+                      return editValue;
+                    },
+                    set value($$value) {
+                      editValue = $$value;
+                      $$settled = false;
+                    }
+                  });
+                } else {
+                  $$renderer3.push("<!--[!-->");
+                  if (block.content_type === "text_list") {
+                    $$renderer3.push("<!--[-->");
+                    $$renderer3.push(`<div class="textListWrapper svelte-17bp990"><!--[-->`);
+                    const each_array = ensure_array_like(listItems);
+                    for (let index = 0, $$length = each_array.length; index < $$length; index++) {
+                      let item = each_array[index];
+                      $$renderer3.push(`<div class="listItemRow svelte-17bp990">`);
+                      Input($$renderer3, {
+                        id: `content-${stringify(block.id)}-${stringify(data.languageId)}-${stringify(index)}`,
+                        size: "32",
+                        placeholder: `List item ${stringify(index + 1)}`,
+                        value: item,
+                        oninput: (e) => updateListItem(index, e.target.value),
+                        onblur: saveContent,
+                        disabled: saving
+                      });
+                      $$renderer3.push(`<!----> `);
+                      Button($$renderer3, {
+                        label: "×",
+                        intent: "danger",
+                        size: "24",
+                        type: "button",
+                        onclick: () => removeListItem(index),
+                        disabled: saving
+                      });
+                      $$renderer3.push(`<!----></div>`);
+                    }
+                    $$renderer3.push(`<!--]--> `);
                     Button($$renderer3, {
-                      label: "×",
-                      intent: "danger",
+                      label: "+ Add Item",
+                      intent: "secondary",
                       size: "24",
                       type: "button",
-                      onclick: () => removeTitledListItem(index),
-                      disabled: saving
-                    });
-                    $$renderer3.push(`<!----></div> <div class="titledListItemFields svelte-17bp990">`);
-                    Input($$renderer3, {
-                      id: `content-${stringify(block.id)}-${stringify(data.languageId)}-${stringify(index)}-title`,
-                      size: "32",
-                      placeholder: "Title",
-                      value: item?.title || "",
-                      oninput: (e) => updateTitledListItem(index, "title", e.target.value),
-                      onblur: saveContent,
-                      disabled: saving
-                    });
-                    $$renderer3.push(`<!----> `);
-                    Textarea($$renderer3, {
-                      id: `content-${stringify(block.id)}-${stringify(data.languageId)}-${stringify(index)}-text`,
-                      placeholder: "Text",
-                      value: item?.text || "",
-                      oninput: (e) => updateTitledListItem(index, "text", e.target.value),
-                      onblur: saveContent,
+                      onclick: addListItem,
                       disabled: saving
                     });
-                    $$renderer3.push(`<!----></div></div>`);
+                    $$renderer3.push(`<!----></div>`);
+                  } else {
+                    $$renderer3.push("<!--[!-->");
+                    if (block.content_type === "titled_list") {
+                      $$renderer3.push("<!--[-->");
+                      $$renderer3.push(`<div class="titledListWrapper svelte-17bp990"><!--[-->`);
+                      const each_array_1 = ensure_array_like(titledListItems);
+                      for (let index = 0, $$length = each_array_1.length; index < $$length; index++) {
+                        let item = each_array_1[index];
+                        $$renderer3.push(`<div class="titledListItemCard svelte-17bp990"><div class="titledListItemHeader svelte-17bp990"><span class="itemNumber svelte-17bp990">${escape_html(index + 1)}</span> `);
+                        Button($$renderer3, {
+                          label: "×",
+                          intent: "danger",
+                          size: "24",
+                          type: "button",
+                          onclick: () => removeTitledListItem(index),
+                          disabled: saving
+                        });
+                        $$renderer3.push(`<!----></div> <div class="titledListItemFields svelte-17bp990">`);
+                        Input($$renderer3, {
+                          id: `content-${stringify(block.id)}-${stringify(data.languageId)}-${stringify(index)}-title`,
+                          size: "32",
+                          placeholder: "Title",
+                          value: item?.title || "",
+                          oninput: (e) => updateTitledListItem(index, "title", e.target.value),
+                          onblur: saveContent,
+                          disabled: saving
+                        });
+                        $$renderer3.push(`<!----> `);
+                        Textarea($$renderer3, {
+                          id: `content-${stringify(block.id)}-${stringify(data.languageId)}-${stringify(index)}-text`,
+                          placeholder: "Text",
+                          value: item?.text || "",
+                          oninput: (e) => updateTitledListItem(index, "text", e.target.value),
+                          onblur: saveContent,
+                          disabled: saving
+                        });
+                        $$renderer3.push(`<!----></div></div>`);
+                      }
+                      $$renderer3.push(`<!--]--> `);
+                      Button($$renderer3, {
+                        label: "+ Add Item",
+                        intent: "secondary",
+                        size: "24",
+                        type: "button",
+                        onclick: addTitledListItem,
+                        disabled: saving
+                      });
+                      $$renderer3.push(`<!----></div>`);
+                    } else {
+                      $$renderer3.push("<!--[!-->");
+                    }
+                    $$renderer3.push(`<!--]-->`);
                   }
-                  $$renderer3.push(`<!--]--> `);
-                  Button($$renderer3, {
-                    label: "+ Add Item",
-                    intent: "secondary",
-                    size: "24",
-                    type: "button",
-                    onclick: addTitledListItem,
-                    disabled: saving
-                  });
-                  $$renderer3.push(`<!----></div>`);
-                } else {
-                  $$renderer3.push("<!--[!-->");
+                  $$renderer3.push(`<!--]-->`);
                 }
                 $$renderer3.push(`<!--]-->`);
               }
               $$renderer3.push(`<!--]-->`);
             }
-            $$renderer3.push(`<!--]-->`);
+            $$renderer3.push(`<!--]--></div> `);
+            Button($$renderer3, {
+              label: "D",
+              intent: "danger",
+              size: "24",
+              type: "button",
+              onclick: onDelete,
+              disabled: saving
+            });
+            $$renderer3.push(`<!---->`);
+          } else {
+            $$renderer3.push("<!--[!-->");
+            Button($$renderer3, {
+              label: "Create Content",
+              intent: "secondary",
+              size: "24",
+              type: "button",
+              onclick: onCreate,
+              disabled: saving
+            });
           }
           $$renderer3.push(`<!--]-->`);
         }
-        $$renderer3.push(`<!--]--></div> `);
-        Button($$renderer3, {
-          label: "D",
-          intent: "danger",
-          size: "24",
-          type: "button",
-          onclick: onDelete,
-          disabled: saving
-        });
-        $$renderer3.push(`<!---->`);
-      } else {
-        $$renderer3.push("<!--[!-->");
-        Button($$renderer3, {
-          label: "Create Content",
-          intent: "secondary",
-          size: "24",
-          type: "button",
-          onclick: onCreate,
-          disabled: saving
-        });
+        $$renderer3.push(`<!--]-->`);
       }
       $$renderer3.push(`<!--]--></div>`);
     }
@@ -874,6 +1011,7 @@ function NodeForm($$renderer, $$props) {
     let coverImageUrl = data.coverImageUrl || null;
     let saving = false;
     let deleting = false;
+    let uploadingImage = false;
     let editTitle = { ...node?.title || {} };
     let editSubtitle = { ...node?.subtitle || {} };
     let editSlug = { ...node?.slug || {} };
@@ -887,29 +1025,106 @@ function NodeForm($$renderer, $$props) {
       return intents;
     })();
     node?.id;
-    async function onCoverImageChange(imageId) {
+    async function onCoverImageChange(file) {
       if (!node) return;
-      editCoverImage = imageId;
-      if (imageId) {
-        const img = data.images?.find((i) => i.id === imageId);
-        coverImageUrl = img?.url || null;
+      if (file) {
+        uploadingImage = true;
+        try {
+          const arrayBuffer = await file.arrayBuffer();
+          const base64Data = btoa(new Uint8Array(arrayBuffer).reduce((data2, byte) => data2 + String.fromCharCode(byte), ""));
+          const response = await fetch("/api/images/upload-json", {
+            method: "POST",
+            headers: { "Content-Type": "application/json" },
+            body: JSON.stringify({
+              base64Data,
+              fileName: file.name,
+              mimeType: file.type,
+              nodeId: node.id
+            })
+          });
+          if (!response.ok) {
+            throw new Error(await response.text() || "Upload failed");
+          }
+          const result = await response.json();
+          if (editCoverImage) {
+            try {
+              await deleteImage({ imageId: editCoverImage });
+            } catch (e) {
+            }
+          }
+          editCoverImage = result.image.id;
+          await updateNode({ id: node.id, _cover_image: result.image.id });
+          await invalidate("app:nodes");
+          notifications.success("Cover image uploaded");
+        } catch (error) {
+          console.error("Upload error:", error);
+          notifications.error("Failed to upload image");
+        } finally {
+          uploadingImage = false;
+        }
       } else {
-        coverImageUrl = null;
+        if (!editCoverImage) return;
+        saving = true;
+        try {
+          const imageIdToDelete = editCoverImage;
+          editCoverImage = null;
+          coverImageUrl = null;
+          await updateNode({ id: node.id, _cover_image: null });
+          await deleteImage({ imageId: imageIdToDelete });
+          await invalidate("app:nodes");
+          notifications.success("Cover image deleted");
+        } catch (error) {
+          console.error("Delete error:", error);
+          notifications.error("Failed to delete image");
+          editCoverImage = node._cover_image || null;
+          coverImageUrl = data.coverImageUrl || null;
+        } finally {
+          saving = false;
+        }
       }
-      saving = true;
+    }
+    async function onGalleryUpload(file) {
+      if (!node) return;
       try {
-        await updateNode({ id: node.id, _cover_image: imageId });
+        const arrayBuffer = await file.arrayBuffer();
+        const base64Data = btoa(new Uint8Array(arrayBuffer).reduce((data2, byte) => data2 + String.fromCharCode(byte), ""));
+        const response = await fetch("/api/images/upload-json", {
+          method: "POST",
+          headers: { "Content-Type": "application/json" },
+          body: JSON.stringify({
+            base64Data,
+            fileName: file.name,
+            mimeType: file.type,
+            nodeId: node.id
+          })
+        });
+        if (!response.ok) {
+          const errorData = await response.json().catch(() => ({}));
+          const errorMsg = errorData.message || errorData.body?.message || "Upload failed";
+          throw new Error(errorMsg);
+        }
+        const result = await response.json();
+        const newImage = result.image;
+        const currentImages = node._images || [];
+        const newImagesArray = [...currentImages, newImage.id];
+        await updateNode({ id: node.id, _images: newImagesArray });
         await invalidate("app:nodes");
-        notifications.success("Cover image updated");
+        notifications.success("Image added");
       } catch (error) {
-        console.error("Save error:", error);
-        notifications.error("Failed to update cover image");
-        editCoverImage = node._cover_image || null;
-        coverImageUrl = data.coverImageUrl || null;
-      } finally {
-        saving = false;
+        console.error("Gallery upload error:", error);
+        notifications.error(error.message || "Failed to upload image");
+        throw error;
       }
     }
+    async function onGalleryDelete(imageId) {
+      if (!node) return;
+      const currentImages = node._images || [];
+      const newImagesArray = currentImages.filter((id) => id !== imageId);
+      await updateNode({ id: node.id, _images: newImagesArray });
+      await deleteImage({ imageId });
+      await invalidate();
+      notifications.success("Image removed");
+    }
     async function onBlur() {
       if (!node) return;
       const code = editCode.trim();
@@ -1005,7 +1220,9 @@ function NodeForm($$renderer, $$props) {
               data,
               block,
               node,
-              contentValue: block.content_type === "number" ? block.content?.value ?? "" : block.content?.value?.[data.languageId] || ""
+              contentValue: block.content_type === "number" || block.content_type === "image" || block.content_type === "image_list" ? block.content?.value ?? (block.content_type === "image_list" ? [] : "") : block.content?.value?.[data.languageId] || "",
+              contentImageUrl: block.content_type === "image" ? data.contentImageUrls?.[block.id] : null,
+              contentImages: block.content_type === "image_list" ? data.contentImageUrls?.[block.id] || [] : []
             });
           } else {
             $$renderer4.push("<!--[!-->");
@@ -1155,20 +1372,32 @@ function NodeForm($$renderer, $$props) {
         };
         FormField($$renderer3, { label: "Template", children });
       }
-      $$renderer3.push(`<!----></div> `);
+      $$renderer3.push(`<!----></div> <div class="imagesRow svelte-15y8zm1">`);
       {
         let children = function($$renderer4) {
-          ImagePicker($$renderer4, {
-            value: editCoverImage,
-            imageUrl: coverImageUrl,
-            images: data.images || [],
+          $$renderer4.push(`<div class="coverImageWrapper svelte-15y8zm1">`);
+          ImageDropzone($$renderer4, {
+            src: coverImageUrl,
             onchange: onCoverImageChange,
+            disabled: saving || uploadingImage
+          });
+          $$renderer4.push(`<!----></div>`);
+        };
+        FormField($$renderer3, { label: "Cover", children });
+      }
+      $$renderer3.push(`<!----> `);
+      {
+        let children = function($$renderer4) {
+          MultiImageUpload($$renderer4, {
+            images: data.galleryImages || [],
+            onupload: onGalleryUpload,
+            ondelete: onGalleryDelete,
             disabled: saving
           });
         };
-        FormField($$renderer3, { label: "Cover Image", children });
+        FormField($$renderer3, { label: "Gallery", children });
       }
-      $$renderer3.push(`<!----> <hr class="svelte-15y8zm1"/> `);
+      $$renderer3.push(`<!----></div> <hr class="svelte-15y8zm1"/> `);
       LanguageTabs($$renderer3, {
         languages: data.languages,
         activeLanguage: data.languageId,
@@ -1279,4 +1508,4 @@ function _page($$renderer, $$props) {
 }
 
 export { _page as default };
-//# sourceMappingURL=_page.svelte-DHEMTmbt.js.map
+//# sourceMappingURL=_page.svelte-Ub7Ba9gK.js.map