@meenainwal/rich-text-editor 1.0.0

package/dist/test-editor.mjs

@@ -0,0 +1,862 @@
+class g {
+  /**
+   * Returns the current selection object.
+   */
+  getSelection() {
+    return window.getSelection();
+  }
+  /**
+   * Returns the first range of the current selection.
+   */
+  getRange() {
+    const e = this.getSelection();
+    return !e || e.rangeCount === 0 ? null : e.getRangeAt(0);
+  }
+  /**
+   * Saves the current selection range.
+   */
+  saveSelection() {
+    const e = this.getRange();
+    return e ? e.cloneRange() : null;
+  }
+  /**
+   * Restores a previously saved range.
+   */
+  restoreSelection(e) {
+    if (!e) return;
+    const t = this.getSelection();
+    t && (t.removeAllRanges(), t.addRange(e));
+  }
+  /**
+   * Checks if the selection is within a specific element.
+   */
+  isSelectionInElement(e) {
+    const t = this.getRange();
+    return t ? e.contains(t.commonAncestorContainer) : !1;
+  }
+  /**
+   * Clears the current selection.
+   */
+  clearSelection() {
+    const e = this.getSelection();
+    e && e.removeAllRanges();
+  }
+}
+class j {
+  container;
+  editableElement;
+  selection;
+  options;
+  pendingStyles = {};
+  constructor(e, t = {}) {
+    this.container = e, this.container.classList.add("te-container"), this.options = t, this.selection = new g(), this.editableElement = this.createEditableElement(), this.setupInputHandlers(), this.container.appendChild(this.editableElement), this.options.autofocus && this.focus(), document.execCommand("defaultParagraphSeparator", !1, "p");
+  }
+  setupInputHandlers() {
+    this.editableElement.addEventListener("beforeinput", (e) => {
+      if (e.inputType === "insertText" && Object.keys(this.pendingStyles).length > 0) {
+        const t = e.data;
+        if (!t) return;
+        e.preventDefault();
+        const i = document.createElement("span");
+        for (const [a, n] of Object.entries(this.pendingStyles))
+          i.style.setProperty(a, n);
+        i.textContent = t;
+        const o = this.selection.getRange();
+        if (o) {
+          o.deleteContents(), o.insertNode(i);
+          const a = document.createRange();
+          a.setStart(i.firstChild, t.length), a.setEnd(i.firstChild, t.length), this.selection.restoreSelection(a), this.pendingStyles = {}, this.editableElement.dispatchEvent(new Event("input", { bubbles: !0 }));
+        }
+      }
+    }), document.addEventListener("selectionchange", () => {
+      const e = window.getSelection();
+      e && e.rangeCount > 0 && (e.getRangeAt(0).collapsed || (this.pendingStyles = {}));
+    });
+  }
+  createEditableElement() {
+    const e = document.createElement("div");
+    return e.setAttribute("contenteditable", "true"), e.setAttribute("role", "textbox"), e.setAttribute("spellcheck", "true"), e.classList.add("te-content"), this.options.placeholder && e.setAttribute("data-placeholder", this.options.placeholder), e.style.minHeight = "150px", e.style.outline = "none", e.style.padding = "1rem", e.innerHTML === "" && (e.innerHTML = "<p><br></p>"), e;
+  }
+  /**
+   * Focuses the editor.
+   */
+  focus() {
+    this.editableElement.focus();
+  }
+  /**
+   * Executes a command on the current selection.
+   */
+  execute(e, t = null) {
+    this.focus(), document.execCommand(e, !1, t ?? void 0), this.editableElement.dispatchEvent(new Event("input", { bubbles: !0 }));
+  }
+  /**
+   * Recursively removes a style property from all elements in a fragment.
+   */
+  clearStyleRecursive(e, t) {
+    const i = document.createTreeWalker(e, NodeFilter.SHOW_ELEMENT);
+    let o = i.nextNode();
+    for (; o; )
+      o.style.getPropertyValue(t) && o.style.removeProperty(t), o = i.nextNode();
+  }
+  /**
+   * Applies an inline style to the selection.
+   * This is used for properties like font-size (px) and font-family
+   * where execCommand is outdated or limited.
+   */
+  setStyle(e, t, i) {
+    if (e === "font-size") {
+      const n = parseInt(t, 10);
+      isNaN(n) || (t = `${Math.max(1, Math.min(100, n))}px`);
+    }
+    if (!i) {
+      const n = window.getSelection();
+      if (!n || n.rangeCount === 0) return null;
+      i = n.getRangeAt(0);
+    }
+    if (i.collapsed)
+      return this.pendingStyles[e] = t, i;
+    let o = i.commonAncestorContainer;
+    o.nodeType === Node.TEXT_NODE && (o = o.parentElement);
+    let a = null;
+    if (o.tagName === "SPAN" && o.children.length === 0 && o.textContent === i.toString())
+      o.style.setProperty(e, t), a = i.cloneRange();
+    else {
+      const n = document.createElement("span");
+      n.style.setProperty(e, t);
+      try {
+        const r = o.tagName === "SPAN" ? o : null, y = i.extractContents();
+        this.clearStyleRecursive(y, e), n.appendChild(y), i.insertNode(n), r && r.innerHTML === "" && r.remove();
+        const l = document.createRange();
+        l.selectNodeContents(n), a = l;
+        const c = window.getSelection();
+        c && c.rangeCount > 0 && (c.removeAllRanges(), c.addRange(l));
+      } catch (r) {
+        console.warn("Failed to apply style:", r);
+      }
+    }
+    return this.editableElement.dispatchEvent(new Event("input", { bubbles: !0 })), a;
+  }
+  /**
+   * Creates a link at the current selection.
+   * Ensures the link opens in a new tab with proper security attributes.
+   */
+  createLink(e) {
+    this.focus(), !/^https?:\/\//i.test(e) && !/^mailto:/i.test(e) && !e.startsWith("#") && (e = "https://" + e), document.execCommand("createLink", !1, e);
+    const t = window.getSelection();
+    if (t && t.rangeCount > 0) {
+      let o = t.getRangeAt(0).commonAncestorContainer;
+      o.nodeType === Node.TEXT_NODE && (o = o.parentElement);
+      let a = null;
+      o.tagName === "A" ? a = o : a = o.querySelector("a"), a && (a.setAttribute("target", "_blank"), a.setAttribute("rel", "noopener noreferrer"));
+    }
+    this.editableElement.dispatchEvent(new Event("input", { bubbles: !0 }));
+  }
+  /**
+   * Returns the clean HTML content of the editor.
+   */
+  getHTML() {
+    return this.editableElement.innerHTML;
+  }
+  /**
+   * Sets the HTML content of the editor.
+   */
+  setHTML(e) {
+    this.editableElement.innerHTML = e;
+  }
+  /**
+   * Internal access to the editable element.
+   */
+  get el() {
+    return this.editableElement;
+  }
+}
+const h = {
+  type: "button",
+  title: "Undo",
+  command: "undo",
+  icon: '<svg viewBox="0 0 24 24"><path d="M9 14L4 9l5-5"></path><path d="M20 20v-7a4 4 0 0 0-4-4H4"></path></svg>'
+}, u = {
+  type: "button",
+  title: "Redo",
+  command: "redo",
+  icon: '<svg viewBox="0 0 24 24"><path d="M15 14l5-5-5-5"></path><path d="M4 20v-7a4 4 0 0 1 4-4h12"></path></svg>'
+}, p = {
+  type: "select",
+  title: "Heading",
+  command: "formatBlock",
+  options: [
+    { label: "Paragraph", value: "P" },
+    { label: "Heading 1", value: "H1" },
+    { label: "Heading 2", value: "H2" },
+    { label: "Heading 3", value: "H3" },
+    { label: "Heading 4", value: "H4" },
+    { label: "Heading 5", value: "H5" },
+    { label: "Heading 6", value: "H6" }
+  ]
+}, v = {
+  type: "select",
+  title: "Font",
+  command: "fontFamily",
+  options: [
+    { label: "Inter", value: "'Inter', sans-serif" },
+    { label: "Arial", value: "Arial, sans-serif" },
+    { label: "Georgia", value: "Georgia, serif" },
+    { label: "Courier", value: "'Courier New', monospace" },
+    { label: "Times New Roman", value: "'Times New Roman', serif" },
+    { label: "Verdana", value: "Verdana, sans-serif" },
+    { label: "Tahoma", value: "Tahoma, sans-serif" },
+    { label: "Roboto", value: "'Roboto', sans-serif" },
+    { label: "Open Sans", value: "'Open Sans', sans-serif" },
+    { label: "Montserrat", value: "'Montserrat', sans-serif" },
+    { label: "Lato", value: "'Lato', sans-serif" },
+    { label: "Poppins", value: "'Poppins', sans-serif" },
+    { label: "Oswald", value: "'Oswald', sans-serif" },
+    { label: "Playfair Display", value: "'Playfair Display', serif" },
+    { label: "Merriweather", value: "'Merriweather', serif" }
+  ]
+}, b = {
+  type: "input",
+  title: "Size (px)",
+  command: "fontSize",
+  placeholder: "Size",
+  value: "16"
+}, f = {
+  type: "button",
+  title: "Bold",
+  command: "bold",
+  icon: '<svg viewBox="0 0 24 24"><path d="M6 4h8a4 4 0 0 1 4 4 4 4 0 0 1-4 4H6z"></path><path d="M6 12h9a4 4 0 0 1 4 4 4 4 0 0 1-4 4H6z"></path></svg>'
+}, S = {
+  type: "button",
+  title: "Italic",
+  command: "italic",
+  icon: '<svg viewBox="0 0 24 24"><line x1="19" y1="4" x2="10" y2="4"></line><line x1="14" y1="20" x2="5" y2="20"></line><line x1="15" y1="4" x2="9" y2="20"></line></svg>'
+}, x = {
+  type: "button",
+  title: "Underline",
+  command: "underline",
+  icon: '<svg viewBox="0 0 24 24"><path d="M6 3v7a6 6 0 0 0 6 6 6 6 0 0 0 6-6V3"></path><line x1="4" y1="21" x2="20" y2="21"></line></svg>'
+}, w = {
+  type: "button",
+  title: "Strikethrough",
+  command: "strikeThrough",
+  icon: '<svg viewBox="0 0 24 24"><line x1="5" y1="12" x2="19" y2="12"></line><path d="M16 4.9C15.1 4.3 13.9 4 12.6 4c-3.1 0-5.6 1.8-5.6 4s1.8 3.3 4.4 3.8"></path><path d="M7 19.1c.9.6 2.1.9 3.4.9 3.1 0 5.6-1.8 5.6-4s-1.8-3.3-4.4-3.8"></path></svg>'
+}, A = {
+  type: "color-picker",
+  title: "Text Color",
+  command: "foreColor",
+  value: "#1e293b"
+}, k = {
+  type: "color-picker",
+  title: "Highlight Color",
+  command: "backColor",
+  value: "#ffffff"
+}, E = {
+  type: "button",
+  title: "Align Left",
+  command: "justifyLeft",
+  icon: '<svg viewBox="0 0 24 24"><line x1="17" y1="10" x2="3" y2="10"></line><line x1="21" y1="6" x2="3" y2="6"></line><line x1="21" y1="14" x2="3" y2="14"></line><line x1="17" y1="18" x2="3" y2="18"></line></svg>'
+}, F = {
+  type: "button",
+  title: "Align Center",
+  command: "justifyCenter",
+  icon: '<svg viewBox="0 0 24 24"><line x1="18" y1="10" x2="6" y2="10"></line><line x1="21" y1="6" x2="3" y2="6"></line><line x1="21" y1="14" x2="3" y2="14"></line><line x1="18" y1="18" x2="6" y2="18"></line></svg>'
+}, L = {
+  type: "button",
+  title: "Align Right",
+  command: "justifyRight",
+  icon: '<svg viewBox="0 0 24 24"><line x1="21" y1="10" x2="7" y2="10"></line><line x1="21" y1="6" x2="3" y2="6"></line><line x1="21" y1="14" x2="3" y2="14"></line><line x1="21" y1="18" x2="7" y2="18"></line></svg>'
+}, C = {
+  type: "button",
+  title: "Justify",
+  command: "justifyFull",
+  icon: '<svg viewBox="0 0 24 24"><line x1="21" y1="10" x2="3" y2="10"></line><line x1="21" y1="6" x2="3" y2="6"></line><line x1="21" y1="14" x2="3" y2="14"></line><line x1="21" y1="18" x2="3" y2="18"></line></svg>'
+}, H = {
+  type: "button",
+  title: "Bulleted List",
+  command: "insertUnorderedList",
+  icon: '<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><line x1="8" y1="6" x2="21" y2="6"></line><line x1="8" y1="12" x2="21" y2="12"></line><line x1="8" y1="18" x2="21" y2="18"></line><circle cx="3" cy="6" r="1" fill="currentColor"></circle><circle cx="3" cy="12" r="1" fill="currentColor"></circle><circle cx="3" cy="18" r="1" fill="currentColor"></circle></svg>'
+}, T = {
+  type: "button",
+  title: "Numbered List",
+  command: "insertOrderedList",
+  icon: '<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><line x1="10" y1="6" x2="21" y2="6"></line><line x1="10" y1="12" x2="21" y2="21"></line><line x1="10" y1="18" x2="21" y2="18"></line><path d="M4 6h1v4"></path><path d="M4 10h2"></path><path d="M6 18H4c0-1 2-2 2-3s-1-1.5-2-1"></path></svg>'
+}, R = {
+  type: "button",
+  title: "Outdent",
+  command: "outdent",
+  icon: '<svg viewBox="0 0 24 24"><polyline points="15 18 9 12 15 6"></polyline><line x1="21" y1="12" x2="9" y2="12"></line><line x1="21" y1="6" x2="3" y2="6"></line><line x1="21" y1="18" x2="3" y2="18"></line></svg>'
+}, O = {
+  type: "button",
+  title: "Indent",
+  command: "indent",
+  icon: '<svg viewBox="0 0 24 24"><polyline points="9 18 15 12 9 6"></polyline><line x1="3" y1="12" x2="15" y2="12"></line><line x1="3" y1="6" x2="21" y2="6"></line><line x1="3" y1="18" x2="21" y2="18"></line></svg>'
+}, M = {
+  type: "button",
+  title: "Horizontal Rule",
+  command: "insertHorizontalRule",
+  icon: '<svg viewBox="0 0 24 24"><line x1="5" y1="12" x2="19" y2="12"></line></svg>'
+}, I = {
+  type: "button",
+  title: "Clear Formatting",
+  command: "removeFormat",
+  icon: '<svg viewBox="0 0 24 24"><path d="M17.41 15.41L12 10l-5.41 5.41L5.17 14l5.41-5.41L5.17 3.17 6.59 1.76 12 7.17l5.41-5.41 1.41 1.41-5.41 5.41 5.41 5.41-1.41 1.42z"></path></svg>'
+}, P = {
+  type: "button",
+  title: "Insert Emoji",
+  command: "insertEmoji",
+  icon: '<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><circle cx="12" cy="12" r="10"></circle><path d="M8 14s1.5 2 4 2 4-2 4-2"></path><line x1="9" y1="9" x2="9.01" y2="9"></line><line x1="15" y1="9" x2="15.01" y2="9"></line></svg>'
+}, B = {
+  type: "button",
+  title: "Insert Link",
+  command: "createLink",
+  icon: '<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M10 13a5 5 0 0 0 7.54.54l3-3a5 5 0 0 0-7.07-7.07l-1.72 1.71"></path><path d="M14 11a5 5 0 0 0-7.54-.54l-3 3a5 5 0 0 0 7.07 7.07l1.71-1.71"></path></svg>'
+}, m = { type: "divider", title: "" }, N = [
+  h,
+  u,
+  m,
+  p,
+  v,
+  b,
+  m,
+  f,
+  S,
+  x,
+  w,
+  m,
+  A,
+  k,
+  m,
+  E,
+  F,
+  L,
+  C,
+  m,
+  H,
+  T,
+  R,
+  O,
+  m,
+  M,
+  P,
+  B,
+  I
+], d = [
+  // Smileys & Emotion
+  { emoji: "😀", name: "grinning", category: "Smileys" },
+  { emoji: "😃", name: "smiley", category: "Smileys" },
+  { emoji: "😄", name: "smile", category: "Smileys" },
+  { emoji: "😁", name: "grin", category: "Smileys" },
+  { emoji: "😆", name: "laughing", category: "Smileys" },
+  { emoji: "😅", name: "sweat smile", category: "Smileys" },
+  { emoji: "🤣", name: "rofl", category: "Smileys" },
+  { emoji: "😂", name: "joy", category: "Smileys" },
+  { emoji: "🙂", name: "slight smile", category: "Smileys" },
+  { emoji: "🙃", name: "upside down", category: "Smileys" },
+  { emoji: "😉", name: "wink", category: "Smileys" },
+  { emoji: "😊", name: "blush", category: "Smileys" },
+  { emoji: "😇", name: "innocent", category: "Smileys" },
+  { emoji: "🥰", name: "smiling face with hearts", category: "Smileys" },
+  { emoji: "😍", name: "heart eyes", category: "Smileys" },
+  { emoji: "🤩", name: "star struck", category: "Smileys" },
+  { emoji: "😘", name: "kissing heart", category: "Smileys" },
+  { emoji: "😗", name: "kissing", category: "Smileys" },
+  { emoji: "😚", name: "kissing closed eyes", category: "Smileys" },
+  { emoji: "😋", name: "yum", category: "Smileys" },
+  { emoji: "😛", name: "stuck out tongue", category: "Smileys" },
+  { emoji: "😜", name: "stuck out tongue winking eye", category: "Smileys" },
+  { emoji: "🤪", name: "zany face", category: "Smileys" },
+  { emoji: "🤨", name: "raised eyebrow", category: "Smileys" },
+  { emoji: "🧐", name: "monocle", category: "Smileys" },
+  { emoji: "🤓", name: "nerd", category: "Smileys" },
+  { emoji: "😎", name: "sunglasses", category: "Smileys" },
+  { emoji: "🥳", name: "partying face", category: "Smileys" },
+  { emoji: "😏", name: "smirk", category: "Smileys" },
+  { emoji: "😒", name: "unamused", category: "Smileys" },
+  { emoji: "😞", name: "disappointed", category: "Smileys" },
+  { emoji: "😔", name: "pensive", category: "Smileys" },
+  { emoji: "😟", name: "worried", category: "Smileys" },
+  { emoji: "😕", name: "confused", category: "Smileys" },
+  { emoji: "😫", name: "tired", category: "Smileys" },
+  { emoji: "🥵", name: "hot face", category: "Smileys" },
+  { emoji: "🥶", name: "cold face", category: "Smileys" },
+  { emoji: "😳", name: "flushed", category: "Smileys" },
+  { emoji: "😱", name: "scream", category: "Smileys" },
+  { emoji: "🤢", name: "nauseated", category: "Smileys" },
+  { emoji: "🤮", name: "vomiting", category: "Smileys" },
+  { emoji: "🤬", name: "cursing", category: "Smileys" },
+  { emoji: "🤫", name: "shushing", category: "Smileys" },
+  { emoji: "🤔", name: "thinking", category: "Smileys" },
+  { emoji: "🤗", name: "hugs", category: "Smileys" },
+  { emoji: "🥱", name: "yawn", category: "Smileys" },
+  { emoji: "😴", name: "sleeping", category: "Smileys" },
+  { emoji: "🤤", name: "drooling", category: "Smileys" },
+  { emoji: "😵", name: "dizzy", category: "Smileys" },
+  { emoji: "🤐", name: "zipper mouth", category: "Smileys" },
+  { emoji: "🥴", name: "woozy", category: "Smileys" },
+  { emoji: "🤒", name: "fever", category: "Smileys" },
+  { emoji: "🤕", name: "bandage", category: "Smileys" },
+  { emoji: "🤡", name: "clown", category: "Smileys" },
+  { emoji: "👻", name: "ghost", category: "Smileys" },
+  { emoji: "👽", name: "alien", category: "Smileys" },
+  { emoji: "👾", name: "robot", category: "Smileys" },
+  { emoji: "💩", name: "poop", category: "Smileys" },
+  // Hearts & Symbols
+  { emoji: "❤️", name: "heart", category: "Symbols" },
+  { emoji: "🧡", name: "orange heart", category: "Symbols" },
+  { emoji: "💛", name: "yellow heart", category: "Symbols" },
+  { emoji: "💚", name: "green heart", category: "Symbols" },
+  { emoji: "💙", name: "blue heart", category: "Symbols" },
+  { emoji: "💜", name: "purple heart", category: "Symbols" },
+  { emoji: "🖤", name: "black heart", category: "Symbols" },
+  { emoji: "🤍", name: "white heart", category: "Symbols" },
+  { emoji: "🤎", name: "brown heart", category: "Symbols" },
+  { emoji: "💔", name: "broken heart", category: "Symbols" },
+  { emoji: "❣️", name: "heart exclamation", category: "Symbols" },
+  { emoji: "💕", name: "two hearts", category: "Symbols" },
+  { emoji: "💞", name: "revolving hearts", category: "Symbols" },
+  { emoji: "✨", name: "sparkles", category: "Symbols" },
+  { emoji: "🔥", name: "fire", category: "Symbols" },
+  { emoji: "⭐", name: "star", category: "Symbols" },
+  { emoji: "🌟", name: "glowing star", category: "Symbols" },
+  { emoji: "✅", name: "check", category: "Symbols" },
+  { emoji: "❌", name: "cross", category: "Symbols" },
+  { emoji: "💯", name: "hundred", category: "Symbols" },
+  { emoji: "💢", name: "anger", category: "Symbols" },
+  { emoji: "💥", name: "collision", category: "Symbols" },
+  { emoji: "💫", name: "dizzy symbol", category: "Symbols" },
+  { emoji: "💦", name: "sweat drops", category: "Symbols" },
+  { emoji: "💨", name: "dash", category: "Symbols" },
+  // Hand Gestures
+  { emoji: "👍", name: "thumbs up", category: "Hands" },
+  { emoji: "👎", name: "thumbs down", category: "Hands" },
+  { emoji: "👌", name: "ok", category: "Hands" },
+  { emoji: "✌️", name: "victory", category: "Hands" },
+  { emoji: "🤞", name: "fingers crossed", category: "Hands" },
+  { emoji: "🤟", name: "rock on", category: "Hands" },
+  { emoji: "🤘", name: "horns", category: "Hands" },
+  { emoji: "🤙", name: "call me", category: "Hands" },
+  { emoji: "👈", name: "point left", category: "Hands" },
+  { emoji: "👉", name: "point right", category: "Hands" },
+  { emoji: "👆", name: "point up", category: "Hands" },
+  { emoji: "👇", name: "point down", category: "Hands" },
+  { emoji: "🖐️", name: "hand splayed", category: "Hands" },
+  { emoji: "✋", name: "raised hand", category: "Hands" },
+  { emoji: "🖖", name: "vulcan salute", category: "Hands" },
+  { emoji: "👋", name: "wave", category: "Hands" },
+  { emoji: "👏", name: "clap", category: "Hands" },
+  { emoji: "🙌", name: "hands up", category: "Hands" },
+  { emoji: "👐", name: "open hands", category: "Hands" },
+  { emoji: "🤲", name: "palms up", category: "Hands" },
+  { emoji: "🤝", name: "handshake", category: "Hands" },
+  { emoji: "🙏", name: "pray", category: "Hands" },
+  { emoji: "💪", name: "flex", category: "Hands" },
+  { emoji: "✍️", name: "writing", category: "Hands" },
+  { emoji: "🤳", name: "selfie", category: "Hands" },
+  // Animals & Nature
+  { emoji: "🐶", name: "dog", category: "Animals" },
+  { emoji: "🐱", name: "cat", category: "Animals" },
+  { emoji: "🐭", name: "mouse", category: "Animals" },
+  { emoji: "🐹", name: "hamster", category: "Animals" },
+  { emoji: "🐰", name: "rabbit", category: "Animals" },
+  { emoji: "🦊", name: "fox", category: "Animals" },
+  { emoji: "🐻", name: "bear", category: "Animals" },
+  { emoji: "🐼", name: "panda", category: "Animals" },
+  { emoji: "🐨", name: "koala", category: "Animals" },
+  { emoji: "🐯", name: "tiger", category: "Animals" },
+  { emoji: "🦁", name: "lion", category: "Animals" },
+  { emoji: "🐮", name: "cow", category: "Animals" },
+  { emoji: "🐷", name: "pig", category: "Animals" },
+  { emoji: "🐸", name: "frog", category: "Animals" },
+  { emoji: "🐵", name: "monkey", category: "Animals" },
+  { emoji: "🐔", name: "chicken", category: "Animals" },
+  { emoji: "🐧", name: "penguin", category: "Animals" },
+  { emoji: "🐦", name: "bird", category: "Animals" },
+  { emoji: "🐤", name: "chick", category: "Animals" },
+  { emoji: "🦆", name: "duck", category: "Animals" },
+  { emoji: "🦅", name: "eagle", category: "Animals" },
+  { emoji: "🦉", name: "owl", category: "Animals" },
+  { emoji: "🦇", name: "bat", category: "Animals" },
+  { emoji: "🦄", name: "unicorn", category: "Animals" },
+  { emoji: "🐝", name: "bee", category: "Animals" },
+  { emoji: "🦋", name: "butterfly", category: "Animals" },
+  { emoji: "🐌", name: "snail", category: "Animals" },
+  { emoji: "🐞", name: "ladybeetle", category: "Animals" },
+  { emoji: "🐢", name: "turtle", category: "Animals" },
+  { emoji: "🐍", name: "snake", category: "Animals" },
+  { emoji: "🐙", name: "octopus", category: "Animals" },
+  { emoji: "🐬", name: "dolphin", category: "Animals" },
+  { emoji: "🐳", name: "whale", category: "Animals" },
+  { emoji: "🐟", name: "fish", category: "Animals" },
+  { emoji: "🦓", name: "zebra", category: "Animals" },
+  { emoji: "🦒", name: "giraffe", category: "Animals" },
+  { emoji: "🐘", name: "elephant", category: "Animals" },
+  { emoji: "🦏", name: "rhino", category: "Animals" },
+  { emoji: "🐪", name: "camel", category: "Animals" },
+  { emoji: "🐒", name: "monkey", category: "Animals" },
+  // Food & Drink
+  { emoji: "🍎", name: "apple", category: "Food" },
+  { emoji: "🍐", name: "pear", category: "Food" },
+  { emoji: "🍊", name: "tangerine", category: "Food" },
+  { emoji: "🍋", name: "lemon", category: "Food" },
+  { emoji: "🍌", name: "banana", category: "Food" },
+  { emoji: "🍉", name: "watermelon", category: "Food" },
+  { emoji: "🍇", name: "grapes", category: "Food" },
+  { emoji: "🍓", name: "strawberry", category: "Food" },
+  { emoji: "🍒", name: "cherries", category: "Food" },
+  { emoji: "🍑", name: "peach", category: "Food" },
+  { emoji: "🥭", name: "mango", category: "Food" },
+  { emoji: "🍍", name: "pineapple", category: "Food" },
+  { emoji: "🥥", name: "coconut", category: "Food" },
+  { emoji: "🥝", name: "kiwi", category: "Food" },
+  { emoji: "🍅", name: "tomato", category: "Food" },
+  { emoji: "🥑", name: "avocado", category: "Food" },
+  { emoji: "🍆", name: "eggplant", category: "Food" },
+  { emoji: "🥔", name: "potato", category: "Food" },
+  { emoji: "🥕", name: "carrot", category: "Food" },
+  { emoji: "🌽", name: "corn", category: "Food" },
+  { emoji: "🌶️", name: "hot pepper", category: "Food" },
+  { emoji: "🥦", name: "broccoli", category: "Food" },
+  { emoji: "🍄", name: "mushroom", category: "Food" },
+  { emoji: "🥜", name: "peanuts", category: "Food" },
+  { emoji: "🍞", name: "bread", category: "Food" },
+  { emoji: "🥐", name: "croissant", category: "Food" },
+  { emoji: "🥯", name: "bagel", category: "Food" },
+  { emoji: "🥞", name: "pancakes", category: "Food" },
+  { emoji: "🧀", name: "cheese", category: "Food" },
+  { emoji: "🍖", name: "meat", category: "Food" },
+  { emoji: "🍗", name: "poultry leg", category: "Food" },
+  { emoji: "🥓", name: "bacon", category: "Food" },
+  { emoji: "🍔", name: "hamburger", category: "Food" },
+  { emoji: "🍟", name: "fries", category: "Food" },
+  { emoji: "🍕", name: "pizza", category: "Food" },
+  { emoji: "🌭", name: "hot dog", category: "Food" },
+  { emoji: "🥪", name: "sandwich", category: "Food" },
+  { emoji: "🌮", name: "taco", category: "Food" },
+  { emoji: "🌯", name: "burrito", category: "Food" },
+  { emoji: "🍳", name: "egg", category: "Food" },
+  { emoji: "🍲", name: "stew", category: "Food" },
+  { emoji: "🥣", name: "bowl", category: "Food" },
+  { emoji: "🥗", name: "salad", category: "Food" },
+  { emoji: "🍿", name: "popcorn", category: "Food" },
+  { emoji: "🍱", name: "bento", category: "Food" },
+  { emoji: "🍣", name: "sushi", category: "Food" },
+  { emoji: "🍤", name: "shrimp", category: "Food" },
+  { emoji: "🍦", name: "ice cream", category: "Food" },
+  { emoji: "🍧", name: "shaved ice", category: "Food" },
+  { emoji: "🍨", name: "ice cream", category: "Food" },
+  { emoji: "🍩", name: "donut", category: "Food" },
+  { emoji: "🍪", name: "cookie", category: "Food" },
+  { emoji: "🎂", name: "cake", category: "Food" },
+  { emoji: "🍰", name: "shortcake", category: "Food" },
+  { emoji: "🧁", name: "cupcake", category: "Food" },
+  { emoji: "🥧", name: "pie", category: "Food" },
+  { emoji: "🍫", name: "chocolate", category: "Food" },
+  { emoji: "🍬", name: "candy", category: "Food" },
+  { emoji: "🍭", name: "lollipop", category: "Food" },
+  { emoji: "🍮", name: "custard", category: "Food" },
+  { emoji: "🍯", name: "honey", category: "Food" },
+  { emoji: "🍼", name: "baby bottle", category: "Food" },
+  { emoji: "🥛", name: "milk", category: "Food" },
+  { emoji: "☕", name: "coffee", category: "Food" },
+  { emoji: "🍵", name: "tea", category: "Food" },
+  { emoji: "🍶", name: "sake", category: "Food" },
+  { emoji: "🍾", name: "champagne", category: "Food" },
+  { emoji: "🍷", name: "wine", category: "Food" },
+  { emoji: "🍸", name: "cocktail", category: "Food" },
+  { emoji: "🍹", name: "tropical drink", category: "Food" },
+  { emoji: "🍺", name: "beer", category: "Food" },
+  { emoji: "🍻", name: "beers", category: "Food" },
+  { emoji: "🥃", name: "tumbler glass", category: "Food" },
+  { emoji: "🥤", name: "soda", category: "Food" },
+  // Travel & Places
+  { emoji: "🚗", name: "car", category: "Travel" },
+  { emoji: "🚕", name: "taxi", category: "Travel" },
+  { emoji: "🚙", name: "bus", category: "Travel" },
+  { emoji: "🚌", name: "trolleybus", category: "Travel" },
+  { emoji: "🏎️", name: "racing car", category: "Travel" },
+  { emoji: "🚓", name: "police car", category: "Travel" },
+  { emoji: "🚑", name: "ambulance", category: "Travel" },
+  { emoji: "🚒", name: "fire engine", category: "Travel" },
+  { emoji: "🚐", name: "minibus", category: "Travel" },
+  { emoji: "🚚", name: "truck", category: "Travel" },
+  { emoji: "🚛", name: "articulated lorry", category: "Travel" },
+  { emoji: "🚜", name: "tractor", category: "Travel" },
+  { emoji: "🚲", name: "bicycle", category: "Travel" },
+  { emoji: "🛵", name: "scooter", category: "Travel" },
+  { emoji: "🏍️", name: "motorcycle", category: "Travel" },
+  { emoji: "🚄", name: "bullet train", category: "Travel" },
+  { emoji: "🚆", name: "train", category: "Travel" },
+  { emoji: "✈️", name: "airplane", category: "Travel" },
+  { emoji: "🚀", name: "rocket", category: "Travel" },
+  { emoji: "🛸", name: "ufo", category: "Travel" },
+  { emoji: "🚁", name: "helicopter", category: "Travel" },
+  { emoji: "🚢", name: "ship", category: "Travel" },
+  { emoji: "⛵", name: "sailboat", category: "Travel" },
+  { emoji: "⚓", name: "anchor", category: "Travel" },
+  { emoji: "⛽", name: "fuel pump", category: "Travel" },
+  { emoji: "🚦", name: "traffic light", category: "Travel" },
+  // Objects & Tools
+  { emoji: "💻", name: "laptop", category: "Objects" },
+  { emoji: "📱", name: "mobile", category: "Objects" },
+  { emoji: "☎️", name: "telephone", category: "Objects" },
+  { emoji: "⌨️", name: "keyboard", category: "Objects" },
+  { emoji: "🖥️", name: "desktop", category: "Objects" },
+  { emoji: "🖨️", name: "printer", category: "Objects" },
+  { emoji: "📸", name: "camera", category: "Objects" },
+  { emoji: "🎥", name: "video camera", category: "Objects" },
+  { emoji: "📺", name: "tv", category: "Objects" },
+  { emoji: "📻", name: "radio", category: "Objects" },
+  { emoji: "⏰", name: "alarm clock", category: "Objects" },
+  { emoji: "💡", name: "light bulb", category: "Objects" },
+  { emoji: "🔦", name: "flashlight", category: "Objects" },
+  { emoji: "🕯️", name: "candle", category: "Objects" },
+  { emoji: "🔨", name: "hammer", category: "Objects" },
+  { emoji: "🔧", name: "wrench", category: "Objects" },
+  { emoji: "🔩", name: "nut and bolt", category: "Objects" },
+  { emoji: "🔫", name: "water pistol", category: "Objects" },
+  { emoji: "💸", name: "money", category: "Objects" },
+  { emoji: "💵", name: "dollar bill", category: "Objects" },
+  { emoji: "💳", name: "credit card", category: "Objects" },
+  { emoji: "💎", name: "gem", category: "Objects" },
+  { emoji: "⚖️", name: "balance scale", category: "Objects" },
+  { emoji: "🔗", name: "link", category: "Objects" },
+  { emoji: "⛓️", name: "chains", category: "Objects" },
+  { emoji: "💉", name: "syringe", category: "Objects" },
+  { emoji: "💊", name: "pill", category: "Objects" },
+  { emoji: "🚪", name: "door", category: "Objects" },
+  { emoji: "🛏️", name: "bed", category: "Objects" },
+  { emoji: "🛋️", name: "couch", category: "Objects" },
+  { emoji: "🚿", name: "shower", category: "Objects" },
+  { emoji: "🛁", name: "bathtub", category: "Objects" },
+  { emoji: "🔑", name: "key", category: "Objects" },
+  { emoji: "🧹", name: "broom", category: "Objects" },
+  // Activities & Hobbies
+  { emoji: "⚽", name: "soccer", category: "Activities" },
+  { emoji: "🏀", name: "basketball", category: "Activities" },
+  { emoji: "🏈", name: "football", category: "Activities" },
+  { emoji: "⚾", name: "baseball", category: "Activities" },
+  { emoji: "🎾", name: "tennis", category: "Activities" },
+  { emoji: "🏐", name: "volleyball", category: "Activities" },
+  { emoji: "🏉", name: "rugby", category: "Activities" },
+  { emoji: "🎱", name: "pool", category: "Activities" },
+  { emoji: "⛳", name: "golf", category: "Activities" },
+  { emoji: "🪁", name: "kite", category: "Activities" },
+  { emoji: "🏹", name: "bow and arrow", category: "Activities" },
+  { emoji: "🎣", name: "fishing", category: "Activities" },
+  { emoji: "🥊", name: "boxing", category: "Activities" },
+  { emoji: "🥋", name: "martial arts", category: "Activities" },
+  { emoji: "⛸️", name: "ice skate", category: "Activities" },
+  { emoji: "🎿", name: "ski", category: "Activities" },
+  { emoji: "🏂", name: "snowboard", category: "Activities" },
+  { emoji: "🏋️", name: "weightlifter", category: "Activities" },
+  { emoji: "🤺", name: "fencing", category: "Activities" },
+  { emoji: "🤼", name: "wrestling", category: "Activities" },
+  { emoji: "🤸", name: "cartwheel", category: "Activities" },
+  { emoji: "🏆", name: "trophy", category: "Activities" },
+  { emoji: "🏅", name: "medal", category: "Activities" },
+  { emoji: "🥇", name: "first place", category: "Activities" },
+  { emoji: "🎟️", name: "ticket", category: "Activities" },
+  { emoji: "🎮", name: "video game", category: "Activities" },
+  { emoji: "🎲", name: "die", category: "Activities" },
+  { emoji: "♟️", name: "chess", category: "Activities" },
+  { emoji: "🎹", name: "piano", category: "Activities" },
+  { emoji: "🎸", name: "guitar", category: "Activities" },
+  { emoji: "🎺", name: "trumpet", category: "Activities" },
+  { emoji: "🎻", name: "violin", category: "Activities" },
+  { emoji: "🥁", name: "drum", category: "Activities" },
+  { emoji: "🎭", name: "performing arts", category: "Activities" },
+  { emoji: "🎨", name: "artist palette", category: "Activities" },
+  { emoji: "🎬", name: "clapper board", category: "Activities" },
+  { emoji: "🎤", name: "microphone", category: "Activities" },
+  { emoji: "🎧", name: "headphone", category: "Activities" }
+];
+class z {
+  container;
+  searchInput;
+  emojiGrid;
+  onSelect;
+  onClose;
+  constructor(e, t) {
+    this.onSelect = e, this.onClose = t, this.container = this.createPickerElement(), this.searchInput = this.container.querySelector(".te-emoji-search"), this.emojiGrid = this.container.querySelector(".te-emoji-grid"), this.setupEvents(), this.renderEmojis(d);
+  }
+  createPickerElement() {
+    const e = document.createElement("div");
+    return e.classList.add("te-emoji-picker"), e.innerHTML = `
+      <div class="te-emoji-header">
+        <input type="text" class="te-emoji-search" placeholder="Search emoji...">
+      </div>
+      <div class="te-emoji-body">
+        <div class="te-emoji-grid"></div>
+      </div>
+    `, e;
+  }
+  setupEvents() {
+    this.searchInput.addEventListener("mousedown", (t) => t.stopPropagation()), this.searchInput.addEventListener("click", (t) => t.stopPropagation()), this.searchInput.addEventListener("input", () => {
+      const t = this.searchInput.value.toLowerCase(), i = d.filter(
+        (o) => o.name.toLowerCase().includes(t) || o.category.toLowerCase().includes(t)
+      );
+      this.renderEmojis(i);
+    });
+    const e = (t) => {
+      this.container.contains(t.target) || (this.close(), document.removeEventListener("mousedown", e));
+    };
+    setTimeout(() => document.addEventListener("mousedown", e), 0);
+  }
+  renderEmojis(e) {
+    if (this.emojiGrid.innerHTML = "", e.length === 0) {
+      this.emojiGrid.innerHTML = '<div class="te-emoji-empty">No emoji found</div>';
+      return;
+    }
+    this.searchInput.value.length > 0 ? this.renderGridItems(e) : ["Smileys", "Symbols", "Hands", "Animals", "Food", "Travel", "Objects", "Activities"].forEach((o) => {
+      const a = e.filter((n) => n.category === o);
+      if (a.length > 0) {
+        const n = document.createElement("div");
+        n.classList.add("te-emoji-category-title"), n.textContent = o, this.emojiGrid.appendChild(n), this.renderGridItems(a);
+      }
+    });
+  }
+  renderGridItems(e) {
+    e.forEach((t) => {
+      const i = document.createElement("button");
+      i.type = "button", i.classList.add("te-emoji-item"), i.textContent = t.emoji, i.title = t.name, i.addEventListener("click", () => {
+        this.onSelect(t.emoji), this.close();
+      }), this.emojiGrid.appendChild(i);
+    });
+  }
+  show(e) {
+    document.body.appendChild(this.container);
+    const t = e.getBoundingClientRect(), i = 280;
+    let o = t.bottom + window.scrollY + 5, a = t.left + window.scrollX;
+    a + i > window.innerWidth && (a = window.innerWidth - i - 10), this.container.style.top = `${o}px`, this.container.style.left = `${a}px`, this.searchInput.focus();
+  }
+  close() {
+    this.container.parentElement && (this.container.remove(), this.onClose());
+  }
+  get el() {
+    return this.container;
+  }
+}
+class G {
+  editor;
+  container;
+  savedRange = null;
+  items = N;
+  activePicker = null;
+  constructor(e) {
+    this.editor = e, this.container = this.createToolbarElement(), this.render();
+  }
+  createToolbarElement() {
+    const e = document.createElement("div");
+    return e.classList.add("te-toolbar"), e;
+  }
+  render() {
+    this.items.forEach((e) => {
+      if (e.type === "button")
+        this.renderButton(e);
+      else if (e.type === "select")
+        this.renderSelect(e);
+      else if (e.type === "input")
+        this.renderInput(e);
+      else if (e.type === "color-picker")
+        this.renderColorPicker(e);
+      else if (e.type === "divider") {
+        const t = document.createElement("div");
+        t.classList.add("te-divider"), this.container.appendChild(t);
+      }
+    }), this.editor.el.addEventListener("keyup", () => this.updateActiveStates()), this.editor.el.addEventListener("mouseup", () => this.updateActiveStates());
+  }
+  renderButton(e) {
+    const t = document.createElement("button");
+    t.classList.add("te-button"), t.innerHTML = e.icon || "", t.title = e.title, t.addEventListener("mousedown", (i) => {
+      if (i.preventDefault(), e.command === "insertEmoji") {
+        this.activePicker ? this.activePicker.close() : (this.activePicker = new z(
+          (o) => {
+            this.editor.execute("insertText", o);
+          },
+          () => {
+            this.activePicker = null;
+          }
+        ), this.activePicker.show(t));
+        return;
+      }
+      if (e.command === "createLink") {
+        const o = window.prompt("Enter the URL");
+        o && this.editor.createLink(o);
+        return;
+      }
+      e.command && this.editor.execute(e.command, e.value || null), this.updateActiveStates();
+    }), this.container.appendChild(t);
+  }
+  renderInput(e) {
+    const t = document.createElement("input");
+    t.type = "number", t.classList.add("te-input"), t.title = e.title, t.value = e.value || "", t.min = "1", t.max = "100";
+    const i = () => {
+      const a = window.getSelection();
+      if (a && a.rangeCount > 0) {
+        const n = a.getRangeAt(0);
+        this.editor.el.contains(n.commonAncestorContainer) && (this.savedRange = n.cloneRange());
+      }
+    };
+    t.addEventListener("mousedown", i), t.addEventListener("focus", i);
+    const o = () => {
+      let a = parseInt(t.value, 10);
+      if (!isNaN(a) && (a = Math.max(1, Math.min(100, a)), t.value = a.toString(), e.command === "fontSize")) {
+        if (this.savedRange) {
+          const n = this.editor.setStyle("font-size", `${a}px`, this.savedRange);
+          n && (this.savedRange = n);
+        } else
+          this.editor.setStyle("font-size", `${a}px`);
+        t.focus();
+      }
+    };
+    t.addEventListener("input", o), t.addEventListener("keydown", (a) => {
+      a.key === "Enter" && (o(), this.editor.focus());
+    }), this.container.appendChild(t);
+  }
+  renderSelect(e) {
+    const t = document.createElement("select");
+    t.classList.add("te-select"), t.title = e.title, e.options && e.options.forEach((i) => {
+      const o = document.createElement("option");
+      o.value = i.value, o.textContent = i.label, t.appendChild(o);
+    }), t.addEventListener("change", () => {
+      const i = t.value;
+      this.savedRange && this.editor.selection.restoreSelection(this.savedRange), e.command === "formatBlock" ? this.editor.execute(e.command, i) : e.command === "fontFamily" && this.editor.setStyle("font-family", i), this.editor.focus();
+    }), t.addEventListener("mousedown", () => {
+      this.savedRange = this.editor.selection.saveSelection();
+    }), this.container.appendChild(t);
+  }
+  renderColorPicker(e) {
+    const t = document.createElement("input");
+    t.type = "color", t.classList.add("te-color-picker"), t.title = e.title, t.value = e.value || "#000000", t.addEventListener("mousedown", () => {
+      this.savedRange = this.editor.selection.saveSelection();
+    }), t.addEventListener("change", () => {
+      this.savedRange && this.editor.selection.restoreSelection(this.savedRange), e.command && this.editor.execute(e.command, t.value), this.editor.focus();
+    }), this.container.appendChild(t);
+  }
+  get el() {
+    return this.container;
+  }
+  updateActiveStates() {
+    const e = this.container.querySelectorAll(".te-button");
+    let t = 0;
+    this.items.forEach((i) => {
+      if (i.type === "button") {
+        const o = e[t++];
+        i.command && document.queryCommandState(i.command) ? o.classList.add("active") : o.classList.remove("active");
+      }
+    });
+  }
+}
+class V extends j {
+  toolbar;
+  constructor(e, t = {}) {
+    super(e, t), this.toolbar = new G(this), this.container.insertBefore(this.toolbar.el, this.editableElement);
+  }
+}
+export {
+  j as CoreEditor,
+  g as SelectionManager,
+  V as TestEditor,
+  G as Toolbar
+};
+//# sourceMappingURL=test-editor.mjs.map