@instructure/platform-notebook 0.10.0 → 0.10.1

package/dist/ContentWithNoteWrapper.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ContentWithNoteWrapper.d.ts","sourceRoot":"","sources":["../src/ContentWithNoteWrapper.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,SAAS,EAA4C,MAAM,OAAO,CAAA;AAEhF,OAAO,EAAyC,KAAK,cAAc,EAAE,MAAM,eAAe,CAAA;AAmB1F,MAAM,WAAW,2BAA2B;IAC1C,YAAY,EAAE,SAAS,CAAC,WAAW,GAAG,IAAI,CAAC,CAAA;IAC3C,cAAc,EAAE,cAAc,CAAA;IAC9B,YAAY,CAAC,EAAE,MAAM,CAAA;CACtB;AAID,wBAAgB,sBAAsB,CAAC,EACrC,YAAY,EACZ,cAAc,EACd,YAAkB,GACnB,EAAE,2BAA2B,sCA6R7B"}
+{"version":3,"file":"ContentWithNoteWrapper.d.ts","sourceRoot":"","sources":["../src/ContentWithNoteWrapper.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,SAAS,EAA4C,MAAM,OAAO,CAAA;AAEhF,OAAO,EAAyC,KAAK,cAAc,EAAE,MAAM,eAAe,CAAA;AAmB1F,MAAM,WAAW,2BAA2B;IAC1C,YAAY,EAAE,SAAS,CAAC,WAAW,GAAG,IAAI,CAAC,CAAA;IAC3C,cAAc,EAAE,cAAc,CAAA;IAC9B,YAAY,CAAC,EAAE,MAAM,CAAA;CACtB;AAID,wBAAgB,sBAAsB,CAAC,EACrC,YAAY,EACZ,cAAc,EACd,YAAkB,GACnB,EAAE,2BAA2B,sCAyR7B"}

package/dist/NoteCard.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"NoteCard.d.ts","sourceRoot":"","sources":["../src/NoteCard.tsx"],"names":[],"mappings":"AAQA,OAAO,EAAE,KAAK,SAAS,EAA4C,MAAM,OAAO,CAAA;AAEhF,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,eAAe,CAAA;AAGnD,OAAO,EAAE,aAAa,EAAE,MAAM,SAAS,CAAA;AAEvC,MAAM,MAAM,aAAa,GAAG;IAC1B,MAAM,EAAE,MAAM,CAAA;IACd,IAAI,EAAE,IAAI,GAAG,MAAM,CAAA;IACnB,IAAI,EAAE,aAAa,CAAA;IACnB,SAAS,CAAC,EAAE,MAAM,GAAG,IAAI,CAAA;IACzB,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,OAAO,CAAC,EAAE,MAAM,IAAI,CAAA;IACpB,QAAQ,CAAC,EAAE,CAAC,MAAM,EAAE,MAAM,KAAK,IAAI,CAAA;IACnC,UAAU,CAAC,EAAE,CAAC,MAAM,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,KAAK,IAAI,CAAA;IACvD,YAAY,CAAC,EAAE,CAAC,MAAM,EAAE,MAAM,EAAE,IAAI,EAAE,aAAa,KAAK,IAAI,CAAA;IAC5D,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,WAAW,CAAC,EAAE,OAAO,CAAA;IACrB,UAAU,CAAC,EAAE,MAAM,CAAA;IACnB,MAAM,CAAC,EAAE,MAAM,CAAA;IACf,cAAc,EAAE,cAAc,CAAA;IAC9B,UAAU,CAAC,EAAE,CAAC,KAAK,EAAE;QAAE,IAAI,EAAE,MAAM,CAAC;QAAC,QAAQ,EAAE,SAAS,CAAC;QAAC,SAAS,CAAC,EAAE,MAAM,CAAA;KAAE,KAAK,SAAS,CAAA;IAC5F,IAAI,CAAC,EAAE,MAAM,CAAA;CACd,CAAA;AAWD,eAAO,MAAM,QAAQ,GAAI,oKAiBtB,aAAa,iHA8Qf,CAAA"}
+{"version":3,"file":"NoteCard.d.ts","sourceRoot":"","sources":["../src/NoteCard.tsx"],"names":[],"mappings":"AAQA,OAAO,EAAE,KAAK,SAAS,EAA4C,MAAM,OAAO,CAAA;AAEhF,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,eAAe,CAAA;AAGnD,OAAO,EAAE,aAAa,EAAE,MAAM,SAAS,CAAA;AAEvC,MAAM,MAAM,aAAa,GAAG;IAC1B,MAAM,EAAE,MAAM,CAAA;IACd,IAAI,EAAE,IAAI,GAAG,MAAM,CAAA;IACnB,IAAI,EAAE,aAAa,CAAA;IACnB,SAAS,CAAC,EAAE,MAAM,GAAG,IAAI,CAAA;IACzB,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,OAAO,CAAC,EAAE,MAAM,IAAI,CAAA;IACpB,QAAQ,CAAC,EAAE,CAAC,MAAM,EAAE,MAAM,KAAK,IAAI,CAAA;IACnC,UAAU,CAAC,EAAE,CAAC,MAAM,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,KAAK,IAAI,CAAA;IACvD,YAAY,CAAC,EAAE,CAAC,MAAM,EAAE,MAAM,EAAE,IAAI,EAAE,aAAa,KAAK,IAAI,CAAA;IAC5D,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,WAAW,CAAC,EAAE,OAAO,CAAA;IACrB,UAAU,CAAC,EAAE,MAAM,CAAA;IACnB,MAAM,CAAC,EAAE,MAAM,CAAA;IACf,cAAc,EAAE,cAAc,CAAA;IAC9B,UAAU,CAAC,EAAE,CAAC,KAAK,EAAE;QAAE,IAAI,EAAE,MAAM,CAAC;QAAC,QAAQ,EAAE,SAAS,CAAC;QAAC,SAAS,CAAC,EAAE,MAAM,CAAA;KAAE,KAAK,SAAS,CAAA;IAC5F,IAAI,CAAC,EAAE,MAAM,CAAA;CACd,CAAA;AAWD,eAAO,MAAM,QAAQ,GAAI,oKAiBtB,aAAa,iHA+Qf,CAAA"}

package/dist/index.js

@@ -1,5 +1,5 @@
-import { jsx as s, jsxs as v, Fragment as Ye } from "react/jsx-runtime";
-import { createContext as Pe, useMemo as re, useContext as _e, useReducer as Fe, useRef as Y, useEffect as Q, useState as W, 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 c } from "zod";
 import Je from "diff-match-patch";
@@ -13,7 +13,7 @@ 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 { 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";
@@ -254,12 +254,12 @@ const pt = (n) => {
     return document.evaluate(`.${n}`, e, null, XPathResult.FIRST_ORDERED_NODE_TYPE, null).singleNodeValue;
   }
 };
-class Z {
+class Y {
   constructor(e, t) {
     this.root = e, this.range = t;
   }
   static fromRange(e, t) {
-    return new Z(e, t);
+    return new Y(e, t);
   }
   static fromSelector(e, t) {
     if (!(t != null && t.startContainer) || !(t != null && t.endContainer))
@@ -274,7 +274,7 @@ class Z {
     if (!i || !l)
       return null;
     const a = new q(i, l).toRange();
-    return a ? new Z(e, a) : null;
+    return a ? new Y(e, a) : null;
   }
   toRange() {
     return this.range;
@@ -384,7 +384,7 @@ const ze = (n) => {
   for (const i of e) {
     const l = St(i, n);
     if (l) {
-      const a = l.toRange(), m = a && Z.fromRange(n, a);
+      const a = l.toRange(), m = a && Y.fromRange(n, a);
       o.push({
         id: i.id,
         reaction: i.reaction,
@@ -414,7 +414,7 @@ const ze = (n) => {
   var l;
   if (!e) return;
   const { highlightData: t, id: o } = n, { range: r } = t ?? {};
-  r && ((l = Z.fromSelector(e, r)) == null ? void 0 : l.toRange()) && Rt({ id: o });
+  r && ((l = Y.fromSelector(e, r)) == null ? void 0 : l.toRange()) && Rt({ id: o });
 }, Tt = (n) => {
   const e = document.getElementById(ve(n));
   if (e) {
@@ -509,19 +509,19 @@ const ze = (n) => {
   y.collapse(!0), y.insertNode(u);
   const E = document.createRange();
   E.setStartAfter(u), E.setEndBefore(S);
-  const F = wt(E).filter((N) => N.textContent && N.textContent.length > 0);
-  F.forEach((N, I) => {
-    var J;
+  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 = I === 0, O = I === 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 = d, 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));
-    }), (J = N.parentNode) == null || J.insertBefore(D, N), D.appendChild(N);
+    }), (Z = N.parentNode) == null || Z.insertBefore(D, N), D.appendChild(N);
   }), u.addEventListener("click", (N) => {
     var I;
     N.target.tagName !== "A" && ((I = e.onClick) == null || I.call(e));
@@ -730,7 +730,7 @@ function Qn({
   translate: d,
   children: g
 }) {
-  const [h, u] = Fe(bn, Nn), S = Y(!1), f = re(
+  const [h, u] = Fe(bn, Nn), S = V(!1), f = re(
     () => ({
       api: n,
       currentUserId: e,
@@ -771,8 +771,8 @@ function Xe() {
   return n;
 }
 const yn = ({ currentType: n, onSelectReaction: e }) => {
-  const { translations: t } = G(), o = Y(null), r = Y(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(
     z,
@@ -783,8 +783,8 @@ const yn = ({ currentType: n, onSelectReaction: e }) => {
       borderColor: "secondary",
       borderRadius: "medium",
       shadow: "resting",
-      children: /* @__PURE__ */ v(te, { children: [
-        /* @__PURE__ */ v(
+      children: /* @__PURE__ */ T(te, { children: [
+        /* @__PURE__ */ T(
           te.Item,
           {
             ref: o,
@@ -795,7 +795,7 @@ const yn = ({ currentType: n, onSelectReaction: e }) => {
             ]
           }
         ),
-        /* @__PURE__ */ v(
+        /* @__PURE__ */ T(
           te.Item,
           {
             ref: r,
@@ -831,59 +831,57 @@ function Vn({
     },
     courseId: l,
     pageSize: 100
-  }), { mutate: u } = Dt(o), { mutate: S } = At(o), { mutate: f } = Lt(o), y = Y([]), [E, H] = W([]), [F, N] = W(null), [I, k] = W(""), [x, O] = W(null), [_, M] = W(!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 T = window.getSelection(), A = n.current;
-        if (!(T != null && T.rangeCount) || !A) return;
-        const j = T.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 ee = T.getRangeAt(0);
-        if (!A.contains(ee.commonAncestorContainer)) return;
-        const Ie = (xe = X.fromRange(A, ee)) == null ? void 0 : xe.toSelector();
-        Ie && !It(Ie, E) && (N(ee.cloneRange()), k(j), O(Ct(ee)));
+        const J = v.getRangeAt(0);
+        if (!A.contains(J.commonAncestorContainer)) return;
+        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 = (T) => {
-      if (!(T.target instanceof Node)) return;
+    }, L = (v) => {
+      if (!(v.target instanceof Node)) return;
       const A = document.getElementById(de);
-      A != null && A.contains(T.target) ? (T.preventDefault(), T.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);
     };
-  }, [_, E, t, n]), Q(() => {
-    m && Tt(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: T } = P, A = T && ((j = Z.fromSelector(b, T)) == 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 ee = {
+        const J = {
           id: p,
           selectedNoteId: m,
           type: L[0],
@@ -891,41 +889,41 @@ function Vn({
             d(p), g();
           }
         };
-        return kt(A, ee, e), P.textPosition;
+        return kt(A, J, e), P.textPosition;
       }
       return null;
     },
     [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 (y.current.length > 0) {
-        for (const T of y.current)
-          Le(T, R);
+        for (const v of y.current)
+          Le(v, R);
         y.current = [], H([]);
       }
       return;
     }
     if (a && b[0].highlightData.pageLastModifiedAt !== a) {
-      const { notesForUpdate: T, noteIdsForDelete: A } = vt(
+      const { notesForUpdate: v, noteIdsForDelete: A } = vt(
         R,
         b,
         a
       );
-      for (const j of T)
+      for (const j of v)
         S({ id: j.id, input: j });
       for (const j of A)
         f(j);
     } else {
-      for (const T of b) {
-        const A = D(T);
-        P.add(T.id), A && (L.push(T), 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 T of y.current)
-        P.has(T.id) || Le(T, R);
-      H(p), y.current = L;
+      for (const v of y.current)
+        P.has(v.id) || Le(v, R);
+      H(p), y.current = L, m && Tt(m);
     }
   }, [
     _,
@@ -934,12 +932,13 @@ function Vn({
     a,
     n,
     S,
-    f
+    f,
+    m
   ]);
-  const J = (R) => {
+  const Z = (R) => {
     const b = n.current;
-    if (!F || !b) return;
-    const P = Z.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,
@@ -957,13 +956,13 @@ function Vn({
       {
         onSuccess: (p) => {
           var A;
-          const T = p.id;
-          N(null), k(""), O(null), (A = window.getSelection()) == null || A.removeAllRanges(), d(T), 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",
       {
@@ -980,7 +979,7 @@ function Vn({
           const b = document.getElementById(de);
           b != null && b.contains(R.relatedTarget) || (O(null), N(null), k(""));
         },
-        children: /* @__PURE__ */ s(yn, { onSelectReaction: J })
+        children: /* @__PURE__ */ s(yn, { onSelectReaction: Z })
       }
     ),
     document.body
@@ -1009,7 +1008,7 @@ const En = (n, e) => ({
   return /* @__PURE__ */ s("span", { "data-note-highlight": "true", style: l, children: n });
 }, Qe = () => {
   const { translations: n } = G();
-  return /* @__PURE__ */ v(C, { gap: "xx-small", alignItems: "start", as: "div", children: [
+  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 }) })
   ] });
@@ -1038,7 +1037,7 @@ function Yn({
   pageSize: r = 16
 }) {
   const [i, l] = Fe(vn, Sn), { filter: a, courseFilter: m, pageParamsWithDirection: d } = i;
-  Q(() => {
+  ee(() => {
     Object.keys(d).length > 0 && l({ type: "SET_PAGE_PARAMS_WITH_DIRECTION", payload: {} });
   }, [r]);
   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({
@@ -1051,7 +1050,7 @@ function Yn({
     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" }
@@ -1068,7 +1067,7 @@ function Yn({
   }, []);
   return {
     notes: H,
-    pageInfo: F,
+    pageInfo: M,
     isLoading: y,
     isError: E,
     filter: a,
@@ -1113,7 +1112,7 @@ function Zn({ filter: n, setFilter: e }) {
 }
 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__ */ v(C, { 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 })
@@ -1128,8 +1127,8 @@ const Tn = ({ hasActiveFilter: n = !1 }) => {
       onDismiss: t,
       placement: "end",
       size: "regular",
-      children: /* @__PURE__ */ v(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__ */ v(C, { 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,
@@ -1157,13 +1156,13 @@ const Tn = ({ hasActiveFilter: n = !1 }) => {
     icon: /* @__PURE__ */ s(Ne, { size: "x-small" })
   }
 }, Ve = ({ type: n, onTypeChange: e, renderAsMenuTrigger: t = !1 }) => {
-  const { translations: o } = G(), r = Cn[n], i = o[r.translationKey], [l, a] = W(!1), m = Y(null), d = Y(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), a(!1);
     },
     [e]
   );
-  return t && e ? /* @__PURE__ */ v(
+  return t && e ? /* @__PURE__ */ T(
     te,
     {
       placement: "bottom start",
@@ -1173,11 +1172,11 @@ const Tn = ({ hasActiveFilter: n = !1 }) => {
       shouldFocusTriggerOnClose: !0,
       trigger: /* @__PURE__ */ s(ke, { color: r.color, renderIcon: r.icon, children: i }),
       children: [
-        /* @__PURE__ */ v(te.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__ */ v(te.Item, { ref: d, onClick: () => g(w.IMPORTANT), children: [
+        /* @__PURE__ */ T(te.Item, { ref: d, onClick: () => g(w.IMPORTANT), children: [
           /* @__PURE__ */ s(be, { size: "x-small" }),
           ` ${o.markImportant}`
         ] })
@@ -1210,18 +1209,18 @@ const In = ({
   renderLink: f,
   href: y
 }) => {
-  const { translations: E } = G(), [H, F] = W(!1), [N, I] = W(!1), [k, x] = W(o || ""), [O, _] = W(!1), M = Y(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;
-    d && ((p = M.current) == null || p.scrollIntoView({ behavior: "smooth", block: "nearest" }));
+  ee(() => {
+    var p, v;
+    d && ((p = F.current) == null || p.scrollIntoView({ behavior: "smooth", block: "nearest" }), (v = F.current) == null || v.focus());
   }, [d]);
-  const J = r === w.IMPORTANT ? E.important : E.unclear, R = (p) => {
+  const Z = r === w.IMPORTANT ? E.important : E.unclear, R = (p) => {
     p.key === "Enter" && (p.preventDefault(), i == null || i());
-  }, b = [J, E.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__ */ v(
+  const P = b.join(", "), L = /* @__PURE__ */ T(
     z,
     {
       as: "div",
@@ -1236,12 +1235,12 @@ const In = ({
       "data-testid": "note-card",
       elementRef: D,
       onClick: d ? void 0 : i,
-      onMouseEnter: () => F(!0),
-      onMouseLeave: () => F(!1),
+      onMouseEnter: () => M(!0),
+      onMouseLeave: () => M(!1),
       onKeyDown: d ? void 0 : R,
       cursor: N ? "default" : "pointer",
       children: [
-        /* @__PURE__ */ v(C, { direction: "column", gap: "small", children: [
+        /* @__PURE__ */ T(C, { direction: "column", gap: "small", children: [
           /* @__PURE__ */ s(
             Ve,
             {
@@ -1267,8 +1266,8 @@ const In = ({
               children: t
             }
           ) }) }) }) : /* @__PURE__ */ s(Qe, {}),
-          /* @__PURE__ */ v(C, { direction: "column", gap: "small", children: [
-            N && g ? /* @__PURE__ */ v(C, { 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,
                 {
@@ -1278,7 +1277,7 @@ const In = ({
                   placeholder: E.addNoteOptional
                 }
               ),
-              /* @__PURE__ */ v(C, { gap: "xx-small", children: [
+              /* @__PURE__ */ T(C, { gap: "xx-small", children: [
                 /* @__PURE__ */ s(C.Item, { shouldGrow: !0, children: /* @__PURE__ */ s(
                   $,
                   {
@@ -1306,11 +1305,11 @@ const In = ({
                   }
                 ) })
               ] })
-            ] }) : o ? /* @__PURE__ */ s("div", { style: { wordBreak: "break-word", overflowWrap: "break-word" }, children: d && g ? /* @__PURE__ */ v(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,
@@ -1323,11 +1322,11 @@ const In = ({
                   children: /* @__PURE__ */ s(fe, {})
                 }
               )
-            ] }) : /* @__PURE__ */ s(U, { children: /* @__PURE__ */ s(me, { maxLines: 3, truncate: "word", children: o }) }) }) : g && d ? /* @__PURE__ */ s("div", { children: /* @__PURE__ */ v(U, { color: "secondary", children: [
+            ] }) : /* @__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,
@@ -1341,10 +1340,10 @@ const In = ({
                 }
               )
             ] }) }) : null,
-            /* @__PURE__ */ v(C, { 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) }),
               d && l && /* @__PURE__ */ s(
-                V,
+                Q,
                 {
                   size: "small",
                   withBackground: !1,
@@ -1375,7 +1374,7 @@ const In = ({
             insetInlineStart: "0",
             insetInlineEnd: "0",
             stacking: "above",
-            children: /* @__PURE__ */ v(
+            children: /* @__PURE__ */ T(
               C,
               {
                 direction: "column",
@@ -1457,12 +1456,12 @@ const wn = {
   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(Tn, { hasActiveFilter: h }) }) : /* @__PURE__ */ v(Ye, { children: [
-    /* @__PURE__ */ s("div", { style: wn, "data-testid": "notes-grid", children: F.map((I, 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: I.map((x) => {
         var O;
@@ -1478,8 +1477,8 @@ const wn = {
             isPanelView: !!g,
             onClick: l ? () => l(x.id) : void 0,
             onDelete: a ? (_) => a(_) : void 0,
-            onSaveNote: m ? (_, M) => m(_, M) : void 0,
-            onTypeChange: d ? (_, M) => d(_, M) : void 0,
+            onSaveNote: m ? (_, F) => m(_, F) : void 0,
+            onTypeChange: d ? (_, F) => d(_, F) : void 0,
             highlightTheme: S,
             locale: f,
             renderLink: y,
@@ -1489,9 +1488,9 @@ const wn = {
         );
       }) }, k)
     )) }),
-    N && /* @__PURE__ */ v(C, { 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,
@@ -1502,7 +1501,7 @@ const wn = {
         }
       ),
       /* @__PURE__ */ s(
-        V,
+        Q,
         {
           size: "small",
           screenReaderLabel: H.nextPage,
@@ -1526,10 +1525,10 @@ const wn = {
   editing: m = !1
 }) => {
   const { translations: d } = G(), [g, h] = W(m), [u, S] = W(n || ""), [f, y] = W(!1);
-  return /* @__PURE__ */ v(C, { direction: "column", gap: "small", "data-testid": "single-note", children: [
+  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__ */ v(C, { direction: "column", gap: "x-small", children: [
+    g ? /* @__PURE__ */ T(C, { direction: "column", gap: "x-small", children: [
       /* @__PURE__ */ s(
         He,
         {
@@ -1539,7 +1538,7 @@ const wn = {
           resize: "vertical"
         }
       ),
-      /* @__PURE__ */ v(C, { gap: "xx-small", children: [
+      /* @__PURE__ */ T(C, { gap: "xx-small", children: [
         /* @__PURE__ */ s(C.Item, { shouldGrow: !0, children: /* @__PURE__ */ s(
           $,
           {
@@ -1566,12 +1565,12 @@ const wn = {
           }
         ) })
       ] })
-    ] }) : /* @__PURE__ */ v(C, { direction: "column", gap: "small", children: [
-      n && /* @__PURE__ */ v(z, { as: "div", children: [
+    ] }) : /* @__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__ */ v(C, { justifyItems: "space-between", children: [
+      /* @__PURE__ */ T(C, { justifyItems: "space-between", children: [
         /* @__PURE__ */ s(
           $,
           {
@@ -1582,9 +1581,9 @@ const wn = {
             children: d.back
           }
         ),
-        /* @__PURE__ */ v(C, { gap: "xx-small", children: [
+        /* @__PURE__ */ T(C, { gap: "xx-small", children: [
           i && /* @__PURE__ */ s(
-            V,
+            Q,
             {
               size: "small",
               withBackground: !1,
@@ -1597,7 +1596,7 @@ const wn = {
             }
           ),
           /* @__PURE__ */ s(
-            V,
+            Q,
             {
               size: "small",
               withBackground: !1,
@@ -1610,7 +1609,7 @@ const wn = {
           )
         ] })
       ] }),
-      f && i && /* @__PURE__ */ s(z, { as: "div", background: "primary", padding: "medium", borderRadius: "large", children: /* @__PURE__ */ v(C, { 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(
           $,
           {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@instructure/platform-notebook",
-  "version": "0.10.0",
+  "version": "0.10.1",
   "type": "module",
   "main": "./dist/index.js",
   "module": "./dist/index.js",