@instructure/platform-notebook 1.5.2 → 1.6.1

package/dist/index.js

@@ -1,48 +1,48 @@
-import { jsx as i, jsxs as T, Fragment as rt } from "react/jsx-runtime";
-import { createContext as je, useMemo as ge, useContext as ze, useReducer as We, useRef as K, useEffect as V, useState as U, useCallback as Y } from "react";
-import { createPortal as st } from "react-dom";
+import { jsx as i, jsxs as C, Fragment as it } from "react/jsx-runtime";
+import { createContext as Ue, useMemo as fe, useContext as ze, useReducer as We, useRef as _, useEffect as W, useState as j, useCallback as X } from "react";
+import { createPortal as lt } from "react-dom";
 import { z as u } from "zod";
-import it from "diff-match-patch";
-import { useQueryClient as Ie, useMutation as xe, useQuery as at } from "@tanstack/react-query";
-import { CloseButton as lt, Button as ee, IconButton as le } from "@instructure/ui-buttons";
-import { Flex as v } from "@instructure/ui-flex";
-import { Heading as pe } from "@instructure/ui-heading";
-import { Tray as ct } from "@instructure/ui-tray";
-import { View as j } from "@instructure/ui-view";
-import { IconQuestionLine as ke, IconPinLine as we, IconWarningLine as dt, IconNoteLine as ut, IconEditLine as Se, IconTrashLine as he, IconArrowStartLine as ft } from "@instructure/ui-icons";
-import { Menu as ie } from "@instructure/ui-menu";
-import { TruncateText as Te } from "@instructure/ui-truncate-text";
+import at from "diff-match-patch";
+import { useQueryClient as Ce, useMutation as xe, useQuery as ct } from "@tanstack/react-query";
+import { CloseButton as dt, Button as J, IconButton as de } from "@instructure/ui-buttons";
+import { Flex as x } from "@instructure/ui-flex";
+import { Heading as Ne } from "@instructure/ui-heading";
+import { Tray as ut } from "@instructure/ui-tray";
+import { View as q } from "@instructure/ui-view";
+import { IconQuestionLine as ke, IconPinLine as Re, IconWarningLine as ft, IconNoteLine as mt, IconEditLine as Te, IconTrashLine as pe, IconArrowStartLine as gt } from "@instructure/ui-icons";
+import { Menu as ae } from "@instructure/ui-menu";
+import { TruncateText as Ie } from "@instructure/ui-truncate-text";
 import { SimpleSelect as Fe } from "@instructure/ui-simple-select";
-import { Text as J } from "@instructure/ui-text";
-import { ScreenReaderContent as mt } from "@instructure/ui-a11y-content";
+import { Text as Z } from "@instructure/ui-text";
+import { ScreenReaderContent as ht } from "@instructure/ui-a11y-content";
 import { TextArea as qe } from "@instructure/ui-text-area";
 import { Pill as Me } from "@instructure/ui-pill";
-import { Pagination as gt } from "@instructure/ui-pagination";
-import { Spinner as ht } from "@instructure/ui-spinner";
-const pt = u.object({
+import { Pagination as pt } from "@instructure/ui-pagination";
+import { Spinner as Nt } from "@instructure/ui-spinner";
+const yt = u.object({
   startContainer: u.string(),
   endContainer: u.string(),
   startOffset: u.number(),
   endOffset: u.number()
-}), Nt = u.object({
+}), bt = u.object({
   start: u.number(),
   end: u.number()
-}), Oe = u.object({
+}), we = u.object({
   selectedText: u.string(),
   hasNoHighlightAnymore: u.boolean().optional(),
-  textPosition: Nt.nullable(),
-  range: pt.nullable(),
+  textPosition: bt.nullable(),
+  range: yt.nullable(),
   pageLastModifiedAt: u.string()
 });
-var x = /* @__PURE__ */ ((t) => (t.IMPORTANT = "Important", t.CONFUSING = "Confusing", t))(x || {});
-const Re = u.enum([
+var L = /* @__PURE__ */ ((t) => (t.IMPORTANT = "Important", t.CONFUSING = "Confusing", t))(L || {});
+const Oe = u.enum([
   "Important",
   "Confusing"
   /* CONFUSING */
-]), yt = u.object({
+]), Et = u.object({
   totalCount: u.number().nullish(),
   totalNrOfPages: u.number().nullish()
-}), Ne = u.object({
+}), ye = u.object({
   id: u.string(),
   rootAccountUuid: u.string(),
   userId: u.string(),
@@ -50,32 +50,32 @@ const Re = u.enum([
   objectId: u.string(),
   objectType: u.string(),
   userText: u.string().optional(),
-  reaction: u.array(Re),
-  highlightData: Oe,
+  reaction: u.array(Oe),
+  highlightData: we,
   createdAt: u.string(),
   updatedAt: u.string()
-}), bt = u.object({
+}), St = u.object({
   cursor: u.string(),
-  node: Ne
+  node: ye
 });
 u.object({
   notes: u.object({
-    edges: u.array(bt),
-    nodes: u.array(Ne),
-    pageInfo: yt
+    edges: u.array(St),
+    nodes: u.array(ye),
+    pageInfo: Et
   })
 });
-const Et = u.object({
+const Tt = u.object({
   type: u.string(),
   id: u.string()
-}), St = u.object({
+}), It = u.object({
   courseId: u.string().optional(),
-  learningObject: Et.optional(),
+  learningObject: Tt.optional(),
   reactions: u.array(u.string()).optional()
 }).optional();
 u.object({
   courseId: u.string().optional(),
-  filter: St,
+  filter: It,
   offset: u.number().optional(),
   pageSize: u.number().optional()
 });
@@ -84,26 +84,26 @@ u.object({
   objectId: u.string(),
   objectType: u.string(),
   userText: u.string().optional(),
-  reaction: u.array(Re),
-  highlightData: Oe
+  reaction: u.array(Oe),
+  highlightData: we
 });
 u.object({
-  createNote: Ne
+  createNote: ye
 });
 u.object({
   id: u.string(),
   userText: u.string().optional(),
-  reaction: u.array(Re),
-  highlightData: Oe
+  reaction: u.array(Oe),
+  highlightData: we
 });
 u.object({
-  updateNote: Ne
+  updateNote: ye
 });
 u.object({
   deleteNote: u.string()
 });
 var Ke = /* @__PURE__ */ ((t) => (t[t.FORWARDS = 1] = "FORWARDS", t[t.BACKWARDS = 2] = "BACKWARDS", t))(Ke || {});
-class te {
+class ee {
   constructor(e, n) {
     this.start = e, this.end = n;
   }
@@ -121,17 +121,17 @@ class te {
     return o.setStart(e.node, e.offset), o.setEnd(n.node, n.offset), o;
   }
   static fromRange(e) {
-    const n = G.fromPoint(e.startContainer, e.startOffset), o = G.fromPoint(e.endContainer, e.endOffset);
-    return !n || !o ? null : new te(n, o);
+    const n = z.fromPoint(e.startContainer, e.startOffset), o = z.fromPoint(e.endContainer, e.endOffset);
+    return !n || !o ? null : new ee(n, o);
   }
   static fromOffsets(e, n, o) {
-    return new te(new G(e, n), new G(e, o));
+    return new ee(new z(e, n), new z(e, o));
   }
   relativeTo(e) {
-    return new te(this.start.relativeTo(e), this.end.relativeTo(e));
+    return new ee(this.start.relativeTo(e), this.end.relativeTo(e));
   }
 }
-class G {
+class z {
   constructor(e, n) {
     n < 0 && console.error("Offset is invalid"), this.element = e, this.offset = n;
   }
@@ -153,9 +153,9 @@ class G {
   static fromCharOffset(e, n) {
     switch (e.nodeType) {
       case Node.TEXT_NODE:
-        return G.fromPoint(e, n);
+        return z.fromPoint(e, n);
       case Node.ELEMENT_NODE:
-        return new G(e, n);
+        return new z(e, n);
       default:
         return console.error("Node is not an element or text node"), null;
     }
@@ -168,7 +168,7 @@ class G {
         if (!e.parentElement)
           return console.error("Text node has no parent"), null;
         const o = $e(e) + n;
-        return new G(e.parentElement, o);
+        return new z(e.parentElement, o);
       }
       case Node.ELEMENT_NODE: {
         if (n < 0 || n > e.childNodes.length)
@@ -176,7 +176,7 @@ class G {
         let o = 0;
         for (let r = 0; r < n; r++)
           o += Xe(e.childNodes[r]);
-        return new G(e, o);
+        return new z(e, o);
       }
       default:
         return console.error("Point is not in an element or text node"), null;
@@ -188,21 +188,21 @@ class G {
     let n = this.element, o = this.offset;
     for (; n !== e; )
       o += $e(n), n.parentElement && (n = n.parentElement);
-    return new G(n, o);
+    return new z(n, o);
   }
 }
-const Tt = (t) => {
+const vt = (t) => {
   const e = t.nodeName.toLowerCase();
   return e === "#text" ? "text()" : e;
 };
-function vt(t) {
+function Ct(t) {
   let e = 0, n = t;
   for (; n; )
     n.nodeName === t.nodeName && (e += 1), n = n.previousSibling;
   return e;
 }
-const Ct = (t) => {
-  const e = Tt(t), n = vt(t);
+const xt = (t) => {
+  const e = vt(t), n = Ct(t);
   return `${e}[${n}]`;
 }, Be = (t, e) => {
   let n = "", o = t;
@@ -211,43 +211,43 @@ const Ct = (t) => {
       console.error("Node is not a descendant of root");
       return;
     }
-    n = `${Ct(o)}/${n}`, o = o.parentNode;
+    n = `${xt(o)}/${n}`, o = o.parentNode;
   }
   return n = `/${n}`, n = n.replace(/\/$/, ""), n;
-}, It = (t, e, n) => {
+}, kt = (t, e, n) => {
   const o = e.toUpperCase();
   let r = -1;
   for (let s = 0; s < t.children.length; s++) {
-    const a = t.children[s];
-    if (a.nodeName.toUpperCase() === o && (++r, r === n))
-      return a;
+    const l = t.children[s];
+    if (l.nodeName.toUpperCase() === o && (++r, r === n))
+      return l;
   }
   return null;
-}, xt = (t, e) => {
+}, Rt = (t, e) => {
   if (!(t.match(/^(\/[A-Za-z0-9-]+(\[[0-9]+])?)+$/) !== null))
     return console.error("Expression is not a simple XPath"), null;
   const o = t.split("/");
   let r = e;
   o.shift();
   for (const s of o) {
-    let a, l;
-    const g = s.indexOf("[");
-    if (g !== -1) {
-      a = s.slice(0, g);
-      const h = s.slice(g + 1, s.indexOf("]"));
-      if (l = Number.parseInt(h, 10) - 1, l < 0)
+    let l, a;
+    const m = s.indexOf("[");
+    if (m !== -1) {
+      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
-      a = s, l = 0;
-    const d = It(r, a, l);
-    if (!d)
+      l = s, a = 0;
+    const c = kt(r, l, a);
+    if (!c)
       return null;
-    r = d;
+    r = c;
   }
   return r;
 }, He = (t, e = document.body) => {
   try {
-    return xt(t, e);
+    return Rt(t, e);
   } catch {
     return document.evaluate(`.${t}`, e, null, XPathResult.FIRST_ORDERED_NODE_TYPE, null).singleNodeValue;
   }
@@ -268,18 +268,18 @@ class oe {
     const r = He(n.endContainer, e);
     if (!r)
       return console.error("Failed to resolve endContainer XPath"), null;
-    const s = G.fromCharOffset(o, n.startOffset), a = G.fromCharOffset(r, n.endOffset);
-    if (!s || !a)
+    const s = z.fromCharOffset(o, n.startOffset), l = z.fromCharOffset(r, n.endOffset);
+    if (!s || !l)
       return null;
-    const l = new te(s, a).toRange();
-    return l ? new oe(e, l) : null;
+    const a = new ee(s, l).toRange();
+    return a ? new oe(e, a) : null;
   }
   toRange() {
     return this.range;
   }
   toSelector() {
     var s;
-    const e = (s = te.fromRange(this.range)) == null ? void 0 : s.toRange(), n = e && te.fromRange(e), o = n && Be(n.start.element, this.root), r = n && Be(n.end.element, this.root);
+    const e = (s = ee.fromRange(this.range)) == null ? void 0 : s.toRange(), n = e && ee.fromRange(e), o = n && Be(n.start.element, this.root), r = n && Be(n.end.element, this.root);
     return !o || !r ? null : {
       startContainer: o,
       startOffset: n.start.offset,
@@ -288,17 +288,17 @@ class oe {
     };
   }
 }
-class ne {
+class te {
   constructor(e, n, o) {
     this.root = e, this.start = n, this.end = o;
   }
   static fromRange(e, n) {
     var r;
-    const o = (r = te.fromRange(n)) == null ? void 0 : r.relativeTo(e);
-    return o ? new ne(e, o.start.offset, o.end.offset) : null;
+    const o = (r = ee.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 ne(e, n.start, n.end);
+    return new te(e, n.start, n.end);
   }
   toSelector() {
     return {
@@ -307,7 +307,7 @@ class ne {
     };
   }
   toRange() {
-    return te.fromOffsets(this.root, this.start, this.end).toRange();
+    return ee.fromOffsets(this.root, this.start, this.end).toRange();
   }
 }
 const Xe = (t) => {
@@ -327,72 +327,72 @@ const Xe = (t) => {
 }, Qe = (t, ...e) => {
   let n = e.shift();
   const o = t.ownerDocument.createNodeIterator(t, NodeFilter.SHOW_TEXT), r = [];
-  let s = o.nextNode(), a = null, l = 0;
+  let s = o.nextNode(), l = null, a = 0;
   for (; n !== void 0 && s; )
-    a = s, l + a.data.length > n ? (r.push({ node: a, offset: n - l }), n = e.shift()) : (s = o.nextNode(), l += a.data.length);
-  for (; n !== void 0 && a && l === n; )
-    r.push({ node: a, offset: a.data.length }), n = e.shift();
+    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;
-}, kt = (t, e, n, o) => {
+}, wt = (t, e, n, o) => {
   const r = n - e;
-  return Math.abs(r - o) <= 5 ? ne.fromSelector(t, {
+  return Math.abs(r - o) <= 5 ? te.fromSelector(t, {
     start: e,
     end: n
   }) : null;
-}, wt = (t, e, n, o) => {
-  const r = new it();
+}, Ot = (t, e, n, o) => {
+  const r = new at();
   r.Match_Distance = 5e3;
   const s = t.textContent;
   if (!s)
     return null;
   if (e.length > 32) {
-    const a = e.slice(0, 32), l = e.slice(-32), g = o - n;
-    let d = r.match_main(s, a, n);
-    const h = r.match_main(s, l, o), c = h + l.length;
-    if (d === -1 || h === -1)
+    const l = e.slice(0, 32), a = e.slice(-32), m = o - n;
+    let c = r.match_main(s, l, n);
+    const g = r.match_main(s, a, o), d = g + a.length;
+    if (c === -1 || g === -1)
       return null;
-    const S = c - d, p = Math.abs(S - g);
-    if ((d > c || p > 5) && (r.Match_Distance = e.length + 100, d = r.match_main(s, a, c), d !== -1 && d < c))
-      return kt(t, d, c, g);
-    if (d < c && p <= 5)
-      return ne.fromSelector(t, {
-        start: d,
-        end: c
+    const y = d - c, N = Math.abs(y - m);
+    if ((c > d || N > 5) && (r.Match_Distance = e.length + 100, c = r.match_main(s, l, d), c !== -1 && c < d))
+      return wt(t, c, d, m);
+    if (c < d && N <= 5)
+      return te.fromSelector(t, {
+        start: c,
+        end: d
       });
   } else {
-    const a = r.match_main(s, e, n);
-    if (a !== -1)
-      return ne.fromSelector(t, {
-        start: a,
-        end: a + e.length
+    const l = r.match_main(s, e, n);
+    if (l !== -1)
+      return te.fromSelector(t, {
+        start: l,
+        end: l + e.length
       });
   }
   return null;
-}, Ot = (t, e) => {
+}, Lt = (t, e) => {
   if (!e) return null;
   const { highlightData: n } = t, { textPosition: o, selectedText: r } = n;
-  return wt(
+  return Ot(
     e,
     r,
     (o == null ? void 0 : o.start) ?? 0,
     (o == null ? void 0 : o.end) ?? 0
   );
-}, Rt = (t, e, n) => {
+}, At = (t, e, n) => {
   const o = [], r = [];
   for (const s of e) {
-    const a = Ot(s, t);
-    if (a) {
-      const l = a.toRange(), g = l && oe.fromRange(t, l), d = (l == null ? void 0 : l.toString().trim()) || s.highlightData.selectedText;
+    const l = Lt(s, t);
+    if (l) {
+      const a = l.toRange(), m = a && oe.fromRange(t, a), c = (a == null ? void 0 : a.toString().trim()) || s.highlightData.selectedText;
       o.push({
         id: s.id,
         reaction: s.reaction,
         userText: s.userText,
         highlightData: {
           ...s.highlightData,
-          selectedText: d,
+          selectedText: c,
           hasNoHighlightAnymore: !1,
-          range: (g == null ? void 0 : g.toSelector()) ?? null,
-          textPosition: a.toSelector(),
+          range: (m == null ? void 0 : m.toSelector()) ?? null,
+          textPosition: l.toSelector(),
           pageLastModifiedAt: n
         }
       });
@@ -409,61 +409,61 @@ const Xe = (t) => {
       }) : r.push(s.id);
   }
   return { notesForUpdate: o, noteIdsForDelete: r };
-}, Ue = (t, e) => {
-  var a;
+}, je = (t, e) => {
+  var l;
   if (!e) return;
   const { highlightData: n, id: o } = t, { range: r } = n ?? {};
-  r && ((a = oe.fromSelector(e, r)) == null ? void 0 : a.toRange()) && Ut({ id: o });
-}, At = (t) => {
+  r && ((l = oe.fromSelector(e, r)) == null ? void 0 : l.toRange()) && Ut({ id: o });
+}, Pt = (t) => {
   const n = document.querySelector(
     `[data-highlight-id="${CSS.escape(t)}"].highlight-content`
-  ) ?? document.getElementById(ye(t));
+  ) ?? document.getElementById(be(t));
   if (n) {
     const o = n.getBoundingClientRect();
     o.top >= 0 && o.bottom <= (window.innerHeight || document.documentElement.clientHeight) || n.scrollIntoView({ behavior: "smooth", block: "center" });
   }
-}, ue = 90, fe = 172, Lt = (t) => {
+}, me = 90, ge = 172, Dt = (t) => {
   const e = t.getClientRects();
   if (!e.length)
     return null;
-  const n = e[0], o = e[e.length - 1], r = 4, s = 16, a = window.innerWidth || document.documentElement.clientWidth, l = window.innerHeight || document.documentElement.clientHeight, g = (b) => {
-    const y = b + fe;
-    return b >= s && y <= a - s;
-  }, d = (b) => {
-    const y = b + ue;
-    return b >= s && y <= l - s;
+  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 = (h) => {
+    const T = h + ge;
+    return h >= s && T <= l - s;
+  }, c = (h) => {
+    const T = h + me;
+    return h >= s && T <= a - s;
   };
-  let h;
-  const c = n.right - fe;
-  if (g(c))
-    h = c;
+  let g;
+  const d = n.right - ge;
+  if (m(d))
+    g = d;
   else {
-    const b = n.left;
-    if (g(b))
-      h = b;
+    const h = n.left;
+    if (m(h))
+      g = h;
     else {
-      const N = (n.left + n.right) / 2 - fe / 2;
-      g(N) ? h = N : c < s ? h = s : h = a - fe - s;
+      const p = (n.left + n.right) / 2 - ge / 2;
+      m(p) ? g = p : d < s ? g = s : g = l - ge - s;
     }
   }
-  let S;
-  const p = o.bottom + r;
-  if (d(p))
-    S = p;
+  let y;
+  const N = o.bottom + r;
+  if (c(N))
+    y = N;
   else {
-    const b = n.top - ue - r;
-    d(b) ? S = b : p + ue > l - s ? S = l - ue - s : S = s;
+    const h = n.top - me - r;
+    c(h) ? y = h : N + me > a - s ? y = a - me - s : y = s;
   }
-  return { top: S, left: h };
-}, Dt = (t, e) => {
+  return { top: y, left: g };
+}, _t = (t, e) => {
   for (const n of e)
     if (t.start < n.end && t.end > n.start)
       return !0;
   return !1;
-}, Ae = (t) => `highlight-wrapper-${t}`, ye = (t) => `${Ae(t)}-start`, Ye = (t) => `${Ae(t)}-end`, ce = (t) => `[data-highlight-id="${CSS.escape(t)}"]`, Pt = "2px", _t = "3px", Ft = "Notebook note", Le = (t, e) => {
+}, Le = (t) => `highlight-wrapper-${t}`, be = (t) => `${Le(t)}-start`, Ye = (t) => `${Le(t)}-end`, ue = (t) => `[data-highlight-id="${CSS.escape(t)}"]`, Ft = "2px", Mt = "3px", Bt = "Notebook note", Ae = (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})`;
-}, Mt = (t, e) => {
+}, Ht = (t, e) => {
   var n;
   try {
     const o = ((n = e.nodeValue) == null ? void 0 : n.length) ?? e.childNodes.length;
@@ -471,7 +471,7 @@ const Xe = (t) => {
   } catch {
     return !1;
   }
-}, Bt = (t) => {
+}, $t = (t) => {
   var s;
   if (t.collapsed)
     return [];
@@ -481,231 +481,251 @@ const Xe = (t) => {
   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 (!Mt(t, r)) {
+    if (!Ht(t, r)) {
       r = (o == null ? void 0 : o.nextNode()) || null;
       continue;
     }
-    const a = r;
-    if (a === t.startContainer && t.startOffset > 0) {
-      a.splitText(t.startOffset), r = (o == null ? void 0 : o.nextNode()) || null;
+    const l = r;
+    if (l === t.startContainer && t.startOffset > 0) {
+      l.splitText(t.startOffset), r = (o == null ? void 0 : o.nextNode()) || null;
       continue;
     }
-    a === t.endContainer && t.endOffset < a.data.length && a.splitText(t.endOffset), n.push(a), r = (o == null ? void 0 : o.nextNode()) || null;
+    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;
-}, Ht = (t, e, n) => {
+}, jt = (t, e, n) => {
   if (t.collapsed) return;
-  const o = e.id ?? "", r = Ae(o);
-  if (document.getElementById(ye(o))) {
-    $t(e, n);
+  const o = e.id ?? "", r = Le(o);
+  if (document.getElementById(be(o))) {
+    Gt(e, n);
     return;
   }
-  const a = e.type === x.IMPORTANT ? n.colors.importantBackground : n.colors.confusingBackground, l = e.id === e.selectedNoteId, g = l ? a : Le(a, 0.5), d = e.type === x.IMPORTANT ? n.colors.importantUnderline : n.colors.confusingUnderline, h = e.type === x.IMPORTANT ? "solid" : "dashed", c = document.createElement("span");
-  c.id = `${r}-start`, c.className = "highlight-marker-start", c.dataset.highlightId = o || "";
-  const S = e.labelPrefix ?? Ft;
-  c.setAttribute("role", "button"), c.setAttribute("tabindex", "0"), c.setAttribute("aria-label", S), c.setAttribute("aria-haspopup", "dialog"), c.setAttribute("aria-expanded", String(l && !!e.isTrayOpen)), e.popupId && c.setAttribute("aria-controls", e.popupId), c.style.position = "relative", c.style.fontSize = "0", c.style.lineHeight = "0", c.style.width = "0", c.style.height = "0", c.style.margin = "0", c.style.padding = "0", c.style.border = "0", c.style.outline = "none";
-  const p = document.createElement("span");
-  p.id = Ye(o), p.className = "highlight-marker-end", p.dataset.highlightId = o || "";
-  const b = t.cloneRange();
-  b.collapse(!1), b.insertNode(p);
-  const y = t.cloneRange();
-  y.collapse(!0), y.insertNode(c);
-  const N = document.createRange();
-  N.setStartAfter(c), N.setEndBefore(p);
-  const O = Bt(N).filter((m) => m.textContent && m.textContent.length > 0);
-  O.forEach((m, E) => {
-    var W;
-    const I = m.parentElement;
-    if ((I == null ? void 0 : I.dataset.highlightId) === o) return;
-    const L = E === 0, F = E === O.length - 1, z = O.length === 1;
-    let B;
-    z ? B = "single" : L ? B = "first" : F ? B = "last" : B = "middle";
+  const l = e.type === L.IMPORTANT ? n.colors.importantBackground : n.colors.confusingBackground, a = e.id === e.selectedNoteId, m = a ? l : Ae(l, 0.5), c = e.type === L.IMPORTANT ? n.colors.importantUnderline : n.colors.confusingUnderline, g = e.type === L.IMPORTANT ? "solid" : "dashed", d = document.createElement("span");
+  d.id = `${r}-start`, d.className = "highlight-marker-start", d.dataset.highlightId = o || "";
+  const y = e.labelPrefix ?? Bt;
+  d.setAttribute("role", "button"), d.setAttribute("tabindex", "0"), d.setAttribute("aria-label", y), d.setAttribute("aria-haspopup", "dialog"), d.setAttribute("aria-expanded", String(a && !!e.isTrayOpen)), e.popupId && d.setAttribute("aria-controls", e.popupId), d.style.position = "relative", d.style.fontSize = "0", d.style.lineHeight = "0", d.style.width = "0", d.style.height = "0", d.style.margin = "0", d.style.padding = "0", d.style.border = "0", d.style.outline = "none";
+  const N = document.createElement("span");
+  N.id = Ye(o), N.className = "highlight-marker-end", N.dataset.highlightId = o || "";
+  const h = t.cloneRange();
+  h.collapse(!1), h.insertNode(N);
+  const T = t.cloneRange();
+  T.collapse(!0), T.insertNode(d);
+  const p = document.createRange();
+  p.setStartAfter(d), p.setEndBefore(N);
+  const M = $t(p).filter((b) => b.textContent && b.textContent.length > 0);
+  M.forEach((b, v) => {
+    var $;
+    const B = b.parentElement;
+    if ((B == null ? void 0 : B.dataset.highlightId) === o) return;
+    const F = v === 0, E = v === M.length - 1, A = M.length === 1;
+    let R;
+    A ? R = "single" : F ? R = "first" : E ? R = "last" : R = "middle";
     const k = document.createElement("span");
-    k.className = "highlight-content", k.dataset.highlightId = o || "", k.dataset.position = B, k.style.backgroundColor = g, k.style.textDecorationLine = "underline", k.style.textDecorationColor = d, k.style.textDecorationStyle = h, k.style.textDecorationThickness = n.borderWidthSmall, k.style.textUnderlineOffset = n.underlineOffset, k.style.cursor = "pointer", k.addEventListener("click", (X) => {
-      var H;
-      X.target.tagName !== "A" && ((H = e.onClick) == null || H.call(e));
-    }), (W = m.parentNode) == null || W.insertBefore(k, m), k.appendChild(m);
-  }), c.addEventListener("click", (m) => {
-    var E;
-    m.target.tagName !== "A" && ((E = e.onClick) == null || E.call(e));
-  }), c.addEventListener("keydown", (m) => {
-    var E;
-    if (m.key === "Enter" || m.key === " ")
-      m.preventDefault(), (E = e.onClick) == null || E.call(e);
-    else if (m.key === "Tab" && !m.shiftKey) {
-      const I = document.querySelectorAll(ce(o));
-      for (const L of I) {
-        const F = L.querySelector("a");
-        if (F) {
-          m.preventDefault(), F.focus();
+    k.className = "highlight-content", k.dataset.highlightId = o || "", k.dataset.position = R, k.style.backgroundColor = m, k.style.textDecorationLine = "underline", k.style.textDecorationColor = c, k.style.textDecorationStyle = g, k.style.textDecorationThickness = n.borderWidthSmall, k.style.textUnderlineOffset = n.underlineOffset, k.style.cursor = "pointer", k.addEventListener("click", (Q) => {
+      var K;
+      Q.target.tagName !== "A" && ((K = e.onClick) == null || K.call(e));
+    }), ($ = b.parentNode) == null || $.insertBefore(k, b), k.appendChild(b);
+  }), d.addEventListener("click", (b) => {
+    var v;
+    b.target.tagName !== "A" && ((v = e.onClick) == null || v.call(e));
+  }), d.addEventListener("keydown", (b) => {
+    var v;
+    if (b.key === "Enter" || b.key === " ")
+      b.preventDefault(), (v = e.onClick) == null || v.call(e);
+    else if (b.key === "Tab" && !b.shiftKey) {
+      const B = document.querySelectorAll(ue(o));
+      for (const F of B) {
+        const E = F.querySelector("a");
+        if (E) {
+          b.preventDefault(), E.focus();
           break;
         }
       }
     }
-  }), c.addEventListener("focus", () => {
+  }), d.addEventListener("focus", () => {
     document.querySelectorAll(
-      `.highlight-content${ce(o)}`
-    ).forEach((E) => {
-      E.style.boxShadow = `0 0 0 ${Pt} ${n.colors.focusOutline}`, E.style.borderRadius = _t;
+      `.highlight-content${ue(o)}`
+    ).forEach((v) => {
+      v.style.boxShadow = `0 0 0 ${Ft} ${n.colors.focusOutline}`, v.style.borderRadius = Mt;
     });
-  }), c.addEventListener("blur", () => {
+  }), d.addEventListener("blur", () => {
     document.querySelectorAll(
-      `.highlight-content${ce(o)}`
-    ).forEach((E) => {
-      E.style.boxShadow = "", E.style.borderRadius = "";
+      `.highlight-content${ue(o)}`
+    ).forEach((v) => {
+      v.style.boxShadow = "", v.style.borderRadius = "";
     });
   });
 };
-function $t(t, e) {
-  const n = t.type === x.IMPORTANT ? e.colors.importantBackground : e.colors.confusingBackground, o = t.id === t.selectedNoteId, r = o ? n : Le(n, 0.5);
+function Gt(t, e) {
+  const n = t.type === L.IMPORTANT ? e.colors.importantBackground : e.colors.confusingBackground, o = t.id === t.selectedNoteId, r = o ? n : Ae(n, 0.5);
   document.querySelectorAll(
-    ce(t.id ?? "")
-  ).forEach((l) => {
-    l.style.backgroundColor = r;
+    ue(t.id ?? "")
+  ).forEach((a) => {
+    a.style.backgroundColor = r;
   });
-  const a = document.getElementById(
-    ye(t.id ?? "")
+  const l = document.getElementById(
+    be(t.id ?? "")
   );
-  a && a.setAttribute("aria-expanded", String(o && !!t.isTrayOpen));
+  l && l.setAttribute("aria-expanded", String(o && !!t.isTrayOpen));
 }
 const Ut = (t) => {
-  const e = t.id ?? "", n = document.getElementById(ye(e)), o = document.getElementById(Ye(e));
+  const e = t.id ?? "", n = document.getElementById(be(e)), o = document.getElementById(Ye(e));
   document.querySelectorAll(
-    ce(e)
+    ue(e)
   ).forEach((s) => {
-    var a;
+    var l;
     for (; s.firstChild; )
-      (a = s.parentNode) == null || a.insertBefore(s.firstChild, s);
+      (l = s.parentNode) == null || l.insertBefore(s.firstChild, s);
     s.remove();
   }), n == null || n.remove(), o == null || o.remove();
-}, ae = {
+}, ce = {
   all: ["notebook"],
   notes: (t) => ["notebook", "notes", t]
 };
-function Gt(t) {
-  const e = Ie();
+function zt(t) {
+  const e = Ce();
   return xe({
     mutationFn: (n) => t.createNote(n),
     onSuccess: () => {
-      e.invalidateQueries({ queryKey: ae.all });
+      e.invalidateQueries({ queryKey: ce.all });
     }
   });
 }
-function jt(t) {
-  const e = Ie();
+function Wt(t) {
+  const e = Ce();
   return xe({
     mutationFn: (n) => t.deleteNote(n),
     onSuccess: () => {
-      e.invalidateQueries({ queryKey: ae.all });
+      e.invalidateQueries({ queryKey: ce.all });
     }
   });
 }
-function ve({
+function Ve({
   api: t,
   enabled: e = !0,
   ...n
 }) {
-  return at({
-    queryKey: ae.notes(n),
+  return ct({
+    queryKey: ce.notes(n),
     queryFn: () => t.getNotes(n),
     enabled: e
   });
 }
-function zt(t) {
-  const e = Ie();
+const qt = 100;
+function Ze({
+  api: t,
+  courseId: e,
+  learningObject: n,
+  reactions: o,
+  enabled: r = !0
+}) {
+  return Ve({
+    api: t,
+    filter: {
+      ...e ? { courseId: e } : {},
+      ...n ? { learningObject: n } : {},
+      ...o != null && o.length ? { reactions: o } : {}
+    },
+    offset: 0,
+    pageSize: qt,
+    enabled: r
+  });
+}
+function Kt(t) {
+  const e = Ce();
   return xe({
     mutationFn: ({ id: n, input: o }) => t.updateNote(n, o),
     onMutate: async ({ id: n, input: o }) => {
-      await e.cancelQueries({ queryKey: ae.all });
-      const s = e.getQueryCache().findAll({ queryKey: ae.all }), a = /* @__PURE__ */ new Map();
-      for (const l of s) {
-        const g = l.state.data;
-        g && (a.set(l.queryKey, g), e.setQueryData(l.queryKey, {
-          ...g,
-          notes: g.notes.map(
-            (d) => d.id === n ? { ...d, ...o, updatedAt: (/* @__PURE__ */ new Date()).toISOString() } : d
+      await e.cancelQueries({ queryKey: ce.all });
+      const s = e.getQueryCache().findAll({ queryKey: ce.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,
+          notes: m.notes.map(
+            (c) => c.id === n ? { ...c, ...o, updatedAt: (/* @__PURE__ */ new Date()).toISOString() } : c
           )
         }));
       }
-      return { previousData: a };
+      return { previousData: l };
     },
     onError: (n, o, r) => {
       if (r != null && r.previousData)
-        for (const [s, a] of r.previousData)
-          e.setQueryData(s, a);
+        for (const [s, l] of r.previousData)
+          e.setQueryData(s, l);
     },
     onSettled: () => {
-      e.invalidateQueries({ queryKey: ae.all });
+      e.invalidateQueries({ queryKey: ce.all });
     }
   });
 }
-const Wt = "Notebook", qt = "Notes", Kt = "Important", Xt = "Unclear", Qt = "Back", Yt = "Edit note", Vt = "Save", Zt = "Cancel", Jt = "Delete note", en = "note", tn = "Add note (optional)", nn = "Remove from Notebook", on = "Add a note (optional)", rn = "Mark important", sn = "Mark unclear", an = "Saved to Notebook.", ln = "Note updated", cn = "Note deleted", dn = "Error saving to Notebook.", un = "Error updating note", fn = "Note deletion failed", mn = "Loading notes", gn = "Failed to load notes", hn = "Start capturing your notes", pn = "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.", Nn = "Nothing here yet", yn = "Adjust your filters or create a new note to get started.", bn = "You have no notes for the selected filter", En = "Filter", Sn = "Previous page", Tn = "Next page", vn = "All courses", Cn = "All notes", In = "Close Notebook panel", xn = "To use the Notebook feature, highlight an excerpt from your learning material to flag it as 'confusing' or 'important' and leave an optional note.", kn = "The content you highlighted is no longer available.", wn = "Notebook note", De = {
-  notebook: Wt,
-  notes: qt,
-  important: Kt,
-  unclear: Xt,
-  back: Qt,
-  editNote: Yt,
-  save: Vt,
-  cancel: Zt,
-  deleteNote: Jt,
-  note: en,
-  addNotePrompt: tn,
-  removeFromNotebook: nn,
-  addNoteOptional: on,
-  markImportant: rn,
-  markUnclear: sn,
-  savedToNotebook: an,
-  noteUpdated: ln,
-  noteDeleted: cn,
-  errorSavingNote: dn,
-  errorUpdatingNote: un,
-  noteDeletionFailed: fn,
-  loadingNotes: mn,
-  failedToLoadNotes: gn,
-  emptyStateHeading: hn,
-  emptyStateDescription: pn,
-  nothingHereYet: Nn,
-  adjustFiltersOrCreate: yn,
-  noNotesForFilter: bn,
-  filter: En,
-  previousPage: Sn,
-  nextPage: Tn,
-  allCourses: vn,
-  allNotes: Cn,
-  closeNotebookPanel: In,
-  featureDescription: xn,
-  highlightUnavailable: kn,
-  notebookNote: wn
-}, Ve = je(null);
-function Ze(t, e) {
-  const n = De[t] ?? t;
+const Xt = "Notebook", Qt = "Notes", Yt = "Important", Vt = "Unclear", Zt = "Back", Jt = "Edit note", en = "Save", tn = "Cancel", nn = "Delete note", on = "note", rn = "Add note (optional)", sn = "Remove from Notebook", ln = "Add a note (optional)", an = "Mark important", cn = "Mark unclear", dn = "Saved to Notebook.", un = "Note updated", fn = "Note deleted", mn = "Error saving to Notebook.", gn = "Error updating note", hn = "Note deletion failed", pn = "Loading notes", Nn = "Failed to load notes", yn = "Start capturing your notes", bn = "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.", En = "Nothing here yet", Sn = "Adjust your filters or create a new note to get started.", Tn = "You have no notes for the selected filter", In = "Filter", vn = "Previous page", Cn = "Next page", xn = "All courses", kn = "All notes", Rn = "Close Notebook panel", wn = "To use the Notebook feature, highlight an excerpt from your learning material to flag it as 'confusing' or 'important' and leave an optional note.", On = "The content you highlighted is no longer available.", Ln = "Notebook note", Pe = {
+  notebook: Xt,
+  notes: Qt,
+  important: Yt,
+  unclear: Vt,
+  back: Zt,
+  editNote: Jt,
+  save: en,
+  cancel: tn,
+  deleteNote: nn,
+  note: on,
+  addNotePrompt: rn,
+  removeFromNotebook: sn,
+  addNoteOptional: ln,
+  markImportant: an,
+  markUnclear: cn,
+  savedToNotebook: dn,
+  noteUpdated: un,
+  noteDeleted: fn,
+  errorSavingNote: mn,
+  errorUpdatingNote: gn,
+  noteDeletionFailed: hn,
+  loadingNotes: pn,
+  failedToLoadNotes: Nn,
+  emptyStateHeading: yn,
+  emptyStateDescription: bn,
+  nothingHereYet: En,
+  adjustFiltersOrCreate: Sn,
+  noNotesForFilter: Tn,
+  filter: In,
+  previousPage: vn,
+  nextPage: Cn,
+  allCourses: xn,
+  allNotes: kn,
+  closeNotebookPanel: Rn,
+  featureDescription: wn,
+  highlightUnavailable: On,
+  notebookNote: Ln
+}, Je = Ue(null);
+function et(t, e) {
+  const n = Pe[t] ?? t;
   return e ? n.replace(/%\{([^}]+)}/g, (o, r) => String(e[r] ?? `%{${r}}`)) : n;
 }
-function On({
+function An({
   translations: t,
   translate: e,
   children: n
 }) {
-  const o = ge(
+  const o = fe(
     () => ({
-      translations: { ...De, ...t },
-      translate: e ?? Ze
+      translations: { ...Pe, ...t },
+      translate: e ?? et
     }),
     [t, e]
   );
-  return /* @__PURE__ */ i(Ve.Provider, { value: o, children: n });
+  return /* @__PURE__ */ i(Je.Provider, { value: o, children: n });
 }
-function Z() {
-  const t = ze(Ve);
-  return t || { translations: De, translate: Ze };
+function Y() {
+  const t = ze(Je);
+  return t || { translations: Pe, translate: et };
 }
-const Rn = (t) => ({
+const Pn = (t) => ({
   selectedNoteId: t ?? null,
   isNoteEditing: !1,
   isTrayOpen: t != null
 });
-function An(t, e) {
+function Dn(t, e) {
   switch (e.type) {
     case "SELECT_NOTE":
       return {
@@ -725,22 +745,22 @@ function An(t, e) {
       return t;
   }
 }
-const Je = je(null);
-function lo({
+const tt = Ue(null);
+function uo({
   api: t,
   currentUserId: e,
   objectId: n,
   objectType: o,
   courseId: r,
   pageLastModifiedAt: s,
-  onAnalyticsEvent: a,
-  onOpen: l,
-  initialNoteId: g,
-  translations: d,
-  translate: h,
-  children: c
+  onAnalyticsEvent: l,
+  onOpen: a,
+  initialNoteId: m,
+  translations: c,
+  translate: g,
+  children: d
 }) {
-  const [S, p] = We(An, Rn(g)), b = K(g != null), y = ge(
+  const [y, N] = We(Dn, Pn(m)), h = _(m != null), T = fe(
     () => ({
       api: t,
       currentUserId: e,
@@ -748,16 +768,16 @@ function lo({
       objectType: o,
       courseId: r,
       pageLastModifiedAt: s,
-      onAnalyticsEvent: a,
-      ...S,
-      selectNote: (N, _ = !1) => p({ type: "SELECT_NOTE", payload: { id: N, isEditing: _ } }),
-      clearSelectedNote: () => p({ type: "CLEAR_SELECTED_NOTE" }),
-      setEditing: (N) => p({ type: "SET_EDITING", payload: N }),
+      onAnalyticsEvent: l,
+      ...y,
+      selectNote: (p, G = !1) => N({ type: "SELECT_NOTE", payload: { id: p, isEditing: G } }),
+      clearSelectedNote: () => N({ type: "CLEAR_SELECTED_NOTE" }),
+      setEditing: (p) => N({ type: "SET_EDITING", payload: p }),
       openTray: () => {
-        b.current || (b.current = !0, l == null || l()), p({ type: "OPEN_TRAY" });
+        h.current || (h.current = !0, a == null || a()), N({ type: "OPEN_TRAY" });
       },
       closeTray: () => {
-        b.current = !1, p({ type: "CLOSE_TRAY" });
+        h.current = !1, N({ type: "CLOSE_TRAY" });
       }
     }),
     [
@@ -767,34 +787,34 @@ function lo({
       o,
       r,
       s,
-      a,
       l,
-      S
+      a,
+      y
     ]
   );
-  return /* @__PURE__ */ i(Je.Provider, { value: y, children: /* @__PURE__ */ i(On, { translations: d, translate: h, children: c }) });
+  return /* @__PURE__ */ i(tt.Provider, { value: T, children: /* @__PURE__ */ i(An, { translations: c, translate: g, children: d }) });
 }
-function et() {
-  const t = ze(Je);
+function nt() {
+  const t = ze(tt);
   if (!t)
     throw new Error("useNotebook must be used within a NotebookProvider");
   return t;
 }
-const tt = "notebook-tray-content", co = ({ children: t }) => {
-  const { isTrayOpen: e, closeTray: n } = et(), { translations: o } = Z();
+const ot = "notebook-tray-content", fo = ({ children: t }) => {
+  const { isTrayOpen: e, closeTray: n } = nt(), { translations: o } = Y();
   return /* @__PURE__ */ i(
-    ct,
+    ut,
     {
       label: o.notebook,
       open: e,
       onDismiss: n,
       placement: "end",
       size: "regular",
-      children: /* @__PURE__ */ T(v, { direction: "column", height: "100vh", id: tt, children: [
-        /* @__PURE__ */ i(v.Item, { children: /* @__PURE__ */ i(j, { as: "div", padding: "small medium", borderWidth: "0 0 small 0", children: /* @__PURE__ */ T(v, { justifyItems: "space-between", alignItems: "center", children: [
-          /* @__PURE__ */ i(pe, { level: "h3", children: o.notebook }),
+      children: /* @__PURE__ */ C(x, { direction: "column", height: "100vh", id: ot, children: [
+        /* @__PURE__ */ i(x.Item, { children: /* @__PURE__ */ i(q, { as: "div", padding: "small medium", borderWidth: "0 0 small 0", children: /* @__PURE__ */ C(x, { justifyItems: "space-between", alignItems: "center", children: [
+          /* @__PURE__ */ i(Ne, { level: "h3", children: o.notebook }),
           /* @__PURE__ */ i(
-            lt,
+            dt,
             {
               screenReaderLabel: o.closeNotebookPanel,
               onClick: n,
@@ -803,16 +823,16 @@ const tt = "notebook-tray-content", co = ({ children: t }) => {
             }
           )
         ] }) }) }),
-        /* @__PURE__ */ i(v.Item, { shouldGrow: !0, shouldShrink: !0, overflowY: "auto", overflowX: "hidden", children: t })
+        /* @__PURE__ */ i(x.Item, { shouldGrow: !0, shouldShrink: !0, overflowY: "auto", overflowX: "hidden", children: t })
       ] })
     }
   );
-}, Ln = ({ currentType: t, onSelectReaction: e }) => {
-  const { translations: n } = Z(), o = K(null), r = K(null);
-  return V(() => {
-    t === x.CONFUSING && o.current ? o.current.focus() : t === x.IMPORTANT && r.current ? r.current.focus() : o.current && o.current.focus();
+}, _n = ({ currentType: t, onSelectReaction: e }) => {
+  const { translations: n } = Y(), o = _(null), r = _(null);
+  return W(() => {
+    t === L.CONFUSING && o.current ? o.current.focus() : t === L.IMPORTANT && r.current ? r.current.focus() : o.current && o.current.focus();
   }, [t]), /* @__PURE__ */ i(
-    j,
+    q,
     {
       as: "div",
       background: "primary",
@@ -820,25 +840,25 @@ const tt = "notebook-tray-content", co = ({ children: t }) => {
       borderColor: "secondary",
       borderRadius: "medium",
       shadow: "resting",
-      children: /* @__PURE__ */ T(ie, { children: [
-        /* @__PURE__ */ T(
-          ie.Item,
+      children: /* @__PURE__ */ C(ae, { children: [
+        /* @__PURE__ */ C(
+          ae.Item,
           {
             ref: o,
-            onClick: () => e(x.CONFUSING),
+            onClick: () => e(L.CONFUSING),
             children: [
               /* @__PURE__ */ i(ke, { size: "x-small" }),
               ` ${n.markUnclear}`
             ]
           }
         ),
-        /* @__PURE__ */ T(
-          ie.Item,
+        /* @__PURE__ */ C(
+          ae.Item,
           {
             ref: r,
-            onClick: () => e(x.IMPORTANT),
+            onClick: () => e(L.IMPORTANT),
             children: [
-              /* @__PURE__ */ i(we, { size: "x-small" }),
+              /* @__PURE__ */ i(Re, { size: "x-small" }),
               ` ${n.markImportant}`
             ]
           }
@@ -846,8 +866,8 @@ const tt = "notebook-tray-content", co = ({ children: t }) => {
       ] })
     }
   );
-}, be = "notebook-inline-reaction-menu";
-function uo({
+}, Ee = "notebook-inline-reaction-menu";
+function mo({
   containerRef: t,
   highlightTheme: e,
   debounceTime: n = 500,
@@ -856,199 +876,198 @@ function uo({
   onDeleteError: s
 }) {
   const {
-    api: a,
-    objectId: l,
-    objectType: g,
-    courseId: d,
-    pageLastModifiedAt: h,
-    selectedNoteId: c,
-    isTrayOpen: S,
-    selectNote: p,
-    openTray: b
-  } = et(), { translations: y } = Z(), { data: N } = ve({
-    api: a,
-    filter: {
-      learningObject: { type: g, id: l }
-    },
-    courseId: d,
-    pageSize: 100
-  }), { mutate: _ } = Gt(a), { mutateAsync: O } = zt(a), { mutate: m } = jt(a), E = K([]), [I, L] = U([]), [F, z] = U(null), [B, k] = U(""), [W, X] = U(null), [H, $] = U(!1);
-  V(() => {
-    const R = t.current;
-    if (!R) return;
-    const f = R.closest(".user_content") ?? R;
-    if (f.classList.contains("enhanced")) {
-      $(!0);
+    api: l,
+    objectId: a,
+    objectType: m,
+    courseId: c,
+    pageLastModifiedAt: g,
+    selectedNoteId: d,
+    isTrayOpen: y,
+    selectNote: N,
+    openTray: h
+  } = nt(), { translations: T } = Y(), { data: p } = Ze({
+    api: l,
+    courseId: c,
+    learningObject: { type: m, id: a }
+  }), { mutate: G } = zt(l), { mutateAsync: M } = Kt(l), { mutate: b } = Wt(l), v = _([]), [B, F] = j([]), [E, A] = j(null), [R, k] = j(""), [$, Q] = j(null), K = _(null);
+  K.current = $;
+  const [V, ne] = j(!1);
+  W(() => {
+    const S = t.current;
+    if (!S) return;
+    const I = S.closest(".user_content") ?? S;
+    if (I.classList.contains("enhanced")) {
+      ne(!0);
       return;
     }
-    const w = new MutationObserver((D) => {
-      for (const M of D)
-        if (M.type === "attributes" && M.attributeName === "class" && M.target.classList.contains("enhanced")) {
-          $(!0), w.disconnect();
+    const P = new MutationObserver((f) => {
+      for (const O of f)
+        if (O.type === "attributes" && O.attributeName === "class" && O.target.classList.contains("enhanced")) {
+          ne(!0), P.disconnect();
           return;
         }
     });
-    return w.observe(f, { attributes: !0, attributeFilter: ["class"] }), () => w.disconnect();
+    return P.observe(I, { attributes: !0, attributeFilter: ["class"] }), () => P.disconnect();
   }, [t]);
-  const q = Y(() => {
-    X(null), z(null), k("");
+  const U = X(() => {
+    Q(null), A(null), k("");
   }, []);
-  V(() => {
-    if (!H || !t.current) return;
-    let f = null;
-    const w = () => {
-      f && clearTimeout(f), f = setTimeout(() => {
+  W(() => {
+    if (!V || !t.current) return;
+    let I = null;
+    const P = () => {
+      I && clearTimeout(I), I = setTimeout(() => {
         var _e;
-        const C = window.getSelection(), P = t.current;
-        if (!(C != null && C.rangeCount) || !P) return;
-        const re = C.toString().trim();
-        if (re === "") return;
-        const se = C.getRangeAt(0);
-        if (!P.contains(se.commonAncestorContainer)) return;
-        const Pe = (_e = ne.fromRange(P, se)) == null ? void 0 : _e.toSelector();
-        Pe && !Dt(Pe, I) && (z(se.cloneRange()), k(re), X(Lt(se)));
+        const w = window.getSelection(), H = t.current;
+        if (!(w != null && w.rangeCount) || !H) return;
+        const ie = w.toString().trim();
+        if (ie === "") return;
+        const le = w.getRangeAt(0);
+        if (!H.contains(le.commonAncestorContainer)) return;
+        const De = (_e = te.fromRange(H, le)) == null ? void 0 : _e.toSelector();
+        De && !_t(De, B) && (A(le.cloneRange()), k(ie), Q(Dt(le)));
       }, n);
-    }, D = (C) => {
-      if (!(C.target instanceof Node)) return;
-      const P = document.getElementById(be);
-      P != null && P.contains(C.target) ? (C.preventDefault(), C.stopImmediatePropagation()) : q();
-    }, M = () => {
-      q();
-    }, A = (C) => {
-      C.key === "Escape" && q();
+    }, f = (w) => {
+      if (!(w.target instanceof Node)) return;
+      const H = document.getElementById(Ee);
+      H != null && H.contains(w.target) ? (w.preventDefault(), w.stopImmediatePropagation()) : U();
+    }, O = () => {
+      U();
+    }, D = (w) => {
+      w.key === "Escape" && K.current !== null && (U(), w.stopImmediatePropagation());
     };
-    return document.addEventListener("selectionchange", w), document.addEventListener("mousedown", D), document.addEventListener("touchstart", D), document.addEventListener("keydown", A), window.addEventListener("scroll", M, !0), () => {
-      f && clearTimeout(f), document.removeEventListener("selectionchange", w), document.removeEventListener("mousedown", D), document.removeEventListener("touchstart", D), document.removeEventListener("keydown", A), window.removeEventListener("scroll", M, !0);
+    return document.addEventListener("selectionchange", P), document.addEventListener("mousedown", f), document.addEventListener("touchstart", f), document.addEventListener("keydown", D), window.addEventListener("scroll", O, !0), () => {
+      I && clearTimeout(I), document.removeEventListener("selectionchange", P), document.removeEventListener("mousedown", f), document.removeEventListener("touchstart", f), document.removeEventListener("keydown", D), window.removeEventListener("scroll", O, !0);
     };
-  }, [H, I, n, t, q]);
-  const Q = Y(
-    (R) => {
-      var P;
-      const f = t.current;
-      if (!f || !R.highlightData) return null;
-      const { highlightData: w, reaction: D, id: M } = R, { range: A } = w, C = A && ((P = oe.fromSelector(f, A)) == null ? void 0 : P.toRange());
-      if (C) {
-        const re = D[0] === x.IMPORTANT ? y.important : y.unclear, se = {
-          id: M,
-          selectedNoteId: c,
-          type: D[0],
-          isTrayOpen: S,
-          labelPrefix: `${y.notebookNote} (${re})`,
-          popupId: tt,
+  }, [V, B, n, t, U]);
+  const re = X(
+    (S) => {
+      var H;
+      const I = t.current;
+      if (!I || !S.highlightData) return null;
+      const { highlightData: P, reaction: f, id: O } = S, { range: D } = P, w = D && ((H = oe.fromSelector(I, D)) == null ? void 0 : H.toRange());
+      if (w) {
+        const ie = f[0] === L.IMPORTANT ? T.important : T.unclear, le = {
+          id: O,
+          selectedNoteId: d,
+          type: f[0],
+          isTrayOpen: y,
+          labelPrefix: `${T.notebookNote} (${ie})`,
+          popupId: ot,
           onClick: () => {
-            p(M), b();
+            N(O), h();
           }
         };
-        return Ht(C, se, e), w.textPosition;
+        return jt(w, le, e), P.textPosition;
       }
       return null;
     },
-    [t, c, S, e, y, p, b]
+    [t, d, y, e, T, N, h]
   );
-  V(() => {
-    if (!H || !N || !t.current) return;
-    const R = t.current, f = N.notes, w = /* @__PURE__ */ new Set(), D = [], M = [];
-    if (f.length === 0) {
-      if (E.current.length > 0) {
-        for (const A of E.current)
-          Ue(A, R);
-        E.current = [], L([]);
+  W(() => {
+    if (!V || !p || !t.current) return;
+    const S = t.current, I = p.notes, P = /* @__PURE__ */ new Set(), f = [], O = [];
+    if (I.length === 0) {
+      if (v.current.length > 0) {
+        for (const D of v.current)
+          je(D, S);
+        v.current = [], F([]);
       }
       return;
     }
-    if (h && f[0].highlightData.pageLastModifiedAt !== h) {
-      const { notesForUpdate: A, noteIdsForDelete: C } = Rt(
-        R,
-        f,
-        h
+    if (g && I[0].highlightData.pageLastModifiedAt !== g) {
+      const { notesForUpdate: D, noteIdsForDelete: w } = At(
+        S,
+        I,
+        g
       );
-      for (const P of A)
-        O({ id: P.id, input: P }).catch((re) => r == null ? void 0 : r(re));
-      for (const P of C)
-        m(P, { onError: s });
+      for (const H of D)
+        M({ id: H.id, input: H }).catch((ie) => r == null ? void 0 : r(ie));
+      for (const H of w)
+        b(H, { onError: s });
     } else {
-      for (const A of f) {
-        const C = Q(A);
-        w.add(A.id), C && (D.push(A), M.push(C));
+      for (const D of I) {
+        const w = re(D);
+        P.add(D.id), w && (f.push(D), O.push(w));
       }
-      for (const A of E.current)
-        w.has(A.id) || Ue(A, R);
-      L(M), E.current = D, c && At(c);
+      for (const D of v.current)
+        P.has(D.id) || je(D, S);
+      F(O), v.current = f, d && Pt(d);
     }
   }, [
-    H,
-    N,
-    Q,
-    h,
+    V,
+    p,
+    re,
+    g,
     t,
-    O,
-    m,
-    c
+    M,
+    b,
+    d
   ]);
-  const de = (R) => {
-    const f = t.current;
-    if (!F || !f) return;
-    const w = oe.fromRange(f, F), D = ne.fromRange(f, F);
-    _(
+  const se = (S) => {
+    const I = t.current;
+    if (!E || !I) return;
+    const P = oe.fromRange(I, E), f = te.fromRange(I, E);
+    G(
       {
-        courseId: d,
-        objectId: l,
-        objectType: g,
+        courseId: c,
+        objectId: a,
+        objectType: m,
         userText: "",
-        reaction: [R],
+        reaction: [S],
         highlightData: {
-          selectedText: B,
-          textPosition: (D == null ? void 0 : D.toSelector()) ?? null,
-          range: w.toSelector(),
-          pageLastModifiedAt: h ?? ""
+          selectedText: R,
+          textPosition: (f == null ? void 0 : f.toSelector()) ?? null,
+          range: P.toSelector(),
+          pageLastModifiedAt: g ?? ""
         }
       },
       {
-        onSuccess: (M) => {
-          var C;
-          const A = M.id;
-          q(), (C = window.getSelection()) == null || C.removeAllRanges(), p(A), b();
+        onSuccess: (O) => {
+          var w;
+          const D = O.id;
+          U(), (w = window.getSelection()) == null || w.removeAllRanges(), N(D), h();
         },
         onError: o
       }
     );
   };
-  return !F || !W ? null : st(
+  return !E || !$ ? null : lt(
     /* @__PURE__ */ i(
       "div",
       {
-        id: be,
+        id: Ee,
         role: "toolbar",
         style: {
           position: "fixed",
           zIndex: 100,
-          top: W.top,
-          left: W.left,
+          top: $.top,
+          left: $.left,
           whiteSpace: "nowrap"
         },
-        onBlur: (R) => {
-          const f = document.getElementById(be);
-          f != null && f.contains(R.relatedTarget) || q();
+        onBlur: (S) => {
+          const I = document.getElementById(Ee);
+          I != null && I.contains(S.relatedTarget) || U();
         },
-        children: /* @__PURE__ */ i(Ln, { onSelectReaction: de })
+        children: /* @__PURE__ */ i(_n, { onSelectReaction: se })
       }
     ),
     document.body
   );
 }
-const Dn = (t, e) => ({
-  backgroundColor: t === x.IMPORTANT ? e.colors.importantBackground : e.colors.confusingBackground,
-  underlineColor: t === x.IMPORTANT ? e.colors.importantUnderline : e.colors.confusingUnderline,
-  underlineStyle: t === x.IMPORTANT ? "solid" : "dashed"
-}), Ce = ({
+const Fn = (t, e) => ({
+  backgroundColor: t === L.IMPORTANT ? e.colors.importantBackground : e.colors.confusingBackground,
+  underlineColor: t === L.IMPORTANT ? e.colors.importantUnderline : e.colors.confusingUnderline,
+  underlineStyle: t === L.IMPORTANT ? "solid" : "dashed"
+}), ve = ({
   children: t,
-  type: e = x.IMPORTANT,
+  type: e = L.IMPORTANT,
   isCardActive: n = !0,
   theme: o
 }) => {
-  const r = Dn(e, o), a = {
+  const r = Fn(e, o), l = {
     position: "relative",
-    backgroundColor: n ? r.backgroundColor : Le(r.backgroundColor, 0.5),
+    backgroundColor: n ? r.backgroundColor : Ae(r.backgroundColor, 0.5),
     textDecorationLine: "underline",
     textDecorationStyle: r.underlineStyle,
     textDecorationColor: r.underlineColor,
@@ -1056,48 +1075,48 @@ const Dn = (t, e) => ({
     textUnderlineOffset: o.underlineOffset,
     lineHeight: "normal"
   };
-  return /* @__PURE__ */ i("span", { "data-note-highlight": "true", style: a, children: t });
-}, nt = () => {
-  const { translations: t } = Z();
-  return /* @__PURE__ */ T(v, { gap: "xx-small", alignItems: "start", as: "div", children: [
-    /* @__PURE__ */ i(v.Item, { as: "div", children: /* @__PURE__ */ i(dt, { color: "error" }) }),
-    /* @__PURE__ */ i(v.Item, { padding: "xxx-small none", shouldShrink: !0, children: /* @__PURE__ */ i(Te, { maxLines: 3, children: t.highlightUnavailable }) })
+  return /* @__PURE__ */ i("span", { "data-note-highlight": "true", style: l, children: t });
+}, rt = () => {
+  const { translations: t } = Y();
+  return /* @__PURE__ */ C(x, { gap: "xx-small", alignItems: "start", as: "div", children: [
+    /* @__PURE__ */ i(x.Item, { as: "div", children: /* @__PURE__ */ i(ft, { color: "error" }) }),
+    /* @__PURE__ */ i(x.Item, { padding: "xxx-small none", shouldShrink: !0, children: /* @__PURE__ */ i(Ie, { maxLines: 3, children: t.highlightUnavailable }) })
   ] });
-}, Pn = 100, _n = {
+}, Mn = {
   filter: null,
   courseFilter: null,
   currentPage: 1,
   totalPages: void 0
 };
-function me(t, e) {
+function he(t, e) {
   const n = typeof e == "number" ? Math.min(e, t) : t;
   return Math.max(1, n);
 }
-function Fn(t, e) {
+function Bn(t, e) {
   switch (e.type) {
     case "SET_FILTER":
       return { ...t, filter: e.payload, currentPage: 1 };
     case "SET_COURSE_FILTER":
       return { ...t, courseFilter: e.payload, currentPage: 1 };
     case "SET_PAGE":
-      return { ...t, currentPage: me(e.payload, t.totalPages) };
+      return { ...t, currentPage: he(e.payload, t.totalPages) };
     case "FOCUS_PAGE":
       return { ...t, currentPage: Math.max(1, e.payload) };
     case "INCREMENT_PAGE":
-      return { ...t, currentPage: me(t.currentPage + 1, t.totalPages) };
+      return { ...t, currentPage: he(t.currentPage + 1, t.totalPages) };
     case "DECREMENT_PAGE":
-      return { ...t, currentPage: me(t.currentPage - 1, t.totalPages) };
+      return { ...t, currentPage: he(t.currentPage - 1, t.totalPages) };
     case "SET_TOTAL_PAGES":
       return t.totalPages === e.payload ? t : {
         ...t,
         totalPages: e.payload,
-        currentPage: me(t.currentPage, e.payload)
+        currentPage: he(t.currentPage, e.payload)
       };
     default:
       return t;
   }
 }
-function fo({
+function go({
   api: t,
   courseId: e,
   enableCourseFilter: n = !1,
@@ -1105,99 +1124,111 @@ function fo({
   pageSize: r = 16,
   focusNoteId: s
 }) {
-  const [a, l] = We(Fn, _n), { filter: g, courseFilter: d, currentPage: h, totalPages: c } = a;
-  V(() => {
-    l({ type: "SET_PAGE", payload: 1 });
+  var se;
+  const [l, a] = We(Bn, Mn), { filter: m, courseFilter: c, currentPage: g, totalPages: d } = l;
+  W(() => {
+    a({ type: "SET_PAGE", payload: 1 });
   }, [r]);
-  const S = n ? d : e, p = (h - 1) * r, b = {
-    ...S ? { courseId: S } : {},
-    ...g ? { reactions: [g] } : {},
+  const y = n ? c : e, N = (g - 1) * r, h = !!o, T = {
+    ...y ? { courseId: y } : {},
+    ...m ? { reactions: [m] } : {},
     ...o ? { learningObject: o } : {}
-  }, { data: y, isLoading: N, isError: _ } = ve({
+  }, {
+    data: p,
+    isLoading: G,
+    isError: M
+  } = Ve({
     api: t,
-    filter: b,
-    offset: p,
-    pageSize: r
-  }), { data: O } = ve({
+    filter: T,
+    offset: N,
+    pageSize: r,
+    enabled: !h
+  }), {
+    data: b,
+    isLoading: v,
+    isError: B
+  } = Ze({
     api: t,
-    filter: b,
-    offset: 0,
-    pageSize: Pn,
-    enabled: !!s
-  }), m = K(null);
-  V(() => {
+    courseId: y ?? void 0,
+    learningObject: o,
+    enabled: h
+  }), F = fe(() => {
+    const S = (b == null ? void 0 : b.notes) ?? [];
+    return m ? S.filter((I) => I.reaction.includes(m)) : S;
+  }, [b, m]), E = _(null);
+  W(() => {
     if (!s) {
-      m.current = null;
+      E.current = null;
       return;
     }
-    if (m.current === s) return;
-    const $ = (O == null ? void 0 : O.notes.findIndex((Q) => Q.id === s)) ?? -1;
-    if ($ === -1) return;
-    m.current = s;
-    const q = Math.floor($ / r) + 1;
-    q !== h && l({ type: "FOCUS_PAGE", payload: q });
-  }, [s, O, r, h]);
-  const E = (y == null ? void 0 : y.notes) ?? [], I = y == null ? void 0 : y.pageInfo, L = (I == null ? void 0 : I.totalNrOfPages) ?? void 0, F = s && O ? Math.ceil(O.notes.length / r) : void 0, z = L === void 0 && F === void 0 ? void 0 : Math.max(L ?? 0, F ?? 0);
-  V(() => {
-    l({ type: "SET_TOTAL_PAGES", payload: z });
-  }, [z]);
-  const B = Y(($) => {
-    l({ type: "SET_PAGE", payload: $ });
-  }, []), k = Y(() => {
-    l({
+    if (E.current === s) return;
+    const S = F.findIndex((P) => P.id === s);
+    if (S === -1) return;
+    E.current = s;
+    const I = Math.floor(S / r) + 1;
+    I !== g && a({ type: "FOCUS_PAGE", payload: I });
+  }, [s, F, r, g]);
+  const A = h ? F.slice(N, N + r) : (p == null ? void 0 : p.notes) ?? [], R = h ? v : G, k = h ? B : M, $ = h ? Math.max(1, Math.ceil(F.length / r)) : ((se = p == null ? void 0 : p.pageInfo) == null ? void 0 : se.totalNrOfPages) ?? void 0, Q = h ? { totalCount: F.length, totalNrOfPages: $ } : p == null ? void 0 : p.pageInfo;
+  W(() => {
+    a({ type: "SET_TOTAL_PAGES", payload: $ });
+  }, [$]);
+  const K = X((S) => {
+    a({ type: "SET_PAGE", payload: S });
+  }, []), V = X(() => {
+    a({
       type: "INCREMENT_PAGE"
       /* IncrementPage */
     });
-  }, []), W = Y(() => {
-    l({
+  }, []), ne = X(() => {
+    a({
       type: "DECREMENT_PAGE"
       /* DecrementPage */
     });
-  }, []), X = Y(($) => {
-    l({ type: "SET_FILTER", payload: $ });
-  }, []), H = Y(($) => {
-    l({ type: "SET_COURSE_FILTER", payload: $ });
+  }, []), U = X((S) => {
+    a({ type: "SET_FILTER", payload: S });
+  }, []), re = X((S) => {
+    a({ type: "SET_COURSE_FILTER", payload: S });
   }, []);
   return {
-    notes: E,
-    pageInfo: I,
-    isLoading: N,
-    isError: _,
-    filter: g,
-    courseFilter: d,
-    currentPage: h,
-    totalPages: c,
-    setFilter: X,
-    setCourseFilter: H,
-    setPage: B,
-    fetchNextPage: k,
-    fetchPreviousPage: W
+    notes: A,
+    pageInfo: Q,
+    isLoading: R,
+    isError: k,
+    filter: m,
+    courseFilter: c,
+    currentPage: g,
+    totalPages: d,
+    setFilter: U,
+    setCourseFilter: re,
+    setPage: K,
+    fetchNextPage: V,
+    fetchPreviousPage: ne
   };
 }
-const Ee = "all";
-function mo({ filter: t, setFilter: e }) {
-  const { translations: n } = Z(), o = ge(
+const Se = "all";
+function ho({ filter: t, setFilter: e }) {
+  const { translations: n } = Y(), o = fe(
     () => [
-      { label: n.allNotes, value: Ee },
-      { label: n.important, value: x.IMPORTANT },
-      { label: n.unclear, value: x.CONFUSING }
+      { label: n.allNotes, value: Se },
+      { label: n.important, value: L.IMPORTANT },
+      { label: n.unclear, value: L.CONFUSING }
     ],
     [n]
-  ), r = Y(
-    (a, { value: l }) => {
-      e(!l || l === Ee ? null : l);
+  ), r = X(
+    (l, { value: a }) => {
+      e(!a || a === Se ? null : a);
     },
     [e]
   );
   return {
-    filterElement: ge(
+    filterElement: fe(
       () => /* @__PURE__ */ i(
         Fe,
         {
           renderLabel: n.filter,
-          value: t ?? Ee,
+          value: t ?? Se,
           onChange: r,
-          children: o.map((a) => /* @__PURE__ */ i(Fe.Option, { id: a.value, value: a.value, children: a.label }, a.value))
+          children: o.map((l) => /* @__PURE__ */ i(Fe.Option, { id: l.value, value: l.value, children: l.label }, l.value))
         }
       ),
       [t, o, r, n.filter]
@@ -1206,62 +1237,73 @@ function mo({ filter: t, setFilter: e }) {
     handleReactionFilterChange: r
   };
 }
-const Mn = ({ hasActiveFilter: t = !1 }) => {
-  const { translations: e } = Z(), n = t ? e.nothingHereYet : e.emptyStateHeading, o = t ? e.adjustFiltersOrCreate : e.emptyStateDescription;
-  return /* @__PURE__ */ i(j, { as: "div", textAlign: "center", children: /* @__PURE__ */ T(v, { direction: "column", alignItems: "center", gap: "small", children: [
-    !t && /* @__PURE__ */ i(ut, { size: "medium" }),
-    /* @__PURE__ */ i(pe, { level: "h3", children: n }),
-    /* @__PURE__ */ i(J, { color: "secondary", children: o })
+const Hn = ({ hasActiveFilter: t = !1 }) => {
+  const { translations: e } = Y(), n = t ? e.nothingHereYet : e.emptyStateHeading, o = t ? e.adjustFiltersOrCreate : e.emptyStateDescription;
+  return /* @__PURE__ */ i(q, { as: "div", textAlign: "center", children: /* @__PURE__ */ C(x, { direction: "column", alignItems: "center", gap: "small", children: [
+    !t && /* @__PURE__ */ i(mt, { size: "medium" }),
+    /* @__PURE__ */ i(Ne, { level: "h3", children: n }),
+    /* @__PURE__ */ i(Z, { color: "secondary", children: o })
   ] }) });
-}, Bn = {
-  [x.IMPORTANT]: {
+}, $n = {
+  [L.IMPORTANT]: {
     color: "success",
     translationKey: "important",
-    icon: /* @__PURE__ */ i(we, { size: "x-small" })
+    icon: /* @__PURE__ */ i(Re, { size: "x-small" })
   },
-  [x.CONFUSING]: {
+  [L.CONFUSING]: {
     color: "danger",
     translationKey: "unclear",
     icon: /* @__PURE__ */ i(ke, { size: "x-small" })
   }
-}, ot = ({ type: t, onTypeChange: e, renderAsMenuTrigger: n = !1 }) => {
-  const { translations: o } = Z(), r = Bn[t], s = o[r.translationKey], [a, l] = U(!1), g = K(null), d = K(null), h = Y(
-    (c) => {
-      e == null || e(c), l(!1);
+}, st = ({ type: t, onTypeChange: e, renderAsMenuTrigger: n = !1 }) => {
+  const { translations: o } = Y(), r = $n[t], s = o[r.translationKey], [l, a] = j(!1), m = _(null), c = _(null), g = _(null), d = X(
+    (y) => {
+      e == null || e(y), a(!1);
     },
     [e]
   );
-  return V(() => {
-    if (!a) return;
-    const c = (p) => {
-      p.key === "Escape" && p.stopPropagation();
-    }, S = (p) => {
-      p.key === "Escape" && (p.stopPropagation(), l(!1));
+  return W(() => {
+    if (!l) return;
+    const y = (h) => {
+      h.key === "Escape" && h.stopPropagation();
+    }, N = (h) => {
+      var T;
+      h.key === "Escape" && (h.stopPropagation(), a(!1), (T = g.current) == null || T.focus());
     };
-    return document.addEventListener("keydown", c, !0), document.addEventListener("keyup", S, !0), () => {
-      document.removeEventListener("keydown", c, !0), document.removeEventListener("keyup", S, !0);
+    return document.addEventListener("keydown", y, !0), document.addEventListener("keyup", N, !0), () => {
+      document.removeEventListener("keydown", y, !0), document.removeEventListener("keyup", N, !0);
     };
-  }, [a]), n && e ? /* @__PURE__ */ T(
-    ie,
+  }, [l]), n && e ? /* @__PURE__ */ C(
+    ae,
     {
       placement: "bottom start",
-      show: a,
-      onToggle: (c) => l(c),
+      show: l,
+      onToggle: (y) => a(y),
       shouldHideOnSelect: !0,
       shouldFocusTriggerOnClose: !0,
-      trigger: /* @__PURE__ */ i(Me, { color: r.color, renderIcon: r.icon, children: s }),
+      trigger: /* @__PURE__ */ i(
+        Me,
+        {
+          color: r.color,
+          renderIcon: r.icon,
+          elementRef: (y) => {
+            g.current = y;
+          },
+          children: s
+        }
+      ),
       children: [
-        /* @__PURE__ */ T(ie.Item, { ref: g, onClick: () => h(x.CONFUSING), children: [
+        /* @__PURE__ */ C(ae.Item, { ref: m, onClick: () => d(L.CONFUSING), children: [
           /* @__PURE__ */ i(ke, { size: "x-small" }),
           ` ${o.markUnclear}`
         ] }),
-        /* @__PURE__ */ T(ie.Item, { ref: d, onClick: () => h(x.IMPORTANT), children: [
-          /* @__PURE__ */ i(we, { size: "x-small" }),
+        /* @__PURE__ */ C(ae.Item, { ref: c, onClick: () => d(L.IMPORTANT), children: [
+          /* @__PURE__ */ i(Re, { size: "x-small" }),
           ` ${o.markImportant}`
         ] })
       ]
     }
-  ) : /* @__PURE__ */ i(j, { display: "inline-flex", children: /* @__PURE__ */ i(Me, { color: r.color, renderIcon: r.icon, children: s }) });
+  ) : /* @__PURE__ */ i(q, { display: "inline-flex", children: /* @__PURE__ */ i(Me, { color: r.color, renderIcon: r.icon, children: s }) });
 };
 function Ge(t, e) {
   return (t instanceof Date ? t : new Date(t)).toLocaleString(e, {
@@ -1270,40 +1312,43 @@ function Ge(t, e) {
     day: "numeric"
   });
 }
-const Hn = ({
+const jn = ({
   noteId: t,
   date: e,
   highlight: n,
   note: o,
   type: r,
   onClick: s,
-  onDelete: a,
-  onSaveNote: l,
-  onTypeChange: g,
-  isActive: d,
-  isPanelView: h = !1,
-  courseName: c,
-  locale: S,
-  highlightTheme: p,
-  renderLink: b,
-  href: y
+  onDelete: l,
+  onSaveNote: a,
+  onTypeChange: m,
+  isActive: c,
+  isPanelView: g = !1,
+  courseName: d,
+  locale: y,
+  highlightTheme: N,
+  renderLink: h,
+  href: T
 }) => {
-  const { translations: N } = Z(), [_, O] = U(!1), [m, E] = U(!1), [I, L] = U(o || ""), [F, z] = U(!1), B = K(null), k = Y((f) => {
-    B.current = f;
-  }, []), W = K(null), X = K(null), H = K(!1);
-  V(() => {
-    var f, w;
-    d && ((f = B.current) == null || f.scrollIntoView({ behavior: "smooth", block: "nearest" }), (w = B.current) == null || w.focus());
-  }, [d]), V(() => {
-    var f, w;
-    m ? (H.current = !0, (f = W.current) == null || f.focus()) : H.current && (H.current = !1, (w = X.current) == null || w.focus());
-  }, [m]);
-  const $ = r === x.IMPORTANT ? N.important : N.unclear, q = (f) => {
+  const { translations: p } = Y(), [G, M] = j(!1), [b, v] = j(!1), [B, F] = j(o || ""), [E, A] = j(!1), R = _(null), k = X((f) => {
+    R.current = f;
+  }, []), $ = _(null), Q = _(null), K = _(!1), V = _(null), ne = _(null), U = _(!1);
+  W(() => {
+    var f, O;
+    c && ((f = R.current) == null || f.scrollIntoView({ behavior: "smooth", block: "nearest" }), (O = R.current) == null || O.focus());
+  }, [c]), W(() => {
+    var f, O;
+    b ? (K.current = !0, (f = $.current) == null || f.focus()) : K.current && (K.current = !1, (O = Q.current) == null || O.focus());
+  }, [b]), W(() => {
+    var f, O;
+    E ? (f = ne.current) == null || f.focus() : U.current && (U.current = !1, (O = V.current) == null || O.focus());
+  }, [E]);
+  const re = r === L.IMPORTANT ? p.important : p.unclear, se = (f) => {
     f.key === "Enter" && (f.preventDefault(), s == null || s());
-  }, Q = [$, N.note];
-  n && Q.push(n), o && Q.push(o), e && Q.push(Ge(e, S)), c && Q.push(c);
-  const de = Q.join(", "), R = /* @__PURE__ */ T(
-    j,
+  }, S = [re, p.note];
+  n && S.push(n), o && S.push(o), e && S.push(Ge(e, y)), d && S.push(d);
+  const I = S.join(", "), P = /* @__PURE__ */ C(
+    q,
     {
       as: "div",
       height: "100%",
@@ -1311,151 +1356,155 @@ const Hn = ({
       borderRadius: "medium",
       padding: "small",
       position: "relative",
-      role: y || m ? void 0 : "button",
-      "aria-label": y ? void 0 : de,
-      "aria-pressed": y || m ? void 0 : d,
-      tabIndex: y || d ? -1 : 0,
+      role: T ? void 0 : c || b ? "group" : "button",
+      "aria-label": T ? void 0 : I,
+      "aria-pressed": T || c || b ? void 0 : c,
+      tabIndex: T || c ? -1 : 0,
       "data-testid": `note-card-${t}`,
       elementRef: k,
-      onClick: d ? void 0 : s,
-      onMouseEnter: () => O(!0),
-      onMouseLeave: () => O(!1),
-      onKeyDown: d ? void 0 : q,
-      cursor: m ? "default" : "pointer",
+      onClick: c ? void 0 : s,
+      onMouseEnter: () => M(!0),
+      onMouseLeave: () => M(!1),
+      onKeyDown: c ? void 0 : se,
+      cursor: b ? "default" : "pointer",
       children: [
-        /* @__PURE__ */ T(v, { direction: "column", gap: "small", height: "100%", children: [
+        /* @__PURE__ */ C(x, { direction: "column", gap: "small", height: "100%", children: [
           /* @__PURE__ */ i(
-            ot,
+            st,
             {
               type: r,
-              onTypeChange: h && g ? (f) => g(t, f) : void 0,
-              renderAsMenuTrigger: h && !!g && !!d
+              onTypeChange: g && m ? (f) => m(t, f) : void 0,
+              renderAsMenuTrigger: g && !!m && !!c
             }
           ),
-          n ? /* @__PURE__ */ i("div", { style: { wordBreak: "break-word", overflowWrap: "break-word" }, children: /* @__PURE__ */ i(J, { children: d && h ? /* @__PURE__ */ i(
-            Ce,
+          n ? /* @__PURE__ */ i("div", { style: { wordBreak: "break-word", overflowWrap: "break-word" }, children: /* @__PURE__ */ i(Z, { children: c && g ? /* @__PURE__ */ i(
+            ve,
             {
               type: r,
-              isCardActive: !!d || _,
-              theme: p,
+              isCardActive: !!c || G,
+              theme: N,
               children: n
             }
-          ) : /* @__PURE__ */ i(Te, { maxLines: 3, truncate: "word", children: /* @__PURE__ */ i(
-            Ce,
+          ) : /* @__PURE__ */ i(Ie, { maxLines: 3, truncate: "word", children: /* @__PURE__ */ i(
+            ve,
             {
               type: r,
-              isCardActive: !!d || _,
-              theme: p,
+              isCardActive: !!c || G,
+              theme: N,
               children: n
             }
-          ) }) }) }) : /* @__PURE__ */ i(nt, {}),
-          /* @__PURE__ */ i(v.Item, { shouldGrow: !0, children: /* @__PURE__ */ T(v, { direction: "column", gap: "small", height: "100%", children: [
-            m && h ? /* @__PURE__ */ T(v, { direction: "column", gap: "x-small", children: [
+          ) }) }) }) : /* @__PURE__ */ i(rt, {}),
+          /* @__PURE__ */ i(x.Item, { shouldGrow: !0, children: /* @__PURE__ */ C(x, { direction: "column", gap: "small", height: "100%", children: [
+            b && g ? /* @__PURE__ */ C(x, { direction: "column", gap: "x-small", margin: "xx-small", children: [
               /* @__PURE__ */ i(
                 qe,
                 {
-                  label: /* @__PURE__ */ i(mt, { children: N.editNote }),
-                  value: I,
-                  onChange: (f) => L(f.target.value),
-                  placeholder: N.addNoteOptional,
+                  label: /* @__PURE__ */ i(ht, { children: p.editNote }),
+                  value: B,
+                  onChange: (f) => F(f.target.value),
+                  placeholder: p.addNoteOptional,
                   textareaRef: (f) => {
-                    W.current = f;
+                    $.current = f;
                   }
                 }
               ),
-              /* @__PURE__ */ T(v, { gap: "xx-small", children: [
-                /* @__PURE__ */ i(v.Item, { shouldGrow: !0, children: /* @__PURE__ */ i(
-                  ee,
+              /* @__PURE__ */ C(x, { gap: "xx-small", children: [
+                /* @__PURE__ */ i(x.Item, { shouldGrow: !0, children: /* @__PURE__ */ i(
+                  J,
                   {
                     display: "block",
                     size: "small",
                     "data-testid": `note-card-${t}-cancel`,
                     onClick: () => {
-                      L(o || ""), E(!1);
+                      F(o || ""), v(!1);
                     },
-                    children: N.cancel
+                    children: p.cancel
                   }
                 ) }),
-                /* @__PURE__ */ i(v.Item, { shouldGrow: !0, children: /* @__PURE__ */ i(
-                  ee,
+                /* @__PURE__ */ i(x.Item, { shouldGrow: !0, children: /* @__PURE__ */ i(
+                  J,
                   {
                     display: "block",
                     color: "primary",
                     size: "small",
                     "data-testid": `note-card-${t}-save`,
                     onClick: () => {
-                      l == null || l(t, I.trim()), E(!1);
+                      a == null || a(t, B.trim()), v(!1);
                     },
-                    children: N.save
+                    children: p.save
                   }
                 ) })
               ] })
-            ] }) : o ? /* @__PURE__ */ i("div", { style: { wordBreak: "break-word", overflowWrap: "break-word" }, children: d && h ? /* @__PURE__ */ T(J, { children: [
+            ] }) : o ? /* @__PURE__ */ i("div", { style: { wordBreak: "break-word", overflowWrap: "break-word" }, children: c && g ? /* @__PURE__ */ C(Z, { children: [
               o,
               " ",
               /* @__PURE__ */ i(
-                le,
+                de,
                 {
                   size: "small",
                   withBackground: !1,
                   withBorder: !1,
-                  margin: "0 0 0 xxx-small",
-                  screenReaderLabel: N.editNote,
+                  margin: "xx-small 0 0 xxx-small",
+                  screenReaderLabel: p.editNote,
                   "data-testid": `note-card-${t}-edit`,
                   elementRef: (f) => {
-                    X.current = f;
+                    Q.current = f;
                   },
                   onClick: (f) => {
-                    f.stopPropagation(), E(!0);
+                    f.stopPropagation(), v(!0);
                   },
-                  children: /* @__PURE__ */ i(Se, {})
+                  children: /* @__PURE__ */ i(Te, {})
                 }
               )
-            ] }) : /* @__PURE__ */ i(J, { children: /* @__PURE__ */ i(Te, { maxLines: 3, truncate: "word", children: o }) }) }) : h && d ? /* @__PURE__ */ i("div", { children: /* @__PURE__ */ T(J, { color: "secondary", children: [
-              N.addNotePrompt,
+            ] }) : /* @__PURE__ */ i(Z, { children: /* @__PURE__ */ i(Ie, { maxLines: 3, truncate: "word", children: o }) }) }) : g && c ? /* @__PURE__ */ i("div", { children: /* @__PURE__ */ C(Z, { color: "secondary", children: [
+              p.addNotePrompt,
               " ",
               /* @__PURE__ */ i(
-                le,
+                de,
                 {
                   size: "small",
                   withBackground: !1,
                   withBorder: !1,
-                  margin: "0 0 0 xxx-small",
-                  screenReaderLabel: N.editNote,
+                  margin: "xx-small 0 0 xxx-small",
+                  screenReaderLabel: p.editNote,
                   "data-testid": `note-card-${t}-edit`,
                   elementRef: (f) => {
-                    X.current = f;
+                    Q.current = f;
                   },
                   onClick: (f) => {
-                    f.stopPropagation(), E(!0);
+                    f.stopPropagation(), v(!0);
                   },
-                  children: /* @__PURE__ */ i(Se, {})
+                  children: /* @__PURE__ */ i(Te, {})
                 }
               )
             ] }) }) : null,
-            /* @__PURE__ */ T(v, { justifyItems: "space-between", alignItems: "center", margin: "auto 0 0 0", children: [
-              /* @__PURE__ */ i(J, { size: "small", color: "secondary", children: Ge(e, S) }),
-              d && a && /* @__PURE__ */ i(
-                le,
+            /* @__PURE__ */ C(x, { justifyItems: "space-between", alignItems: "center", margin: "auto 0 0 0", children: [
+              /* @__PURE__ */ i(Z, { size: "small", color: "secondary", children: Ge(e, y) }),
+              c && l && /* @__PURE__ */ i(
+                de,
                 {
                   size: "small",
                   withBackground: !1,
                   withBorder: !1,
                   color: "danger",
-                  screenReaderLabel: N.deleteNote,
+                  margin: "xx-small",
+                  screenReaderLabel: p.deleteNote,
                   "data-testid": `note-card-${t}-delete`,
+                  elementRef: (f) => {
+                    V.current = f;
+                  },
                   onClick: (f) => {
-                    f.stopPropagation(), z(!0);
+                    f.stopPropagation(), A(!0);
                   },
-                  children: /* @__PURE__ */ i(he, {})
+                  children: /* @__PURE__ */ i(pe, {})
                 }
               )
             ] }),
-            c && /* @__PURE__ */ i(J, { size: "small", color: "secondary", children: c })
+            d && /* @__PURE__ */ i(Z, { size: "small", color: "secondary", children: d })
           ] }) })
         ] }),
-        F && a && /* @__PURE__ */ i(
-          j,
+        E && l && /* @__PURE__ */ i(
+          q,
           {
             as: "div",
             background: "primary",
@@ -1467,8 +1516,8 @@ const Hn = ({
             insetInlineStart: "0",
             insetInlineEnd: "0",
             stacking: "above",
-            children: /* @__PURE__ */ T(
-              v,
+            children: /* @__PURE__ */ C(
+              x,
               {
                 direction: "column",
                 justifyItems: "center",
@@ -1477,29 +1526,32 @@ const Hn = ({
                 height: "100%",
                 children: [
                   /* @__PURE__ */ i(
-                    ee,
+                    J,
                     {
                       display: "block",
                       color: "danger",
                       size: "small",
-                      renderIcon: /* @__PURE__ */ i(he, {}),
+                      renderIcon: /* @__PURE__ */ i(pe, {}),
                       "data-testid": `note-card-${t}-confirm-delete`,
+                      elementRef: (f) => {
+                        ne.current = f;
+                      },
                       onClick: (f) => {
-                        f.stopPropagation(), a(t), z(!1);
+                        f.stopPropagation(), l(t), A(!1);
                       },
-                      children: N.deleteNote
+                      children: p.deleteNote
                     }
                   ),
                   /* @__PURE__ */ i(
-                    ee,
+                    J,
                     {
                       display: "block",
                       size: "small",
                       "data-testid": `note-card-${t}-cancel-delete`,
                       onClick: (f) => {
-                        f.stopPropagation(), z(!1);
+                        f.stopPropagation(), U.current = !0, A(!1);
                       },
-                      children: N.cancel
+                      children: p.cancel
                     }
                   )
                 ]
@@ -1510,8 +1562,8 @@ const Hn = ({
       ]
     }
   );
-  return y && b ? b({ href: y, children: R, ariaLabel: de }) : R;
-}, $n = {
+  return T && h ? h({ href: T, children: P, ariaLabel: I }) : P;
+}, Gn = {
   display: "grid",
   gap: "1rem",
   boxSizing: "border-box",
@@ -1519,197 +1571,218 @@ const Hn = ({
   margin: 0,
   padding: 0,
   listStyle: "none"
-}, go = ({
+}, po = ({
   notes: t,
   isLoading: e,
   isError: n,
   currentPage: o,
   totalPages: r,
   onPageChange: s,
-  onNoteSelect: a,
-  onNoteDelete: l,
-  onNoteSave: g,
-  onNoteTypeChange: d,
-  selectedNoteId: h,
-  hasActiveFilter: c = !1,
-  columnCount: S = 1,
-  highlightTheme: p,
-  locale: b,
-  renderNoteLink: y,
-  noteHref: N
+  onNoteSelect: l,
+  onNoteDelete: a,
+  onNoteSave: m,
+  onNoteTypeChange: c,
+  onNotesEmptied: g,
+  selectedNoteId: d,
+  hasActiveFilter: y = !1,
+  columnCount: N = 1,
+  highlightTheme: h,
+  locale: T,
+  renderNoteLink: p,
+  noteHref: G
 }) => {
-  const { translations: _ } = Z();
-  if (e)
-    return /* @__PURE__ */ i(j, { as: "div", textAlign: "center", padding: "large", "data-testid": "notes-loading", children: /* @__PURE__ */ i(ht, { renderTitle: _.loadingNotes }) });
+  const { translations: M } = Y(), b = _(null), v = _(null), B = X(
+    (E) => {
+      const A = t.findIndex((k) => k.id === E);
+      let R = null;
+      t.length > 1 && (R = A > 0 ? t[A - 1].id : t[1].id), v.current = { targetId: R }, a == null || a(E);
+    },
+    [t, a]
+  );
+  if (W(() => {
+    var A;
+    const E = v.current;
+    if (E)
+      if (v.current = null, E.targetId === null)
+        g == null || g();
+      else {
+        const R = (A = b.current) == null ? void 0 : A.querySelector(
+          `[data-testid="note-card-${E.targetId}"]`
+        );
+        R == null || R.focus();
+      }
+  }, [t, g]), e)
+    return /* @__PURE__ */ i(q, { as: "div", textAlign: "center", padding: "large", "data-testid": "notes-loading", children: /* @__PURE__ */ i(Nt, { renderTitle: M.loadingNotes }) });
   if (n)
-    return /* @__PURE__ */ i(j, { as: "div", textAlign: "center", padding: "large", "data-testid": "notes-error", children: /* @__PURE__ */ i(pe, { level: "h4", children: _.failedToLoadNotes }) });
+    return /* @__PURE__ */ i(q, { as: "div", textAlign: "center", padding: "large", "data-testid": "notes-error", children: /* @__PURE__ */ i(Ne, { level: "h4", children: M.failedToLoadNotes }) });
   if (t.length === 0)
-    return /* @__PURE__ */ i(j, { as: "div", padding: "large", "data-testid": "empty-notes", children: /* @__PURE__ */ i(Mn, { hasActiveFilter: c }) });
-  const O = typeof o == "number" && typeof r == "number" && r > 1 && s !== void 0;
-  return /* @__PURE__ */ T(rt, { children: [
+    return /* @__PURE__ */ i(q, { as: "div", padding: "large", "data-testid": "empty-notes", children: /* @__PURE__ */ i(Hn, { hasActiveFilter: y }) });
+  const F = typeof o == "number" && typeof r == "number" && r > 1 && s !== void 0;
+  return /* @__PURE__ */ C(it, { children: [
     /* @__PURE__ */ i(
       "ul",
       {
-        style: { ...$n, gridTemplateColumns: `repeat(${S}, minmax(0, 1fr))` },
+        ref: b,
+        style: { ...Gn, gridTemplateColumns: `repeat(${N}, minmax(0, 1fr))` },
         role: "list",
         "data-testid": "notes-grid",
-        children: t.map((m) => {
-          var E;
+        children: t.map((E) => {
+          var A;
           return /* @__PURE__ */ i("li", { children: /* @__PURE__ */ i(
-            Hn,
+            jn,
             {
-              noteId: m.id,
-              date: m.createdAt,
-              type: m.reaction[0] ?? x.IMPORTANT,
-              highlight: (E = m.highlightData) == null ? void 0 : E.selectedText,
-              note: m.userText,
-              isActive: h === m.id,
-              isPanelView: !!h,
-              onClick: a ? () => a(m.id) : void 0,
-              onDelete: l ? (I) => l(I) : void 0,
-              onSaveNote: g ? (I, L) => g(I, L) : void 0,
-              onTypeChange: d ? (I, L) => d(I, L) : void 0,
-              highlightTheme: p,
-              locale: b,
-              renderLink: y,
-              href: N ? N(m.id, m) : void 0
+              noteId: E.id,
+              date: E.createdAt,
+              type: E.reaction[0] ?? L.IMPORTANT,
+              highlight: (A = E.highlightData) == null ? void 0 : A.selectedText,
+              note: E.userText,
+              isActive: d === E.id,
+              isPanelView: !!d,
+              onClick: l ? () => l(E.id) : void 0,
+              onDelete: a ? B : void 0,
+              onSaveNote: m ? (R, k) => m(R, k) : void 0,
+              onTypeChange: c ? (R, k) => c(R, k) : void 0,
+              highlightTheme: h,
+              locale: T,
+              renderLink: p,
+              href: G ? G(E.id, E) : void 0
             }
-          ) }, m.id);
+          ) }, E.id);
         })
       }
     ),
-    O && /* @__PURE__ */ i(v, { justifyItems: "center", padding: "small", "data-testid": "notes-pagination", children: /* @__PURE__ */ i(v.Item, { children: /* @__PURE__ */ i(
-      gt,
+    F && /* @__PURE__ */ i(x, { justifyItems: "center", padding: "small", "data-testid": "notes-pagination", children: /* @__PURE__ */ i(x.Item, { children: /* @__PURE__ */ i(
+      pt,
       {
         as: "nav",
         variant: "input",
-        labelNext: _.nextPage,
-        labelPrev: _.previousPage,
+        labelNext: M.nextPage,
+        labelPrev: M.previousPage,
         currentPage: o,
         totalPageNumber: r,
         onPageChange: s
       }
     ) }) })
   ] });
-}, ho = ({
+}, No = ({
   noteText: t,
   reaction: e,
   highlightText: n,
   highlightTheme: o,
   onSave: r,
   onDelete: s,
-  onTypeChange: a,
-  onBack: l,
-  editing: g = !1
+  onTypeChange: l,
+  onBack: a,
+  editing: m = !1
 }) => {
-  const { translations: d } = Z(), [h, c] = U(g), [S, p] = U(t || ""), [b, y] = U(!1);
-  return /* @__PURE__ */ T(v, { direction: "column", gap: "small", "data-testid": "single-note", children: [
-    n != null ? /* @__PURE__ */ i(j, { as: "div", children: /* @__PURE__ */ i(J, { children: /* @__PURE__ */ i(Ce, { type: e, isCardActive: !0, theme: o, children: n }) }) }) : /* @__PURE__ */ i(nt, {}),
-    /* @__PURE__ */ i(ot, { type: e, onTypeChange: a, renderAsMenuTrigger: !!a }),
-    h ? /* @__PURE__ */ T(v, { direction: "column", gap: "x-small", children: [
+  const { translations: c } = Y(), [g, d] = j(m), [y, N] = j(t || ""), [h, T] = j(!1);
+  return /* @__PURE__ */ C(x, { direction: "column", gap: "small", "data-testid": "single-note", children: [
+    n != null ? /* @__PURE__ */ i(q, { as: "div", children: /* @__PURE__ */ i(Z, { children: /* @__PURE__ */ i(ve, { type: e, isCardActive: !0, theme: o, children: n }) }) }) : /* @__PURE__ */ i(rt, {}),
+    /* @__PURE__ */ i(st, { type: e, onTypeChange: l, renderAsMenuTrigger: !!l }),
+    g ? /* @__PURE__ */ C(x, { direction: "column", gap: "x-small", children: [
       /* @__PURE__ */ i(
         qe,
         {
-          label: d.addNoteOptional,
-          value: S,
-          onChange: (N) => p(N.target.value),
+          label: c.addNoteOptional,
+          value: y,
+          onChange: (p) => N(p.target.value),
           resize: "vertical"
         }
       ),
-      /* @__PURE__ */ T(v, { gap: "xx-small", children: [
-        /* @__PURE__ */ i(v.Item, { shouldGrow: !0, children: /* @__PURE__ */ i(
-          ee,
+      /* @__PURE__ */ C(x, { gap: "xx-small", children: [
+        /* @__PURE__ */ i(x.Item, { shouldGrow: !0, children: /* @__PURE__ */ i(
+          J,
           {
             display: "block",
             size: "small",
             "data-testid": "single-note-cancel",
             onClick: () => {
-              p(t || ""), c(!1);
+              N(t || ""), d(!1);
             },
-            children: d.cancel
+            children: c.cancel
           }
         ) }),
-        /* @__PURE__ */ i(v.Item, { shouldGrow: !0, children: /* @__PURE__ */ i(
-          ee,
+        /* @__PURE__ */ i(x.Item, { shouldGrow: !0, children: /* @__PURE__ */ i(
+          J,
           {
             display: "block",
             color: "primary",
             size: "small",
             "data-testid": "single-note-save",
             onClick: () => {
-              r(S), c(!1);
+              r(y), d(!1);
             },
-            children: d.save
+            children: c.save
           }
         ) })
       ] })
-    ] }) : /* @__PURE__ */ T(v, { direction: "column", gap: "small", children: [
-      t && /* @__PURE__ */ T(j, { as: "div", children: [
-        /* @__PURE__ */ i(pe, { level: "h4", margin: "0 0 xx-small 0", children: d.note }),
-        /* @__PURE__ */ i(J, { children: t })
+    ] }) : /* @__PURE__ */ C(x, { direction: "column", gap: "small", children: [
+      t && /* @__PURE__ */ C(q, { as: "div", children: [
+        /* @__PURE__ */ i(Ne, { level: "h4", margin: "0 0 xx-small 0", children: c.note }),
+        /* @__PURE__ */ i(Z, { children: t })
       ] }),
-      /* @__PURE__ */ T(v, { justifyItems: "space-between", children: [
+      /* @__PURE__ */ C(x, { justifyItems: "space-between", children: [
         /* @__PURE__ */ i(
-          ee,
+          J,
           {
             size: "small",
-            renderIcon: /* @__PURE__ */ i(ft, {}),
+            renderIcon: /* @__PURE__ */ i(gt, {}),
             "data-testid": "single-note-back",
-            onClick: () => l == null ? void 0 : l(),
-            children: d.back
+            onClick: () => a == null ? void 0 : a(),
+            children: c.back
           }
         ),
-        /* @__PURE__ */ T(v, { gap: "xx-small", children: [
+        /* @__PURE__ */ C(x, { gap: "xx-small", children: [
           s && /* @__PURE__ */ i(
-            le,
+            de,
             {
               size: "small",
               withBackground: !1,
               withBorder: !1,
               color: "danger",
-              screenReaderLabel: d.deleteNote,
+              screenReaderLabel: c.deleteNote,
               "data-testid": "single-note-delete",
-              onClick: () => y(!0),
-              children: /* @__PURE__ */ i(he, {})
+              onClick: () => T(!0),
+              children: /* @__PURE__ */ i(pe, {})
             }
           ),
           /* @__PURE__ */ i(
-            le,
+            de,
             {
               size: "small",
               withBackground: !1,
               withBorder: !1,
-              screenReaderLabel: d.editNote,
+              screenReaderLabel: c.editNote,
               "data-testid": "single-note-edit",
-              onClick: () => c(!0),
-              children: /* @__PURE__ */ i(Se, {})
+              onClick: () => d(!0),
+              children: /* @__PURE__ */ i(Te, {})
             }
           )
         ] })
       ] }),
-      b && s && /* @__PURE__ */ i(j, { as: "div", background: "primary", padding: "medium", borderRadius: "large", children: /* @__PURE__ */ T(v, { direction: "column", justifyItems: "center", alignItems: "center", gap: "x-small", children: [
+      h && s && /* @__PURE__ */ i(q, { as: "div", background: "primary", padding: "medium", borderRadius: "large", children: /* @__PURE__ */ C(x, { direction: "column", justifyItems: "center", alignItems: "center", gap: "x-small", children: [
         /* @__PURE__ */ i(
-          ee,
+          J,
           {
             display: "block",
             color: "danger",
             size: "small",
-            renderIcon: /* @__PURE__ */ i(he, {}),
+            renderIcon: /* @__PURE__ */ i(pe, {}),
             "data-testid": "single-note-confirm-delete",
             onClick: () => {
-              s(), y(!1);
+              s(), T(!1);
             },
-            children: d.deleteNote
+            children: c.deleteNote
           }
         ),
         /* @__PURE__ */ i(
-          ee,
+          J,
           {
             display: "block",
             size: "small",
             "data-testid": "single-note-cancel-delete",
-            onClick: () => y(!1),
-            children: d.cancel
+            onClick: () => T(!1),
+            children: c.cancel
           }
         )
       ] }) })
@@ -1717,26 +1790,26 @@ const Hn = ({
   ] });
 };
 export {
-  uo as ContentWithNoteWrapper,
-  Ce as Highlight,
-  nt as HighlightError,
-  Hn as NoteCard,
-  ot as NoteChip,
-  Ln as NoteReactionMenu,
-  Mn as NotebookEmptyState,
-  lo as NotebookProvider,
-  On as NotebookTranslationsProvider,
-  co as NotebookTray,
-  go as NotesListView,
-  x as REACTION_TYPE,
-  ho as SingleNote,
-  Le as createTransparentColor,
-  Gt as useCreateNote,
-  jt as useDeleteNote,
-  ve as useGetNotes,
-  et as useNotebook,
-  Z as useNotebookTranslations,
-  fo as useNotesData,
-  mo as useReactionFilter,
-  zt as useUpdateNote
+  mo as ContentWithNoteWrapper,
+  ve as Highlight,
+  rt as HighlightError,
+  jn as NoteCard,
+  st as NoteChip,
+  _n as NoteReactionMenu,
+  Hn as NotebookEmptyState,
+  uo as NotebookProvider,
+  An as NotebookTranslationsProvider,
+  fo as NotebookTray,
+  po as NotesListView,
+  L as REACTION_TYPE,
+  No as SingleNote,
+  Ae as createTransparentColor,
+  zt as useCreateNote,
+  Wt as useDeleteNote,
+  Ve as useGetNotes,
+  nt as useNotebook,
+  Y as useNotebookTranslations,
+  go as useNotesData,
+  ho as useReactionFilter,
+  Kt as useUpdateNote
 };