@instructure/platform-notebook 1.1.0 → 1.3.0

package/dist/index.js

@@ -1,22 +1,22 @@
-import { jsx as s, jsxs as E, Fragment as et } from "react/jsx-runtime";
-import { createContext as Be, useMemo as ie, useContext as He, useReducer as je, useRef as J, useEffect as Z, useState as H, useCallback as q } from "react";
+import { jsx as i, jsxs as S, Fragment as et } from "react/jsx-runtime";
+import { createContext as He, useMemo as le, useContext as je, useReducer as $e, useRef as ee, useEffect as J, useState as $, useCallback as K } from "react";
 import { createPortal as tt } from "react-dom";
 import { z as d } from "zod";
 import nt from "diff-match-patch";
-import { useQueryClient as be, useMutation as Ee, useQuery as ot } from "@tanstack/react-query";
-import { IconQuestionLine as Se, IconPinLine as Te, IconWarningLine as rt, IconNoteLine as st, IconEditLine as pe, IconTrashLine as ue, IconArrowStartLine as it } from "@instructure/ui-icons";
-import { Menu as ne } from "@instructure/ui-menu";
-import { View as z } from "@instructure/ui-view";
-import { Flex as S } from "@instructure/ui-flex";
+import { useQueryClient as Ee, useMutation as Se, useQuery as ot } from "@tanstack/react-query";
+import { IconQuestionLine as Te, IconPinLine as ve, IconWarningLine as rt, IconNoteLine as st, IconEditLine as pe, IconTrashLine as ue, IconArrowStartLine as it } from "@instructure/ui-icons";
+import { Menu as oe } from "@instructure/ui-menu";
+import { View as U } from "@instructure/ui-view";
+import { Flex as T } from "@instructure/ui-flex";
 import { TruncateText as Ne } from "@instructure/ui-truncate-text";
 import { ScreenReaderContent as ze } from "@instructure/ui-a11y-content";
 import { SimpleSelect as De } from "@instructure/ui-simple-select";
 import { Heading as fe } from "@instructure/ui-heading";
-import { Text as U } from "@instructure/ui-text";
-import { CloseButton as lt, Button as K, IconButton as re } from "@instructure/ui-buttons";
+import { Text as q } from "@instructure/ui-text";
+import { CloseButton as lt, Button as X, IconButton as se } from "@instructure/ui-buttons";
 import { Tray as at } from "@instructure/ui-tray";
-import { TextArea as $e } from "@instructure/ui-text-area";
-import { Pill as Pe } from "@instructure/ui-pill";
+import { TextArea as Ue } from "@instructure/ui-text-area";
+import { Pill as Ae } from "@instructure/ui-pill";
 import { Pagination as ct } from "@instructure/ui-pagination";
 import { Spinner as dt } from "@instructure/ui-spinner";
 const ut = d.object({
@@ -27,15 +27,15 @@ const ut = d.object({
 }), ft = d.object({
   start: d.number(),
   end: d.number()
-}), ve = d.object({
+}), Ce = d.object({
   selectedText: d.string(),
   hasNoHighlightAnymore: d.boolean().optional(),
   textPosition: ft.nullable(),
   range: ut.nullable(),
   pageLastModifiedAt: d.string()
 });
-var k = /* @__PURE__ */ ((t) => (t.IMPORTANT = "Important", t.CONFUSING = "Confusing", t))(k || {});
-const Ce = d.enum([
+var O = /* @__PURE__ */ ((t) => (t.IMPORTANT = "Important", t.CONFUSING = "Confusing", t))(O || {});
+const Ie = d.enum([
   "Important",
   "Confusing"
   /* CONFUSING */
@@ -50,8 +50,8 @@ const Ce = d.enum([
   objectId: d.string(),
   objectType: d.string(),
   userText: d.string().optional(),
-  reaction: d.array(Ce),
-  highlightData: ve,
+  reaction: d.array(Ie),
+  highlightData: Ce,
   createdAt: d.string(),
   updatedAt: d.string()
 }), gt = d.object({
@@ -84,8 +84,8 @@ d.object({
   objectId: d.string(),
   objectType: d.string(),
   userText: d.string().optional(),
-  reaction: d.array(Ce),
-  highlightData: ve
+  reaction: d.array(Ie),
+  highlightData: Ce
 });
 d.object({
   createNote: me
@@ -93,8 +93,8 @@ d.object({
 d.object({
   id: d.string(),
   userText: d.string().optional(),
-  reaction: d.array(Ce),
-  highlightData: ve
+  reaction: d.array(Ie),
+  highlightData: Ce
 });
 d.object({
   updateNote: me
@@ -102,14 +102,14 @@ d.object({
 d.object({
   deleteNote: d.string()
 });
-var We = /* @__PURE__ */ ((t) => (t[t.FORWARDS = 1] = "FORWARDS", t[t.BACKWARDS = 2] = "BACKWARDS", t))(We || {});
-class X {
+var Ge = /* @__PURE__ */ ((t) => (t[t.FORWARDS = 1] = "FORWARDS", t[t.BACKWARDS = 2] = "BACKWARDS", t))(Ge || {});
+class Q {
   constructor(e, n) {
     this.start = e, this.end = n;
   }
   toRange() {
     let e, n;
-    if (this.start.element === this.end.element && this.start.offset <= this.end.offset ? [e, n] = Ue(this.start.element, this.start.offset, this.end.offset) : (e = this.start.resolve({
+    if (this.start.element === this.end.element && this.start.offset <= this.end.offset ? [e, n] = qe(this.start.element, this.start.offset, this.end.offset) : (e = this.start.resolve({
       direction: 1
       /* FORWARDS */
     }), n = this.end.resolve({
@@ -121,31 +121,31 @@ class X {
     return o.setStart(e.node, e.offset), o.setEnd(n.node, n.offset), o;
   }
   static fromRange(e) {
-    const n = j.fromPoint(e.startContainer, e.startOffset), o = j.fromPoint(e.endContainer, e.endOffset);
-    return !n || !o ? null : new X(n, o);
+    const n = z.fromPoint(e.startContainer, e.startOffset), o = z.fromPoint(e.endContainer, e.endOffset);
+    return !n || !o ? null : new Q(n, o);
   }
   static fromOffsets(e, n, o) {
-    return new X(new j(e, n), new j(e, o));
+    return new Q(new z(e, n), new z(e, o));
   }
   relativeTo(e) {
-    return new X(this.start.relativeTo(e), this.end.relativeTo(e));
+    return new Q(this.start.relativeTo(e), this.end.relativeTo(e));
   }
 }
-class j {
+class z {
   constructor(e, n) {
     n < 0 && console.error("Offset is invalid"), this.element = e, this.offset = n;
   }
   resolve(e = {}) {
     try {
-      return Ue(this.element, this.offset)[0];
+      return qe(this.element, this.offset)[0];
     } catch (n) {
       if (this.offset === 0 && e.direction !== void 0) {
         const o = document.createTreeWalker(this.element.getRootNode(), NodeFilter.SHOW_TEXT);
         o.currentNode = this.element;
-        const r = e.direction === We.FORWARDS, i = r ? o.nextNode() : o.previousNode();
-        if (!i)
+        const r = e.direction === Ge.FORWARDS, s = r ? o.nextNode() : o.previousNode();
+        if (!s)
           throw n;
-        return { node: i, offset: r ? 0 : i.data.length };
+        return { node: s, offset: r ? 0 : s.data.length };
       }
       throw n;
     }
@@ -153,9 +153,9 @@ class j {
   static fromCharOffset(e, n) {
     switch (e.nodeType) {
       case Node.TEXT_NODE:
-        return j.fromPoint(e, n);
+        return z.fromPoint(e, n);
       case Node.ELEMENT_NODE:
-        return new j(e, n);
+        return new z(e, n);
       default:
         return console.error("Node is not an element or text node"), null;
     }
@@ -168,15 +168,15 @@ class j {
         if (!e.parentElement)
           return console.error("Text node has no parent"), null;
         const o = Fe(e) + n;
-        return new j(e.parentElement, o);
+        return new z(e.parentElement, o);
       }
       case Node.ELEMENT_NODE: {
         if (n < 0 || n > e.childNodes.length)
           return console.error("Child node offset is out of range"), null;
         let o = 0;
         for (let r = 0; r < n; r++)
-          o += Ge(e.childNodes[r]);
-        return new j(e, o);
+          o += We(e.childNodes[r]);
+        return new z(e, o);
       }
       default:
         return console.error("Point is not in an element or text node"), null;
@@ -188,7 +188,7 @@ class j {
     let n = this.element, o = this.offset;
     for (; n !== e; )
       o += Fe(n), n.parentElement && (n = n.parentElement);
-    return new j(n, o);
+    return new z(n, o);
   }
 }
 const Nt = (t) => {
@@ -217,8 +217,8 @@ const bt = (t) => {
 }, Et = (t, e, n) => {
   const o = e.toUpperCase();
   let r = -1;
-  for (let i = 0; i < t.children.length; i++) {
-    const l = t.children[i];
+  for (let s = 0; s < t.children.length; s++) {
+    const l = t.children[s];
     if (l.nodeName.toUpperCase() === o && (++r, r === n))
       return l;
   }
@@ -229,57 +229,57 @@ const bt = (t) => {
   const o = t.split("/");
   let r = e;
   o.shift();
-  for (const i of o) {
+  for (const s of o) {
     let l, a;
-    const m = i.indexOf("[");
+    const m = s.indexOf("[");
     if (m !== -1) {
-      l = i.slice(0, m);
-      const h = i.slice(m + 1, i.indexOf("]"));
-      if (a = Number.parseInt(h, 10) - 1, a < 0)
+      l = s.slice(0, m);
+      const g = s.slice(m + 1, s.indexOf("]"));
+      if (a = Number.parseInt(g, 10) - 1, a < 0)
         return null;
     } else
-      l = i, a = 0;
+      l = s, a = 0;
     const c = Et(r, l, a);
     if (!c)
       return null;
     r = c;
   }
   return r;
-}, Ae = (t, e = document.body) => {
+}, _e = (t, e = document.body) => {
   try {
     return St(t, e);
   } catch {
     return document.evaluate(`.${t}`, e, null, XPathResult.FIRST_ORDERED_NODE_TYPE, null).singleNodeValue;
   }
 };
-class ee {
+class ne {
   constructor(e, n) {
     this.root = e, this.range = n;
   }
   static fromRange(e, n) {
-    return new ee(e, n);
+    return new ne(e, n);
   }
   static fromSelector(e, n) {
     if (!(n != null && n.startContainer) || !(n != null && n.endContainer))
       return console.error("No start or end container in selector"), null;
-    const o = Ae(n.startContainer, e);
+    const o = _e(n.startContainer, e);
     if (!o)
       return console.error("Failed to resolve startContainer XPath"), null;
-    const r = Ae(n.endContainer, e);
+    const r = _e(n.endContainer, e);
     if (!r)
       return console.error("Failed to resolve endContainer XPath"), null;
-    const i = j.fromCharOffset(o, n.startOffset), l = j.fromCharOffset(r, n.endOffset);
-    if (!i || !l)
+    const s = z.fromCharOffset(o, n.startOffset), l = z.fromCharOffset(r, n.endOffset);
+    if (!s || !l)
       return null;
-    const a = new X(i, l).toRange();
-    return a ? new ee(e, a) : null;
+    const a = new Q(s, l).toRange();
+    return a ? new ne(e, a) : null;
   }
   toRange() {
     return this.range;
   }
   toSelector() {
-    var i;
-    const e = (i = X.fromRange(this.range)) == null ? void 0 : i.toRange(), n = e && X.fromRange(e), o = n && Le(n.start.element, this.root), r = n && Le(n.end.element, this.root);
+    var s;
+    const e = (s = Q.fromRange(this.range)) == null ? void 0 : s.toRange(), n = e && Q.fromRange(e), o = n && Le(n.start.element, this.root), r = n && Le(n.end.element, this.root);
     return !o || !r ? null : {
       startContainer: o,
       startOffset: n.start.offset,
@@ -288,17 +288,17 @@ class ee {
     };
   }
 }
-class Y {
+class te {
   constructor(e, n, o) {
     this.root = e, this.start = n, this.end = o;
   }
   static fromRange(e, n) {
     var r;
-    const o = (r = X.fromRange(n)) == null ? void 0 : r.relativeTo(e);
-    return o ? new Y(e, o.start.offset, o.end.offset) : null;
+    const o = (r = Q.fromRange(n)) == null ? void 0 : r.relativeTo(e);
+    return o ? new te(e, o.start.offset, o.end.offset) : null;
   }
   static fromSelector(e, n) {
-    return new Y(e, n.start, n.end);
+    return new te(e, n.start, n.end);
   }
   toSelector() {
     return {
@@ -307,10 +307,10 @@ class Y {
     };
   }
   toRange() {
-    return X.fromOffsets(this.root, this.start, this.end).toRange();
+    return Q.fromOffsets(this.root, this.start, this.end).toRange();
   }
 }
-const Ge = (t) => {
+const We = (t) => {
   var e;
   switch (t.nodeType) {
     case Node.ELEMENT_NODE:
@@ -322,47 +322,47 @@ const Ge = (t) => {
 }, Fe = (t) => {
   let e = t.previousSibling, n = 0;
   for (; e; )
-    n += Ge(e), e = e.previousSibling;
+    n += We(e), e = e.previousSibling;
   return n;
-}, Ue = (t, ...e) => {
+}, qe = (t, ...e) => {
   let n = e.shift();
   const o = t.ownerDocument.createNodeIterator(t, NodeFilter.SHOW_TEXT), r = [];
-  let i = o.nextNode(), l = null, a = 0;
-  for (; n !== void 0 && i; )
-    l = i, a + l.data.length > n ? (r.push({ node: l, offset: n - a }), n = e.shift()) : (i = o.nextNode(), a += l.data.length);
+  let s = o.nextNode(), l = null, a = 0;
+  for (; n !== void 0 && s; )
+    l = s, a + l.data.length > n ? (r.push({ node: l, offset: n - a }), n = e.shift()) : (s = o.nextNode(), a += l.data.length);
   for (; n !== void 0 && l && a === n; )
     r.push({ node: l, offset: l.data.length }), n = e.shift();
   return n !== void 0 && console.error("Offset exceeds text length"), r;
 }, Tt = (t, e, n, o) => {
   const r = n - e;
-  return Math.abs(r - o) <= 5 ? Y.fromSelector(t, {
+  return Math.abs(r - o) <= 5 ? te.fromSelector(t, {
     start: e,
     end: n
   }) : null;
 }, vt = (t, e, n, o) => {
   const r = new nt();
   r.Match_Distance = 5e3;
-  const i = t.textContent;
-  if (!i)
+  const s = t.textContent;
+  if (!s)
     return null;
   if (e.length > 32) {
     const l = e.slice(0, 32), a = e.slice(-32), m = o - n;
-    let c = r.match_main(i, l, n);
-    const h = r.match_main(i, a, o), g = h + a.length;
-    if (c === -1 || h === -1)
+    let c = r.match_main(s, l, n);
+    const g = r.match_main(s, a, o), h = g + a.length;
+    if (c === -1 || g === -1)
       return null;
-    const u = g - c, p = Math.abs(u - m);
-    if ((c > g || p > 5) && (r.Match_Distance = e.length + 100, c = r.match_main(i, l, g), c !== -1 && c < g))
-      return Tt(t, c, g, m);
-    if (c < g && p <= 5)
-      return Y.fromSelector(t, {
+    const f = h - c, N = Math.abs(f - m);
+    if ((c > h || N > 5) && (r.Match_Distance = e.length + 100, c = r.match_main(s, l, h), c !== -1 && c < h))
+      return Tt(t, c, h, m);
+    if (c < h && N <= 5)
+      return te.fromSelector(t, {
         start: c,
-        end: g
+        end: h
       });
   } else {
-    const l = r.match_main(i, e, n);
+    const l = r.match_main(s, e, n);
     if (l !== -1)
-      return Y.fromSelector(t, {
+      return te.fromSelector(t, {
         start: l,
         end: l + e.length
       });
@@ -379,16 +379,16 @@ const Ge = (t) => {
   );
 }, It = (t, e, n) => {
   const o = [], r = [];
-  for (const i of e) {
-    const l = Ct(i, t);
+  for (const s of e) {
+    const l = Ct(s, t);
     if (l) {
-      const a = l.toRange(), m = a && ee.fromRange(t, a), c = (a == null ? void 0 : a.toString().trim()) || i.highlightData.selectedText;
+      const a = l.toRange(), m = a && ne.fromRange(t, a), c = (a == null ? void 0 : a.toString().trim()) || s.highlightData.selectedText;
       o.push({
-        id: i.id,
-        reaction: i.reaction,
-        userText: i.userText,
+        id: s.id,
+        reaction: s.reaction,
+        userText: s.userText,
         highlightData: {
-          ...i.highlightData,
+          ...s.highlightData,
           selectedText: c,
           hasNoHighlightAnymore: !1,
           range: (m == null ? void 0 : m.toSelector()) ?? null,
@@ -397,68 +397,70 @@ const Ge = (t) => {
         }
       });
     } else
-      i.userText ? o.push({
-        id: i.id,
-        reaction: i.reaction,
-        userText: i.userText,
+      s.userText ? o.push({
+        id: s.id,
+        reaction: s.reaction,
+        userText: s.userText,
         highlightData: {
-          ...i.highlightData,
+          ...s.highlightData,
           pageLastModifiedAt: n,
           hasNoHighlightAnymore: !0
         }
-      }) : r.push(i.id);
+      }) : r.push(s.id);
   }
   return { notesForUpdate: o, noteIdsForDelete: r };
-}, _e = (t, e) => {
+}, Me = (t, e) => {
   var l;
   if (!e) return;
   const { highlightData: n, id: o } = t, { range: r } = n ?? {};
-  r && ((l = ee.fromSelector(e, r)) == null ? void 0 : l.toRange()) && Lt({ id: o });
+  r && ((l = ne.fromSelector(e, r)) == null ? void 0 : l.toRange()) && At({ id: o });
 }, xt = (t) => {
-  const e = document.getElementById(xe(t));
-  if (e) {
-    const n = e.getBoundingClientRect();
-    n.top >= 0 && n.left >= 0 && n.bottom <= (window.innerHeight || document.documentElement.clientHeight) && n.right <= (window.innerWidth || document.documentElement.clientWidth) || e.scrollIntoView({ behavior: "smooth", block: "start" });
+  const n = document.querySelector(
+    `[data-highlight-id="${CSS.escape(t)}"].highlight-content`
+  ) ?? document.getElementById(we(t));
+  if (n) {
+    const o = n.getBoundingClientRect();
+    o.top >= 0 && o.bottom <= (window.innerHeight || document.documentElement.clientHeight) || n.scrollIntoView({ behavior: "smooth", block: "center" });
   }
 }, ae = 90, ce = 172, wt = (t) => {
   const e = t.getClientRects();
   if (!e.length)
     return null;
-  const n = e[0], o = e[e.length - 1], r = 4, i = 16, l = window.innerWidth || document.documentElement.clientWidth, a = window.innerHeight || document.documentElement.clientHeight, m = (y) => {
-    const T = y + ce;
-    return y >= i && T <= l - i;
+  const n = e[0], o = e[e.length - 1], r = 4, s = 16, l = window.innerWidth || document.documentElement.clientWidth, a = window.innerHeight || document.documentElement.clientHeight, m = (y) => {
+    const E = y + ce;
+    return y >= s && E <= l - s;
   }, c = (y) => {
-    const T = y + ae;
-    return y >= i && T <= a - i;
+    const E = y + ae;
+    return y >= s && E <= a - s;
   };
-  let h;
-  const g = n.right - ce;
-  if (m(g))
-    h = g;
+  let g;
+  const h = n.right - ce;
+  if (m(h))
+    g = h;
   else {
     const y = n.left;
     if (m(y))
-      h = y;
+      g = y;
     else {
-      const N = (n.left + n.right) / 2 - ce / 2;
-      m(N) ? h = N : g < i ? h = i : h = l - ce - i;
+      const p = (n.left + n.right) / 2 - ce / 2;
+      m(p) ? g = p : h < s ? g = s : g = l - ce - s;
     }
   }
-  let u;
-  const p = o.bottom + r;
-  if (c(p))
-    u = p;
+  let f;
+  const N = o.bottom + r;
+  if (c(N))
+    f = N;
   else {
     const y = n.top - ae - r;
-    c(y) ? u = y : p + ae > a - i ? u = a - ae - i : u = i;
+    c(y) ? f = y : N + ae > a - s ? f = a - ae - s : f = s;
   }
-  return { top: u, left: h };
+  return { top: f, left: g };
 }, kt = (t, e) => {
   for (const n of e)
     if (t.start < n.end && t.end > n.start)
       return !0;
   return !1;
-}, Ie = (t) => `highlight-wrapper-${t}`, xe = (t) => `${Ie(t)}-start`, qe = (t) => `${Ie(t)}-end`, se = (t) => `[data-highlight-id="${CSS.escape(t)}"]`, we = (t, e) => {
+}, xe = (t) => `highlight-wrapper-${t}`, we = (t) => `${xe(t)}-start`, Ke = (t) => `${xe(t)}-end`, ie = (t) => `[data-highlight-id="${CSS.escape(t)}"]`, ke = (t, e) => {
   const n = Number.parseInt(t.slice(1, 3), 16), o = Number.parseInt(t.slice(3, 5), 16), r = Number.parseInt(t.slice(5, 7), 16);
   return `rgba(${n}, ${o}, ${r}, ${e})`;
 }, Ot = (t, e) => {
@@ -470,13 +472,13 @@ const Ge = (t) => {
     return !1;
   }
 }, Rt = (t) => {
-  var i;
+  var s;
   if (t.collapsed)
     return [];
   let e = t.commonAncestorContainer;
   if (e && e.nodeType !== Node.ELEMENT_NODE && (e = e.parentElement), !e)
     return [];
-  const n = [], o = (i = e == null ? void 0 : e.ownerDocument) == null ? void 0 : i.createNodeIterator(e, NodeFilter.SHOW_TEXT);
+  const n = [], o = (s = e == null ? void 0 : e.ownerDocument) == null ? void 0 : s.createNodeIterator(e, NodeFilter.SHOW_TEXT);
   let r = (o == null ? void 0 : o.nextNode()) || null;
   for (; r; ) {
     if (!Ot(t, r)) {
@@ -491,126 +493,126 @@ const Ge = (t) => {
     l === t.endContainer && t.endOffset < l.data.length && l.splitText(t.endOffset), n.push(l), r = (o == null ? void 0 : o.nextNode()) || null;
   }
   return n;
-}, Dt = (t, e, n) => {
+}, Pt = (t, e, n) => {
   if (t.collapsed) return;
-  const o = e.id ?? "", r = Ie(o);
-  if (document.getElementById(xe(o))) {
-    Pt(e, n);
+  const o = e.id ?? "", r = xe(o);
+  if (document.getElementById(we(o))) {
+    Dt(e, n);
     return;
   }
-  const l = e.type === k.IMPORTANT ? n.colors.importantBackground : n.colors.confusingBackground, m = e.id === e.selectedNoteId ? l : we(l, 0.5), c = e.type === k.IMPORTANT ? n.colors.importantUnderline : n.colors.confusingUnderline, h = e.type === k.IMPORTANT ? "solid" : "dashed", g = t.toString(), u = document.createElement("span");
-  u.id = `${r}-start`, u.className = "highlight-marker-start", u.dataset.highlightId = o || "", u.setAttribute("role", "button"), u.setAttribute("tabindex", "0"), u.setAttribute("aria-label", g), u.style.position = "relative", u.style.fontSize = "0", u.style.lineHeight = "0", u.style.width = "0", u.style.height = "0", u.style.margin = "0", u.style.padding = "0", u.style.border = "0";
-  const p = document.createElement("span");
-  p.id = qe(o), p.className = "highlight-marker-end", p.dataset.highlightId = o || "";
+  const l = e.type === O.IMPORTANT ? n.colors.importantBackground : n.colors.confusingBackground, m = e.id === e.selectedNoteId ? l : ke(l, 0.5), c = e.type === O.IMPORTANT ? n.colors.importantUnderline : n.colors.confusingUnderline, g = e.type === O.IMPORTANT ? "solid" : "dashed", h = t.toString(), f = document.createElement("span");
+  f.id = `${r}-start`, f.className = "highlight-marker-start", f.dataset.highlightId = o || "", f.setAttribute("role", "button"), f.setAttribute("tabindex", "0"), f.setAttribute("aria-label", h), f.style.position = "relative", f.style.fontSize = "0", f.style.lineHeight = "0", f.style.width = "0", f.style.height = "0", f.style.margin = "0", f.style.padding = "0", f.style.border = "0";
+  const N = document.createElement("span");
+  N.id = Ke(o), N.className = "highlight-marker-end", N.dataset.highlightId = o || "";
   const y = t.cloneRange();
-  y.collapse(!1), y.insertNode(p);
-  const T = t.cloneRange();
-  T.collapse(!0), T.insertNode(u);
-  const N = document.createRange();
-  N.setStartAfter(u), N.setEndBefore(p);
-  const L = Rt(N).filter((b) => b.textContent && b.textContent.length > 0);
-  L.forEach((b, I) => {
+  y.collapse(!1), y.insertNode(N);
+  const E = t.cloneRange();
+  E.collapse(!0), E.insertNode(f);
+  const p = document.createRange();
+  p.setStartAfter(f), p.setEndBefore(N);
+  const w = Rt(p).filter((b) => b.textContent && b.textContent.length > 0);
+  w.forEach((b, I) => {
     var G;
     const R = b.parentElement;
     if ((R == null ? void 0 : R.dataset.highlightId) === o) return;
-    const C = I === 0, B = I === L.length - 1, x = L.length === 1;
-    let A;
-    x ? A = "single" : C ? A = "first" : B ? A = "last" : A = "middle";
-    const w = document.createElement("span");
-    w.className = "highlight-content", w.dataset.highlightId = o || "", w.dataset.position = A, w.style.backgroundColor = m, w.style.textDecorationLine = "underline", w.style.textDecorationColor = c, w.style.textDecorationStyle = h, w.style.textDecorationThickness = n.borderWidthSmall, w.style.textUnderlineOffset = n.underlineOffset, w.style.cursor = "pointer", w.addEventListener("click", (te) => {
-      var $;
-      te.target.tagName !== "A" && (($ = e.onClick) == null || $.call(e));
-    }), (G = b.parentNode) == null || G.insertBefore(w, b), w.appendChild(b);
-  }), u.addEventListener("click", (b) => {
+    const v = I === 0, M = I === w.length - 1, P = w.length === 1;
+    let D;
+    P ? D = "single" : v ? D = "first" : M ? D = "last" : D = "middle";
+    const x = document.createElement("span");
+    x.className = "highlight-content", x.dataset.highlightId = o || "", x.dataset.position = D, x.style.backgroundColor = m, x.style.textDecorationLine = "underline", x.style.textDecorationColor = c, x.style.textDecorationStyle = g, x.style.textDecorationThickness = n.borderWidthSmall, x.style.textUnderlineOffset = n.underlineOffset, x.style.cursor = "pointer", x.addEventListener("click", (Y) => {
+      var H;
+      Y.target.tagName !== "A" && ((H = e.onClick) == null || H.call(e));
+    }), (G = b.parentNode) == null || G.insertBefore(x, b), x.appendChild(b);
+  }), f.addEventListener("click", (b) => {
     var I;
     b.target.tagName !== "A" && ((I = e.onClick) == null || I.call(e));
-  }), u.addEventListener("keydown", (b) => {
+  }), f.addEventListener("keydown", (b) => {
     var I;
     if (b.key === "Enter" || b.key === " ")
       b.preventDefault(), (I = e.onClick) == null || I.call(e);
     else if (b.key === "Tab" && !b.shiftKey) {
-      const R = document.querySelectorAll(se(o));
-      for (const C of R) {
-        const B = C.querySelector("a");
-        if (B) {
-          b.preventDefault(), B.focus();
+      const R = document.querySelectorAll(ie(o));
+      for (const v of R) {
+        const M = v.querySelector("a");
+        if (M) {
+          b.preventDefault(), M.focus();
           break;
         }
       }
     }
-  }), u.addEventListener("focus", () => {
+  }), f.addEventListener("focus", () => {
     document.querySelectorAll(
-      se(o)
+      ie(o)
     ).forEach((I) => {
       I.classList.add("highlight-focused");
     });
-  }), u.addEventListener("blur", () => {
+  }), f.addEventListener("blur", () => {
     document.querySelectorAll(
-      se(o)
+      ie(o)
     ).forEach((I) => {
       I.classList.remove("highlight-focused");
     });
   });
 };
-function Pt(t, e) {
-  const n = t.type === k.IMPORTANT ? e.colors.importantBackground : e.colors.confusingBackground, r = t.id === t.selectedNoteId ? n : we(n, 0.5);
+function Dt(t, e) {
+  const n = t.type === O.IMPORTANT ? e.colors.importantBackground : e.colors.confusingBackground, r = t.id === t.selectedNoteId ? n : ke(n, 0.5);
   document.querySelectorAll(
-    se(t.id ?? "")
+    ie(t.id ?? "")
   ).forEach((l) => {
     l.style.backgroundColor = r;
   });
 }
-const Lt = (t) => {
-  const e = t.id ?? "", n = document.getElementById(xe(e)), o = document.getElementById(qe(e));
+const At = (t) => {
+  const e = t.id ?? "", n = document.getElementById(we(e)), o = document.getElementById(Ke(e));
   document.querySelectorAll(
-    se(e)
-  ).forEach((i) => {
+    ie(e)
+  ).forEach((s) => {
     var l;
-    for (; i.firstChild; )
-      (l = i.parentNode) == null || l.insertBefore(i.firstChild, i);
-    i.remove();
+    for (; s.firstChild; )
+      (l = s.parentNode) == null || l.insertBefore(s.firstChild, s);
+    s.remove();
   }), n == null || n.remove(), o == null || o.remove();
-}, oe = {
+}, re = {
   all: ["notebook"],
   notes: (t) => ["notebook", "notes", t]
 };
-function At(t) {
-  const e = be();
-  return Ee({
+function Lt(t) {
+  const e = Ee();
+  return Se({
     mutationFn: (n) => t.createNote(n),
     onSuccess: () => {
-      e.invalidateQueries({ queryKey: oe.all });
+      e.invalidateQueries({ queryKey: re.all });
     }
   });
 }
-function Ft(t) {
-  const e = be();
-  return Ee({
+function _t(t) {
+  const e = Ee();
+  return Se({
     mutationFn: (n) => t.deleteNote(n),
     onSuccess: () => {
-      e.invalidateQueries({ queryKey: oe.all });
+      e.invalidateQueries({ queryKey: re.all });
     }
   });
 }
-function Ke({
+function ye({
   api: t,
   enabled: e = !0,
   ...n
 }) {
   return ot({
-    queryKey: oe.notes(n),
+    queryKey: re.notes(n),
     queryFn: () => t.getNotes(n),
     enabled: e
   });
 }
-function _t(t) {
-  const e = be();
-  return Ee({
+function Ft(t) {
+  const e = Ee();
+  return Se({
     mutationFn: ({ id: n, input: o }) => t.updateNote(n, o),
     onMutate: async ({ id: n, input: o }) => {
-      await e.cancelQueries({ queryKey: oe.all });
-      const i = e.getQueryCache().findAll({ queryKey: oe.all }), l = /* @__PURE__ */ new Map();
-      for (const a of i) {
+      await e.cancelQueries({ queryKey: re.all });
+      const s = e.getQueryCache().findAll({ queryKey: re.all }), l = /* @__PURE__ */ new Map();
+      for (const a of s) {
         const m = a.state.data;
         m && (l.set(a.queryKey, m), e.setQueryData(a.queryKey, {
           ...m,
@@ -623,24 +625,24 @@ function _t(t) {
     },
     onError: (n, o, r) => {
       if (r != null && r.previousData)
-        for (const [i, l] of r.previousData)
-          e.setQueryData(i, l);
+        for (const [s, l] of r.previousData)
+          e.setQueryData(s, l);
     },
     onSettled: () => {
-      e.invalidateQueries({ queryKey: oe.all });
+      e.invalidateQueries({ queryKey: re.all });
     }
   });
 }
-const Mt = "Notebook", Bt = "Notes", Ht = "Important", jt = "Unclear", zt = "Back", $t = "Edit note", Wt = "Save", Gt = "Cancel", Ut = "Delete note", qt = "note", Kt = "Add note (optional)", Xt = "Remove from Notebook", Qt = "Add a note (optional)", Vt = "Mark important", Yt = "Mark unclear", Zt = "Saved to Notebook.", Jt = "Note updated", en = "Note deleted", tn = "Error saving to Notebook.", nn = "Error updating note", on = "Note deletion failed", rn = "Loading notes", sn = "Failed to load notes", ln = "Start capturing your notes", an = "Your notes from learning materials will appear here. Highlight key ideas, reflections, or questions as you learn—they'll all be saved in your Notebook for easy review later.", cn = "Nothing here yet", dn = "Adjust your filters or create a new note to get started.", un = "You have no notes for the selected filter", fn = "Previous page", mn = "Next page", gn = "All courses", hn = "All notes", pn = "Close Notebook panel", Nn = "To use the Notebook feature, highlight an excerpt from your learning material to flag it as 'confusing' or 'important' and leave an optional note.", yn = "The content you highlighted is no longer available.", ke = {
+const Mt = "Notebook", Bt = "Notes", Ht = "Important", jt = "Unclear", $t = "Back", zt = "Edit note", Ut = "Save", Gt = "Cancel", Wt = "Delete note", qt = "note", Kt = "Add note (optional)", Xt = "Remove from Notebook", Qt = "Add a note (optional)", Vt = "Mark important", Yt = "Mark unclear", Zt = "Saved to Notebook.", Jt = "Note updated", en = "Note deleted", tn = "Error saving to Notebook.", nn = "Error updating note", on = "Note deletion failed", rn = "Loading notes", sn = "Failed to load notes", ln = "Start capturing your notes", an = "Your notes from learning materials will appear here. Highlight key ideas, reflections, or questions as you learn—they'll all be saved in your Notebook for easy review later.", cn = "Nothing here yet", dn = "Adjust your filters or create a new note to get started.", un = "You have no notes for the selected filter", fn = "Previous page", mn = "Next page", gn = "All courses", hn = "All notes", pn = "Close Notebook panel", Nn = "To use the Notebook feature, highlight an excerpt from your learning material to flag it as 'confusing' or 'important' and leave an optional note.", yn = "The content you highlighted is no longer available.", Oe = {
   notebook: Mt,
   notes: Bt,
   important: Ht,
   unclear: jt,
-  back: zt,
-  editNote: $t,
-  save: Wt,
+  back: $t,
+  editNote: zt,
+  save: Ut,
   cancel: Gt,
-  deleteNote: Ut,
+  deleteNote: Wt,
   note: qt,
   addNotePrompt: Kt,
   removeFromNotebook: Xt,
@@ -667,9 +669,9 @@ const Mt = "Notebook", Bt = "Notes", Ht = "Important", jt = "Unclear", zt = "Bac
   closeNotebookPanel: pn,
   featureDescription: Nn,
   highlightUnavailable: yn
-}, Xe = Be(null);
+}, Xe = He(null);
 function Qe(t, e) {
-  const n = ke[t] ?? t;
+  const n = Oe[t] ?? t;
   return e ? n.replace(/%\{([^}]+)}/g, (o, r) => String(e[r] ?? `%{${r}}`)) : n;
 }
 function bn({
@@ -677,18 +679,18 @@ function bn({
   translate: e,
   children: n
 }) {
-  const o = ie(
+  const o = le(
     () => ({
-      translations: { ...ke, ...t },
+      translations: { ...Oe, ...t },
       translate: e ?? Qe
     }),
     [t, e]
   );
-  return /* @__PURE__ */ s(Xe.Provider, { value: o, children: n });
+  return /* @__PURE__ */ i(Xe.Provider, { value: o, children: n });
 }
-function Q() {
-  const t = He(Xe);
-  return t || { translations: ke, translate: Qe };
+function V() {
+  const t = je(Xe);
+  return t || { translations: Oe, translate: Qe };
 }
 const En = (t) => ({
   selectedNoteId: t ?? null,
@@ -715,39 +717,39 @@ function Sn(t, e) {
       return t;
   }
 }
-const Ve = Be(null);
-function Jn({
+const Ve = He(null);
+function eo({
   api: t,
   currentUserId: e,
   objectId: n,
   objectType: o,
   courseId: r,
-  pageLastModifiedAt: i,
+  pageLastModifiedAt: s,
   onAnalyticsEvent: l,
   onOpen: a,
   initialNoteId: m,
   translations: c,
-  translate: h,
-  children: g
+  translate: g,
+  children: h
 }) {
-  const [u, p] = je(Sn, En(m)), y = J(m != null), T = ie(
+  const [f, N] = $e(Sn, En(m)), y = ee(m != null), E = le(
     () => ({
       api: t,
       currentUserId: e,
       objectId: n,
       objectType: o,
       courseId: r,
-      pageLastModifiedAt: i,
+      pageLastModifiedAt: s,
       onAnalyticsEvent: l,
-      ...u,
-      selectNote: (N, O = !1) => p({ type: "SELECT_NOTE", payload: { id: N, isEditing: O } }),
-      clearSelectedNote: () => p({ type: "CLEAR_SELECTED_NOTE" }),
-      setEditing: (N) => p({ type: "SET_EDITING", payload: N }),
+      ...f,
+      selectNote: (p, _ = !1) => N({ type: "SELECT_NOTE", payload: { id: p, isEditing: _ } }),
+      clearSelectedNote: () => N({ type: "CLEAR_SELECTED_NOTE" }),
+      setEditing: (p) => N({ type: "SET_EDITING", payload: p }),
       openTray: () => {
-        y.current || (y.current = !0, a == null || a()), p({ type: "OPEN_TRAY" });
+        y.current || (y.current = !0, a == null || a()), N({ type: "OPEN_TRAY" });
       },
       closeTray: () => {
-        y.current = !1, p({ type: "CLOSE_TRAY" });
+        y.current = !1, N({ type: "CLOSE_TRAY" });
       }
     }),
     [
@@ -756,26 +758,26 @@ function Jn({
       n,
       o,
       r,
-      i,
+      s,
       l,
       a,
-      u
+      f
     ]
   );
-  return /* @__PURE__ */ s(Ve.Provider, { value: T, children: /* @__PURE__ */ s(bn, { translations: c, translate: h, children: g }) });
+  return /* @__PURE__ */ i(Ve.Provider, { value: E, children: /* @__PURE__ */ i(bn, { translations: c, translate: g, children: h }) });
 }
 function Ye() {
-  const t = He(Ve);
+  const t = je(Ve);
   if (!t)
     throw new Error("useNotebook must be used within a NotebookProvider");
   return t;
 }
 const Tn = ({ currentType: t, onSelectReaction: e }) => {
-  const { translations: n } = Q(), o = J(null), r = J(null);
-  return Z(() => {
-    t === k.CONFUSING && o.current ? o.current.focus() : t === k.IMPORTANT && r.current ? r.current.focus() : o.current && o.current.focus();
-  }, [t]), /* @__PURE__ */ s(
-    z,
+  const { translations: n } = V(), o = ee(null), r = ee(null);
+  return J(() => {
+    t === O.CONFUSING && o.current ? o.current.focus() : t === O.IMPORTANT && r.current ? r.current.focus() : o.current && o.current.focus();
+  }, [t]), /* @__PURE__ */ i(
+    U,
     {
       as: "div",
       background: "primary",
@@ -783,25 +785,25 @@ const Tn = ({ currentType: t, onSelectReaction: e }) => {
       borderColor: "secondary",
       borderRadius: "medium",
       shadow: "resting",
-      children: /* @__PURE__ */ E(ne, { children: [
-        /* @__PURE__ */ E(
-          ne.Item,
+      children: /* @__PURE__ */ S(oe, { children: [
+        /* @__PURE__ */ S(
+          oe.Item,
           {
             ref: o,
-            onClick: () => e(k.CONFUSING),
+            onClick: () => e(O.CONFUSING),
             children: [
-              /* @__PURE__ */ s(Se, { size: "x-small" }),
+              /* @__PURE__ */ i(Te, { size: "x-small" }),
               ` ${n.markUnclear}`
             ]
           }
         ),
-        /* @__PURE__ */ E(
-          ne.Item,
+        /* @__PURE__ */ S(
+          oe.Item,
           {
             ref: r,
-            onClick: () => e(k.IMPORTANT),
+            onClick: () => e(O.IMPORTANT),
             children: [
-              /* @__PURE__ */ s(Te, { size: "x-small" }),
+              /* @__PURE__ */ i(ve, { size: "x-small" }),
               ` ${n.markImportant}`
             ]
           }
@@ -810,164 +812,164 @@ const Tn = ({ currentType: t, onSelectReaction: e }) => {
     }
   );
 }, ge = "notebook-inline-reaction-menu";
-function eo({
+function to({
   containerRef: t,
   highlightTheme: e,
   debounceTime: n = 500,
   onCreateError: o,
   onUpdateError: r,
-  onDeleteError: i
+  onDeleteError: s
 }) {
   const {
     api: l,
     objectId: a,
     objectType: m,
     courseId: c,
-    pageLastModifiedAt: h,
-    selectedNoteId: g,
-    selectNote: u,
-    openTray: p
-  } = Ye(), { data: y } = Ke({
+    pageLastModifiedAt: g,
+    selectedNoteId: h,
+    selectNote: f,
+    openTray: N
+  } = Ye(), { data: y } = ye({
     api: l,
     filter: {
       learningObject: { type: m, id: a }
     },
     courseId: c,
     pageSize: 100
-  }), { mutate: T } = At(l), { mutateAsync: N } = _t(l), { mutate: O } = Ft(l), L = J([]), [b, I] = H([]), [R, C] = H(null), [B, x] = H(""), [A, w] = H(null), [G, te] = H(!1);
-  Z(() => {
-    const D = t.current;
-    if (!D) return;
-    const f = D.closest(".user_content") ?? D;
-    if (f.classList.contains("enhanced")) {
-      te(!0);
+  }), { mutate: E } = Lt(l), { mutateAsync: p } = Ft(l), { mutate: _ } = _t(l), w = ee([]), [b, I] = $([]), [R, v] = $(null), [M, P] = $(""), [D, x] = $(null), [G, Y] = $(!1);
+  J(() => {
+    const k = t.current;
+    if (!k) return;
+    const u = k.closest(".user_content") ?? k;
+    if (u.classList.contains("enhanced")) {
+      Y(!0);
       return;
     }
-    const F = new MutationObserver((_) => {
-      for (const M of _)
-        if (M.type === "attributes" && M.attributeName === "class" && M.target.classList.contains("enhanced")) {
-          te(!0), F.disconnect();
+    const L = new MutationObserver((F) => {
+      for (const B of F)
+        if (B.type === "attributes" && B.attributeName === "class" && B.target.classList.contains("enhanced")) {
+          Y(!0), L.disconnect();
           return;
         }
     });
-    return F.observe(f, { attributes: !0, attributeFilter: ["class"] }), () => F.disconnect();
-  }, [t]), Z(() => {
+    return L.observe(u, { attributes: !0, attributeFilter: ["class"] }), () => L.disconnect();
+  }, [t]), J(() => {
     if (!G || !t.current) return;
-    let f = null;
-    const F = () => {
-      f && clearTimeout(f), f = setTimeout(() => {
-        var Re;
-        const v = window.getSelection(), P = t.current;
-        if (!(v != null && v.rangeCount) || !P) return;
-        const W = v.toString().trim();
+    let u = null;
+    const L = () => {
+      u && clearTimeout(u), u = setTimeout(() => {
+        var Pe;
+        const C = window.getSelection(), A = t.current;
+        if (!(C != null && C.rangeCount) || !A) return;
+        const W = C.toString().trim();
         if (W === "") return;
-        const V = v.getRangeAt(0);
-        if (!P.contains(V.commonAncestorContainer)) return;
-        const Oe = (Re = Y.fromRange(P, V)) == null ? void 0 : Re.toSelector();
-        Oe && !kt(Oe, b) && (C(V.cloneRange()), x(W), w(wt(V)));
+        const Z = C.getRangeAt(0);
+        if (!A.contains(Z.commonAncestorContainer)) return;
+        const Re = (Pe = te.fromRange(A, Z)) == null ? void 0 : Pe.toSelector();
+        Re && !kt(Re, b) && (v(Z.cloneRange()), P(W), x(wt(Z)));
       }, n);
-    }, _ = (v) => {
-      if (!(v.target instanceof Node)) return;
-      const P = document.getElementById(ge);
-      P != null && P.contains(v.target) ? (v.preventDefault(), v.stopImmediatePropagation()) : (w(null), C(null), x(""));
-    }, M = () => {
-      w(null), C(null), x("");
+    }, F = (C) => {
+      if (!(C.target instanceof Node)) return;
+      const A = document.getElementById(ge);
+      A != null && A.contains(C.target) ? (C.preventDefault(), C.stopImmediatePropagation()) : (x(null), v(null), P(""));
+    }, B = () => {
+      x(null), v(null), P("");
     };
-    return document.addEventListener("selectionchange", F), document.addEventListener("mousedown", _), document.addEventListener("touchstart", _), window.addEventListener("scroll", M, !0), () => {
-      f && clearTimeout(f), document.removeEventListener("selectionchange", F), document.removeEventListener("mousedown", _), document.removeEventListener("touchstart", _), window.removeEventListener("scroll", M, !0);
+    return document.addEventListener("selectionchange", L), document.addEventListener("mousedown", F), document.addEventListener("touchstart", F), window.addEventListener("scroll", B, !0), () => {
+      u && clearTimeout(u), document.removeEventListener("selectionchange", L), document.removeEventListener("mousedown", F), document.removeEventListener("touchstart", F), window.removeEventListener("scroll", B, !0);
     };
   }, [G, b, n, t]);
-  const $ = q(
-    (D) => {
+  const H = K(
+    (k) => {
       var W;
-      const f = t.current;
-      if (!f || !D.highlightData) return null;
-      const { highlightData: F, reaction: _, id: M } = D, { range: v } = F, P = v && ((W = ee.fromSelector(f, v)) == null ? void 0 : W.toRange());
-      if (P) {
-        const V = {
-          id: M,
-          selectedNoteId: g,
-          type: _[0],
+      const u = t.current;
+      if (!u || !k.highlightData) return null;
+      const { highlightData: L, reaction: F, id: B } = k, { range: C } = L, A = C && ((W = ne.fromSelector(u, C)) == null ? void 0 : W.toRange());
+      if (A) {
+        const Z = {
+          id: B,
+          selectedNoteId: h,
+          type: F[0],
           onClick: () => {
-            u(M), p();
+            f(B), N();
           }
         };
-        return Dt(P, V, e), F.textPosition;
+        return Pt(A, Z, e), L.textPosition;
       }
       return null;
     },
-    [t, g, e, u, p]
+    [t, h, e, f, N]
   );
-  Z(() => {
+  J(() => {
     if (!G || !y || !t.current) return;
-    const D = t.current, f = y.notes, F = /* @__PURE__ */ new Set(), _ = [], M = [];
-    if (f.length === 0) {
-      if (L.current.length > 0) {
-        for (const v of L.current)
-          _e(v, D);
-        L.current = [], I([]);
+    const k = t.current, u = y.notes, L = /* @__PURE__ */ new Set(), F = [], B = [];
+    if (u.length === 0) {
+      if (w.current.length > 0) {
+        for (const C of w.current)
+          Me(C, k);
+        w.current = [], I([]);
       }
       return;
     }
-    if (h && f[0].highlightData.pageLastModifiedAt !== h) {
-      const { notesForUpdate: v, noteIdsForDelete: P } = It(
-        D,
-        f,
-        h
+    if (g && u[0].highlightData.pageLastModifiedAt !== g) {
+      const { notesForUpdate: C, noteIdsForDelete: A } = It(
+        k,
+        u,
+        g
       );
-      for (const W of v)
-        N({ id: W.id, input: W }).catch((V) => r == null ? void 0 : r(V));
-      for (const W of P)
-        O(W, { onError: i });
+      for (const W of C)
+        p({ id: W.id, input: W }).catch((Z) => r == null ? void 0 : r(Z));
+      for (const W of A)
+        _(W, { onError: s });
     } else {
-      for (const v of f) {
-        const P = $(v);
-        F.add(v.id), P && (_.push(v), M.push(P));
+      for (const C of u) {
+        const A = H(C);
+        L.add(C.id), A && (F.push(C), B.push(A));
       }
-      for (const v of L.current)
-        F.has(v.id) || _e(v, D);
-      I(M), L.current = _, g && xt(g);
+      for (const C of w.current)
+        L.has(C.id) || Me(C, k);
+      I(B), w.current = F, h && xt(h);
     }
   }, [
     G,
     y,
-    $,
-    h,
+    H,
+    g,
     t,
-    N,
-    O,
-    g
+    p,
+    _,
+    h
   ]);
-  const le = (D) => {
-    const f = t.current;
-    if (!R || !f) return;
-    const F = ee.fromRange(f, R), _ = Y.fromRange(f, R);
-    T(
+  const j = (k) => {
+    const u = t.current;
+    if (!R || !u) return;
+    const L = ne.fromRange(u, R), F = te.fromRange(u, R);
+    E(
       {
         courseId: c,
         objectId: a,
         objectType: m,
         userText: "",
-        reaction: [D],
+        reaction: [k],
         highlightData: {
-          selectedText: B,
-          textPosition: (_ == null ? void 0 : _.toSelector()) ?? null,
-          range: F.toSelector(),
-          pageLastModifiedAt: h ?? ""
+          selectedText: M,
+          textPosition: (F == null ? void 0 : F.toSelector()) ?? null,
+          range: L.toSelector(),
+          pageLastModifiedAt: g ?? ""
         }
       },
       {
-        onSuccess: (M) => {
-          var P;
-          const v = M.id;
-          C(null), x(""), w(null), (P = window.getSelection()) == null || P.removeAllRanges(), u(v), p();
+        onSuccess: (B) => {
+          var A;
+          const C = B.id;
+          v(null), P(""), x(null), (A = window.getSelection()) == null || A.removeAllRanges(), f(C), N();
         },
         onError: o
       }
     );
   };
-  return !R || !A ? null : tt(
-    /* @__PURE__ */ s(
+  return !R || !D ? null : tt(
+    /* @__PURE__ */ i(
       "div",
       {
         id: ge,
@@ -975,33 +977,33 @@ function eo({
         style: {
           position: "fixed",
           zIndex: 100,
-          top: A.top,
-          left: A.left,
+          top: D.top,
+          left: D.left,
           whiteSpace: "nowrap"
         },
-        onBlur: (D) => {
-          const f = document.getElementById(ge);
-          f != null && f.contains(D.relatedTarget) || (w(null), C(null), x(""));
+        onBlur: (k) => {
+          const u = document.getElementById(ge);
+          u != null && u.contains(k.relatedTarget) || (x(null), v(null), P(""));
         },
-        children: /* @__PURE__ */ s(Tn, { onSelectReaction: le })
+        children: /* @__PURE__ */ i(Tn, { onSelectReaction: j })
       }
     ),
     document.body
   );
 }
 const vn = (t, e) => ({
-  backgroundColor: t === k.IMPORTANT ? e.colors.importantBackground : e.colors.confusingBackground,
-  underlineColor: t === k.IMPORTANT ? e.colors.importantUnderline : e.colors.confusingUnderline,
-  underlineStyle: t === k.IMPORTANT ? "solid" : "dashed"
-}), ye = ({
+  backgroundColor: t === O.IMPORTANT ? e.colors.importantBackground : e.colors.confusingBackground,
+  underlineColor: t === O.IMPORTANT ? e.colors.importantUnderline : e.colors.confusingUnderline,
+  underlineStyle: t === O.IMPORTANT ? "solid" : "dashed"
+}), be = ({
   children: t,
-  type: e = k.IMPORTANT,
+  type: e = O.IMPORTANT,
   isCardActive: n = !0,
   theme: o
 }) => {
   const r = vn(e, o), l = {
     position: "relative",
-    backgroundColor: n ? r.backgroundColor : we(r.backgroundColor, 0.5),
+    backgroundColor: n ? r.backgroundColor : ke(r.backgroundColor, 0.5),
     textDecorationLine: "underline",
     textDecorationStyle: r.underlineStyle,
     textDecorationColor: r.underlineColor,
@@ -1009,14 +1011,14 @@ const vn = (t, e) => ({
     textUnderlineOffset: o.underlineOffset,
     lineHeight: "normal"
   };
-  return /* @__PURE__ */ s("span", { "data-note-highlight": "true", style: l, children: t });
+  return /* @__PURE__ */ i("span", { "data-note-highlight": "true", style: l, children: t });
 }, Ze = () => {
-  const { translations: t } = Q();
-  return /* @__PURE__ */ E(S, { gap: "xx-small", alignItems: "start", as: "div", children: [
-    /* @__PURE__ */ s(S.Item, { as: "div", children: /* @__PURE__ */ s(rt, { color: "error" }) }),
-    /* @__PURE__ */ s(S.Item, { padding: "xxx-small none", shouldShrink: !0, children: /* @__PURE__ */ s(Ne, { maxLines: 3, children: t.highlightUnavailable }) })
+  const { translations: t } = V();
+  return /* @__PURE__ */ S(T, { gap: "xx-small", alignItems: "start", as: "div", children: [
+    /* @__PURE__ */ i(T.Item, { as: "div", children: /* @__PURE__ */ i(rt, { color: "error" }) }),
+    /* @__PURE__ */ i(T.Item, { padding: "xxx-small none", shouldShrink: !0, children: /* @__PURE__ */ i(Ne, { maxLines: 3, children: t.highlightUnavailable }) })
   ] });
-}, Cn = {
+}, Cn = 100, In = {
   filter: null,
   courseFilter: null,
   currentPage: 1,
@@ -1026,7 +1028,7 @@ function de(t, e) {
   const n = typeof e == "number" ? Math.min(e, t) : t;
   return Math.max(1, n);
 }
-function In(t, e) {
+function xn(t, e) {
   switch (e.type) {
     case "SET_FILTER":
       return { ...t, filter: e.payload, currentPage: 1 };
@@ -1034,6 +1036,8 @@ function In(t, e) {
       return { ...t, courseFilter: e.payload, currentPage: 1 };
     case "SET_PAGE":
       return { ...t, currentPage: de(e.payload, t.totalPages) };
+    case "FOCUS_PAGE":
+      return { ...t, currentPage: Math.max(1, e.payload) };
     case "INCREMENT_PAGE":
       return { ...t, currentPage: de(t.currentPage + 1, t.totalPages) };
     case "DECREMENT_PAGE":
@@ -1048,87 +1052,107 @@ function In(t, e) {
       return t;
   }
 }
-function to({
+function no({
   api: t,
   courseId: e,
   enableCourseFilter: n = !1,
   learningObject: o,
-  pageSize: r = 16
+  pageSize: r = 16,
+  focusNoteId: s
 }) {
-  const [i, l] = je(In, Cn), { filter: a, courseFilter: m, currentPage: c, totalPages: h } = i;
-  Z(() => {
-    l({ type: "SET_PAGE", payload: 1 });
+  const [l, a] = $e(xn, In), { filter: m, courseFilter: c, currentPage: g, totalPages: h } = l;
+  J(() => {
+    a({ type: "SET_PAGE", payload: 1 });
   }, [r]);
-  const g = n ? m : e, u = (c - 1) * r, { data: p, isLoading: y, isError: T } = Ke({
+  const f = n ? c : e, N = (g - 1) * r, y = {
+    ...f ? { courseId: f } : {},
+    ...m ? { reactions: [m] } : {},
+    ...o ? { learningObject: o } : {}
+  }, { data: E, isLoading: p, isError: _ } = ye({
     api: t,
-    filter: {
-      ...g ? { courseId: g } : {},
-      ...a ? { reactions: [a] } : {},
-      ...o ? { learningObject: o } : {}
-    },
-    offset: u,
+    filter: y,
+    offset: N,
     pageSize: r
-  }), N = (p == null ? void 0 : p.notes) ?? [], O = p == null ? void 0 : p.pageInfo, L = (O == null ? void 0 : O.totalNrOfPages) ?? void 0;
-  Z(() => {
-    l({ type: "SET_TOTAL_PAGES", payload: L });
-  }, [L]);
-  const b = q((x) => {
-    l({ type: "SET_PAGE", payload: x });
-  }, []), I = q(() => {
-    l({
+  }), { data: w } = ye({
+    api: t,
+    filter: y,
+    offset: 0,
+    pageSize: Cn,
+    enabled: !!s
+  }), b = ee(null);
+  J(() => {
+    if (!s) {
+      b.current = null;
+      return;
+    }
+    if (b.current === s) return;
+    const j = (w == null ? void 0 : w.notes.findIndex((u) => u.id === s)) ?? -1;
+    if (j === -1) return;
+    b.current = s;
+    const k = Math.floor(j / r) + 1;
+    k !== g && a({ type: "FOCUS_PAGE", payload: k });
+  }, [s, w, r, g]);
+  const I = (E == null ? void 0 : E.notes) ?? [], R = E == null ? void 0 : E.pageInfo, v = (R == null ? void 0 : R.totalNrOfPages) ?? void 0, M = s && w ? Math.ceil(w.notes.length / r) : void 0, P = v === void 0 && M === void 0 ? void 0 : Math.max(v ?? 0, M ?? 0);
+  J(() => {
+    a({ type: "SET_TOTAL_PAGES", payload: P });
+  }, [P]);
+  const D = K((j) => {
+    a({ type: "SET_PAGE", payload: j });
+  }, []), x = K(() => {
+    a({
       type: "INCREMENT_PAGE"
       /* IncrementPage */
     });
-  }, []), R = q(() => {
-    l({
+  }, []), G = K(() => {
+    a({
       type: "DECREMENT_PAGE"
       /* DecrementPage */
     });
-  }, []), C = q((x) => {
-    l({ type: "SET_FILTER", payload: x });
-  }, []), B = q((x) => {
-    l({ type: "SET_COURSE_FILTER", payload: x });
+  }, []), Y = K((j) => {
+    a({ type: "SET_FILTER", payload: j });
+  }, []), H = K((j) => {
+    a({ type: "SET_COURSE_FILTER", payload: j });
   }, []);
   return {
-    notes: N,
-    pageInfo: O,
-    isLoading: y,
-    isError: T,
-    filter: a,
-    courseFilter: m,
-    currentPage: c,
+    notes: I,
+    pageInfo: R,
+    isLoading: p,
+    isError: _,
+    filter: m,
+    courseFilter: c,
+    currentPage: g,
     totalPages: h,
-    setFilter: C,
-    setCourseFilter: B,
-    setPage: b,
-    fetchNextPage: I,
-    fetchPreviousPage: R
+    setFilter: Y,
+    setCourseFilter: H,
+    setPage: D,
+    fetchNextPage: x,
+    fetchPreviousPage: G
   };
 }
 const he = "all";
-function no({ filter: t, setFilter: e }) {
-  const { translations: n } = Q(), o = ie(
+function oo({ filter: t, setFilter: e }) {
+  const { translations: n } = V(), o = le(
     () => [
       { label: n.allNotes, value: he },
-      { label: n.important, value: k.IMPORTANT },
-      { label: n.unclear, value: k.CONFUSING }
+      { label: n.important, value: O.IMPORTANT },
+      { label: n.unclear, value: O.CONFUSING }
     ],
     [n]
-  ), r = q(
+  ), r = K(
     (l, { value: a }) => {
       e(!a || a === he ? null : a);
     },
     [e]
   );
   return {
-    filterElement: ie(
-      () => /* @__PURE__ */ s(
+    filterElement: le(
+      () => /* @__PURE__ */ i(
         De,
         {
-          renderLabel: /* @__PURE__ */ s(ze, { children: n.notes }),
+          renderLabel: /* @__PURE__ */ i(ze, { children: n.notes }),
           value: t ?? he,
           onChange: r,
-          children: o.map((l) => /* @__PURE__ */ s(De.Option, { id: l.value, value: l.value, children: l.label }, l.value))
+          children: o.map((l) => /* @__PURE__ */ i(De.Option, { id: l.value, value: l.value, children: l.label }, l.value))
         }
       ),
       [t, o, r, n.notes]
@@ -1137,16 +1161,16 @@ function no({ filter: t, setFilter: e }) {
     handleReactionFilterChange: r
   };
 }
-const xn = ({ hasActiveFilter: t = !1 }) => {
-  const { translations: e } = Q(), n = t ? e.nothingHereYet : e.emptyStateHeading, o = t ? e.adjustFiltersOrCreate : e.emptyStateDescription;
-  return /* @__PURE__ */ s(z, { as: "div", textAlign: "center", children: /* @__PURE__ */ E(S, { direction: "column", alignItems: "center", gap: "small", children: [
-    !t && /* @__PURE__ */ s(st, { size: "medium" }),
-    /* @__PURE__ */ s(fe, { level: "h3", children: n }),
-    /* @__PURE__ */ s(U, { color: "secondary", children: o })
+const wn = ({ hasActiveFilter: t = !1 }) => {
+  const { translations: e } = V(), n = t ? e.nothingHereYet : e.emptyStateHeading, o = t ? e.adjustFiltersOrCreate : e.emptyStateDescription;
+  return /* @__PURE__ */ i(U, { as: "div", textAlign: "center", children: /* @__PURE__ */ S(T, { direction: "column", alignItems: "center", gap: "small", children: [
+    !t && /* @__PURE__ */ i(st, { size: "medium" }),
+    /* @__PURE__ */ i(fe, { level: "h3", children: n }),
+    /* @__PURE__ */ i(q, { color: "secondary", children: o })
   ] }) });
-}, oo = ({ children: t }) => {
-  const { isTrayOpen: e, closeTray: n } = Ye(), { translations: o } = Q();
-  return /* @__PURE__ */ s(
+}, ro = ({ children: t }) => {
+  const { isTrayOpen: e, closeTray: n } = Ye(), { translations: o } = V();
+  return /* @__PURE__ */ i(
     at,
     {
       label: o.notebook,
@@ -1154,10 +1178,10 @@ const xn = ({ hasActiveFilter: t = !1 }) => {
       onDismiss: n,
       placement: "end",
       size: "regular",
-      children: /* @__PURE__ */ E(S, { direction: "column", height: "100vh", children: [
-        /* @__PURE__ */ s(S.Item, { children: /* @__PURE__ */ s(z, { as: "div", padding: "small medium", borderWidth: "0 0 small 0", children: /* @__PURE__ */ E(S, { justifyItems: "space-between", alignItems: "center", children: [
-          /* @__PURE__ */ s(fe, { level: "h3", children: o.notebook }),
-          /* @__PURE__ */ s(
+      children: /* @__PURE__ */ S(T, { direction: "column", height: "100vh", children: [
+        /* @__PURE__ */ i(T.Item, { children: /* @__PURE__ */ i(U, { as: "div", padding: "small medium", borderWidth: "0 0 small 0", children: /* @__PURE__ */ S(T, { justifyItems: "space-between", alignItems: "center", children: [
+          /* @__PURE__ */ i(fe, { level: "h3", children: o.notebook }),
+          /* @__PURE__ */ i(
             lt,
             {
               screenReaderLabel: o.closeNotebookPanel,
@@ -1167,229 +1191,228 @@ const xn = ({ hasActiveFilter: t = !1 }) => {
             }
           )
         ] }) }) }),
-        /* @__PURE__ */ s(S.Item, { shouldGrow: !0, shouldShrink: !0, overflowY: "auto", overflowX: "hidden", children: t })
+        /* @__PURE__ */ i(T.Item, { shouldGrow: !0, shouldShrink: !0, overflowY: "auto", overflowX: "hidden", children: t })
       ] })
     }
   );
-}, wn = {
-  [k.IMPORTANT]: {
+}, kn = {
+  [O.IMPORTANT]: {
     color: "success",
     translationKey: "important",
-    icon: /* @__PURE__ */ s(Te, { size: "x-small" })
+    icon: /* @__PURE__ */ i(ve, { size: "x-small" })
   },
-  [k.CONFUSING]: {
+  [O.CONFUSING]: {
     color: "danger",
     translationKey: "unclear",
-    icon: /* @__PURE__ */ s(Se, { size: "x-small" })
+    icon: /* @__PURE__ */ i(Te, { size: "x-small" })
   }
 }, Je = ({ type: t, onTypeChange: e, renderAsMenuTrigger: n = !1 }) => {
-  const { translations: o } = Q(), r = wn[t], i = o[r.translationKey], [l, a] = H(!1), m = J(null), c = J(null), h = q(
-    (g) => {
-      e == null || e(g), a(!1);
+  const { translations: o } = V(), r = kn[t], s = o[r.translationKey], [l, a] = $(!1), m = ee(null), c = ee(null), g = K(
+    (h) => {
+      e == null || e(h), a(!1);
     },
     [e]
   );
-  return n && e ? /* @__PURE__ */ E(
-    ne,
+  return n && e ? /* @__PURE__ */ S(
+    oe,
     {
       placement: "bottom start",
       show: l,
-      onToggle: (g) => a(g),
+      onToggle: (h) => a(h),
       shouldHideOnSelect: !0,
       shouldFocusTriggerOnClose: !0,
-      trigger: /* @__PURE__ */ s(Pe, { color: r.color, renderIcon: r.icon, children: i }),
+      trigger: /* @__PURE__ */ i(Ae, { color: r.color, renderIcon: r.icon, children: s }),
       children: [
-        /* @__PURE__ */ E(ne.Item, { ref: m, onClick: () => h(k.CONFUSING), children: [
-          /* @__PURE__ */ s(Se, { size: "x-small" }),
+        /* @__PURE__ */ S(oe.Item, { ref: m, onClick: () => g(O.CONFUSING), children: [
+          /* @__PURE__ */ i(Te, { size: "x-small" }),
           ` ${o.markUnclear}`
         ] }),
-        /* @__PURE__ */ E(ne.Item, { ref: c, onClick: () => h(k.IMPORTANT), children: [
-          /* @__PURE__ */ s(Te, { size: "x-small" }),
+        /* @__PURE__ */ S(oe.Item, { ref: c, onClick: () => g(O.IMPORTANT), children: [
+          /* @__PURE__ */ i(ve, { size: "x-small" }),
           ` ${o.markImportant}`
         ] })
       ]
     }
-  ) : /* @__PURE__ */ s(z, { display: "inline-flex", children: /* @__PURE__ */ s(Pe, { color: r.color, renderIcon: r.icon, children: i }) });
+  ) : /* @__PURE__ */ i(U, { display: "inline-flex", children: /* @__PURE__ */ i(Ae, { color: r.color, renderIcon: r.icon, children: s }) });
 };
-function Me(t, e) {
+function Be(t, e) {
   return (t instanceof Date ? t : new Date(t)).toLocaleString(e, {
     year: "numeric",
     month: "short",
     day: "numeric"
   });
 }
-const kn = ({
+const On = ({
   noteId: t,
   date: e,
   highlight: n,
   note: o,
   type: r,
-  onClick: i,
+  onClick: s,
   onDelete: l,
   onSaveNote: a,
   onTypeChange: m,
   isActive: c,
-  isPanelView: h = !1,
-  courseName: g,
-  locale: u,
-  highlightTheme: p,
+  isPanelView: g = !1,
+  courseName: h,
+  locale: f,
+  highlightTheme: N,
   renderLink: y,
-  href: T
+  href: E
 }) => {
-  const { translations: N } = Q(), [O, L] = H(!1), [b, I] = H(!1), [R, C] = H(o || ""), [B, x] = H(!1), A = J(null), w = q((f) => {
-    A.current = f;
+  const { translations: p } = V(), [_, w] = $(!1), [b, I] = $(!1), [R, v] = $(o || ""), [M, P] = $(!1), D = ee(null), x = K((u) => {
+    D.current = u;
   }, []);
-  Z(() => {
-    var f, F;
-    c && ((f = A.current) == null || f.scrollIntoView({ behavior: "smooth", block: "nearest" }), (F = A.current) == null || F.focus());
+  J(() => {
+    var u, L;
+    c && ((u = D.current) == null || u.scrollIntoView({ behavior: "smooth", block: "nearest" }), (L = D.current) == null || L.focus());
   }, [c]);
-  const G = r === k.IMPORTANT ? N.important : N.unclear, te = (f) => {
-    f.key === "Enter" && (f.preventDefault(), i == null || i());
-  }, $ = [G, N.note];
-  n && $.push(n), o && $.push(o), e && $.push(Me(e, u)), g && $.push(g);
-  const le = $.join(", "), D = /* @__PURE__ */ E(
-    z,
+  const G = r === O.IMPORTANT ? p.important : p.unclear, Y = (u) => {
+    u.key === "Enter" && (u.preventDefault(), s == null || s());
+  }, H = [G, p.note];
+  n && H.push(n), o && H.push(o), e && H.push(Be(e, f)), h && H.push(h);
+  const j = H.join(", "), k = /* @__PURE__ */ S(
+    U,
     {
       as: "div",
       borderWidth: "small",
       borderRadius: "medium",
       padding: "small",
       position: "relative",
-      role: T || b ? void 0 : "button",
-      "aria-label": T ? void 0 : le,
-      "aria-pressed": T || b ? void 0 : c,
-      tabIndex: T || c ? -1 : 0,
+      role: E || b ? void 0 : "button",
+      "aria-label": E ? void 0 : j,
+      "aria-pressed": E || b ? void 0 : c,
+      tabIndex: E || c ? -1 : 0,
       "data-testid": `note-card-${t}`,
-      elementRef: w,
-      onClick: c ? void 0 : i,
-      onMouseEnter: () => L(!0),
-      onMouseLeave: () => L(!1),
-      onKeyDown: c ? void 0 : te,
+      elementRef: x,
+      onClick: c ? void 0 : s,
+      onMouseEnter: () => w(!0),
+      onMouseLeave: () => w(!1),
+      onKeyDown: c ? void 0 : Y,
       cursor: b ? "default" : "pointer",
       children: [
-        /* @__PURE__ */ E(S, { direction: "column", gap: "small", children: [
-          /* @__PURE__ */ s(
+        /* @__PURE__ */ S(T, { direction: "column", gap: "small", children: [
+          /* @__PURE__ */ i(
             Je,
             {
               type: r,
-              onTypeChange: h && m ? (f) => m(t, f) : void 0,
-              renderAsMenuTrigger: h && !!m && !!c
+              onTypeChange: g && m ? (u) => m(t, u) : void 0,
+              renderAsMenuTrigger: g && !!m && !!c
             }
           ),
-          n ? /* @__PURE__ */ s("div", { style: { wordBreak: "break-word", overflowWrap: "break-word" }, children: /* @__PURE__ */ s(U, { children: c && h ? /* @__PURE__ */ s(
-            ye,
+          n ? /* @__PURE__ */ i("div", { style: { wordBreak: "break-word", overflowWrap: "break-word" }, children: /* @__PURE__ */ i(q, { children: c && g ? /* @__PURE__ */ i(
+            be,
             {
               type: r,
-              isCardActive: !!c || O,
-              theme: p,
+              isCardActive: !!c || _,
+              theme: N,
               children: n
             }
-          ) : /* @__PURE__ */ s(Ne, { maxLines: 3, truncate: "word", children: /* @__PURE__ */ s(
-            ye,
+          ) : /* @__PURE__ */ i(Ne, { maxLines: 3, truncate: "word", children: /* @__PURE__ */ i(
+            be,
             {
               type: r,
-              isCardActive: !!c || O,
-              theme: p,
+              isCardActive: !!c || _,
+              theme: N,
               children: n
             }
-          ) }) }) }) : /* @__PURE__ */ s(Ze, {}),
-          /* @__PURE__ */ E(S, { direction: "column", gap: "small", children: [
-            b && h ? /* @__PURE__ */ E(S, { direction: "column", gap: "x-small", children: [
-              /* @__PURE__ */ s(
-                $e,
+          ) }) }) }) : /* @__PURE__ */ i(Ze, {}),
+          /* @__PURE__ */ S(T, { direction: "column", gap: "small", children: [
+            b && g ? /* @__PURE__ */ S(T, { direction: "column", gap: "x-small", children: [
+              /* @__PURE__ */ i(
+                Ue,
                 {
-                  label: /* @__PURE__ */ s(ze, { children: N.editNote }),
+                  label: /* @__PURE__ */ i(ze, { children: p.editNote }),
                   value: R,
-                  onChange: (f) => C(f.target.value),
-                  placeholder: N.addNoteOptional
+                  onChange: (u) => v(u.target.value),
+                  placeholder: p.addNoteOptional
                 }
               ),
-              /* @__PURE__ */ E(S, { gap: "xx-small", children: [
-                /* @__PURE__ */ s(S.Item, { shouldGrow: !0, children: /* @__PURE__ */ s(
-                  K,
+              /* @__PURE__ */ S(T, { gap: "xx-small", children: [
+                /* @__PURE__ */ i(T.Item, { shouldGrow: !0, children: /* @__PURE__ */ i(
+                  X,
                   {
                     display: "block",
                     size: "small",
                     "data-testid": `note-card-${t}-cancel`,
                     onClick: () => {
-                      C(o || ""), I(!1);
+                      v(o || ""), I(!1);
                     },
-                    children: N.cancel
+                    children: p.cancel
                   }
                 ) }),
-                /* @__PURE__ */ s(S.Item, { shouldGrow: !0, children: /* @__PURE__ */ s(
-                  K,
+                /* @__PURE__ */ i(T.Item, { shouldGrow: !0, children: /* @__PURE__ */ i(
+                  X,
                   {
                     display: "block",
                     color: "primary",
                     size: "small",
                     "data-testid": `note-card-${t}-save`,
                     onClick: () => {
-                      a == null || a(t, R), I(!1);
+                      a == null || a(t, R.trim()), I(!1);
                     },
-                    interaction: R.trim() ? "enabled" : "disabled",
-                    children: N.save
+                    children: p.save
                   }
                 ) })
               ] })
-            ] }) : o ? /* @__PURE__ */ s("div", { style: { wordBreak: "break-word", overflowWrap: "break-word" }, children: c && h ? /* @__PURE__ */ E(U, { children: [
+            ] }) : o ? /* @__PURE__ */ i("div", { style: { wordBreak: "break-word", overflowWrap: "break-word" }, children: c && g ? /* @__PURE__ */ S(q, { children: [
               o,
               " ",
-              /* @__PURE__ */ s(
-                re,
+              /* @__PURE__ */ i(
+                se,
                 {
                   size: "small",
                   withBackground: !1,
                   withBorder: !1,
-                  screenReaderLabel: N.editNote,
+                  screenReaderLabel: p.editNote,
                   "data-testid": `note-card-${t}-edit`,
-                  onClick: (f) => {
-                    f.stopPropagation(), I(!0);
+                  onClick: (u) => {
+                    u.stopPropagation(), I(!0);
                   },
-                  children: /* @__PURE__ */ s(pe, {})
+                  children: /* @__PURE__ */ i(pe, {})
                 }
               )
-            ] }) : /* @__PURE__ */ s(U, { children: /* @__PURE__ */ s(Ne, { maxLines: 3, truncate: "word", children: o }) }) }) : h && c ? /* @__PURE__ */ s("div", { children: /* @__PURE__ */ E(U, { color: "secondary", children: [
-              N.addNotePrompt,
+            ] }) : /* @__PURE__ */ i(q, { children: /* @__PURE__ */ i(Ne, { maxLines: 3, truncate: "word", children: o }) }) }) : g && c ? /* @__PURE__ */ i("div", { children: /* @__PURE__ */ S(q, { color: "secondary", children: [
+              p.addNotePrompt,
               " ",
-              /* @__PURE__ */ s(
-                re,
+              /* @__PURE__ */ i(
+                se,
                 {
                   size: "small",
                   withBackground: !1,
                   withBorder: !1,
-                  screenReaderLabel: N.editNote,
+                  screenReaderLabel: p.editNote,
                   "data-testid": `note-card-${t}-edit`,
-                  onClick: (f) => {
-                    f.stopPropagation(), I(!0);
+                  onClick: (u) => {
+                    u.stopPropagation(), I(!0);
                   },
-                  children: /* @__PURE__ */ s(pe, {})
+                  children: /* @__PURE__ */ i(pe, {})
                 }
               )
             ] }) }) : null,
-            /* @__PURE__ */ E(S, { justifyItems: "space-between", alignItems: "center", children: [
-              /* @__PURE__ */ s(U, { size: "small", color: "secondary", children: Me(e, u) }),
-              c && l && /* @__PURE__ */ s(
-                re,
+            /* @__PURE__ */ S(T, { justifyItems: "space-between", alignItems: "center", children: [
+              /* @__PURE__ */ i(q, { size: "small", color: "secondary", children: Be(e, f) }),
+              c && l && /* @__PURE__ */ i(
+                se,
                 {
                   size: "small",
                   withBackground: !1,
                   withBorder: !1,
                   color: "danger",
-                  screenReaderLabel: N.deleteNote,
+                  screenReaderLabel: p.deleteNote,
                   "data-testid": `note-card-${t}-delete`,
-                  onClick: (f) => {
-                    f.stopPropagation(), x(!0);
+                  onClick: (u) => {
+                    u.stopPropagation(), P(!0);
                   },
-                  children: /* @__PURE__ */ s(ue, {})
+                  children: /* @__PURE__ */ i(ue, {})
                 }
               )
             ] }),
-            g && /* @__PURE__ */ s(U, { size: "small", color: "secondary", children: g })
+            h && /* @__PURE__ */ i(q, { size: "small", color: "secondary", children: h })
           ] })
         ] }),
-        B && l && /* @__PURE__ */ s(
-          z,
+        M && l && /* @__PURE__ */ i(
+          U,
           {
             as: "div",
             background: "primary",
@@ -1401,8 +1424,8 @@ const kn = ({
             insetInlineStart: "0",
             insetInlineEnd: "0",
             stacking: "above",
-            children: /* @__PURE__ */ E(
-              S,
+            children: /* @__PURE__ */ S(
+              T,
               {
                 direction: "column",
                 justifyItems: "center",
@@ -1410,30 +1433,30 @@ const kn = ({
                 gap: "x-small",
                 height: "100%",
                 children: [
-                  /* @__PURE__ */ s(
-                    K,
+                  /* @__PURE__ */ i(
+                    X,
                     {
                       display: "block",
                       color: "danger",
                       size: "small",
-                      renderIcon: /* @__PURE__ */ s(ue, {}),
+                      renderIcon: /* @__PURE__ */ i(ue, {}),
                       "data-testid": `note-card-${t}-confirm-delete`,
-                      onClick: (f) => {
-                        f.stopPropagation(), l(t), x(!1);
+                      onClick: (u) => {
+                        u.stopPropagation(), l(t), P(!1);
                       },
-                      children: N.deleteNote
+                      children: p.deleteNote
                     }
                   ),
-                  /* @__PURE__ */ s(
-                    K,
+                  /* @__PURE__ */ i(
+                    X,
                     {
                       display: "block",
                       size: "small",
                       "data-testid": `note-card-${t}-cancel-delete`,
-                      onClick: (f) => {
-                        f.stopPropagation(), x(!1);
+                      onClick: (u) => {
+                        u.stopPropagation(), P(!1);
                       },
-                      children: N.cancel
+                      children: p.cancel
                     }
                   )
                 ]
@@ -1444,15 +1467,15 @@ const kn = ({
       ]
     }
   );
-  return T && y ? y({ href: T, children: D, ariaLabel: le }) : D;
+  return E && y ? y({ href: E, children: k, ariaLabel: j }) : k;
 };
-function On(t, e) {
+function Rn(t, e) {
   const n = Array.from({ length: e }, () => []);
   return t.forEach((o, r) => {
     n[r % e].push(o);
   }), n;
 }
-const Rn = {
+const Pn = {
   display: "flex",
   gap: "1rem",
   boxSizing: "border-box",
@@ -1464,148 +1487,148 @@ const Rn = {
   gap: "1rem",
   flex: 1,
   minWidth: 0
-}, ro = ({
+}, so = ({
   notes: t,
   isLoading: e,
   isError: n,
   currentPage: o,
   totalPages: r,
-  onPageChange: i,
+  onPageChange: s,
   onNoteSelect: l,
   onNoteDelete: a,
   onNoteSave: m,
   onNoteTypeChange: c,
-  selectedNoteId: h,
-  hasActiveFilter: g = !1,
-  columnCount: u = 1,
-  highlightTheme: p,
+  selectedNoteId: g,
+  hasActiveFilter: h = !1,
+  columnCount: f = 1,
+  highlightTheme: N,
   locale: y,
-  renderNoteLink: T,
-  noteHref: N
+  renderNoteLink: E,
+  noteHref: p
 }) => {
-  const { translations: O } = Q(), L = ie(
-    () => On(t, u),
-    [t, u]
+  const { translations: _ } = V(), w = le(
+    () => Rn(t, f),
+    [t, f]
   );
   if (e)
-    return /* @__PURE__ */ s(z, { as: "div", textAlign: "center", padding: "large", "data-testid": "notes-loading", children: /* @__PURE__ */ s(dt, { renderTitle: O.loadingNotes }) });
+    return /* @__PURE__ */ i(U, { as: "div", textAlign: "center", padding: "large", "data-testid": "notes-loading", children: /* @__PURE__ */ i(dt, { renderTitle: _.loadingNotes }) });
   if (n)
-    return /* @__PURE__ */ s(z, { as: "div", textAlign: "center", padding: "large", "data-testid": "notes-error", children: /* @__PURE__ */ s(fe, { level: "h4", children: O.failedToLoadNotes }) });
+    return /* @__PURE__ */ i(U, { as: "div", textAlign: "center", padding: "large", "data-testid": "notes-error", children: /* @__PURE__ */ i(fe, { level: "h4", children: _.failedToLoadNotes }) });
   if (t.length === 0)
-    return /* @__PURE__ */ s(z, { as: "div", padding: "large", "data-testid": "empty-notes", children: /* @__PURE__ */ s(xn, { hasActiveFilter: g }) });
-  const b = typeof o == "number" && typeof r == "number" && r > 1 && i !== void 0;
-  return /* @__PURE__ */ E(et, { children: [
-    /* @__PURE__ */ s("div", { style: Rn, "data-testid": "notes-grid", children: L.map((I, R) => (
+    return /* @__PURE__ */ i(U, { as: "div", padding: "large", "data-testid": "empty-notes", children: /* @__PURE__ */ i(wn, { hasActiveFilter: h }) });
+  const b = typeof o == "number" && typeof r == "number" && r > 1 && s !== void 0;
+  return /* @__PURE__ */ S(et, { children: [
+    /* @__PURE__ */ i("div", { style: Pn, "data-testid": "notes-grid", children: w.map((I, R) => (
       // oxlint-disable-next-line react/no-array-index-key -- columns are positional, index is stable
-      /* @__PURE__ */ s("div", { style: Dn, children: I.map((C) => {
-        var B;
-        return /* @__PURE__ */ s(
-          kn,
+      /* @__PURE__ */ i("div", { style: Dn, children: I.map((v) => {
+        var M;
+        return /* @__PURE__ */ i(
+          On,
           {
-            noteId: C.id,
-            date: C.createdAt,
-            type: C.reaction[0] ?? k.IMPORTANT,
-            highlight: (B = C.highlightData) == null ? void 0 : B.selectedText,
-            note: C.userText,
-            isActive: h === C.id,
-            isPanelView: !!h,
-            onClick: l ? () => l(C.id) : void 0,
-            onDelete: a ? (x) => a(x) : void 0,
-            onSaveNote: m ? (x, A) => m(x, A) : void 0,
-            onTypeChange: c ? (x, A) => c(x, A) : void 0,
-            highlightTheme: p,
+            noteId: v.id,
+            date: v.createdAt,
+            type: v.reaction[0] ?? O.IMPORTANT,
+            highlight: (M = v.highlightData) == null ? void 0 : M.selectedText,
+            note: v.userText,
+            isActive: g === v.id,
+            isPanelView: !!g,
+            onClick: l ? () => l(v.id) : void 0,
+            onDelete: a ? (P) => a(P) : void 0,
+            onSaveNote: m ? (P, D) => m(P, D) : void 0,
+            onTypeChange: c ? (P, D) => c(P, D) : void 0,
+            highlightTheme: N,
             locale: y,
-            renderLink: T,
-            href: N ? N(C.id, C) : void 0
+            renderLink: E,
+            href: p ? p(v.id, v) : void 0
           },
-          C.id
+          v.id
         );
       }) }, R)
     )) }),
-    b && /* @__PURE__ */ s(S, { justifyItems: "center", padding: "small", "data-testid": "notes-pagination", children: /* @__PURE__ */ s(S.Item, { children: /* @__PURE__ */ s(
+    b && /* @__PURE__ */ i(T, { justifyItems: "center", padding: "small", "data-testid": "notes-pagination", children: /* @__PURE__ */ i(T.Item, { children: /* @__PURE__ */ i(
       ct,
       {
         as: "nav",
         variant: "input",
-        labelNext: O.nextPage,
-        labelPrev: O.previousPage,
+        labelNext: _.nextPage,
+        labelPrev: _.previousPage,
         currentPage: o,
         totalPageNumber: r,
-        onPageChange: i
+        onPageChange: s
       }
     ) }) })
   ] });
-}, so = ({
+}, io = ({
   noteText: t,
   reaction: e,
   highlightText: n,
   highlightTheme: o,
   onSave: r,
-  onDelete: i,
+  onDelete: s,
   onTypeChange: l,
   onBack: a,
   editing: m = !1
 }) => {
-  const { translations: c } = Q(), [h, g] = H(m), [u, p] = H(t || ""), [y, T] = H(!1);
-  return /* @__PURE__ */ E(S, { direction: "column", gap: "small", "data-testid": "single-note", children: [
-    n != null ? /* @__PURE__ */ s(z, { as: "div", children: /* @__PURE__ */ s(U, { children: /* @__PURE__ */ s(ye, { type: e, isCardActive: !0, theme: o, children: n }) }) }) : /* @__PURE__ */ s(Ze, {}),
-    /* @__PURE__ */ s(Je, { type: e, onTypeChange: l, renderAsMenuTrigger: !!l }),
-    h ? /* @__PURE__ */ E(S, { direction: "column", gap: "x-small", children: [
-      /* @__PURE__ */ s(
-        $e,
+  const { translations: c } = V(), [g, h] = $(m), [f, N] = $(t || ""), [y, E] = $(!1);
+  return /* @__PURE__ */ S(T, { direction: "column", gap: "small", "data-testid": "single-note", children: [
+    n != null ? /* @__PURE__ */ i(U, { as: "div", children: /* @__PURE__ */ i(q, { children: /* @__PURE__ */ i(be, { type: e, isCardActive: !0, theme: o, children: n }) }) }) : /* @__PURE__ */ i(Ze, {}),
+    /* @__PURE__ */ i(Je, { type: e, onTypeChange: l, renderAsMenuTrigger: !!l }),
+    g ? /* @__PURE__ */ S(T, { direction: "column", gap: "x-small", children: [
+      /* @__PURE__ */ i(
+        Ue,
         {
           label: c.addNoteOptional,
-          value: u,
-          onChange: (N) => p(N.target.value),
+          value: f,
+          onChange: (p) => N(p.target.value),
           resize: "vertical"
         }
       ),
-      /* @__PURE__ */ E(S, { gap: "xx-small", children: [
-        /* @__PURE__ */ s(S.Item, { shouldGrow: !0, children: /* @__PURE__ */ s(
-          K,
+      /* @__PURE__ */ S(T, { gap: "xx-small", children: [
+        /* @__PURE__ */ i(T.Item, { shouldGrow: !0, children: /* @__PURE__ */ i(
+          X,
           {
             display: "block",
             size: "small",
             "data-testid": "single-note-cancel",
             onClick: () => {
-              p(t || ""), g(!1);
+              N(t || ""), h(!1);
             },
             children: c.cancel
           }
         ) }),
-        /* @__PURE__ */ s(S.Item, { shouldGrow: !0, children: /* @__PURE__ */ s(
-          K,
+        /* @__PURE__ */ i(T.Item, { shouldGrow: !0, children: /* @__PURE__ */ i(
+          X,
           {
             display: "block",
             color: "primary",
             size: "small",
             "data-testid": "single-note-save",
             onClick: () => {
-              r(u), g(!1);
+              r(f), h(!1);
             },
             children: c.save
           }
         ) })
       ] })
-    ] }) : /* @__PURE__ */ E(S, { direction: "column", gap: "small", children: [
-      t && /* @__PURE__ */ E(z, { as: "div", children: [
-        /* @__PURE__ */ s(fe, { level: "h4", margin: "0 0 xx-small 0", children: c.note }),
-        /* @__PURE__ */ s(U, { children: t })
+    ] }) : /* @__PURE__ */ S(T, { direction: "column", gap: "small", children: [
+      t && /* @__PURE__ */ S(U, { as: "div", children: [
+        /* @__PURE__ */ i(fe, { level: "h4", margin: "0 0 xx-small 0", children: c.note }),
+        /* @__PURE__ */ i(q, { children: t })
       ] }),
-      /* @__PURE__ */ E(S, { justifyItems: "space-between", children: [
-        /* @__PURE__ */ s(
-          K,
+      /* @__PURE__ */ S(T, { justifyItems: "space-between", children: [
+        /* @__PURE__ */ i(
+          X,
           {
             size: "small",
-            renderIcon: /* @__PURE__ */ s(it, {}),
+            renderIcon: /* @__PURE__ */ i(it, {}),
             "data-testid": "single-note-back",
             onClick: () => a == null ? void 0 : a(),
             children: c.back
           }
         ),
-        /* @__PURE__ */ E(S, { gap: "xx-small", children: [
-          i && /* @__PURE__ */ s(
-            re,
+        /* @__PURE__ */ S(T, { gap: "xx-small", children: [
+          s && /* @__PURE__ */ i(
+            se,
             {
               size: "small",
               withBackground: !1,
@@ -1613,46 +1636,46 @@ const Rn = {
               color: "danger",
               screenReaderLabel: c.deleteNote,
               "data-testid": "single-note-delete",
-              onClick: () => T(!0),
-              children: /* @__PURE__ */ s(ue, {})
+              onClick: () => E(!0),
+              children: /* @__PURE__ */ i(ue, {})
             }
           ),
-          /* @__PURE__ */ s(
-            re,
+          /* @__PURE__ */ i(
+            se,
             {
               size: "small",
               withBackground: !1,
               withBorder: !1,
               screenReaderLabel: c.editNote,
               "data-testid": "single-note-edit",
-              onClick: () => g(!0),
-              children: /* @__PURE__ */ s(pe, {})
+              onClick: () => h(!0),
+              children: /* @__PURE__ */ i(pe, {})
             }
           )
         ] })
       ] }),
-      y && i && /* @__PURE__ */ s(z, { as: "div", background: "primary", padding: "medium", borderRadius: "large", children: /* @__PURE__ */ E(S, { direction: "column", justifyItems: "center", alignItems: "center", gap: "x-small", children: [
-        /* @__PURE__ */ s(
-          K,
+      y && s && /* @__PURE__ */ i(U, { as: "div", background: "primary", padding: "medium", borderRadius: "large", children: /* @__PURE__ */ S(T, { direction: "column", justifyItems: "center", alignItems: "center", gap: "x-small", children: [
+        /* @__PURE__ */ i(
+          X,
           {
             display: "block",
             color: "danger",
             size: "small",
-            renderIcon: /* @__PURE__ */ s(ue, {}),
+            renderIcon: /* @__PURE__ */ i(ue, {}),
             "data-testid": "single-note-confirm-delete",
             onClick: () => {
-              i(), T(!1);
+              s(), E(!1);
             },
             children: c.deleteNote
           }
         ),
-        /* @__PURE__ */ s(
-          K,
+        /* @__PURE__ */ i(
+          X,
           {
             display: "block",
             size: "small",
             "data-testid": "single-note-cancel-delete",
-            onClick: () => T(!1),
+            onClick: () => E(!1),
             children: c.cancel
           }
         )
@@ -1661,26 +1684,26 @@ const Rn = {
   ] });
 };
 export {
-  eo as ContentWithNoteWrapper,
-  ye as Highlight,
+  to as ContentWithNoteWrapper,
+  be as Highlight,
   Ze as HighlightError,
-  kn as NoteCard,
+  On as NoteCard,
   Je as NoteChip,
   Tn as NoteReactionMenu,
-  xn as NotebookEmptyState,
-  Jn as NotebookProvider,
+  wn as NotebookEmptyState,
+  eo as NotebookProvider,
   bn as NotebookTranslationsProvider,
-  oo as NotebookTray,
-  ro as NotesListView,
-  k as REACTION_TYPE,
-  so as SingleNote,
-  we as createTransparentColor,
-  At as useCreateNote,
-  Ft as useDeleteNote,
-  Ke as useGetNotes,
+  ro as NotebookTray,
+  so as NotesListView,
+  O as REACTION_TYPE,
+  io as SingleNote,
+  ke as createTransparentColor,
+  Lt as useCreateNote,
+  _t as useDeleteNote,
+  ye as useGetNotes,
   Ye as useNotebook,
-  Q as useNotebookTranslations,
-  to as useNotesData,
-  no as useReactionFilter,
-  _t as useUpdateNote
+  V as useNotebookTranslations,
+  no as useNotesData,
+  oo as useReactionFilter,
+  Ft as useUpdateNote
 };