@instructure/platform-notebook 0.9.1 → 0.10.1

package/dist/index.js

@@ -1,110 +1,110 @@
-import { jsx as s, jsxs as S, Fragment as Ye } from "react/jsx-runtime";
-import { createContext as Pe, useMemo as re, useContext as _e, useReducer as Fe, useRef as ne, useEffect as Q, useState as B, useCallback as K } from "react";
+import { jsx as s, jsxs as T, Fragment as Ye } from "react/jsx-runtime";
+import { createContext as Pe, useMemo as re, useContext as _e, useReducer as Fe, useRef as V, useEffect as ee, useState as W, useCallback as K } from "react";
 import { createPortal as Ze } from "react-dom";
-import { z as a } from "zod";
+import { z as c } from "zod";
 import Je from "diff-match-patch";
 import { useQueryClient as ge, useMutation as pe, useQuery as et } from "@tanstack/react-query";
 import { IconQuestionLine as Ne, IconPinLine as be, IconWarningLine as tt, IconNoteLine as nt, IconEditLine as fe, IconTrashLine as le, IconArrowOpenStartLine as ot, IconArrowOpenEndLine as rt, IconArrowStartLine as st } from "@instructure/ui-icons";
-import { Menu as ee } from "@instructure/ui-menu";
-import { Flex as T } from "@instructure/ui-flex";
+import { Menu as te } from "@instructure/ui-menu";
+import { View as z } from "@instructure/ui-view";
+import { Flex as C } from "@instructure/ui-flex";
 import { TruncateText as me } from "@instructure/ui-truncate-text";
 import { ScreenReaderContent as Me } from "@instructure/ui-a11y-content";
 import { SimpleSelect as we } from "@instructure/ui-simple-select";
 import { Heading as ae } from "@instructure/ui-heading";
 import { Text as U } from "@instructure/ui-text";
-import { View as z } from "@instructure/ui-view";
-import { CloseButton as it, Button as $, IconButton as V } from "@instructure/ui-buttons";
+import { CloseButton as it, Button as $, IconButton as Q } from "@instructure/ui-buttons";
 import { Tray as lt } from "@instructure/ui-tray";
 import { TextArea as He } from "@instructure/ui-text-area";
 import { Pill as ke } from "@instructure/ui-pill";
 import { Spinner as at } from "@instructure/ui-spinner";
-const ct = a.object({
-  startContainer: a.string(),
-  endContainer: a.string(),
-  startOffset: a.number(),
-  endOffset: a.number()
-}), dt = a.object({
-  start: a.number(),
-  end: a.number()
-}), ye = a.object({
-  selectedText: a.string(),
-  hasNoHighlightAnymore: a.boolean().optional(),
+const ct = c.object({
+  startContainer: c.string(),
+  endContainer: c.string(),
+  startOffset: c.number(),
+  endOffset: c.number()
+}), dt = c.object({
+  start: c.number(),
+  end: c.number()
+}), ye = c.object({
+  selectedText: c.string(),
+  hasNoHighlightAnymore: c.boolean().optional(),
   textPosition: dt.nullable(),
   range: ct.nullable(),
-  pageLastModifiedAt: a.string()
+  pageLastModifiedAt: c.string()
 });
 var w = /* @__PURE__ */ ((n) => (n.IMPORTANT = "Important", n.CONFUSING = "Confusing", n))(w || {});
-const Ee = a.enum([
+const Ee = c.enum([
   "Important",
   "Confusing"
   /* CONFUSING */
-]), Be = a.object({
-  startCursor: a.string().nullish(),
-  endCursor: a.string().nullish(),
-  hasNextPage: a.boolean().nullish(),
-  hasPreviousPage: a.boolean().nullish()
-}), ce = a.object({
-  id: a.string(),
-  rootAccountUuid: a.string(),
-  userId: a.string(),
-  courseId: a.string(),
-  objectId: a.string(),
-  objectType: a.string(),
-  userText: a.string().optional(),
-  reaction: a.array(Ee),
+]), We = c.object({
+  startCursor: c.string().nullish(),
+  endCursor: c.string().nullish(),
+  hasNextPage: c.boolean().nullish(),
+  hasPreviousPage: c.boolean().nullish()
+}), ce = c.object({
+  id: c.string(),
+  rootAccountUuid: c.string(),
+  userId: c.string(),
+  courseId: c.string(),
+  objectId: c.string(),
+  objectType: c.string(),
+  userText: c.string().optional(),
+  reaction: c.array(Ee),
   highlightData: ye,
-  createdAt: a.string(),
-  updatedAt: a.string()
-}), ut = a.object({
-  cursor: a.string(),
+  createdAt: c.string(),
+  updatedAt: c.string()
+}), ut = c.object({
+  cursor: c.string(),
   node: ce
 });
-a.object({
-  notes: a.object({
-    edges: a.array(ut),
-    nodes: a.array(ce),
-    pageInfo: Be
+c.object({
+  notes: c.object({
+    edges: c.array(ut),
+    nodes: c.array(ce),
+    pageInfo: We
   })
 });
-const ft = a.object({
-  type: a.string(),
-  id: a.string()
-}), mt = a.object({
-  courseId: a.string().optional(),
+const ft = c.object({
+  type: c.string(),
+  id: c.string()
+}), mt = c.object({
+  courseId: c.string().optional(),
   learningObject: ft.optional(),
-  reactions: a.array(a.string()).optional()
+  reactions: c.array(c.string()).optional()
 }).optional();
-a.object({
-  courseId: a.string().optional(),
+c.object({
+  courseId: c.string().optional(),
   filter: mt,
-  pageParams: Be.optional(),
-  direction: a.enum(["next", "prev"]).optional(),
-  pageSize: a.number().optional()
+  pageParams: We.optional(),
+  direction: c.enum(["next", "prev"]).optional(),
+  pageSize: c.number().optional()
 });
-a.object({
-  courseId: a.string(),
-  objectId: a.string(),
-  objectType: a.string(),
-  userText: a.string().optional(),
-  reaction: a.array(Ee),
+c.object({
+  courseId: c.string(),
+  objectId: c.string(),
+  objectType: c.string(),
+  userText: c.string().optional(),
+  reaction: c.array(Ee),
   highlightData: ye
 });
-a.object({
+c.object({
   createNote: ce
 });
-a.object({
-  id: a.string(),
-  userText: a.string().optional(),
-  reaction: a.array(Ee),
+c.object({
+  id: c.string(),
+  userText: c.string().optional(),
+  reaction: c.array(Ee),
   highlightData: ye
 });
-a.object({
+c.object({
   updateNote: ce
 });
-a.object({
-  deleteNote: a.string()
+c.object({
+  deleteNote: c.string()
 });
-var We = /* @__PURE__ */ ((n) => (n[n.FORWARDS = 1] = "FORWARDS", n[n.BACKWARDS = 2] = "BACKWARDS", n))(We || {});
+var Be = /* @__PURE__ */ ((n) => (n[n.FORWARDS = 1] = "FORWARDS", n[n.BACKWARDS = 2] = "BACKWARDS", n))(Be || {});
 class q {
   constructor(e, t) {
     this.start = e, this.end = t;
@@ -123,17 +123,17 @@ class q {
     return o.setStart(e.node, e.offset), o.setEnd(t.node, t.offset), o;
   }
   static fromRange(e) {
-    const t = W.fromPoint(e.startContainer, e.startOffset), o = W.fromPoint(e.endContainer, e.endOffset);
+    const t = B.fromPoint(e.startContainer, e.startOffset), o = B.fromPoint(e.endContainer, e.endOffset);
     return !t || !o ? null : new q(t, o);
   }
   static fromOffsets(e, t, o) {
-    return new q(new W(e, t), new W(e, o));
+    return new q(new B(e, t), new B(e, o));
   }
   relativeTo(e) {
     return new q(this.start.relativeTo(e), this.end.relativeTo(e));
   }
 }
-class W {
+class B {
   constructor(e, t) {
     t < 0 && console.error("Offset is invalid"), this.element = e, this.offset = t;
   }
@@ -144,7 +144,7 @@ class W {
       if (this.offset === 0 && e.direction !== void 0) {
         const o = document.createTreeWalker(this.element.getRootNode(), NodeFilter.SHOW_TEXT);
         o.currentNode = this.element;
-        const r = e.direction === We.FORWARDS, i = r ? o.nextNode() : o.previousNode();
+        const r = e.direction === Be.FORWARDS, i = r ? o.nextNode() : o.previousNode();
         if (!i)
           throw t;
         return { node: i, offset: r ? 0 : i.data.length };
@@ -155,9 +155,9 @@ class W {
   static fromCharOffset(e, t) {
     switch (e.nodeType) {
       case Node.TEXT_NODE:
-        return W.fromPoint(e, t);
+        return B.fromPoint(e, t);
       case Node.ELEMENT_NODE:
-        return new W(e, t);
+        return new B(e, t);
       default:
         return console.error("Node is not an element or text node"), null;
     }
@@ -170,7 +170,7 @@ class W {
         if (!e.parentElement)
           return console.error("Text node has no parent"), null;
         const o = De(e) + t;
-        return new W(e.parentElement, o);
+        return new B(e.parentElement, o);
       }
       case Node.ELEMENT_NODE: {
         if (t < 0 || t > e.childNodes.length)
@@ -178,7 +178,7 @@ class W {
         let o = 0;
         for (let r = 0; r < t; r++)
           o += ze(e.childNodes[r]);
-        return new W(e, o);
+        return new B(e, o);
       }
       default:
         return console.error("Point is not in an element or text node"), null;
@@ -190,7 +190,7 @@ class W {
     let t = this.element, o = this.offset;
     for (; t !== e; )
       o += De(t), t.parentElement && (t = t.parentElement);
-    return new W(t, o);
+    return new B(t, o);
   }
 }
 const ht = (n) => {
@@ -232,19 +232,19 @@ const pt = (n) => {
   let r = e;
   o.shift();
   for (const i of o) {
-    let l, d;
+    let l, a;
     const m = i.indexOf("[");
     if (m !== -1) {
       l = i.slice(0, m);
       const g = i.slice(m + 1, i.indexOf("]"));
-      if (d = Number.parseInt(g, 10) - 1, d < 0)
+      if (a = Number.parseInt(g, 10) - 1, a < 0)
         return null;
     } else
-      l = i, d = 0;
-    const c = Nt(r, l, d);
-    if (!c)
+      l = i, a = 0;
+    const d = Nt(r, l, a);
+    if (!d)
       return null;
-    r = c;
+    r = d;
   }
   return r;
 }, Re = (n, e = document.body) => {
@@ -270,11 +270,11 @@ class Y {
     const r = Re(t.endContainer, e);
     if (!r)
       return console.error("Failed to resolve endContainer XPath"), null;
-    const i = W.fromCharOffset(o, t.startOffset), l = W.fromCharOffset(r, t.endOffset);
+    const i = B.fromCharOffset(o, t.startOffset), l = B.fromCharOffset(r, t.endOffset);
     if (!i || !l)
       return null;
-    const d = new q(i, l).toRange();
-    return d ? new Y(e, d) : null;
+    const a = new q(i, l).toRange();
+    return a ? new Y(e, a) : null;
   }
   toRange() {
     return this.range;
@@ -329,10 +329,10 @@ const ze = (n) => {
 }, je = (n, ...e) => {
   let t = e.shift();
   const o = n.ownerDocument.createNodeIterator(n, NodeFilter.SHOW_TEXT), r = [];
-  let i = o.nextNode(), l = null, d = 0;
+  let i = o.nextNode(), l = null, a = 0;
   for (; t !== void 0 && i; )
-    l = i, d + l.data.length > t ? (r.push({ node: l, offset: t - d }), t = e.shift()) : (i = o.nextNode(), d += l.data.length);
-  for (; t !== void 0 && l && d === t; )
+    l = i, a + l.data.length > t ? (r.push({ node: l, offset: t - a }), t = e.shift()) : (i = o.nextNode(), a += l.data.length);
+  for (; t !== void 0 && l && a === t; )
     r.push({ node: l, offset: l.data.length }), t = e.shift();
   return t !== void 0 && console.error("Offset exceeds text length"), r;
 }, yt = (n, e, t, o) => {
@@ -348,17 +348,17 @@ const ze = (n) => {
   if (!i)
     return null;
   if (e.length > 32) {
-    const l = e.slice(0, 32), d = e.slice(-32), m = o - t;
-    let c = r.match_main(i, l, t);
-    const g = r.match_main(i, d, o), h = g + d.length;
-    if (c === -1 || g === -1)
+    const l = e.slice(0, 32), a = e.slice(-32), m = o - t;
+    let d = r.match_main(i, l, t);
+    const g = r.match_main(i, a, o), h = g + a.length;
+    if (d === -1 || g === -1)
       return null;
-    const u = h - c, E = Math.abs(u - m);
-    if ((c > h || E > 5) && (r.Match_Distance = e.length + 100, c = r.match_main(i, l, h), c !== -1 && c < h))
-      return yt(n, c, h, m);
-    if (c < h && E <= 5)
+    const u = h - d, S = Math.abs(u - m);
+    if ((d > h || S > 5) && (r.Match_Distance = e.length + 100, d = r.match_main(i, l, h), d !== -1 && d < h))
+      return yt(n, d, h, m);
+    if (d < h && S <= 5)
       return X.fromSelector(n, {
-        start: c,
+        start: d,
         end: h
       });
   } else {
@@ -384,7 +384,7 @@ const ze = (n) => {
   for (const i of e) {
     const l = St(i, n);
     if (l) {
-      const d = l.toRange(), m = d && Y.fromRange(n, d);
+      const a = l.toRange(), m = a && Y.fromRange(n, a);
       o.push({
         id: i.id,
         reaction: i.reaction,
@@ -415,22 +415,22 @@ const ze = (n) => {
   if (!e) return;
   const { highlightData: t, id: o } = n, { range: r } = t ?? {};
   r && ((l = Y.fromSelector(e, r)) == null ? void 0 : l.toRange()) && Rt({ id: o });
-}, It = (n) => {
+}, Tt = (n) => {
   const e = document.getElementById(ve(n));
   if (e) {
     const t = e.getBoundingClientRect();
     t.top >= 0 && t.left >= 0 && t.bottom <= (window.innerHeight || document.documentElement.clientHeight) && t.right <= (window.innerWidth || document.documentElement.clientWidth) || e.scrollIntoView({ behavior: "smooth", block: "start" });
   }
-}, se = 90, ie = 172, Tt = (n) => {
+}, se = 90, ie = 172, Ct = (n) => {
   const e = n.getClientRects();
   if (!e.length)
     return null;
-  const t = e[0], o = e[e.length - 1], r = 4, i = 16, l = window.innerWidth || document.documentElement.clientWidth, d = window.innerHeight || document.documentElement.clientHeight, m = (f) => {
-    const v = f + ie;
-    return f >= i && v <= l - i;
-  }, c = (f) => {
-    const v = f + se;
-    return f >= i && v <= d - i;
+  const t = e[0], o = e[e.length - 1], r = 4, i = 16, l = window.innerWidth || document.documentElement.clientWidth, a = window.innerHeight || document.documentElement.clientHeight, m = (f) => {
+    const y = f + ie;
+    return f >= i && y <= l - i;
+  }, d = (f) => {
+    const y = f + se;
+    return f >= i && y <= a - i;
   };
   let g;
   const h = t.right - ie;
@@ -441,25 +441,25 @@ const ze = (n) => {
     if (m(f))
       g = f;
     else {
-      const y = (t.left + t.right) / 2 - ie / 2;
-      m(y) ? g = y : h < i ? g = i : g = l - ie - i;
+      const E = (t.left + t.right) / 2 - ie / 2;
+      m(E) ? g = E : h < i ? g = i : g = l - ie - i;
     }
   }
   let u;
-  const E = o.bottom + r;
-  if (c(E))
-    u = E;
+  const S = o.bottom + r;
+  if (d(S))
+    u = S;
   else {
     const f = t.top - se - r;
-    c(f) ? u = f : E + se > d - i ? u = d - se - i : u = i;
+    d(f) ? u = f : S + se > a - i ? u = a - se - i : u = i;
   }
   return { top: u, left: g };
-}, Ct = (n, e) => {
+}, It = (n, e) => {
   for (const t of e)
     if (n.start < t.end && n.end > t.start)
       return !0;
   return !1;
-}, Se = (n) => `highlight-wrapper-${n}`, ve = (n) => `${Se(n)}-start`, Ue = (n) => `${Se(n)}-end`, oe = (n) => `[data-highlight-id="${CSS.escape(n)}"]`, Ie = (n, e) => {
+}, Se = (n) => `highlight-wrapper-${n}`, ve = (n) => `${Se(n)}-start`, Ue = (n) => `${Se(n)}-end`, oe = (n) => `[data-highlight-id="${CSS.escape(n)}"]`, Te = (n, e) => {
   const t = Number.parseInt(n.slice(1, 3), 16), o = Number.parseInt(n.slice(3, 5), 16), r = Number.parseInt(n.slice(5, 7), 16);
   return `rgba(${t}, ${o}, ${r}, ${e})`;
 }, xt = (n, e) => {
@@ -499,36 +499,36 @@ const ze = (n) => {
     Ot(e, t);
     return;
   }
-  const l = e.type === w.IMPORTANT ? t.colors.importantBackground : t.colors.confusingBackground, m = e.id === e.selectedNoteId ? l : Ie(l, 0.5), c = e.type === w.IMPORTANT ? t.colors.importantUnderline : t.colors.confusingUnderline, g = e.type === w.IMPORTANT ? "solid" : "dashed", h = n.toString(), u = document.createElement("span");
+  const l = e.type === w.IMPORTANT ? t.colors.importantBackground : t.colors.confusingBackground, m = e.id === e.selectedNoteId ? l : Te(l, 0.5), d = e.type === w.IMPORTANT ? t.colors.importantUnderline : t.colors.confusingUnderline, g = e.type === w.IMPORTANT ? "solid" : "dashed", h = n.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 E = document.createElement("span");
-  E.id = Ue(o), E.className = "highlight-marker-end", E.dataset.highlightId = o || "";
+  const S = document.createElement("span");
+  S.id = Ue(o), S.className = "highlight-marker-end", S.dataset.highlightId = o || "";
   const f = n.cloneRange();
-  f.collapse(!1), f.insertNode(E);
-  const v = n.cloneRange();
-  v.collapse(!0), v.insertNode(u);
-  const y = document.createRange();
-  y.setStartAfter(u), y.setEndBefore(E);
-  const F = wt(y).filter((N) => N.textContent && N.textContent.length > 0);
-  F.forEach((N, C) => {
+  f.collapse(!1), f.insertNode(S);
+  const y = n.cloneRange();
+  y.collapse(!0), y.insertNode(u);
+  const E = document.createRange();
+  E.setStartAfter(u), E.setEndBefore(S);
+  const M = wt(E).filter((N) => N.textContent && N.textContent.length > 0);
+  M.forEach((N, I) => {
     var Z;
     const k = N.parentElement;
     if ((k == null ? void 0 : k.dataset.highlightId) === o) return;
-    const x = C === 0, O = C === F.length - 1, _ = F.length === 1;
-    let M;
-    _ ? M = "single" : x ? M = "first" : O ? M = "last" : M = "middle";
+    const x = I === 0, O = I === M.length - 1, _ = M.length === 1;
+    let F;
+    _ ? F = "single" : x ? F = "first" : O ? F = "last" : F = "middle";
     const D = document.createElement("span");
-    D.className = "highlight-content", D.dataset.highlightId = o || "", D.dataset.position = M, D.style.backgroundColor = m, D.style.textDecorationLine = "underline", D.style.textDecorationColor = c, D.style.textDecorationStyle = g, D.style.textDecorationThickness = t.borderWidthSmall, D.style.textUnderlineOffset = t.underlineOffset, D.style.cursor = "pointer", D.addEventListener("click", (R) => {
+    D.className = "highlight-content", D.dataset.highlightId = o || "", D.dataset.position = F, D.style.backgroundColor = m, D.style.textDecorationLine = "underline", D.style.textDecorationColor = d, D.style.textDecorationStyle = g, D.style.textDecorationThickness = t.borderWidthSmall, D.style.textUnderlineOffset = t.underlineOffset, D.style.cursor = "pointer", D.addEventListener("click", (R) => {
       var b;
       R.target.tagName !== "A" && ((b = e.onClick) == null || b.call(e));
     }), (Z = N.parentNode) == null || Z.insertBefore(D, N), D.appendChild(N);
   }), u.addEventListener("click", (N) => {
-    var C;
-    N.target.tagName !== "A" && ((C = e.onClick) == null || C.call(e));
+    var I;
+    N.target.tagName !== "A" && ((I = e.onClick) == null || I.call(e));
   }), u.addEventListener("keydown", (N) => {
-    var C;
+    var I;
     if (N.key === "Enter" || N.key === " ")
-      N.preventDefault(), (C = e.onClick) == null || C.call(e);
+      N.preventDefault(), (I = e.onClick) == null || I.call(e);
     else if (N.key === "Tab" && !N.shiftKey) {
       const k = document.querySelectorAll(oe(o));
       for (const x of k) {
@@ -542,19 +542,19 @@ const ze = (n) => {
   }), u.addEventListener("focus", () => {
     document.querySelectorAll(
       oe(o)
-    ).forEach((C) => {
-      C.classList.add("highlight-focused");
+    ).forEach((I) => {
+      I.classList.add("highlight-focused");
     });
   }), u.addEventListener("blur", () => {
     document.querySelectorAll(
       oe(o)
-    ).forEach((C) => {
-      C.classList.remove("highlight-focused");
+    ).forEach((I) => {
+      I.classList.remove("highlight-focused");
     });
   });
 };
 function Ot(n, e) {
-  const t = n.type === w.IMPORTANT ? e.colors.importantBackground : e.colors.confusingBackground, r = n.id === n.selectedNoteId ? t : Ie(t, 0.5);
+  const t = n.type === w.IMPORTANT ? e.colors.importantBackground : e.colors.confusingBackground, r = n.id === n.selectedNoteId ? t : Te(t, 0.5);
   document.querySelectorAll(
     oe(n.id ?? "")
   ).forEach((l) => {
@@ -571,7 +571,7 @@ const Rt = (n) => {
       (l = i.parentNode) == null || l.insertBefore(i.firstChild, i);
     i.remove();
   }), t == null || t.remove(), o == null || o.remove();
-}, te = {
+}, ne = {
   all: ["notebook"],
   notes: (n) => ["notebook", "notes", n]
 };
@@ -580,7 +580,7 @@ function Dt(n) {
   return pe({
     mutationFn: (t) => n.createNote(t),
     onSuccess: () => {
-      e.invalidateQueries({ queryKey: te.all });
+      e.invalidateQueries({ queryKey: ne.all });
     }
   });
 }
@@ -589,7 +589,7 @@ function Lt(n) {
   return pe({
     mutationFn: (t) => n.deleteNote(t),
     onSuccess: () => {
-      e.invalidateQueries({ queryKey: te.all });
+      e.invalidateQueries({ queryKey: ne.all });
     }
   });
 }
@@ -599,7 +599,7 @@ function $e({
   ...t
 }) {
   return et({
-    queryKey: te.notes(t),
+    queryKey: ne.notes(t),
     queryFn: () => n.getNotes(t),
     enabled: e
   });
@@ -609,14 +609,14 @@ function At(n) {
   return pe({
     mutationFn: ({ id: t, input: o }) => n.updateNote(t, o),
     onMutate: async ({ id: t, input: o }) => {
-      await e.cancelQueries({ queryKey: te.all });
-      const i = e.getQueryCache().findAll({ queryKey: te.all }), l = /* @__PURE__ */ new Map();
-      for (const d of i) {
-        const m = d.state.data;
-        m && (l.set(d.queryKey, m), e.setQueryData(d.queryKey, {
+      await e.cancelQueries({ queryKey: ne.all });
+      const i = e.getQueryCache().findAll({ queryKey: ne.all }), l = /* @__PURE__ */ new Map();
+      for (const a of i) {
+        const m = a.state.data;
+        m && (l.set(a.queryKey, m), e.setQueryData(a.queryKey, {
           ...m,
           notes: m.notes.map(
-            (c) => c.id === t ? { ...c, ...o, updatedAt: (/* @__PURE__ */ new Date()).toISOString() } : c
+            (d) => d.id === t ? { ...d, ...o, updatedAt: (/* @__PURE__ */ new Date()).toISOString() } : d
           )
         }));
       }
@@ -628,18 +628,18 @@ function At(n) {
           e.setQueryData(i, l);
     },
     onSettled: () => {
-      e.invalidateQueries({ queryKey: te.all });
+      e.invalidateQueries({ queryKey: ne.all });
     }
   });
 }
-const Pt = "Notebook", _t = "Notes", Ft = "Important", Mt = "Unclear", Ht = "Back", Bt = "Edit note", Wt = "Save", zt = "Cancel", jt = "Delete note", Ut = "note", $t = "Add note (optional)", qt = "Remove from Notebook", Gt = "Add a note (optional)", Kt = "Mark important", Xt = "Mark unclear", Qt = "Saved to Notebook.", Vt = "Note updated", Yt = "Note deleted", Zt = "Error saving to Notebook.", Jt = "Error updating note", en = "Note deletion failed", tn = "Loading notes", nn = "Failed to load notes", on = "Start capturing your notes", rn = "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.", sn = "Nothing here yet", ln = "Adjust your filters or create a new note to get started.", an = "You have no notes for the selected filter", cn = "Previous page", dn = "Next page", un = "All courses", fn = "All notes", mn = "Close Notebook panel", hn = "To use the Notebook feature, highlight an excerpt from your learning material to flag it as 'confusing' or 'important' and leave an optional note.", gn = "The content you highlighted is no longer available.", Te = {
+const Pt = "Notebook", _t = "Notes", Ft = "Important", Mt = "Unclear", Ht = "Back", Wt = "Edit note", Bt = "Save", zt = "Cancel", jt = "Delete note", Ut = "note", $t = "Add note (optional)", qt = "Remove from Notebook", Gt = "Add a note (optional)", Kt = "Mark important", Xt = "Mark unclear", Qt = "Saved to Notebook.", Vt = "Note updated", Yt = "Note deleted", Zt = "Error saving to Notebook.", Jt = "Error updating note", en = "Note deletion failed", tn = "Loading notes", nn = "Failed to load notes", on = "Start capturing your notes", rn = "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.", sn = "Nothing here yet", ln = "Adjust your filters or create a new note to get started.", an = "You have no notes for the selected filter", cn = "Previous page", dn = "Next page", un = "All courses", fn = "All notes", mn = "Close Notebook panel", hn = "To use the Notebook feature, highlight an excerpt from your learning material to flag it as 'confusing' or 'important' and leave an optional note.", gn = "The content you highlighted is no longer available.", Ce = {
   notebook: Pt,
   notes: _t,
   important: Ft,
   unclear: Mt,
   back: Ht,
-  editNote: Bt,
-  save: Wt,
+  editNote: Wt,
+  save: Bt,
   cancel: zt,
   deleteNote: jt,
   note: Ut,
@@ -670,7 +670,7 @@ const Pt = "Notebook", _t = "Notes", Ft = "Important", Mt = "Unclear", Ht = "Bac
   highlightUnavailable: gn
 }, qe = Pe(null);
 function Ge(n, e) {
-  const t = Te[n] ?? n;
+  const t = Ce[n] ?? n;
   return e ? t.replace(/%\{([^}]+)}/g, (o, r) => String(e[r] ?? `%{${r}}`)) : t;
 }
 function pn({
@@ -680,7 +680,7 @@ function pn({
 }) {
   const o = re(
     () => ({
-      translations: { ...Te, ...n },
+      translations: { ...Ce, ...n },
       translate: e ?? Ge
     }),
     [n, e]
@@ -689,7 +689,7 @@ function pn({
 }
 function G() {
   const n = _e(qe);
-  return n || { translations: Te, translate: Ge };
+  return n || { translations: Ce, translate: Ge };
 }
 const Nn = {
   selectedNoteId: null,
@@ -725,11 +725,12 @@ function Qn({
   courseId: r,
   pageLastModifiedAt: i,
   onAnalyticsEvent: l,
-  translations: d,
-  translate: m,
-  children: c
+  onOpen: a,
+  translations: m,
+  translate: d,
+  children: g
 }) {
-  const [g, h] = Fe(bn, Nn), u = re(
+  const [h, u] = Fe(bn, Nn), S = V(!1), f = re(
     () => ({
       api: n,
       currentUserId: e,
@@ -738,12 +739,16 @@ function Qn({
       courseId: r,
       pageLastModifiedAt: i,
       onAnalyticsEvent: l,
-      ...g,
-      selectNote: (E, f = !1) => h({ type: "SELECT_NOTE", payload: { id: E, isEditing: f } }),
-      clearSelectedNote: () => h({ type: "CLEAR_SELECTED_NOTE" }),
-      setEditing: (E) => h({ type: "SET_EDITING", payload: E }),
-      openTray: () => h({ type: "OPEN_TRAY" }),
-      closeTray: () => h({ type: "CLOSE_TRAY" })
+      ...h,
+      selectNote: (y, E = !1) => u({ type: "SELECT_NOTE", payload: { id: y, isEditing: E } }),
+      clearSelectedNote: () => u({ type: "CLEAR_SELECTED_NOTE" }),
+      setEditing: (y) => u({ type: "SET_EDITING", payload: y }),
+      openTray: () => {
+        S.current || (S.current = !0, a == null || a()), u({ type: "OPEN_TRAY" });
+      },
+      closeTray: () => {
+        S.current = !1, u({ type: "CLOSE_TRAY" });
+      }
     }),
     [
       n,
@@ -753,10 +758,11 @@ function Qn({
       r,
       i,
       l,
-      g
+      a,
+      h
     ]
   );
-  return /* @__PURE__ */ s(Ke.Provider, { value: u, children: /* @__PURE__ */ s(pn, { translations: d, translate: m, children: c }) });
+  return /* @__PURE__ */ s(Ke.Provider, { value: f, children: /* @__PURE__ */ s(pn, { translations: m, translate: d, children: g }) });
 }
 function Xe() {
   const n = _e(Ke);
@@ -765,19 +771,44 @@ function Xe() {
   return n;
 }
 const yn = ({ currentType: n, onSelectReaction: e }) => {
-  const { translations: t } = G(), o = ne(null), r = ne(null);
-  return Q(() => {
+  const { translations: t } = G(), o = V(null), r = V(null);
+  return ee(() => {
     n === w.CONFUSING && o.current ? o.current.focus() : n === w.IMPORTANT && r.current ? r.current.focus() : o.current && o.current.focus();
-  }, [n]), /* @__PURE__ */ S(ee, { children: [
-    /* @__PURE__ */ S(ee.Item, { ref: o, onClick: () => e(w.CONFUSING), children: [
-      /* @__PURE__ */ s(Ne, { size: "x-small" }),
-      ` ${t.markUnclear}`
-    ] }),
-    /* @__PURE__ */ S(ee.Item, { ref: r, onClick: () => e(w.IMPORTANT), children: [
-      /* @__PURE__ */ s(be, { size: "x-small" }),
-      ` ${t.markImportant}`
-    ] })
-  ] });
+  }, [n]), /* @__PURE__ */ s(
+    z,
+    {
+      as: "div",
+      background: "primary",
+      borderWidth: "small",
+      borderColor: "secondary",
+      borderRadius: "medium",
+      shadow: "resting",
+      children: /* @__PURE__ */ T(te, { children: [
+        /* @__PURE__ */ T(
+          te.Item,
+          {
+            ref: o,
+            onClick: () => e(w.CONFUSING),
+            children: [
+              /* @__PURE__ */ s(Ne, { size: "x-small" }),
+              ` ${t.markUnclear}`
+            ]
+          }
+        ),
+        /* @__PURE__ */ T(
+          te.Item,
+          {
+            ref: r,
+            onClick: () => e(w.IMPORTANT),
+            children: [
+              /* @__PURE__ */ s(be, { size: "x-small" }),
+              ` ${t.markImportant}`
+            ]
+          }
+        )
+      ] })
+    }
+  );
 }, de = "notebook-inline-reaction-menu";
 function Vn({
   containerRef: n,
@@ -789,9 +820,9 @@ function Vn({
     objectId: r,
     objectType: i,
     courseId: l,
-    pageLastModifiedAt: d,
+    pageLastModifiedAt: a,
     selectedNoteId: m,
-    selectNote: c,
+    selectNote: d,
     openTray: g
   } = Xe(), { data: h } = $e({
     api: o,
@@ -800,115 +831,114 @@ function Vn({
     },
     courseId: l,
     pageSize: 100
-  }), { mutate: u } = Dt(o), { mutate: E } = At(o), { mutate: f } = Lt(o), v = ne([]), [y, H] = B([]), [F, N] = B(null), [C, k] = B(""), [x, O] = B(null), [_, M] = B(!1);
-  Q(() => {
+  }), { mutate: u } = Dt(o), { mutate: S } = At(o), { mutate: f } = Lt(o), y = V([]), [E, H] = W([]), [M, N] = W(null), [I, k] = W(""), [x, O] = W(null), [_, F] = W(!1);
+  ee(() => {
     const R = n.current;
     if (!R) return;
     const b = R.closest(".user_content") ?? R;
     if (b.classList.contains("enhanced")) {
-      M(!0);
+      F(!0);
       return;
     }
     const P = new MutationObserver((L) => {
       for (const p of L)
         if (p.type === "attributes" && p.attributeName === "class" && p.target.classList.contains("enhanced")) {
-          M(!0), P.disconnect();
+          F(!0), P.disconnect();
           return;
         }
     });
     return P.observe(b, { attributes: !0, attributeFilter: ["class"] }), () => P.disconnect();
-  }, [n]), Q(() => {
+  }, [n]), ee(() => {
     if (!_ || !n.current) return;
     let b = null;
     const P = () => {
       b && clearTimeout(b), b = setTimeout(() => {
         var xe;
-        const I = window.getSelection(), A = n.current;
-        if (!(I != null && I.rangeCount) || !A) return;
-        const j = I.toString().trim();
+        const v = window.getSelection(), A = n.current;
+        if (!(v != null && v.rangeCount) || !A) return;
+        const j = v.toString().trim();
         if (j === "") return;
-        const J = I.getRangeAt(0);
+        const J = v.getRangeAt(0);
         if (!A.contains(J.commonAncestorContainer)) return;
-        const Ce = (xe = X.fromRange(A, J)) == null ? void 0 : xe.toSelector();
-        Ce && !Ct(Ce, y) && (N(J.cloneRange()), k(j), O(Tt(J)));
+        const Ie = (xe = X.fromRange(A, J)) == null ? void 0 : xe.toSelector();
+        Ie && !It(Ie, E) && (N(J.cloneRange()), k(j), O(Ct(J)));
       }, t);
-    }, L = (I) => {
-      if (!(I.target instanceof Node)) return;
+    }, L = (v) => {
+      if (!(v.target instanceof Node)) return;
       const A = document.getElementById(de);
-      A != null && A.contains(I.target) ? (I.preventDefault(), I.stopImmediatePropagation()) : (O(null), N(null), k(""));
+      A != null && A.contains(v.target) ? (v.preventDefault(), v.stopImmediatePropagation()) : (O(null), N(null), k(""));
     }, p = () => {
       O(null), N(null), k("");
     };
     return document.addEventListener("selectionchange", P), document.addEventListener("mousedown", L), document.addEventListener("touchstart", L), window.addEventListener("scroll", p, !0), () => {
       b && clearTimeout(b), document.removeEventListener("selectionchange", P), document.removeEventListener("mousedown", L), document.removeEventListener("touchstart", L), window.removeEventListener("scroll", p, !0);
     };
-  }, [_, y, t, n]), Q(() => {
-    m && It(m);
-  }, [m]);
+  }, [_, E, t, n]);
   const D = K(
     (R) => {
       var j;
       const b = n.current;
       if (!b || !R.highlightData) return null;
-      const { highlightData: P, reaction: L, id: p } = R, { range: I } = P, A = I && ((j = Y.fromSelector(b, I)) == null ? void 0 : j.toRange());
+      const { highlightData: P, reaction: L, id: p } = R, { range: v } = P, A = v && ((j = Y.fromSelector(b, v)) == null ? void 0 : j.toRange());
       if (A) {
         const J = {
           id: p,
           selectedNoteId: m,
           type: L[0],
           onClick: () => {
-            c(p), g();
+            d(p), g();
           }
         };
         return kt(A, J, e), P.textPosition;
       }
       return null;
     },
-    [n, m, e, c, g]
+    [n, m, e, d, g]
   );
-  Q(() => {
+  ee(() => {
     if (!_ || !h || !n.current) return;
     const R = n.current, b = h.notes, P = /* @__PURE__ */ new Set(), L = [], p = [];
     if (b.length === 0) {
-      if (v.current.length > 0) {
-        for (const I of v.current)
-          Le(I, R);
-        v.current = [], H([]);
+      if (y.current.length > 0) {
+        for (const v of y.current)
+          Le(v, R);
+        y.current = [], H([]);
       }
       return;
     }
-    if (d && b[0].highlightData.pageLastModifiedAt !== d) {
-      const { notesForUpdate: I, noteIdsForDelete: A } = vt(
+    if (a && b[0].highlightData.pageLastModifiedAt !== a) {
+      const { notesForUpdate: v, noteIdsForDelete: A } = vt(
         R,
         b,
-        d
+        a
       );
-      for (const j of I)
-        E({ id: j.id, input: j });
+      for (const j of v)
+        S({ id: j.id, input: j });
       for (const j of A)
         f(j);
     } else {
-      for (const I of b) {
-        const A = D(I);
-        P.add(I.id), A && (L.push(I), p.push(A));
+      for (const v of b) {
+        const A = D(v);
+        P.add(v.id), A && (L.push(v), p.push(A));
       }
-      for (const I of v.current)
-        P.has(I.id) || Le(I, R);
-      H(p), v.current = L;
+      for (const v of y.current)
+        P.has(v.id) || Le(v, R);
+      H(p), y.current = L, m && Tt(m);
     }
   }, [
     _,
     h,
     D,
-    d,
+    a,
     n,
-    E,
-    f
+    S,
+    f,
+    m
   ]);
   const Z = (R) => {
     const b = n.current;
-    if (!F || !b) return;
-    const P = Y.fromRange(b, F), L = X.fromRange(b, F);
+    if (!M || !b) return;
+    const P = Y.fromRange(b, M), L = X.fromRange(b, M);
     u(
       {
         courseId: l,
@@ -917,22 +947,22 @@ function Vn({
         userText: "",
         reaction: [R],
         highlightData: {
-          selectedText: C,
+          selectedText: I,
           textPosition: (L == null ? void 0 : L.toSelector()) ?? null,
           range: P.toSelector(),
-          pageLastModifiedAt: d ?? ""
+          pageLastModifiedAt: a ?? ""
         }
       },
       {
         onSuccess: (p) => {
           var A;
-          const I = p.id;
-          N(null), k(""), O(null), (A = window.getSelection()) == null || A.removeAllRanges(), c(I), g();
+          const v = p.id;
+          N(null), k(""), O(null), (A = window.getSelection()) == null || A.removeAllRanges(), d(v), g();
         }
       }
     );
   };
-  return !F || !x ? null : Ze(
+  return !M || !x ? null : Ze(
     /* @__PURE__ */ s(
       "div",
       {
@@ -967,7 +997,7 @@ const En = (n, e) => ({
 }) => {
   const r = En(e, o), l = {
     position: "relative",
-    backgroundColor: t ? r.backgroundColor : Ie(r.backgroundColor, 0.5),
+    backgroundColor: t ? r.backgroundColor : Te(r.backgroundColor, 0.5),
     textDecorationLine: "underline",
     textDecorationStyle: r.underlineStyle,
     textDecorationColor: r.underlineColor,
@@ -978,9 +1008,9 @@ const En = (n, e) => ({
   return /* @__PURE__ */ s("span", { "data-note-highlight": "true", style: l, children: n });
 }, Qe = () => {
   const { translations: n } = G();
-  return /* @__PURE__ */ S(T, { gap: "xx-small", alignItems: "start", as: "div", children: [
-    /* @__PURE__ */ s(T.Item, { as: "div", children: /* @__PURE__ */ s(tt, { color: "error" }) }),
-    /* @__PURE__ */ s(T.Item, { padding: "xxx-small none", shouldShrink: !0, children: /* @__PURE__ */ s(me, { maxLines: 3, children: n.highlightUnavailable }) })
+  return /* @__PURE__ */ T(C, { gap: "xx-small", alignItems: "start", as: "div", children: [
+    /* @__PURE__ */ s(C.Item, { as: "div", children: /* @__PURE__ */ s(tt, { color: "error" }) }),
+    /* @__PURE__ */ s(C.Item, { padding: "xxx-small none", shouldShrink: !0, children: /* @__PURE__ */ s(me, { maxLines: 3, children: n.highlightUnavailable }) })
   ] });
 }, Sn = {
   filter: null,
@@ -1006,26 +1036,26 @@ function Yn({
   learningObject: o,
   pageSize: r = 16
 }) {
-  const [i, l] = Fe(vn, Sn), { filter: d, courseFilter: m, pageParamsWithDirection: c } = i;
-  Q(() => {
-    Object.keys(c).length > 0 && l({ type: "SET_PAGE_PARAMS_WITH_DIRECTION", payload: {} });
+  const [i, l] = Fe(vn, Sn), { filter: a, courseFilter: m, pageParamsWithDirection: d } = i;
+  ee(() => {
+    Object.keys(d).length > 0 && l({ type: "SET_PAGE_PARAMS_WITH_DIRECTION", payload: {} });
   }, [r]);
-  const g = t ? m : e, { direction: h, pageParams: u } = c, E = h === "next" ? (u == null ? void 0 : u.endCursor) ?? void 0 : h === "prev" ? (u == null ? void 0 : u.startCursor) ?? void 0 : void 0, { data: f, isLoading: v, isError: y } = $e({
+  const g = t ? m : e, { direction: h, pageParams: u } = d, S = h === "next" ? (u == null ? void 0 : u.endCursor) ?? void 0 : h === "prev" ? (u == null ? void 0 : u.startCursor) ?? void 0 : void 0, { data: f, isLoading: y, isError: E } = $e({
     api: n,
     filter: {
       ...g ? { courseId: g } : {},
-      ...d ? { reactions: [d] } : {},
+      ...a ? { reactions: [a] } : {},
       ...o ? { learningObject: o } : {}
     },
-    cursor: E,
+    cursor: S,
     direction: h,
     pageSize: r
-  }), H = (f == null ? void 0 : f.notes) ?? [], F = f == null ? void 0 : f.pageInfo, N = K(() => {
+  }), H = (f == null ? void 0 : f.notes) ?? [], M = f == null ? void 0 : f.pageInfo, N = K(() => {
     l({
       type: "SET_PAGE_PARAMS_WITH_DIRECTION",
       payload: { pageParams: f == null ? void 0 : f.pageInfo, direction: "next" }
     });
-  }, [f == null ? void 0 : f.pageInfo]), C = K(() => {
+  }, [f == null ? void 0 : f.pageInfo]), I = K(() => {
     l({
       type: "SET_PAGE_PARAMS_WITH_DIRECTION",
       payload: { pageParams: f == null ? void 0 : f.pageInfo, direction: "prev" }
@@ -1037,15 +1067,15 @@ function Yn({
   }, []);
   return {
     notes: H,
-    pageInfo: F,
-    isLoading: v,
-    isError: y,
-    filter: d,
+    pageInfo: M,
+    isLoading: y,
+    isError: E,
+    filter: a,
     courseFilter: m,
     setFilter: k,
     setCourseFilter: x,
     fetchNextPage: N,
-    fetchPreviousPage: C
+    fetchPreviousPage: I
   };
 }
 const ue = "all";
@@ -1058,8 +1088,8 @@ function Zn({ filter: n, setFilter: e }) {
     ],
     [t]
   ), r = K(
-    (l, { value: d }) => {
-      e(!d || d === ue ? null : d);
+    (l, { value: a }) => {
+      e(!a || a === ue ? null : a);
     },
     [e]
   );
@@ -1080,9 +1110,9 @@ function Zn({ filter: n, setFilter: e }) {
     handleReactionFilterChange: r
   };
 }
-const In = ({ hasActiveFilter: n = !1 }) => {
+const Tn = ({ hasActiveFilter: n = !1 }) => {
   const { translations: e } = G(), t = n ? e.nothingHereYet : e.emptyStateHeading, o = n ? e.adjustFiltersOrCreate : e.emptyStateDescription;
-  return /* @__PURE__ */ s(z, { as: "div", textAlign: "center", children: /* @__PURE__ */ S(T, { direction: "column", alignItems: "center", gap: "small", children: [
+  return /* @__PURE__ */ s(z, { as: "div", textAlign: "center", children: /* @__PURE__ */ T(C, { direction: "column", alignItems: "center", gap: "small", children: [
     !n && /* @__PURE__ */ s(nt, { size: "medium" }),
     /* @__PURE__ */ s(ae, { level: "h3", children: t }),
     /* @__PURE__ */ s(U, { color: "secondary", children: o })
@@ -1097,8 +1127,8 @@ const In = ({ hasActiveFilter: n = !1 }) => {
       onDismiss: t,
       placement: "end",
       size: "regular",
-      children: /* @__PURE__ */ S(T, { direction: "column", height: "100vh", children: [
-        /* @__PURE__ */ s(T.Item, { children: /* @__PURE__ */ s(z, { as: "div", padding: "small medium", borderWidth: "0 0 small 0", children: /* @__PURE__ */ S(T, { justifyItems: "space-between", alignItems: "center", children: [
+      children: /* @__PURE__ */ T(C, { direction: "column", height: "100vh", children: [
+        /* @__PURE__ */ s(C.Item, { children: /* @__PURE__ */ s(z, { as: "div", padding: "small medium", borderWidth: "0 0 small 0", children: /* @__PURE__ */ T(C, { justifyItems: "space-between", alignItems: "center", children: [
           /* @__PURE__ */ s(ae, { level: "h3", children: o.notebook }),
           /* @__PURE__ */ s(
             it,
@@ -1110,11 +1140,11 @@ const In = ({ hasActiveFilter: n = !1 }) => {
             }
           )
         ] }) }) }),
-        /* @__PURE__ */ s(T.Item, { shouldGrow: !0, shouldShrink: !0, overflowY: "auto", overflowX: "hidden", children: n })
+        /* @__PURE__ */ s(C.Item, { shouldGrow: !0, shouldShrink: !0, overflowY: "auto", overflowX: "hidden", children: n })
       ] })
     }
   );
-}, Tn = {
+}, Cn = {
   [w.IMPORTANT]: {
     color: "success",
     translationKey: "important",
@@ -1126,27 +1156,27 @@ const In = ({ hasActiveFilter: n = !1 }) => {
     icon: /* @__PURE__ */ s(Ne, { size: "x-small" })
   }
 }, Ve = ({ type: n, onTypeChange: e, renderAsMenuTrigger: t = !1 }) => {
-  const { translations: o } = G(), r = Tn[n], i = o[r.translationKey], [l, d] = B(!1), m = ne(null), c = ne(null), g = K(
+  const { translations: o } = G(), r = Cn[n], i = o[r.translationKey], [l, a] = W(!1), m = V(null), d = V(null), g = K(
     (h) => {
-      e == null || e(h), d(!1);
+      e == null || e(h), a(!1);
     },
     [e]
   );
-  return t && e ? /* @__PURE__ */ S(
-    ee,
+  return t && e ? /* @__PURE__ */ T(
+    te,
     {
       placement: "bottom start",
       show: l,
-      onToggle: (h) => d(h),
+      onToggle: (h) => a(h),
       shouldHideOnSelect: !0,
       shouldFocusTriggerOnClose: !0,
       trigger: /* @__PURE__ */ s(ke, { color: r.color, renderIcon: r.icon, children: i }),
       children: [
-        /* @__PURE__ */ S(ee.Item, { ref: m, onClick: () => g(w.CONFUSING), children: [
+        /* @__PURE__ */ T(te.Item, { ref: m, onClick: () => g(w.CONFUSING), children: [
           /* @__PURE__ */ s(Ne, { size: "x-small" }),
           ` ${o.markUnclear}`
         ] }),
-        /* @__PURE__ */ S(ee.Item, { ref: c, onClick: () => g(w.IMPORTANT), children: [
+        /* @__PURE__ */ T(te.Item, { ref: d, onClick: () => g(w.IMPORTANT), children: [
           /* @__PURE__ */ s(be, { size: "x-small" }),
           ` ${o.markImportant}`
         ] })
@@ -1161,7 +1191,7 @@ function Ae(n, e) {
     day: "numeric"
   });
 }
-const Cn = ({
+const In = ({
   noteId: n,
   date: e,
   highlight: t,
@@ -1169,28 +1199,28 @@ const Cn = ({
   type: r,
   onClick: i,
   onDelete: l,
-  onSaveNote: d,
+  onSaveNote: a,
   onTypeChange: m,
-  isActive: c,
+  isActive: d,
   isPanelView: g = !1,
   courseName: h,
   locale: u,
-  highlightTheme: E,
+  highlightTheme: S,
   renderLink: f,
-  href: v
+  href: y
 }) => {
-  const { translations: y } = G(), [H, F] = B(!1), [N, C] = B(!1), [k, x] = B(o || ""), [O, _] = B(!1), M = ne(null), D = K((p) => {
-    M.current = p;
+  const { translations: E } = G(), [H, M] = W(!1), [N, I] = W(!1), [k, x] = W(o || ""), [O, _] = W(!1), F = V(null), D = K((p) => {
+    F.current = p;
   }, []);
-  Q(() => {
-    var p;
-    c && ((p = M.current) == null || p.scrollIntoView({ behavior: "smooth", block: "nearest" }));
-  }, [c]);
-  const Z = r === w.IMPORTANT ? y.important : y.unclear, R = (p) => {
+  ee(() => {
+    var p, v;
+    d && ((p = F.current) == null || p.scrollIntoView({ behavior: "smooth", block: "nearest" }), (v = F.current) == null || v.focus());
+  }, [d]);
+  const Z = r === w.IMPORTANT ? E.important : E.unclear, R = (p) => {
     p.key === "Enter" && (p.preventDefault(), i == null || i());
-  }, b = [Z, y.note];
+  }, b = [Z, E.note];
   t && b.push(t), o && b.push(o), e && b.push(Ae(e, u)), h && b.push(h);
-  const P = b.join(", "), L = /* @__PURE__ */ S(
+  const P = b.join(", "), L = /* @__PURE__ */ T(
     z,
     {
       as: "div",
@@ -1198,69 +1228,69 @@ const Cn = ({
       borderRadius: "medium",
       padding: "small",
       position: "relative",
-      role: v || N ? void 0 : "button",
-      "aria-label": v ? void 0 : P,
-      "aria-pressed": v || N ? void 0 : c,
-      tabIndex: v || c ? -1 : 0,
+      role: y || N ? void 0 : "button",
+      "aria-label": y ? void 0 : P,
+      "aria-pressed": y || N ? void 0 : d,
+      tabIndex: y || d ? -1 : 0,
       "data-testid": "note-card",
       elementRef: D,
-      onClick: c ? void 0 : i,
-      onMouseEnter: () => F(!0),
-      onMouseLeave: () => F(!1),
-      onKeyDown: c ? void 0 : R,
+      onClick: d ? void 0 : i,
+      onMouseEnter: () => M(!0),
+      onMouseLeave: () => M(!1),
+      onKeyDown: d ? void 0 : R,
       cursor: N ? "default" : "pointer",
       children: [
-        /* @__PURE__ */ S(T, { direction: "column", gap: "small", children: [
+        /* @__PURE__ */ T(C, { direction: "column", gap: "small", children: [
           /* @__PURE__ */ s(
             Ve,
             {
               type: r,
               onTypeChange: g && m ? (p) => m(n, p) : void 0,
-              renderAsMenuTrigger: g && !!m && !!c
+              renderAsMenuTrigger: g && !!m && !!d
             }
           ),
-          t ? /* @__PURE__ */ s("div", { style: { wordBreak: "break-word", overflowWrap: "break-word" }, children: /* @__PURE__ */ s(U, { children: c && g ? /* @__PURE__ */ s(
+          t ? /* @__PURE__ */ s("div", { style: { wordBreak: "break-word", overflowWrap: "break-word" }, children: /* @__PURE__ */ s(U, { children: d && g ? /* @__PURE__ */ s(
             he,
             {
               type: r,
-              isCardActive: !!c || H,
-              theme: E,
+              isCardActive: !!d || H,
+              theme: S,
               children: t
             }
           ) : /* @__PURE__ */ s(me, { maxLines: 3, truncate: "word", children: /* @__PURE__ */ s(
             he,
             {
               type: r,
-              isCardActive: !!c || H,
-              theme: E,
+              isCardActive: !!d || H,
+              theme: S,
               children: t
             }
           ) }) }) }) : /* @__PURE__ */ s(Qe, {}),
-          /* @__PURE__ */ S(T, { direction: "column", gap: "small", children: [
-            N && g ? /* @__PURE__ */ S(T, { direction: "column", gap: "x-small", children: [
+          /* @__PURE__ */ T(C, { direction: "column", gap: "small", children: [
+            N && g ? /* @__PURE__ */ T(C, { direction: "column", gap: "x-small", children: [
               /* @__PURE__ */ s(
                 He,
                 {
-                  label: /* @__PURE__ */ s(Me, { children: y.editNote }),
+                  label: /* @__PURE__ */ s(Me, { children: E.editNote }),
                   value: k,
                   onChange: (p) => x(p.target.value),
-                  placeholder: y.addNoteOptional
+                  placeholder: E.addNoteOptional
                 }
               ),
-              /* @__PURE__ */ S(T, { gap: "xx-small", children: [
-                /* @__PURE__ */ s(T.Item, { shouldGrow: !0, children: /* @__PURE__ */ s(
+              /* @__PURE__ */ T(C, { gap: "xx-small", children: [
+                /* @__PURE__ */ s(C.Item, { shouldGrow: !0, children: /* @__PURE__ */ s(
                   $,
                   {
                     display: "block",
                     size: "small",
                     "data-testid": "note-card-cancel",
                     onClick: () => {
-                      x(o || ""), C(!1);
+                      x(o || ""), I(!1);
                     },
-                    children: y.cancel
+                    children: E.cancel
                   }
                 ) }),
-                /* @__PURE__ */ s(T.Item, { shouldGrow: !0, children: /* @__PURE__ */ s(
+                /* @__PURE__ */ s(C.Item, { shouldGrow: !0, children: /* @__PURE__ */ s(
                   $,
                   {
                     display: "block",
@@ -1268,58 +1298,58 @@ const Cn = ({
                     size: "small",
                     "data-testid": "note-card-save",
                     onClick: () => {
-                      d == null || d(n, k), C(!1);
+                      a == null || a(n, k), I(!1);
                     },
                     interaction: k.trim() ? "enabled" : "disabled",
-                    children: y.save
+                    children: E.save
                   }
                 ) })
               ] })
-            ] }) : o ? /* @__PURE__ */ s("div", { style: { wordBreak: "break-word", overflowWrap: "break-word" }, children: c && g ? /* @__PURE__ */ S(U, { children: [
+            ] }) : o ? /* @__PURE__ */ s("div", { style: { wordBreak: "break-word", overflowWrap: "break-word" }, children: d && g ? /* @__PURE__ */ T(U, { children: [
               o,
               " ",
               /* @__PURE__ */ s(
-                V,
+                Q,
                 {
                   size: "small",
                   withBackground: !1,
                   withBorder: !1,
-                  screenReaderLabel: y.editNote,
+                  screenReaderLabel: E.editNote,
                   "data-testid": "note-card-edit",
                   onClick: (p) => {
-                    p.stopPropagation(), C(!0);
+                    p.stopPropagation(), I(!0);
                   },
                   children: /* @__PURE__ */ s(fe, {})
                 }
               )
-            ] }) : /* @__PURE__ */ s(U, { children: /* @__PURE__ */ s(me, { maxLines: 3, truncate: "word", children: o }) }) }) : g && c ? /* @__PURE__ */ s("div", { children: /* @__PURE__ */ S(U, { color: "secondary", children: [
-              y.addNotePrompt,
+            ] }) : /* @__PURE__ */ s(U, { children: /* @__PURE__ */ s(me, { maxLines: 3, truncate: "word", children: o }) }) }) : g && d ? /* @__PURE__ */ s("div", { children: /* @__PURE__ */ T(U, { color: "secondary", children: [
+              E.addNotePrompt,
               " ",
               /* @__PURE__ */ s(
-                V,
+                Q,
                 {
                   size: "small",
                   withBackground: !1,
                   withBorder: !1,
-                  screenReaderLabel: y.editNote,
+                  screenReaderLabel: E.editNote,
                   "data-testid": "note-card-edit",
                   onClick: (p) => {
-                    p.stopPropagation(), C(!0);
+                    p.stopPropagation(), I(!0);
                   },
                   children: /* @__PURE__ */ s(fe, {})
                 }
               )
             ] }) }) : null,
-            /* @__PURE__ */ S(T, { justifyItems: "space-between", alignItems: "center", children: [
+            /* @__PURE__ */ T(C, { justifyItems: "space-between", alignItems: "center", children: [
               /* @__PURE__ */ s(U, { size: "small", color: "secondary", children: Ae(e, u) }),
-              c && l && /* @__PURE__ */ s(
-                V,
+              d && l && /* @__PURE__ */ s(
+                Q,
                 {
                   size: "small",
                   withBackground: !1,
                   withBorder: !1,
                   color: "danger",
-                  screenReaderLabel: y.deleteNote,
+                  screenReaderLabel: E.deleteNote,
                   "data-testid": "note-card-delete",
                   onClick: (p) => {
                     p.stopPropagation(), _(!0);
@@ -1344,8 +1374,8 @@ const Cn = ({
             insetInlineStart: "0",
             insetInlineEnd: "0",
             stacking: "above",
-            children: /* @__PURE__ */ S(
-              T,
+            children: /* @__PURE__ */ T(
+              C,
               {
                 direction: "column",
                 justifyItems: "center",
@@ -1364,7 +1394,7 @@ const Cn = ({
                       onClick: (p) => {
                         p.stopPropagation(), l(n), _(!1);
                       },
-                      children: y.deleteNote
+                      children: E.deleteNote
                     }
                   ),
                   /* @__PURE__ */ s(
@@ -1376,7 +1406,7 @@ const Cn = ({
                       onClick: (p) => {
                         p.stopPropagation(), _(!1);
                       },
-                      children: y.cancel
+                      children: E.cancel
                     }
                   )
                 ]
@@ -1387,7 +1417,7 @@ const Cn = ({
       ]
     }
   );
-  return v && f ? f({ href: v, children: L, ariaLabel: P }) : L;
+  return y && f ? f({ href: y, children: L, ariaLabel: P }) : L;
 };
 function xn(n, e) {
   const t = Array.from({ length: e }, () => []);
@@ -1398,7 +1428,6 @@ function xn(n, e) {
 const wn = {
   display: "flex",
   gap: "1rem",
-  padding: "1rem",
   boxSizing: "border-box",
   width: "100%",
   alignItems: "flex-start"
@@ -1416,28 +1445,28 @@ const wn = {
   onPreviousPage: r,
   onNextPage: i,
   onNoteSelect: l,
-  onNoteDelete: d,
+  onNoteDelete: a,
   onNoteSave: m,
-  onNoteTypeChange: c,
+  onNoteTypeChange: d,
   selectedNoteId: g,
   hasActiveFilter: h = !1,
   columnCount: u = 1,
-  highlightTheme: E,
+  highlightTheme: S,
   locale: f,
-  renderNoteLink: v,
-  noteHref: y
+  renderNoteLink: y,
+  noteHref: E
 }) => {
-  const { translations: H } = G(), F = re(
+  const { translations: H } = G(), M = re(
     () => xn(n, u),
     [n, u]
   ), N = (o == null ? void 0 : o.hasNextPage) || (o == null ? void 0 : o.hasPreviousPage);
-  return e ? /* @__PURE__ */ s(z, { as: "div", textAlign: "center", padding: "large", "data-testid": "notes-loading", children: /* @__PURE__ */ s(at, { renderTitle: H.loadingNotes }) }) : t ? /* @__PURE__ */ s(z, { as: "div", textAlign: "center", padding: "large", "data-testid": "notes-error", children: /* @__PURE__ */ s(ae, { level: "h4", children: H.failedToLoadNotes }) }) : n.length === 0 ? /* @__PURE__ */ s(z, { as: "div", padding: "large", "data-testid": "empty-notes", children: /* @__PURE__ */ s(In, { hasActiveFilter: h }) }) : /* @__PURE__ */ S(Ye, { children: [
-    /* @__PURE__ */ s("div", { style: wn, "data-testid": "notes-grid", children: F.map((C, k) => (
+  return e ? /* @__PURE__ */ s(z, { as: "div", textAlign: "center", padding: "large", "data-testid": "notes-loading", children: /* @__PURE__ */ s(at, { renderTitle: H.loadingNotes }) }) : t ? /* @__PURE__ */ s(z, { as: "div", textAlign: "center", padding: "large", "data-testid": "notes-error", children: /* @__PURE__ */ s(ae, { level: "h4", children: H.failedToLoadNotes }) }) : n.length === 0 ? /* @__PURE__ */ s(z, { as: "div", padding: "large", "data-testid": "empty-notes", children: /* @__PURE__ */ s(Tn, { hasActiveFilter: h }) }) : /* @__PURE__ */ T(Ye, { children: [
+    /* @__PURE__ */ s("div", { style: wn, "data-testid": "notes-grid", children: M.map((I, k) => (
       // oxlint-disable-next-line react/no-array-index-key -- columns are positional, index is stable
-      /* @__PURE__ */ s("div", { style: kn, children: C.map((x) => {
+      /* @__PURE__ */ s("div", { style: kn, children: I.map((x) => {
         var O;
         return /* @__PURE__ */ s(
-          Cn,
+          In,
           {
             noteId: x.id,
             date: x.createdAt,
@@ -1447,21 +1476,21 @@ const wn = {
             isActive: g === x.id,
             isPanelView: !!g,
             onClick: l ? () => l(x.id) : void 0,
-            onDelete: d ? (_) => d(_) : void 0,
-            onSaveNote: m ? (_, M) => m(_, M) : void 0,
-            onTypeChange: c ? (_, M) => c(_, M) : void 0,
-            highlightTheme: E,
+            onDelete: a ? (_) => a(_) : void 0,
+            onSaveNote: m ? (_, F) => m(_, F) : void 0,
+            onTypeChange: d ? (_, F) => d(_, F) : void 0,
+            highlightTheme: S,
             locale: f,
-            renderLink: v,
-            href: y ? y(x.id, x) : void 0
+            renderLink: y,
+            href: E ? E(x.id, x) : void 0
           },
           x.id
         );
       }) }, k)
     )) }),
-    N && /* @__PURE__ */ S(T, { justifyItems: "center", gap: "small", padding: "small", "data-testid": "notes-pagination", children: [
+    N && /* @__PURE__ */ T(C, { justifyItems: "center", gap: "small", padding: "small", "data-testid": "notes-pagination", children: [
       /* @__PURE__ */ s(
-        V,
+        Q,
         {
           size: "small",
           screenReaderLabel: H.previousPage,
@@ -1472,7 +1501,7 @@ const wn = {
         }
       ),
       /* @__PURE__ */ s(
-        V,
+        Q,
         {
           size: "small",
           screenReaderLabel: H.nextPage,
@@ -1492,37 +1521,37 @@ const wn = {
   onSave: r,
   onDelete: i,
   onTypeChange: l,
-  onBack: d,
+  onBack: a,
   editing: m = !1
 }) => {
-  const { translations: c } = G(), [g, h] = B(m), [u, E] = B(n || ""), [f, v] = B(!1);
-  return /* @__PURE__ */ S(T, { direction: "column", gap: "small", "data-testid": "single-note", children: [
+  const { translations: d } = G(), [g, h] = W(m), [u, S] = W(n || ""), [f, y] = W(!1);
+  return /* @__PURE__ */ T(C, { direction: "column", gap: "small", "data-testid": "single-note", children: [
     t != null ? /* @__PURE__ */ s(z, { as: "div", children: /* @__PURE__ */ s(U, { children: /* @__PURE__ */ s(he, { type: e, isCardActive: !0, theme: o, children: t }) }) }) : /* @__PURE__ */ s(Qe, {}),
     /* @__PURE__ */ s(Ve, { type: e, onTypeChange: l, renderAsMenuTrigger: !!l }),
-    g ? /* @__PURE__ */ S(T, { direction: "column", gap: "x-small", children: [
+    g ? /* @__PURE__ */ T(C, { direction: "column", gap: "x-small", children: [
       /* @__PURE__ */ s(
         He,
         {
-          label: c.addNoteOptional,
+          label: d.addNoteOptional,
           value: u,
-          onChange: (y) => E(y.target.value),
+          onChange: (E) => S(E.target.value),
           resize: "vertical"
         }
       ),
-      /* @__PURE__ */ S(T, { gap: "xx-small", children: [
-        /* @__PURE__ */ s(T.Item, { shouldGrow: !0, children: /* @__PURE__ */ s(
+      /* @__PURE__ */ T(C, { gap: "xx-small", children: [
+        /* @__PURE__ */ s(C.Item, { shouldGrow: !0, children: /* @__PURE__ */ s(
           $,
           {
             display: "block",
             size: "small",
             "data-testid": "single-note-cancel",
             onClick: () => {
-              E(n || ""), h(!1);
+              S(n || ""), h(!1);
             },
-            children: c.cancel
+            children: d.cancel
           }
         ) }),
-        /* @__PURE__ */ s(T.Item, { shouldGrow: !0, children: /* @__PURE__ */ s(
+        /* @__PURE__ */ s(C.Item, { shouldGrow: !0, children: /* @__PURE__ */ s(
           $,
           {
             display: "block",
@@ -1532,47 +1561,47 @@ const wn = {
             onClick: () => {
               r(u), h(!1);
             },
-            children: c.save
+            children: d.save
           }
         ) })
       ] })
-    ] }) : /* @__PURE__ */ S(T, { direction: "column", gap: "small", children: [
-      n && /* @__PURE__ */ S(z, { as: "div", children: [
-        /* @__PURE__ */ s(ae, { level: "h4", margin: "0 0 xx-small 0", children: c.note }),
+    ] }) : /* @__PURE__ */ T(C, { direction: "column", gap: "small", children: [
+      n && /* @__PURE__ */ T(z, { as: "div", children: [
+        /* @__PURE__ */ s(ae, { level: "h4", margin: "0 0 xx-small 0", children: d.note }),
         /* @__PURE__ */ s(U, { children: n })
       ] }),
-      /* @__PURE__ */ S(T, { justifyItems: "space-between", children: [
+      /* @__PURE__ */ T(C, { justifyItems: "space-between", children: [
         /* @__PURE__ */ s(
           $,
           {
             size: "small",
             renderIcon: /* @__PURE__ */ s(st, {}),
             "data-testid": "single-note-back",
-            onClick: () => d == null ? void 0 : d(),
-            children: c.back
+            onClick: () => a == null ? void 0 : a(),
+            children: d.back
           }
         ),
-        /* @__PURE__ */ S(T, { gap: "xx-small", children: [
+        /* @__PURE__ */ T(C, { gap: "xx-small", children: [
           i && /* @__PURE__ */ s(
-            V,
+            Q,
             {
               size: "small",
               withBackground: !1,
               withBorder: !1,
               color: "danger",
-              screenReaderLabel: c.deleteNote,
+              screenReaderLabel: d.deleteNote,
               "data-testid": "single-note-delete",
-              onClick: () => v(!0),
+              onClick: () => y(!0),
               children: /* @__PURE__ */ s(le, {})
             }
           ),
           /* @__PURE__ */ s(
-            V,
+            Q,
             {
               size: "small",
               withBackground: !1,
               withBorder: !1,
-              screenReaderLabel: c.editNote,
+              screenReaderLabel: d.editNote,
               "data-testid": "single-note-edit",
               onClick: () => h(!0),
               children: /* @__PURE__ */ s(fe, {})
@@ -1580,7 +1609,7 @@ const wn = {
           )
         ] })
       ] }),
-      f && i && /* @__PURE__ */ s(z, { as: "div", background: "primary", padding: "medium", borderRadius: "large", children: /* @__PURE__ */ S(T, { direction: "column", justifyItems: "center", alignItems: "center", gap: "x-small", children: [
+      f && i && /* @__PURE__ */ s(z, { as: "div", background: "primary", padding: "medium", borderRadius: "large", children: /* @__PURE__ */ T(C, { direction: "column", justifyItems: "center", alignItems: "center", gap: "x-small", children: [
         /* @__PURE__ */ s(
           $,
           {
@@ -1590,9 +1619,9 @@ const wn = {
             renderIcon: /* @__PURE__ */ s(le, {}),
             "data-testid": "single-note-confirm-delete",
             onClick: () => {
-              i(), v(!1);
+              i(), y(!1);
             },
-            children: c.deleteNote
+            children: d.deleteNote
           }
         ),
         /* @__PURE__ */ s(
@@ -1601,8 +1630,8 @@ const wn = {
             display: "block",
             size: "small",
             "data-testid": "single-note-cancel-delete",
-            onClick: () => v(!1),
-            children: c.cancel
+            onClick: () => y(!1),
+            children: d.cancel
           }
         )
       ] }) })
@@ -1613,17 +1642,17 @@ export {
   Vn as ContentWithNoteWrapper,
   he as Highlight,
   Qe as HighlightError,
-  Cn as NoteCard,
+  In as NoteCard,
   Ve as NoteChip,
   yn as NoteReactionMenu,
-  In as NotebookEmptyState,
+  Tn as NotebookEmptyState,
   Qn as NotebookProvider,
   pn as NotebookTranslationsProvider,
   Jn as NotebookTray,
   eo as NotesListView,
   w as REACTION_TYPE,
   to as SingleNote,
-  Ie as createTransparentColor,
+  Te as createTransparentColor,
   Dt as useCreateNote,
   Lt as useDeleteNote,
   $e as useGetNotes,