@dalgoridim/headless-cms 0.1.0 → 0.2.0

package/dist/client/index.js

@@ -26,11 +26,10 @@ import {
   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)
+  success: (m) => console.info(`[cms] ${m}`),
+  error: (m) => console.error(`[cms] ${m}`)
 };
 var PageContext = createContext(void 0);
 var dirtyKey = (collection, sectionKey) => `${collection}:${sectionKey}`;
@@ -279,99 +278,8 @@ function CmsAuthProvider({
 
 // 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 });
-}
+import { jsx as jsx3 } from "react/jsx-runtime";
+var defaultRenderValue = (raw) => raw;
 function getNestedValue(obj, path) {
   const keys = path.split(".");
   let current = obj;
@@ -383,20 +291,22 @@ function getNestedValue(obj, path) {
   return current;
 }
 function ContentEditSpan({
-  collection = "portfolio",
+  collection,
   sectionKey,
   fieldKey,
   className,
   children,
-  as = "span"
+  as = "span",
+  renderValue = defaultRenderValue
 }) {
   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 : "";
+  const Component = as;
   if (!isEditing) {
-    return /* @__PURE__ */ jsx3(RenderStatic, { raw, as, className });
+    return /* @__PURE__ */ jsx3(Component, { className, children: renderValue(raw) });
   }
   return /* @__PURE__ */ jsx3(
     EditableContentSpan,
@@ -407,18 +317,20 @@ function ContentEditSpan({
       className,
       raw,
       editField,
-      as
+      as,
+      renderValue
     }
   );
 }
 function EditableContentSpan({
-  collection = "portfolio",
+  collection,
   sectionKey,
   fieldKey,
   className,
   raw,
   editField,
-  as: Component = "span"
+  as: Component = "span",
+  renderValue
 }) {
   const { isEditing } = useCmsAuth();
   const [isFocused, setIsFocused] = useState2(false);
@@ -466,19 +378,16 @@ function EditableContentSpan({
     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"
-      ),
+      className,
+      "data-cms-editable": "",
+      "data-cms-editing": isEditing ? "" : void 0,
+      "data-cms-focused": isFocused ? "" : void 0,
       contentEditable: isEditing,
       suppressContentEditableWarning: true,
       onInput: handleInput,
       onBlur: handleBlur,
       onFocus: handleFocus,
-      children: !isFocused && /* @__PURE__ */ jsx3(RenderStatic, { raw: editValue, as: "span" })
+      children: !isFocused && renderValue(editValue)
     },
     isFocused ? "editing" : "static"
   );
@@ -486,24 +395,20 @@ function EditableContentSpan({
 
 // 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";
+import { jsx as jsx4, jsxs } from "react/jsx-runtime";
 function EditableImage({
   sectionKey,
   fieldKey,
   src,
   collection,
   docId,
-  className
+  className,
+  children
 }) {
   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
@@ -528,467 +433,111 @@ function EditableImage({
       isExternal: false
     });
   };
-  const handleUrlConfirm = () => {
-    if (!urlPreview) return;
-    setPreview(urlPreview);
+  const openFilePicker = () => {
+    var _a;
+    if (saving) return;
+    (_a = inputRef.current) == null ? void 0 : _a.click();
+  };
+  const setExternalUrl = (value) => {
+    let valid = false;
+    try {
+      const url = new URL(value);
+      valid = url.protocol === "http:" || url.protocol === "https:";
+    } catch (e) {
+      valid = false;
+    }
+    if (!valid) return false;
+    setPreview(value);
     setHasError(false);
-    editField(collection, sectionKey, fieldKey, urlPreview);
+    editField(collection, sectionKey, fieldKey, value);
     setPendingImage({
       file: null,
-      localUrl: urlPreview,
+      localUrl: value,
       sectionKey,
       fieldKey,
       collection,
       docId,
       isExternal: true
     });
-    setShowUrlModal(false);
-    setUrlInput("");
-    setUrlPreview("");
+    return true;
   };
-  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 state = {
+    src: imgSrc,
+    isEditing,
+    saving,
+    hasError,
+    openFilePicker,
+    setExternalUrl,
+    imgProps: { src: imgSrc, onError: () => setHasError(true) }
   };
-  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
+  return /* @__PURE__ */ jsxs("div", { className, children: [
     /* @__PURE__ */ jsx4(
-      "img",
+      "input",
       {
-        src: imgSrc,
-        alt: "",
-        className: "w-full h-full object-cover",
-        onError: () => setHasError(true)
+        ref: inputRef,
+        type: "file",
+        accept: "image/*",
+        disabled: saving,
+        onChange: handleFileChange,
+        style: { display: "none" }
       }
-    )
-  );
-  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
+    ),
+    children ? children(state) : (
+      // eslint-disable-next-line @next/next/no-img-element
+      /* @__PURE__ */ jsx4("img", __spreadProps(__spreadValues({}, state.imgProps), { alt: "" }))
     )
   ] });
 }
 
 // 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({
+import { useCallback as useCallback3, useRef as useRef3, useState as useState4 } from "react";
+function useMarkdownEditor({
   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"
-          ]
-        }
-      )
-    }
+  const [value, setValue] = useState4(initialValue);
+  const textareaRef = useRef3(null);
+  const insert = useCallback3(
+    (before, after = "", placeholder = "text") => {
+      var _a, _b;
+      const textarea = textareaRef.current;
+      const start = (_a = textarea == null ? void 0 : textarea.selectionStart) != null ? _a : value.length;
+      const end = (_b = textarea == null ? void 0 : textarea.selectionEnd) != null ? _b : value.length;
+      const selected = value.substring(start, end) || placeholder;
+      const next = value.substring(0, start) + before + selected + after + value.substring(end);
+      setValue(next);
+      setTimeout(() => {
+        if (!textarea) return;
+        textarea.focus();
+        const caret = start + before.length + selected.length;
+        textarea.setSelectionRange(caret, caret);
+      }, 0);
+    },
+    [value]
+  );
+  const reset = useCallback3(
+    (to = initialValue) => setValue(to),
+    [initialValue]
   );
+  const save = useCallback3(() => onSave(value), [onSave, value]);
+  return {
+    value,
+    setValue,
+    textareaRef,
+    insert,
+    reset,
+    save,
+    charCount: value.length
+  };
 }
 export {
   CmsAuthContext,
   CmsAuthProvider,
   ContentEditSpan,
   EditableImage,
-  MarkdownEditor,
   PageProvider,
-  ProjectContentEditor,
-  cn,
   useCmsAuth,
+  useMarkdownEditor,
   usePageContext
 };
 //# sourceMappingURL=index.js.map