xertica-ui 2.3.0 → 2.4.0

package/dist/use-rich-text-editor-DjiddBGv.js

@@ -1,282 +0,0 @@
-import { useRef, useState, useCallback, useEffect } from "react";
-function useRichTextEditor({
-  value,
-  onChange
-}) {
-  const editorRef = useRef(null);
-  const searchInputRef = useRef(null);
-  const linkInputRef = useRef(null);
-  const savedSelection = useRef(null);
-  const [wordCount, setWordCount] = useState(0);
-  const [characterCount, setCharacterCount] = useState(0);
-  const [activeFormats, setActiveFormats] = useState({
-    bold: false,
-    italic: false,
-    underline: false,
-    justifyLeft: false,
-    justifyCenter: false,
-    justifyRight: false,
-    insertUnorderedList: false,
-    insertOrderedList: false,
-    link: false,
-    h1: false,
-    h2: false,
-    h3: false,
-    p: true
-  });
-  const [isSearchOpen, setIsSearchOpen] = useState(false);
-  const [searchQuery, setSearchQuery] = useState("");
-  const [linkUrl, setLinkUrl] = useState("https://");
-  const [isLinkOpen, setIsLinkOpen] = useState(false);
-  const [hasSavedSelection, setHasSavedSelection] = useState(false);
-  const findParentTag = useCallback((node, tagName) => {
-    let current = node;
-    while (current && current !== editorRef.current) {
-      if (current.nodeName === tagName) return current;
-      current = current.parentNode;
-    }
-    return null;
-  }, []);
-  const updateActiveFormatsRef = useRef(() => {
-  });
-  const updateActiveFormats = useCallback(() => {
-    let formatBlock = "";
-    try {
-      formatBlock = document.queryCommandValue("formatBlock");
-    } catch (_e) {
-    }
-    const selection = window.getSelection();
-    const anchorNode = selection == null ? void 0 : selection.anchorNode;
-    const focusNode = selection == null ? void 0 : selection.focusNode;
-    setActiveFormats({
-      bold: document.queryCommandState("bold"),
-      italic: document.queryCommandState("italic"),
-      underline: document.queryCommandState("underline"),
-      justifyLeft: document.queryCommandState("justifyLeft"),
-      justifyCenter: document.queryCommandState("justifyCenter"),
-      justifyRight: document.queryCommandState("justifyRight"),
-      insertUnorderedList: document.queryCommandState("insertUnorderedList"),
-      insertOrderedList: document.queryCommandState("insertOrderedList"),
-      link: !!(findParentTag(anchorNode || null, "A") || findParentTag(focusNode || null, "A")),
-      h1: formatBlock === "h1" || formatBlock === "H1",
-      h2: formatBlock === "h2" || formatBlock === "H2",
-      h3: formatBlock === "h3" || formatBlock === "H3",
-      p: formatBlock === "p" || formatBlock === "P" || formatBlock === "div" || formatBlock === "DIV" || formatBlock === ""
-    });
-  }, [findParentTag]);
-  updateActiveFormatsRef.current = updateActiveFormats;
-  useEffect(() => {
-    if (editorRef.current && editorRef.current.innerHTML !== value) {
-      editorRef.current.innerHTML = value;
-    }
-  }, []);
-  useEffect(() => {
-    if (editorRef.current && document.activeElement !== editorRef.current && editorRef.current.innerHTML !== value) {
-      editorRef.current.innerHTML = value;
-      const text = editorRef.current.innerText || "";
-      setWordCount(text.trim() ? text.trim().split(/\s+/).length : 0);
-      setCharacterCount(text.trim() ? text.length : 0);
-    }
-  }, [value]);
-  useEffect(() => {
-    const handleSelectionChange = () => {
-      if (document.activeElement === editorRef.current) {
-        updateActiveFormatsRef.current();
-      }
-    };
-    document.addEventListener("selectionchange", handleSelectionChange);
-    return () => document.removeEventListener("selectionchange", handleSelectionChange);
-  }, []);
-  const handleInput = useCallback(() => {
-    if (editorRef.current) {
-      onChange == null ? void 0 : onChange(editorRef.current.innerHTML);
-      updateActiveFormats();
-      const text = editorRef.current.innerText || "";
-      setWordCount(text.trim() ? text.trim().split(/\s+/).length : 0);
-      setCharacterCount(text.trim() ? text.length : 0);
-    }
-  }, [onChange, updateActiveFormats]);
-  const execCommand = useCallback((command, val = "") => {
-    var _a;
-    document.execCommand(command, false, val);
-    updateActiveFormats();
-    (_a = editorRef.current) == null ? void 0 : _a.focus();
-    if (editorRef.current) {
-      onChange == null ? void 0 : onChange(editorRef.current.innerHTML);
-    }
-  }, [onChange, updateActiveFormats]);
-  const performSearch = useCallback((text, backward = false) => {
-    var _a, _b;
-    if (!text || !editorRef.current) return;
-    const editor = editorRef.current;
-    const selection = window.getSelection();
-    if (!selection) return;
-    const walker = document.createTreeWalker(editor, NodeFilter.SHOW_TEXT);
-    const segments = [];
-    let offset = 0;
-    let node;
-    while (node = walker.nextNode()) {
-      segments.push({ node, start: offset });
-      offset += node.length;
-    }
-    const fullText = segments.reduce((acc, s) => acc + (s.node.textContent ?? ""), "");
-    let searchFrom = 0;
-    if (selection.rangeCount > 0) {
-      const range2 = selection.getRangeAt(0);
-      if (editor.contains(range2.startContainer)) {
-        const seg = segments.find((s) => s.node === range2.startContainer);
-        if (seg) {
-          searchFrom = backward ? seg.start + range2.startOffset - 1 : seg.start + range2.endOffset;
-        }
-      }
-    }
-    const lowerFull = fullText.toLowerCase();
-    const lowerQuery = text.toLowerCase();
-    let matchStart = -1;
-    if (backward) {
-      matchStart = lowerFull.lastIndexOf(lowerQuery, Math.max(0, searchFrom));
-      if (matchStart === -1) matchStart = lowerFull.lastIndexOf(lowerQuery);
-    } else {
-      matchStart = lowerFull.indexOf(lowerQuery, searchFrom);
-      if (matchStart === -1) matchStart = lowerFull.indexOf(lowerQuery);
-    }
-    if (matchStart === -1) return;
-    const matchEnd = matchStart + text.length;
-    const range = document.createRange();
-    let startSet = false;
-    let endSet = false;
-    for (let i = 0; i < segments.length && !endSet; i++) {
-      const seg = segments[i];
-      const segEnd = seg.start + seg.node.length;
-      if (!startSet && matchStart < segEnd && matchStart >= seg.start) {
-        range.setStart(seg.node, matchStart - seg.start);
-        startSet = true;
-      }
-      if (startSet && matchEnd <= segEnd) {
-        range.setEnd(seg.node, matchEnd - seg.start);
-        endSet = true;
-      }
-    }
-    if (startSet && endSet) {
-      selection.removeAllRanges();
-      selection.addRange(range);
-      (_b = (_a = range.startContainer.parentElement) == null ? void 0 : _a.scrollIntoView) == null ? void 0 : _b.call(_a, { block: "nearest" });
-    }
-  }, []);
-  const handleCreateLink = useCallback(() => {
-    if (savedSelection.current) {
-      const selection2 = window.getSelection();
-      selection2 == null ? void 0 : selection2.removeAllRanges();
-      selection2 == null ? void 0 : selection2.addRange(savedSelection.current);
-    }
-    const selection = window.getSelection();
-    const anchorNode = selection == null ? void 0 : selection.anchorNode;
-    const existingLink = findParentTag(anchorNode || null, "A");
-    if (existingLink) {
-      if (linkUrl) {
-        existingLink.setAttribute("href", linkUrl);
-        existingLink.setAttribute("target", "_blank");
-        existingLink.setAttribute("rel", "noopener noreferrer");
-        existingLink.style.color = "hsl(var(--primary))";
-        existingLink.style.textDecoration = "underline";
-        existingLink.style.cursor = "pointer";
-      }
-      handleInput();
-      setIsLinkOpen(false);
-      savedSelection.current = null;
-      return;
-    }
-    if (!selection || selection.rangeCount === 0 || selection.isCollapsed) {
-      return;
-    }
-    if (linkUrl) {
-      document.execCommand("createLink", false, linkUrl);
-      setTimeout(() => {
-        var _a;
-        const anchor = findParentTag(((_a = window.getSelection()) == null ? void 0 : _a.anchorNode) || null, "A");
-        if (anchor) {
-          anchor.setAttribute("target", "_blank");
-          anchor.setAttribute("rel", "noopener noreferrer");
-          anchor.style.color = "hsl(var(--primary))";
-          anchor.style.textDecoration = "underline";
-          anchor.style.cursor = "pointer";
-        }
-        handleInput();
-      }, 10);
-      setIsLinkOpen(false);
-      savedSelection.current = null;
-    }
-  }, [linkUrl, findParentTag, handleInput]);
-  const handleUnlink = useCallback(() => {
-    const selection = window.getSelection();
-    const anchorNode = selection == null ? void 0 : selection.anchorNode;
-    const existingLink = findParentTag(anchorNode || null, "A");
-    if (existingLink) {
-      const parent = existingLink.parentNode;
-      while (existingLink.firstChild) {
-        parent == null ? void 0 : parent.insertBefore(existingLink.firstChild, existingLink);
-      }
-      parent == null ? void 0 : parent.removeChild(existingLink);
-      handleInput();
-    } else {
-      document.execCommand("unlink", false, "");
-    }
-  }, [findParentTag, handleInput]);
-  const onLinkPopoverOpenChange = useCallback((open) => {
-    if (open) {
-      const selection = window.getSelection();
-      const anchorNode = selection == null ? void 0 : selection.anchorNode;
-      const focusNode = selection == null ? void 0 : selection.focusNode;
-      const existingLink = findParentTag(anchorNode || null, "A") || findParentTag(focusNode || null, "A");
-      if (existingLink) {
-        setLinkUrl(existingLink.getAttribute("href") || "https://");
-      } else {
-        setLinkUrl("https://");
-      }
-      if (selection && selection.rangeCount > 0 && (!selection.isCollapsed || existingLink)) {
-        savedSelection.current = selection.getRangeAt(0).cloneRange();
-        setHasSavedSelection(true);
-      } else {
-        savedSelection.current = null;
-        setHasSavedSelection(false);
-      }
-      setTimeout(() => {
-        var _a;
-        return (_a = linkInputRef.current) == null ? void 0 : _a.focus();
-      }, 100);
-    } else {
-      setHasSavedSelection(false);
-    }
-    setIsLinkOpen(open);
-  }, [findParentTag]);
-  return {
-    // Refs
-    editorRef,
-    searchInputRef,
-    linkInputRef,
-    // State
-    activeFormats,
-    isSearchOpen,
-    setIsSearchOpen,
-    searchQuery,
-    setSearchQuery,
-    linkUrl,
-    setLinkUrl,
-    isLinkOpen,
-    hasSavedSelection,
-    // Computed
-    wordCount,
-    characterCount,
-    // Handlers
-    updateActiveFormats,
-    execCommand,
-    handleInput,
-    performSearch,
-    handleCreateLink,
-    handleUnlink,
-    onLinkPopoverOpenChange
-  };
-}
-export {
-  useRichTextEditor as u
-};

package/dist/use-rich-text-editor-lpeswbCs.cjs

@@ -1,281 +0,0 @@
-"use strict";
-const React = require("react");
-function useRichTextEditor({
-  value,
-  onChange
-}) {
-  const editorRef = React.useRef(null);
-  const searchInputRef = React.useRef(null);
-  const linkInputRef = React.useRef(null);
-  const savedSelection = React.useRef(null);
-  const [wordCount, setWordCount] = React.useState(0);
-  const [characterCount, setCharacterCount] = React.useState(0);
-  const [activeFormats, setActiveFormats] = React.useState({
-    bold: false,
-    italic: false,
-    underline: false,
-    justifyLeft: false,
-    justifyCenter: false,
-    justifyRight: false,
-    insertUnorderedList: false,
-    insertOrderedList: false,
-    link: false,
-    h1: false,
-    h2: false,
-    h3: false,
-    p: true
-  });
-  const [isSearchOpen, setIsSearchOpen] = React.useState(false);
-  const [searchQuery, setSearchQuery] = React.useState("");
-  const [linkUrl, setLinkUrl] = React.useState("https://");
-  const [isLinkOpen, setIsLinkOpen] = React.useState(false);
-  const [hasSavedSelection, setHasSavedSelection] = React.useState(false);
-  const findParentTag = React.useCallback((node, tagName) => {
-    let current = node;
-    while (current && current !== editorRef.current) {
-      if (current.nodeName === tagName) return current;
-      current = current.parentNode;
-    }
-    return null;
-  }, []);
-  const updateActiveFormatsRef = React.useRef(() => {
-  });
-  const updateActiveFormats = React.useCallback(() => {
-    let formatBlock = "";
-    try {
-      formatBlock = document.queryCommandValue("formatBlock");
-    } catch (_e) {
-    }
-    const selection = window.getSelection();
-    const anchorNode = selection == null ? void 0 : selection.anchorNode;
-    const focusNode = selection == null ? void 0 : selection.focusNode;
-    setActiveFormats({
-      bold: document.queryCommandState("bold"),
-      italic: document.queryCommandState("italic"),
-      underline: document.queryCommandState("underline"),
-      justifyLeft: document.queryCommandState("justifyLeft"),
-      justifyCenter: document.queryCommandState("justifyCenter"),
-      justifyRight: document.queryCommandState("justifyRight"),
-      insertUnorderedList: document.queryCommandState("insertUnorderedList"),
-      insertOrderedList: document.queryCommandState("insertOrderedList"),
-      link: !!(findParentTag(anchorNode || null, "A") || findParentTag(focusNode || null, "A")),
-      h1: formatBlock === "h1" || formatBlock === "H1",
-      h2: formatBlock === "h2" || formatBlock === "H2",
-      h3: formatBlock === "h3" || formatBlock === "H3",
-      p: formatBlock === "p" || formatBlock === "P" || formatBlock === "div" || formatBlock === "DIV" || formatBlock === ""
-    });
-  }, [findParentTag]);
-  updateActiveFormatsRef.current = updateActiveFormats;
-  React.useEffect(() => {
-    if (editorRef.current && editorRef.current.innerHTML !== value) {
-      editorRef.current.innerHTML = value;
-    }
-  }, []);
-  React.useEffect(() => {
-    if (editorRef.current && document.activeElement !== editorRef.current && editorRef.current.innerHTML !== value) {
-      editorRef.current.innerHTML = value;
-      const text = editorRef.current.innerText || "";
-      setWordCount(text.trim() ? text.trim().split(/\s+/).length : 0);
-      setCharacterCount(text.trim() ? text.length : 0);
-    }
-  }, [value]);
-  React.useEffect(() => {
-    const handleSelectionChange = () => {
-      if (document.activeElement === editorRef.current) {
-        updateActiveFormatsRef.current();
-      }
-    };
-    document.addEventListener("selectionchange", handleSelectionChange);
-    return () => document.removeEventListener("selectionchange", handleSelectionChange);
-  }, []);
-  const handleInput = React.useCallback(() => {
-    if (editorRef.current) {
-      onChange == null ? void 0 : onChange(editorRef.current.innerHTML);
-      updateActiveFormats();
-      const text = editorRef.current.innerText || "";
-      setWordCount(text.trim() ? text.trim().split(/\s+/).length : 0);
-      setCharacterCount(text.trim() ? text.length : 0);
-    }
-  }, [onChange, updateActiveFormats]);
-  const execCommand = React.useCallback((command, val = "") => {
-    var _a;
-    document.execCommand(command, false, val);
-    updateActiveFormats();
-    (_a = editorRef.current) == null ? void 0 : _a.focus();
-    if (editorRef.current) {
-      onChange == null ? void 0 : onChange(editorRef.current.innerHTML);
-    }
-  }, [onChange, updateActiveFormats]);
-  const performSearch = React.useCallback((text, backward = false) => {
-    var _a, _b;
-    if (!text || !editorRef.current) return;
-    const editor = editorRef.current;
-    const selection = window.getSelection();
-    if (!selection) return;
-    const walker = document.createTreeWalker(editor, NodeFilter.SHOW_TEXT);
-    const segments = [];
-    let offset = 0;
-    let node;
-    while (node = walker.nextNode()) {
-      segments.push({ node, start: offset });
-      offset += node.length;
-    }
-    const fullText = segments.reduce((acc, s) => acc + (s.node.textContent ?? ""), "");
-    let searchFrom = 0;
-    if (selection.rangeCount > 0) {
-      const range2 = selection.getRangeAt(0);
-      if (editor.contains(range2.startContainer)) {
-        const seg = segments.find((s) => s.node === range2.startContainer);
-        if (seg) {
-          searchFrom = backward ? seg.start + range2.startOffset - 1 : seg.start + range2.endOffset;
-        }
-      }
-    }
-    const lowerFull = fullText.toLowerCase();
-    const lowerQuery = text.toLowerCase();
-    let matchStart = -1;
-    if (backward) {
-      matchStart = lowerFull.lastIndexOf(lowerQuery, Math.max(0, searchFrom));
-      if (matchStart === -1) matchStart = lowerFull.lastIndexOf(lowerQuery);
-    } else {
-      matchStart = lowerFull.indexOf(lowerQuery, searchFrom);
-      if (matchStart === -1) matchStart = lowerFull.indexOf(lowerQuery);
-    }
-    if (matchStart === -1) return;
-    const matchEnd = matchStart + text.length;
-    const range = document.createRange();
-    let startSet = false;
-    let endSet = false;
-    for (let i = 0; i < segments.length && !endSet; i++) {
-      const seg = segments[i];
-      const segEnd = seg.start + seg.node.length;
-      if (!startSet && matchStart < segEnd && matchStart >= seg.start) {
-        range.setStart(seg.node, matchStart - seg.start);
-        startSet = true;
-      }
-      if (startSet && matchEnd <= segEnd) {
-        range.setEnd(seg.node, matchEnd - seg.start);
-        endSet = true;
-      }
-    }
-    if (startSet && endSet) {
-      selection.removeAllRanges();
-      selection.addRange(range);
-      (_b = (_a = range.startContainer.parentElement) == null ? void 0 : _a.scrollIntoView) == null ? void 0 : _b.call(_a, { block: "nearest" });
-    }
-  }, []);
-  const handleCreateLink = React.useCallback(() => {
-    if (savedSelection.current) {
-      const selection2 = window.getSelection();
-      selection2 == null ? void 0 : selection2.removeAllRanges();
-      selection2 == null ? void 0 : selection2.addRange(savedSelection.current);
-    }
-    const selection = window.getSelection();
-    const anchorNode = selection == null ? void 0 : selection.anchorNode;
-    const existingLink = findParentTag(anchorNode || null, "A");
-    if (existingLink) {
-      if (linkUrl) {
-        existingLink.setAttribute("href", linkUrl);
-        existingLink.setAttribute("target", "_blank");
-        existingLink.setAttribute("rel", "noopener noreferrer");
-        existingLink.style.color = "hsl(var(--primary))";
-        existingLink.style.textDecoration = "underline";
-        existingLink.style.cursor = "pointer";
-      }
-      handleInput();
-      setIsLinkOpen(false);
-      savedSelection.current = null;
-      return;
-    }
-    if (!selection || selection.rangeCount === 0 || selection.isCollapsed) {
-      return;
-    }
-    if (linkUrl) {
-      document.execCommand("createLink", false, linkUrl);
-      setTimeout(() => {
-        var _a;
-        const anchor = findParentTag(((_a = window.getSelection()) == null ? void 0 : _a.anchorNode) || null, "A");
-        if (anchor) {
-          anchor.setAttribute("target", "_blank");
-          anchor.setAttribute("rel", "noopener noreferrer");
-          anchor.style.color = "hsl(var(--primary))";
-          anchor.style.textDecoration = "underline";
-          anchor.style.cursor = "pointer";
-        }
-        handleInput();
-      }, 10);
-      setIsLinkOpen(false);
-      savedSelection.current = null;
-    }
-  }, [linkUrl, findParentTag, handleInput]);
-  const handleUnlink = React.useCallback(() => {
-    const selection = window.getSelection();
-    const anchorNode = selection == null ? void 0 : selection.anchorNode;
-    const existingLink = findParentTag(anchorNode || null, "A");
-    if (existingLink) {
-      const parent = existingLink.parentNode;
-      while (existingLink.firstChild) {
-        parent == null ? void 0 : parent.insertBefore(existingLink.firstChild, existingLink);
-      }
-      parent == null ? void 0 : parent.removeChild(existingLink);
-      handleInput();
-    } else {
-      document.execCommand("unlink", false, "");
-    }
-  }, [findParentTag, handleInput]);
-  const onLinkPopoverOpenChange = React.useCallback((open) => {
-    if (open) {
-      const selection = window.getSelection();
-      const anchorNode = selection == null ? void 0 : selection.anchorNode;
-      const focusNode = selection == null ? void 0 : selection.focusNode;
-      const existingLink = findParentTag(anchorNode || null, "A") || findParentTag(focusNode || null, "A");
-      if (existingLink) {
-        setLinkUrl(existingLink.getAttribute("href") || "https://");
-      } else {
-        setLinkUrl("https://");
-      }
-      if (selection && selection.rangeCount > 0 && (!selection.isCollapsed || existingLink)) {
-        savedSelection.current = selection.getRangeAt(0).cloneRange();
-        setHasSavedSelection(true);
-      } else {
-        savedSelection.current = null;
-        setHasSavedSelection(false);
-      }
-      setTimeout(() => {
-        var _a;
-        return (_a = linkInputRef.current) == null ? void 0 : _a.focus();
-      }, 100);
-    } else {
-      setHasSavedSelection(false);
-    }
-    setIsLinkOpen(open);
-  }, [findParentTag]);
-  return {
-    // Refs
-    editorRef,
-    searchInputRef,
-    linkInputRef,
-    // State
-    activeFormats,
-    isSearchOpen,
-    setIsSearchOpen,
-    searchQuery,
-    setSearchQuery,
-    linkUrl,
-    setLinkUrl,
-    isLinkOpen,
-    hasSavedSelection,
-    // Computed
-    wordCount,
-    characterCount,
-    // Handlers
-    updateActiveFormats,
-    execCommand,
-    handleInput,
-    performSearch,
-    handleCreateLink,
-    handleUnlink,
-    onLinkPopoverOpenChange
-  };
-}
-exports.useRichTextEditor = useRichTextEditor;