@versini/ui-debug-overlay 1.1.0 → 2.0.1

package/README.md

@@ -10,7 +10,7 @@
 - Automatically snapshot an `appState` object on referential changes
 - Push manual, labeled, color‑coded snapshots from anywhere (via a hook)
 - Target snapshots to specific overlay instances
-- Copy a merged chronological timeline (optionally excluding manual snapshots)
+- Copy a merged chronological timeline (always includes manual snapshots)
 - Clear everything in a click
 - Position the panel with shorthands or explicit edges
 - Keep bundle weight minimal (inline styles only, no CSS frameworks)
@@ -57,14 +57,10 @@ export function App() {
 Use the hook to push ad‑hoc snapshots (successful responses, errors, timings, etc.).
 
 ```tsx
-import {
-  useDebugSnapshot,
-  LOG_GREEN,
-  LOG_RED
-} from "@versini/ui-debug-overlay";
+import { useDebugOverlay, LOG_GREEN, LOG_RED } from "@versini/ui-debug-overlay";
 
 function SomeLogic() {
-  const debug = useDebugSnapshot();
+  const debug = useDebugOverlay();
 
   async function run() {
     debug("start", { ts: Date.now() });
@@ -83,7 +79,7 @@ function SomeLogic() {
 ## Multiple / Targeted Overlays
 
 ```tsx
-const debug = useDebugSnapshot();
+const debug = useDebugOverlay();
 
 debug("metrics", { fps: 60 }, { targetOverlays: ["perf"] });
 
@@ -120,11 +116,7 @@ Supported shorthands: `left`, `right`, `top`, `bottom`, `top-left`, `top-right`,
 
 ## Copy Behavior
 
-Pressing "Copy" produces a plain text timeline. Chronological numbering always starts at `#1` (oldest), even if UI order shows newest first. To exclude manual snapshots:
-
-```tsx
-<DebugOverlay appState={state} includeManualInCopy={false} />
-```
+Pressing "Copy" produces a plain text timeline. Chronological numbering always starts at `#1` (oldest), even if UI order shows newest first. Manual snapshots are always included.
 
 ## Collapsing
 
@@ -144,15 +136,14 @@ Pressing "Copy" produces a plain text timeline. Chronological numbering always s
 | `maxBodyHeight`              | `number                    | string`      | `320`                                                                | Scroll region max height.                            |
 | `indent`                     | `number`                   | `2`          | JSON indent spaces.                                                  |
 | `maxSnapshots`               | `number`                   | `50`         | Retained automatic state snapshot cap (FIFO).                        |
-| `maxVisibleSnapshots`        | `number`                   | `2`          | Visible snapshot limit; remainder summarized.                        |
+| `maxVisibleSnapshots`        | `number`                   | `10`         | Visible snapshot limit; remainder summarized.                        |
 | `snapshotOrder`              | `"asc"                     | "desc"`      | `"desc"`                                                             | Visual ordering only. Numbering stays chronological. |
 | `appendSnapshotCountInTitle` | `boolean`                  | `false`      | Append live count to title.                                          |
-| `includeManualInCopy`        | `boolean`                  | `true`       | Include manual snapshots in copy output.                             |
 
-## Hook: `useDebugSnapshot()`
+## Hook: `useDebugOverlay()`
 
 ```ts
-const debug = useDebugSnapshot();
+const debug = useDebugOverlay();
 
 debug(
   label: string,
@@ -170,14 +161,6 @@ Color constants: `LOG_YELLOW`, `LOG_GREEN`, `LOG_BLUE`, `LOG_MAGENTA`, `LOG_RED`
 - Multiple overlays can focus on separate domains (state vs. performance vs. network)
 - Use colors to visually cluster snapshot categories (success, error, timing)
 
-## Accessibility
-
-Buttons include accessible labels; simple semantic markup keeps the overlay screen‑reader friendly while remaining visually unobtrusive. Inline styles avoid CSS collisions.
-
 ## License
 
 MIT © Arno Versini
-
----
-
-Open an issue for enhancements (redaction hooks, diff mode, retention strategies, pause/resume, etc.).

package/dist/components/DebugOverlay/DebugOverlay.js

@@ -1,30 +1,30 @@
 import { jsxs as L, jsx as g } from "react/jsx-runtime";
-import { useCallback as _, useState as x, useRef as tt, useMemo as h, useEffect as G } from "react";
-const nt = "LOG_YELLOW", st = "LOG_GREEN", at = "LOG_BLUE", lt = "LOG_MAGENTA", it = "LOG_RED", et = 200;
-let F = 0;
+import { useCallback as _, useState as x, useRef as V, useMemo as h, useEffect as S } from "react";
+const re = "LOG_YELLOW", ne = "LOG_GREEN", se = "LOG_BLUE", ae = "LOG_MAGENTA", le = "LOG_RED", ee = 200;
+let W = 0;
 const p = [], $ = /* @__PURE__ */ new Set();
-function ct() {
-  p.length = 0, F = 0;
+function ie() {
+  p.length = 0, W = 0;
 }
-function U() {
-  return F++;
+function F() {
+  return W++;
 }
-function N(s) {
+function z(s) {
   const a = {
     kind: "manual",
     ts: Date.now(),
-    seq: U(),
+    seq: F(),
     label: s.label,
     data: s.data,
     color: s.color,
     targetOverlays: s.targetOverlays && s.targetOverlays.length ? [...s.targetOverlays] : void 0
   };
-  p.push(a), p.length > et && p.shift(), $.forEach((l) => l(a));
+  p.push(a), p.length > ee && p.shift(), $.forEach((l) => l(a));
 }
-function dt() {
+function ce() {
   return _(
     (s, a, l) => {
-      N(typeof l == "string" ? { label: s, data: a, color: l } : {
+      z(typeof l == "string" ? { label: s, data: a, color: l } : {
         label: s,
         data: a,
         color: l?.color,
@@ -34,7 +34,7 @@ function dt() {
     []
   );
 }
-function W(s, a = 2) {
+function N(s, a = 2) {
   const l = /* @__PURE__ */ new WeakSet(), c = (o) => {
     if (!o || typeof o != "object" || o instanceof Date || o instanceof RegExp)
       return o;
@@ -53,82 +53,80 @@ function W(s, a = 2) {
     return `<<unserializable: ${o.message}>>`;
   }
 }
-const ut = ({
+const de = ({
   appState: s,
   title: a = "AppState",
   initialCollapsed: l = !1,
   overlayId: c = "default",
   position: o,
-  maxBodyHeight: y = 320,
+  maxBodyHeight: y = "50svh",
   indent: d = 2,
   maxSnapshots: C = 50,
-  maxVisibleSnapshots: v = 2,
+  maxVisibleSnapshots: v = 10,
   snapshotOrder: A = "desc",
-  appendSnapshotCountInTitle: Y = !1,
-  includeManualInCopy: R = !0
+  appendSnapshotCountInTitle: U = !1
 }) => {
-  const [b, I] = x(l), [T, D] = x(!1), m = tt(null), [j, q] = x([]), [B, z] = x(
+  const [b, I] = x(l), [R, T] = x(!1), m = V(null), [D, j] = x([]), [q, B] = x(
     () => (
       // Apply same targeting filter to initial buffered snapshots as we do for
-      // live subscription events so targeted snapshots don't leak to unrelated overlays.
+      // live subscription events so targeted snapshots don't leak to unrelated
+      // overlays.
       p.filter(
-        (t) => !t.targetOverlays || t.targetOverlays.length === 0 || t.targetOverlays.includes(c)
+        (e) => !e.targetOverlays || e.targetOverlays.length === 0 || e.targetOverlays.includes(c)
       )
     )
   ), E = h(
-    () => s !== void 0 ? W(s, d) : null,
+    () => s !== void 0 ? N(s, d) : null,
     [s, d]
   );
-  G(() => {
-    E != null && q(
-      (t) => [{ ts: Date.now(), json: E }, ...t].slice(0, C)
+  S(() => {
+    E != null && j(
+      (e) => [{ ts: Date.now(), json: E }, ...e].slice(0, C)
     );
-  }, [E, C]), G(() => {
-    const t = (e) => {
-      (!e.targetOverlays || e.targetOverlays.length === 0 || e.targetOverlays.includes(c)) && z((r) => [...r, e]);
+  }, [E, C]), S(() => {
+    const e = (t) => {
+      (!t.targetOverlays || t.targetOverlays.length === 0 || t.targetOverlays.includes(c)) && B((r) => [...r, t]);
     };
-    return $.add(t), () => {
-      $.delete(t);
+    return $.add(e), () => {
+      $.delete(e);
     };
   }, [c]);
   const i = h(() => {
-    const t = [...j].reverse().map((n) => ({
+    const e = [...D].reverse().map((n) => ({
       kind: "state",
       ts: n.ts,
       json: n.json,
-      seq: U()
-    })), e = B.map((n) => ({
+      seq: F()
+    })), t = q.map((n) => ({
       kind: "manual",
       ts: n.ts,
       seq: n.seq,
       label: n.label,
       color: n.color,
-      json: W(n.data, d)
-    })), r = [...t, ...e];
+      json: N(n.data, d)
+    })), r = [...e, ...t];
     return r.sort((n, f) => n.ts === f.ts ? n.seq - f.seq : n.ts - f.ts), r;
-  }, [j, B, d]), k = h(
+  }, [D, q, d]), k = h(
     () => A === "asc" ? i : [...i].reverse(),
     [A, i]
-  ), P = _(() => {
-    const t = [];
-    t.push(`${a} (total snapshots: ${i.length})`), i.forEach((r, n) => {
-      if (r.kind === "manual" && !R)
-        return;
-      const S = new Date(r.ts).toLocaleTimeString(void 0, {
+  ), Y = _(() => {
+    const e = [];
+    e.push(`${a} (total snapshots: ${i.length})`), i.forEach((r, n) => {
+      const G = new Date(r.ts).toLocaleTimeString(void 0, {
         hour: "2-digit",
         minute: "2-digit",
         second: "2-digit",
         hour12: !1
-      }), V = r.kind === "manual" && r.label ? ` [${r.label}]` : "";
-      t.push(`--- ${S} (#${n + 1})${V} ---`), t.push(r.json);
+      }), Z = r.kind === "manual" && r.label ? ` [${r.label}]` : "";
+      e.push(`--- ${G} (#${n + 1})${Z} ---`), e.push(r.json);
     });
-    const e = t.join(`
+    const t = e.join(`
 `);
-    navigator?.clipboard?.writeText && navigator.clipboard.writeText(e).then(() => {
-      D(!0), setTimeout(() => D(!1), 1300);
+    navigator?.clipboard?.writeText && navigator.clipboard.writeText(t).then(() => {
+      T(!0), setTimeout(() => T(!1), 1300);
     });
-  }, [a, i, R]), H = _(() => {
-    q([]), z([]), p.length = 0;
+  }, [a, i]), P = _(() => {
+    j([]), B([]), p.length = 0;
   }, []), M = h(() => {
     if (!o)
       return {};
@@ -150,34 +148,34 @@ const ut = ({
         default:
           return { top: "0", right: "0" };
       }
-    const t = {};
-    for (const e of ["top", "right", "bottom", "left"]) {
-      const r = o[e];
-      r !== void 0 && (t[e] = String(r));
+    const e = {};
+    for (const t of ["top", "right", "bottom", "left"]) {
+      const r = o[t];
+      r !== void 0 && (e[t] = String(r));
     }
-    return t;
+    return e;
   }, [o]), u = h(() => {
-    const t = { ...M };
-    return !("top" in t) && !("bottom" in t) && (t.top = "0"), !("left" in t) && !("right" in t) && (t.right = "0"), t;
+    const e = { ...M };
+    return !("top" in e) && !("bottom" in e) && (e.top = "0"), !("left" in e) && !("right" in e) && (e.right = "0"), e;
   }, [M]);
-  G(() => {
-    const t = typeof window < "u" ? window.visualViewport : null;
-    if (!t)
+  S(() => {
+    const e = typeof window < "u" ? window.visualViewport : null;
+    if (!e)
       return;
-    const e = () => {
-      if (m.current && (!("top" in u) && !("bottom" in u) && (m.current.style.top = `${t.offsetTop}px`), !("right" in u) && !("left" in u))) {
+    const t = () => {
+      if (m.current && (!("top" in u) && !("bottom" in u) && (m.current.style.top = `${e.offsetTop}px`), !("right" in u) && !("left" in u))) {
         const r = Math.max(
           0,
-          Math.round(window.innerWidth - (t.offsetLeft + t.width))
+          Math.round(window.innerWidth - (e.offsetLeft + e.width))
         );
         m.current.style.right = `${r}px`;
       }
     };
-    return t.addEventListener("resize", e), t.addEventListener("scroll", e), e(), () => {
-      t.removeEventListener("resize", e), t.removeEventListener("scroll", e);
+    return e.addEventListener("resize", t), e.addEventListener("scroll", t), t(), () => {
+      e.removeEventListener("resize", t), e.removeEventListener("scroll", t);
     };
   }, [u]);
-  const J = i.length, K = Y ? `${a} (${J})` : a, Q = { margin: 0, padding: 0 }, X = {
+  const H = i.length, J = U ? `${a} (${H})` : a, K = { margin: 0, padding: 0 }, Q = {
     margin: 0,
     padding: 0,
     paddingLeft: 4
@@ -208,13 +206,13 @@ const ut = ({
       border: "2px solid #cc0000"
     }
   };
-  function Z(t) {
-    const e = t && w[t] ? w[t] : w.LOG_YELLOW;
+  function X(e) {
+    const t = e && w[e] ? w[e] : w.LOG_YELLOW;
     return {
-      ...X,
-      color: e.color,
-      background: e.background,
-      borderLeft: e.border
+      ...Q,
+      color: t.color,
+      background: t.background,
+      borderLeft: t.border
     };
   }
   return /* @__PURE__ */ L(
@@ -252,13 +250,13 @@ const ut = ({
               userSelect: "none"
             },
             children: [
-              /* @__PURE__ */ g("strong", { style: { fontWeight: 600, fontSize: 11 }, children: K }),
+              /* @__PURE__ */ g("strong", { style: { fontWeight: 600, fontSize: 11 }, children: J }),
               /* @__PURE__ */ L("div", { style: { marginLeft: "auto", display: "flex", gap: 4 }, children: [
                 /* @__PURE__ */ g(
                   "button",
                   {
                     type: "button",
-                    onClick: () => I((t) => !t),
+                    onClick: () => I((e) => !e),
                     "aria-label": b ? "Expand debug overlay" : "Collapse debug overlay",
                     style: O,
                     children: b ? "+" : "−"
@@ -268,20 +266,20 @@ const ut = ({
                   "button",
                   {
                     type: "button",
-                    onClick: P,
+                    onClick: Y,
                     "aria-label": "Copy debug JSON",
                     style: {
                       ...O,
-                      color: T ? "#0f0" : O.color
+                      color: R ? "#0f0" : O.color
                     },
-                    children: T ? "Copied" : "Copy"
+                    children: R ? "Copied" : "Copy"
                   }
                 ),
                 i.length > 1 && /* @__PURE__ */ g(
                   "button",
                   {
                     type: "button",
-                    onClick: H,
+                    onClick: P,
                     "aria-label": "Clear stored snapshots",
                     style: O,
                     children: "Clear"
@@ -306,21 +304,21 @@ const ut = ({
               wordBreak: "break-word"
             },
             children: [
-              k.slice(0, v).map((t) => {
-                const e = i.findIndex((S) => S.seq === t.seq), n = new Date(t.ts).toLocaleTimeString(void 0, {
+              k.slice(0, v).map((e) => {
+                const t = i.findIndex((G) => G.seq === e.seq), n = new Date(e.ts).toLocaleTimeString(void 0, {
                   hour: "2-digit",
                   minute: "2-digit",
                   second: "2-digit",
                   hour12: !1
-                }), f = t.kind === "manual" && t.label ? ` [${t.label}]` : "";
+                }), f = e.kind === "manual" && e.label ? ` [${e.label}]` : "";
                 return /* @__PURE__ */ g(
                   "pre",
                   {
-                    style: t.kind === "manual" ? Z(t.color) : Q,
-                    children: `--- ${n} (#${e + 1})${f} ---
-${t.json}`
+                    style: e.kind === "manual" ? X(e.color) : K,
+                    children: `--- ${n} (#${t + 1})${f} ---
+${e.json}`
                   },
-                  `${t.kind}-${t.seq}`
+                  `${e.kind}-${e.seq}`
                 );
               }),
               k.length > v && /* @__PURE__ */ g("div", { style: { opacity: 0.7, marginTop: 4 }, children: `(+${k.length - v} snapshots not shown)` })
@@ -341,12 +339,12 @@ ${t.json}`
   fontFamily: "inherit"
 };
 export {
-  ut as DebugOverlay,
-  at as LOG_BLUE,
-  st as LOG_GREEN,
-  lt as LOG_MAGENTA,
-  it as LOG_RED,
-  nt as LOG_YELLOW,
-  ct as __resetDebugOverlayTestState,
-  dt as useDebugSnapshot
+  de as DebugOverlay,
+  se as LOG_BLUE,
+  ne as LOG_GREEN,
+  ae as LOG_MAGENTA,
+  le as LOG_RED,
+  re as LOG_YELLOW,
+  ie as __resetDebugOverlayTestState,
+  ce as useDebugOverlay
 };

package/dist/index.d.ts

@@ -1,4 +1,4 @@
-import React from 'react';
+import * as react_jsx_runtime from 'react/jsx-runtime';
 
 type DebugOverlayProps = {
 	/**
@@ -7,15 +7,18 @@ type DebugOverlayProps = {
 	 */
 	appState?: unknown;
 	/**
-	 * Short label shown in the header. Defaults to "AppState".
+	 * Short label shown in the header.
+	 * @default "AppState"
 	 */
 	title?: string;
 	/**
 	 * Start collapsed (header only).
+	 * @default false
 	 */
 	initialCollapsed?: boolean;
 	/**
-	 * Identifier for manual snapshot targeting. Defaults to "default".
+	 * Identifier for manual snapshot targeting..
+	 * @default "default"
 	 */
 	overlayId?: string;
 	/**
@@ -44,38 +47,40 @@ type DebugOverlayProps = {
 		| "bottom-left"
 		| "bottom-right";
 	/**
-	 * Maximum body height before scrolling (px number or CSS length e.g. "50svh").
+	 * Maximum body height before scrolling (px number or CSS length e.g. "100vh").
+	 * @default "50svh"
 	 */
 	maxBodyHeight?: number | string;
 	/**
-	 * Pretty print spacing for JSON output (default 2).
+	 * Pretty print spacing for JSON output.
+	 * @default 2
 	 */
 	indent?: number;
 	/**
-	 * Maximum snapshots retained in memory when persist=true (FIFO). Default 50.
+	 * Maximum snapshots retained in memory (FIFO)..
+	 * @default 50
 	 */
 	maxSnapshots?: number;
 	/**
-	 * Maximum snapshots shown without expanding. Default 2.
+	 * Maximum snapshots shown without scrolling.
+	 * @default 10
 	 */
 	maxVisibleSnapshots?: number;
 	/**
 	 * Visual ordering of snapshots in the panel.
-	 *  - "desc" (default): newest snapshot at the top.
+	 *  - "desc": newest snapshot at the top.
 	 *  - "asc": oldest snapshot at the top.
 	 * Numbering ALWAYS reflects chronological order with #1 being the oldest
 	 * snapshot regardless of display order.
+	 * @default "desc"
 	 */
 	snapshotOrder?: "asc" | "desc";
 	/**
 	 * When true, appends the current snapshot count to the title (e.g. "AppState
 	 * (5)").
+	 * @default false
 	 */
 	appendSnapshotCountInTitle?: boolean;
-	/**
-	 * Include manual snapshots when copying all snapshots.
-	 */
-	includeManualInCopy?: boolean;
 };
 
 /**
@@ -89,12 +94,40 @@ declare const LOG_BLUE: "LOG_BLUE";
 declare const LOG_MAGENTA: "LOG_MAGENTA";
 declare const LOG_RED: "LOG_RED";
 type LogColor = typeof LOG_YELLOW | typeof LOG_GREEN | typeof LOG_BLUE | typeof LOG_MAGENTA | typeof LOG_RED;
+/**
+ * Test-only helper (not part of public API). Enables isolation across tests.
+ * Exported unconditionally; consumer code should not rely on it.
+ */
 declare function __resetDebugOverlayTestState(): void;
 interface DebugFnOptions {
     color?: LogColor;
     targetOverlays?: string[];
 }
-declare function useDebugSnapshot(): (label: string, data: unknown, options?: LogColor | DebugFnOptions) => void;
-declare const DebugOverlay: React.FC<DebugOverlayProps>;
+/**
+ * React hook returning a function to push a manual snapshot into all (or
+ * targeted) mounted `DebugOverlay` instances.
+ *
+ * Usage:
+ * ```js
+ * const debug = useDebugOverlay();
+ * debug("loaded", { user, meta }, LOG_GREEN);
+ * debug("error", errorObj, { color: LOG_RED, targetOverlays: ["errors"] });
+ * ```
+ *
+ * Parameters when invoking the returned function:
+ *  - label: short string identifying the snapshot category.
+ *  - data: any serializable (or even cyclic) value; cyclic structures are
+ *          replaced with "[Circular]" markers.
+ *  - options: either a LogColor constant OR an object with `color` and
+ *             optional `targetOverlays` (array of overlayId strings). When
+ *             `targetOverlays` is omitted or empty, the snapshot broadcasts to
+ *             every mounted overlay.
+ *
+ * The hook itself has no dependencies and returns a stable callback identity
+ * for the component lifetime, keeping re-renders minimal.
+ *
+ */
+declare function useDebugOverlay(): (label: string, data: unknown, options?: LogColor | DebugFnOptions) => void;
+declare const DebugOverlay: ({ appState, title, initialCollapsed, overlayId, position, maxBodyHeight, indent, maxSnapshots, maxVisibleSnapshots, snapshotOrder, appendSnapshotCountInTitle, }: DebugOverlayProps) => react_jsx_runtime.JSX.Element;
 
-export { type DebugFnOptions, DebugOverlay, type DebugOverlayProps, LOG_BLUE, LOG_GREEN, LOG_MAGENTA, LOG_RED, LOG_YELLOW, type LogColor, __resetDebugOverlayTestState, useDebugSnapshot };
+export { type DebugFnOptions, DebugOverlay, type DebugOverlayProps, LOG_BLUE, LOG_GREEN, LOG_MAGENTA, LOG_RED, LOG_YELLOW, type LogColor, __resetDebugOverlayTestState, useDebugOverlay };

package/dist/index.js

@@ -1,24 +1,24 @@
-import { DebugOverlay as t, LOG_BLUE as i, LOG_GREEN as o, LOG_MAGENTA as r, LOG_RED as L, LOG_YELLOW as O, __resetDebugOverlayTestState as s, useDebugSnapshot as G } from "./components/DebugOverlay/DebugOverlay.js";
+import { DebugOverlay as r, LOG_BLUE as i, LOG_GREEN as t, LOG_MAGENTA as O, LOG_RED as o, LOG_YELLOW as L, __resetDebugOverlayTestState as G, useDebugOverlay as s } from "./components/DebugOverlay/DebugOverlay.js";
 /*!
-  @versini/ui-debug-overlay v1.1.0
+  @versini/ui-debug-overlay v2.0.1
   © 2025 gizmette.com
 */
 try {
   window.__VERSINI_UI_DEBUG_OVERLAY__ || (window.__VERSINI_UI_DEBUG_OVERLAY__ = {
-    version: "1.1.0",
-    buildTime: "09/13/2025 11:11 PM EDT",
+    version: "2.0.1",
+    buildTime: "10/17/2025 12:55 PM EDT",
     homepage: "https://github.com/aversini/ui-components",
     license: "MIT"
   });
 } catch {
 }
 export {
-  t as DebugOverlay,
+  r as DebugOverlay,
   i as LOG_BLUE,
-  o as LOG_GREEN,
-  r as LOG_MAGENTA,
-  L as LOG_RED,
-  O as LOG_YELLOW,
-  s as __resetDebugOverlayTestState,
-  G as useDebugSnapshot
+  t as LOG_GREEN,
+  O as LOG_MAGENTA,
+  o as LOG_RED,
+  L as LOG_YELLOW,
+  G as __resetDebugOverlayTestState,
+  s as useDebugOverlay
 };

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@versini/ui-debug-overlay",
-	"version": "1.1.0",
+	"version": "2.0.1",
 	"license": "MIT",
 	"author": "Arno Versini",
 	"publishConfig": {
@@ -36,12 +36,8 @@
 		"test:watch": "vitest",
 		"test": "vitest run"
 	},
-	"peerDependencies": {
-		"react": "^19.1.0",
-		"react-dom": "^19.1.0"
-	},
 	"devDependencies": {
-		"@testing-library/jest-dom": "6.8.0"
+		"@testing-library/jest-dom": "6.9.1"
 	},
-	"gitHead": "6fef25217acc22bda8276b58e40d776a68af5ed9"
+	"gitHead": "67e049c9b2e46e8f52509bf6198ca0cdaf5d970a"
 }