@illinois-grad/grad-vue-rte 2.3.3 → 2.3.5

package/dist/components/GRichTextContent.vue.d.ts

@@ -0,0 +1,10 @@
+interface Props {
+    /**
+     * Error message when rendering fails
+     */
+    error?: string;
+    content: string;
+}
+declare const __VLS_export: import("vue").DefineComponent<Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<Props> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/composables/useRichTextRenderer.d.ts

@@ -0,0 +1,13 @@
+import { type Ref } from "vue";
+/**
+ * Composable for rendering a JSON string of tiptap content to HTML.
+ * Supports all extensions used by GChatInput and GNoteInput.
+ *
+ * @param content - A reactive ref or plain string containing JSON-encoded tiptap content
+ * @returns `rendered` — rendered HTML string, empty string for empty content, or `null` when rendering fails;
+ *          `hasError` — `true` when the content cannot be parsed or rendered
+ */
+export declare function useRichTextRenderer(content: Ref<string>): {
+    rendered: Ref<string | null, string | null>;
+    hasError: import("vue").ComputedRef<boolean>;
+};

package/dist/grad-vue-rte.css

@@ -1 +1 @@
-.g-rich-text-toolbar[data-v-8c490655]{display:flex}.g-rich-text-toolbar button[data-v-8c490655]{background-color:unset;padding:.4rem .5rem;font-size:.875rem;border:none;cursor:pointer;display:flex;align-items:center;justify-content:center}.g-rich-text-toolbar button.bold[data-v-8c490655]{font-weight:700}.g-rich-text-toolbar button.italic[data-v-8c490655]{font-style:italic}.g-rich-text-toolbar button.is-active[data-v-8c490655]{color:var(--g-accent-700);background-color:var(--g-surface-150)}.g-rich-text-toolbar button[data-v-8c490655]:hover{background-color:var(--g-primary-300);color:var(--g-primary-text)}.g-chat-input-wrap .tiptap{background:transparent;border:none;padding:.15em 0;font-size:15px;max-height:10em;flex:1;outline:none}.g-chat-input-wrap .tiptap p{margin:.375em 0 0}.g-chat-input-wrap .tiptap>:first-child{margin-top:0}.g-chat-input-wrap .tiptap>:last-child{margin-bottom:0}.g-chat-input-wrap .tiptap ul,.g-chat-input-wrap .tiptap ol{padding:0 1em;margin:.375em 1em 0 .4em}:is(.g-chat-input-wrap .tiptap ul,.g-chat-input-wrap .tiptap ol) li p{margin-top:0;margin-bottom:0}.g-chat-input-wrap .tiptap p.is-editor-empty:first-child:before{color:var(--g-surface-600);content:attr(data-placeholder);float:left;height:0;pointer-events:none}.bubble-menu[data-v-45a4a5f2]{box-shadow:0 1px 4px #00000080;background-color:var(--g-surface-100)}.bubble-menu [data-v-45a4a5f2] button:first-child{border-top-left-radius:4px;border-bottom-left-radius:4px}.bubble-menu [data-v-45a4a5f2] button:last-child{border-top-right-radius:4px;border-bottom-right-radius:4px}.g-chat-input-wrap[data-v-45a4a5f2]{position:relative;display:flex;align-items:center;background:var(--g-surface-0);border:2px solid var(--g-primary-500);border-radius:4px;padding:.5em}.g-chat-input-wrap[data-v-45a4a5f2]:has(.ProseMirror-focused){outline:2px solid var(--g-primary-500);outline-offset:2px;box-shadow:0 0 0 2px var(--g-info-200);border-color:var(--g-info-200)}.editor-content[data-v-45a4a5f2]{flex:1;min-width:0}.g-chat-send-btn[data-v-45a4a5f2]{color:var(--g-primary-500);font-size:1em;border:2px solid transparent;border-radius:4px;padding:.4em;margin:0;align-self:flex-end;cursor:pointer;display:flex;align-items:center;justify-content:center;background:transparent;flex-shrink:0}.g-chat-send-btn[data-v-45a4a5f2]:hover:not(:disabled){color:var(--g-accent-700);background-color:var(--g-surface-100)}.g-chat-send-btn[data-v-45a4a5f2]:focus:not(:disabled){background-color:var(--g-info-200);color:var(--g-primary-500)}.g-chat-send-btn[data-v-45a4a5f2]:active:not(:disabled){background-color:var(--g-primary-500);color:var(--g-surface-0)}.g-chat-send-btn[data-v-45a4a5f2]:disabled{color:var(--g-surface-300);cursor:not-allowed}.g-note-input-wrap .tiptap{background:transparent;border:none;padding:.5em;font-size:15px;min-height:12em;flex:1;outline:none}.g-note-input-wrap .tiptap p{margin:.375em 0 0}.g-note-input-wrap .tiptap>:first-child{margin-top:0}.g-note-input-wrap .tiptap>:last-child{margin-bottom:0}.g-note-input-wrap .tiptap ul,.g-note-input-wrap .tiptap ol{padding:0 1em;margin:.375em 1em 0 .4em}:is(.g-note-input-wrap .tiptap ul,.g-note-input-wrap .tiptap ol) li p{margin-top:0;margin-bottom:0}.g-note-input-wrap .tiptap p.is-editor-empty:first-child:before{color:var(--g-surface-600);content:attr(data-placeholder);float:left;height:0;pointer-events:none}.g-note-input-wrap[data-v-c2d30b96]{display:flex;flex-direction:column;background:var(--g-surface-0);border:2px solid var(--g-primary-500);border-radius:4px}.g-note-input-wrap[data-v-c2d30b96]:has(.ProseMirror-focused){outline:2px solid var(--g-primary-500);outline-offset:2px;box-shadow:0 0 0 2px var(--g-info-200);border-color:var(--g-info-200)}.toolbar[data-v-c2d30b96]{border-bottom:1px solid var(--g-surface-200);background-color:var(--g-surface-0);padding:.25rem}.toolbar [data-v-c2d30b96] button{border-radius:4px}.toolbar [data-v-c2d30b96] button:focus{outline:2px solid var(--g-primary-500);outline-offset:2px}.editor-content[data-v-c2d30b96]{flex:1;min-width:0}
+.g-rich-text-toolbar[data-v-8c490655]{display:flex}.g-rich-text-toolbar button[data-v-8c490655]{background-color:unset;padding:.4rem .5rem;font-size:.875rem;border:none;cursor:pointer;display:flex;align-items:center;justify-content:center}.g-rich-text-toolbar button.bold[data-v-8c490655]{font-weight:700}.g-rich-text-toolbar button.italic[data-v-8c490655]{font-style:italic}.g-rich-text-toolbar button.is-active[data-v-8c490655]{color:var(--g-accent-700);background-color:var(--g-surface-150)}.g-rich-text-toolbar button[data-v-8c490655]:hover{background-color:var(--g-primary-300);color:var(--g-primary-text)}.g-chat-input-wrap .tiptap{background:transparent;border:none;padding:.15em 0;font-size:15px;max-height:10em;flex:1;outline:none}.g-chat-input-wrap .tiptap p{margin:.375em 0 0}.g-chat-input-wrap .tiptap>:first-child{margin-top:0}.g-chat-input-wrap .tiptap>:last-child{margin-bottom:0}.g-chat-input-wrap .tiptap ul,.g-chat-input-wrap .tiptap ol{padding:0 1em;margin:.375em 1em 0 .4em}:is(.g-chat-input-wrap .tiptap ul,.g-chat-input-wrap .tiptap ol) li p{margin-top:0;margin-bottom:0}.g-chat-input-wrap .tiptap p.is-editor-empty:first-child:before{color:var(--g-surface-600);content:attr(data-placeholder);float:left;height:0;pointer-events:none}.bubble-menu[data-v-45a4a5f2]{box-shadow:0 1px 4px #00000080;background-color:var(--g-surface-100)}.bubble-menu [data-v-45a4a5f2] button:first-child{border-top-left-radius:4px;border-bottom-left-radius:4px}.bubble-menu [data-v-45a4a5f2] button:last-child{border-top-right-radius:4px;border-bottom-right-radius:4px}.g-chat-input-wrap[data-v-45a4a5f2]{position:relative;display:flex;align-items:center;background:var(--g-surface-0);border:2px solid var(--g-primary-500);border-radius:4px;padding:.5em}.g-chat-input-wrap[data-v-45a4a5f2]:has(.ProseMirror-focused){outline:2px solid var(--g-primary-500);outline-offset:2px;box-shadow:0 0 0 2px var(--g-info-200);border-color:var(--g-info-200)}.editor-content[data-v-45a4a5f2]{flex:1;min-width:0}.g-chat-send-btn[data-v-45a4a5f2]{color:var(--g-primary-500);font-size:1em;border:2px solid transparent;border-radius:4px;padding:.4em;margin:0;align-self:flex-end;cursor:pointer;display:flex;align-items:center;justify-content:center;background:transparent;flex-shrink:0}.g-chat-send-btn[data-v-45a4a5f2]:hover:not(:disabled){color:var(--g-accent-700);background-color:var(--g-surface-100)}.g-chat-send-btn[data-v-45a4a5f2]:focus:not(:disabled){background-color:var(--g-info-200);color:var(--g-primary-500)}.g-chat-send-btn[data-v-45a4a5f2]:active:not(:disabled){background-color:var(--g-primary-500);color:var(--g-surface-0)}.g-chat-send-btn[data-v-45a4a5f2]:disabled{color:var(--g-surface-300);cursor:not-allowed}.g-note-input-wrap .tiptap{background:transparent;border:none;padding:.5em;font-size:15px;min-height:12em;flex:1;outline:none}.g-note-input-wrap .tiptap p{margin:.375em 0 0}.g-note-input-wrap .tiptap>:first-child{margin-top:0}.g-note-input-wrap .tiptap>:last-child{margin-bottom:0}.g-note-input-wrap .tiptap ul,.g-note-input-wrap .tiptap ol{padding:0 1em;margin:.375em 1em 0 .4em}:is(.g-note-input-wrap .tiptap ul,.g-note-input-wrap .tiptap ol) li p{margin-top:0;margin-bottom:0}.g-note-input-wrap .tiptap p.is-editor-empty:first-child:before{color:var(--g-surface-600);content:attr(data-placeholder);float:left;height:0;pointer-events:none}.g-note-input-wrap[data-v-c2d30b96]{display:flex;flex-direction:column;background:var(--g-surface-0);border:2px solid var(--g-primary-500);border-radius:4px}.g-note-input-wrap[data-v-c2d30b96]:has(.ProseMirror-focused){outline:2px solid var(--g-primary-500);outline-offset:2px;box-shadow:0 0 0 2px var(--g-info-200);border-color:var(--g-info-200)}.toolbar[data-v-c2d30b96]{border-bottom:1px solid var(--g-surface-200);background-color:var(--g-surface-0);padding:.25rem}.toolbar [data-v-c2d30b96] button{border-radius:4px}.toolbar [data-v-c2d30b96] button:focus{outline:2px solid var(--g-primary-500);outline-offset:2px}.editor-content[data-v-c2d30b96]{flex:1;min-width:0}.g-rich-text-content p[data-v-923b2b7c]{margin:.375em 0}.g-rich-text-content [data-v-923b2b7c]>:first-child{margin-top:0}.g-rich-text-content [data-v-923b2b7c]>:last-child{margin-bottom:0}:is(.g-rich-text-content ul,.g-rich-text-content ol)[data-v-923b2b7c]{padding:0 1em;margin:.375em 1em 0 .4em}:is(.g-rich-text-content ul,.g-rich-text-content ol) li p[data-v-923b2b7c]{margin-top:0;margin-bottom:0}.g-rich-text-content-error[data-v-923b2b7c]{color:var(--g-danger-700);font-size:.875em}

package/dist/grad-vue-rte.d.ts

@@ -1,4 +1,6 @@
 import GChatInput from "./components/GChatInput.vue";
 import GNoteInput from "./components/GNoteInput.vue";
+import GRichTextContent from "./components/GRichTextContent.vue";
 import "./css/main.css";
-export { GChatInput, GNoteInput, };
+export { useRichTextRenderer } from "./composables/useRichTextRenderer";
+export { GChatInput, GNoteInput, GRichTextContent, };

package/dist/grad-vue-rte.js

@@ -1,6 +1,8 @@
-import { G as o, a as p } from "./main-EtH7847A.js";
+import { G as a, a as n, b as s, u as o } from "./main-Bh1IF4ob.js";
 export {
-  o as GChatInput,
-  p as GNoteInput
+  a as GChatInput,
+  n as GNoteInput,
+  s as GRichTextContent,
+  o as useRichTextRenderer
 };
 //# sourceMappingURL=grad-vue-rte.js.map

package/dist/main-Bh1IF4ob.js

@@ -0,0 +1,384 @@
+import { watch as y, toRaw as N, ref as C, defineComponent as w, computed as v, openBlock as p, createElementBlock as b, unref as c, createElementVNode as d, normalizeClass as g, createCommentVNode as L, useModel as M, createBlock as O, withCtx as $, createVNode as x, mergeModels as k, onMounted as D, toValue as G, toRef as J, toDisplayString as K } from "vue";
+import { useEditor as P, EditorContent as V } from "@tiptap/vue-3";
+import { BubbleMenu as U } from "@tiptap/vue-3/menus";
+import I from "@tiptap/extension-document";
+import T from "@tiptap/extension-paragraph";
+import B from "@tiptap/extension-text";
+import A from "@tiptap/extension-bold";
+import z from "@tiptap/extension-italic";
+import { ListKit as R } from "@tiptap/extension-list";
+import { UndoRedo as _, Placeholder as F } from "@tiptap/extensions";
+import { generateHTML as j } from "@tiptap/core";
+function S(e) {
+  const { content: l, placeholder: s, label: o, onUpdate: n, editorProps: r = {} } = e, a = typeof s == "string" ? s : s.value, t = typeof o == "string" ? o : o.value, i = P({
+    content: l.value || "",
+    extensions: [
+      I,
+      T,
+      B,
+      A,
+      z,
+      R,
+      _,
+      F.configure({ placeholder: a })
+    ],
+    editorProps: {
+      ...r,
+      attributes: {
+        "aria-label": t,
+        ...r.attributes
+      }
+    },
+    onUpdate({ editor: u }) {
+      l.value = u.getJSON(), n && n(u);
+    }
+  });
+  y(
+    () => typeof o == "string" ? o : o.value,
+    (u) => {
+      i.value && i.value?.setOptions({
+        editorProps: {
+          attributes: {
+            "aria-label": u
+          }
+        }
+      });
+    }
+  ), y(
+    () => l.value,
+    (u) => {
+      i.value && JSON.stringify(u) !== JSON.stringify(i.value.getJSON()) && i.value.commands.setContent(N(u) || "");
+    }
+  );
+  function f() {
+    i.value?.commands?.focus();
+  }
+  return {
+    editor: i,
+    focusEditor: f
+  };
+}
+function q(e, l) {
+  const s = C(0);
+  function o(r) {
+    const a = l.value;
+    if (!a) return;
+    const t = Array.from(
+      a.querySelectorAll("button")
+    ), i = t.findIndex(
+      (u) => u === document.activeElement
+    );
+    if (r.key === "Escape") {
+      r.preventDefault(), e.value?.commands?.focus();
+      return;
+    }
+    if (r.key === "Tab")
+      return;
+    let f = i;
+    switch (r.key) {
+      case "ArrowRight":
+      case "ArrowDown":
+        r.preventDefault(), f = i < t.length - 1 ? i + 1 : 0;
+        break;
+      case "ArrowLeft":
+      case "ArrowUp":
+        r.preventDefault(), f = i > 0 ? i - 1 : t.length - 1;
+        break;
+      case "Home":
+        r.preventDefault(), f = 0;
+        break;
+      case "End":
+        r.preventDefault(), f = t.length - 1;
+        break;
+      default:
+        return;
+    }
+    s.value = f, t[f]?.focus();
+  }
+  function n(r) {
+    return r === s.value ? 0 : -1;
+  }
+  return {
+    activeButtonIndex: s,
+    handleToolbarKeyDown: o,
+    getButtonTabIndex: n
+  };
+}
+const W = ["aria-pressed", "tabindex"], Q = ["aria-pressed", "tabindex"], X = ["aria-pressed", "tabindex"], Y = ["aria-pressed", "tabindex"], Z = /* @__PURE__ */ w({
+  __name: "GRichTextToolbar",
+  props: {
+    editor: {}
+  },
+  setup(e) {
+    const l = e, s = C(null), o = v(() => l.editor), { handleToolbarKeyDown: n, getButtonTabIndex: r } = q(
+      o,
+      s
+    );
+    return (a, t) => e.editor ? (p(), b("div", {
+      key: 0,
+      class: "g-rich-text-toolbar",
+      role: "toolbar",
+      "aria-label": "Text formatting",
+      ref_key: "toolbarRef",
+      ref: s,
+      onKeydown: t[4] || (t[4] = //@ts-ignore
+      (...i) => c(n) && c(n)(...i)),
+      tabindex: "-1"
+    }, [
+      d("button", {
+        onClick: t[0] || (t[0] = (i) => e.editor.chain().focus().toggleBold().run()),
+        class: g({
+          bold: !0,
+          "is-active": e.editor.isActive("bold")
+        }),
+        "aria-pressed": e.editor.isActive("bold"),
+        title: "Bold",
+        "aria-label": "Bold",
+        type: "button",
+        tabindex: c(r)(0)
+      }, [...t[5] || (t[5] = [
+        d("svg", {
+          xmlns: "http://www.w3.org/2000/svg",
+          viewBox: "0 0 384 512",
+          width: "16",
+          height: "16",
+          fill: "currentColor",
+          "aria-hidden": "true"
+        }, [
+          d("path", { d: "M0 64C0 46.3 14.3 32 32 32H80 96 224c70.7 0 128 57.3 128 128c0 31.3-11.3 60.1-30 82.3c37.1 22.4 62 63.1 62 109.7c0 70.7-57.3 128-128 128H96 80 32c-17.7 0-32-14.3-32-32s14.3-32 32-32H48V256 96H32C14.3 96 0 81.7 0 64zM224 224c35.3 0 64-28.7 64-64s-28.7-64-64-64H112V224H224zM112 288V416H256c35.3 0 64-28.7 64-64s-28.7-64-64-64H224 112z" })
+        ], -1)
+      ])], 10, W),
+      d("button", {
+        onClick: t[1] || (t[1] = (i) => e.editor.chain().focus().toggleItalic().run()),
+        class: g({
+          italic: !0,
+          "is-active": e.editor.isActive("italic")
+        }),
+        "aria-pressed": e.editor.isActive("italic"),
+        title: "Italic",
+        "aria-label": "Italic",
+        type: "button",
+        tabindex: c(r)(1)
+      }, [...t[6] || (t[6] = [
+        d("svg", {
+          xmlns: "http://www.w3.org/2000/svg",
+          viewBox: "0 0 384 512",
+          width: "16",
+          height: "16",
+          fill: "currentColor",
+          "aria-hidden": "true"
+        }, [
+          d("path", { d: "M128 64c0-17.7 14.3-32 32-32H352c17.7 0 32 14.3 32 32s-14.3 32-32 32H293.3L160 416h64c17.7 0 32 14.3 32 32s-14.3 32-32 32H32c-17.7 0-32-14.3-32-32s14.3-32 32-32H90.7L224 96H160c-17.7 0-32-14.3-32-32z" })
+        ], -1)
+      ])], 10, Q),
+      d("button", {
+        onClick: t[2] || (t[2] = (i) => e.editor.chain().focus().toggleOrderedList().run()),
+        class: g({ "is-active": e.editor.isActive("orderedList") }),
+        "aria-pressed": e.editor.isActive("orderedList"),
+        title: "Ordered List",
+        "aria-label": "Ordered List",
+        type: "button",
+        tabindex: c(r)(2)
+      }, [...t[7] || (t[7] = [
+        d("svg", {
+          xmlns: "http://www.w3.org/2000/svg",
+          viewBox: "0 0 512 512",
+          width: "16",
+          height: "16",
+          fill: "currentColor",
+          "aria-hidden": "true"
+        }, [
+          d("path", { d: "M24 56c0-13.3 10.7-24 24-24H80c13.3 0 24 10.7 24 24V176h16c13.3 0 24 10.7 24 24s-10.7 24-24 24H48c-13.3 0-24-10.7-24-24s10.7-24 24-24H64V80H48C34.7 80 24 69.3 24 56zM86.7 341.2c-6.5-7.4-18.3-6.9-24 1.2L51.5 357.9c-7.7 10.8-22.7 13.3-33.5 5.6s-13.3-22.7-5.6-33.5l11.1-15.6c23.7-33.2 72.3-35.6 99.2-4.9c21.3 24.4 20.8 60.9-1.1 84.7L86.8 432H120c13.3 0 24 10.7 24 24s-10.7 24-24 24H48c-9.5 0-18.2-5.6-22-14.4s-2.1-18.9 4.3-25.9l72-78c5.3-5.8 5.4-14.6 .3-20.5zM224 64H480c17.7 0 32 14.3 32 32s-14.3 32-32 32H224c-17.7 0-32-14.3-32-32s14.3-32 32-32zm0 160H480c17.7 0 32 14.3 32 32s-14.3 32-32 32H224c-17.7 0-32-14.3-32-32s14.3-32 32-32zm0 160H480c17.7 0 32 14.3 32 32s-14.3 32-32 32H224c-17.7 0-32-14.3-32-32s14.3-32 32-32z" })
+        ], -1)
+      ])], 10, X),
+      d("button", {
+        onClick: t[3] || (t[3] = (i) => e.editor.chain().focus().toggleBulletList().run()),
+        class: g({ "is-active": e.editor.isActive("bulletList") }),
+        "aria-pressed": e.editor.isActive("bulletList"),
+        title: "Unordered List",
+        "aria-label": "Unordered List",
+        type: "button",
+        tabindex: c(r)(3)
+      }, [...t[8] || (t[8] = [
+        d("svg", {
+          xmlns: "http://www.w3.org/2000/svg",
+          viewBox: "0 0 512 512",
+          width: "16",
+          height: "16",
+          fill: "currentColor",
+          "aria-hidden": "true"
+        }, [
+          d("path", { d: "M40 48C26.7 48 16 58.7 16 72v48c0 13.3 10.7 24 24 24H88c13.3 0 24-10.7 24-24V72c0-13.3-10.7-24-24-24H40zM192 64c-17.7 0-32 14.3-32 32s14.3 32 32 32H480c17.7 0 32-14.3 32-32s-14.3-32-32-32H192zm0 160c-17.7 0-32 14.3-32 32s14.3 32 32 32H480c17.7 0 32-14.3 32-32s-14.3-32-32-32H192zm0 160c-17.7 0-32 14.3-32 32s14.3 32 32 32H480c17.7 0 32-14.3 32-32s-14.3-32-32-32H192zM16 232v48c0 13.3 10.7 24 24 24H88c13.3 0 24-10.7 24-24V232c0-13.3-10.7-24-24-24H40c-13.3 0-24 10.7-24 24zM40 368c-13.3 0-24 10.7-24 24v48c0 13.3 10.7 24 24 24H88c13.3 0 24-10.7 24-24V392c0-13.3-10.7-24-24-24H40z" })
+        ], -1)
+      ])], 10, Y)
+    ], 544)) : L("", !0);
+  }
+}), H = (e, l) => {
+  const s = e.__vccOpts || e;
+  for (const [o, n] of l)
+    s[o] = n;
+  return s;
+}, E = /* @__PURE__ */ H(Z, [["__scopeId", "data-v-8c490655"]]), ee = { class: "g-chat-input-wrap" }, te = ["disabled"], oe = /* @__PURE__ */ w({
+  inheritAttrs: !1,
+  __name: "GChatInput",
+  props: /* @__PURE__ */ k({
+    placeholder: { default: "Type a comment" },
+    disabled: { type: Boolean, default: !1 },
+    maxRows: { default: 5 },
+    label: { default: "Comment input" }
+  }, {
+    modelValue: {},
+    modelModifiers: {}
+  }),
+  emits: /* @__PURE__ */ k(["send"], ["update:modelValue"]),
+  setup(e, { expose: l, emit: s }) {
+    const o = e, n = M(e, "modelValue"), r = s, { editor: a, focusEditor: t } = S({
+      content: n,
+      placeholder: v(() => o.placeholder),
+      label: v(() => o.label),
+      editorProps: {
+        handleKeyDown(h, m) {
+          if (a.value && m.key === "Enter") {
+            if (a.value.isActive("orderedList") || a.value.isActive("bulletList"))
+              return !1;
+            if (m.shiftKey)
+              a.value.commands.splitBlock();
+            else
+              return n.value = a.value?.getJSON(), m.preventDefault(), i(a.value?.getJSON()), !0;
+          }
+          return !1;
+        },
+        attributes: {
+          "aria-keyshortcuts": "Shift+Enter"
+        }
+      }
+    });
+    function i(h) {
+      h && r("send", h);
+    }
+    function f() {
+      i(a.value?.getJSON());
+    }
+    function u() {
+      t();
+    }
+    return l({ focusInput: u }), (h, m) => (p(), b("div", ee, [
+      c(a) ? (p(), O(c(U), {
+        key: 0,
+        editor: c(a)
+      }, {
+        default: $(() => [
+          x(E, {
+            editor: c(a),
+            class: "bubble-menu"
+          }, null, 8, ["editor"])
+        ]),
+        _: 1
+      }, 8, ["editor"])) : L("", !0),
+      x(c(V), {
+        editor: c(a),
+        class: "editor-content"
+      }, null, 8, ["editor"]),
+      d("button", {
+        class: "g-chat-send-btn",
+        disabled: o.disabled || !n.value || n.value && Object.keys(n.value).length === 0,
+        onClick: f,
+        title: "Send",
+        "aria-label": "Send",
+        type: "button"
+      }, [...m[0] || (m[0] = [
+        d("svg", {
+          xmlns: "http://www.w3.org/2000/svg",
+          viewBox: "0 0 512 512",
+          width: "16",
+          height: "16",
+          fill: "currentColor",
+          "aria-hidden": "true"
+        }, [
+          d("path", { d: "M498.1 5.6c10.1 7 15.4 19.1 13.5 31.2l-64 416c-1.5 9.7-7.4 18.2-16 23s-18.9 5.4-28 1.6L284 427.7l-68.5 74.1c-8.9 9.7-22.9 12.9-35.2 8.1S160 493.2 160 480V396.4c0-4 1.5-7.8 4.2-10.7L331.8 202.8c5.8-6.3 5.6-16-.4-22s-15.7-6.4-22-.7L106 360.8 17.7 316.6C7.1 311.3 .3 300.7 0 288.9s5.9-22.8 16.1-28.7l448-256c10.7-6.1 23.9-5.5 34 1.4z" })
+        ], -1)
+      ])], 8, te)
+    ]));
+  }
+}), ye = /* @__PURE__ */ H(oe, [["__scopeId", "data-v-45a4a5f2"]]), re = { class: "g-note-input-wrap" }, ne = /* @__PURE__ */ w({
+  inheritAttrs: !1,
+  __name: "GNoteInput",
+  props: /* @__PURE__ */ k({
+    placeholder: { default: "Write a note..." },
+    label: { default: "Note input" }
+  }, {
+    modelValue: {},
+    modelModifiers: {}
+  }),
+  emits: ["update:modelValue"],
+  setup(e, { expose: l }) {
+    const s = e, o = M(e, "modelValue"), { editor: n, focusEditor: r } = S({
+      content: o,
+      placeholder: v(() => s.placeholder),
+      label: v(() => s.label)
+    });
+    function a() {
+      r();
+    }
+    return l({ focusInput: a }), (t, i) => (p(), b("div", re, [
+      x(E, {
+        editor: c(n),
+        class: "toolbar"
+      }, null, 8, ["editor"]),
+      x(c(V), {
+        editor: c(n),
+        class: "editor-content"
+      }, null, 8, ["editor"])
+    ]));
+  }
+}), ke = /* @__PURE__ */ H(ne, [["__scopeId", "data-v-c2d30b96"]]), ie = [I, T, B, A, z, R];
+function se(e) {
+  const l = C("");
+  D(() => {
+    y(e, () => {
+      const o = G(e);
+      if (!o || o.trim() === "")
+        return "";
+      try {
+        const n = JSON.parse(o);
+        let r = j(
+          n,
+          ie
+        );
+        l.value = r;
+      } catch (n) {
+        console.error("Failed to parse content:", o), console.error(n), l.value = null;
+      }
+    }, { immediate: !0 });
+  });
+  const s = v(() => l.value === null);
+  return { rendered: l, hasError: s };
+}
+const ae = { class: "g-rich-text-content-wrap" }, le = {
+  key: 0,
+  role: "alert",
+  class: "g-rich-text-content-error"
+}, ce = ["innerHTML"], de = /* @__PURE__ */ w({
+  __name: "GRichTextContent",
+  props: {
+    error: {},
+    content: {}
+  },
+  setup(e) {
+    const s = J(e, "content"), { rendered: o, hasError: n } = se(s);
+    return (r, a) => (p(), b("div", ae, [
+      c(n) ? (p(), b("div", le, K(e.error || "Failed to render content."), 1)) : c(o) ? (p(), b("div", {
+        key: 1,
+        class: "g-rich-text-content",
+        innerHTML: c(o)
+      }, null, 8, ce)) : L("", !0)
+    ]));
+  }
+}), Ce = /* @__PURE__ */ H(de, [["__scopeId", "data-v-923b2b7c"]]);
+export {
+  ye as G,
+  ke as a,
+  Ce as b,
+  se as u
+};
+//# sourceMappingURL=main-Bh1IF4ob.js.map

package/dist/main-Bh1IF4ob.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"main-Bh1IF4ob.js","sources":["../src/composables/useRichTextEditor.ts","../src/composables/useToolbarNavigation.ts","../src/components/editor/GRichTextToolbar.vue","../src/components/GChatInput.vue","../src/components/GNoteInput.vue","../src/composables/useRichTextRenderer.ts","../src/components/GRichTextContent.vue"],"sourcesContent":["import { toRaw, watch, type Ref } from \"vue\";\nimport { useEditor } from \"@tiptap/vue-3\";\nimport Document from \"@tiptap/extension-document\";\nimport Paragraph from \"@tiptap/extension-paragraph\";\nimport Text from \"@tiptap/extension-text\";\nimport Bold from \"@tiptap/extension-bold\";\nimport Italic from \"@tiptap/extension-italic\";\nimport { ListKit } from \"@tiptap/extension-list\";\nimport { UndoRedo, Placeholder } from \"@tiptap/extensions\";\n\ninterface UseRichTextEditorOptions {\n    content: Ref<object | \"\" | undefined>;\n    placeholder: Ref<string> | string;\n    label: Ref<string> | string;\n    onUpdate?: (editor: any) => void;\n    editorProps?: Record<string, any>;\n}\n\nexport function useRichTextEditor(options: UseRichTextEditorOptions) {\n    const { content, placeholder, label, onUpdate, editorProps = {} } = options;\n\n    const placeholderValue = typeof placeholder === 'string' ? placeholder : placeholder.value;\n    const labelValue = typeof label === 'string' ? label : label.value;\n\n    const editor = useEditor({\n        content: content.value || \"\",\n        extensions: [\n            Document,\n            Paragraph,\n            Text,\n            Bold,\n            Italic,\n            ListKit,\n            UndoRedo,\n            Placeholder.configure({ placeholder: placeholderValue }),\n        ],\n        editorProps: {\n            ...editorProps,\n            attributes: {\n                \"aria-label\": labelValue,\n                ...editorProps.attributes,\n            },\n        },\n        onUpdate({ editor }) {\n            content.value = editor.getJSON();\n            if (onUpdate) {\n                onUpdate(editor);\n            }\n        },\n    });\n\n    // Watch for label changes and update editor\n    watch(\n        () => typeof label === 'string' ? label : label.value,\n        (val) => {\n            if (editor.value) {\n                editor.value?.setOptions({\n                    editorProps: {\n                        attributes: {\n                            \"aria-label\": val,\n                        },\n                    },\n                });\n            }\n        },\n    );\n\n    // Watch for content changes and update editor\n    watch(\n        () => content.value,\n        (val) => {\n            if (\n                editor.value &&\n                JSON.stringify(val) !== JSON.stringify(editor.value.getJSON())\n            ) {\n                editor.value.commands.setContent(toRaw(val) || \"\");\n            }\n        },\n    );\n\n    function focusEditor() {\n        editor.value?.commands?.focus();\n    }\n\n    return {\n        editor,\n        focusEditor,\n    };\n}\n","import { ref, type Ref } from \"vue\";\nimport type { Editor } from \"@tiptap/vue-3\";\n\nexport function useToolbarNavigation(editor: Ref<Editor | undefined>, toolbarRef: Ref<HTMLElement | null>) {\n    const activeButtonIndex = ref(0);\n\n    function handleToolbarKeyDown(event: KeyboardEvent) {\n        const toolbar = toolbarRef.value;\n        if (!toolbar) return;\n\n        const buttons = Array.from(\n            toolbar.querySelectorAll(\"button\"),\n        ) as HTMLButtonElement[];\n        const currentIndex = buttons.findIndex(\n            (btn) => btn === document.activeElement,\n        );\n\n        // Handle Escape key - return focus to editor\n        if (event.key === \"Escape\") {\n            event.preventDefault();\n            editor.value?.commands?.focus();\n            return;\n        }\n\n        // Don't handle Tab - let it exit the toolbar naturally\n        if (event.key === \"Tab\") {\n            return;\n        }\n\n        let nextIndex = currentIndex;\n\n        switch (event.key) {\n            case \"ArrowRight\":\n            case \"ArrowDown\":\n                event.preventDefault();\n                nextIndex =\n                    currentIndex < buttons.length - 1 ? currentIndex + 1 : 0;\n                break;\n            case \"ArrowLeft\":\n            case \"ArrowUp\":\n                event.preventDefault();\n                nextIndex =\n                    currentIndex > 0 ? currentIndex - 1 : buttons.length - 1;\n                break;\n            case \"Home\":\n                event.preventDefault();\n                nextIndex = 0;\n                break;\n            case \"End\":\n                event.preventDefault();\n                nextIndex = buttons.length - 1;\n                break;\n            default:\n                return;\n        }\n\n        // Update active button index and focus\n        activeButtonIndex.value = nextIndex;\n        buttons[nextIndex]?.focus();\n    }\n\n    function getButtonTabIndex(index: number): number {\n        return index === activeButtonIndex.value ? 0 : -1;\n    }\n\n    return {\n        activeButtonIndex,\n        handleToolbarKeyDown,\n        getButtonTabIndex,\n    };\n}\n","<script lang=\"ts\" setup>\nimport { ref, computed } from \"vue\";\nimport type { Editor } from \"@tiptap/vue-3\";\nimport { useToolbarNavigation } from \"../../composables/useToolbarNavigation.ts\";\n\ninterface Props {\n    editor: Editor | undefined;\n}\n\nconst props = defineProps<Props>();\n\nconst toolbarRef = ref<HTMLElement | null>(null);\nconst editorRef = computed(() => props.editor);\nconst { handleToolbarKeyDown, getButtonTabIndex } = useToolbarNavigation(\n    editorRef,\n    toolbarRef,\n);\n</script>\n\n<template>\n    <div\n        v-if=\"editor\"\n        class=\"g-rich-text-toolbar\"\n        role=\"toolbar\"\n        aria-label=\"Text formatting\"\n        ref=\"toolbarRef\"\n        @keydown=\"handleToolbarKeyDown\"\n        tabindex=\"-1\"\n    >\n        <button\n            @click=\"editor.chain().focus().toggleBold().run()\"\n            :class=\"{\n                bold: true,\n                'is-active': editor.isActive('bold'),\n            }\"\n            :aria-pressed=\"editor.isActive('bold')\"\n            title=\"Bold\"\n            aria-label=\"Bold\"\n            type=\"button\"\n            :tabindex=\"getButtonTabIndex(0)\"\n        >\n            <svg\n                xmlns=\"http://www.w3.org/2000/svg\"\n                viewBox=\"0 0 384 512\"\n                width=\"16\"\n                height=\"16\"\n                fill=\"currentColor\"\n                aria-hidden=\"true\"\n            >\n                <path\n                    d=\"M0 64C0 46.3 14.3 32 32 32H80 96 224c70.7 0 128 57.3 128 128c0 31.3-11.3 60.1-30 82.3c37.1 22.4 62 63.1 62 109.7c0 70.7-57.3 128-128 128H96 80 32c-17.7 0-32-14.3-32-32s14.3-32 32-32H48V256 96H32C14.3 96 0 81.7 0 64zM224 224c35.3 0 64-28.7 64-64s-28.7-64-64-64H112V224H224zM112 288V416H256c35.3 0 64-28.7 64-64s-28.7-64-64-64H224 112z\"\n                />\n            </svg>\n        </button>\n        <button\n            @click=\"editor.chain().focus().toggleItalic().run()\"\n            :class=\"{\n                italic: true,\n                'is-active': editor.isActive('italic'),\n            }\"\n            :aria-pressed=\"editor.isActive('italic')\"\n            title=\"Italic\"\n            aria-label=\"Italic\"\n            type=\"button\"\n            :tabindex=\"getButtonTabIndex(1)\"\n        >\n            <svg\n                xmlns=\"http://www.w3.org/2000/svg\"\n                viewBox=\"0 0 384 512\"\n                width=\"16\"\n                height=\"16\"\n                fill=\"currentColor\"\n                aria-hidden=\"true\"\n            >\n                <path\n                    d=\"M128 64c0-17.7 14.3-32 32-32H352c17.7 0 32 14.3 32 32s-14.3 32-32 32H293.3L160 416h64c17.7 0 32 14.3 32 32s-14.3 32-32 32H32c-17.7 0-32-14.3-32-32s14.3-32 32-32H90.7L224 96H160c-17.7 0-32-14.3-32-32z\"\n                />\n            </svg>\n        </button>\n        <button\n            @click=\"editor.chain().focus().toggleOrderedList().run()\"\n            :class=\"{ 'is-active': editor.isActive('orderedList') }\"\n            :aria-pressed=\"editor.isActive('orderedList')\"\n            title=\"Ordered List\"\n            aria-label=\"Ordered List\"\n            type=\"button\"\n            :tabindex=\"getButtonTabIndex(2)\"\n        >\n            <svg\n                xmlns=\"http://www.w3.org/2000/svg\"\n                viewBox=\"0 0 512 512\"\n                width=\"16\"\n                height=\"16\"\n                fill=\"currentColor\"\n                aria-hidden=\"true\"\n            >\n                <path\n                    d=\"M24 56c0-13.3 10.7-24 24-24H80c13.3 0 24 10.7 24 24V176h16c13.3 0 24 10.7 24 24s-10.7 24-24 24H48c-13.3 0-24-10.7-24-24s10.7-24 24-24H64V80H48C34.7 80 24 69.3 24 56zM86.7 341.2c-6.5-7.4-18.3-6.9-24 1.2L51.5 357.9c-7.7 10.8-22.7 13.3-33.5 5.6s-13.3-22.7-5.6-33.5l11.1-15.6c23.7-33.2 72.3-35.6 99.2-4.9c21.3 24.4 20.8 60.9-1.1 84.7L86.8 432H120c13.3 0 24 10.7 24 24s-10.7 24-24 24H48c-9.5 0-18.2-5.6-22-14.4s-2.1-18.9 4.3-25.9l72-78c5.3-5.8 5.4-14.6 .3-20.5zM224 64H480c17.7 0 32 14.3 32 32s-14.3 32-32 32H224c-17.7 0-32-14.3-32-32s14.3-32 32-32zm0 160H480c17.7 0 32 14.3 32 32s-14.3 32-32 32H224c-17.7 0-32-14.3-32-32s14.3-32 32-32zm0 160H480c17.7 0 32 14.3 32 32s-14.3 32-32 32H224c-17.7 0-32-14.3-32-32s14.3-32 32-32z\"\n                />\n            </svg>\n        </button>\n        <button\n            @click=\"editor.chain().focus().toggleBulletList().run()\"\n            :class=\"{ 'is-active': editor.isActive('bulletList') }\"\n            :aria-pressed=\"editor.isActive('bulletList')\"\n            title=\"Unordered List\"\n            aria-label=\"Unordered List\"\n            type=\"button\"\n            :tabindex=\"getButtonTabIndex(3)\"\n        >\n            <svg\n                xmlns=\"http://www.w3.org/2000/svg\"\n                viewBox=\"0 0 512 512\"\n                width=\"16\"\n                height=\"16\"\n                fill=\"currentColor\"\n                aria-hidden=\"true\"\n            >\n                <path\n                    d=\"M40 48C26.7 48 16 58.7 16 72v48c0 13.3 10.7 24 24 24H88c13.3 0 24-10.7 24-24V72c0-13.3-10.7-24-24-24H40zM192 64c-17.7 0-32 14.3-32 32s14.3 32 32 32H480c17.7 0 32-14.3 32-32s-14.3-32-32-32H192zm0 160c-17.7 0-32 14.3-32 32s14.3 32 32 32H480c17.7 0 32-14.3 32-32s-14.3-32-32-32H192zm0 160c-17.7 0-32 14.3-32 32s14.3 32 32 32H480c17.7 0 32-14.3 32-32s-14.3-32-32-32H192zM16 232v48c0 13.3 10.7 24 24 24H88c13.3 0 24-10.7 24-24V232c0-13.3-10.7-24-24-24H40c-13.3 0-24 10.7-24 24zM40 368c-13.3 0-24 10.7-24 24v48c0 13.3 10.7 24 24 24H88c13.3 0 24-10.7 24-24V392c0-13.3-10.7-24-24-24H40z\"\n                />\n            </svg>\n        </button>\n    </div>\n</template>\n\n<style scoped>\n.g-rich-text-toolbar {\n    display: flex;\n\n    button {\n        background-color: unset;\n        padding: 0.4rem 0.5rem;\n        font-size: 0.875rem;\n        border: none;\n        cursor: pointer;\n        display: flex;\n        align-items: center;\n        justify-content: center;\n\n        &.bold {\n            font-weight: 700;\n        }\n        &.italic {\n            font-style: italic;\n        }\n\n        &.is-active {\n            color: var(--g-accent-700);\n            background-color: var(--g-surface-150);\n        }\n\n        &:hover {\n            background-color: var(--g-primary-300);\n            color: var(--g-primary-text);\n        }\n    }\n}\n</style>\n","<script lang=\"ts\" setup>\n/**\n * The GChatInput component provides a rich text editing experience using Tiptap. It supports:\n *\n *  - **Bold** and *italic* text formatting\n *  - Bullet and numbered lists\n *  - Bubble menu for formatting (appears when text is selected)\n *  - Press <kbd>Enter</kbd> to send, <kbd>Shift+Enter</kbd> for new line\n *  - Undo/redo support\n *\n *  **Note**: This component is part of the `@illinois-grad/grad-vue-rte` package, which includes Tiptap dependencies.\n */\nimport { computed } from \"vue\";\nimport { EditorContent } from \"@tiptap/vue-3\";\nimport { BubbleMenu } from \"@tiptap/vue-3/menus\";\nimport { useRichTextEditor } from \"../composables/useRichTextEditor\";\nimport GRichTextToolbar from \"./editor/GRichTextToolbar.vue\";\n\ndefineOptions({ inheritAttrs: false });\n\ninterface Props {\n    /**\n     * Placeholder text\n     */\n    placeholder?: string;\n    /**\n     * Disabled\n     */\n    disabled?: boolean;\n    /**\n     * Maximum number of rows\n     */\n    maxRows?: number;\n    /**\n     * Accessible label\n     */\n    label?: string;\n}\n\nconst props = withDefaults(defineProps<Props>(), {\n    placeholder: \"Type a comment\",\n    label: \"Comment input\",\n    disabled: false,\n    maxRows: 5,\n});\nconst model = defineModel<object | \"\">();\nconst emit = defineEmits<{ send: [content: object] }>();\n\nconst { editor, focusEditor } = useRichTextEditor({\n    content: model as any,\n    placeholder: computed(() => props.placeholder),\n    label: computed(() => props.label),\n    editorProps: {\n        handleKeyDown(view: any, event: any) {\n            if (editor.value && event.key === \"Enter\") {\n                if (\n                    editor.value.isActive(\"orderedList\") ||\n                    editor.value.isActive(\"bulletList\")\n                ) {\n                    return false;\n                }\n                if (!event.shiftKey) {\n                    model.value = editor.value?.getJSON();\n                    event.preventDefault();\n                    onSend(editor.value?.getJSON());\n                    return true;\n                } else {\n                    editor.value.commands.splitBlock();\n                }\n            }\n            return false;\n        },\n        attributes: {\n            \"aria-keyshortcuts\": \"Shift+Enter\",\n        },\n    },\n});\n\nfunction onSend(content: any) {\n    if (content) {\n        emit(\"send\", content);\n    }\n}\n\nfunction clickSend() {\n    onSend(editor.value?.getJSON());\n}\n\nfunction focusInput() {\n    focusEditor();\n}\n\ndefineExpose({ focusInput });\n</script>\n\n<template>\n    <div class=\"g-chat-input-wrap\">\n        <BubbleMenu :editor=\"editor\" v-if=\"editor\">\n            <GRichTextToolbar :editor=\"editor\" class=\"bubble-menu\" />\n        </BubbleMenu>\n        <EditorContent :editor=\"editor\" class=\"editor-content\" />\n        <button\n            class=\"g-chat-send-btn\"\n            :disabled=\"\n                props.disabled ||\n                !model ||\n                (model && Object.keys(model).length === 0)\n            \"\n            @click=\"clickSend\"\n            title=\"Send\"\n            aria-label=\"Send\"\n            type=\"button\"\n        >\n            <svg\n                xmlns=\"http://www.w3.org/2000/svg\"\n                viewBox=\"0 0 512 512\"\n                width=\"16\"\n                height=\"16\"\n                fill=\"currentColor\"\n                aria-hidden=\"true\"\n            >\n                <path\n                    d=\"M498.1 5.6c10.1 7 15.4 19.1 13.5 31.2l-64 416c-1.5 9.7-7.4 18.2-16 23s-18.9 5.4-28 1.6L284 427.7l-68.5 74.1c-8.9 9.7-22.9 12.9-35.2 8.1S160 493.2 160 480V396.4c0-4 1.5-7.8 4.2-10.7L331.8 202.8c5.8-6.3 5.6-16-.4-22s-15.7-6.4-22-.7L106 360.8 17.7 316.6C7.1 311.3 .3 300.7 0 288.9s5.9-22.8 16.1-28.7l448-256c10.7-6.1 23.9-5.5 34 1.4z\"\n                />\n            </svg>\n        </button>\n    </div>\n</template>\n\n<style>\n.g-chat-input-wrap {\n    .tiptap {\n        background: transparent;\n        border: none;\n        padding: 0.15em 0;\n        font-size: 15px;\n        max-height: 10em;\n        flex: 1;\n        outline: none;\n\n        p {\n            margin: 0.375em 0 0;\n        }\n\n        > :first-child {\n            margin-top: 0;\n        }\n        > :last-child {\n            margin-bottom: 0;\n        }\n\n        ul,\n        ol {\n            padding: 0 1em;\n            margin: 0.375em 1em 0 0.4em;\n\n            li p {\n                margin-top: 0;\n                margin-bottom: 0;\n            }\n        }\n        p.is-editor-empty:first-child::before {\n            color: var(--g-surface-600);\n            content: attr(data-placeholder);\n            float: left;\n            height: 0;\n            pointer-events: none;\n        }\n    }\n}\n</style>\n\n<style scoped>\n.bubble-menu {\n    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.5);\n    background-color: var(--g-surface-100);\n\n    :deep(button) {\n        &:first-child {\n            border-top-left-radius: 4px;\n            border-bottom-left-radius: 4px;\n        }\n        &:last-child {\n            border-top-right-radius: 4px;\n            border-bottom-right-radius: 4px;\n        }\n    }\n}\n\n.g-chat-input-wrap {\n    position: relative;\n    display: flex;\n    align-items: center;\n    background: var(--g-surface-0);\n    border: 2px solid var(--g-primary-500);\n    border-radius: 4px;\n    padding: 0.5em;\n\n    &:has(.ProseMirror-focused) {\n        outline: 2px solid var(--g-primary-500);\n        outline-offset: 2px;\n        box-shadow: 0 0 0 2px var(--g-info-200);\n        border-color: var(--g-info-200);\n    }\n}\n\n.editor-content {\n    flex: 1;\n    min-width: 0;\n}\n\n.g-chat-send-btn {\n    color: var(--g-primary-500);\n    font-size: 1em;\n    border: 2px solid transparent;\n    border-radius: 4px;\n    padding: 0.4em;\n    margin: 0;\n    align-self: flex-end;\n    cursor: pointer;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    background: transparent;\n    flex-shrink: 0;\n\n    &:hover:not(:disabled) {\n        color: var(--g-accent-700);\n        background-color: var(--g-surface-100);\n    }\n\n    &:focus:not(:disabled) {\n        background-color: var(--g-info-200);\n        color: var(--g-primary-500);\n    }\n\n    &:active:not(:disabled) {\n        background-color: var(--g-primary-500);\n        color: var(--g-surface-0);\n    }\n\n    &:disabled {\n        color: var(--g-surface-300);\n        cursor: not-allowed;\n    }\n}\n</style>\n","<script lang=\"ts\" setup>\n/**\n * The GNoteInput component provides a rich text editing experience using Tiptap for writing notes. It supports:\n *\n *  - **Bold** and *italic* text formatting\n *  - Bullet and numbered lists\n *  - Always visible toolbar for formatting\n *  - Undo/redo support\n *\n *  **Note**: This component is part of the `@illinois-grad/grad-vue-rte` package, which includes Tiptap dependencies.\n */\nimport { computed } from \"vue\";\nimport { EditorContent } from \"@tiptap/vue-3\";\nimport { useRichTextEditor } from \"../composables/useRichTextEditor\";\nimport GRichTextToolbar from \"./editor/GRichTextToolbar.vue\";\n\ndefineOptions({ inheritAttrs: false });\n\ninterface Props {\n    /**\n     * Placeholder text\n     */\n    placeholder?: string;\n    /**\n     * Accessible label\n     */\n    label?: string;\n}\n\nconst props = withDefaults(defineProps<Props>(), {\n    placeholder: \"Write a note...\",\n    label: \"Note input\",\n});\nconst model = defineModel<object | \"\">();\n\nconst { editor, focusEditor } = useRichTextEditor({\n    content: model as any,\n    placeholder: computed(() => props.placeholder),\n    label: computed(() => props.label),\n});\n\nfunction focusInput() {\n    focusEditor();\n}\n\ndefineExpose({ focusInput });\n</script>\n\n<template>\n    <div class=\"g-note-input-wrap\">\n        <GRichTextToolbar :editor=\"editor\" class=\"toolbar\" />\n        <EditorContent :editor=\"editor\" class=\"editor-content\" />\n    </div>\n</template>\n\n<style>\n.g-note-input-wrap {\n    .tiptap {\n        background: transparent;\n        border: none;\n        padding: 0.5em;\n        font-size: 15px;\n        min-height: 12em;\n        flex: 1;\n        outline: none;\n\n        p {\n            margin: 0.375em 0 0;\n        }\n\n        > :first-child {\n            margin-top: 0;\n        }\n        > :last-child {\n            margin-bottom: 0;\n        }\n\n        ul,\n        ol {\n            padding: 0 1em;\n            margin: 0.375em 1em 0 0.4em;\n\n            li p {\n                margin-top: 0;\n                margin-bottom: 0;\n            }\n        }\n        p.is-editor-empty:first-child::before {\n            color: var(--g-surface-600);\n            content: attr(data-placeholder);\n            float: left;\n            height: 0;\n            pointer-events: none;\n        }\n    }\n}\n</style>\n\n<style scoped>\n.g-note-input-wrap {\n    display: flex;\n    flex-direction: column;\n    background: var(--g-surface-0);\n    border: 2px solid var(--g-primary-500);\n    border-radius: 4px;\n\n    &:has(.ProseMirror-focused) {\n        outline: 2px solid var(--g-primary-500);\n        outline-offset: 2px;\n        box-shadow: 0 0 0 2px var(--g-info-200);\n        border-color: var(--g-info-200);\n    }\n}\n\n.toolbar {\n    border-bottom: 1px solid var(--g-surface-200);\n    background-color: var(--g-surface-0);\n    padding: 0.25rem;\n\n    :deep(button) {\n        border-radius: 4px;\n\n        &:focus {\n            outline: 2px solid var(--g-primary-500);\n            outline-offset: 2px;\n        }\n    }\n}\n\n.editor-content {\n    flex: 1;\n    min-width: 0;\n}\n</style>\n","import { computed, onMounted, ref, type Ref, toValue, watch } from \"vue\";\nimport Document from \"@tiptap/extension-document\";\nimport Paragraph from \"@tiptap/extension-paragraph\";\nimport Text from \"@tiptap/extension-text\";\nimport Bold from \"@tiptap/extension-bold\";\nimport Italic from \"@tiptap/extension-italic\";\nimport { ListKit } from \"@tiptap/extension-list\";\nimport { generateHTML } from \"@tiptap/core\";\n\nconst extensions = [Document, Paragraph, Text, Bold, Italic, ListKit];\n\n/**\n * Composable for rendering a JSON string of tiptap content to HTML.\n * Supports all extensions used by GChatInput and GNoteInput.\n *\n * @param content - A reactive ref or plain string containing JSON-encoded tiptap content\n * @returns `rendered` — rendered HTML string, empty string for empty content, or `null` when rendering fails;\n *          `hasError` — `true` when the content cannot be parsed or rendered\n */\nexport function useRichTextRenderer(content: Ref<string>) {\n    const rendered = ref<string | null>(\"\");\n\n    onMounted(() => {\n        watch(content, () => {\n            const value = toValue(content);\n            if (!value || value.trim() === \"\") {\n                return \"\";\n            }\n\n            try {\n                const parsed = JSON.parse(value);\n                let html = generateHTML(\n                    parsed,\n                    extensions\n                );\n                rendered.value = html;\n            } catch (error) {\n                console.error(\"Failed to parse content:\", value);\n                console.error(error);\n                rendered.value = null;\n            }\n        }, {immediate: true});\n    });\n\n    const hasError = computed(() => rendered.value === null);\n\n    return { rendered, hasError };\n}\n","<script setup lang=\"ts\">\n/**\n * Renders a JSON string of tiptap content as HTML.\n * Supports all formatting produced by GChatInput and GNoteInput:\n * bold, italic, ordered lists, and bullet lists.\n *\n * - Empty content is handled gracefully (renders nothing).\n * - Displays an error message when the content cannot be parsed or rendered.\n *\n * The rendering only happens in the client when used with Nuxt.js.\n *\n * **Security note**: rendered HTML is produced by tiptap's `generateHTML`, which only\n * serializes recognized document nodes - it does not inject raw HTML from the JSON.\n *\n * **Note**: This component is part of the `@illinois-grad/grad-vue-rte` package, which includes Tiptap dependencies.\n */\nimport { toRef } from \"vue\";\nimport { useRichTextRenderer } from \"../composables/useRichTextRenderer\";\n\ninterface Props {\n    /**\n     * Error message when rendering fails\n     */\n    error?: string;\n\n    // JSON-encoded tiptap content string to render.\n    content: string;\n}\n\nconst props = defineProps<Props>();\n\nconst contentRef = toRef(props, \"content\");\n\nconst { rendered, hasError } = useRichTextRenderer(contentRef);\n\n</script>\n\n<template>\n    <div class=\"g-rich-text-content-wrap\">\n        <div v-if=\"hasError\" role=\"alert\" class=\"g-rich-text-content-error\">\n            {{ error || 'Failed to render content.' }}\n        </div>\n        <div v-else-if=\"rendered\" class=\"g-rich-text-content\" v-html=\"rendered\"></div>\n    </div>\n</template>\n\n<style scoped>\n.g-rich-text-content {\n    p {\n        margin: 0.375em 0;\n    }\n\n    > :first-child {\n        margin-top: 0;\n    }\n\n    > :last-child {\n        margin-bottom: 0;\n    }\n\n    ul,\n    ol {\n        padding: 0 1em;\n        margin: 0.375em 1em 0 0.4em;\n\n        li p {\n            margin-top: 0;\n            margin-bottom: 0;\n        }\n    }\n}\n\n.g-rich-text-content-error {\n    color: var(--g-danger-700);\n    font-size: 0.875em;\n}\n</style>\n"],"names":["useRichTextEditor","options","content","placeholder","label","onUpdate","editorProps","placeholderValue","labelValue","editor","useEditor","Document","Paragraph","Text","Bold","Italic","ListKit","UndoRedo","Placeholder","watch","val","toRaw","focusEditor","useToolbarNavigation","toolbarRef","activeButtonIndex","ref","handleToolbarKeyDown","event","toolbar","buttons","currentIndex","btn","nextIndex","getButtonTabIndex","index","props","__props","editorRef","computed","_createElementBlock","_cache","_unref","args","_createElementVNode","$event","_normalizeClass","model","_useModel","emit","__emit","view","onSend","clickSend","focusInput","__expose","_openBlock","_hoisted_1","_createBlock","BubbleMenu","_createVNode","GRichTextToolbar","EditorContent","extensions","useRichTextRenderer","rendered","onMounted","value","toValue","parsed","html","generateHTML","error","hasError","contentRef","toRef","_hoisted_2","_toDisplayString"],"mappings":"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"}

package/dist/plugin.d.ts

@@ -1,5 +1,5 @@
 import type { App } from "vue";
-import { GChatInput, GNoteInput } from "./grad-vue-rte.ts";
+import { GChatInput, GNoteInput, GRichTextContent } from "./grad-vue-rte.ts";
 declare const _default: {
     install(app: App): void;
 };
@@ -8,5 +8,6 @@ declare module "vue" {
     interface GlobalComponents {
         GChatInput: typeof GChatInput;
         GNoteInput: typeof GNoteInput;
+        GRichTextContent: typeof GRichTextContent;
     }
 }

package/dist/plugin.js

@@ -1,10 +1,18 @@
-import { G as n, a as o } from "./main-EtH7847A.js";
-const p = {
+import { G as o, a as n, b as p } from "./main-Bh1IF4ob.js";
+import "vue";
+import "@tiptap/extension-document";
+import "@tiptap/extension-paragraph";
+import "@tiptap/extension-text";
+import "@tiptap/extension-bold";
+import "@tiptap/extension-italic";
+import "@tiptap/extension-list";
+import "@tiptap/core";
+const h = {
   install(t) {
-    t.component("GChatInput", n), t.component("GNoteInput", o);
+    t.component("GChatInput", o), t.component("GNoteInput", n), t.component("GRichTextContent", p);
   }
 };
 export {
-  p as default
+  h as default
 };
 //# sourceMappingURL=plugin.js.map

package/dist/plugin.js.map

@@ -1 +1 @@
-{"version":3,"file":"plugin.js","sources":["../src/plugin.ts"],"sourcesContent":["import type { App } from \"vue\";\nimport {\n    GChatInput,\n    GNoteInput,\n} from \"./grad-vue-rte.ts\";\n\nexport default {\n    install(app: App) {\n        app.component(\"GChatInput\", GChatInput);\n        app.component(\"GNoteInput\", GNoteInput);\n    },\n};\n\ndeclare module \"vue\" {\n    export interface GlobalComponents {\n        GChatInput: typeof GChatInput;\n        GNoteInput: typeof GNoteInput;\n    }\n}\n"],"names":["plugin","app","GChatInput","GNoteInput"],"mappings":";AAMA,MAAAA,IAAe;AAAA,EACX,QAAQC,GAAU;AACd,IAAAA,EAAI,UAAU,cAAcC,CAAU,GACtCD,EAAI,UAAU,cAAcE,CAAU;AAAA,EAC1C;AACJ;"}
+{"version":3,"file":"plugin.js","sources":["../src/plugin.ts"],"sourcesContent":["import type { App } from \"vue\";\nimport {\n    GChatInput,\n    GNoteInput,\n    GRichTextContent,\n} from \"./grad-vue-rte.ts\";\n\nexport default {\n    install(app: App) {\n        app.component(\"GChatInput\", GChatInput);\n        app.component(\"GNoteInput\", GNoteInput);\n        app.component(\"GRichTextContent\", GRichTextContent);\n    },\n};\n\ndeclare module \"vue\" {\n    export interface GlobalComponents {\n        GChatInput: typeof GChatInput;\n        GNoteInput: typeof GNoteInput;\n        GRichTextContent: typeof GRichTextContent;\n    }\n}\n"],"names":["plugin","app","GChatInput","GNoteInput","GRichTextContent"],"mappings":";;;;;;;;;AAOA,MAAAA,IAAe;AAAA,EACX,QAAQC,GAAU;AACd,IAAAA,EAAI,UAAU,cAAcC,CAAU,GACtCD,EAAI,UAAU,cAAcE,CAAU,GACtCF,EAAI,UAAU,oBAAoBG,CAAgB;AAAA,EACtD;AACJ;"}

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@illinois-grad/grad-vue-rte",
-    "version": "2.3.3",
+    "version": "2.3.5",
     "description": "Rich text editor components for Graduate College apps using Tiptap.",
     "keywords": [
         "vue",
@@ -34,19 +34,19 @@
         "dist"
     ],
     "scripts": {
-        "build": "vite build && vue-tsc --emitDeclarationOnly"
+        "build": "vite build && vue-tsc --emitDeclarationOnly",
+        "watch": "vite build --watch"
     },
     "dependencies": {
-        "@tiptap/core": "^3.4.0",
-        "@tiptap/extension-bold": "^3.4.0",
-        "@tiptap/extension-document": "^3.4.0",
-        "@tiptap/extension-italic": "^3.4.0",
-        "@tiptap/extension-list": "^3.4.0",
-        "@tiptap/extension-paragraph": "^3.4.0",
-        "@tiptap/extension-placeholder": "^3.4.0",
-        "@tiptap/extension-text": "^3.4.0",
-        "@tiptap/extensions": "^3.4.0",
-        "@tiptap/vue-3": "^3.4.0",
+        "@tiptap/extension-bold": "^3.20.1",
+        "@tiptap/extension-document": "^3.20.1",
+        "@tiptap/extension-italic": "^3.20.1",
+        "@tiptap/extension-list": "^3.20.1",
+        "@tiptap/extension-paragraph": "^3.20.1",
+        "@tiptap/extension-placeholder": "^3.20.1",
+        "@tiptap/extension-text": "^3.20.1",
+        "@tiptap/extensions": "^3.20.1",
+        "@tiptap/vue-3": "^3.20.1",
         "vue": "^3.5"
     },
     "devDependencies": {

package/dist/main-EtH7847A.js

@@ -1,338 +0,0 @@
-import { watch as k, toRaw as z, ref as C, defineComponent as x, computed as m, createElementBlock as H, createCommentVNode as L, openBlock as h, unref as d, createElementVNode as s, normalizeClass as v, mergeModels as w, useModel as V, createBlock as M, createVNode as g, withCtx as N } from "vue";
-import { useEditor as S, EditorContent as B } from "@tiptap/vue-3";
-import { BubbleMenu as T } from "@tiptap/vue-3/menus";
-import E from "@tiptap/extension-document";
-import O from "@tiptap/extension-paragraph";
-import D from "@tiptap/extension-text";
-import R from "@tiptap/extension-bold";
-import $ from "@tiptap/extension-italic";
-import { ListKit as G } from "@tiptap/extension-list";
-import { UndoRedo as J, Placeholder as K } from "@tiptap/extensions";
-function I(t) {
-  const { content: c, placeholder: l, label: a, onUpdate: n, editorProps: i = {} } = t, r = typeof l == "string" ? l : l.value, e = typeof a == "string" ? a : a.value, o = S({
-    content: c.value || "",
-    extensions: [
-      E,
-      O,
-      D,
-      R,
-      $,
-      G,
-      J,
-      K.configure({ placeholder: r })
-    ],
-    editorProps: {
-      ...i,
-      attributes: {
-        "aria-label": e,
-        ...i.attributes
-      }
-    },
-    onUpdate({ editor: u }) {
-      c.value = u.getJSON(), n && n(u);
-    }
-  });
-  k(
-    () => typeof a == "string" ? a : a.value,
-    (u) => {
-      o.value && o.value?.setOptions({
-        editorProps: {
-          attributes: {
-            "aria-label": u
-          }
-        }
-      });
-    }
-  ), k(
-    () => c.value,
-    (u) => {
-      o.value && JSON.stringify(u) !== JSON.stringify(o.value.getJSON()) && o.value.commands.setContent(z(u) || "");
-    }
-  );
-  function f() {
-    o.value?.commands?.focus();
-  }
-  return {
-    editor: o,
-    focusEditor: f
-  };
-}
-function P(t, c) {
-  const l = C(0);
-  function a(i) {
-    const r = c.value;
-    if (!r) return;
-    const e = Array.from(
-      r.querySelectorAll("button")
-    ), o = e.findIndex(
-      (u) => u === document.activeElement
-    );
-    if (i.key === "Escape") {
-      i.preventDefault(), t.value?.commands?.focus();
-      return;
-    }
-    if (i.key === "Tab")
-      return;
-    let f = o;
-    switch (i.key) {
-      case "ArrowRight":
-      case "ArrowDown":
-        i.preventDefault(), f = o < e.length - 1 ? o + 1 : 0;
-        break;
-      case "ArrowLeft":
-      case "ArrowUp":
-        i.preventDefault(), f = o > 0 ? o - 1 : e.length - 1;
-        break;
-      case "Home":
-        i.preventDefault(), f = 0;
-        break;
-      case "End":
-        i.preventDefault(), f = e.length - 1;
-        break;
-      default:
-        return;
-    }
-    l.value = f, e[f]?.focus();
-  }
-  function n(i) {
-    return i === l.value ? 0 : -1;
-  }
-  return {
-    activeButtonIndex: l,
-    handleToolbarKeyDown: a,
-    getButtonTabIndex: n
-  };
-}
-const U = ["aria-pressed", "tabindex"], j = ["aria-pressed", "tabindex"], q = ["aria-pressed", "tabindex"], W = ["aria-pressed", "tabindex"], F = /* @__PURE__ */ x({
-  __name: "GRichTextToolbar",
-  props: {
-    editor: {}
-  },
-  setup(t) {
-    const c = t, l = C(null), a = m(() => c.editor), { handleToolbarKeyDown: n, getButtonTabIndex: i } = P(
-      a,
-      l
-    );
-    return (r, e) => t.editor ? (h(), H("div", {
-      key: 0,
-      class: "g-rich-text-toolbar",
-      role: "toolbar",
-      "aria-label": "Text formatting",
-      ref_key: "toolbarRef",
-      ref: l,
-      onKeydown: e[4] || (e[4] = //@ts-ignore
-      (...o) => d(n) && d(n)(...o)),
-      tabindex: "-1"
-    }, [
-      s("button", {
-        onClick: e[0] || (e[0] = (o) => t.editor.chain().focus().toggleBold().run()),
-        class: v({
-          bold: !0,
-          "is-active": t.editor.isActive("bold")
-        }),
-        "aria-pressed": t.editor.isActive("bold"),
-        title: "Bold",
-        "aria-label": "Bold",
-        type: "button",
-        tabindex: d(i)(0)
-      }, [...e[5] || (e[5] = [
-        s("svg", {
-          xmlns: "http://www.w3.org/2000/svg",
-          viewBox: "0 0 384 512",
-          width: "16",
-          height: "16",
-          fill: "currentColor",
-          "aria-hidden": "true"
-        }, [
-          s("path", { d: "M0 64C0 46.3 14.3 32 32 32H80 96 224c70.7 0 128 57.3 128 128c0 31.3-11.3 60.1-30 82.3c37.1 22.4 62 63.1 62 109.7c0 70.7-57.3 128-128 128H96 80 32c-17.7 0-32-14.3-32-32s14.3-32 32-32H48V256 96H32C14.3 96 0 81.7 0 64zM224 224c35.3 0 64-28.7 64-64s-28.7-64-64-64H112V224H224zM112 288V416H256c35.3 0 64-28.7 64-64s-28.7-64-64-64H224 112z" })
-        ], -1)
-      ])], 10, U),
-      s("button", {
-        onClick: e[1] || (e[1] = (o) => t.editor.chain().focus().toggleItalic().run()),
-        class: v({
-          italic: !0,
-          "is-active": t.editor.isActive("italic")
-        }),
-        "aria-pressed": t.editor.isActive("italic"),
-        title: "Italic",
-        "aria-label": "Italic",
-        type: "button",
-        tabindex: d(i)(1)
-      }, [...e[6] || (e[6] = [
-        s("svg", {
-          xmlns: "http://www.w3.org/2000/svg",
-          viewBox: "0 0 384 512",
-          width: "16",
-          height: "16",
-          fill: "currentColor",
-          "aria-hidden": "true"
-        }, [
-          s("path", { d: "M128 64c0-17.7 14.3-32 32-32H352c17.7 0 32 14.3 32 32s-14.3 32-32 32H293.3L160 416h64c17.7 0 32 14.3 32 32s-14.3 32-32 32H32c-17.7 0-32-14.3-32-32s14.3-32 32-32H90.7L224 96H160c-17.7 0-32-14.3-32-32z" })
-        ], -1)
-      ])], 10, j),
-      s("button", {
-        onClick: e[2] || (e[2] = (o) => t.editor.chain().focus().toggleOrderedList().run()),
-        class: v({ "is-active": t.editor.isActive("orderedList") }),
-        "aria-pressed": t.editor.isActive("orderedList"),
-        title: "Ordered List",
-        "aria-label": "Ordered List",
-        type: "button",
-        tabindex: d(i)(2)
-      }, [...e[7] || (e[7] = [
-        s("svg", {
-          xmlns: "http://www.w3.org/2000/svg",
-          viewBox: "0 0 512 512",
-          width: "16",
-          height: "16",
-          fill: "currentColor",
-          "aria-hidden": "true"
-        }, [
-          s("path", { d: "M24 56c0-13.3 10.7-24 24-24H80c13.3 0 24 10.7 24 24V176h16c13.3 0 24 10.7 24 24s-10.7 24-24 24H48c-13.3 0-24-10.7-24-24s10.7-24 24-24H64V80H48C34.7 80 24 69.3 24 56zM86.7 341.2c-6.5-7.4-18.3-6.9-24 1.2L51.5 357.9c-7.7 10.8-22.7 13.3-33.5 5.6s-13.3-22.7-5.6-33.5l11.1-15.6c23.7-33.2 72.3-35.6 99.2-4.9c21.3 24.4 20.8 60.9-1.1 84.7L86.8 432H120c13.3 0 24 10.7 24 24s-10.7 24-24 24H48c-9.5 0-18.2-5.6-22-14.4s-2.1-18.9 4.3-25.9l72-78c5.3-5.8 5.4-14.6 .3-20.5zM224 64H480c17.7 0 32 14.3 32 32s-14.3 32-32 32H224c-17.7 0-32-14.3-32-32s14.3-32 32-32zm0 160H480c17.7 0 32 14.3 32 32s-14.3 32-32 32H224c-17.7 0-32-14.3-32-32s14.3-32 32-32zm0 160H480c17.7 0 32 14.3 32 32s-14.3 32-32 32H224c-17.7 0-32-14.3-32-32s14.3-32 32-32z" })
-        ], -1)
-      ])], 10, q),
-      s("button", {
-        onClick: e[3] || (e[3] = (o) => t.editor.chain().focus().toggleBulletList().run()),
-        class: v({ "is-active": t.editor.isActive("bulletList") }),
-        "aria-pressed": t.editor.isActive("bulletList"),
-        title: "Unordered List",
-        "aria-label": "Unordered List",
-        type: "button",
-        tabindex: d(i)(3)
-      }, [...e[8] || (e[8] = [
-        s("svg", {
-          xmlns: "http://www.w3.org/2000/svg",
-          viewBox: "0 0 512 512",
-          width: "16",
-          height: "16",
-          fill: "currentColor",
-          "aria-hidden": "true"
-        }, [
-          s("path", { d: "M40 48C26.7 48 16 58.7 16 72v48c0 13.3 10.7 24 24 24H88c13.3 0 24-10.7 24-24V72c0-13.3-10.7-24-24-24H40zM192 64c-17.7 0-32 14.3-32 32s14.3 32 32 32H480c17.7 0 32-14.3 32-32s-14.3-32-32-32H192zm0 160c-17.7 0-32 14.3-32 32s14.3 32 32 32H480c17.7 0 32-14.3 32-32s-14.3-32-32-32H192zm0 160c-17.7 0-32 14.3-32 32s14.3 32 32 32H480c17.7 0 32-14.3 32-32s-14.3-32-32-32H192zM16 232v48c0 13.3 10.7 24 24 24H88c13.3 0 24-10.7 24-24V232c0-13.3-10.7-24-24-24H40c-13.3 0-24 10.7-24 24zM40 368c-13.3 0-24 10.7-24 24v48c0 13.3 10.7 24 24 24H88c13.3 0 24-10.7 24-24V392c0-13.3-10.7-24-24-24H40z" })
-        ], -1)
-      ])], 10, W)
-    ], 544)) : L("", !0);
-  }
-}), y = (t, c) => {
-  const l = t.__vccOpts || t;
-  for (const [a, n] of c)
-    l[a] = n;
-  return l;
-}, A = /* @__PURE__ */ y(F, [["__scopeId", "data-v-8c490655"]]), Q = { class: "g-chat-input-wrap" }, X = ["disabled"], Y = /* @__PURE__ */ x({
-  inheritAttrs: !1,
-  __name: "GChatInput",
-  props: /* @__PURE__ */ w({
-    placeholder: { default: "Type a comment" },
-    disabled: { type: Boolean, default: !1 },
-    maxRows: { default: 5 },
-    label: { default: "Comment input" }
-  }, {
-    modelValue: {},
-    modelModifiers: {}
-  }),
-  emits: /* @__PURE__ */ w(["send"], ["update:modelValue"]),
-  setup(t, { expose: c, emit: l }) {
-    const a = t, n = V(t, "modelValue"), i = l, { editor: r, focusEditor: e } = I({
-      content: n,
-      placeholder: m(() => a.placeholder),
-      label: m(() => a.label),
-      editorProps: {
-        handleKeyDown(p, b) {
-          if (r.value && b.key === "Enter") {
-            if (r.value.isActive("orderedList") || r.value.isActive("bulletList"))
-              return !1;
-            if (b.shiftKey)
-              r.value.commands.splitBlock();
-            else
-              return n.value = r.value?.getJSON(), b.preventDefault(), o(r.value?.getJSON()), !0;
-          }
-          return !1;
-        },
-        attributes: {
-          "aria-keyshortcuts": "Shift+Enter"
-        }
-      }
-    });
-    function o(p) {
-      p && i("send", p);
-    }
-    function f() {
-      o(r.value?.getJSON());
-    }
-    function u() {
-      e();
-    }
-    return c({ focusInput: u }), (p, b) => (h(), H("div", Q, [
-      d(r) ? (h(), M(d(T), {
-        key: 0,
-        editor: d(r)
-      }, {
-        default: N(() => [
-          g(A, {
-            editor: d(r),
-            class: "bubble-menu"
-          }, null, 8, ["editor"])
-        ]),
-        _: 1
-      }, 8, ["editor"])) : L("", !0),
-      g(d(B), {
-        editor: d(r),
-        class: "editor-content"
-      }, null, 8, ["editor"]),
-      s("button", {
-        class: "g-chat-send-btn",
-        disabled: a.disabled || !n.value || n.value && Object.keys(n.value).length === 0,
-        onClick: f,
-        title: "Send",
-        "aria-label": "Send",
-        type: "button"
-      }, [...b[0] || (b[0] = [
-        s("svg", {
-          xmlns: "http://www.w3.org/2000/svg",
-          viewBox: "0 0 512 512",
-          width: "16",
-          height: "16",
-          fill: "currentColor",
-          "aria-hidden": "true"
-        }, [
-          s("path", { d: "M498.1 5.6c10.1 7 15.4 19.1 13.5 31.2l-64 416c-1.5 9.7-7.4 18.2-16 23s-18.9 5.4-28 1.6L284 427.7l-68.5 74.1c-8.9 9.7-22.9 12.9-35.2 8.1S160 493.2 160 480V396.4c0-4 1.5-7.8 4.2-10.7L331.8 202.8c5.8-6.3 5.6-16-.4-22s-15.7-6.4-22-.7L106 360.8 17.7 316.6C7.1 311.3 .3 300.7 0 288.9s5.9-22.8 16.1-28.7l448-256c10.7-6.1 23.9-5.5 34 1.4z" })
-        ], -1)
-      ])], 8, X)
-    ]));
-  }
-}), ce = /* @__PURE__ */ y(Y, [["__scopeId", "data-v-45a4a5f2"]]), Z = { class: "g-note-input-wrap" }, _ = /* @__PURE__ */ x({
-  inheritAttrs: !1,
-  __name: "GNoteInput",
-  props: /* @__PURE__ */ w({
-    placeholder: { default: "Write a note..." },
-    label: { default: "Note input" }
-  }, {
-    modelValue: {},
-    modelModifiers: {}
-  }),
-  emits: ["update:modelValue"],
-  setup(t, { expose: c }) {
-    const l = t, a = V(t, "modelValue"), { editor: n, focusEditor: i } = I({
-      content: a,
-      placeholder: m(() => l.placeholder),
-      label: m(() => l.label)
-    });
-    function r() {
-      i();
-    }
-    return c({ focusInput: r }), (e, o) => (h(), H("div", Z, [
-      g(A, {
-        editor: d(n),
-        class: "toolbar"
-      }, null, 8, ["editor"]),
-      g(d(B), {
-        editor: d(n),
-        class: "editor-content"
-      }, null, 8, ["editor"])
-    ]));
-  }
-}), ue = /* @__PURE__ */ y(_, [["__scopeId", "data-v-c2d30b96"]]);
-export {
-  ce as G,
-  ue as a
-};
-//# sourceMappingURL=main-EtH7847A.js.map

package/dist/main-EtH7847A.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"main-EtH7847A.js","sources":["../src/composables/useRichTextEditor.ts","../src/composables/useToolbarNavigation.ts","../src/components/editor/GRichTextToolbar.vue","../src/components/GChatInput.vue","../src/components/GNoteInput.vue"],"sourcesContent":["import { toRaw, watch, type Ref } from \"vue\";\nimport { useEditor } from \"@tiptap/vue-3\";\nimport Document from \"@tiptap/extension-document\";\nimport Paragraph from \"@tiptap/extension-paragraph\";\nimport Text from \"@tiptap/extension-text\";\nimport Bold from \"@tiptap/extension-bold\";\nimport Italic from \"@tiptap/extension-italic\";\nimport { ListKit } from \"@tiptap/extension-list\";\nimport { UndoRedo, Placeholder } from \"@tiptap/extensions\";\n\ninterface UseRichTextEditorOptions {\n    content: Ref<object | \"\" | undefined>;\n    placeholder: Ref<string> | string;\n    label: Ref<string> | string;\n    onUpdate?: (editor: any) => void;\n    editorProps?: Record<string, any>;\n}\n\nexport function useRichTextEditor(options: UseRichTextEditorOptions) {\n    const { content, placeholder, label, onUpdate, editorProps = {} } = options;\n\n    const placeholderValue = typeof placeholder === 'string' ? placeholder : placeholder.value;\n    const labelValue = typeof label === 'string' ? label : label.value;\n\n    const editor = useEditor({\n        content: content.value || \"\",\n        extensions: [\n            Document,\n            Paragraph,\n            Text,\n            Bold,\n            Italic,\n            ListKit,\n            UndoRedo,\n            Placeholder.configure({ placeholder: placeholderValue }),\n        ],\n        editorProps: {\n            ...editorProps,\n            attributes: {\n                \"aria-label\": labelValue,\n                ...editorProps.attributes,\n            },\n        },\n        onUpdate({ editor }) {\n            content.value = editor.getJSON();\n            if (onUpdate) {\n                onUpdate(editor);\n            }\n        },\n    });\n\n    // Watch for label changes and update editor\n    watch(\n        () => typeof label === 'string' ? label : label.value,\n        (val) => {\n            if (editor.value) {\n                editor.value?.setOptions({\n                    editorProps: {\n                        attributes: {\n                            \"aria-label\": val,\n                        },\n                    },\n                });\n            }\n        },\n    );\n\n    // Watch for content changes and update editor\n    watch(\n        () => content.value,\n        (val) => {\n            if (\n                editor.value &&\n                JSON.stringify(val) !== JSON.stringify(editor.value.getJSON())\n            ) {\n                editor.value.commands.setContent(toRaw(val) || \"\");\n            }\n        },\n    );\n\n    function focusEditor() {\n        editor.value?.commands?.focus();\n    }\n\n    return {\n        editor,\n        focusEditor,\n    };\n}\n","import { ref, type Ref } from \"vue\";\nimport type { Editor } from \"@tiptap/vue-3\";\n\nexport function useToolbarNavigation(editor: Ref<Editor | undefined>, toolbarRef: Ref<HTMLElement | null>) {\n    const activeButtonIndex = ref(0);\n\n    function handleToolbarKeyDown(event: KeyboardEvent) {\n        const toolbar = toolbarRef.value;\n        if (!toolbar) return;\n\n        const buttons = Array.from(\n            toolbar.querySelectorAll(\"button\"),\n        ) as HTMLButtonElement[];\n        const currentIndex = buttons.findIndex(\n            (btn) => btn === document.activeElement,\n        );\n\n        // Handle Escape key - return focus to editor\n        if (event.key === \"Escape\") {\n            event.preventDefault();\n            editor.value?.commands?.focus();\n            return;\n        }\n\n        // Don't handle Tab - let it exit the toolbar naturally\n        if (event.key === \"Tab\") {\n            return;\n        }\n\n        let nextIndex = currentIndex;\n\n        switch (event.key) {\n            case \"ArrowRight\":\n            case \"ArrowDown\":\n                event.preventDefault();\n                nextIndex =\n                    currentIndex < buttons.length - 1 ? currentIndex + 1 : 0;\n                break;\n            case \"ArrowLeft\":\n            case \"ArrowUp\":\n                event.preventDefault();\n                nextIndex =\n                    currentIndex > 0 ? currentIndex - 1 : buttons.length - 1;\n                break;\n            case \"Home\":\n                event.preventDefault();\n                nextIndex = 0;\n                break;\n            case \"End\":\n                event.preventDefault();\n                nextIndex = buttons.length - 1;\n                break;\n            default:\n                return;\n        }\n\n        // Update active button index and focus\n        activeButtonIndex.value = nextIndex;\n        buttons[nextIndex]?.focus();\n    }\n\n    function getButtonTabIndex(index: number): number {\n        return index === activeButtonIndex.value ? 0 : -1;\n    }\n\n    return {\n        activeButtonIndex,\n        handleToolbarKeyDown,\n        getButtonTabIndex,\n    };\n}\n","<script lang=\"ts\" setup>\nimport { ref, computed } from \"vue\";\nimport type { Editor } from \"@tiptap/vue-3\";\nimport { useToolbarNavigation } from \"../../composables/useToolbarNavigation.ts\";\n\ninterface Props {\n    editor: Editor | undefined;\n}\n\nconst props = defineProps<Props>();\n\nconst toolbarRef = ref<HTMLElement | null>(null);\nconst editorRef = computed(() => props.editor);\nconst { handleToolbarKeyDown, getButtonTabIndex } = useToolbarNavigation(\n    editorRef,\n    toolbarRef,\n);\n</script>\n\n<template>\n    <div\n        v-if=\"editor\"\n        class=\"g-rich-text-toolbar\"\n        role=\"toolbar\"\n        aria-label=\"Text formatting\"\n        ref=\"toolbarRef\"\n        @keydown=\"handleToolbarKeyDown\"\n        tabindex=\"-1\"\n    >\n        <button\n            @click=\"editor.chain().focus().toggleBold().run()\"\n            :class=\"{\n                bold: true,\n                'is-active': editor.isActive('bold'),\n            }\"\n            :aria-pressed=\"editor.isActive('bold')\"\n            title=\"Bold\"\n            aria-label=\"Bold\"\n            type=\"button\"\n            :tabindex=\"getButtonTabIndex(0)\"\n        >\n            <svg\n                xmlns=\"http://www.w3.org/2000/svg\"\n                viewBox=\"0 0 384 512\"\n                width=\"16\"\n                height=\"16\"\n                fill=\"currentColor\"\n                aria-hidden=\"true\"\n            >\n                <path\n                    d=\"M0 64C0 46.3 14.3 32 32 32H80 96 224c70.7 0 128 57.3 128 128c0 31.3-11.3 60.1-30 82.3c37.1 22.4 62 63.1 62 109.7c0 70.7-57.3 128-128 128H96 80 32c-17.7 0-32-14.3-32-32s14.3-32 32-32H48V256 96H32C14.3 96 0 81.7 0 64zM224 224c35.3 0 64-28.7 64-64s-28.7-64-64-64H112V224H224zM112 288V416H256c35.3 0 64-28.7 64-64s-28.7-64-64-64H224 112z\"\n                />\n            </svg>\n        </button>\n        <button\n            @click=\"editor.chain().focus().toggleItalic().run()\"\n            :class=\"{\n                italic: true,\n                'is-active': editor.isActive('italic'),\n            }\"\n            :aria-pressed=\"editor.isActive('italic')\"\n            title=\"Italic\"\n            aria-label=\"Italic\"\n            type=\"button\"\n            :tabindex=\"getButtonTabIndex(1)\"\n        >\n            <svg\n                xmlns=\"http://www.w3.org/2000/svg\"\n                viewBox=\"0 0 384 512\"\n                width=\"16\"\n                height=\"16\"\n                fill=\"currentColor\"\n                aria-hidden=\"true\"\n            >\n                <path\n                    d=\"M128 64c0-17.7 14.3-32 32-32H352c17.7 0 32 14.3 32 32s-14.3 32-32 32H293.3L160 416h64c17.7 0 32 14.3 32 32s-14.3 32-32 32H32c-17.7 0-32-14.3-32-32s14.3-32 32-32H90.7L224 96H160c-17.7 0-32-14.3-32-32z\"\n                />\n            </svg>\n        </button>\n        <button\n            @click=\"editor.chain().focus().toggleOrderedList().run()\"\n            :class=\"{ 'is-active': editor.isActive('orderedList') }\"\n            :aria-pressed=\"editor.isActive('orderedList')\"\n            title=\"Ordered List\"\n            aria-label=\"Ordered List\"\n            type=\"button\"\n            :tabindex=\"getButtonTabIndex(2)\"\n        >\n            <svg\n                xmlns=\"http://www.w3.org/2000/svg\"\n                viewBox=\"0 0 512 512\"\n                width=\"16\"\n                height=\"16\"\n                fill=\"currentColor\"\n                aria-hidden=\"true\"\n            >\n                <path\n                    d=\"M24 56c0-13.3 10.7-24 24-24H80c13.3 0 24 10.7 24 24V176h16c13.3 0 24 10.7 24 24s-10.7 24-24 24H48c-13.3 0-24-10.7-24-24s10.7-24 24-24H64V80H48C34.7 80 24 69.3 24 56zM86.7 341.2c-6.5-7.4-18.3-6.9-24 1.2L51.5 357.9c-7.7 10.8-22.7 13.3-33.5 5.6s-13.3-22.7-5.6-33.5l11.1-15.6c23.7-33.2 72.3-35.6 99.2-4.9c21.3 24.4 20.8 60.9-1.1 84.7L86.8 432H120c13.3 0 24 10.7 24 24s-10.7 24-24 24H48c-9.5 0-18.2-5.6-22-14.4s-2.1-18.9 4.3-25.9l72-78c5.3-5.8 5.4-14.6 .3-20.5zM224 64H480c17.7 0 32 14.3 32 32s-14.3 32-32 32H224c-17.7 0-32-14.3-32-32s14.3-32 32-32zm0 160H480c17.7 0 32 14.3 32 32s-14.3 32-32 32H224c-17.7 0-32-14.3-32-32s14.3-32 32-32zm0 160H480c17.7 0 32 14.3 32 32s-14.3 32-32 32H224c-17.7 0-32-14.3-32-32s14.3-32 32-32z\"\n                />\n            </svg>\n        </button>\n        <button\n            @click=\"editor.chain().focus().toggleBulletList().run()\"\n            :class=\"{ 'is-active': editor.isActive('bulletList') }\"\n            :aria-pressed=\"editor.isActive('bulletList')\"\n            title=\"Unordered List\"\n            aria-label=\"Unordered List\"\n            type=\"button\"\n            :tabindex=\"getButtonTabIndex(3)\"\n        >\n            <svg\n                xmlns=\"http://www.w3.org/2000/svg\"\n                viewBox=\"0 0 512 512\"\n                width=\"16\"\n                height=\"16\"\n                fill=\"currentColor\"\n                aria-hidden=\"true\"\n            >\n                <path\n                    d=\"M40 48C26.7 48 16 58.7 16 72v48c0 13.3 10.7 24 24 24H88c13.3 0 24-10.7 24-24V72c0-13.3-10.7-24-24-24H40zM192 64c-17.7 0-32 14.3-32 32s14.3 32 32 32H480c17.7 0 32-14.3 32-32s-14.3-32-32-32H192zm0 160c-17.7 0-32 14.3-32 32s14.3 32 32 32H480c17.7 0 32-14.3 32-32s-14.3-32-32-32H192zm0 160c-17.7 0-32 14.3-32 32s14.3 32 32 32H480c17.7 0 32-14.3 32-32s-14.3-32-32-32H192zM16 232v48c0 13.3 10.7 24 24 24H88c13.3 0 24-10.7 24-24V232c0-13.3-10.7-24-24-24H40c-13.3 0-24 10.7-24 24zM40 368c-13.3 0-24 10.7-24 24v48c0 13.3 10.7 24 24 24H88c13.3 0 24-10.7 24-24V392c0-13.3-10.7-24-24-24H40z\"\n                />\n            </svg>\n        </button>\n    </div>\n</template>\n\n<style scoped>\n.g-rich-text-toolbar {\n    display: flex;\n\n    button {\n        background-color: unset;\n        padding: 0.4rem 0.5rem;\n        font-size: 0.875rem;\n        border: none;\n        cursor: pointer;\n        display: flex;\n        align-items: center;\n        justify-content: center;\n\n        &.bold {\n            font-weight: 700;\n        }\n        &.italic {\n            font-style: italic;\n        }\n\n        &.is-active {\n            color: var(--g-accent-700);\n            background-color: var(--g-surface-150);\n        }\n\n        &:hover {\n            background-color: var(--g-primary-300);\n            color: var(--g-primary-text);\n        }\n    }\n}\n</style>\n","<script lang=\"ts\" setup>\n/**\n * The GChatInput component provides a rich text editing experience using Tiptap. It supports:\n *\n *  - **Bold** and *italic* text formatting\n *  - Bullet and numbered lists\n *  - Bubble menu for formatting (appears when text is selected)\n *  - Press <kbd>Enter</kbd> to send, <kbd>Shift+Enter</kbd> for new line\n *  - Undo/redo support\n *\n *  **Note**: This component is part of the `@illinois-grad/grad-vue-rte` package, which includes Tiptap dependencies.\n */\nimport { computed } from \"vue\";\nimport { EditorContent } from \"@tiptap/vue-3\";\nimport { BubbleMenu } from \"@tiptap/vue-3/menus\";\nimport { useRichTextEditor } from \"../composables/useRichTextEditor\";\nimport GRichTextToolbar from \"./editor/GRichTextToolbar.vue\";\n\ndefineOptions({ inheritAttrs: false });\n\ninterface Props {\n    /**\n     * Placeholder text\n     */\n    placeholder?: string;\n    /**\n     * Disabled\n     */\n    disabled?: boolean;\n    /**\n     * Maximum number of rows\n     */\n    maxRows?: number;\n    /**\n     * Accessible label\n     */\n    label?: string;\n}\n\nconst props = withDefaults(defineProps<Props>(), {\n    placeholder: \"Type a comment\",\n    label: \"Comment input\",\n    disabled: false,\n    maxRows: 5,\n});\nconst model = defineModel<object | \"\">();\nconst emit = defineEmits<{ send: [content: object] }>();\n\nconst { editor, focusEditor } = useRichTextEditor({\n    content: model as any,\n    placeholder: computed(() => props.placeholder),\n    label: computed(() => props.label),\n    editorProps: {\n        handleKeyDown(view: any, event: any) {\n            if (editor.value && event.key === \"Enter\") {\n                if (\n                    editor.value.isActive(\"orderedList\") ||\n                    editor.value.isActive(\"bulletList\")\n                ) {\n                    return false;\n                }\n                if (!event.shiftKey) {\n                    model.value = editor.value?.getJSON();\n                    event.preventDefault();\n                    onSend(editor.value?.getJSON());\n                    return true;\n                } else {\n                    editor.value.commands.splitBlock();\n                }\n            }\n            return false;\n        },\n        attributes: {\n            \"aria-keyshortcuts\": \"Shift+Enter\",\n        },\n    },\n});\n\nfunction onSend(content: any) {\n    if (content) {\n        emit(\"send\", content);\n    }\n}\n\nfunction clickSend() {\n    onSend(editor.value?.getJSON());\n}\n\nfunction focusInput() {\n    focusEditor();\n}\n\ndefineExpose({ focusInput });\n</script>\n\n<template>\n    <div class=\"g-chat-input-wrap\">\n        <BubbleMenu :editor=\"editor\" v-if=\"editor\">\n            <GRichTextToolbar :editor=\"editor\" class=\"bubble-menu\" />\n        </BubbleMenu>\n        <EditorContent :editor=\"editor\" class=\"editor-content\" />\n        <button\n            class=\"g-chat-send-btn\"\n            :disabled=\"\n                props.disabled ||\n                !model ||\n                (model && Object.keys(model).length === 0)\n            \"\n            @click=\"clickSend\"\n            title=\"Send\"\n            aria-label=\"Send\"\n            type=\"button\"\n        >\n            <svg\n                xmlns=\"http://www.w3.org/2000/svg\"\n                viewBox=\"0 0 512 512\"\n                width=\"16\"\n                height=\"16\"\n                fill=\"currentColor\"\n                aria-hidden=\"true\"\n            >\n                <path\n                    d=\"M498.1 5.6c10.1 7 15.4 19.1 13.5 31.2l-64 416c-1.5 9.7-7.4 18.2-16 23s-18.9 5.4-28 1.6L284 427.7l-68.5 74.1c-8.9 9.7-22.9 12.9-35.2 8.1S160 493.2 160 480V396.4c0-4 1.5-7.8 4.2-10.7L331.8 202.8c5.8-6.3 5.6-16-.4-22s-15.7-6.4-22-.7L106 360.8 17.7 316.6C7.1 311.3 .3 300.7 0 288.9s5.9-22.8 16.1-28.7l448-256c10.7-6.1 23.9-5.5 34 1.4z\"\n                />\n            </svg>\n        </button>\n    </div>\n</template>\n\n<style>\n.g-chat-input-wrap {\n    .tiptap {\n        background: transparent;\n        border: none;\n        padding: 0.15em 0;\n        font-size: 15px;\n        max-height: 10em;\n        flex: 1;\n        outline: none;\n\n        p {\n            margin: 0.375em 0 0;\n        }\n\n        > :first-child {\n            margin-top: 0;\n        }\n        > :last-child {\n            margin-bottom: 0;\n        }\n\n        ul,\n        ol {\n            padding: 0 1em;\n            margin: 0.375em 1em 0 0.4em;\n\n            li p {\n                margin-top: 0;\n                margin-bottom: 0;\n            }\n        }\n        p.is-editor-empty:first-child::before {\n            color: var(--g-surface-600);\n            content: attr(data-placeholder);\n            float: left;\n            height: 0;\n            pointer-events: none;\n        }\n    }\n}\n</style>\n\n<style scoped>\n.bubble-menu {\n    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.5);\n    background-color: var(--g-surface-100);\n\n    :deep(button) {\n        &:first-child {\n            border-top-left-radius: 4px;\n            border-bottom-left-radius: 4px;\n        }\n        &:last-child {\n            border-top-right-radius: 4px;\n            border-bottom-right-radius: 4px;\n        }\n    }\n}\n\n.g-chat-input-wrap {\n    position: relative;\n    display: flex;\n    align-items: center;\n    background: var(--g-surface-0);\n    border: 2px solid var(--g-primary-500);\n    border-radius: 4px;\n    padding: 0.5em;\n\n    &:has(.ProseMirror-focused) {\n        outline: 2px solid var(--g-primary-500);\n        outline-offset: 2px;\n        box-shadow: 0 0 0 2px var(--g-info-200);\n        border-color: var(--g-info-200);\n    }\n}\n\n.editor-content {\n    flex: 1;\n    min-width: 0;\n}\n\n.g-chat-send-btn {\n    color: var(--g-primary-500);\n    font-size: 1em;\n    border: 2px solid transparent;\n    border-radius: 4px;\n    padding: 0.4em;\n    margin: 0;\n    align-self: flex-end;\n    cursor: pointer;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    background: transparent;\n    flex-shrink: 0;\n\n    &:hover:not(:disabled) {\n        color: var(--g-accent-700);\n        background-color: var(--g-surface-100);\n    }\n\n    &:focus:not(:disabled) {\n        background-color: var(--g-info-200);\n        color: var(--g-primary-500);\n    }\n\n    &:active:not(:disabled) {\n        background-color: var(--g-primary-500);\n        color: var(--g-surface-0);\n    }\n\n    &:disabled {\n        color: var(--g-surface-300);\n        cursor: not-allowed;\n    }\n}\n</style>\n","<script lang=\"ts\" setup>\n/**\n * The GNoteInput component provides a rich text editing experience using Tiptap for writing notes. It supports:\n *\n *  - **Bold** and *italic* text formatting\n *  - Bullet and numbered lists\n *  - Always visible toolbar for formatting\n *  - Undo/redo support\n *\n *  **Note**: This component is part of the `@illinois-grad/grad-vue-rte` package, which includes Tiptap dependencies.\n */\nimport { computed } from \"vue\";\nimport { EditorContent } from \"@tiptap/vue-3\";\nimport { useRichTextEditor } from \"../composables/useRichTextEditor\";\nimport GRichTextToolbar from \"./editor/GRichTextToolbar.vue\";\n\ndefineOptions({ inheritAttrs: false });\n\ninterface Props {\n    /**\n     * Placeholder text\n     */\n    placeholder?: string;\n    /**\n     * Accessible label\n     */\n    label?: string;\n}\n\nconst props = withDefaults(defineProps<Props>(), {\n    placeholder: \"Write a note...\",\n    label: \"Note input\",\n});\nconst model = defineModel<object | \"\">();\n\nconst { editor, focusEditor } = useRichTextEditor({\n    content: model as any,\n    placeholder: computed(() => props.placeholder),\n    label: computed(() => props.label),\n});\n\nfunction focusInput() {\n    focusEditor();\n}\n\ndefineExpose({ focusInput });\n</script>\n\n<template>\n    <div class=\"g-note-input-wrap\">\n        <GRichTextToolbar :editor=\"editor\" class=\"toolbar\" />\n        <EditorContent :editor=\"editor\" class=\"editor-content\" />\n    </div>\n</template>\n\n<style>\n.g-note-input-wrap {\n    .tiptap {\n        background: transparent;\n        border: none;\n        padding: 0.5em;\n        font-size: 15px;\n        min-height: 12em;\n        flex: 1;\n        outline: none;\n\n        p {\n            margin: 0.375em 0 0;\n        }\n\n        > :first-child {\n            margin-top: 0;\n        }\n        > :last-child {\n            margin-bottom: 0;\n        }\n\n        ul,\n        ol {\n            padding: 0 1em;\n            margin: 0.375em 1em 0 0.4em;\n\n            li p {\n                margin-top: 0;\n                margin-bottom: 0;\n            }\n        }\n        p.is-editor-empty:first-child::before {\n            color: var(--g-surface-600);\n            content: attr(data-placeholder);\n            float: left;\n            height: 0;\n            pointer-events: none;\n        }\n    }\n}\n</style>\n\n<style scoped>\n.g-note-input-wrap {\n    display: flex;\n    flex-direction: column;\n    background: var(--g-surface-0);\n    border: 2px solid var(--g-primary-500);\n    border-radius: 4px;\n\n    &:has(.ProseMirror-focused) {\n        outline: 2px solid var(--g-primary-500);\n        outline-offset: 2px;\n        box-shadow: 0 0 0 2px var(--g-info-200);\n        border-color: var(--g-info-200);\n    }\n}\n\n.toolbar {\n    border-bottom: 1px solid var(--g-surface-200);\n    background-color: var(--g-surface-0);\n    padding: 0.25rem;\n\n    :deep(button) {\n        border-radius: 4px;\n\n        &:focus {\n            outline: 2px solid var(--g-primary-500);\n            outline-offset: 2px;\n        }\n    }\n}\n\n.editor-content {\n    flex: 1;\n    min-width: 0;\n}\n</style>\n"],"names":["useRichTextEditor","options","content","placeholder","label","onUpdate","editorProps","placeholderValue","labelValue","editor","useEditor","Document","Paragraph","Text","Bold","Italic","ListKit","UndoRedo","Placeholder","watch","val","toRaw","focusEditor","useToolbarNavigation","toolbarRef","activeButtonIndex","ref","handleToolbarKeyDown","event","toolbar","buttons","currentIndex","btn","nextIndex","getButtonTabIndex","index","props","__props","editorRef","computed","_createElementBlock","_cache","_unref","args","_createElementVNode","$event","_normalizeClass","model","_useModel","emit","__emit","view","onSend","clickSend","focusInput","__expose","_openBlock","_hoisted_1","_createBlock","BubbleMenu","_createVNode","GRichTextToolbar","EditorContent"],"mappings":"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"}