@instructure/platform-notebook 1.3.1 → 1.5.0

package/dist/index.js

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