@knocklabs/react 0.12.1 → 0.13.1

package/dist/esm/modules/guide/components/Toolbar/V2/useDraggable.mjs

@@ -1,77 +1,69 @@
 import e from "react";
-const S = {
-  top: 16,
-  right: 16
-}, T = 5;
-function y(n, s, w, o = 0) {
-  const r = window.innerWidth, f = window.innerHeight, D = s + o, p = r - n.right - s, d = Math.max(0, Math.min(p, r - D)), c = Math.max(0, Math.min(n.top, f - w)), u = r - d - s;
-  return {
-    top: c,
-    right: u
-  };
+//#region src/modules/guide/components/Toolbar/V2/useDraggable.ts
+var t = {
+	top: 16,
+	right: 16
+}, n = 5;
+function r(e, t, n, r = 0) {
+	let i = window.innerWidth, a = window.innerHeight, o = t + r, s = i - e.right - t, c = Math.max(0, Math.min(s, i - o));
+	return {
+		top: Math.max(0, Math.min(e.top, a - n)),
+		right: i - c - t
+	};
 }
-function b({
-  elementRef: n,
-  initialPosition: s = S,
-  reclampDeps: w = [],
-  rightPadding: o = 0
-}) {
-  const [r, f] = e.useState(s), [D, p] = e.useState(!1), d = e.useRef(r);
-  d.current = r;
-  const c = e.useRef({
-    x: 0,
-    y: 0
-  }), u = e.useRef({
-    top: 0,
-    right: 0
-  }), i = e.useRef(null), g = e.useRef(!1), h = e.useRef(!1), a = e.useRef(null), v = e.useCallback(() => {
-    const t = n.current;
-    if (!t) return;
-    const l = t.getBoundingClientRect();
-    f((m) => y(m, l.width, l.height, o));
-  }, [n, o]), A = e.useCallback((t) => {
-    t.preventDefault(), c.current = {
-      x: t.clientX,
-      y: t.clientY
-    }, u.current = {
-      ...d.current
-    }, g.current = !0, h.current = !1, p(!0);
-    const l = (R) => {
-      if (!g.current) return;
-      const M = R.clientX - c.current.x, P = R.clientY - c.current.y;
-      !h.current && Math.hypot(M, P) >= T && (h.current = !0), i.current === null && (i.current = requestAnimationFrame(() => {
-        if (i.current = null, !g.current) return;
-        const F = R.clientX - c.current.x, C = R.clientY - c.current.y, H = {
-          top: u.current.top + C,
-          right: u.current.right - F
-        }, E = n.current;
-        if (!E) return;
-        const L = E.getBoundingClientRect(), I = y(H, L.width, L.height, o);
-        f(I);
-      }));
-    }, m = () => {
-      g.current = !1, p(!1), i.current !== null && (cancelAnimationFrame(i.current), i.current = null), document.removeEventListener("pointermove", l), document.removeEventListener("pointerup", x), a.current = null;
-    }, x = () => m();
-    document.addEventListener("pointermove", l), document.addEventListener("pointerup", x), a.current = m;
-  }, [n, o]);
-  return e.useEffect(() => () => {
-    var t;
-    (t = a.current) == null || t.call(a);
-  }, []), e.useEffect(() => {
-    const t = () => v();
-    return window.addEventListener("resize", t), () => window.removeEventListener("resize", t);
-  }, [v]), e.useEffect(() => {
-    const t = requestAnimationFrame(() => v());
-    return () => cancelAnimationFrame(t);
-  }, w), {
-    position: r,
-    isDragging: D,
-    handlePointerDown: A,
-    hasDraggedRef: h
-  };
+function i({ elementRef: i, initialPosition: a = t, reclampDeps: o = [], rightPadding: s = 0 }) {
+	let [c, l] = e.useState(a), [u, d] = e.useState(!1), f = e.useRef(c);
+	f.current = c;
+	let p = e.useRef({
+		x: 0,
+		y: 0
+	}), m = e.useRef({
+		top: 0,
+		right: 0
+	}), h = e.useRef(null), g = e.useRef(!1), _ = e.useRef(!1), v = e.useRef(null), y = e.useCallback(() => {
+		let e = i.current;
+		if (!e) return;
+		let t = e.getBoundingClientRect();
+		l((e) => r(e, t.width, t.height, s));
+	}, [i, s]), b = e.useCallback((e) => {
+		e.preventDefault(), p.current = {
+			x: e.clientX,
+			y: e.clientY
+		}, m.current = { ...f.current }, g.current = !0, _.current = !1, d(!0);
+		let t = (e) => {
+			if (!g.current) return;
+			let t = e.clientX - p.current.x, a = e.clientY - p.current.y;
+			!_.current && Math.hypot(t, a) >= n && (_.current = !0), h.current === null && (h.current = requestAnimationFrame(() => {
+				if (h.current = null, !g.current) return;
+				let t = e.clientX - p.current.x, n = e.clientY - p.current.y, a = {
+					top: m.current.top + n,
+					right: m.current.right - t
+				}, o = i.current;
+				if (!o) return;
+				let c = o.getBoundingClientRect(), u = r(a, c.width, c.height, s);
+				l(u);
+			}));
+		}, a = () => {
+			g.current = !1, d(!1), h.current !== null && (cancelAnimationFrame(h.current), h.current = null), document.removeEventListener("pointermove", t), document.removeEventListener("pointerup", o), v.current = null;
+		}, o = () => a();
+		document.addEventListener("pointermove", t), document.addEventListener("pointerup", o), v.current = a;
+	}, [i, s]);
+	return e.useEffect(() => () => {
+		v.current?.();
+	}, []), e.useEffect(() => {
+		let e = () => y();
+		return window.addEventListener("resize", e), () => window.removeEventListener("resize", e);
+	}, [y]), e.useEffect(() => {
+		let e = requestAnimationFrame(() => y());
+		return () => cancelAnimationFrame(e);
+	}, o), {
+		position: c,
+		isDragging: u,
+		handlePointerDown: b,
+		hasDraggedRef: _
+	};
 }
-export {
-  y as clampPosition,
-  b as useDraggable
-};
-//# sourceMappingURL=useDraggable.mjs.map
+//#endregion
+export { r as clampPosition, i as useDraggable };
+
+//# sourceMappingURL=useDraggable.mjs.map

package/dist/esm/modules/guide/components/Toolbar/V2/useDraggable.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"useDraggable.mjs","sources":["../../../../../../../src/modules/guide/components/Toolbar/V2/useDraggable.ts"],"sourcesContent":["import React from \"react\";\n\n// NOTE: This hook was generated entirely with Claude then lightly touched up,\n// and the behavior works correctly from testing it manually in the browser.\n\ntype Position = { top: number; right: number };\n\ntype UseDraggableOptions = {\n  elementRef: React.RefObject<HTMLElement | null>;\n  initialPosition?: Position;\n  reclampDeps?: React.DependencyList;\n  /** Extra space to reserve beyond the element's right edge (px). */\n  rightPadding?: number;\n};\n\ntype UseDraggableReturn = {\n  position: Position;\n  isDragging: boolean;\n  handlePointerDown: (e: React.PointerEvent) => void;\n  /** True if the pointer moved beyond a small threshold during the last interaction. */\n  hasDraggedRef: React.RefObject<boolean>;\n};\n\nconst DEFAULT_POSITION: Position = { top: 16, right: 16 };\nconst DRAG_THRESHOLD = 5;\n\n/**\n * @param rightPadding Extra space to reserve on the right edge (e.g. for a\n *   drag handle that protrudes beyond the element). The element's left edge\n *   is clamped so that `elementWidth + rightPadding` stays within the viewport.\n */\nexport function clampPosition(\n  pos: Position,\n  elementWidth: number,\n  elementHeight: number,\n  rightPadding = 0,\n): Position {\n  const viewportWidth = window.innerWidth;\n  const viewportHeight = window.innerHeight;\n\n  const totalWidth = elementWidth + rightPadding;\n  const left = viewportWidth - pos.right - elementWidth;\n  const clampedLeft = Math.max(0, Math.min(left, viewportWidth - totalWidth));\n  const clampedTop = Math.max(\n    0,\n    Math.min(pos.top, viewportHeight - elementHeight),\n  );\n  const clampedRight = viewportWidth - clampedLeft - elementWidth;\n\n  return { top: clampedTop, right: clampedRight };\n}\n\nexport function useDraggable({\n  elementRef,\n  initialPosition = DEFAULT_POSITION,\n  reclampDeps = [],\n  rightPadding = 0,\n}: UseDraggableOptions): UseDraggableReturn {\n  const [position, setPosition] = React.useState<Position>(initialPosition);\n  const [isDragging, setIsDragging] = React.useState(false);\n\n  const positionRef = React.useRef(position);\n  positionRef.current = position;\n\n  const startPointerRef = React.useRef({ x: 0, y: 0 });\n  const startPositionRef = React.useRef<Position>({ top: 0, right: 0 });\n  const rafIdRef = React.useRef<number | null>(null);\n  const isDraggingRef = React.useRef(false);\n  const hasDraggedRef = React.useRef(false);\n  const cleanupListenersRef = React.useRef<(() => void) | null>(null);\n\n  const reclamp = React.useCallback(() => {\n    const el = elementRef.current;\n    if (!el) return;\n    const rect = el.getBoundingClientRect();\n    setPosition((prev) =>\n      clampPosition(prev, rect.width, rect.height, rightPadding),\n    );\n  }, [elementRef, rightPadding]);\n\n  // Stable pointerdown handler\n  const handlePointerDown = React.useCallback(\n    (e: React.PointerEvent) => {\n      e.preventDefault();\n      startPointerRef.current = { x: e.clientX, y: e.clientY };\n      startPositionRef.current = { ...positionRef.current };\n      isDraggingRef.current = true;\n      hasDraggedRef.current = false;\n      setIsDragging(true);\n\n      const onPointerMove = (moveEvent: PointerEvent) => {\n        if (!isDraggingRef.current) return;\n\n        const dx = moveEvent.clientX - startPointerRef.current.x;\n        const dy = moveEvent.clientY - startPointerRef.current.y;\n        if (!hasDraggedRef.current && Math.hypot(dx, dy) >= DRAG_THRESHOLD) {\n          hasDraggedRef.current = true;\n        }\n\n        if (rafIdRef.current !== null) return;\n\n        rafIdRef.current = requestAnimationFrame(() => {\n          rafIdRef.current = null;\n          if (!isDraggingRef.current) return;\n\n          const dx = moveEvent.clientX - startPointerRef.current.x;\n          const dy = moveEvent.clientY - startPointerRef.current.y;\n\n          const newPos: Position = {\n            top: startPositionRef.current.top + dy,\n            right: startPositionRef.current.right - dx,\n          };\n\n          const el = elementRef.current;\n          if (!el) return;\n          const rect = el.getBoundingClientRect();\n          const clamped = clampPosition(\n            newPos,\n            rect.width,\n            rect.height,\n            rightPadding,\n          );\n          setPosition(clamped);\n        });\n      };\n\n      const cleanup = () => {\n        isDraggingRef.current = false;\n        setIsDragging(false);\n        if (rafIdRef.current !== null) {\n          cancelAnimationFrame(rafIdRef.current);\n          rafIdRef.current = null;\n        }\n        document.removeEventListener(\"pointermove\", onPointerMove);\n        document.removeEventListener(\"pointerup\", onPointerUp);\n        cleanupListenersRef.current = null;\n      };\n\n      const onPointerUp = () => cleanup();\n\n      document.addEventListener(\"pointermove\", onPointerMove);\n      document.addEventListener(\"pointerup\", onPointerUp);\n      cleanupListenersRef.current = cleanup;\n    },\n    [elementRef, rightPadding],\n  );\n\n  // Cleanup on unmount\n  React.useEffect(() => {\n    return () => {\n      cleanupListenersRef.current?.();\n    };\n  }, []);\n\n  // Re-clamp on window resize\n  React.useEffect(() => {\n    const onResize = () => reclamp();\n    window.addEventListener(\"resize\", onResize);\n    return () => window.removeEventListener(\"resize\", onResize);\n  }, [reclamp]);\n\n  // Re-clamp when deps change (e.g. collapse toggle)\n  React.useEffect(() => {\n    const id = requestAnimationFrame(() => reclamp());\n    return () => cancelAnimationFrame(id);\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, reclampDeps);\n\n  return { position, isDragging, handlePointerDown, hasDraggedRef };\n}\n"],"names":["DEFAULT_POSITION","top","right","DRAG_THRESHOLD","clampPosition","pos","elementWidth","elementHeight","rightPadding","viewportWidth","window","innerWidth","viewportHeight","innerHeight","totalWidth","left","clampedLeft","Math","max","min","clampedTop","clampedRight","useDraggable","elementRef","initialPosition","reclampDeps","position","setPosition","React","useState","isDragging","setIsDragging","positionRef","useRef","current","startPointerRef","x","y","startPositionRef","rafIdRef","isDraggingRef","hasDraggedRef","cleanupListenersRef","reclamp","useCallback","el","rect","getBoundingClientRect","prev","width","height","handlePointerDown","e","preventDefault","clientX","clientY","onPointerMove","moveEvent","dx","dy","hypot","requestAnimationFrame","newPos","clamped","cleanup","cancelAnimationFrame","removeEventListener","onPointerUp","addEventListener","useEffect","onResize","id"],"mappings":"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"}
+{"version":3,"file":"useDraggable.mjs","names":[],"sources":["../../../../../../../src/modules/guide/components/Toolbar/V2/useDraggable.ts"],"sourcesContent":["import React from \"react\";\n\n// NOTE: This hook was generated entirely with Claude then lightly touched up,\n// and the behavior works correctly from testing it manually in the browser.\n\ntype Position = { top: number; right: number };\n\ntype UseDraggableOptions = {\n  elementRef: React.RefObject<HTMLElement | null>;\n  initialPosition?: Position;\n  reclampDeps?: React.DependencyList;\n  /** Extra space to reserve beyond the element's right edge (px). */\n  rightPadding?: number;\n};\n\ntype UseDraggableReturn = {\n  position: Position;\n  isDragging: boolean;\n  handlePointerDown: (e: React.PointerEvent) => void;\n  /** True if the pointer moved beyond a small threshold during the last interaction. */\n  hasDraggedRef: React.RefObject<boolean>;\n};\n\nconst DEFAULT_POSITION: Position = { top: 16, right: 16 };\nconst DRAG_THRESHOLD = 5;\n\n/**\n * @param rightPadding Extra space to reserve on the right edge (e.g. for a\n *   drag handle that protrudes beyond the element). The element's left edge\n *   is clamped so that `elementWidth + rightPadding` stays within the viewport.\n */\nexport function clampPosition(\n  pos: Position,\n  elementWidth: number,\n  elementHeight: number,\n  rightPadding = 0,\n): Position {\n  const viewportWidth = window.innerWidth;\n  const viewportHeight = window.innerHeight;\n\n  const totalWidth = elementWidth + rightPadding;\n  const left = viewportWidth - pos.right - elementWidth;\n  const clampedLeft = Math.max(0, Math.min(left, viewportWidth - totalWidth));\n  const clampedTop = Math.max(\n    0,\n    Math.min(pos.top, viewportHeight - elementHeight),\n  );\n  const clampedRight = viewportWidth - clampedLeft - elementWidth;\n\n  return { top: clampedTop, right: clampedRight };\n}\n\nexport function useDraggable({\n  elementRef,\n  initialPosition = DEFAULT_POSITION,\n  reclampDeps = [],\n  rightPadding = 0,\n}: UseDraggableOptions): UseDraggableReturn {\n  const [position, setPosition] = React.useState<Position>(initialPosition);\n  const [isDragging, setIsDragging] = React.useState(false);\n\n  const positionRef = React.useRef(position);\n  positionRef.current = position;\n\n  const startPointerRef = React.useRef({ x: 0, y: 0 });\n  const startPositionRef = React.useRef<Position>({ top: 0, right: 0 });\n  const rafIdRef = React.useRef<number | null>(null);\n  const isDraggingRef = React.useRef(false);\n  const hasDraggedRef = React.useRef(false);\n  const cleanupListenersRef = React.useRef<(() => void) | null>(null);\n\n  const reclamp = React.useCallback(() => {\n    const el = elementRef.current;\n    if (!el) return;\n    const rect = el.getBoundingClientRect();\n    setPosition((prev) =>\n      clampPosition(prev, rect.width, rect.height, rightPadding),\n    );\n  }, [elementRef, rightPadding]);\n\n  // Stable pointerdown handler\n  const handlePointerDown = React.useCallback(\n    (e: React.PointerEvent) => {\n      e.preventDefault();\n      startPointerRef.current = { x: e.clientX, y: e.clientY };\n      startPositionRef.current = { ...positionRef.current };\n      isDraggingRef.current = true;\n      hasDraggedRef.current = false;\n      setIsDragging(true);\n\n      const onPointerMove = (moveEvent: PointerEvent) => {\n        if (!isDraggingRef.current) return;\n\n        const dx = moveEvent.clientX - startPointerRef.current.x;\n        const dy = moveEvent.clientY - startPointerRef.current.y;\n        if (!hasDraggedRef.current && Math.hypot(dx, dy) >= DRAG_THRESHOLD) {\n          hasDraggedRef.current = true;\n        }\n\n        if (rafIdRef.current !== null) return;\n\n        rafIdRef.current = requestAnimationFrame(() => {\n          rafIdRef.current = null;\n          if (!isDraggingRef.current) return;\n\n          const dx = moveEvent.clientX - startPointerRef.current.x;\n          const dy = moveEvent.clientY - startPointerRef.current.y;\n\n          const newPos: Position = {\n            top: startPositionRef.current.top + dy,\n            right: startPositionRef.current.right - dx,\n          };\n\n          const el = elementRef.current;\n          if (!el) return;\n          const rect = el.getBoundingClientRect();\n          const clamped = clampPosition(\n            newPos,\n            rect.width,\n            rect.height,\n            rightPadding,\n          );\n          setPosition(clamped);\n        });\n      };\n\n      const cleanup = () => {\n        isDraggingRef.current = false;\n        setIsDragging(false);\n        if (rafIdRef.current !== null) {\n          cancelAnimationFrame(rafIdRef.current);\n          rafIdRef.current = null;\n        }\n        document.removeEventListener(\"pointermove\", onPointerMove);\n        document.removeEventListener(\"pointerup\", onPointerUp);\n        cleanupListenersRef.current = null;\n      };\n\n      const onPointerUp = () => cleanup();\n\n      document.addEventListener(\"pointermove\", onPointerMove);\n      document.addEventListener(\"pointerup\", onPointerUp);\n      cleanupListenersRef.current = cleanup;\n    },\n    [elementRef, rightPadding],\n  );\n\n  // Cleanup on unmount\n  React.useEffect(() => {\n    return () => {\n      cleanupListenersRef.current?.();\n    };\n  }, []);\n\n  // Re-clamp on window resize\n  React.useEffect(() => {\n    const onResize = () => reclamp();\n    window.addEventListener(\"resize\", onResize);\n    return () => window.removeEventListener(\"resize\", onResize);\n  }, [reclamp]);\n\n  // Re-clamp when deps change (e.g. collapse toggle)\n  React.useEffect(() => {\n    const id = requestAnimationFrame(() => reclamp());\n    return () => cancelAnimationFrame(id);\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, reclampDeps);\n\n  return { position, isDragging, handlePointerDown, hasDraggedRef };\n}\n"],"mappings":"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"}

package/dist/esm/modules/guide/components/Toolbar/V2/useInspectGuideClientStore.mjs

@@ -1,192 +1,136 @@
-import { checkStateIfThrottled as p, checkActivatable as _ } from "@knocklabs/client";
-import { useGuideContext as g, useStore as v } from "@knocklabs/react-core";
-import * as h from "react";
-import { FOCUS_ERRORS as y } from "./helpers.mjs";
-const m = (e) => e.reduce((t, s) => ({
-  ...t,
-  [s.key]: s
-}), {}), G = (e, t, s, r) => {
-  var u, i, n, a, l, f, o, c;
-  const d = !!((a = (n = (i = (u = r.byKey) == null ? void 0 : u.one) == null ? void 0 : i.metadata) == null ? void 0 : n.opts) != null && a.includeThrottled) || !!((c = (o = (f = (l = r.byKey) == null ? void 0 : l.all) == null ? void 0 : f.metadata) == null ? void 0 : o.opts) != null && c.includeThrottled);
-  return e.bypass_global_group_limit ? "returned" : e.key === s.resolved ? t.throttled && !d ? "throttled" : "returned" : "queried";
-}, T = (e, t, s, r) => {
-  var i, n, a, l;
-  const d = !!((l = (a = (n = (i = r.byType) == null ? void 0 : i.one) == null ? void 0 : n.metadata) == null ? void 0 : a.opts) != null && l.includeThrottled), u = r.byType.one;
-  if (u.size === 0)
-    return "queried";
-  if (e.bypass_global_group_limit) {
-    const o = [...u.values()][0];
-    return e.key !== o.key ? "queried" : "returned";
-  }
-  return e.key === s.resolved ? t.throttled && !d ? "throttled" : "returned" : "queried";
-}, S = (e, t, s, r) => {
-  var l, f, o, c;
-  const d = r.byType.all;
-  if (d.size === 0)
-    return "queried";
-  const u = [...d.values()], i = u[0], n = m(u);
-  return (c = (o = (f = (l = r.byType) == null ? void 0 : l.all) == null ? void 0 : f.metadata) == null ? void 0 : o.opts) != null && c.includeThrottled ? n[e.key] ? "returned" : "queried" : (i.bypass_global_group_limit || i.key === s.resolved) && n[e.key] ? t.throttled ? e.bypass_global_group_limit ? "returned" : "throttled" : "returned" : "queried";
-}, U = (e, t, s, r) => {
-  var d, u;
-  if (r.byKey)
-    return G(e, t, s, r);
-  if ((d = r.byType) != null && d.all)
-    return S(e, t, s, r);
-  if ((u = r.byType) != null && u.one)
-    return T(e, t, s, r);
-}, K = (e, t, s) => {
-  if (!s || s.status === "open")
-    return {
-      status: void 0
-    };
-  const r = {
-    byKey: (s.results.byKey || {})[e.key],
-    byType: (s.results.byType || {})[e.type]
-  };
-  if (!!!(r.byKey || r.byType))
-    return {
-      status: void 0
-    };
-  const u = U(e, t, s, r);
-  return u ? {
-    status: u,
-    query: r
-  } : {
-    status: void 0
-  };
-}, R = (e, t) => {
-  const s = {};
-  return ((t == null ? void 0 : t.reason) === "not_in_target_audience" || (t == null ? void 0 : t.reason) === "target_conditions_not_met") && (s.targetable = {
-    status: !1,
-    reason: t.reason,
-    message: t.message
-  }), ((t == null ? void 0 : t.reason) === "marked_as_archived" || (e.steps || []).every((r) => !!r.message.archived_at)) && (s.archived = {
-    status: !0
-  }), (t == null ? void 0 : t.reason) === "guide_not_active" && (s.active = {
-    status: !1
-  }), s;
-}, q = ({
-  active: e,
-  targetable: t,
-  archived: s
-}) => !(!e.status || !t.status || s.status), w = ({
-  activatable: e,
-  selectable: t
-}) => !(!e.status || !t.status), C = (e, t, s, r) => {
-  const {
-    ineligibleGuides: d,
-    location: u
-  } = s, i = d[e.key], n = R(e, i), a = {
-    // isEligible:
-    active: (n == null ? void 0 : n.active) || {
-      status: !0
-    },
-    targetable: (n == null ? void 0 : n.targetable) || {
-      status: !0
-    },
-    archived: (n == null ? void 0 : n.archived) || {
-      status: !1
-    },
-    // isQualified:
-    activatable: {
-      status: _(e, u)
-    },
-    selectable: K(e, s, r)
-  }, l = {
-    ...a,
-    isEligible: q(a),
-    isQualified: w(a)
-  };
-  return {
-    ...e,
-    orderIndex: t,
-    annotation: l
-  };
-}, $ = (e, t) => ({
-  __typename: "UncommittedGuide",
-  key: e,
-  orderIndex: t,
-  active: !1,
-  bypass_global_group_limit: !1,
-  annotation: {
-    isEligible: !1,
-    isQualified: !1,
-    active: {
-      status: !1
-    },
-    selectable: {
-      status: void 0
-    }
-  }
-}), L = (e) => {
-  var f;
-  const {
-    client: t
-  } = g(), s = v(t.store, (o) => {
-    const c = p(o);
-    return {
-      location: o.location,
-      guides: o.guides,
-      guideGroups: o.guideGroups,
-      ineligibleGuides: o.ineligibleGuides,
-      debug: o.debug,
-      counter: o.counter,
-      queries: o.queries,
-      throttled: c
-    };
-  }), r = h.useRef(void 0);
-  if (!((f = s.debug) != null && f.debugging))
-    return;
-  const d = Object.entries(s.queries)[0];
-  if (!d || d[1].status === "loading")
-    return {
-      status: "error",
-      error: "no_guides_fetched",
-      message: "Loading..."
-    };
-  const u = s.guideGroups[0];
-  if (!u)
-    return {
-      status: "error",
-      error: "no_guide_group",
-      message: "No guide group found"
-    };
-  const i = t.getStage(), n = !i || i.status === "open";
-  let a;
-  n && r.current ? a = r.current : (a = u.display_sequence.map((o, c) => {
-    const b = s.guides[o];
-    return b ? C(b, c, s, i) : $(o, c);
-  }), n || (r.current = a));
-  const l = Object.keys(e.focusedGuideKeys || {})[0];
-  if ((i == null ? void 0 : i.status) === "closed" && l) {
-    const o = a.find((c) => c.key === l);
-    if (!o)
-      return {
-        status: "error",
-        error: "focus_unknown_guide",
-        message: `Unable to display \`${l}\`, ${y.focusUnknownGuide.toLowerCase()}.`
-      };
-    if (B(o))
-      return {
-        status: "error",
-        error: "focus_uncommitted_guide",
-        message: `Unable to display \`${l}\`, ${y.focusUncommittedGuide.toLowerCase()}.`
-      };
-    if (!o.annotation.selectable.status)
-      return {
-        status: "error",
-        error: "focus_unselectable_guide",
-        message: `Unable to display \`${l}\`, ${y.focusUnselectableGuide.toLowerCase()}.`
-      };
-  }
-  return {
-    status: "ok",
-    guides: a
-  };
-}, B = (e) => typeof e == "object" && e !== null && "__typename" in e && e.__typename === "UncommittedGuide";
-export {
-  B as isUncommittedGuide,
-  w as resolveIsQualified,
-  L as useInspectGuideClientStore
-};
-//# sourceMappingURL=useInspectGuideClientStore.mjs.map
+import { FOCUS_ERRORS as e } from "./helpers.mjs";
+import { useGuideContext as t, useStore as n } from "@knocklabs/react-core";
+import * as r from "react";
+import { checkActivatable as i, checkStateIfThrottled as a } from "@knocklabs/client";
+//#region src/modules/guide/components/Toolbar/V2/useInspectGuideClientStore.ts
+var o = (e) => e.reduce((e, t) => ({
+	...e,
+	[t.key]: t
+}), {}), s = (e, t, n, r) => {
+	let i = !!r.byKey?.one?.metadata?.opts?.includeThrottled || !!r.byKey?.all?.metadata?.opts?.includeThrottled;
+	return e.bypass_global_group_limit ? "returned" : e.key === n.resolved ? t.throttled && !i ? "throttled" : "returned" : "queried";
+}, c = (e, t, n, r) => {
+	let i = !!r.byType?.one?.metadata?.opts?.includeThrottled, a = r.byType.one;
+	if (a.size === 0) return "queried";
+	if (e.bypass_global_group_limit) {
+		let t = [...a.values()][0];
+		return e.key === t.key ? "returned" : "queried";
+	}
+	return e.key === n.resolved ? t.throttled && !i ? "throttled" : "returned" : "queried";
+}, l = (e, t, n, r) => {
+	let i = r.byType.all;
+	if (i.size === 0) return "queried";
+	let a = [...i.values()], s = a[0], c = o(a);
+	return r.byType?.all?.metadata?.opts?.includeThrottled ? c[e.key] ? "returned" : "queried" : (s.bypass_global_group_limit || s.key === n.resolved) && c[e.key] ? t.throttled ? e.bypass_global_group_limit ? "returned" : "throttled" : "returned" : "queried";
+}, u = (e, t, n, r) => {
+	if (r.byKey) return s(e, t, n, r);
+	if (r.byType?.all) return l(e, t, n, r);
+	if (r.byType?.one) return c(e, t, n, r);
+}, d = (e, t, n) => {
+	if (!n || n.status === "open") return { status: void 0 };
+	let r = {
+		byKey: (n.results.byKey || {})[e.key],
+		byType: (n.results.byType || {})[e.type]
+	};
+	if (!(r.byKey || r.byType)) return { status: void 0 };
+	let i = u(e, t, n, r);
+	return i ? {
+		status: i,
+		query: r
+	} : { status: void 0 };
+}, f = (e, t) => {
+	let n = {};
+	return (t?.reason === "not_in_target_audience" || t?.reason === "target_conditions_not_met") && (n.targetable = {
+		status: !1,
+		reason: t.reason,
+		message: t.message
+	}), (t?.reason === "marked_as_archived" || (e.steps || []).every((e) => !!e.message.archived_at)) && (n.archived = { status: !0 }), t?.reason === "guide_not_active" && (n.active = { status: !1 }), n;
+}, p = ({ active: e, targetable: t, archived: n }) => !(!e.status || !t.status || n.status), m = ({ activatable: e, selectable: t }) => !(!e.status || !t.status), h = (e, t, n, r) => {
+	let { ineligibleGuides: a, location: o } = n, s = a[e.key], c = f(e, s), l = {
+		active: c?.active || { status: !0 },
+		targetable: c?.targetable || { status: !0 },
+		archived: c?.archived || { status: !1 },
+		activatable: { status: i(e, o) },
+		selectable: d(e, n, r)
+	}, u = {
+		...l,
+		isEligible: p(l),
+		isQualified: m(l)
+	};
+	return {
+		...e,
+		orderIndex: t,
+		annotation: u
+	};
+}, g = (e, t) => ({
+	__typename: "UncommittedGuide",
+	key: e,
+	orderIndex: t,
+	active: !1,
+	bypass_global_group_limit: !1,
+	annotation: {
+		isEligible: !1,
+		isQualified: !1,
+		active: { status: !1 },
+		selectable: { status: void 0 }
+	}
+}), _ = (i) => {
+	let { client: o } = t(), s = n(o.store, (e) => {
+		let t = a(e);
+		return {
+			location: e.location,
+			guides: e.guides,
+			guideGroups: e.guideGroups,
+			ineligibleGuides: e.ineligibleGuides,
+			debug: e.debug,
+			counter: e.counter,
+			queries: e.queries,
+			throttled: t
+		};
+	}), c = r.useRef(void 0);
+	if (!s.debug?.debugging) return;
+	let l = Object.entries(s.queries)[0];
+	if (!l || l[1].status === "loading") return {
+		status: "error",
+		error: "no_guides_fetched",
+		message: "Loading..."
+	};
+	let u = s.guideGroups[0];
+	if (!u) return {
+		status: "error",
+		error: "no_guide_group",
+		message: "No guide group found"
+	};
+	let d = o.getStage(), f = !d || d.status === "open", p;
+	f && c.current ? p = c.current : (p = u.display_sequence.map((e, t) => {
+		let n = s.guides[e];
+		return n ? h(n, t, s, d) : g(e, t);
+	}), f || (c.current = p));
+	let m = Object.keys(i.focusedGuideKeys || {})[0];
+	if (d?.status === "closed" && m) {
+		let t = p.find((e) => e.key === m);
+		if (!t) return {
+			status: "error",
+			error: "focus_unknown_guide",
+			message: `Unable to display \`${m}\`, ${e.focusUnknownGuide.toLowerCase()}.`
+		};
+		if (v(t)) return {
+			status: "error",
+			error: "focus_uncommitted_guide",
+			message: `Unable to display \`${m}\`, ${e.focusUncommittedGuide.toLowerCase()}.`
+		};
+		if (!t.annotation.selectable.status) return {
+			status: "error",
+			error: "focus_unselectable_guide",
+			message: `Unable to display \`${m}\`, ${e.focusUnselectableGuide.toLowerCase()}.`
+		};
+	}
+	return {
+		status: "ok",
+		guides: p
+	};
+}, v = (e) => typeof e == "object" && !!e && "__typename" in e && e.__typename === "UncommittedGuide";
+//#endregion
+export { v as isUncommittedGuide, m as resolveIsQualified, _ as useInspectGuideClientStore };
+
+//# sourceMappingURL=useInspectGuideClientStore.mjs.map