@knocklabs/react 0.11.12 → 0.11.13

package/dist/cjs/modules/guide/components/Toolbar/V2/V2.js.map

@@ -1 +1 @@
-{"version":3,"file":"V2.js","sources":["../../../../../../../src/modules/guide/components/Toolbar/V2/V2.tsx"],"sourcesContent":["import { useGuideContext } from \"@knocklabs/react-core\";\nimport { Button } from \"@telegraph/button\";\nimport { Icon } from \"@telegraph/icon\";\nimport { Box, Stack } from \"@telegraph/layout\";\nimport { SegmentedControl } from \"@telegraph/segmented-control\";\nimport { Tooltip } from \"@telegraph/tooltip\";\nimport { Text } from \"@telegraph/typography\";\nimport {\n  ChevronDown,\n  ChevronRight,\n  GripVertical,\n  LogOut,\n  Minimize2,\n  SlidersHorizontal,\n} from \"lucide-react\";\nimport React from \"react\";\n\nimport { KnockButton } from \"../KnockButton\";\nimport { TOOLBAR_Z_INDEX } from \"../shared\";\nimport \"../styles.css\";\n\nimport { FocusChin } from \"./FocusChin\";\nimport { GuideContextDetails } from \"./GuideContextDetails\";\nimport { GuideRow } from \"./GuideRow\";\nimport { DisplayOption, clearRunConfigLS, getRunConfig } from \"./helpers\";\nimport { useDraggable } from \"./useDraggable\";\nimport {\n  InspectionResultOk,\n  useInspectGuideClientStore,\n} from \"./useInspectGuideClientStore\";\n\nconst TOGGLE_COLLAPSED_HOTKEY = \".\";\n\nconst TOOLBAR_WIDTH = \"540px\";\n\nconst Kbd = ({ children }: { children: React.ReactNode }) => {\n  return (\n    <kbd\n      style={{\n        display: \"inline-block\",\n        padding: \"1px 4px\",\n        borderRadius: \"var(--tgph-rounded-2)\",\n        border: \"1px solid rgba(255, 255, 255, 0.3)\",\n        backgroundColor: \"rgba(255, 255, 255, 0.15)\",\n      }}\n    >\n      {children}\n    </kbd>\n  );\n};\n\nconst filterGuides = (\n  guides: InspectionResultOk[\"guides\"],\n  displayOption: DisplayOption,\n) => {\n  return guides.filter((guide) => {\n    const { isEligible, isQualified } = guide.annotation;\n    const isDisplayable = isEligible && isQualified;\n\n    if (displayOption === \"only-displayable\" && !isDisplayable) {\n      return false;\n    }\n    if (displayOption === \"only-eligible\" && !isEligible) {\n      return false;\n    }\n    if (displayOption === \"only-active\" && !guide.annotation.active.status) {\n      return false;\n    }\n    return true;\n  });\n};\n\nexport const V2 = () => {\n  const { client } = useGuideContext();\n\n  const [displayOption, setDisplayOption] =\n    React.useState<DisplayOption>(\"only-active\");\n  const [runConfig, setRunConfig] = React.useState(() => getRunConfig());\n  const [isCollapsed, setIsCollapsed] = React.useState(false);\n  const [isContextPanelOpen, setIsContextPanelOpen] = React.useState(false);\n\n  const [expandedGuideRowKey, setExpandedGuideRowKey] = React.useState<\n    string | undefined\n  >();\n\n  React.useEffect(() => {\n    setExpandedGuideRowKey(undefined);\n  }, [displayOption]);\n\n  React.useEffect(() => {\n    const { isVisible = false, focusedGuideKeys = {} } = runConfig || {};\n    const isDebugging = client.store.state.debug?.debugging;\n    if (isVisible && !isDebugging) {\n      client.setDebug({ focusedGuideKeys });\n\n      // If focused, switch to all guides so you can see in the list.\n      if (Object.keys(focusedGuideKeys).length > 0) {\n        setDisplayOption(\"all-guides\");\n      }\n    }\n\n    return () => {\n      client.unsetDebug();\n    };\n  }, [runConfig, client, setDisplayOption]);\n\n  // Toggle collapsed state with Ctrl + .\n  React.useEffect(() => {\n    const handleKeyDown = (e: KeyboardEvent) => {\n      if (e.ctrlKey && e.key === TOGGLE_COLLAPSED_HOTKEY && !e.repeat) {\n        e.preventDefault();\n        setIsCollapsed((prev) => !prev);\n      }\n    };\n\n    window.addEventListener(\"keydown\", handleKeyDown);\n    return () => {\n      window.removeEventListener(\"keydown\", handleKeyDown);\n    };\n  }, []);\n\n  const containerRef = React.useRef<HTMLDivElement>(null);\n  const guideListRef = React.useRef<HTMLDivElement>(null);\n  const { position, isDragging, handlePointerDown, hasDraggedRef } =\n    useDraggable({\n      elementRef: containerRef,\n      reclampDeps: [isCollapsed],\n      initialPosition: { top: 16, right: 16 },\n    });\n\n  const result = useInspectGuideClientStore(runConfig);\n  if (!result || !runConfig?.isVisible) {\n    return null;\n  }\n\n  const guides =\n    result.status === \"ok\" ? filterGuides(result.guides, displayOption) : [];\n\n  return (\n    <Box\n      tgphRef={containerRef}\n      position=\"fixed\"\n      style={{\n        top: position.top + \"px\",\n        right: position.right + \"px\",\n        zIndex: TOOLBAR_Z_INDEX,\n      }}\n    >\n      {isCollapsed ? (\n        <Tooltip\n          side=\"left\"\n          delayDuration={500}\n          label={\n            <Text as=\"span\" size=\"1\">\n              Guide Toolbar\n              <Stack display=\"inline-block\" ml=\"3\">\n                <Kbd>ctrl</Kbd> + <Kbd>.</Kbd>\n              </Stack>\n            </Text>\n          }\n        >\n          <Stack\n            border=\"px\"\n            rounded=\"4\"\n            align=\"center\"\n            justify=\"center\"\n            w=\"10\"\n            h=\"10\"\n            onPointerDown={handlePointerDown}\n            backgroundColor=\"surface-1\"\n            style={{\n              cursor: isDragging ? \"grabbing\" : \"grab\",\n              touchAction: \"none\",\n              userSelect: \"none\",\n              animation: \"toolbar-collapse-fade-in 150ms ease-out\",\n            }}\n          >\n            <Box\n              style={{\n                transform: \"scale(0.7)\",\n                transformOrigin: \"center center\",\n              }}\n            >\n              <KnockButton\n                onClick={() => {\n                  if (!hasDraggedRef.current) {\n                    setIsCollapsed(false);\n                  }\n                }}\n                positioned={false}\n              />\n            </Box>\n          </Stack>\n        </Tooltip>\n      ) : (\n        <Stack\n          direction=\"column\"\n          backgroundColor=\"surface-1\"\n          rounded=\"4\"\n          border=\"px\"\n          overflow=\"hidden\"\n          style={{\n            width: TOOLBAR_WIDTH,\n            boxShadow: \"0 8px 32px var(--tgph-gray-5)\",\n            animation: \"toolbar-expand-fade-in 150ms ease-out\",\n          }}\n        >\n          {/* Header — also acts as drag handle area */}\n          <Stack\n            w=\"full\"\n            p=\"2\"\n            justify=\"space-between\"\n            direction=\"row\"\n            align=\"center\"\n            gap=\"2\"\n            borderBottom=\"px\"\n            onPointerDown={handlePointerDown}\n            style={{\n              boxSizing: \"border-box\",\n              cursor: isDragging ? \"grabbing\" : \"grab\",\n              touchAction: \"none\",\n              userSelect: \"none\",\n            }}\n          >\n            {/* Left: drag icon + segmented control + settings */}\n            <Stack align=\"center\" gap=\"1_5\" style={{ minWidth: 0, flex: 1 }}>\n              <Stack\n                display=\"inline-flex\"\n                align=\"center\"\n                style={{\n                  cursor: isDragging ? \"grabbing\" : \"grab\",\n                  touchAction: \"none\",\n                  userSelect: \"none\",\n                }}\n                onPointerDown={(e: React.PointerEvent) => {\n                  // Already handled by parent, prevent double-fire\n                  e.stopPropagation();\n                  handlePointerDown(e);\n                }}\n              >\n                <Icon color=\"gray\" size=\"1\" icon={GripVertical} aria-hidden />\n              </Stack>\n              <Stack\n                align=\"center\"\n                gap=\"1_5\"\n                onPointerDown={(e: React.PointerEvent) => e.stopPropagation()}\n              >\n                <SegmentedControl.Root\n                  size=\"1\"\n                  type=\"single\"\n                  value={displayOption}\n                  onValueChange={(val: DisplayOption) => {\n                    if (!val) return;\n\n                    const debugSettings = client.store.state.debug;\n\n                    const focusedGuideKeys = Object.keys(\n                      debugSettings?.focusedGuideKeys || {},\n                    );\n\n                    // Exit out of focus if the currently focused guide is not\n                    // part of the selected list filter.\n                    if (result.status === \"ok\" && focusedGuideKeys.length > 0) {\n                      const currFocusedGuide = filterGuides(\n                        result.guides,\n                        val,\n                      ).find((g) => g.key === focusedGuideKeys[0]);\n\n                      if (!currFocusedGuide) {\n                        client.setDebug({\n                          ...debugSettings,\n                          focusedGuideKeys: {},\n                        });\n                      }\n                    }\n\n                    setDisplayOption(val);\n                  }}\n                >\n                  <SegmentedControl.Option\n                    value=\"all-guides\"\n                    style={{ width: \"54px\" }}\n                  >\n                    All\n                  </SegmentedControl.Option>\n                  <SegmentedControl.Option\n                    value=\"only-active\"\n                    style={{ width: \"54px\" }}\n                  >\n                    Active\n                  </SegmentedControl.Option>\n                  <SegmentedControl.Option\n                    value=\"only-eligible\"\n                    style={{ width: \"54px\" }}\n                  >\n                    Eligible\n                  </SegmentedControl.Option>\n                  {/* Note: `only-displayable` is not available for now */}\n                </SegmentedControl.Root>\n\n                <Tooltip label=\"Settings & target params\">\n                  <Button\n                    size=\"1\"\n                    variant={isContextPanelOpen ? \"outline\" : \"ghost\"}\n                    color={isContextPanelOpen ? \"blue\" : \"gray\"}\n                    leadingIcon={{\n                      icon: SlidersHorizontal,\n                      alt: \"Inspect target params\",\n                    }}\n                    trailingIcon={\n                      isContextPanelOpen\n                        ? { icon: ChevronDown, alt: \"Hide context data\" }\n                        : { icon: ChevronRight, alt: \"Show context data\" }\n                    }\n                    onClick={() => setIsContextPanelOpen((v) => !v)}\n                  />\n                </Tooltip>\n              </Stack>\n            </Stack>\n\n            {/* Right: exit + minimize buttons */}\n            <Stack\n              align=\"center\"\n              gap=\"1_5\"\n              style={{ flexShrink: 0 }}\n              onPointerDown={(e: React.PointerEvent) => e.stopPropagation()}\n            >\n              <Stack align=\"center\" gap=\"1_5\">\n                <Button\n                  size=\"1\"\n                  variant=\"outline\"\n                  leadingIcon={{ icon: LogOut, alt: \"Exit\" }}\n                  onClick={() => {\n                    setRunConfig((curr) => ({ ...curr, isVisible: false }));\n                    clearRunConfigLS();\n                    client.unsetDebug();\n                  }}\n                >\n                  Exit\n                </Button>\n                <Tooltip label=\"Minimize toolbar\">\n                  <Button\n                    size=\"1\"\n                    variant=\"outline\"\n                    leadingIcon={{ icon: Minimize2, alt: \"Minimize\" }}\n                    onClick={() => setIsCollapsed(true)}\n                  />\n                </Tooltip>\n              </Stack>\n            </Stack>\n          </Stack>\n\n          {/* Collapsible panel to show context data */}\n          {isContextPanelOpen && (\n            <Box borderBottom=\"px\">\n              <GuideContextDetails />\n            </Box>\n          )}\n\n          {/* Guide list content area */}\n          <Box\n            tgphRef={guideListRef}\n            p=\"1\"\n            overflow=\"auto\"\n            style={{ maxHeight: \"calc(80vh - 96px)\" }}\n          >\n            {result.status === \"error\" ? (\n              <Box px=\"2\" pb=\"1\" style={{ lineHeight: \"1.2\" }}>\n                <Text\n                  as=\"span\"\n                  size=\"1\"\n                  weight=\"medium\"\n                  color={\n                    result.error === \"no_guides_fetched\" ? \"default\" : \"red\"\n                  }\n                >\n                  {result.message}\n                </Text>\n              </Box>\n            ) : guides.length === 0 ? (\n              <Box px=\"2\" pb=\"1\" style={{ lineHeight: \"1.2\" }}>\n                <Text as=\"span\" size=\"1\" weight=\"medium\" color=\"default\">\n                  No guides match the current filter.\n                </Text>\n              </Box>\n            ) : (\n              guides.map((guide) => (\n                <GuideRow\n                  key={guide.key}\n                  guide={guide}\n                  orderIndex={guide.orderIndex}\n                  isExpanded={guide.key === expandedGuideRowKey}\n                  onClick={() => {\n                    setExpandedGuideRowKey((k) =>\n                      k && k === guide.key ? undefined : guide.key,\n                    );\n                  }}\n                />\n              ))\n            )}\n          </Box>\n\n          {/* Focus chin with dedicated controls */}\n          <FocusChin guides={guides} guideListRef={guideListRef} />\n        </Stack>\n      )}\n    </Box>\n  );\n};\n"],"names":["TOGGLE_COLLAPSED_HOTKEY","TOOLBAR_WIDTH","Kbd","children","React","display","padding","borderRadius","border","backgroundColor","filterGuides","guides","displayOption","filter","guide","isEligible","isQualified","annotation","active","status","V2","client","useGuideContext","setDisplayOption","useState","runConfig","setRunConfig","getRunConfig","isCollapsed","setIsCollapsed","isContextPanelOpen","setIsContextPanelOpen","expandedGuideRowKey","setExpandedGuideRowKey","useEffect","undefined","isVisible","focusedGuideKeys","isDebugging","store","state","debug","debugging","setDebug","Object","keys","length","unsetDebug","handleKeyDown","e","ctrlKey","key","repeat","preventDefault","prev","addEventListener","removeEventListener","containerRef","useRef","guideListRef","position","isDragging","handlePointerDown","hasDraggedRef","useDraggable","elementRef","reclampDeps","initialPosition","top","right","result","useInspectGuideClientStore","Box","zIndex","TOOLBAR_Z_INDEX","Tooltip","Text","Stack","cursor","touchAction","userSelect","animation","transform","transformOrigin","KnockButton","current","width","boxShadow","boxSizing","minWidth","flex","stopPropagation","Icon","GripVertical","SegmentedControl","val","debugSettings","find","g","Button","icon","SlidersHorizontal","alt","ChevronDown","ChevronRight","v","flexShrink","LogOut","curr","clearRunConfigLS","Minimize2","GuideContextDetails","maxHeight","lineHeight","error","message","map","GuideRow","orderIndex","k","FocusChin"],"mappings":"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"}
+{"version":3,"file":"V2.js","sources":["../../../../../../../src/modules/guide/components/Toolbar/V2/V2.tsx"],"sourcesContent":["import { KnockGuideClient } from \"@knocklabs/client\";\nimport { useGuideContext } from \"@knocklabs/react-core\";\nimport { Button } from \"@telegraph/button\";\nimport { Icon } from \"@telegraph/icon\";\nimport { Box, Stack } from \"@telegraph/layout\";\nimport { SegmentedControl } from \"@telegraph/segmented-control\";\nimport { Tooltip } from \"@telegraph/tooltip\";\nimport { Text } from \"@telegraph/typography\";\nimport {\n  ChevronDown,\n  ChevronRight,\n  GripVertical,\n  LogOut,\n  Minimize2,\n  SlidersHorizontal,\n} from \"lucide-react\";\nimport React from \"react\";\n\nimport { KnockButton } from \"../KnockButton\";\nimport { TOOLBAR_Z_INDEX } from \"../shared\";\nimport \"../styles.css\";\n\nimport { FocusChin } from \"./FocusChin\";\nimport { GuideContextDetails } from \"./GuideContextDetails\";\nimport { GuideRow } from \"./GuideRow\";\nimport { DisplayOption, sharedTooltipProps } from \"./helpers\";\nimport { useDraggable } from \"./useDraggable\";\nimport {\n  InspectionResultOk,\n  useInspectGuideClientStore,\n} from \"./useInspectGuideClientStore\";\n\nconst TOGGLE_COLLAPSED_HOTKEY = \".\";\n\nconst TOOLBAR_WIDTH = \"540px\";\n\nconst TOOLBAR_BOX_SHADOW = [\n  \"0 0 0 1px rgba(0, 0, 0, 0.06)\",\n  \"0 0 0 1px rgba(255, 255, 255, 0.10)\",\n  \"inset 0 1px 0 rgba(255, 255, 255, 0.04)\",\n  \"0 1px 1px 0 rgba(0, 0, 0, 0.04)\",\n  \"0 4px 6px -1px rgba(0, 0, 0, 0.05)\",\n  \"0 8px 16px -4px rgba(0, 0, 0, 0.06)\",\n].join(\", \");\n\nconst Kbd = ({ children }: { children: React.ReactNode }) => {\n  return (\n    <kbd\n      style={{\n        display: \"inline-block\",\n        padding: \"1px 4px\",\n        borderRadius: \"var(--tgph-rounded-2)\",\n        border: \"1px solid rgba(255, 255, 255, 0.3)\",\n        backgroundColor: \"rgba(255, 255, 255, 0.15)\",\n      }}\n    >\n      {children}\n    </kbd>\n  );\n};\n\nconst getEmptyStateMessage = (displayOption: DisplayOption) => {\n  switch (displayOption) {\n    case \"all-guides\":\n      return \"You have no guides. Get started by creating a guide.\";\n    case \"only-active\":\n      return \"There are no active guides.\";\n    case \"only-eligible\":\n      return \"Your current user is not eligible for any guides.\";\n  }\n};\n\nconst filterGuides = (\n  guides: InspectionResultOk[\"guides\"],\n  displayOption: DisplayOption,\n) => {\n  return guides.filter((guide) => {\n    if (displayOption === \"only-eligible\" && !guide.annotation.isEligible) {\n      return false;\n    }\n    if (displayOption === \"only-active\" && !guide.annotation.active.status) {\n      return false;\n    }\n    return true;\n  });\n};\n\ntype Props = {\n  readyToTarget: boolean;\n};\n\nexport const V2 = ({ readyToTarget }: Props) => {\n  const { client } = useGuideContext();\n\n  const [displayOption, setDisplayOption] =\n    React.useState<DisplayOption>(\"only-active\");\n  const [runConfig, setRunConfig] = React.useState(() =>\n    KnockGuideClient.getToolbarRunConfigFromUrl(),\n  );\n  const [isCollapsed, setIsCollapsed] = React.useState(false);\n  const [isContextPanelOpen, setIsContextPanelOpen] = React.useState(false);\n\n  const [expandedGuideRowKey, setExpandedGuideRowKey] = React.useState<\n    string | undefined\n  >();\n\n  React.useEffect(() => {\n    setExpandedGuideRowKey(undefined);\n  }, [displayOption]);\n\n  React.useEffect(() => {\n    const { isVisible = false, focusedGuideKeys = {} } = runConfig || {};\n    const isDebugging = client.store.state.debug?.debugging;\n    if (isVisible && !isDebugging && readyToTarget) {\n      client.setDebug({ focusedGuideKeys });\n\n      // If focused, switch to all guides so you can see in the list.\n      if (Object.keys(focusedGuideKeys).length > 0) {\n        setDisplayOption(\"all-guides\");\n      }\n    }\n\n    return () => {\n      client.unsetDebug();\n    };\n  }, [readyToTarget, runConfig, client, setDisplayOption]);\n\n  // Toggle collapsed state with Ctrl + .\n  React.useEffect(() => {\n    const handleKeyDown = (e: KeyboardEvent) => {\n      if (e.ctrlKey && e.key === TOGGLE_COLLAPSED_HOTKEY && !e.repeat) {\n        e.preventDefault();\n        setIsCollapsed((prev) => !prev);\n      }\n    };\n\n    window.addEventListener(\"keydown\", handleKeyDown);\n    return () => {\n      window.removeEventListener(\"keydown\", handleKeyDown);\n    };\n  }, []);\n\n  const containerRef = React.useRef<HTMLDivElement>(null);\n  const guideListRef = React.useRef<HTMLDivElement>(null);\n  const { position, isDragging, handlePointerDown, hasDraggedRef } =\n    useDraggable({\n      elementRef: containerRef,\n      reclampDeps: [isCollapsed],\n      initialPosition: { top: 16, right: 16 },\n    });\n\n  const result = useInspectGuideClientStore(runConfig);\n  if (!result || !runConfig?.isVisible) {\n    return null;\n  }\n\n  const guides =\n    result.status === \"ok\" ? filterGuides(result.guides, displayOption) : [];\n\n  return (\n    <Box\n      tgphRef={containerRef}\n      position=\"fixed\"\n      style={{\n        top: position.top + \"px\",\n        right: position.right + \"px\",\n        zIndex: TOOLBAR_Z_INDEX,\n      }}\n    >\n      {isCollapsed ? (\n        <Tooltip\n          side=\"left\"\n          label={\n            <Text as=\"span\" size=\"1\">\n              Guide Toolbar\n              <Stack display=\"inline-block\" ml=\"3\">\n                <Kbd>ctrl</Kbd> + <Kbd>.</Kbd>\n              </Stack>\n            </Text>\n          }\n          {...sharedTooltipProps}\n        >\n          <Stack\n            border=\"px\"\n            rounded=\"4\"\n            align=\"center\"\n            justify=\"center\"\n            w=\"10\"\n            h=\"10\"\n            onPointerDown={handlePointerDown}\n            backgroundColor=\"surface-1\"\n            style={{\n              cursor: isDragging ? \"grabbing\" : \"grab\",\n              touchAction: \"none\",\n              userSelect: \"none\",\n              animation: \"toolbar-collapse-fade-in 150ms ease-out\",\n            }}\n          >\n            <Box\n              style={{\n                transform: \"scale(0.7)\",\n                transformOrigin: \"center center\",\n              }}\n            >\n              <KnockButton\n                onClick={() => {\n                  if (!hasDraggedRef.current) {\n                    setIsCollapsed(false);\n                  }\n                }}\n                positioned={false}\n              />\n            </Box>\n          </Stack>\n        </Tooltip>\n      ) : (\n        <Stack\n          direction=\"column\"\n          backgroundColor=\"surface-1\"\n          rounded=\"4\"\n          overflow=\"hidden\"\n          style={{\n            width: TOOLBAR_WIDTH,\n            boxShadow: TOOLBAR_BOX_SHADOW,\n            animation: \"toolbar-expand-fade-in 150ms ease-out\",\n          }}\n        >\n          {/* Header — also acts as drag handle area */}\n          <Stack\n            w=\"full\"\n            p=\"2\"\n            justify=\"space-between\"\n            direction=\"row\"\n            align=\"center\"\n            gap=\"2\"\n            borderBottom=\"px\"\n            onPointerDown={handlePointerDown}\n            style={{\n              boxSizing: \"border-box\",\n              cursor: isDragging ? \"grabbing\" : \"grab\",\n              touchAction: \"none\",\n              userSelect: \"none\",\n            }}\n          >\n            {/* Left: drag icon + segmented control + settings */}\n            <Stack align=\"center\" gap=\"1_5\" style={{ minWidth: 0, flex: 1 }}>\n              <Stack\n                display=\"inline-flex\"\n                align=\"center\"\n                style={{\n                  cursor: isDragging ? \"grabbing\" : \"grab\",\n                  touchAction: \"none\",\n                  userSelect: \"none\",\n                }}\n                onPointerDown={(e: React.PointerEvent) => {\n                  // Already handled by parent, prevent double-fire\n                  e.stopPropagation();\n                  handlePointerDown(e);\n                }}\n              >\n                <Icon color=\"gray\" size=\"1\" icon={GripVertical} aria-hidden />\n              </Stack>\n              <Stack\n                align=\"center\"\n                gap=\"1_5\"\n                onPointerDown={(e: React.PointerEvent) => e.stopPropagation()}\n              >\n                <SegmentedControl.Root\n                  size=\"1\"\n                  type=\"single\"\n                  value={displayOption}\n                  onValueChange={(val: DisplayOption) => {\n                    if (!val) return;\n\n                    const debugSettings = client.store.state.debug;\n\n                    const focusedGuideKeys = Object.keys(\n                      debugSettings?.focusedGuideKeys || {},\n                    );\n\n                    // Exit out of focus if the currently focused guide is not\n                    // part of the selected list filter.\n                    if (result.status === \"ok\" && focusedGuideKeys.length > 0) {\n                      const currFocusedGuide = filterGuides(\n                        result.guides,\n                        val,\n                      ).find((g) => g.key === focusedGuideKeys[0]);\n\n                      if (!currFocusedGuide) {\n                        client.setDebug({\n                          ...debugSettings,\n                          focusedGuideKeys: {},\n                        });\n                      }\n                    }\n\n                    setDisplayOption(val);\n                  }}\n                >\n                  <SegmentedControl.Option\n                    value=\"all-guides\"\n                    style={{ width: \"54px\" }}\n                  >\n                    All\n                  </SegmentedControl.Option>\n                  <SegmentedControl.Option\n                    value=\"only-active\"\n                    style={{ width: \"54px\" }}\n                  >\n                    Active\n                  </SegmentedControl.Option>\n                  <SegmentedControl.Option\n                    value=\"only-eligible\"\n                    style={{ width: \"54px\" }}\n                  >\n                    Eligible\n                  </SegmentedControl.Option>\n                </SegmentedControl.Root>\n\n                <Tooltip label=\"Settings\" {...sharedTooltipProps}>\n                  <Button\n                    size=\"1\"\n                    variant={isContextPanelOpen ? \"outline\" : \"ghost\"}\n                    color={isContextPanelOpen ? \"blue\" : \"gray\"}\n                    leadingIcon={{\n                      icon: SlidersHorizontal,\n                      alt: \"Inspect target params\",\n                    }}\n                    trailingIcon={\n                      isContextPanelOpen\n                        ? { icon: ChevronDown, alt: \"Hide context data\" }\n                        : { icon: ChevronRight, alt: \"Show context data\" }\n                    }\n                    onClick={() => setIsContextPanelOpen((v) => !v)}\n                  />\n                </Tooltip>\n              </Stack>\n            </Stack>\n\n            {/* Right: exit + minimize buttons */}\n            <Stack\n              align=\"center\"\n              gap=\"1_5\"\n              style={{ flexShrink: 0 }}\n              onPointerDown={(e: React.PointerEvent) => e.stopPropagation()}\n            >\n              <Stack align=\"center\" gap=\"1_5\">\n                <Button\n                  size=\"1\"\n                  variant=\"outline\"\n                  leadingIcon={{ icon: LogOut, alt: \"Exit\" }}\n                  onClick={() => {\n                    setRunConfig((curr) => ({ ...curr, isVisible: false }));\n                    client.unsetDebug();\n                  }}\n                >\n                  Exit\n                </Button>\n                <Tooltip label=\"Minimize toolbar\" {...sharedTooltipProps}>\n                  <Button\n                    size=\"1\"\n                    variant=\"outline\"\n                    leadingIcon={{ icon: Minimize2, alt: \"Minimize\" }}\n                    onClick={() => setIsCollapsed(true)}\n                  />\n                </Tooltip>\n              </Stack>\n            </Stack>\n          </Stack>\n\n          {/* Collapsible panel to show context data */}\n          {isContextPanelOpen && (\n            <Box borderBottom=\"px\">\n              <GuideContextDetails />\n            </Box>\n          )}\n\n          {/* Guide list content area */}\n          <Box\n            tgphRef={guideListRef}\n            p=\"1\"\n            overflow=\"auto\"\n            style={{ maxHeight: \"calc(80vh - 96px)\" }}\n          >\n            {result.status === \"error\" ? (\n              <Box px=\"2\" pb=\"1\" style={{ lineHeight: \"1.2\" }}>\n                <Text\n                  as=\"span\"\n                  size=\"1\"\n                  weight=\"medium\"\n                  color={\n                    result.error === \"no_guides_fetched\" ? \"default\" : \"red\"\n                  }\n                >\n                  {result.message}\n                </Text>\n              </Box>\n            ) : guides.length === 0 ? (\n              <Box px=\"2\" pb=\"1\" style={{ lineHeight: \"1.2\" }}>\n                <Text as=\"span\" size=\"1\" weight=\"medium\" color=\"default\">\n                  {getEmptyStateMessage(displayOption)}\n                </Text>\n              </Box>\n            ) : (\n              guides.map((guide) => (\n                <GuideRow\n                  key={guide.key}\n                  guide={guide}\n                  orderIndex={guide.orderIndex}\n                  isExpanded={guide.key === expandedGuideRowKey}\n                  onClick={() => {\n                    setExpandedGuideRowKey((k) =>\n                      k && k === guide.key ? undefined : guide.key,\n                    );\n                  }}\n                />\n              ))\n            )}\n          </Box>\n\n          {/* Focus chin with dedicated controls */}\n          <FocusChin guides={guides} guideListRef={guideListRef} />\n        </Stack>\n      )}\n    </Box>\n  );\n};\n"],"names":["TOGGLE_COLLAPSED_HOTKEY","TOOLBAR_WIDTH","TOOLBAR_BOX_SHADOW","join","Kbd","children","React","display","padding","borderRadius","border","backgroundColor","getEmptyStateMessage","displayOption","filterGuides","guides","filter","guide","annotation","isEligible","active","status","V2","readyToTarget","client","useGuideContext","setDisplayOption","useState","runConfig","setRunConfig","KnockGuideClient","getToolbarRunConfigFromUrl","isCollapsed","setIsCollapsed","isContextPanelOpen","setIsContextPanelOpen","expandedGuideRowKey","setExpandedGuideRowKey","useEffect","undefined","isVisible","focusedGuideKeys","isDebugging","store","state","debug","debugging","setDebug","Object","keys","length","unsetDebug","handleKeyDown","e","ctrlKey","key","repeat","preventDefault","prev","addEventListener","removeEventListener","containerRef","useRef","guideListRef","position","isDragging","handlePointerDown","hasDraggedRef","useDraggable","elementRef","reclampDeps","initialPosition","top","right","result","useInspectGuideClientStore","Box","zIndex","TOOLBAR_Z_INDEX","Tooltip","Text","Stack","sharedTooltipProps","cursor","touchAction","userSelect","animation","transform","transformOrigin","KnockButton","current","width","boxShadow","boxSizing","minWidth","flex","stopPropagation","Icon","GripVertical","SegmentedControl","val","debugSettings","find","g","Button","icon","SlidersHorizontal","alt","ChevronDown","ChevronRight","v","flexShrink","LogOut","curr","Minimize2","GuideContextDetails","maxHeight","lineHeight","error","message","map","GuideRow","orderIndex","k","FocusChin"],"mappings":"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"}

package/dist/cjs/modules/guide/components/Toolbar/V2/helpers.js

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});require("@knocklabs/react-core");require("react");;/* empty css                                             */require("lodash.debounce");const t=require("../../../../core/utils.js"),u="knock_guide_toolbar",a="focused_guide_key",r="knock_guide_debug",l=()=>{const e={isVisible:!1},o=t.checkForWindow();if(!o||!o.location)return e;const c=new URLSearchParams(o.location.search),i=c.get(u),s=c.get(a);if(i!==null){const n={isVisible:i==="true"};return s&&(n.focusedGuideKeys={[s]:!0}),g(n),n}return d()||e},g=e=>{const o=t.checkForWindow();if(!(!o||!o.localStorage))try{o.localStorage.setItem(r,JSON.stringify(e))}catch{}},d=()=>{const e=t.checkForWindow();if(!(!e||!e.localStorage))try{const o=e.localStorage.getItem(r);if(o)return JSON.parse(o)}catch{}},f=()=>{const e=t.checkForWindow();if(!(!e||!e.localStorage))try{e.localStorage.removeItem(r)}catch{}},S={focusUnknownGuide:"No such guide exists",focusUncommittedGuide:"This guide has not been committed",focusUnselectableGuide:"No component that can display this guide is present"};exports.FOCUS_ERRORS=S;exports.clearRunConfigLS=f;exports.getRunConfig=l;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e={delayDuration:1e3},o={focusUnknownGuide:"No such guide exists",focusUncommittedGuide:"This guide has not been committed",focusUnselectableGuide:"No component that can display this guide is present"};exports.FOCUS_ERRORS=o;exports.sharedTooltipProps=e;
 //# sourceMappingURL=helpers.js.map

package/dist/cjs/modules/guide/components/Toolbar/V2/helpers.js.map

@@ -1 +1 @@
-{"version":3,"file":"helpers.js","sources":["../../../../../../../src/modules/guide/components/Toolbar/V2/helpers.ts"],"sourcesContent":["import { KnockGuide } from \"@knocklabs/client\";\n\nimport { checkForWindow } from \"../../../../../modules/core\";\n\nexport type DisplayOption =\n  | \"all-guides\"\n  | \"only-active\"\n  | \"only-eligible\"\n  | \"only-displayable\";\n\n// Use this param to start Toolbar and enter into a debugging session when\n// it is present and set to true.\nconst TOOLBAR_QUERY_PARAM = \"knock_guide_toolbar\";\n\n// Optional, when present pin/focus on this guide.\nconst GUIDE_KEY_PARAM = \"focused_guide_key\";\n\n// Use this key to read and write the run config data.\nconst LOCAL_STORAGE_KEY = \"knock_guide_debug\";\n\nexport type ToolbarV2RunConfig = {\n  isVisible: boolean;\n  focusedGuideKeys?: Record<KnockGuide[\"key\"], true>;\n};\n\nexport const getRunConfig = (): ToolbarV2RunConfig => {\n  const fallback = { isVisible: false };\n\n  const win = checkForWindow();\n  if (!win || !win.location) {\n    return fallback;\n  }\n\n  const urlSearchParams = new URLSearchParams(win.location.search);\n  const toolbarParamValue = urlSearchParams.get(TOOLBAR_QUERY_PARAM);\n  const guideKeyParamValue = urlSearchParams.get(GUIDE_KEY_PARAM);\n\n  // If toolbar param detected in the URL, write to local storage before\n  // returning.\n  if (toolbarParamValue !== null) {\n    const config: ToolbarV2RunConfig = {\n      isVisible: toolbarParamValue === \"true\",\n    };\n    if (guideKeyParamValue) {\n      config.focusedGuideKeys = { [guideKeyParamValue]: true };\n    }\n\n    writeRunConfigLS(config);\n    return config;\n  }\n\n  // If not detected, check local storage for a persisted run config. If not\n  // present then fall back to a default config.\n  return readRunConfigLS() || fallback;\n};\n\nconst writeRunConfigLS = (config: ToolbarV2RunConfig) => {\n  const win = checkForWindow();\n  if (!win || !win.localStorage) return;\n\n  try {\n    win.localStorage.setItem(LOCAL_STORAGE_KEY, JSON.stringify(config));\n  } catch {\n    // localStorage may be unavailable (e.g. private browsing)\n  }\n};\n\nconst readRunConfigLS = (): ToolbarV2RunConfig | undefined => {\n  const win = checkForWindow();\n  if (!win || !win.localStorage) return undefined;\n\n  try {\n    const stored = win.localStorage.getItem(LOCAL_STORAGE_KEY);\n    if (stored) {\n      return JSON.parse(stored);\n    }\n  } catch {\n    // localStorage may be unavailable (e.g. private browsing)\n  }\n  return undefined;\n};\n\nexport const clearRunConfigLS = () => {\n  const win = checkForWindow();\n  if (!win || !win.localStorage) return;\n\n  try {\n    win.localStorage.removeItem(LOCAL_STORAGE_KEY);\n  } catch {\n    // localStorage may be unavailable (e.g. private browsing)\n  }\n};\n\nexport const FOCUS_ERRORS = {\n  focusUnknownGuide: \"No such guide exists\",\n  focusUncommittedGuide: \"This guide has not been committed\",\n  focusUnselectableGuide: \"No component that can display this guide is present\",\n};\n"],"names":["TOOLBAR_QUERY_PARAM","GUIDE_KEY_PARAM","LOCAL_STORAGE_KEY","getRunConfig","fallback","isVisible","win","checkForWindow","location","urlSearchParams","URLSearchParams","search","toolbarParamValue","get","guideKeyParamValue","config","focusedGuideKeys","writeRunConfigLS","readRunConfigLS","localStorage","setItem","JSON","stringify","stored","getItem","parse","clearRunConfigLS","removeItem","FOCUS_ERRORS","focusUnknownGuide","focusUncommittedGuide","focusUnselectableGuide"],"mappings":"sQAYMA,EAAsB,sBAGtBC,EAAkB,oBAGlBC,EAAoB,oBAObC,EAAeA,IAA0B,CACpD,MAAMC,EAAW,CAAEC,UAAW,EAAM,EAE9BC,EAAMC,EAAAA,eAAe,EAC3B,GAAI,CAACD,GAAO,CAACA,EAAIE,SACRJ,OAAAA,EAGT,MAAMK,EAAkB,IAAIC,gBAAgBJ,EAAIE,SAASG,MAAM,EACzDC,EAAoBH,EAAgBI,IAAIb,CAAmB,EAC3Dc,EAAqBL,EAAgBI,IAAIZ,CAAe,EAI9D,GAAIW,IAAsB,KAAM,CAC9B,MAAMG,EAA6B,CACjCV,UAAWO,IAAsB,MACnC,EACA,OAAIE,IACFC,EAAOC,iBAAmB,CAAE,CAACF,CAAkB,EAAG,EAAK,GAGzDG,EAAiBF,CAAM,EAChBA,CAAAA,CAKT,OAAOG,EAAqBd,GAAAA,CAC9B,EAEMa,EAAoBF,GAA+B,CACvD,MAAMT,EAAMC,EAAAA,eAAe,EAC3B,GAAI,GAACD,GAAO,CAACA,EAAIa,cAEb,GAAA,CACFb,EAAIa,aAAaC,QAAQlB,EAAmBmB,KAAKC,UAAUP,CAAM,CAAC,CAAA,MAC5D,CAAA,CAGV,EAEMG,EAAkBA,IAAsC,CAC5D,MAAMZ,EAAMC,EAAAA,eAAe,EAC3B,GAAI,GAACD,GAAO,CAACA,EAAIa,cAEb,GAAA,CACF,MAAMI,EAASjB,EAAIa,aAAaK,QAAQtB,CAAiB,EACzD,GAAIqB,EACKF,OAAAA,KAAKI,MAAMF,CAAM,CAC1B,MACM,CAAA,CAIV,EAEaG,EAAmBA,IAAM,CACpC,MAAMpB,EAAMC,EAAAA,eAAe,EAC3B,GAAI,GAACD,GAAO,CAACA,EAAIa,cAEb,GAAA,CACEA,EAAAA,aAAaQ,WAAWzB,CAAiB,CAAA,MACvC,CAAA,CAGV,EAEa0B,EAAe,CAC1BC,kBAAmB,uBACnBC,sBAAuB,oCACvBC,uBAAwB,qDAC1B"}
+{"version":3,"file":"helpers.js","sources":["../../../../../../../src/modules/guide/components/Toolbar/V2/helpers.ts"],"sourcesContent":["export const sharedTooltipProps = {\n  delayDuration: 1000,\n};\n\nexport type DisplayOption = \"all-guides\" | \"only-active\" | \"only-eligible\";\n\nexport const FOCUS_ERRORS = {\n  focusUnknownGuide: \"No such guide exists\",\n  focusUncommittedGuide: \"This guide has not been committed\",\n  focusUnselectableGuide: \"No component that can display this guide is present\",\n};\n"],"names":["sharedTooltipProps","delayDuration","FOCUS_ERRORS","focusUnknownGuide","focusUncommittedGuide","focusUnselectableGuide"],"mappings":"gFAAO,MAAMA,EAAqB,CAChCC,cAAe,GACjB,EAIaC,EAAe,CAC1BC,kBAAmB,uBACnBC,sBAAuB,oCACvBC,uBAAwB,qDAC1B"}

package/dist/cjs/modules/guide/components/Toolbar/V2/useInspectGuideClientStore.js.map

@@ -1 +1 @@
-{"version":3,"file":"useInspectGuideClientStore.js","sources":["../../../../../../../src/modules/guide/components/Toolbar/V2/useInspectGuideClientStore.ts"],"sourcesContent":["import {\n  KnockGuide,\n  KnockGuideClientGroupStage,\n  KnockGuideClientStoreState,\n  KnockGuideIneligibilityMarker,\n  KnockGuideSelectionResult,\n  checkActivatable,\n  checkStateIfThrottled,\n} from \"@knocklabs/client\";\nimport { useGuideContext, useStore } from \"@knocklabs/react-core\";\n\nimport { FOCUS_ERRORS, ToolbarV2RunConfig } from \"./helpers\";\n\nconst byKey = <T extends { key: string }>(items: T[]) => {\n  return items.reduce((acc, item) => ({ ...acc, [item.key]: item }), {});\n};\n\n/**\n * This is the main module that will house core logic for the toolbar. It hooks\n * into the guide client state store, extracts relevant data for debugging, and\n * transforms it into easily consumable data for the toolbar - namely\n * \"annotating\" guides for its various statuses to display.\n */\n\n// Active: `true` status = good\ntype ActiveStatus = {\n  status: boolean;\n};\n\n// Targetable: `true` status = good\ntype TargetableStatusTrue = {\n  status: true;\n};\ntype TargetableStatusFalse = {\n  status: false;\n  reason: string;\n  message: string;\n};\ntype TargetableStatus = TargetableStatusTrue | TargetableStatusFalse;\n\ntype ActivatableStatus = {\n  status: boolean;\n};\n\n// Archived: `false` status = good\ntype ArchivedStatus = {\n  status: boolean;\n};\n\n// Selectable:\n//  - \"returned\": Queried and resolved to return the guide from useGuide(s).\n//  - \"throttled\": Queried and resolved but being throttled, so not yet returned.\n//  - \"queried\": Queried but not resolved, because there are other higher\n//    priority guides that are ahead of this guide in the query result.\n//  - undefined: Not reachable with any of the given queries and filters.\ntype SelectionResultByLimit = {\n  one?: KnockGuideSelectionResult;\n  all?: KnockGuideSelectionResult;\n};\ntype SelectionResultByQuery = {\n  key?: SelectionResultByLimit;\n  type?: SelectionResultByLimit;\n};\ntype SelectableStatusPresent = {\n  status: \"returned\" | \"throttled\" | \"queried\";\n  query: SelectionResultByQuery;\n};\ntype SelectableStatusAbsent = {\n  status: undefined;\n};\ntype SelectableStatus = SelectableStatusPresent | SelectableStatusAbsent;\n\nexport type AnnotatedStatuses = {\n  // Individual eligibility statuses:\n  active: ActiveStatus;\n  targetable: TargetableStatus;\n  archived: ArchivedStatus;\n  // Individual qualified statuses:\n  activatable: ActivatableStatus;\n  selectable: SelectableStatus;\n};\n\ntype GuideAnnotation = AnnotatedStatuses & {\n  // Resolved eligibility based on active, targetable and archived statuses,\n  // which are backend driven evaluation results that are exposed for debugging.\n  isEligible: boolean;\n\n  // Resolved display qualification based on an activatable status, which\n  // informs \"when\" and \"where\" an eligible guide can be displayed to user.\n  isQualified: boolean;\n};\n\nexport type AnnotatedGuide = KnockGuide & {\n  orderIndex: number;\n  annotation: GuideAnnotation;\n\n  // Legacy fields, typed only to make tsc happy when we prune these out.\n  activation_location_rules?: KnockGuide[\"activation_url_patterns\"];\n  priority?: number;\n};\n\n// Exists and ordered in control but absent in switchboard (therefore not\n// included in the api response), which implies a newly created guide that has\n// never been published to switchboard.\nexport type UncommittedGuide = {\n  __typename: \"UncommittedGuide\";\n  orderIndex: number;\n  key: KnockGuide[\"key\"];\n  active: false;\n  bypass_global_group_limit: false;\n  annotation: {\n    isEligible: false;\n    isQualified: false;\n    active: {\n      status: false;\n    };\n    selectable: {\n      status: undefined;\n    };\n  };\n};\n\nexport type InspectionResultOk = {\n  status: \"ok\";\n  guides: (AnnotatedGuide | UncommittedGuide)[];\n};\ntype InspectionResultError = {\n  status: \"error\";\n  error:\n    | \"no_guides_fetched\"\n    | \"no_guide_group\"\n    | \"focus_unknown_guide\"\n    | \"focus_uncommitted_guide\"\n    | \"focus_unselectable_guide\";\n  message: string;\n};\ntype InspectionResult = InspectionResultOk | InspectionResultError;\n\ntype StoreStateSnapshot = Pick<\n  KnockGuideClientStoreState,\n  | \"location\"\n  | \"guides\"\n  | \"guideGroups\"\n  | \"ineligibleGuides\"\n  | \"debug\"\n  | \"counter\"\n  | \"queries\"\n> & {\n  throttled: boolean;\n};\n\nconst inferSelectByKeyReturnStatus = (\n  guide: KnockGuide,\n  snapshot: StoreStateSnapshot,\n  stage: KnockGuideClientGroupStage,\n  query: SelectionResultByQuery,\n): SelectableStatusPresent[\"status\"] => {\n  const includeThrottled =\n    !!query.key?.one?.metadata?.opts?.includeThrottled ||\n    !!query.key?.all?.metadata?.opts?.includeThrottled;\n\n  // If unthrottled, then it should always be returned.\n  if (guide.bypass_global_group_limit) {\n    return \"returned\";\n  }\n\n  // If resolved, expect this guide to be returned unless being throttled.\n  if (guide.key === stage.resolved) {\n    if (snapshot.throttled && !includeThrottled) {\n      return \"throttled\";\n    }\n    return \"returned\";\n  }\n\n  // If queried but not resolved, it means this guide is being shadowed by\n  // another guide with higher priority because throttled guides can be\n  // displayed only one at a time.\n  return \"queried\";\n};\n\nconst inferSelectOneByTypeReturnStatus = (\n  guide: KnockGuide,\n  snapshot: StoreStateSnapshot,\n  stage: KnockGuideClientGroupStage,\n  query: SelectionResultByQuery,\n): SelectableStatusPresent[\"status\"] => {\n  const includeThrottled = !!query.type?.one?.metadata?.opts?.includeThrottled;\n\n  const result = query.type!.one!;\n  if (result.size === 0) {\n    return \"queried\";\n  }\n\n  // There may be multiple unthrottled guides of the same type, being queried\n  // by type to return a single guide, for example: useGuide({ type: \"card\" }).\n  //\n  // So it is possible for an unthrottled guide to be shadowed by another\n  // unthrottled guide of the same type with higher priority, so we need to\n  // look at the query result to determine its return status.\n  if (guide.bypass_global_group_limit) {\n    const guides = [...result.values()];\n    const first = guides[0]!;\n\n    if (guide.key !== first.key) {\n      // Being shadowed by another guide with higher priority.\n      return \"queried\";\n    }\n    return \"returned\";\n  }\n\n  // If resolved, expect this guide to be returned unless being throttled.\n  if (guide.key === stage.resolved) {\n    if (snapshot.throttled && !includeThrottled) {\n      return \"throttled\";\n    }\n    return \"returned\";\n  }\n\n  // If queried but not resolved, it means this guide is being shadowed by\n  // another guide with higher priority because throttled guides can be\n  // displayed only one at a time.\n  return \"queried\";\n};\n\nconst inferSelectAllByTypeReturnStatus = (\n  guide: KnockGuide,\n  snapshot: StoreStateSnapshot,\n  stage: KnockGuideClientGroupStage,\n  query: SelectionResultByQuery,\n): SelectableStatusPresent[\"status\"] => {\n  const result = query.type!.all!;\n  if (result.size === 0) {\n    return \"queried\";\n  }\n\n  const guides = [...result.values()];\n  const first = guides[0]!;\n\n  // Might want to consider moving this up to do once.\n  const guidesByKey: Record<KnockGuide[\"key\"], KnockGuide> = byKey(guides);\n\n  // If includeThrottled given, then expect all selected guides to be returned.\n  const includeThrottled = !!query.type?.all?.metadata?.opts?.includeThrottled;\n  if (includeThrottled) {\n    return guidesByKey[guide.key] ? \"returned\" : \"queried\";\n  }\n\n  // If the first selected guide is unthrottled or resolved, then we should\n  // have at minimum one guide to return, and potentially more based on whether\n  // we are throttling currently and which other guides are unthrottled.\n  if (first.bypass_global_group_limit || first.key === stage.resolved) {\n    if (!guidesByKey[guide.key]) {\n      return \"queried\";\n    }\n    if (snapshot.throttled) {\n      return guide.bypass_global_group_limit ? \"returned\" : \"throttled\";\n    }\n    return \"returned\";\n  }\n\n  return \"queried\";\n};\n\nconst inferSelectReturnStatus = (\n  guide: KnockGuide,\n  snapshot: StoreStateSnapshot,\n  stage: KnockGuideClientGroupStage,\n  query: SelectionResultByQuery,\n) => {\n  // Querying by key can only return up to a max of one guide, regardless of\n  // useGuide or useGuides, and should take precedence in status designation.\n  if (query.key) {\n    return inferSelectByKeyReturnStatus(guide, snapshot, stage, query);\n  }\n\n  if (query.type?.all) {\n    return inferSelectAllByTypeReturnStatus(guide, snapshot, stage, query);\n  }\n  if (query.type?.one) {\n    return inferSelectOneByTypeReturnStatus(guide, snapshot, stage, query);\n  }\n\n  // Should not happen but just for completeness.\n  return undefined;\n};\n\nconst toSelectableStatus = (\n  guide: KnockGuide,\n  snapshot: StoreStateSnapshot,\n  stage: KnockGuideClientGroupStage | undefined,\n): SelectableStatus => {\n  if (!stage || stage.status === \"open\") {\n    return { status: undefined };\n  }\n\n  const query = {\n    key: (stage.results.key || {})[guide.key],\n    type: (stage.results.type || {})[guide.type],\n  };\n\n  const queried = Boolean(query.key || query.type);\n  if (!queried) {\n    // No present query in the current location can select this guide.\n    return { status: undefined };\n  }\n\n  const status = inferSelectReturnStatus(guide, snapshot, stage, query);\n  if (!status) {\n    return { status: undefined };\n  }\n\n  return { status, query };\n};\n\nconst toIneligibilityStatus = (\n  guide: KnockGuide,\n  marker?: KnockGuideIneligibilityMarker,\n): Partial<AnnotatedStatuses> => {\n  const statuses: Partial<AnnotatedStatuses> = {};\n\n  if (\n    marker?.reason === \"not_in_target_audience\" ||\n    marker?.reason === \"target_conditions_not_met\"\n  ) {\n    statuses.targetable = {\n      status: false,\n      reason: marker.reason,\n      message: marker.message,\n    };\n  }\n\n  if (\n    marker?.reason === \"marked_as_archived\" ||\n    (guide.steps || []).every((s) => !!s.message.archived_at)\n  ) {\n    statuses.archived = {\n      status: true,\n    };\n  }\n\n  if (marker?.reason === \"guide_not_active\") {\n    statuses.active = {\n      status: false,\n    };\n  }\n\n  return statuses;\n};\n\nconst resolveIsEligible = ({\n  active,\n  targetable,\n  archived,\n}: AnnotatedStatuses) => {\n  if (!active.status) return false;\n  if (!targetable.status) return false;\n  if (archived.status) return false;\n  return true;\n};\n\nexport const resolveIsQualified = ({\n  activatable,\n  selectable,\n}: AnnotatedStatuses) => {\n  if (!activatable.status) return false;\n  if (!selectable.status) return false;\n  return true;\n};\n\nconst annotateGuide = (\n  guide: KnockGuide,\n  orderIndex: number,\n  snapshot: StoreStateSnapshot,\n  stage: KnockGuideClientGroupStage | undefined,\n): AnnotatedGuide => {\n  const { ineligibleGuides, location } = snapshot;\n  const marker = ineligibleGuides[guide.key];\n  const ineligiblity = toIneligibilityStatus(guide, marker);\n\n  const statuses: AnnotatedStatuses = {\n    // isEligible:\n    active: ineligiblity?.active || { status: true },\n    targetable: ineligiblity?.targetable || { status: true },\n    archived: ineligiblity?.archived || { status: false },\n    // isQualified:\n    activatable: { status: checkActivatable(guide, location) },\n    selectable: toSelectableStatus(guide, snapshot, stage),\n  };\n\n  const annotation: GuideAnnotation = {\n    ...statuses,\n    isEligible: resolveIsEligible(statuses),\n    isQualified: resolveIsQualified(statuses),\n  };\n\n  return {\n    ...guide,\n    orderIndex,\n    annotation,\n  };\n};\n\nconst newUncommittedGuide = (key: KnockGuide[\"key\"], orderIndex: number) =>\n  ({\n    __typename: \"UncommittedGuide\",\n    key,\n    orderIndex,\n    active: false,\n    bypass_global_group_limit: false,\n    annotation: {\n      isEligible: false,\n      isQualified: false,\n      active: {\n        status: false,\n      },\n      selectable: {\n        status: undefined,\n      },\n    },\n  }) as UncommittedGuide;\n\nexport const useInspectGuideClientStore = (\n  runConfig: ToolbarV2RunConfig,\n): InspectionResult | undefined => {\n  const { client } = useGuideContext();\n\n  // Extract a snapshot of the client store state for debugging.\n  const snapshot: StoreStateSnapshot = useStore(client.store, (state) => {\n    const throttled = checkStateIfThrottled(state);\n\n    return {\n      location: state.location,\n      guides: state.guides,\n      guideGroups: state.guideGroups,\n      ineligibleGuides: state.ineligibleGuides,\n      debug: state.debug,\n      counter: state.counter,\n      queries: state.queries,\n      throttled,\n    };\n  });\n\n  // Not in debugging session, so noop.\n  if (!snapshot.debug?.debugging) {\n    return undefined;\n  }\n\n  // No recorded fetch requests, which implies an inflight request loading.\n  const req = Object.entries(snapshot.queries)[0];\n  if (!req || req[1].status === \"loading\") {\n    return {\n      status: \"error\",\n      error: \"no_guides_fetched\",\n      message: \"Loading...\",\n    };\n  }\n\n  // Should always be a default group so this should never happen.\n  const defaultGroup = snapshot.guideGroups[0];\n  if (!defaultGroup) {\n    return {\n      status: \"error\",\n      error: \"no_guide_group\",\n      message: \"No guide group found\",\n    };\n  }\n\n  const groupStage = client.getStage();\n\n  // Annotate guides for various eligibility, activation and query statuses\n  // that are useful for debugging purposes.\n  const orderedGuides = defaultGroup.display_sequence.map((guideKey, index) => {\n    const guide = snapshot.guides[guideKey];\n    if (!guide) {\n      return newUncommittedGuide(guideKey, index);\n    }\n\n    return annotateGuide(guide, index, snapshot, groupStage);\n  });\n\n  // Check if the focused guide actually exists and is selectable on the page.\n  const focusedGuideKey = Object.keys(runConfig.focusedGuideKeys || {})[0];\n  if (groupStage?.status === \"closed\" && focusedGuideKey) {\n    const foundGuide = orderedGuides.find((g) => g.key === focusedGuideKey);\n\n    // No such guide exists for the given focused guide key.\n    if (!foundGuide) {\n      return {\n        status: \"error\",\n        error: \"focus_unknown_guide\",\n        message: `Unable to display \\`${focusedGuideKey}\\`, ${FOCUS_ERRORS.focusUnknownGuide.toLowerCase()}.`,\n      };\n    }\n\n    // This guide exists but has never been committed and published, so it is\n    // not present in the API response.\n    if (isUncommittedGuide(foundGuide)) {\n      return {\n        status: \"error\",\n        error: \"focus_uncommitted_guide\",\n        message: `Unable to display \\`${focusedGuideKey}\\`, ${FOCUS_ERRORS.focusUncommittedGuide.toLowerCase()}.`,\n      };\n    }\n\n    // This guide exists and is present in the response, but it is not queried\n    // in the current page so it is impossible to force render this guide.\n    if (!foundGuide.annotation.selectable.status) {\n      return {\n        status: \"error\",\n        error: \"focus_unselectable_guide\",\n        message: `Unable to display \\`${focusedGuideKey}\\`, ${FOCUS_ERRORS.focusUnselectableGuide.toLowerCase()}.`,\n      };\n    }\n  }\n\n  return {\n    status: \"ok\",\n    guides: orderedGuides,\n  };\n};\n\nexport const isUncommittedGuide = (input: unknown): input is UncommittedGuide =>\n  typeof input === \"object\" &&\n  input !== null &&\n  \"__typename\" in input &&\n  (input as UncommittedGuide).__typename === \"UncommittedGuide\";\n"],"names":["byKey","items","reduce","acc","item","key","inferSelectByKeyReturnStatus","guide","snapshot","stage","query","includeThrottled","one","metadata","opts","all","bypass_global_group_limit","resolved","throttled","inferSelectOneByTypeReturnStatus","type","result","size","first","values","inferSelectAllByTypeReturnStatus","guides","guidesByKey","inferSelectReturnStatus","toSelectableStatus","status","undefined","results","Boolean","toIneligibilityStatus","marker","statuses","reason","targetable","message","steps","every","s","archived_at","archived","active","resolveIsEligible","resolveIsQualified","activatable","selectable","annotateGuide","orderIndex","ineligibleGuides","location","ineligiblity","checkActivatable","annotation","isEligible","isQualified","newUncommittedGuide","__typename","useInspectGuideClientStore","runConfig","client","useGuideContext","useStore","store","state","checkStateIfThrottled","guideGroups","debug","counter","queries","debugging","req","Object","entries","error","defaultGroup","groupStage","getStage","orderedGuides","display_sequence","map","guideKey","index","focusedGuideKey","keys","focusedGuideKeys","foundGuide","find","g","FOCUS_ERRORS","focusUnknownGuide","toLowerCase","isUncommittedGuide","focusUncommittedGuide","focusUnselectableGuide","input"],"mappings":"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"}
+{"version":3,"file":"useInspectGuideClientStore.js","sources":["../../../../../../../src/modules/guide/components/Toolbar/V2/useInspectGuideClientStore.ts"],"sourcesContent":["import {\n  KnockGuide,\n  KnockGuideClientGroupStage,\n  KnockGuideClientStoreState,\n  KnockGuideIneligibilityMarker,\n  KnockGuideSelectionResult,\n  type ToolbarV2RunConfig,\n  checkActivatable,\n  checkStateIfThrottled,\n} from \"@knocklabs/client\";\nimport { useGuideContext, useStore } from \"@knocklabs/react-core\";\n\nimport { FOCUS_ERRORS } from \"./helpers\";\n\nconst byKey = <T extends { key: string }>(items: T[]) => {\n  return items.reduce((acc, item) => ({ ...acc, [item.key]: item }), {});\n};\n\n/**\n * This is the main module that will house core logic for the toolbar. It hooks\n * into the guide client state store, extracts relevant data for debugging, and\n * transforms it into easily consumable data for the toolbar - namely\n * \"annotating\" guides for its various statuses to display.\n */\n\n// Active: `true` status = good\ntype ActiveStatus = {\n  status: boolean;\n};\n\n// Targetable: `true` status = good\ntype TargetableStatusTrue = {\n  status: true;\n};\ntype TargetableStatusFalse = {\n  status: false;\n  reason: string;\n  message: string;\n};\ntype TargetableStatus = TargetableStatusTrue | TargetableStatusFalse;\n\ntype ActivatableStatus = {\n  status: boolean;\n};\n\n// Archived: `false` status = good\ntype ArchivedStatus = {\n  status: boolean;\n};\n\n// Selectable:\n//  - \"returned\": Queried and resolved to return the guide from useGuide(s).\n//  - \"throttled\": Queried and resolved but being throttled, so not yet returned.\n//  - \"queried\": Queried but not resolved, because there are other higher\n//    priority guides that are ahead of this guide in the query result.\n//  - undefined: Not reachable with any of the given queries and filters.\ntype SelectionResultByLimit = {\n  one?: KnockGuideSelectionResult;\n  all?: KnockGuideSelectionResult;\n};\ntype SelectionResultByQuery = {\n  key?: SelectionResultByLimit;\n  type?: SelectionResultByLimit;\n};\ntype SelectableStatusPresent = {\n  status: \"returned\" | \"throttled\" | \"queried\";\n  query: SelectionResultByQuery;\n};\ntype SelectableStatusAbsent = {\n  status: undefined;\n};\ntype SelectableStatus = SelectableStatusPresent | SelectableStatusAbsent;\n\nexport type AnnotatedStatuses = {\n  // Individual eligibility statuses:\n  active: ActiveStatus;\n  targetable: TargetableStatus;\n  archived: ArchivedStatus;\n  // Individual qualified statuses:\n  activatable: ActivatableStatus;\n  selectable: SelectableStatus;\n};\n\ntype GuideAnnotation = AnnotatedStatuses & {\n  // Resolved eligibility based on active, targetable and archived statuses,\n  // which are backend driven evaluation results that are exposed for debugging.\n  isEligible: boolean;\n\n  // Resolved display qualification based on an activatable status, which\n  // informs \"when\" and \"where\" an eligible guide can be displayed to user.\n  isQualified: boolean;\n};\n\nexport type AnnotatedGuide = KnockGuide & {\n  orderIndex: number;\n  annotation: GuideAnnotation;\n\n  // Legacy fields, typed only to make tsc happy when we prune these out.\n  activation_location_rules?: KnockGuide[\"activation_url_patterns\"];\n  priority?: number;\n};\n\n// Exists and ordered in control but absent in switchboard (therefore not\n// included in the api response), which implies a newly created guide that has\n// never been published to switchboard.\nexport type UncommittedGuide = {\n  __typename: \"UncommittedGuide\";\n  orderIndex: number;\n  key: KnockGuide[\"key\"];\n  active: false;\n  bypass_global_group_limit: false;\n  annotation: {\n    isEligible: false;\n    isQualified: false;\n    active: {\n      status: false;\n    };\n    selectable: {\n      status: undefined;\n    };\n  };\n};\n\nexport type InspectionResultOk = {\n  status: \"ok\";\n  guides: (AnnotatedGuide | UncommittedGuide)[];\n};\ntype InspectionResultError = {\n  status: \"error\";\n  error:\n    | \"no_guides_fetched\"\n    | \"no_guide_group\"\n    | \"focus_unknown_guide\"\n    | \"focus_uncommitted_guide\"\n    | \"focus_unselectable_guide\";\n  message: string;\n};\ntype InspectionResult = InspectionResultOk | InspectionResultError;\n\ntype StoreStateSnapshot = Pick<\n  KnockGuideClientStoreState,\n  | \"location\"\n  | \"guides\"\n  | \"guideGroups\"\n  | \"ineligibleGuides\"\n  | \"debug\"\n  | \"counter\"\n  | \"queries\"\n> & {\n  throttled: boolean;\n};\n\nconst inferSelectByKeyReturnStatus = (\n  guide: KnockGuide,\n  snapshot: StoreStateSnapshot,\n  stage: KnockGuideClientGroupStage,\n  query: SelectionResultByQuery,\n): SelectableStatusPresent[\"status\"] => {\n  const includeThrottled =\n    !!query.key?.one?.metadata?.opts?.includeThrottled ||\n    !!query.key?.all?.metadata?.opts?.includeThrottled;\n\n  // If unthrottled, then it should always be returned.\n  if (guide.bypass_global_group_limit) {\n    return \"returned\";\n  }\n\n  // If resolved, expect this guide to be returned unless being throttled.\n  if (guide.key === stage.resolved) {\n    if (snapshot.throttled && !includeThrottled) {\n      return \"throttled\";\n    }\n    return \"returned\";\n  }\n\n  // If queried but not resolved, it means this guide is being shadowed by\n  // another guide with higher priority because throttled guides can be\n  // displayed only one at a time.\n  return \"queried\";\n};\n\nconst inferSelectOneByTypeReturnStatus = (\n  guide: KnockGuide,\n  snapshot: StoreStateSnapshot,\n  stage: KnockGuideClientGroupStage,\n  query: SelectionResultByQuery,\n): SelectableStatusPresent[\"status\"] => {\n  const includeThrottled = !!query.type?.one?.metadata?.opts?.includeThrottled;\n\n  const result = query.type!.one!;\n  if (result.size === 0) {\n    return \"queried\";\n  }\n\n  // There may be multiple unthrottled guides of the same type, being queried\n  // by type to return a single guide, for example: useGuide({ type: \"card\" }).\n  //\n  // So it is possible for an unthrottled guide to be shadowed by another\n  // unthrottled guide of the same type with higher priority, so we need to\n  // look at the query result to determine its return status.\n  if (guide.bypass_global_group_limit) {\n    const guides = [...result.values()];\n    const first = guides[0]!;\n\n    if (guide.key !== first.key) {\n      // Being shadowed by another guide with higher priority.\n      return \"queried\";\n    }\n    return \"returned\";\n  }\n\n  // If resolved, expect this guide to be returned unless being throttled.\n  if (guide.key === stage.resolved) {\n    if (snapshot.throttled && !includeThrottled) {\n      return \"throttled\";\n    }\n    return \"returned\";\n  }\n\n  // If queried but not resolved, it means this guide is being shadowed by\n  // another guide with higher priority because throttled guides can be\n  // displayed only one at a time.\n  return \"queried\";\n};\n\nconst inferSelectAllByTypeReturnStatus = (\n  guide: KnockGuide,\n  snapshot: StoreStateSnapshot,\n  stage: KnockGuideClientGroupStage,\n  query: SelectionResultByQuery,\n): SelectableStatusPresent[\"status\"] => {\n  const result = query.type!.all!;\n  if (result.size === 0) {\n    return \"queried\";\n  }\n\n  const guides = [...result.values()];\n  const first = guides[0]!;\n\n  // Might want to consider moving this up to do once.\n  const guidesByKey: Record<KnockGuide[\"key\"], KnockGuide> = byKey(guides);\n\n  // If includeThrottled given, then expect all selected guides to be returned.\n  const includeThrottled = !!query.type?.all?.metadata?.opts?.includeThrottled;\n  if (includeThrottled) {\n    return guidesByKey[guide.key] ? \"returned\" : \"queried\";\n  }\n\n  // If the first selected guide is unthrottled or resolved, then we should\n  // have at minimum one guide to return, and potentially more based on whether\n  // we are throttling currently and which other guides are unthrottled.\n  if (first.bypass_global_group_limit || first.key === stage.resolved) {\n    if (!guidesByKey[guide.key]) {\n      return \"queried\";\n    }\n    if (snapshot.throttled) {\n      return guide.bypass_global_group_limit ? \"returned\" : \"throttled\";\n    }\n    return \"returned\";\n  }\n\n  return \"queried\";\n};\n\nconst inferSelectReturnStatus = (\n  guide: KnockGuide,\n  snapshot: StoreStateSnapshot,\n  stage: KnockGuideClientGroupStage,\n  query: SelectionResultByQuery,\n) => {\n  // Querying by key can only return up to a max of one guide, regardless of\n  // useGuide or useGuides, and should take precedence in status designation.\n  if (query.key) {\n    return inferSelectByKeyReturnStatus(guide, snapshot, stage, query);\n  }\n\n  if (query.type?.all) {\n    return inferSelectAllByTypeReturnStatus(guide, snapshot, stage, query);\n  }\n  if (query.type?.one) {\n    return inferSelectOneByTypeReturnStatus(guide, snapshot, stage, query);\n  }\n\n  // Should not happen but just for completeness.\n  return undefined;\n};\n\nconst toSelectableStatus = (\n  guide: KnockGuide,\n  snapshot: StoreStateSnapshot,\n  stage: KnockGuideClientGroupStage | undefined,\n): SelectableStatus => {\n  if (!stage || stage.status === \"open\") {\n    return { status: undefined };\n  }\n\n  const query = {\n    key: (stage.results.key || {})[guide.key],\n    type: (stage.results.type || {})[guide.type],\n  };\n\n  const queried = Boolean(query.key || query.type);\n  if (!queried) {\n    // No present query in the current location can select this guide.\n    return { status: undefined };\n  }\n\n  const status = inferSelectReturnStatus(guide, snapshot, stage, query);\n  if (!status) {\n    return { status: undefined };\n  }\n\n  return { status, query };\n};\n\nconst toIneligibilityStatus = (\n  guide: KnockGuide,\n  marker?: KnockGuideIneligibilityMarker,\n): Partial<AnnotatedStatuses> => {\n  const statuses: Partial<AnnotatedStatuses> = {};\n\n  if (\n    marker?.reason === \"not_in_target_audience\" ||\n    marker?.reason === \"target_conditions_not_met\"\n  ) {\n    statuses.targetable = {\n      status: false,\n      reason: marker.reason,\n      message: marker.message,\n    };\n  }\n\n  if (\n    marker?.reason === \"marked_as_archived\" ||\n    (guide.steps || []).every((s) => !!s.message.archived_at)\n  ) {\n    statuses.archived = {\n      status: true,\n    };\n  }\n\n  if (marker?.reason === \"guide_not_active\") {\n    statuses.active = {\n      status: false,\n    };\n  }\n\n  return statuses;\n};\n\nconst resolveIsEligible = ({\n  active,\n  targetable,\n  archived,\n}: AnnotatedStatuses) => {\n  if (!active.status) return false;\n  if (!targetable.status) return false;\n  if (archived.status) return false;\n  return true;\n};\n\nexport const resolveIsQualified = ({\n  activatable,\n  selectable,\n}: AnnotatedStatuses) => {\n  if (!activatable.status) return false;\n  if (!selectable.status) return false;\n  return true;\n};\n\nconst annotateGuide = (\n  guide: KnockGuide,\n  orderIndex: number,\n  snapshot: StoreStateSnapshot,\n  stage: KnockGuideClientGroupStage | undefined,\n): AnnotatedGuide => {\n  const { ineligibleGuides, location } = snapshot;\n  const marker = ineligibleGuides[guide.key];\n  const ineligiblity = toIneligibilityStatus(guide, marker);\n\n  const statuses: AnnotatedStatuses = {\n    // isEligible:\n    active: ineligiblity?.active || { status: true },\n    targetable: ineligiblity?.targetable || { status: true },\n    archived: ineligiblity?.archived || { status: false },\n    // isQualified:\n    activatable: { status: checkActivatable(guide, location) },\n    selectable: toSelectableStatus(guide, snapshot, stage),\n  };\n\n  const annotation: GuideAnnotation = {\n    ...statuses,\n    isEligible: resolveIsEligible(statuses),\n    isQualified: resolveIsQualified(statuses),\n  };\n\n  return {\n    ...guide,\n    orderIndex,\n    annotation,\n  };\n};\n\nconst newUncommittedGuide = (key: KnockGuide[\"key\"], orderIndex: number) =>\n  ({\n    __typename: \"UncommittedGuide\",\n    key,\n    orderIndex,\n    active: false,\n    bypass_global_group_limit: false,\n    annotation: {\n      isEligible: false,\n      isQualified: false,\n      active: {\n        status: false,\n      },\n      selectable: {\n        status: undefined,\n      },\n    },\n  }) as UncommittedGuide;\n\nexport const useInspectGuideClientStore = (\n  runConfig: ToolbarV2RunConfig,\n): InspectionResult | undefined => {\n  const { client } = useGuideContext();\n\n  // Extract a snapshot of the client store state for debugging.\n  const snapshot: StoreStateSnapshot = useStore(client.store, (state) => {\n    const throttled = checkStateIfThrottled(state);\n\n    return {\n      location: state.location,\n      guides: state.guides,\n      guideGroups: state.guideGroups,\n      ineligibleGuides: state.ineligibleGuides,\n      debug: state.debug,\n      counter: state.counter,\n      queries: state.queries,\n      throttled,\n    };\n  });\n\n  // Not in debugging session, so noop.\n  if (!snapshot.debug?.debugging) {\n    return undefined;\n  }\n\n  // No recorded fetch requests, which implies an inflight request loading.\n  const req = Object.entries(snapshot.queries)[0];\n  if (!req || req[1].status === \"loading\") {\n    return {\n      status: \"error\",\n      error: \"no_guides_fetched\",\n      message: \"Loading...\",\n    };\n  }\n\n  // Should always be a default group so this should never happen.\n  const defaultGroup = snapshot.guideGroups[0];\n  if (!defaultGroup) {\n    return {\n      status: \"error\",\n      error: \"no_guide_group\",\n      message: \"No guide group found\",\n    };\n  }\n\n  const groupStage = client.getStage();\n\n  // Annotate guides for various eligibility, activation and query statuses\n  // that are useful for debugging purposes.\n  const orderedGuides = defaultGroup.display_sequence.map((guideKey, index) => {\n    const guide = snapshot.guides[guideKey];\n    if (!guide) {\n      return newUncommittedGuide(guideKey, index);\n    }\n\n    return annotateGuide(guide, index, snapshot, groupStage);\n  });\n\n  // Check if the focused guide actually exists and is selectable on the page.\n  const focusedGuideKey = Object.keys(runConfig.focusedGuideKeys || {})[0];\n  if (groupStage?.status === \"closed\" && focusedGuideKey) {\n    const foundGuide = orderedGuides.find((g) => g.key === focusedGuideKey);\n\n    // No such guide exists for the given focused guide key.\n    if (!foundGuide) {\n      return {\n        status: \"error\",\n        error: \"focus_unknown_guide\",\n        message: `Unable to display \\`${focusedGuideKey}\\`, ${FOCUS_ERRORS.focusUnknownGuide.toLowerCase()}.`,\n      };\n    }\n\n    // This guide exists but has never been committed and published, so it is\n    // not present in the API response.\n    if (isUncommittedGuide(foundGuide)) {\n      return {\n        status: \"error\",\n        error: \"focus_uncommitted_guide\",\n        message: `Unable to display \\`${focusedGuideKey}\\`, ${FOCUS_ERRORS.focusUncommittedGuide.toLowerCase()}.`,\n      };\n    }\n\n    // This guide exists and is present in the response, but it is not queried\n    // in the current page so it is impossible to force render this guide.\n    if (!foundGuide.annotation.selectable.status) {\n      return {\n        status: \"error\",\n        error: \"focus_unselectable_guide\",\n        message: `Unable to display \\`${focusedGuideKey}\\`, ${FOCUS_ERRORS.focusUnselectableGuide.toLowerCase()}.`,\n      };\n    }\n  }\n\n  return {\n    status: \"ok\",\n    guides: orderedGuides,\n  };\n};\n\nexport const isUncommittedGuide = (input: unknown): input is UncommittedGuide =>\n  typeof input === \"object\" &&\n  input !== null &&\n  \"__typename\" in input &&\n  (input as UncommittedGuide).__typename === \"UncommittedGuide\";\n"],"names":["byKey","items","reduce","acc","item","key","inferSelectByKeyReturnStatus","guide","snapshot","stage","query","includeThrottled","one","metadata","opts","all","bypass_global_group_limit","resolved","throttled","inferSelectOneByTypeReturnStatus","type","result","size","first","values","inferSelectAllByTypeReturnStatus","guides","guidesByKey","inferSelectReturnStatus","toSelectableStatus","status","undefined","results","Boolean","toIneligibilityStatus","marker","statuses","reason","targetable","message","steps","every","s","archived_at","archived","active","resolveIsEligible","resolveIsQualified","activatable","selectable","annotateGuide","orderIndex","ineligibleGuides","location","ineligiblity","checkActivatable","annotation","isEligible","isQualified","newUncommittedGuide","__typename","useInspectGuideClientStore","runConfig","client","useGuideContext","useStore","store","state","checkStateIfThrottled","guideGroups","debug","counter","queries","debugging","req","Object","entries","error","defaultGroup","groupStage","getStage","orderedGuides","display_sequence","map","guideKey","index","focusedGuideKey","keys","focusedGuideKeys","foundGuide","find","g","FOCUS_ERRORS","focusUnknownGuide","toLowerCase","isUncommittedGuide","focusUncommittedGuide","focusUnselectableGuide","input"],"mappings":"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"}

package/dist/cjs/modules/guide/providers/KnockGuideProvider.js

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const c=require("@knocklabs/react-core"),n=require("react");require("../components/Banner/Banner.js");require("../components/Card/Card.js");const o=require("../components/Toolbar/V1/V1.js"),a=require("../components/Toolbar/V2/V2.js");require("../components/Modal/Modal.js");const i=e=>e&&typeof e=="object"&&"default"in e?e:{default:e},t=i(n),l=({children:e,toolbar:r="v2",...u})=>t.default.createElement(c.KnockGuideProvider,{...u,trackDebugParams:r==="v1"},e,r==="v2"?t.default.createElement(a.V2,null):t.default.createElement(o.V1,null));exports.KnockGuideProvider=l;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const n=require("@knocklabs/react-core"),o=require("react");require("../components/Banner/Banner.js");require("../components/Card/Card.js");const i=require("../components/Toolbar/V1/V1.js"),a=require("../components/Toolbar/V2/V2.js");require("../components/Modal/Modal.js");const l=e=>e&&typeof e=="object"&&"default"in e?e:{default:e},t=l(o),d=({children:e,toolbar:r="v2",readyToTarget:u,...c})=>t.default.createElement(n.KnockGuideProvider,{...c,readyToTarget:u,trackDebugParams:r==="v1"},e,r==="v2"?t.default.createElement(a.V2,{readyToTarget:u}):t.default.createElement(i.V1,null));exports.KnockGuideProvider=d;
 //# sourceMappingURL=KnockGuideProvider.js.map

package/dist/cjs/modules/guide/providers/KnockGuideProvider.js.map

@@ -1 +1 @@
-{"version":3,"file":"KnockGuideProvider.js","sources":["../../../../../src/modules/guide/providers/KnockGuideProvider.tsx"],"sourcesContent":["import {\n  KnockGuideProvider as KnockGuideProviderCore,\n  type KnockGuideProviderProps,\n} from \"@knocklabs/react-core\";\nimport React from \"react\";\n\nimport { ToolbarV1, ToolbarV2 } from \"../components\";\n\ntype Props = KnockGuideProviderProps & {\n  toolbar?: \"v1\" | \"v2\";\n};\n\n// Re-export the core KnockGuideProvider, so we can add React specific\n// functionality like the Toolbar component which shouldn't be included in other\n// contexts (e.g. React Native).\nexport const KnockGuideProvider: React.FC<React.PropsWithChildren<Props>> = ({\n  children,\n  toolbar = \"v2\",\n  ...props\n}) => {\n  return (\n    <KnockGuideProviderCore\n      {...props}\n      // For backward compatibility with toolbar v1. Remove once v2 ships.\n      trackDebugParams={toolbar === \"v1\"}\n    >\n      {children}\n      {toolbar === \"v2\" ? <ToolbarV2 /> : <ToolbarV1 />}\n    </KnockGuideProviderCore>\n  );\n};\n"],"names":["KnockGuideProvider","children","toolbar","props","React","KnockGuideProviderCore","ToolbarV2","ToolbarV1"],"mappings":"uaAeaA,EAA+DA,CAAC,CAC3EC,SAAAA,EACAC,QAAAA,EAAU,KACV,GAAGC,CACL,IAEIC,EAAA,QAAA,cAACC,EAAA,mBAAA,CACC,GAAIF,EAEJ,iBAAkBD,IAAY,IAAA,EAE7BD,EACAC,IAAY,KAAOE,EAAA,QAAA,cAACE,EAAAA,GAAY,IAAA,0BAAIC,EAAAA,GAAY,IAAA,CACnD"}
+{"version":3,"file":"KnockGuideProvider.js","sources":["../../../../../src/modules/guide/providers/KnockGuideProvider.tsx"],"sourcesContent":["import {\n  KnockGuideProvider as KnockGuideProviderCore,\n  type KnockGuideProviderProps,\n} from \"@knocklabs/react-core\";\nimport React from \"react\";\n\nimport { ToolbarV1, ToolbarV2 } from \"../components\";\n\ntype Props = KnockGuideProviderProps & {\n  toolbar?: \"v1\" | \"v2\";\n};\n\n// Re-export the core KnockGuideProvider, so we can add React specific\n// functionality like the Toolbar component which shouldn't be included in other\n// contexts (e.g. React Native).\nexport const KnockGuideProvider: React.FC<React.PropsWithChildren<Props>> = ({\n  children,\n  toolbar = \"v2\",\n  readyToTarget,\n  ...props\n}) => {\n  return (\n    <KnockGuideProviderCore\n      {...props}\n      readyToTarget={readyToTarget}\n      // For backward compatibility with toolbar v1. Remove once v2 ships.\n      trackDebugParams={toolbar === \"v1\"}\n    >\n      {children}\n      {toolbar === \"v2\" ? (\n        <ToolbarV2 readyToTarget={readyToTarget} />\n      ) : (\n        <ToolbarV1 />\n      )}\n    </KnockGuideProviderCore>\n  );\n};\n"],"names":["KnockGuideProvider","children","toolbar","readyToTarget","props","React","KnockGuideProviderCore","ToolbarV2","ToolbarV1"],"mappings":"uaAeaA,EAA+DA,CAAC,CAC3EC,SAAAA,EACAC,QAAAA,EAAU,KACVC,cAAAA,EACA,GAAGC,CACL,IAEIC,EAAA,QAAA,cAACC,EAAA,mBAAA,CACKF,GAAAA,EACJ,cAAAD,EAEA,iBAAkBD,IAAY,IAAA,EAE7BD,EACAC,IAAY,KACXG,UAAA,cAACE,MAAU,cAAAJ,4BAEVK,EACF,GAAA,IAAA,CACH"}

package/dist/esm/index.mjs

@@ -28,10 +28,10 @@ import "@telegraph/tag";
 import "@telegraph/typography";
 import "lucide-react";
 /* empty css                                             */
+import "@knocklabs/client";
 import "@telegraph/icon";
 import "@telegraph/segmented-control";
 import "@telegraph/tooltip";
-import "@knocklabs/client";
 import "@telegraph/toggle";
 import { Modal as ze, ModalView as Je } from "./modules/guide/components/Modal/Modal.mjs";
 import { KnockGuideProvider as We } from "./modules/guide/providers/KnockGuideProvider.mjs";

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

@@ -1,79 +1,80 @@
-import { useGuideContext as g, useStore as y } from "@knocklabs/react-core";
+import { useGuideContext as h, useStore as y } from "@knocklabs/react-core";
 import { Button as d } from "@telegraph/button";
-import { Box as h, Stack as p } from "@telegraph/layout";
+import { Box as x, Stack as f } from "@telegraph/layout";
 import { Tooltip as m } from "@telegraph/tooltip";
-import { Text as x } from "@telegraph/typography";
-import { ChevronLeft as E, ChevronRight as k, X as v } from "lucide-react";
+import { Text as E } from "@telegraph/typography";
+import { ChevronLeft as v, ChevronRight as k, X as C } from "lucide-react";
 import * as t from "react";
-import { GUIDE_ROW_DATA_SELECTOR as C } from "./GuideRow.mjs";
-const f = 60, b = (o, i) => {
+import { GUIDE_ROW_DATA_SELECTOR as T } from "./GuideRow.mjs";
+import { sharedTooltipProps as p } from "./helpers.mjs";
+const b = 60, g = (o, i) => {
   requestAnimationFrame(() => {
-    const n = o.querySelector(`[${C}="${CSS.escape(i)}"]`);
-    if (!n || !(n instanceof HTMLElement)) return;
-    const e = o.getBoundingClientRect(), c = n.getBoundingClientRect();
+    const r = o.querySelector(`[${T}="${CSS.escape(i)}"]`);
+    if (!r || !(r instanceof HTMLElement)) return;
+    const e = o.getBoundingClientRect(), c = r.getBoundingClientRect();
     c.top < e.top ? o.scrollTo({
-      top: o.scrollTop - (e.top - c.top) - f,
+      top: o.scrollTop - (e.top - c.top) - b,
       behavior: "smooth"
     }) : c.bottom > e.bottom && o.scrollTo({
-      top: o.scrollTop + (c.bottom - e.bottom) + f,
+      top: o.scrollTop + (c.bottom - e.bottom) + b,
       behavior: "smooth"
     });
   });
-}, K = ({
+}, z = ({
   guides: o,
   guideListRef: i
 }) => {
   const {
-    client: n
-  } = g(), {
+    client: r
+  } = h(), {
     debugSettings: e
-  } = y(n.store, (r) => ({
-    debugSettings: r.debug
+  } = y(r.store, (n) => ({
+    debugSettings: n.debug
   })), c = Object.keys((e == null ? void 0 : e.focusedGuideKeys) || {});
   if (!(c.length > 0))
     return null;
   const a = c[0];
-  return /* @__PURE__ */ t.createElement(h, { borderTop: "px", px: "3", py: "1", overflow: "hidden", backgroundColor: "blue-2" }, /* @__PURE__ */ t.createElement(p, { align: "center", justify: "space-between", gap: "4" }, /* @__PURE__ */ t.createElement(x, { as: "span", size: "1", weight: "medium", color: "blue", style: {
+  return /* @__PURE__ */ t.createElement(x, { borderTop: "px", px: "3", py: "1", overflow: "hidden", backgroundColor: "blue-2" }, /* @__PURE__ */ t.createElement(f, { align: "center", justify: "space-between", gap: "4" }, /* @__PURE__ */ t.createElement(E, { as: "span", size: "1", weight: "medium", color: "blue", style: {
     display: "block",
     overflow: "hidden",
     textOverflow: "ellipsis",
     whiteSpace: "nowrap",
     minWidth: 0
-  } }, "Focus mode: ", a), /* @__PURE__ */ t.createElement(p, { align: "center", gap: "1", style: {
+  } }, "Focus mode: ", a), /* @__PURE__ */ t.createElement(f, { align: "center", gap: "1", style: {
     flexShrink: 0
-  } }, /* @__PURE__ */ t.createElement(m, { label: "Focus previous guide" }, /* @__PURE__ */ t.createElement(d, { size: "0", variant: "ghost", color: "blue", leadingIcon: {
-    icon: E,
+  } }, /* @__PURE__ */ t.createElement(m, { label: "Focus previous guide", ...p }, /* @__PURE__ */ t.createElement(d, { size: "0", variant: "ghost", color: "blue", leadingIcon: {
+    icon: v,
     alt: "Previous guide"
   }, onClick: () => {
-    const r = o.filter((s) => !!s.annotation.selectable.status), u = r.findIndex((s) => s.key === a), l = u <= 0 ? void 0 : r[u - 1];
-    l && (n.setDebug({
+    const n = o.filter((s) => !!s.annotation.selectable.status), u = n.findIndex((s) => s.key === a), l = u <= 0 ? void 0 : n[u - 1];
+    l && (r.setDebug({
       ...e,
       focusedGuideKeys: {
         [l.key]: !0
       }
-    }), i.current && b(i.current, l.key));
-  } })), /* @__PURE__ */ t.createElement(m, { label: "Focus next guide" }, /* @__PURE__ */ t.createElement(d, { size: "0", variant: "ghost", color: "blue", leadingIcon: {
+    }), i.current && g(i.current, l.key));
+  } })), /* @__PURE__ */ t.createElement(m, { label: "Focus next guide", ...p }, /* @__PURE__ */ t.createElement(d, { size: "0", variant: "ghost", color: "blue", leadingIcon: {
     icon: k,
     alt: "Next guide"
   }, onClick: () => {
-    const r = o.filter((s) => !!s.annotation.selectable.status), u = r.findIndex((s) => s.key === a), l = u < 0 || u + 1 > r.length - 1 ? void 0 : r[u + 1];
-    l && (n.setDebug({
+    const n = o.filter((s) => !!s.annotation.selectable.status), u = n.findIndex((s) => s.key === a), l = u < 0 || u + 1 > n.length - 1 ? void 0 : n[u + 1];
+    l && (r.setDebug({
       ...e,
       focusedGuideKeys: {
         [l.key]: !0
       }
-    }), i.current && b(i.current, l.key));
-  } })), /* @__PURE__ */ t.createElement(m, { label: "Exit focus lock" }, /* @__PURE__ */ t.createElement(d, { size: "0", variant: "ghost", color: "blue", leadingIcon: {
-    icon: v,
+    }), i.current && g(i.current, l.key));
+  } })), /* @__PURE__ */ t.createElement(m, { label: "Exit focus mode", ...p }, /* @__PURE__ */ t.createElement(d, { size: "0", variant: "ghost", color: "blue", leadingIcon: {
+    icon: C,
     alt: "Clear focus"
   }, onClick: () => {
-    n.setDebug({
+    r.setDebug({
       ...e,
       focusedGuideKeys: {}
     });
   } })))));
 };
 export {
-  K as FocusChin
+  z as FocusChin
 };
 //# sourceMappingURL=FocusChin.mjs.map

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

@@ -1 +1 @@
-{"version":3,"file":"FocusChin.mjs","sources":["../../../../../../../src/modules/guide/components/Toolbar/V2/FocusChin.tsx"],"sourcesContent":["import { useGuideContext, useStore } from \"@knocklabs/react-core\";\nimport { Button } from \"@telegraph/button\";\nimport { Box, Stack } from \"@telegraph/layout\";\nimport { Tooltip } from \"@telegraph/tooltip\";\nimport { Text } from \"@telegraph/typography\";\nimport { ChevronLeft, ChevronRight, X } from \"lucide-react\";\nimport * as React from \"react\";\n\nimport { GUIDE_ROW_DATA_SELECTOR } from \"./GuideRow\";\nimport { InspectionResultOk } from \"./useInspectGuideClientStore\";\n\n// Extra scroll overshoot so the focused guide plus ~1-2 neighbors are visible,\n// reducing how often consecutive next/prev clicks trigger a scroll.\nconst SCROLL_OVERSHOOT = 60;\n\nconst maybeScrollGuideIntoView = (container: HTMLElement, guideKey: string) => {\n  requestAnimationFrame(() => {\n    const el = container.querySelector(\n      `[${GUIDE_ROW_DATA_SELECTOR}=\"${CSS.escape(guideKey)}\"]`,\n    );\n    if (!el || !(el instanceof HTMLElement)) return;\n\n    const containerRect = container.getBoundingClientRect();\n    const elRect = el.getBoundingClientRect();\n\n    if (elRect.top < containerRect.top) {\n      container.scrollTo({\n        top:\n          container.scrollTop -\n          (containerRect.top - elRect.top) -\n          SCROLL_OVERSHOOT,\n        behavior: \"smooth\",\n      });\n    } else if (elRect.bottom > containerRect.bottom) {\n      container.scrollTo({\n        top:\n          container.scrollTop +\n          (elRect.bottom - containerRect.bottom) +\n          SCROLL_OVERSHOOT,\n        behavior: \"smooth\",\n      });\n    }\n  });\n};\n\ntype Props = {\n  guides: InspectionResultOk[\"guides\"];\n  guideListRef: React.RefObject<HTMLDivElement | null>;\n};\n\nexport const FocusChin = ({ guides, guideListRef }: Props) => {\n  const { client } = useGuideContext();\n  const { debugSettings } = useStore(client.store, (state) => ({\n    debugSettings: state.debug,\n  }));\n\n  const focusedKeys = Object.keys(debugSettings?.focusedGuideKeys || {});\n\n  const isFocused = focusedKeys.length > 0;\n  if (!isFocused) {\n    return null;\n  }\n\n  const currentKey = focusedKeys[0]!;\n\n  return (\n    <Box\n      borderTop=\"px\"\n      px=\"3\"\n      py=\"1\"\n      overflow=\"hidden\"\n      backgroundColor=\"blue-2\"\n    >\n      <Stack align=\"center\" justify=\"space-between\" gap=\"4\">\n        <Text\n          as=\"span\"\n          size=\"1\"\n          weight=\"medium\"\n          color=\"blue\"\n          style={{\n            display: \"block\",\n            overflow: \"hidden\",\n            textOverflow: \"ellipsis\",\n            whiteSpace: \"nowrap\",\n            minWidth: 0,\n          }}\n        >\n          Focus mode: {currentKey}\n        </Text>\n        <Stack align=\"center\" gap=\"1\" style={{ flexShrink: 0 }}>\n          <Tooltip label=\"Focus previous guide\">\n            <Button\n              size=\"0\"\n              variant=\"ghost\"\n              color=\"blue\"\n              leadingIcon={{ icon: ChevronLeft, alt: \"Previous guide\" }}\n              onClick={() => {\n                const selectableGuides = guides.filter(\n                  (g) => !!g.annotation.selectable.status,\n                );\n                const currIndex = selectableGuides.findIndex(\n                  (g) => g.key === currentKey,\n                );\n                const prevGuide =\n                  currIndex <= 0 ? undefined : selectableGuides[currIndex - 1];\n\n                if (!prevGuide) return;\n\n                client.setDebug({\n                  ...debugSettings,\n                  focusedGuideKeys: { [prevGuide.key]: true },\n                });\n\n                if (guideListRef.current) {\n                  maybeScrollGuideIntoView(guideListRef.current, prevGuide.key);\n                }\n              }}\n            />\n          </Tooltip>\n          <Tooltip label=\"Focus next guide\">\n            <Button\n              size=\"0\"\n              variant=\"ghost\"\n              color=\"blue\"\n              leadingIcon={{ icon: ChevronRight, alt: \"Next guide\" }}\n              onClick={() => {\n                const selectableGuides = guides.filter(\n                  (g) => !!g.annotation.selectable.status,\n                );\n                const currIndex = selectableGuides.findIndex(\n                  (g) => g.key === currentKey,\n                );\n                const nextGuide =\n                  currIndex < 0 || currIndex + 1 > selectableGuides.length - 1\n                    ? undefined\n                    : selectableGuides[currIndex + 1];\n\n                if (!nextGuide) return;\n\n                client.setDebug({\n                  ...debugSettings,\n                  focusedGuideKeys: { [nextGuide.key]: true },\n                });\n\n                if (guideListRef.current) {\n                  maybeScrollGuideIntoView(guideListRef.current, nextGuide.key);\n                }\n              }}\n            />\n          </Tooltip>\n          <Tooltip label=\"Exit focus lock\">\n            <Button\n              size=\"0\"\n              variant=\"ghost\"\n              color=\"blue\"\n              leadingIcon={{ icon: X, alt: \"Clear focus\" }}\n              onClick={() => {\n                client.setDebug({ ...debugSettings, focusedGuideKeys: {} });\n              }}\n            />\n          </Tooltip>\n        </Stack>\n      </Stack>\n    </Box>\n  );\n};\n"],"names":["SCROLL_OVERSHOOT","maybeScrollGuideIntoView","container","guideKey","requestAnimationFrame","el","querySelector","GUIDE_ROW_DATA_SELECTOR","CSS","escape","HTMLElement","containerRect","getBoundingClientRect","elRect","top","scrollTo","scrollTop","behavior","bottom","FocusChin","guides","guideListRef","client","useGuideContext","debugSettings","useStore","store","state","debug","focusedKeys","Object","keys","focusedGuideKeys","length","currentKey","React","Box","Stack","Text","display","overflow","textOverflow","whiteSpace","minWidth","flexShrink","Tooltip","Button","icon","ChevronLeft","alt","selectableGuides","filter","g","annotation","selectable","status","currIndex","findIndex","key","prevGuide","undefined","setDebug","current","ChevronRight","nextGuide","X"],"mappings":"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"}
+{"version":3,"file":"FocusChin.mjs","sources":["../../../../../../../src/modules/guide/components/Toolbar/V2/FocusChin.tsx"],"sourcesContent":["import { useGuideContext, useStore } from \"@knocklabs/react-core\";\nimport { Button } from \"@telegraph/button\";\nimport { Box, Stack } from \"@telegraph/layout\";\nimport { Tooltip } from \"@telegraph/tooltip\";\nimport { Text } from \"@telegraph/typography\";\nimport { ChevronLeft, ChevronRight, X } from \"lucide-react\";\nimport * as React from \"react\";\n\nimport { GUIDE_ROW_DATA_SELECTOR } from \"./GuideRow\";\nimport { sharedTooltipProps } from \"./helpers\";\nimport { InspectionResultOk } from \"./useInspectGuideClientStore\";\n\n// Extra scroll overshoot so the focused guide plus ~1-2 neighbors are visible,\n// reducing how often consecutive next/prev clicks trigger a scroll.\nconst SCROLL_OVERSHOOT = 60;\n\nconst maybeScrollGuideIntoView = (container: HTMLElement, guideKey: string) => {\n  requestAnimationFrame(() => {\n    const el = container.querySelector(\n      `[${GUIDE_ROW_DATA_SELECTOR}=\"${CSS.escape(guideKey)}\"]`,\n    );\n    if (!el || !(el instanceof HTMLElement)) return;\n\n    const containerRect = container.getBoundingClientRect();\n    const elRect = el.getBoundingClientRect();\n\n    if (elRect.top < containerRect.top) {\n      container.scrollTo({\n        top:\n          container.scrollTop -\n          (containerRect.top - elRect.top) -\n          SCROLL_OVERSHOOT,\n        behavior: \"smooth\",\n      });\n    } else if (elRect.bottom > containerRect.bottom) {\n      container.scrollTo({\n        top:\n          container.scrollTop +\n          (elRect.bottom - containerRect.bottom) +\n          SCROLL_OVERSHOOT,\n        behavior: \"smooth\",\n      });\n    }\n  });\n};\n\ntype Props = {\n  guides: InspectionResultOk[\"guides\"];\n  guideListRef: React.RefObject<HTMLDivElement | null>;\n};\n\nexport const FocusChin = ({ guides, guideListRef }: Props) => {\n  const { client } = useGuideContext();\n  const { debugSettings } = useStore(client.store, (state) => ({\n    debugSettings: state.debug,\n  }));\n\n  const focusedKeys = Object.keys(debugSettings?.focusedGuideKeys || {});\n\n  const isFocused = focusedKeys.length > 0;\n  if (!isFocused) {\n    return null;\n  }\n\n  const currentKey = focusedKeys[0]!;\n\n  return (\n    <Box\n      borderTop=\"px\"\n      px=\"3\"\n      py=\"1\"\n      overflow=\"hidden\"\n      backgroundColor=\"blue-2\"\n    >\n      <Stack align=\"center\" justify=\"space-between\" gap=\"4\">\n        <Text\n          as=\"span\"\n          size=\"1\"\n          weight=\"medium\"\n          color=\"blue\"\n          style={{\n            display: \"block\",\n            overflow: \"hidden\",\n            textOverflow: \"ellipsis\",\n            whiteSpace: \"nowrap\",\n            minWidth: 0,\n          }}\n        >\n          Focus mode: {currentKey}\n        </Text>\n        <Stack align=\"center\" gap=\"1\" style={{ flexShrink: 0 }}>\n          <Tooltip label=\"Focus previous guide\" {...sharedTooltipProps}>\n            <Button\n              size=\"0\"\n              variant=\"ghost\"\n              color=\"blue\"\n              leadingIcon={{ icon: ChevronLeft, alt: \"Previous guide\" }}\n              onClick={() => {\n                const selectableGuides = guides.filter(\n                  (g) => !!g.annotation.selectable.status,\n                );\n                const currIndex = selectableGuides.findIndex(\n                  (g) => g.key === currentKey,\n                );\n                const prevGuide =\n                  currIndex <= 0 ? undefined : selectableGuides[currIndex - 1];\n\n                if (!prevGuide) return;\n\n                client.setDebug({\n                  ...debugSettings,\n                  focusedGuideKeys: { [prevGuide.key]: true },\n                });\n\n                if (guideListRef.current) {\n                  maybeScrollGuideIntoView(guideListRef.current, prevGuide.key);\n                }\n              }}\n            />\n          </Tooltip>\n          <Tooltip label=\"Focus next guide\" {...sharedTooltipProps}>\n            <Button\n              size=\"0\"\n              variant=\"ghost\"\n              color=\"blue\"\n              leadingIcon={{ icon: ChevronRight, alt: \"Next guide\" }}\n              onClick={() => {\n                const selectableGuides = guides.filter(\n                  (g) => !!g.annotation.selectable.status,\n                );\n                const currIndex = selectableGuides.findIndex(\n                  (g) => g.key === currentKey,\n                );\n                const nextGuide =\n                  currIndex < 0 || currIndex + 1 > selectableGuides.length - 1\n                    ? undefined\n                    : selectableGuides[currIndex + 1];\n\n                if (!nextGuide) return;\n\n                client.setDebug({\n                  ...debugSettings,\n                  focusedGuideKeys: { [nextGuide.key]: true },\n                });\n\n                if (guideListRef.current) {\n                  maybeScrollGuideIntoView(guideListRef.current, nextGuide.key);\n                }\n              }}\n            />\n          </Tooltip>\n          <Tooltip label=\"Exit focus mode\" {...sharedTooltipProps}>\n            <Button\n              size=\"0\"\n              variant=\"ghost\"\n              color=\"blue\"\n              leadingIcon={{ icon: X, alt: \"Clear focus\" }}\n              onClick={() => {\n                client.setDebug({ ...debugSettings, focusedGuideKeys: {} });\n              }}\n            />\n          </Tooltip>\n        </Stack>\n      </Stack>\n    </Box>\n  );\n};\n"],"names":["SCROLL_OVERSHOOT","maybeScrollGuideIntoView","container","guideKey","requestAnimationFrame","el","querySelector","GUIDE_ROW_DATA_SELECTOR","CSS","escape","HTMLElement","containerRect","getBoundingClientRect","elRect","top","scrollTo","scrollTop","behavior","bottom","FocusChin","guides","guideListRef","client","useGuideContext","debugSettings","useStore","store","state","debug","focusedKeys","Object","keys","focusedGuideKeys","length","currentKey","React","Box","Stack","Text","display","overflow","textOverflow","whiteSpace","minWidth","flexShrink","Tooltip","sharedTooltipProps","Button","icon","ChevronLeft","alt","selectableGuides","filter","g","annotation","selectable","status","currIndex","findIndex","key","prevGuide","undefined","setDebug","current","ChevronRight","nextGuide","X"],"mappings":"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"}

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

@@ -1,18 +1,19 @@
 import e from "react";
 import { Stack as i } from "@telegraph/layout";
 import { Tooltip as a } from "@telegraph/tooltip";
-const l = {
+import { sharedTooltipProps as l } from "./helpers.mjs";
+const o = {
   blue: /* @__PURE__ */ e.createElement("svg", { width: "8", height: "8", viewBox: "0 0 8 8", "aria-hidden": !0 }, /* @__PURE__ */ e.createElement("circle", { cx: "4", cy: "4", r: "4", fill: "var(--tgph-blue-9)" })),
   yellow: /* @__PURE__ */ e.createElement("svg", { width: "8", height: "8", viewBox: "0 0 8 8", "aria-hidden": !0 }, /* @__PURE__ */ e.createElement("polygon", { points: "4,0.5 7.5,7.5 0.5,7.5", fill: "var(--tgph-yellow-9)" })),
   gray: /* @__PURE__ */ e.createElement("svg", { width: "8", height: "8", viewBox: "0 0 8 8", "aria-hidden": !0 }, /* @__PURE__ */ e.createElement("circle", { cx: "4", cy: "4", r: "2.75", fill: "none", stroke: "var(--tgph-gray-9)", strokeWidth: "2.5" })),
   red: /* @__PURE__ */ e.createElement("svg", { width: "8", height: "8", viewBox: "0 0 8 8", "aria-hidden": !0 }, /* @__PURE__ */ e.createElement("line", { x1: "1.5", y1: "1.5", x2: "6.5", y2: "6.5", stroke: "var(--tgph-red-9)", strokeWidth: "2", strokeLinecap: "round" }), /* @__PURE__ */ e.createElement("line", { x1: "6.5", y1: "1.5", x2: "1.5", y2: "6.5", stroke: "var(--tgph-red-9)", strokeWidth: "2", strokeLinecap: "round" }))
-}, h = ({
+}, s = ({
   color: t,
   tooltip: r
-}) => /* @__PURE__ */ e.createElement(a, { label: r }, /* @__PURE__ */ e.createElement(i, { as: "span", align: "center", justify: "center", display: "inline-flex", p: "0_5", style: {
+}) => /* @__PURE__ */ e.createElement(a, { label: r, ...l }, /* @__PURE__ */ e.createElement(i, { as: "span", align: "center", justify: "center", display: "inline-flex", p: "0_5", style: {
   flexShrink: 0
-} }, l[t]));
+} }, o[t]));
 export {
-  h as GuideAnnotatedStatusDot
+  s as GuideAnnotatedStatusDot
 };
 //# sourceMappingURL=GuideAnnotatedStatusDot.mjs.map

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

@@ -1 +1 @@
-{"version":3,"file":"GuideAnnotatedStatusDot.mjs","sources":["../../../../../../../src/modules/guide/components/Toolbar/V2/GuideAnnotatedStatusDot.tsx"],"sourcesContent":["import { Stack } from \"@telegraph/layout\";\nimport { Tooltip } from \"@telegraph/tooltip\";\n\nexport type StatusColor = \"blue\" | \"red\" | \"yellow\" | \"gray\";\n\n// Directly copied from the design prototype.\nconst STATUS_SHAPES: Record<StatusColor, React.ReactNode> = {\n  blue: (\n    <svg width=\"8\" height=\"8\" viewBox=\"0 0 8 8\" aria-hidden>\n      <circle cx=\"4\" cy=\"4\" r=\"4\" fill=\"var(--tgph-blue-9)\" />\n    </svg>\n  ),\n  yellow: (\n    <svg width=\"8\" height=\"8\" viewBox=\"0 0 8 8\" aria-hidden>\n      <polygon points=\"4,0.5 7.5,7.5 0.5,7.5\" fill=\"var(--tgph-yellow-9)\" />\n    </svg>\n  ),\n  gray: (\n    <svg width=\"8\" height=\"8\" viewBox=\"0 0 8 8\" aria-hidden>\n      <circle\n        cx=\"4\"\n        cy=\"4\"\n        r=\"2.75\"\n        fill=\"none\"\n        stroke=\"var(--tgph-gray-9)\"\n        strokeWidth=\"2.5\"\n      />\n    </svg>\n  ),\n  red: (\n    <svg width=\"8\" height=\"8\" viewBox=\"0 0 8 8\" aria-hidden>\n      <line\n        x1=\"1.5\"\n        y1=\"1.5\"\n        x2=\"6.5\"\n        y2=\"6.5\"\n        stroke=\"var(--tgph-red-9)\"\n        strokeWidth=\"2\"\n        strokeLinecap=\"round\"\n      />\n      <line\n        x1=\"6.5\"\n        y1=\"1.5\"\n        x2=\"1.5\"\n        y2=\"6.5\"\n        stroke=\"var(--tgph-red-9)\"\n        strokeWidth=\"2\"\n        strokeLinecap=\"round\"\n      />\n    </svg>\n  ),\n};\n\nexport const GuideAnnotatedStatusDot = ({\n  color,\n  tooltip,\n}: {\n  color: StatusColor;\n  tooltip: string;\n}) => {\n  return (\n    <Tooltip label={tooltip}>\n      <Stack\n        as=\"span\"\n        align=\"center\"\n        justify=\"center\"\n        display=\"inline-flex\"\n        p=\"0_5\"\n        style={{ flexShrink: 0 }}\n      >\n        {STATUS_SHAPES[color]}\n      </Stack>\n    </Tooltip>\n  );\n};\n"],"names":["STATUS_SHAPES","blue","React","yellow","gray","red","GuideAnnotatedStatusDot","color","tooltip","Tooltip","Stack","flexShrink"],"mappings":";;;AAMA,MAAMA,IAAsD;AAAA,EAC1DC,sCACG,OAAI,EAAA,OAAM,KAAI,QAAO,KAAI,SAAQ,WAAU,eAAW,MACpDC,gBAAAA,EAAA,cAAA,UAAA,EAAO,IAAG,KAAI,IAAG,KAAI,GAAE,KAAI,MAAK,qBAAoB,CAAA,CACvD;AAAA,EAEFC,QACGD,gBAAAA,EAAA,cAAA,OAAA,EAAI,OAAM,KAAI,QAAO,KAAI,SAAQ,WAAU,eAAW,MACpDA,gBAAAA,EAAA,cAAA,WAAA,EAAQ,QAAO,yBAAwB,MAAK,wBAAsB,CACrE;AAAA,EAEFE,MACGF,gBAAAA,EAAA,cAAA,OAAA,EAAI,OAAM,KAAI,QAAO,KAAI,SAAQ,WAAU,eAAW,GACrD,GAAAA,gBAAAA,EAAA,cAAC,YACC,IAAG,KACH,IAAG,KACH,GAAE,QACF,MAAK,QACL,QAAO,sBACP,aAAY,MAAK,CAAA,CAErB;AAAA,EAEFG,qCACG,OAAI,EAAA,OAAM,KAAI,QAAO,KAAI,SAAQ,WAAU,eAAW,MACpDH,gBAAAA,EAAA,cAAA,QAAA,EACC,IAAG,OACH,IAAG,OACH,IAAG,OACH,IAAG,OACH,QAAO,qBACP,aAAY,KACZ,eAAc,QAAO,CAAA,mCAEtB,QACC,EAAA,IAAG,OACH,IAAG,OACH,IAAG,OACH,IAAG,OACH,QAAO,qBACP,aAAY,KACZ,eAAc,SAAO,CAEzB;AAEJ,GAEaI,IAA0BA,CAAC;AAAA,EACtCC,OAAAA;AAAAA,EACAC,SAAAA;AAIF,sCAEKC,GAAQ,EAAA,OAAOD,KACdN,gBAAAA,EAAA,cAACQ,KACC,IAAG,QACH,OAAM,UACN,SAAQ,UACR,SAAQ,eACR,GAAE,OACF,OAAO;AAAA,EAAEC,YAAY;AAAA,KAEpBX,EAAcO,CAAK,CACtB,CACF;"}
+{"version":3,"file":"GuideAnnotatedStatusDot.mjs","sources":["../../../../../../../src/modules/guide/components/Toolbar/V2/GuideAnnotatedStatusDot.tsx"],"sourcesContent":["import { Stack } from \"@telegraph/layout\";\nimport { Tooltip } from \"@telegraph/tooltip\";\n\nimport { sharedTooltipProps } from \"./helpers\";\n\nexport type StatusColor = \"blue\" | \"red\" | \"yellow\" | \"gray\";\n\n// Directly copied from the design prototype.\nconst STATUS_SHAPES: Record<StatusColor, React.ReactNode> = {\n  blue: (\n    <svg width=\"8\" height=\"8\" viewBox=\"0 0 8 8\" aria-hidden>\n      <circle cx=\"4\" cy=\"4\" r=\"4\" fill=\"var(--tgph-blue-9)\" />\n    </svg>\n  ),\n  yellow: (\n    <svg width=\"8\" height=\"8\" viewBox=\"0 0 8 8\" aria-hidden>\n      <polygon points=\"4,0.5 7.5,7.5 0.5,7.5\" fill=\"var(--tgph-yellow-9)\" />\n    </svg>\n  ),\n  gray: (\n    <svg width=\"8\" height=\"8\" viewBox=\"0 0 8 8\" aria-hidden>\n      <circle\n        cx=\"4\"\n        cy=\"4\"\n        r=\"2.75\"\n        fill=\"none\"\n        stroke=\"var(--tgph-gray-9)\"\n        strokeWidth=\"2.5\"\n      />\n    </svg>\n  ),\n  red: (\n    <svg width=\"8\" height=\"8\" viewBox=\"0 0 8 8\" aria-hidden>\n      <line\n        x1=\"1.5\"\n        y1=\"1.5\"\n        x2=\"6.5\"\n        y2=\"6.5\"\n        stroke=\"var(--tgph-red-9)\"\n        strokeWidth=\"2\"\n        strokeLinecap=\"round\"\n      />\n      <line\n        x1=\"6.5\"\n        y1=\"1.5\"\n        x2=\"1.5\"\n        y2=\"6.5\"\n        stroke=\"var(--tgph-red-9)\"\n        strokeWidth=\"2\"\n        strokeLinecap=\"round\"\n      />\n    </svg>\n  ),\n};\n\nexport const GuideAnnotatedStatusDot = ({\n  color,\n  tooltip,\n}: {\n  color: StatusColor;\n  tooltip: string;\n}) => {\n  return (\n    <Tooltip label={tooltip} {...sharedTooltipProps}>\n      <Stack\n        as=\"span\"\n        align=\"center\"\n        justify=\"center\"\n        display=\"inline-flex\"\n        p=\"0_5\"\n        style={{ flexShrink: 0 }}\n      >\n        {STATUS_SHAPES[color]}\n      </Stack>\n    </Tooltip>\n  );\n};\n"],"names":["STATUS_SHAPES","blue","React","yellow","gray","red","GuideAnnotatedStatusDot","color","tooltip","Tooltip","sharedTooltipProps","Stack","flexShrink"],"mappings":";;;;AAQA,MAAMA,IAAsD;AAAA,EAC1DC,sCACG,OAAI,EAAA,OAAM,KAAI,QAAO,KAAI,SAAQ,WAAU,eAAW,MACpDC,gBAAAA,EAAA,cAAA,UAAA,EAAO,IAAG,KAAI,IAAG,KAAI,GAAE,KAAI,MAAK,qBAAoB,CAAA,CACvD;AAAA,EAEFC,QACGD,gBAAAA,EAAA,cAAA,OAAA,EAAI,OAAM,KAAI,QAAO,KAAI,SAAQ,WAAU,eAAW,MACpDA,gBAAAA,EAAA,cAAA,WAAA,EAAQ,QAAO,yBAAwB,MAAK,wBAAsB,CACrE;AAAA,EAEFE,MACGF,gBAAAA,EAAA,cAAA,OAAA,EAAI,OAAM,KAAI,QAAO,KAAI,SAAQ,WAAU,eAAW,GACrD,GAAAA,gBAAAA,EAAA,cAAC,YACC,IAAG,KACH,IAAG,KACH,GAAE,QACF,MAAK,QACL,QAAO,sBACP,aAAY,MAAK,CAAA,CAErB;AAAA,EAEFG,qCACG,OAAI,EAAA,OAAM,KAAI,QAAO,KAAI,SAAQ,WAAU,eAAW,MACpDH,gBAAAA,EAAA,cAAA,QAAA,EACC,IAAG,OACH,IAAG,OACH,IAAG,OACH,IAAG,OACH,QAAO,qBACP,aAAY,KACZ,eAAc,QAAO,CAAA,mCAEtB,QACC,EAAA,IAAG,OACH,IAAG,OACH,IAAG,OACH,IAAG,OACH,QAAO,qBACP,aAAY,KACZ,eAAc,SAAO,CAEzB;AAEJ,GAEaI,IAA0BA,CAAC;AAAA,EACtCC,OAAAA;AAAAA,EACAC,SAAAA;AAIF,sCAEKC,GAAQ,EAAA,OAAOD,GAAaE,GAAAA,EAAAA,mCAC1BC,GACC,EAAA,IAAG,QACH,OAAM,UACN,SAAQ,UACR,SAAQ,eACR,GAAE,OACF,OAAO;AAAA,EAAEC,YAAY;AAAA,KAEpBZ,EAAcO,CAAK,CACtB,CACF;"}

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

@@ -1,28 +1,29 @@
 import e from "react";
-import { useGuideContext as c, useStore as d } from "@knocklabs/react-core";
+import { useGuideContext as d, useStore as s } from "@knocklabs/react-core";
 import { Box as o, Stack as t } from "@telegraph/layout";
-import { Toggle as m } from "@telegraph/toggle";
-import { Tooltip as i } from "@telegraph/tooltip";
+import { Toggle as c } from "@telegraph/toggle";
+import { Tooltip as l } from "@telegraph/tooltip";
 import { Text as a } from "@telegraph/typography";
-const f = () => {
+import { sharedTooltipProps as m } from "./helpers.mjs";
+const w = () => {
   const {
     client: r
-  } = c(), {
-    debugSettings: l
-  } = d(r.store, (n) => ({
+  } = d(), {
+    debugSettings: i
+  } = s(r.store, (n) => ({
     debugSettings: n.debug || {}
   }));
-  return /* @__PURE__ */ e.createElement(o, { py: "3", px: "3" }, /* @__PURE__ */ e.createElement(t, { direction: "column", gap: "1", width: "full" }, /* @__PURE__ */ e.createElement(a, { as: "span", size: "1", weight: "medium", display: "block" }, "Toolbar settings"), /* @__PURE__ */ e.createElement(t, { direction: "column", gap: "1" }, /* @__PURE__ */ e.createElement(t, { direction: "row", gap: "2", align: "center", h: "7" }, /* @__PURE__ */ e.createElement(i, { label: "Contain engagement actions to client side only" }, /* @__PURE__ */ e.createElement(o, { width: "36", mt: "1" }, /* @__PURE__ */ e.createElement(a, { as: "span", size: "1", weight: "medium", color: "gray", borderBottom: "px", borderStyle: "dashed" }, "Sandbox engagement"))), /* @__PURE__ */ e.createElement(m.Default, { size: "1", pt: "1_5", value: !!l.skipEngagementTracking, onValueChange: (n) => {
+  return /* @__PURE__ */ e.createElement(o, { py: "3", px: "3" }, /* @__PURE__ */ e.createElement(t, { direction: "column", gap: "1", width: "full" }, /* @__PURE__ */ e.createElement(a, { as: "span", size: "1", weight: "medium", display: "block" }, "Toolbar settings"), /* @__PURE__ */ e.createElement(t, { direction: "column", gap: "1" }, /* @__PURE__ */ e.createElement(t, { direction: "row", gap: "2", align: "center", h: "7" }, /* @__PURE__ */ e.createElement(l, { label: "When enabled, engagement actions are not sent to Knock.", ...m }, /* @__PURE__ */ e.createElement(o, { width: "36", mt: "1" }, /* @__PURE__ */ e.createElement(a, { as: "span", size: "1", weight: "medium", color: "gray", borderBottom: "px", borderStyle: "dashed" }, "Sandbox engagement"))), /* @__PURE__ */ e.createElement(c.Default, { size: "1", pt: "1_5", value: !!i.skipEngagementTracking, onValueChange: (n) => {
     r.setDebug({
-      ...l,
+      ...i,
       skipEngagementTracking: n
     });
-  } })), /* @__PURE__ */ e.createElement(t, { direction: "row", gap: "2", align: "center", h: "7" }, /* @__PURE__ */ e.createElement(i, { label: "Ignore throttle and show next guide immediately" }, /* @__PURE__ */ e.createElement(o, { width: "36", mt: "1" }, /* @__PURE__ */ e.createElement(a, { as: "span", size: "1", weight: "medium", color: "gray", borderBottom: "px", borderStyle: "dashed" }, "Ignore throttle"))), /* @__PURE__ */ e.createElement(m.Default, { size: "1", pt: "1_5", value: !!l.ignoreDisplayInterval, onValueChange: (n) => {
+  } })), /* @__PURE__ */ e.createElement(t, { direction: "row", gap: "2", align: "center", h: "7" }, /* @__PURE__ */ e.createElement(l, { label: "Ignore throttle and show next guide immediately", ...m }, /* @__PURE__ */ e.createElement(o, { width: "36", mt: "1" }, /* @__PURE__ */ e.createElement(a, { as: "span", size: "1", weight: "medium", color: "gray", borderBottom: "px", borderStyle: "dashed" }, "Ignore throttle"))), /* @__PURE__ */ e.createElement(c.Default, { size: "1", pt: "1_5", value: !!i.ignoreDisplayInterval, onValueChange: (n) => {
     r.setDebug({
-      ...l,
+      ...i,
       ignoreDisplayInterval: n
     });
-  } })))), /* @__PURE__ */ e.createElement(t, { direction: "column", gap: "1", width: "full" }, /* @__PURE__ */ e.createElement(i, { label: /* @__PURE__ */ e.createElement(a, { as: "span", size: "1" }, "The tenant and data payload passed to the guide client that are used for targeting", /* @__PURE__ */ e.createElement("br", null), "(via the targetParams prop to KnockGuideProvider)"), delayDuration: 500 }, /* @__PURE__ */ e.createElement(a, { as: "span", size: "1", weight: "medium", borderBottom: "px", borderStyle: "dashed", mt: "4", style: {
+  } })))), /* @__PURE__ */ e.createElement(t, { direction: "column", gap: "1", width: "full" }, /* @__PURE__ */ e.createElement(l, { label: /* @__PURE__ */ e.createElement(a, { as: "span", size: "1" }, "The tenant and data payload passed to KnockGuideProvider. Available for use in runtime conditions."), ...m }, /* @__PURE__ */ e.createElement(a, { as: "span", size: "1", weight: "medium", borderBottom: "px", borderStyle: "dashed", mt: "4", style: {
     whiteSpace: "nowrap",
     width: "fit-content"
   } }, "Target params")), /* @__PURE__ */ e.createElement(t, { direction: "column", gap: "2" }, /* @__PURE__ */ e.createElement(t, { direction: "row", gap: "2", align: "center" }, /* @__PURE__ */ e.createElement(a, { as: "span", size: "1", weight: "medium", color: "gray", width: "36", mt: "1" }, "Tenant"), /* @__PURE__ */ e.createElement(o, { rounded: "2", overflow: "auto", backgroundColor: "surface-2", border: "px", p: "1", style: {
@@ -42,6 +43,6 @@ const f = () => {
   } }, /* @__PURE__ */ e.createElement("code", null, r.targetParams.data ? JSON.stringify(r.targetParams.data, null, 2) : "-")))))));
 };
 export {
-  f as GuideContextDetails
+  w as GuideContextDetails
 };
 //# sourceMappingURL=GuideContextDetails.mjs.map