@dalgoridim/headless-cms 0.1.0

package/dist/client/index.js

@@ -0,0 +1,994 @@
+"use client";
+var __defProp = Object.defineProperty;
+var __defProps = Object.defineProperties;
+var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
+var __getOwnPropSymbols = Object.getOwnPropertySymbols;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __propIsEnum = Object.prototype.propertyIsEnumerable;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues = (a, b) => {
+  for (var prop in b || (b = {}))
+    if (__hasOwnProp.call(b, prop))
+      __defNormalProp(a, prop, b[prop]);
+  if (__getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(b)) {
+      if (__propIsEnum.call(b, prop))
+        __defNormalProp(a, prop, b[prop]);
+    }
+  return a;
+};
+var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
+
+// src/client/PageProvider.tsx
+import {
+  createContext,
+  useContext,
+  useState,
+  useCallback
+} from "react";
+import { toast } from "sonner";
+import { jsx } from "react/jsx-runtime";
+var defaultNotifier = {
+  success: (m) => toast.success(m),
+  error: (m) => toast.error(m)
+};
+var PageContext = createContext(void 0);
+var dirtyKey = (collection, sectionKey) => `${collection}:${sectionKey}`;
+var PageProvider = ({
+  children,
+  initialSections = {},
+  apiBasePath = "/api/admin",
+  storage,
+  notify = defaultNotifier
+}) => {
+  const [saving, setSaving] = useState(false);
+  const [sections, setSections] = useState(initialSections);
+  const [pendingImages, setPendingImages] = useState([]);
+  const [dirtySections, setDirtySections] = useState(/* @__PURE__ */ new Set());
+  const hasUnsavedChanges = dirtySections.size > 0;
+  const resolveImageUrl = useCallback(
+    async (img) => {
+      if (img.isExternal) return img.localUrl;
+      if (!storage) {
+        throw new Error(
+          "PageProvider received a file upload but no `storage` adapter was provided."
+        );
+      }
+      const { url } = await storage.upload(img.file);
+      return url;
+    },
+    [storage]
+  );
+  const setSection = useCallback(
+    (collection, key, section) => {
+      setSections((prev) => __spreadProps(__spreadValues({}, prev), {
+        [collection]: __spreadProps(__spreadValues({}, prev[collection]), { [key]: section })
+      }));
+    },
+    []
+  );
+  const editField = useCallback(
+    (collection, sectionKey, fieldKey, value) => {
+      setSections((prev) => {
+        var _a;
+        const currentSection = (_a = prev[collection]) == null ? void 0 : _a[sectionKey];
+        if (!currentSection) {
+          console.error(`Section not found: ${collection}/${sectionKey}`);
+          return prev;
+        }
+        const keys = fieldKey.split(".");
+        const updated = __spreadValues({}, currentSection);
+        if (keys.length === 1) {
+          updated[fieldKey] = value;
+        } else {
+          let current = updated;
+          for (let i = 0; i < keys.length - 1; i++) {
+            if (!current[keys[i]]) current[keys[i]] = {};
+            current[keys[i]] = __spreadValues({}, current[keys[i]]);
+            current = current[keys[i]];
+          }
+          current[keys[keys.length - 1]] = value;
+        }
+        return __spreadProps(__spreadValues({}, prev), {
+          [collection]: __spreadProps(__spreadValues({}, prev[collection]), { [sectionKey]: updated })
+        });
+      });
+      setDirtySections((prev) => {
+        const next = new Set(prev);
+        next.add(dirtyKey(collection, sectionKey));
+        return next;
+      });
+    },
+    []
+  );
+  const setPendingImage = useCallback((image) => {
+    setPendingImages((prev) => [
+      ...prev.filter(
+        (img) => !(img.collection === image.collection && img.sectionKey === image.sectionKey && img.fieldKey === image.fieldKey)
+      ),
+      image
+    ]);
+    setDirtySections((prev) => {
+      const next = new Set(prev);
+      next.add(dirtyKey(image.collection, image.sectionKey));
+      return next;
+    });
+  }, []);
+  const persist = useCallback(
+    async (section) => {
+      const response = await fetch(
+        `${apiBasePath}/${section.collection}/${section.id}`,
+        {
+          method: "PATCH",
+          headers: { "Content-Type": "application/json" },
+          body: JSON.stringify(section)
+        }
+      );
+      if (!response.ok) throw new Error("Failed to save section");
+    },
+    [apiBasePath]
+  );
+  const saveSection = useCallback(
+    async (collection, sectionKey) => {
+      var _a;
+      if (saving) return;
+      setSaving(true);
+      try {
+        const section = (_a = sections[collection]) == null ? void 0 : _a[sectionKey];
+        if (!(section == null ? void 0 : section.id) || !(section == null ? void 0 : section.collection)) {
+          console.error(`Invalid section: ${collection}/${sectionKey}`);
+          setSaving(false);
+          return;
+        }
+        const images = pendingImages.filter(
+          (img) => img.collection === collection && img.sectionKey === sectionKey
+        );
+        let updatedSection = __spreadValues({}, section);
+        for (const img of images) {
+          const url = await resolveImageUrl(img);
+          const keys = img.fieldKey.split(".");
+          if (keys.length === 1) {
+            updatedSection = __spreadProps(__spreadValues({}, updatedSection), { [img.fieldKey]: url });
+          } else {
+            let current = updatedSection;
+            for (let i = 0; i < keys.length - 1; i++) {
+              if (!current[keys[i]]) current[keys[i]] = {};
+              current = current[keys[i]];
+            }
+            current[keys[keys.length - 1]] = url;
+          }
+        }
+        await persist(updatedSection);
+        setSections((prev) => __spreadProps(__spreadValues({}, prev), {
+          [collection]: __spreadProps(__spreadValues({}, prev[collection]), { [sectionKey]: updatedSection })
+        }));
+        setPendingImages(
+          (prev) => prev.filter(
+            (img) => !(img.collection === collection && img.sectionKey === sectionKey)
+          )
+        );
+        setDirtySections((prev) => {
+          const next = new Set(prev);
+          next.delete(dirtyKey(collection, sectionKey));
+          return next;
+        });
+        notify.success("Changes saved successfully!");
+      } catch (error) {
+        console.error("Save failed:", error);
+        notify.error("Failed to save changes");
+      } finally {
+        setSaving(false);
+      }
+    },
+    [sections, pendingImages, saving, resolveImageUrl, persist, notify]
+  );
+  const saveAll = useCallback(async () => {
+    var _a;
+    if (saving || dirtySections.size === 0) return;
+    setSaving(true);
+    try {
+      const updatedSections = __spreadValues({}, sections);
+      for (const img of pendingImages) {
+        const url = await resolveImageUrl(img);
+        if (!updatedSections[img.collection])
+          updatedSections[img.collection] = {};
+        if (!updatedSections[img.collection][img.sectionKey]) {
+          updatedSections[img.collection][img.sectionKey] = {
+            id: img.docId,
+            collection: img.collection
+          };
+        }
+        const keys = img.fieldKey.split(".");
+        let current = updatedSections[img.collection][img.sectionKey];
+        if (keys.length === 1) {
+          updatedSections[img.collection][img.sectionKey] = __spreadProps(__spreadValues({}, current), {
+            [img.fieldKey]: url
+          });
+        } else {
+          for (let i = 0; i < keys.length - 1; i++) {
+            if (!current[keys[i]]) current[keys[i]] = {};
+            current = current[keys[i]];
+          }
+          current[keys[keys.length - 1]] = url;
+        }
+      }
+      for (const entry of dirtySections) {
+        const [collection, key] = entry.split(":");
+        const section = (_a = updatedSections[collection]) == null ? void 0 : _a[key];
+        if (!(section == null ? void 0 : section.id) || !(section == null ? void 0 : section.collection)) {
+          console.error(`Invalid section for save: ${entry}`);
+          continue;
+        }
+        await persist(section);
+      }
+      setSections(updatedSections);
+      setPendingImages([]);
+      setDirtySections(/* @__PURE__ */ new Set());
+      notify.success("All changes saved successfully!");
+    } catch (error) {
+      console.error("Save all failed:", error);
+      notify.error("Failed to save changes");
+    } finally {
+      setSaving(false);
+    }
+  }, [sections, pendingImages, dirtySections, saving, resolveImageUrl, persist, notify]);
+  return /* @__PURE__ */ jsx(
+    PageContext.Provider,
+    {
+      value: {
+        sections,
+        hasUnsavedChanges,
+        pendingImages,
+        saving,
+        setSection,
+        editField,
+        setPendingImage,
+        saveSection,
+        saveAll
+      },
+      children
+    }
+  );
+};
+var usePageContext = () => {
+  const context = useContext(PageContext);
+  if (!context)
+    throw new Error("usePageContext must be used within a PageProvider");
+  return context;
+};
+
+// src/client/auth.tsx
+import { createContext as createContext2, useContext as useContext2 } from "react";
+import { jsx as jsx2 } from "react/jsx-runtime";
+var CmsAuthContext = createContext2(void 0);
+function useCmsAuth() {
+  const ctx = useContext2(CmsAuthContext);
+  if (!ctx) {
+    throw new Error(
+      "useCmsAuth must be used within a CmsAuthProvider (or a built-in auth provider such as FirebaseAuthProvider)."
+    );
+  }
+  return ctx;
+}
+function CmsAuthProvider({
+  value,
+  children
+}) {
+  return /* @__PURE__ */ jsx2(CmsAuthContext.Provider, { value, children });
+}
+
+// src/client/ContentEditSpan.tsx
+import { useRef, useEffect, useState as useState2, useCallback as useCallback2 } from "react";
+
+// src/client/utils.ts
+import { clsx } from "clsx";
+import { twMerge } from "tailwind-merge";
+function cn(...inputs) {
+  return twMerge(clsx(inputs));
+}
+
+// src/client/ContentEditSpan.tsx
+import { Fragment, jsx as jsx3 } from "react/jsx-runtime";
+var PATTERNS = [
+  { regex: /^\*\*(.+?)\*\*/, mark: "bold" },
+  { regex: /^\*(.+?)\*/, mark: "italic" },
+  { regex: /^~~br~~/, mark: "break" },
+  { regex: /^~~(.+?)~~/, mark: "strike" },
+  { regex: /^\^\^(.+?)\^\^/, mark: "primary" },
+  { regex: /^__(.+?)__/, mark: "underline" },
+  {
+    regex: /^\[(.+?)\]\((https?:\/\/[^\s)]+)\)/,
+    mark: "link",
+    isLink: true
+  }
+];
+function parseSpecialString(input) {
+  const out = [];
+  let text = input;
+  while (text.length) {
+    let matched = false;
+    for (const p of PATTERNS) {
+      const m = p.regex.exec(text);
+      if (!m) continue;
+      matched = true;
+      if (p.mark === "break") {
+        out.push({ text: "\n", break: true });
+      } else if ("isLink" in p) {
+        out.push({ text: m[1], link: m[2] });
+      } else {
+        const inner = parseSpecialString(m[1]);
+        inner.forEach(
+          (n) => n[p.mark] = true
+        );
+        out.push(...inner);
+      }
+      text = text.slice(m[0].length);
+      break;
+    }
+    if (!matched) {
+      out.push({ text: text[0] });
+      text = text.slice(1);
+    }
+  }
+  return out;
+}
+function RenderStatic({
+  raw,
+  as: Component = "span",
+  className
+}) {
+  const nodes = parseSpecialString(raw);
+  const content = /* @__PURE__ */ jsx3(Fragment, { children: nodes.map((l, i) => {
+    if (l.break) return /* @__PURE__ */ jsx3("br", {}, i);
+    let el = l.text;
+    if (l.bold) el = /* @__PURE__ */ jsx3("strong", { children: el });
+    if (l.italic) el = /* @__PURE__ */ jsx3("em", { children: el });
+    if (l.strike) el = /* @__PURE__ */ jsx3("s", { children: el });
+    if (l.primary || l.underline) {
+      el = /* @__PURE__ */ jsx3(
+        "span",
+        {
+          style: {
+            color: l.primary ? "var(--color-primary)" : void 0,
+            textDecoration: l.underline ? "underline" : void 0
+          },
+          children: el
+        }
+      );
+    }
+    if (l.link) {
+      el = /* @__PURE__ */ jsx3(
+        "a",
+        {
+          href: l.link,
+          target: "_blank",
+          rel: "noopener noreferrer",
+          className: "inline hover:underline",
+          children: el
+        }
+      );
+    }
+    return /* @__PURE__ */ jsx3("span", { children: el }, i);
+  }) });
+  return /* @__PURE__ */ jsx3(Component, { className, children: content });
+}
+function getNestedValue(obj, path) {
+  const keys = path.split(".");
+  let current = obj;
+  for (const key of keys) {
+    if (current == null || current[key] === void 0)
+      return void 0;
+    current = current[key];
+  }
+  return current;
+}
+function ContentEditSpan({
+  collection = "portfolio",
+  sectionKey,
+  fieldKey,
+  className,
+  children,
+  as = "span"
+}) {
+  var _a, _b;
+  const { sections, editField } = usePageContext();
+  const { isEditing } = useCmsAuth();
+  const section = (_a = sections[collection]) == null ? void 0 : _a[sectionKey];
+  const raw = (_b = getNestedValue(section, fieldKey)) != null ? _b : typeof children === "string" ? children : "";
+  if (!isEditing) {
+    return /* @__PURE__ */ jsx3(RenderStatic, { raw, as, className });
+  }
+  return /* @__PURE__ */ jsx3(
+    EditableContentSpan,
+    {
+      collection,
+      sectionKey,
+      fieldKey,
+      className,
+      raw,
+      editField,
+      as
+    }
+  );
+}
+function EditableContentSpan({
+  collection = "portfolio",
+  sectionKey,
+  fieldKey,
+  className,
+  raw,
+  editField,
+  as: Component = "span"
+}) {
+  const { isEditing } = useCmsAuth();
+  const [isFocused, setIsFocused] = useState2(false);
+  const [editValue, setEditValue] = useState2(raw);
+  const contentRef = useRef(null);
+  const rawRef = useRef(raw);
+  useEffect(() => {
+    if (!isFocused && rawRef.current !== raw) {
+      rawRef.current = raw;
+    }
+  }, [raw, isFocused]);
+  useEffect(() => {
+    if (!isFocused && rawRef.current !== editValue) {
+      setEditValue(rawRef.current);
+    }
+  }, [isFocused, editValue]);
+  const handleInput = useCallback2(() => {
+    if (contentRef.current) {
+      setEditValue(contentRef.current.textContent || "");
+    }
+  }, []);
+  const handleBlur = useCallback2(() => {
+    setIsFocused(false);
+    if (editValue !== raw) {
+      editField(collection, sectionKey, fieldKey, editValue);
+    }
+  }, [editValue, raw, collection, sectionKey, fieldKey, editField]);
+  const handleFocus = useCallback2(() => {
+    setIsFocused(true);
+    if (contentRef.current) {
+      contentRef.current.textContent = editValue;
+      setTimeout(() => {
+        if (contentRef.current) {
+          const range = document.createRange();
+          const sel = window.getSelection();
+          range.selectNodeContents(contentRef.current);
+          range.collapse(false);
+          sel == null ? void 0 : sel.removeAllRanges();
+          sel == null ? void 0 : sel.addRange(range);
+        }
+      }, 0);
+    }
+  }, [editValue]);
+  return /* @__PURE__ */ jsx3(
+    Component,
+    {
+      ref: contentRef,
+      className: cn(
+        className,
+        "outline-none transition-all duration-200",
+        "whitespace-pre-wrap break-words overflow-wrap-anywhere",
+        isFocused && "ring-2 ring-primary/50 ring-offset-2 ring-offset-neutral-900 rounded-sm px-2",
+        !isFocused && isEditing && "hover:ring-1 hover:ring-primary/30 hover:ring-offset-1 hover:ring-offset-neutral-900 hover:rounded-sm hover:px-2 cursor-text"
+      ),
+      contentEditable: isEditing,
+      suppressContentEditableWarning: true,
+      onInput: handleInput,
+      onBlur: handleBlur,
+      onFocus: handleFocus,
+      children: !isFocused && /* @__PURE__ */ jsx3(RenderStatic, { raw: editValue, as: "span" })
+    },
+    isFocused ? "editing" : "static"
+  );
+}
+
+// src/client/EditableImage.tsx
+import { useRef as useRef2, useState as useState3 } from "react";
+import { createPortal } from "react-dom";
+import { CameraIcon, Link2Icon, XIcon, CheckIcon } from "lucide-react";
+import { Fragment as Fragment2, jsx as jsx4, jsxs } from "react/jsx-runtime";
+function EditableImage({
+  sectionKey,
+  fieldKey,
+  src,
+  collection,
+  docId,
+  className
+}) {
+  const { isEditing } = useCmsAuth();
+  const { editField, setPendingImage, pendingImages, saving } = usePageContext();
+  const [preview, setPreview] = useState3(src);
+  const [hasError, setHasError] = useState3(false);
+  const [showUrlModal, setShowUrlModal] = useState3(false);
+  const [urlInput, setUrlInput] = useState3("");
+  const [urlPreview, setUrlPreview] = useState3("");
+  const inputRef = useRef2(null);
+  const pendingImage = pendingImages.find(
+    (img) => img.sectionKey === sectionKey && img.fieldKey === fieldKey
+  );
+  const imgSrc = (pendingImage == null ? void 0 : pendingImage.localUrl) || preview;
+  const handleFileChange = (e) => {
+    var _a;
+    if (saving) return;
+    const file = (_a = e.target.files) == null ? void 0 : _a[0];
+    if (!file) return;
+    const localUrl = URL.createObjectURL(file);
+    setPreview(localUrl);
+    setHasError(false);
+    editField(collection, sectionKey, fieldKey, localUrl);
+    setPendingImage({
+      file,
+      localUrl,
+      sectionKey,
+      fieldKey,
+      collection,
+      docId,
+      isExternal: false
+    });
+  };
+  const handleUrlConfirm = () => {
+    if (!urlPreview) return;
+    setPreview(urlPreview);
+    setHasError(false);
+    editField(collection, sectionKey, fieldKey, urlPreview);
+    setPendingImage({
+      file: null,
+      localUrl: urlPreview,
+      sectionKey,
+      fieldKey,
+      collection,
+      docId,
+      isExternal: true
+    });
+    setShowUrlModal(false);
+    setUrlInput("");
+    setUrlPreview("");
+  };
+  const handleUrlChange = (value) => {
+    setUrlInput(value);
+    try {
+      const url = new URL(value);
+      if (url.protocol === "http:" || url.protocol === "https:") {
+        setUrlPreview(value);
+      } else {
+        setUrlPreview("");
+      }
+    } catch (e) {
+      setUrlPreview("");
+    }
+  };
+  const imageNode = hasError || !imgSrc ? /* @__PURE__ */ jsx4("div", { className: "flex items-center justify-center w-full h-full p-4", children: /* @__PURE__ */ jsxs("div", { className: "text-center space-y-4", children: [
+    /* @__PURE__ */ jsx4("div", { className: "w-32 h-32 mx-auto rounded-2xl bg-neutral-800/50 flex items-center justify-center", children: /* @__PURE__ */ jsx4(
+      "svg",
+      {
+        className: "w-16 h-16 text-neutral-600",
+        fill: "none",
+        viewBox: "0 0 24 24",
+        stroke: "currentColor",
+        children: /* @__PURE__ */ jsx4(
+          "path",
+          {
+            strokeLinecap: "round",
+            strokeLinejoin: "round",
+            strokeWidth: 1.5,
+            d: "M4 16l4.586-4.586a2 2 0 012.828 0L16 16m-2-2l1.586-1.586a2 2 0 012.828 0L20 14m-6-6h.01M6 20h12a2 2 0 002-2V6a2 2 0 00-2-2H6a2 2 0 00-2 2v12a2 2 0 002 2z"
+          }
+        )
+      }
+    ) }),
+    /* @__PURE__ */ jsx4("p", { className: "text-neutral-500 text-lg", children: "No image available" })
+  ] }) }) : (
+    // eslint-disable-next-line @next/next/no-img-element
+    /* @__PURE__ */ jsx4(
+      "img",
+      {
+        src: imgSrc,
+        alt: "",
+        className: "w-full h-full object-cover",
+        onError: () => setHasError(true)
+      }
+    )
+  );
+  if (!isEditing) {
+    return /* @__PURE__ */ jsx4("div", { className, children: imageNode });
+  }
+  return /* @__PURE__ */ jsxs(Fragment2, { children: [
+    /* @__PURE__ */ jsxs("div", { className: cn("relative group", className), children: [
+      imageNode,
+      /* @__PURE__ */ jsx4("div", { className: "absolute inset-0 flex items-center justify-center bg-black/30 opacity-0 group-hover:opacity-100 transition-opacity", children: saving ? /* @__PURE__ */ jsx4("div", { className: "w-8 h-8 border-4 border-white border-t-transparent rounded-full animate-spin" }) : /* @__PURE__ */ jsxs("div", { className: "flex gap-12", children: [
+        /* @__PURE__ */ jsx4(
+          CameraIcon,
+          {
+            className: "w-12 h-12 text-white cursor-pointer hover:text-primary",
+            onClick: (e) => {
+              var _a;
+              e.stopPropagation();
+              (_a = inputRef.current) == null ? void 0 : _a.click();
+            }
+          }
+        ),
+        /* @__PURE__ */ jsx4(
+          Link2Icon,
+          {
+            className: "w-12 h-12 text-white cursor-pointer hover:text-primary",
+            onClick: (e) => {
+              e.stopPropagation();
+              setShowUrlModal(true);
+            }
+          }
+        )
+      ] }) }),
+      /* @__PURE__ */ jsx4(
+        "input",
+        {
+          ref: inputRef,
+          type: "file",
+          accept: "image/*",
+          disabled: saving,
+          onChange: handleFileChange,
+          className: "absolute inset-0 opacity-0 pointer-events-none"
+        }
+      )
+    ] }),
+    showUrlModal && createPortal(
+      /* @__PURE__ */ jsx4("div", { className: "fixed inset-0 bg-black/70 flex items-center justify-center z-9999 p-4", children: /* @__PURE__ */ jsxs("div", { className: "bg-neutral-900 rounded-xl p-6 max-w-sm w-full space-y-4", children: [
+        /* @__PURE__ */ jsx4("h3", { className: "text-lg font-bold", children: "Add Image URL" }),
+        /* @__PURE__ */ jsx4(
+          "input",
+          {
+            type: "text",
+            value: urlInput,
+            onChange: (e) => handleUrlChange(e.target.value),
+            placeholder: "https://example.com/image.png",
+            className: "w-full px-3 py-2 rounded bg-neutral-800 border border-neutral-700"
+          }
+        ),
+        urlPreview ? (
+          // eslint-disable-next-line @next/next/no-img-element
+          /* @__PURE__ */ jsx4(
+            "img",
+            {
+              src: urlPreview,
+              alt: "",
+              className: "w-full h-40 object-contain rounded",
+              onError: () => setHasError(true)
+            }
+          )
+        ) : /* @__PURE__ */ jsx4("div", { className: "h-40 flex items-center justify-center text-neutral-500", children: "Invalid URL" }),
+        /* @__PURE__ */ jsxs("div", { className: "flex justify-end gap-2", children: [
+          /* @__PURE__ */ jsxs(
+            "button",
+            {
+              onClick: () => setShowUrlModal(false),
+              className: "px-3 py-1 bg-neutral-700 rounded text-sm",
+              children: [
+                /* @__PURE__ */ jsx4(XIcon, { className: "w-4 h-4 inline" }),
+                " Cancel"
+              ]
+            }
+          ),
+          /* @__PURE__ */ jsxs(
+            "button",
+            {
+              onClick: handleUrlConfirm,
+              disabled: !urlPreview,
+              className: "px-3 py-1 bg-primary rounded text-sm disabled:opacity-50",
+              children: [
+                /* @__PURE__ */ jsx4(CheckIcon, { className: "w-4 h-4 inline" }),
+                " Confirm"
+              ]
+            }
+          )
+        ] })
+      ] }) }),
+      document.body
+    )
+  ] });
+}
+
+// src/client/MarkdownEditor.tsx
+import { useState as useState4 } from "react";
+import { createPortal as createPortal2 } from "react-dom";
+import ReactMarkdown from "react-markdown";
+import remarkGfm from "remark-gfm";
+import {
+  EyeIcon,
+  EditIcon,
+  SaveIcon,
+  XIcon as XIcon2,
+  TypeIcon,
+  BoldIcon,
+  ItalicIcon,
+  ListIcon,
+  LinkIcon,
+  CodeIcon,
+  ImageIcon,
+  Heading1Icon,
+  Heading2Icon
+} from "lucide-react";
+import { toast as toast2 } from "sonner";
+import { Fragment as Fragment3, jsx as jsx5, jsxs as jsxs2 } from "react/jsx-runtime";
+function MarkdownEditor({
+  initialValue,
+  onSave,
+  trigger,
+  title = "Edit Content"
+}) {
+  const [open, setOpen] = useState4(false);
+  const [content, setContent] = useState4(initialValue);
+  const [isPreview, setIsPreview] = useState4(false);
+  const handleOpen = () => {
+    setContent(initialValue);
+    setOpen(true);
+  };
+  const handleSave = () => {
+    onSave(content);
+    setOpen(false);
+  };
+  const handleCancel = () => {
+    setContent(initialValue);
+    setOpen(false);
+  };
+  const insertMarkdown = (before, after = "", placeholder = "text") => {
+    const textarea = document.querySelector(
+      "textarea[data-markdown-editor]"
+    );
+    if (!textarea) return;
+    const start = textarea.selectionStart;
+    const end = textarea.selectionEnd;
+    const selectedText = content.substring(start, end) || placeholder;
+    const newText = content.substring(0, start) + before + selectedText + after + content.substring(end);
+    setContent(newText);
+    setTimeout(() => {
+      textarea.focus();
+      const newCursorPos = start + before.length + selectedText.length;
+      textarea.setSelectionRange(newCursorPos, newCursorPos);
+    }, 0);
+  };
+  return /* @__PURE__ */ jsxs2(Fragment3, { children: [
+    trigger ? /* @__PURE__ */ jsx5("div", { onClick: handleOpen, children: trigger }) : /* @__PURE__ */ jsxs2(
+      "button",
+      {
+        type: "button",
+        onClick: handleOpen,
+        className: "inline-flex items-center gap-2 px-3 py-1.5 text-sm rounded-lg border border-neutral-700 hover:bg-neutral-800 transition-colors",
+        children: [
+          /* @__PURE__ */ jsx5(EditIcon, { className: "w-4 h-4" }),
+          "Edit Content"
+        ]
+      }
+    ),
+    open && createPortal2(
+      /* @__PURE__ */ jsx5("div", { className: "fixed inset-0 z-[10001] flex items-center justify-center bg-black/70 p-4", children: /* @__PURE__ */ jsxs2("div", { className: "md:max-w-6xl w-full h-[90vh] flex flex-col bg-neutral-950 border border-neutral-800 rounded-xl overflow-hidden", children: [
+        /* @__PURE__ */ jsx5("div", { className: "px-6 pt-6 pb-4 border-b border-neutral-800", children: /* @__PURE__ */ jsxs2("div", { className: "flex items-center justify-between", children: [
+          /* @__PURE__ */ jsxs2("h2", { className: "text-2xl font-bold flex items-center gap-3", children: [
+            /* @__PURE__ */ jsx5("div", { className: "p-2 bg-primary/10 rounded-lg", children: /* @__PURE__ */ jsx5(TypeIcon, { className: "w-5 h-5 text-primary" }) }),
+            title
+          ] }),
+          /* @__PURE__ */ jsx5(
+            "button",
+            {
+              type: "button",
+              onClick: () => setIsPreview(!isPreview),
+              className: cn(
+                "flex items-center gap-2 px-4 py-2 rounded-lg transition-all font-medium",
+                isPreview ? "bg-primary text-white" : "bg-neutral-800 hover:bg-neutral-700 text-neutral-300"
+              ),
+              children: isPreview ? /* @__PURE__ */ jsxs2(Fragment3, { children: [
+                /* @__PURE__ */ jsx5(EditIcon, { className: "w-4 h-4" }),
+                "Edit"
+              ] }) : /* @__PURE__ */ jsxs2(Fragment3, { children: [
+                /* @__PURE__ */ jsx5(EyeIcon, { className: "w-4 h-4" }),
+                "Preview"
+              ] })
+            }
+          )
+        ] }) }),
+        /* @__PURE__ */ jsxs2("div", { className: "flex-1 overflow-hidden flex flex-col", children: [
+          !isPreview && /* @__PURE__ */ jsxs2("div", { className: "flex items-center gap-1 px-4 py-3 border-b border-neutral-800 bg-neutral-900/50 overflow-x-auto", children: [
+            /* @__PURE__ */ jsx5(
+              ToolbarButton,
+              {
+                icon: /* @__PURE__ */ jsx5(Heading1Icon, { className: "w-4 h-4" }),
+                label: "Heading 1",
+                onClick: () => insertMarkdown("# ", "", "Heading")
+              }
+            ),
+            /* @__PURE__ */ jsx5(
+              ToolbarButton,
+              {
+                icon: /* @__PURE__ */ jsx5(Heading2Icon, { className: "w-4 h-4" }),
+                label: "Heading 2",
+                onClick: () => insertMarkdown("## ", "", "Heading")
+              }
+            ),
+            /* @__PURE__ */ jsx5("div", { className: "w-px h-6 bg-neutral-700 mx-1" }),
+            /* @__PURE__ */ jsx5(
+              ToolbarButton,
+              {
+                icon: /* @__PURE__ */ jsx5(BoldIcon, { className: "w-4 h-4" }),
+                label: "Bold",
+                onClick: () => insertMarkdown("**", "**", "bold text")
+              }
+            ),
+            /* @__PURE__ */ jsx5(
+              ToolbarButton,
+              {
+                icon: /* @__PURE__ */ jsx5(ItalicIcon, { className: "w-4 h-4" }),
+                label: "Italic",
+                onClick: () => insertMarkdown("*", "*", "italic text")
+              }
+            ),
+            /* @__PURE__ */ jsx5("div", { className: "w-px h-6 bg-neutral-700 mx-1" }),
+            /* @__PURE__ */ jsx5(
+              ToolbarButton,
+              {
+                icon: /* @__PURE__ */ jsx5(LinkIcon, { className: "w-4 h-4" }),
+                label: "Link",
+                onClick: () => insertMarkdown("[", "](url)", "link text")
+              }
+            ),
+            /* @__PURE__ */ jsx5(
+              ToolbarButton,
+              {
+                icon: /* @__PURE__ */ jsx5(ImageIcon, { className: "w-4 h-4" }),
+                label: "Image",
+                onClick: () => insertMarkdown("![", "](url)", "alt text")
+              }
+            ),
+            /* @__PURE__ */ jsx5("div", { className: "w-px h-6 bg-neutral-700 mx-1" }),
+            /* @__PURE__ */ jsx5(
+              ToolbarButton,
+              {
+                icon: /* @__PURE__ */ jsx5(ListIcon, { className: "w-4 h-4" }),
+                label: "List",
+                onClick: () => insertMarkdown("- ", "", "list item")
+              }
+            ),
+            /* @__PURE__ */ jsx5(
+              ToolbarButton,
+              {
+                icon: /* @__PURE__ */ jsx5(CodeIcon, { className: "w-4 h-4" }),
+                label: "Code",
+                onClick: () => insertMarkdown("```\n", "\n```", "code")
+              }
+            )
+          ] }),
+          /* @__PURE__ */ jsx5("div", { className: "flex-1 overflow-auto p-6", children: isPreview ? /* @__PURE__ */ jsx5("div", { className: "prose prose-invert prose-lg max-w-none", children: /* @__PURE__ */ jsx5(ReactMarkdown, { remarkPlugins: [remarkGfm], children: content }) }) : /* @__PURE__ */ jsxs2("div", { className: "h-full flex flex-col", children: [
+            /* @__PURE__ */ jsx5(
+              "textarea",
+              {
+                "data-markdown-editor": true,
+                value: content,
+                onChange: (e) => setContent(e.target.value),
+                className: "h-full w-full resize-none rounded-md font-mono text-sm bg-neutral-900/50 border border-neutral-800 p-3 outline-none focus:border-primary",
+                placeholder: "# Project Title\n\n## Overview\nWrite your description here..."
+              }
+            ),
+            /* @__PURE__ */ jsxs2("div", { className: "mt-4 p-4 bg-neutral-900/50 border border-neutral-800 rounded-lg", children: [
+              /* @__PURE__ */ jsxs2("h4", { className: "text-sm font-semibold mb-3 text-neutral-300 flex items-center gap-2", children: [
+                /* @__PURE__ */ jsx5(CodeIcon, { className: "w-4 h-4 text-primary" }),
+                "Markdown Guide"
+              ] }),
+              /* @__PURE__ */ jsxs2("div", { className: "grid grid-cols-2 md:grid-cols-3 gap-3 text-xs", children: [
+                /* @__PURE__ */ jsx5(GuideItem, { code: "# Heading 1", desc: "Main heading" }),
+                /* @__PURE__ */ jsx5(GuideItem, { code: "## Heading 2", desc: "Sub heading" }),
+                /* @__PURE__ */ jsx5(GuideItem, { code: "**bold**", desc: "Bold text" }),
+                /* @__PURE__ */ jsx5(GuideItem, { code: "*italic*", desc: "Italic text" }),
+                /* @__PURE__ */ jsx5(GuideItem, { code: "[link](url)", desc: "Hyperlink" }),
+                /* @__PURE__ */ jsx5(GuideItem, { code: "- list item", desc: "Bullet list" })
+              ] })
+            ] })
+          ] }) })
+        ] }),
+        /* @__PURE__ */ jsx5("div", { className: "px-6 py-4 border-t border-neutral-800 bg-neutral-900/30", children: /* @__PURE__ */ jsxs2("div", { className: "flex items-center justify-between w-full", children: [
+          /* @__PURE__ */ jsxs2("p", { className: "text-sm text-neutral-500", children: [
+            content.length,
+            " characters"
+          ] }),
+          /* @__PURE__ */ jsxs2("div", { className: "flex gap-2", children: [
+            /* @__PURE__ */ jsxs2(
+              "button",
+              {
+                type: "button",
+                onClick: handleCancel,
+                className: "inline-flex items-center gap-2 px-4 py-2 text-sm rounded-md border border-neutral-700 hover:bg-neutral-800 transition-colors",
+                children: [
+                  /* @__PURE__ */ jsx5(XIcon2, { className: "w-4 h-4" }),
+                  "Cancel"
+                ]
+              }
+            ),
+            /* @__PURE__ */ jsxs2(
+              "button",
+              {
+                type: "button",
+                onClick: handleSave,
+                className: "inline-flex items-center gap-2 px-4 py-2 text-sm rounded-md bg-primary text-white hover:opacity-90 transition-opacity",
+                children: [
+                  /* @__PURE__ */ jsx5(SaveIcon, { className: "w-4 h-4" }),
+                  "Save Content"
+                ]
+              }
+            )
+          ] })
+        ] }) })
+      ] }) }),
+      document.body
+    )
+  ] });
+}
+function ToolbarButton({
+  icon,
+  label,
+  onClick
+}) {
+  return /* @__PURE__ */ jsx5(
+    "button",
+    {
+      type: "button",
+      onClick,
+      title: label,
+      className: "p-2 rounded-lg hover:bg-neutral-800 text-neutral-400 hover:text-white transition-colors",
+      children: icon
+    }
+  );
+}
+function GuideItem({ code, desc }) {
+  return /* @__PURE__ */ jsxs2("div", { className: "flex flex-col gap-1", children: [
+    /* @__PURE__ */ jsx5("code", { className: "text-primary bg-primary/10 px-2 py-1 rounded text-xs font-mono", children: code }),
+    /* @__PURE__ */ jsx5("span", { className: "text-neutral-500", children: desc })
+  ] });
+}
+function ProjectContentEditor({
+  content,
+  onSave
+}) {
+  const [saving, setSaving] = useState4(false);
+  const handleSave = async (newContent) => {
+    setSaving(true);
+    try {
+      await onSave(newContent);
+      toast2.success("Content saved successfully!");
+    } catch (error) {
+      console.error("Failed to save content:", error);
+      toast2.error("Failed to save content");
+    } finally {
+      setSaving(false);
+    }
+  };
+  return /* @__PURE__ */ jsx5(
+    MarkdownEditor,
+    {
+      initialValue: content,
+      onSave: handleSave,
+      title: "Edit Project Content",
+      trigger: /* @__PURE__ */ jsxs2(
+        "button",
+        {
+          className: "px-4 py-2 bg-neutral-800 rounded-lg hover:bg-neutral-700 transition-colors flex items-center gap-2 border border-neutral-700 hover:border-primary/50",
+          disabled: saving,
+          children: [
+            /* @__PURE__ */ jsx5(EditIcon, { className: "w-4 h-4" }),
+            saving ? "Saving..." : "Edit Full Content"
+          ]
+        }
+      )
+    }
+  );
+}
+export {
+  CmsAuthContext,
+  CmsAuthProvider,
+  ContentEditSpan,
+  EditableImage,
+  MarkdownEditor,
+  PageProvider,
+  ProjectContentEditor,
+  cn,
+  useCmsAuth,
+  usePageContext
+};
+//# sourceMappingURL=index.js.map