@knocklabs/react 0.12.1 → 0.13.1

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 { 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\";\nimport { useToolbarStyles } from \"../useToolbarStyles\";\n\nimport { FocusChin } from \"./FocusChin\";\nimport { GuideContextDetails } from \"./GuideContextDetails\";\nimport { GuideRow } from \"./GuideRow\";\nimport { Kbd } from \"./Kbd\";\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 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  listenForUpdates: boolean;\n};\n\nexport const V2 = ({ readyToTarget, listenForUpdates }: 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  useToolbarStyles(Boolean(runConfig?.isVisible));\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\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    if (!isVisible && isDebugging) {\n      client.unsetDebug({ listenForUpdates });\n    }\n\n    return () => {\n      if (client.store.state.debug?.debugging) {\n        client.unsetDebug({ listenForUpdates });\n      }\n    };\n  }, [readyToTarget, listenForUpdates, 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                  }}\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","getEmptyStateMessage","displayOption","filterGuides","guides","filter","guide","annotation","isEligible","active","status","V2","readyToTarget","listenForUpdates","client","useGuideContext","setDisplayOption","React","useState","runConfig","setRunConfig","KnockGuideClient","getToolbarRunConfigFromUrl","isCollapsed","setIsCollapsed","isContextPanelOpen","setIsContextPanelOpen","expandedGuideRowKey","setExpandedGuideRowKey","Boolean","isVisible","useEffect","undefined","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","Kbd","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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"}
+{"version":3,"file":"V2.js","names":[],"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\";\nimport { useToolbarStyles } from \"../useToolbarStyles\";\n\nimport { FocusChin } from \"./FocusChin\";\nimport { GuideContextDetails } from \"./GuideContextDetails\";\nimport { GuideRow } from \"./GuideRow\";\nimport { Kbd } from \"./Kbd\";\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 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  listenForUpdates: boolean;\n};\n\nexport const V2 = ({ readyToTarget, listenForUpdates }: 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  useToolbarStyles(Boolean(runConfig?.isVisible));\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\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    if (!isVisible && isDebugging) {\n      client.unsetDebug({ listenForUpdates });\n    }\n\n    return () => {\n      if (client.store.state.debug?.debugging) {\n        client.unsetDebug({ listenForUpdates });\n      }\n    };\n  }, [readyToTarget, listenForUpdates, 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                  }}\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"],"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"});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
+"use strict";var e={delayDuration:1e3},t={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=t,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":["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"}
+{"version":3,"file":"helpers.js","names":[],"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"],"mappings":"aAAA,IAAa,EAAqB,CAChC,cAAe,GACjB,EAIa,EAAe,CAC1B,kBAAmB,uBACnB,sBAAuB,oCACvB,uBAAwB,qDAC1B"}

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

@@ -0,0 +1 @@
+"use strict";const e=require("./V2.js");exports.ToolbarV2=e.V2;

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

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const T=require("react"),_=n=>n&&typeof n=="object"&&"default"in n?n:{default:n},e=_(T),H={top:16,right:16},I=5;function y(n,i,w,o=0){const r=window.innerWidth,f=window.innerHeight,D=i+o,d=r-n.right-i,p=Math.max(0,Math.min(d,r-D)),c=Math.max(0,Math.min(n.top,f-w)),s=r-p-i;return{top:c,right:s}}function O({elementRef:n,initialPosition:i=H,reclampDeps:w=[],rightPadding:o=0}){const[r,f]=e.default.useState(i),[D,d]=e.default.useState(!1),p=e.default.useRef(r);p.current=r;const c=e.default.useRef({x:0,y:0}),s=e.default.useRef({top:0,right:0}),u=e.default.useRef(null),g=e.default.useRef(!1),m=e.default.useRef(!1),a=e.default.useRef(null),v=e.default.useCallback(()=>{const t=n.current;if(!t)return;const l=t.getBoundingClientRect();f(h=>y(h,l.width,l.height,o))},[n,o]),P=e.default.useCallback(t=>{t.preventDefault(),c.current={x:t.clientX,y:t.clientY},s.current={...p.current},g.current=!0,m.current=!1,d(!0);const l=R=>{if(!g.current)return;const b=R.clientX-c.current.x,M=R.clientY-c.current.y;!m.current&&Math.hypot(b,M)>=I&&(m.current=!0),u.current===null&&(u.current=requestAnimationFrame(()=>{if(u.current=null,!g.current)return;const A=R.clientX-c.current.x,S=R.clientY-c.current.y,C={top:s.current.top+S,right:s.current.right-A},E=n.current;if(!E)return;const L=E.getBoundingClientRect(),F=y(C,L.width,L.height,o);f(F)}))},h=()=>{g.current=!1,d(!1),u.current!==null&&(cancelAnimationFrame(u.current),u.current=null),document.removeEventListener("pointermove",l),document.removeEventListener("pointerup",x),a.current=null},x=()=>h();document.addEventListener("pointermove",l),document.addEventListener("pointerup",x),a.current=h},[n,o]);return e.default.useEffect(()=>()=>{var t;(t=a.current)==null||t.call(a)},[]),e.default.useEffect(()=>{const t=()=>v();return window.addEventListener("resize",t),()=>window.removeEventListener("resize",t)},[v]),e.default.useEffect(()=>{const t=requestAnimationFrame(()=>v());return()=>cancelAnimationFrame(t)},w),{position:r,isDragging:D,handlePointerDown:P,hasDraggedRef:m}}exports.clampPosition=y;exports.useDraggable=O;
-//# sourceMappingURL=useDraggable.js.map
+"use strict";const e=require("../../../../../_virtual/_rolldown/runtime.js");let t=require("react");t=e.__toESM(t);var n={top:16,right:16},r=5;function i(e,t,n,r=0){let i=window.innerWidth,a=window.innerHeight,o=t+r,s=i-e.right-t,c=Math.max(0,Math.min(s,i-o));return{top:Math.max(0,Math.min(e.top,a-n)),right:i-c-t}}function a({elementRef:e,initialPosition:a=n,reclampDeps:o=[],rightPadding:s=0}){let[c,l]=t.default.useState(a),[u,d]=t.default.useState(!1),f=t.default.useRef(c);f.current=c;let p=t.default.useRef({x:0,y:0}),m=t.default.useRef({top:0,right:0}),h=t.default.useRef(null),g=t.default.useRef(!1),_=t.default.useRef(!1),v=t.default.useRef(null),y=t.default.useCallback(()=>{let t=e.current;if(!t)return;let n=t.getBoundingClientRect();l(e=>i(e,n.width,n.height,s))},[e,s]),b=t.default.useCallback(t=>{t.preventDefault(),p.current={x:t.clientX,y:t.clientY},m.current={...f.current},g.current=!0,_.current=!1,d(!0);let n=t=>{if(!g.current)return;let n=t.clientX-p.current.x,a=t.clientY-p.current.y;!_.current&&Math.hypot(n,a)>=r&&(_.current=!0),h.current===null&&(h.current=requestAnimationFrame(()=>{if(h.current=null,!g.current)return;let n=t.clientX-p.current.x,r=t.clientY-p.current.y,a={top:m.current.top+r,right:m.current.right-n},o=e.current;if(!o)return;let c=o.getBoundingClientRect(),u=i(a,c.width,c.height,s);l(u)}))},a=()=>{g.current=!1,d(!1),h.current!==null&&(cancelAnimationFrame(h.current),h.current=null),document.removeEventListener(`pointermove`,n),document.removeEventListener(`pointerup`,o),v.current=null},o=()=>a();document.addEventListener(`pointermove`,n),document.addEventListener(`pointerup`,o),v.current=a},[e,s]);return t.default.useEffect(()=>()=>{v.current?.()},[]),t.default.useEffect(()=>{let e=()=>y();return window.addEventListener(`resize`,e),()=>window.removeEventListener(`resize`,e)},[y]),t.default.useEffect(()=>{let e=requestAnimationFrame(()=>y());return()=>cancelAnimationFrame(e)},o),{position:c,isDragging:u,handlePointerDown:b,hasDraggedRef:_}}exports.clampPosition=i,exports.useDraggable=a;
+//# sourceMappingURL=useDraggable.js.map

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

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

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

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const _=require("@knocklabs/client"),p=require("@knocklabs/react-core"),S=require("react"),y=require("./helpers.js");function G(e){if(e&&typeof e=="object"&&"default"in e)return e;const t=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(e){for(const s in e)if(s!=="default"){const r=Object.getOwnPropertyDescriptor(e,s);Object.defineProperty(t,s,r.get?r:{enumerable:!0,get:()=>e[s]})}}return t.default=e,Object.freeze(t)}const h=G(S),T=e=>e.reduce((t,s)=>({...t,[s.key]:s}),{}),m=(e,t,s,r)=>{var u,i,o,a,l,f,n,d;const c=!!((a=(o=(i=(u=r.byKey)==null?void 0:u.one)==null?void 0:i.metadata)==null?void 0:o.opts)!=null&&a.includeThrottled)||!!((d=(n=(f=(l=r.byKey)==null?void 0:l.all)==null?void 0:f.metadata)==null?void 0:n.opts)!=null&&d.includeThrottled);return e.bypass_global_group_limit?"returned":e.key===s.resolved?t.throttled&&!c?"throttled":"returned":"queried"},R=(e,t,s,r)=>{var i,o,a,l;const c=!!((l=(a=(o=(i=r.byType)==null?void 0:i.one)==null?void 0:o.metadata)==null?void 0:a.opts)!=null&&l.includeThrottled),u=r.byType.one;if(u.size===0)return"queried";if(e.bypass_global_group_limit){const n=[...u.values()][0];return e.key!==n.key?"queried":"returned"}return e.key===s.resolved?t.throttled&&!c?"throttled":"returned":"queried"},O=(e,t,s,r)=>{var l,f,n,d;const c=r.byType.all;if(c.size===0)return"queried";const u=[...c.values()],i=u[0],o=T(u);return(d=(n=(f=(l=r.byType)==null?void 0:l.all)==null?void 0:f.metadata)==null?void 0:n.opts)!=null&&d.includeThrottled?o[e.key]?"returned":"queried":(i.bypass_global_group_limit||i.key===s.resolved)&&o[e.key]?t.throttled?e.bypass_global_group_limit?"returned":"throttled":"returned":"queried"},U=(e,t,s,r)=>{var c,u;if(r.byKey)return m(e,t,s,r);if((c=r.byType)!=null&&c.all)return O(e,t,s,r);if((u=r.byType)!=null&&u.one)return R(e,t,s,r)},q=(e,t,s)=>{if(!s||s.status==="open")return{status:void 0};const r={byKey:(s.results.byKey||{})[e.key],byType:(s.results.byType||{})[e.type]};if(!!!(r.byKey||r.byType))return{status:void 0};const u=U(e,t,s,r);return u?{status:u,query:r}:{status:void 0}},C=(e,t)=>{const s={};return((t==null?void 0:t.reason)==="not_in_target_audience"||(t==null?void 0:t.reason)==="target_conditions_not_met")&&(s.targetable={status:!1,reason:t.reason,message:t.message}),((t==null?void 0:t.reason)==="marked_as_archived"||(e.steps||[]).every(r=>!!r.message.archived_at))&&(s.archived={status:!0}),(t==null?void 0:t.reason)==="guide_not_active"&&(s.active={status:!1}),s},K=({active:e,targetable:t,archived:s})=>!(!e.status||!t.status||s.status),g=({activatable:e,selectable:t})=>!(!e.status||!t.status),j=(e,t,s,r)=>{const{ineligibleGuides:c,location:u}=s,i=c[e.key],o=C(e,i),a={active:(o==null?void 0:o.active)||{status:!0},targetable:(o==null?void 0:o.targetable)||{status:!0},archived:(o==null?void 0:o.archived)||{status:!1},activatable:{status:_.checkActivatable(e,u)},selectable:q(e,s,r)},l={...a,isEligible:K(a),isQualified:g(a)};return{...e,orderIndex:t,annotation:l}},w=(e,t)=>({__typename:"UncommittedGuide",key:e,orderIndex:t,active:!1,bypass_global_group_limit:!1,annotation:{isEligible:!1,isQualified:!1,active:{status:!1},selectable:{status:void 0}}}),I=e=>{var f;const{client:t}=p.useGuideContext(),s=p.useStore(t.store,n=>{const d=_.checkStateIfThrottled(n);return{location:n.location,guides:n.guides,guideGroups:n.guideGroups,ineligibleGuides:n.ineligibleGuides,debug:n.debug,counter:n.counter,queries:n.queries,throttled:d}}),r=h.useRef(void 0);if(!((f=s.debug)!=null&&f.debugging))return;const c=Object.entries(s.queries)[0];if(!c||c[1].status==="loading")return{status:"error",error:"no_guides_fetched",message:"Loading..."};const u=s.guideGroups[0];if(!u)return{status:"error",error:"no_guide_group",message:"No guide group found"};const i=t.getStage(),o=!i||i.status==="open";let a;o&&r.current?a=r.current:(a=u.display_sequence.map((n,d)=>{const b=s.guides[n];return b?j(b,d,s,i):w(n,d)}),o||(r.current=a));const l=Object.keys(e.focusedGuideKeys||{})[0];if((i==null?void 0:i.status)==="closed"&&l){const n=a.find(d=>d.key===l);if(!n)return{status:"error",error:"focus_unknown_guide",message:`Unable to display \`${l}\`, ${y.FOCUS_ERRORS.focusUnknownGuide.toLowerCase()}.`};if(v(n))return{status:"error",error:"focus_uncommitted_guide",message:`Unable to display \`${l}\`, ${y.FOCUS_ERRORS.focusUncommittedGuide.toLowerCase()}.`};if(!n.annotation.selectable.status)return{status:"error",error:"focus_unselectable_guide",message:`Unable to display \`${l}\`, ${y.FOCUS_ERRORS.focusUnselectableGuide.toLowerCase()}.`}}return{status:"ok",guides:a}},v=e=>typeof e=="object"&&e!==null&&"__typename"in e&&e.__typename==="UncommittedGuide";exports.isUncommittedGuide=v;exports.resolveIsQualified=g;exports.useInspectGuideClientStore=I;
-//# sourceMappingURL=useInspectGuideClientStore.js.map
+"use strict";const e=require("../../../../../_virtual/_rolldown/runtime.js"),t=require("./helpers.js");let n=require("@knocklabs/react-core"),r=require("react");r=e.__toESM(r);let i=require("@knocklabs/client");var a=e=>e.reduce((e,t)=>({...e,[t.key]:t}),{}),o=(e,t,n,r)=>{let i=!!r.byKey?.one?.metadata?.opts?.includeThrottled||!!r.byKey?.all?.metadata?.opts?.includeThrottled;return e.bypass_global_group_limit?`returned`:e.key===n.resolved?t.throttled&&!i?`throttled`:`returned`:`queried`},s=(e,t,n,r)=>{let i=!!r.byType?.one?.metadata?.opts?.includeThrottled,a=r.byType.one;if(a.size===0)return`queried`;if(e.bypass_global_group_limit){let t=[...a.values()][0];return e.key===t.key?`returned`:`queried`}return e.key===n.resolved?t.throttled&&!i?`throttled`:`returned`:`queried`},c=(e,t,n,r)=>{let i=r.byType.all;if(i.size===0)return`queried`;let o=[...i.values()],s=o[0],c=a(o);return r.byType?.all?.metadata?.opts?.includeThrottled?c[e.key]?`returned`:`queried`:(s.bypass_global_group_limit||s.key===n.resolved)&&c[e.key]?t.throttled?e.bypass_global_group_limit?`returned`:`throttled`:`returned`:`queried`},l=(e,t,n,r)=>{if(r.byKey)return o(e,t,n,r);if(r.byType?.all)return c(e,t,n,r);if(r.byType?.one)return s(e,t,n,r)},u=(e,t,n)=>{if(!n||n.status===`open`)return{status:void 0};let r={byKey:(n.results.byKey||{})[e.key],byType:(n.results.byType||{})[e.type]};if(!(r.byKey||r.byType))return{status:void 0};let i=l(e,t,n,r);return i?{status:i,query:r}:{status:void 0}},d=(e,t)=>{let n={};return(t?.reason===`not_in_target_audience`||t?.reason===`target_conditions_not_met`)&&(n.targetable={status:!1,reason:t.reason,message:t.message}),(t?.reason===`marked_as_archived`||(e.steps||[]).every(e=>!!e.message.archived_at))&&(n.archived={status:!0}),t?.reason===`guide_not_active`&&(n.active={status:!1}),n},f=({active:e,targetable:t,archived:n})=>!(!e.status||!t.status||n.status),p=({activatable:e,selectable:t})=>!(!e.status||!t.status),m=(e,t,n,r)=>{let{ineligibleGuides:a,location:o}=n,s=a[e.key],c=d(e,s),l={active:c?.active||{status:!0},targetable:c?.targetable||{status:!0},archived:c?.archived||{status:!1},activatable:{status:(0,i.checkActivatable)(e,o)},selectable:u(e,n,r)},m={...l,isEligible:f(l),isQualified:p(l)};return{...e,orderIndex:t,annotation:m}},h=(e,t)=>({__typename:`UncommittedGuide`,key:e,orderIndex:t,active:!1,bypass_global_group_limit:!1,annotation:{isEligible:!1,isQualified:!1,active:{status:!1},selectable:{status:void 0}}}),g=e=>{let{client:a}=(0,n.useGuideContext)(),o=(0,n.useStore)(a.store,e=>{let t=(0,i.checkStateIfThrottled)(e);return{location:e.location,guides:e.guides,guideGroups:e.guideGroups,ineligibleGuides:e.ineligibleGuides,debug:e.debug,counter:e.counter,queries:e.queries,throttled:t}}),s=r.useRef(void 0);if(!o.debug?.debugging)return;let c=Object.entries(o.queries)[0];if(!c||c[1].status===`loading`)return{status:`error`,error:`no_guides_fetched`,message:`Loading...`};let l=o.guideGroups[0];if(!l)return{status:`error`,error:`no_guide_group`,message:`No guide group found`};let u=a.getStage(),d=!u||u.status===`open`,f;d&&s.current?f=s.current:(f=l.display_sequence.map((e,t)=>{let n=o.guides[e];return n?m(n,t,o,u):h(e,t)}),d||(s.current=f));let p=Object.keys(e.focusedGuideKeys||{})[0];if(u?.status===`closed`&&p){let e=f.find(e=>e.key===p);if(!e)return{status:`error`,error:`focus_unknown_guide`,message:`Unable to display \`${p}\`, ${t.FOCUS_ERRORS.focusUnknownGuide.toLowerCase()}.`};if(_(e))return{status:`error`,error:`focus_uncommitted_guide`,message:`Unable to display \`${p}\`, ${t.FOCUS_ERRORS.focusUncommittedGuide.toLowerCase()}.`};if(!e.annotation.selectable.status)return{status:`error`,error:`focus_unselectable_guide`,message:`Unable to display \`${p}\`, ${t.FOCUS_ERRORS.focusUnselectableGuide.toLowerCase()}.`}}return{status:`ok`,guides:f}},_=e=>typeof e==`object`&&!!e&&`__typename`in e&&e.__typename===`UncommittedGuide`;exports.isUncommittedGuide=_,exports.resolveIsQualified=p,exports.useInspectGuideClientStore=g;
+//# sourceMappingURL=useInspectGuideClientStore.js.map

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  type ToolbarV2RunConfig,\n  checkActivatable,\n  checkStateIfThrottled,\n} from \"@knocklabs/client\";\nimport { useGuideContext, useStore } from \"@knocklabs/react-core\";\nimport * as React from \"react\";\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  byKey?: SelectionResultByLimit;\n  byType?: 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.byKey?.one?.metadata?.opts?.includeThrottled ||\n    !!query.byKey?.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 =\n    !!query.byType?.one?.metadata?.opts?.includeThrottled;\n\n  const result = query.byType!.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.byType!.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 =\n    !!query.byType?.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.byKey) {\n    return inferSelectByKeyReturnStatus(guide, snapshot, stage, query);\n  }\n\n  if (query.byType?.all) {\n    return inferSelectAllByTypeReturnStatus(guide, snapshot, stage, query);\n  }\n  if (query.byType?.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    byKey: (stage.results.byKey || {})[guide.key],\n    byType: (stage.results.byType || {})[guide.type],\n  };\n\n  const queried = Boolean(query.byKey || query.byType);\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  // Cache of the last settled orderedGuides, used to keep the toolbar stable\n  // while the group stage is transiently cleared or re-opening.\n  const orderedGuidesRef = React.useRef<\n    (AnnotatedGuide | UncommittedGuide)[] | undefined\n  >(undefined);\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  // The stage is transient while it is undefined (just cleared) or \"open\"\n  // (new stage with empty results); during these windows the computed\n  // selectable status collapses to undefined for every guide. \"closed\" and\n  // \"patch\" both preserve results, so we treat them as settled.\n  const isTransient = !groupStage || groupStage.status === \"open\";\n\n  // Annotate guides for various eligibility, activation and query statuses\n  // that are useful for debugging purposes. Serve the last settled result\n  // during transient windows to avoid flashing status dots.\n  let orderedGuides: (AnnotatedGuide | UncommittedGuide)[];\n  if (isTransient && orderedGuidesRef.current) {\n    orderedGuides = orderedGuidesRef.current;\n  } else {\n    orderedGuides = defaultGroup.display_sequence.map((guideKey, index) => {\n      const guide = snapshot.guides[guideKey];\n      if (!guide) {\n        return newUncommittedGuide(guideKey, index);\n      }\n      return annotateGuide(guide, index, snapshot, groupStage);\n    });\n\n    if (!isTransient) {\n      orderedGuidesRef.current = orderedGuides;\n    }\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","byType","result","size","first","values","inferSelectAllByTypeReturnStatus","guides","guidesByKey","inferSelectReturnStatus","toSelectableStatus","status","undefined","results","type","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","orderedGuidesRef","React","useRef","debugging","req","Object","entries","error","defaultGroup","groupStage","getStage","isTransient","orderedGuides","current","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","names":[],"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\";\nimport * as React from \"react\";\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  byKey?: SelectionResultByLimit;\n  byType?: 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.byKey?.one?.metadata?.opts?.includeThrottled ||\n    !!query.byKey?.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 =\n    !!query.byType?.one?.metadata?.opts?.includeThrottled;\n\n  const result = query.byType!.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.byType!.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 =\n    !!query.byType?.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.byKey) {\n    return inferSelectByKeyReturnStatus(guide, snapshot, stage, query);\n  }\n\n  if (query.byType?.all) {\n    return inferSelectAllByTypeReturnStatus(guide, snapshot, stage, query);\n  }\n  if (query.byType?.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    byKey: (stage.results.byKey || {})[guide.key],\n    byType: (stage.results.byType || {})[guide.type],\n  };\n\n  const queried = Boolean(query.byKey || query.byType);\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  // Cache of the last settled orderedGuides, used to keep the toolbar stable\n  // while the group stage is transiently cleared or re-opening.\n  const orderedGuidesRef = React.useRef<\n    (AnnotatedGuide | UncommittedGuide)[] | undefined\n  >(undefined);\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  // The stage is transient while it is undefined (just cleared) or \"open\"\n  // (new stage with empty results); during these windows the computed\n  // selectable status collapses to undefined for every guide. \"closed\" and\n  // \"patch\" both preserve results, so we treat them as settled.\n  const isTransient = !groupStage || groupStage.status === \"open\";\n\n  // Annotate guides for various eligibility, activation and query statuses\n  // that are useful for debugging purposes. Serve the last settled result\n  // during transient windows to avoid flashing status dots.\n  let orderedGuides: (AnnotatedGuide | UncommittedGuide)[];\n  if (isTransient && orderedGuidesRef.current) {\n    orderedGuides = orderedGuidesRef.current;\n  } else {\n    orderedGuides = defaultGroup.display_sequence.map((guideKey, index) => {\n      const guide = snapshot.guides[guideKey];\n      if (!guide) {\n        return newUncommittedGuide(guideKey, index);\n      }\n      return annotateGuide(guide, index, snapshot, groupStage);\n    });\n\n    if (!isTransient) {\n      orderedGuidesRef.current = orderedGuides;\n    }\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"],"mappings":"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"}

package/dist/cjs/modules/guide/components/Toolbar/index.js

@@ -0,0 +1 @@
+"use strict";const e=require("./V2/V2.js");require("./V2/index.js"),exports.ToolbarV2=e.V2;

package/dist/cjs/modules/guide/components/Toolbar/shared.js

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t="var(--tgph-zIndex-tooltip)";exports.TOOLBAR_Z_INDEX=t;
-//# sourceMappingURL=shared.js.map
+"use strict";var e=`var(--tgph-zIndex-tooltip)`;exports.TOOLBAR_Z_INDEX=e;
+//# sourceMappingURL=shared.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"shared.js","sources":["../../../../../../src/modules/guide/components/Toolbar/shared.ts"],"sourcesContent":["// Match the hardcoded z-index value in the telegraph tooltip package for now\n// to ensure everything within a toolbar is visible.\nexport const TOOLBAR_Z_INDEX = \"var(--tgph-zIndex-tooltip)\";\n"],"names":["TOOLBAR_Z_INDEX"],"mappings":"gFAEO,MAAMA,EAAkB"}
+{"version":3,"file":"shared.js","names":[],"sources":["../../../../../../src/modules/guide/components/Toolbar/shared.ts"],"sourcesContent":["// Match the hardcoded z-index value in the telegraph tooltip package for now\n// to ensure everything within a toolbar is visible.\nexport const TOOLBAR_Z_INDEX = \"var(--tgph-zIndex-tooltip)\";\n"],"mappings":"aAEA,IAAa,EAAkB"}

package/dist/cjs/modules/guide/components/Toolbar/styles.inline.js

@@ -0,0 +1,2 @@
+"use strict";var e=`@keyframes toolbar-collapse-fade-in{0%{opacity:0;transform:scale(.8)}to{opacity:1;transform:scale(1)}}@keyframes toolbar-expand-fade-in{0%{opacity:0;transform:scale(.95)}to{opacity:1;transform:scale(1)}}.tgph-button{--tgph-button-text-color:none;appearance:none;cursor:pointer;box-sizing:border-box;font-family:inherit;text-decoration:none;transition:background-color .2s ease-in-out,color .2s ease-in-out,box-shadow .2s ease-in-out}.tgph-button [data-button-text],.tgph-button [data-button-icon]{transition:color .2s ease-in-out}.tgph-button:not([data-tgph-button-state=disabled]):hover [data-button-text],.tgph-button:not([data-tgph-button-state=disabled]):hover [data-button-icon]{--color:var(--hover--tgph-button-text-color,var(--tgph-button-text-color))!important}.tgph-button[data-tgph-button-state=active]{box-shadow:var(--active--box-shadow,var(--box-shadow));background-color:var(--active--background-color,var(--background-color))}.tgph-button[data-tgph-button-state=disabled][data-tgph-button-variant=solid],.tgph-button[data-tgph-button-state=disabled][data-tgph-button-variant=soft],.tgph-button[data-tgph-button-state=disabled][data-tgph-button-variant=outline]{background-color:var(--tgph-gray-3)}.tgph-button[data-tgph-button-state=disabled][data-tgph-button-variant=ghost]{background-color:var(--tgph-transparent)}.tgph-button:disabled{cursor:not-allowed}.tgph-button[data-tgph-button-state=disabled]:hover{background-color:revert}.tgph-icon{display:inline-block}.tgph-icon[data-tgph-icon-animation=spin]{animation:1s linear infinite tgph-icon-spin}@keyframes tgph-icon-spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.tgph-box{--background-color:none;--border-color:var(--tgph-gray-5);--box-shadow:none;--border-style:solid;--border-width:0;--padding:0;--margin:0;--border-radius:0;--width:auto;--max-width:auto;--min-width:auto;--height:auto;--max-height:auto;--min-height:auto;--z-index:auto;--position:static;--top:auto;--left:auto;--right:auto;--bottom:auto;--overflow:visible visible;--align-self:auto;--direction:row;background-color:var(--background-color);border-width:var(--border-width);border-style:var(--border-style);border-color:var(--border-color);box-shadow:var(--box-shadow);padding:var(--padding);margin:var(--margin);border-radius:var(--border-radius);width:var(--width);max-width:var(--max-width);min-width:var(--min-width);height:var(--height);max-height:var(--max-height);min-height:var(--min-height);z-index:var(--z-index);position:var(--position);top:var(--top);left:var(--left);right:var(--right);bottom:var(--bottom);overflow:var(--overflow);align-self:var(--align-self);flex-direction:var(--direction)}.tgph-box--interactive:hover{background-color:var(--hover--background-color,var(--background-color));border-width:var(--hover--border-width,var(--border-width));border-style:var(--hover--border-style,var(--border-style));border-color:var(--hover--border-color,var(--border-color));box-shadow:var(--hover--box-shadow,var(--box-shadow));padding:var(--hover--padding,var(--padding));margin:var(--hover--margin,var(--margin));border-radius:var(--hover--border-radius,var(--border-radius));width:var(--hover--width,var(--width));max-width:var(--hover--max-width,var(--max-width));min-width:var(--hover--min-width,var(--min-width));height:var(--hover--height,var(--height));max-height:var(--hover--max-height,var(--max-height));min-height:var(--hover--min-height,var(--min-height));z-index:var(--hover--z-index,var(--z-index));position:var(--hover--position,var(--position));top:var(--hover--top,var(--top));left:var(--hover--left,var(--left));right:var(--hover--right,var(--right));bottom:var(--hover--bottom,var(--bottom));overflow:var(--hover--overflow,var(--overflow));align-self:var(--hover--align-self,var(--align-self));flex-direction:var(--hover--direction,var(--direction))}.tgph-box--interactive:focus-visible{background-color:var(--focus--background-color,var(--background-color));border-width:var(--focus--border-width,var(--border-width));border-style:var(--focus--border-style,var(--border-style));border-color:var(--focus--border-color,var(--border-color));box-shadow:var(--focus--box-shadow,var(--box-shadow));padding:var(--focus--padding,var(--padding));margin:var(--focus--margin,var(--margin));border-radius:var(--focus--border-radius,var(--border-radius));width:var(--focus--width,var(--width));max-width:var(--focus--max-width,var(--max-width));min-width:var(--focus--min-width,var(--min-width));height:var(--focus--height,var(--height));max-height:var(--focus--max-height,var(--max-height));min-height:var(--focus--min-height,var(--min-height));z-index:var(--focus--z-index,var(--z-index));position:var(--focus--position,var(--position));top:var(--focus--top,var(--top));left:var(--focus--left,var(--left));right:var(--focus--right,var(--right));bottom:var(--focus--bottom,var(--bottom));overflow:var(--focus--overflow,var(--overflow));align-self:var(--focus--align-self,var(--align-self));flex-direction:var(--focus--direction,var(--direction))}.tgph-box--interactive:active{background-color:var(--active--background-color,var(--background-color));border-width:var(--active--border-width,var(--border-width));border-style:var(--active--border-style,var(--border-style));border-color:var(--active--border-color,var(--border-color));box-shadow:var(--active--box-shadow,var(--box-shadow));padding:var(--active--padding,var(--padding));margin:var(--active--margin,var(--margin));border-radius:var(--active--border-radius,var(--border-radius));width:var(--active--width,var(--width));max-width:var(--active--max-width,var(--max-width));min-width:var(--active--min-width,var(--min-width));height:var(--active--height,var(--height));max-height:var(--active--max-height,var(--max-height));min-height:var(--active--min-height,var(--min-height));z-index:var(--active--z-index,var(--z-index));position:var(--active--position,var(--position));top:var(--active--top,var(--top));left:var(--active--left,var(--left));right:var(--active--right,var(--right));bottom:var(--active--bottom,var(--bottom));overflow:var(--active--overflow,var(--overflow));align-self:var(--active--align-self,var(--align-self));flex-direction:var(--active--direction,var(--direction))}.tgph-box--interactive:has(:focus-within){background-color:var(--focus-within--background-color,var(--background-color));border-width:var(--focus-within--border-width,var(--border-width));border-style:var(--focus-within--border-style,var(--border-style));border-color:var(--focus-within--border-color,var(--border-color));box-shadow:var(--focus-within--box-shadow,var(--box-shadow));padding:var(--focus-within--padding,var(--padding));margin:var(--focus-within--margin,var(--margin));border-radius:var(--focus-within--border-radius,var(--border-radius));width:var(--focus-within--width,var(--width));max-width:var(--focus-within--max-width,var(--max-width));min-width:var(--focus-within--min-width,var(--min-width));height:var(--focus-within--height,var(--height));max-height:var(--focus-within--max-height,var(--max-height));min-height:var(--focus-within--min-height,var(--min-height));z-index:var(--focus-within--z-index,var(--z-index));position:var(--focus-within--position,var(--position));top:var(--focus-within--top,var(--top));left:var(--focus-within--left,var(--left));right:var(--focus-within--right,var(--right));bottom:var(--focus-within--bottom,var(--bottom));overflow:var(--focus-within--overflow,var(--overflow));align-self:var(--focus-within--align-self,var(--align-self));flex-direction:var(--focus-within--direction,var(--direction))}.tgph-box--interactive:disabled,.tgph-box--interactive[aria-disabled=true]{background-color:var(--disabled--background-color,var(--background-color));border-width:var(--disabled--border-width,var(--border-width));border-style:var(--disabled--border-style,var(--border-style));border-color:var(--disabled--border-color,var(--border-color));box-shadow:var(--disabled--box-shadow,var(--box-shadow));padding:var(--disabled--padding,var(--padding));margin:var(--disabled--margin,var(--margin));border-radius:var(--disabled--border-radius,var(--border-radius));width:var(--disabled--width,var(--width));max-width:var(--disabled--max-width,var(--max-width));min-width:var(--disabled--min-width,var(--min-width));height:var(--disabled--height,var(--height));max-height:var(--disabled--max-height,var(--max-height));min-height:var(--disabled--min-height,var(--min-height));z-index:var(--disabled--z-index,var(--z-index));position:var(--disabled--position,var(--position));top:var(--disabled--top,var(--top));left:var(--disabled--left,var(--left));right:var(--disabled--right,var(--right));bottom:var(--disabled--bottom,var(--bottom));overflow:var(--disabled--overflow,var(--overflow));align-self:var(--disabled--align-self,var(--align-self));flex-direction:var(--disabled--direction,var(--direction))}.tgph-stack{--display:flex;--direction:row;--wrap:nowrap;--justify:flex-start;--align:stretch;--gap:0;display:var(--display);flex-direction:var(--direction);flex-wrap:var(--wrap);justify-content:var(--justify);align-items:var(--align);gap:var(--gap)}[data-tgph-toggle-switch]{cursor:pointer;flex-shrink:0;transition:background-color .18s cubic-bezier(.16,1,.3,1);position:relative}:has([data-tgph-toggle-input]:focus-visible) [data-tgph-toggle-switch]{outline:2px solid var(--tgph-blue-8);outline-offset:2px}[data-tgph-toggle-icon]{transition:transform .18s cubic-bezier(.16,1,.3,1)}[data-tgph-toggle-switch][data-tgph-toggle-checked=true] [data-tgph-toggle-icon]{transform:translateX(calc(100% - var(--tgph-spacing-0_5)))}[data-tgph-toggle-label]{cursor:pointer;-webkit-user-select:none;user-select:none}[data-tgph-toggle-label][data-tgph-toggle-disabled=true]{cursor:not-allowed;color:var(--tgph-gray-9)}[data-tgph-toggle-switch][data-tgph-toggle-checked=false]{background-color:var(--tgph-gray-7)!important}[data-tgph-toggle-switch][data-tgph-toggle-checked=true][data-tgph-button-state=disabled]{background-color:var(--background-color)!important}[data-tgph-toggle-switch][data-tgph-button-state=disabled]{opacity:.5}.tgph-text,.tgph-heading,.tgph-code{--color:var(--tgph-gray-12);--font-size:var(--tgph-text-2);--weight:var(--tgph-weight-regular);--leading:var(--tgph-leading-2);--tracking:var(--tgph-tracking-2);--text-align:left;--font-family:var(--tgph-family-sans);--text-overflow:clip;color:var(--color);font-size:var(--font-size);font-weight:var(--weight);line-height:var(--leading);letter-spacing:var(--tracking);text-align:var(--text-align);box-sizing:border-box;font-family:var(--font-family);text-overflow:var(--text-overflow)}[data-tgph-input-container]{box-sizing:border-box}[data-tgph-input-slot]{box-sizing:border-box;order:2}[data-tgph-input-slot]>[data-tgph-button]{width:var(--tgph-spacing-full);height:var(--tgph-spacing-auto)}[data-tgph-input-slot]>[data-tgph-button-layout=icon-only]{aspect-ratio:1;padding:var(--tgph-spacing-0)}[data-tgph-input-slot]>[data-tgph-button-layout=default]{padding:var(--tgph-spacing-2)}[data-tgph-input-slot]:has([data-tgph-button-layout=icon-only]){aspect-ratio:1}[data-tgph-input-slot]:has([data-tgph-button-layout=icon-only]){padding:var(--tgph-spacing-1)!important}[data-tgph-input-slot-position=leading]{order:1}[data-tgph-input-slot-position=trailing]{order:3}[data-tgph-input-slot-size="1"]>[data-tgph-button],[data-tgph-input-slot-size="2"]>[data-tgph-button]{border-radius:var(--tgph-rounded-1)}[data-tgph-input-slot-size="3"]>[data-tgph-button]{border-radius:var(--tgph-rounded-2)}[data-tgph-input-container-state=disabled]{cursor:not-allowed}[data-tgph-input-field]{appearance:none;box-shadow:none;border:none;outline:none;order:2;font-family:inherit}[data-tgph-menu-button]:focus-visible,[data-tgph-menu-content]:focus,[data-tgph-menu-content]:focus-visible{outline:none}[data-tgph-menu-button][data-state=open]{background-color:var(--hover--background-color,var(--background-color))}[data-tgph-truncate]{--tgph-truncate-line-height:1lh;--tgph-truncate-marker-bg:var(--tgph-surface-1,#fff);--tgph-truncate-marker-fade-width:2px;--tgph-truncate-marker-gap:0px;--tgph-truncate-marker-color:color-mix(in srgb, currentColor var(--tgph-truncate-marker-opacity,50%), transparent);height:var(--tgph-truncate-line-height);min-width:0;overflow:hidden}[data-tgph-truncate-grid]{display:grid;position:relative}[data-tgph-truncate-content=visible]{white-space:nowrap}[data-tgph-truncate-content=overflow]{opacity:0;pointer-events:none;-webkit-user-select:none;user-select:none;word-break:break-all;margin-top:calc(-1 * var(--tgph-truncate-line-height))}[data-tgph-truncate-marker-cell]{-webkit-user-select:none;user-select:none;pointer-events:none;overflow:visible;container:tgph-measure/size}[data-tgph-truncate-marker]{z-index:1;height:var(--tgph-truncate-line-height);background-color:var(--tgph-truncate-marker-bg);color:var(--tgph-truncate-marker-color);opacity:0;align-items:center;transition:opacity .12s ease-in-out;display:flex;position:absolute;top:0}@container tgph-measure (height>1lh){[data-tgph-truncate-marker]{opacity:1}}[data-tgph-truncate=truncate] [data-tgph-truncate-grid]{grid-template-columns:minmax(0,max-content) 0}[data-tgph-truncate=truncate] [data-tgph-truncate-marker]{right:0}[data-tgph-truncate=fruncate] [data-tgph-truncate-grid]{grid-template-columns:0 minmax(0,max-content) auto}[data-tgph-truncate=fruncate] [data-tgph-truncate-content]{direction:rtl}[data-tgph-truncate=fruncate] [data-tgph-truncate-content]>span{unicode-bidi:plaintext}[data-tgph-truncate=fruncate] [data-tgph-truncate-marker]{left:0}[data-tgph-truncate=truncate][data-tgph-truncate-variant=default] [data-tgph-truncate-marker]:before,[data-tgph-truncate=fruncate][data-tgph-truncate-variant=default] [data-tgph-truncate-marker]:after{content:"";height:var(--tgph-truncate-line-height);width:calc(var(--tgph-truncate-marker-fade-width) + var(--tgph-truncate-marker-gap));background-color:var(--tgph-truncate-marker-bg);-webkit-mask-image:linear-gradient(var(--tgph-truncate-fade-dir), #000 0%, #000 var(--tgph-truncate-marker-gap), transparent 100%);-webkit-mask-image:linear-gradient(var(--tgph-truncate-fade-dir), #000 0%, #000 var(--tgph-truncate-marker-gap), transparent 100%);-webkit-mask-image:linear-gradient(var(--tgph-truncate-fade-dir), #000 0%, #000 var(--tgph-truncate-marker-gap), transparent 100%);mask-image:linear-gradient(var(--tgph-truncate-fade-dir), #000 0%, #000 var(--tgph-truncate-marker-gap), transparent 100%);position:absolute;top:0}[data-tgph-truncate=truncate][data-tgph-truncate-variant=default] [data-tgph-truncate-marker]:before{--tgph-truncate-fade-dir:to left;right:100%}[data-tgph-truncate=fruncate][data-tgph-truncate-variant=default] [data-tgph-truncate-marker]:after{--tgph-truncate-fade-dir:to right;left:100%}[data-tgph-truncate-group=middle]{--tgph-truncate-marker-opacity:var(--tgph-truncate-middle-marker-opacity,80%);min-width:0;display:flex}[data-tgph-truncate-group=middle]>[data-tgph-truncate-segment]{min-width:0}[data-tgph-truncate-priority=end]>[data-tgph-truncate-segment=head]{flex:0 auto}[data-tgph-truncate-priority=end]>[data-tgph-truncate-segment=tail],[data-tgph-truncate-priority=start]>[data-tgph-truncate-segment=head]{flex:none;max-width:100%}[data-tgph-truncate-priority=start]>[data-tgph-truncate-segment=tail]{flex:0 auto}[data-tgph-truncate-variant=fade] [data-tgph-truncate-marker]{color:#0000;background-color:#0000;width:2.5rem;padding:0}[data-tgph-truncate-variant=fade] [data-tgph-truncate-marker]:before{content:"";position:absolute;inset:0}[data-tgph-truncate=truncate][data-tgph-truncate-variant=fade] [data-tgph-truncate-marker]:before{background:linear-gradient(to right, transparent, var(--tgph-truncate-marker-bg) 90%)}[data-tgph-truncate=fruncate][data-tgph-truncate-variant=fade] [data-tgph-truncate-marker]:before{background:linear-gradient(to left, transparent, var(--tgph-truncate-marker-bg) 90%)}:root{--tgph-border-style-solid:solid;--tgph-border-style-dashed:dashed;--tgph-transparent:transparent;--tgph-white:#fff;--tgph-black:#000;--tgph-alpha-white-1:#ffffff0d;--tgph-alpha-white-2:#ffffff1a;--tgph-alpha-white-3:#ffffff26;--tgph-alpha-white-4:#fff3;--tgph-alpha-white-5:#ffffff4d;--tgph-alpha-white-6:#fff6;--tgph-alpha-white-7:#ffffff80;--tgph-alpha-white-8:#fff9;--tgph-alpha-white-9:#ffffffb3;--tgph-alpha-white-10:#fffc;--tgph-alpha-white-11:#ffffffe6;--tgph-alpha-white-12:#fffffff2;--tgph-alpha-black-1:#0000000d;--tgph-alpha-black-2:#0000001a;--tgph-alpha-black-3:#00000026;--tgph-alpha-black-4:#0003;--tgph-alpha-black-5:#0000004d;--tgph-alpha-black-6:#0006;--tgph-alpha-black-7:#00000080;--tgph-alpha-black-8:#0009;--tgph-alpha-black-9:#000000b3;--tgph-alpha-black-10:#000c;--tgph-alpha-black-11:#000000e6;--tgph-alpha-black-12:#000000f2;--tgph-rounded-0:0px;--tgph-rounded-1:.125rem;--tgph-rounded-2:.25rem;--tgph-rounded-3:.375rem;--tgph-rounded-4:.5rem;--tgph-rounded-5:.75rem;--tgph-rounded-6:1rem;--tgph-rounded-full:9999px;--tgph-shadow-0:0px 0px 0px 0px #0000;--tgph-shadow-1:0px 0px 0px 1px #0000000f, inset 0px 0px 0px 1px #ffffff14, inset 0px 1px 0px 0px #ffffff0f, inset 0px -1px 0px 0px #ffffff05, 0px 1px 2px 0px #00000008;--tgph-shadow-2:0px 0px 0px 1px #0000000f, inset 0px 0px 0px 1px #ffffff1a, inset 0px 1px 0px 0px #ffffff14, inset 0px -1px 0px 0px #ffffff05, 0px 1px 2px 0px #0000000a, 0px 4px 8px -2px #0000000d;--tgph-shadow-3:0px 0px 0px 1px #0000000f, inset 0px 0px 0px 1px #ffffff1f, inset 0px 1px 0px 0px #ffffff17, inset 0px -1px 0px 0px #ffffff08, 0px 1px 1px 0px #0000000a, 0px 4px 6px -1px #0000000d, 0px 8px 16px -4px #0000000f;--tgph-shadow-inner:0px 5px 2px 0px #1c202403 inset, 0px 3px 2px 0px #1c202408 inset, 0px 1px 1px 0px #1c20240d inset, 0px 0px 1px 0px #1c20240f inset;--tgph-spacing-0:0px;--tgph-spacing-1:.25rem;--tgph-spacing-2:.5rem;--tgph-spacing-3:.75rem;--tgph-spacing-4:1rem;--tgph-spacing-5:1.25rem;--tgph-spacing-6:1.5rem;--tgph-spacing-7:1.75rem;--tgph-spacing-8:2rem;--tgph-spacing-9:2.25rem;--tgph-spacing-10:2.5rem;--tgph-spacing-11:2.75rem;--tgph-spacing-12:3rem;--tgph-spacing-14:3.5rem;--tgph-spacing-16:4rem;--tgph-spacing-20:5rem;--tgph-spacing-24:6rem;--tgph-spacing-28:7rem;--tgph-spacing-32:8rem;--tgph-spacing-36:9rem;--tgph-spacing-40:10rem;--tgph-spacing-44:11rem;--tgph-spacing-48:12rem;--tgph-spacing-52:13rem;--tgph-spacing-56:14rem;--tgph-spacing-60:15rem;--tgph-spacing-64:16rem;--tgph-spacing-72:18rem;--tgph-spacing-80:20rem;--tgph-spacing-96:24rem;--tgph-spacing-120:30rem;--tgph-spacing-140:35rem;--tgph-spacing-160:40rem;--tgph-spacing-px:1px;--tgph-spacing-0_5:.125rem;--tgph-spacing-1_5:.375rem;--tgph-spacing-2_5:.625rem;--tgph-spacing-3_5:.875rem;--tgph-spacing-full:100%;--tgph-spacing-auto:auto;--tgph-family-sans:Inter, -apple-system, BlinkMacSystemFont, avenir next, avenir, segoe ui, helvetica neue, helvetica, Cantarell, Ubuntu, roboto, noto, arial, sans-serif;--tgph-family-mono:Menlo, Consolas, Monaco, Liberation Mono, Lucida Console, monospace;--tgph-leading-0:1rem;--tgph-leading-1:1rem;--tgph-leading-2:1.25rem;--tgph-leading-3:1.5rem;--tgph-leading-4:1.5rem;--tgph-leading-5:1.75rem;--tgph-leading-6:2rem;--tgph-leading-7:2.25rem;--tgph-leading-8:2.5rem;--tgph-leading-9:3.5rem;--tgph-leading-code-0:1rem;--tgph-leading-code-1:1rem;--tgph-leading-code-2:1.25rem;--tgph-leading-code-3:1.5rem;--tgph-leading-code-4:1.75rem;--tgph-leading-code-5:1.75rem;--tgph-leading-code-6:2rem;--tgph-leading-code-7:2.25rem;--tgph-leading-code-8:2.5rem;--tgph-leading-code-9:3rem;--tgph-tracking-0:0.25%;--tgph-tracking-1:0.25%;--tgph-tracking-2:0;--tgph-tracking-3:0;--tgph-tracking-4:-0.25%;--tgph-tracking-5:-0.5%;--tgph-tracking-6:-0.625%;--tgph-tracking-7:-0.75%;--tgph-tracking-8:-1%;--tgph-tracking-9:-2.5%;--tgph-text-0:.6875rem;--tgph-text-1:.75rem;--tgph-text-2:.8125rem;--tgph-text-3:.9375rem;--tgph-text-4:1.125rem;--tgph-text-5:1.25rem;--tgph-text-6:1.5rem;--tgph-text-7:1.875rem;--tgph-text-8:2.25rem;--tgph-text-9:3rem;--tgph-text-code-0:.625rem;--tgph-text-code-1:.688rem;--tgph-text-code-2:.812rem;--tgph-text-code-4:1.062rem;--tgph-text-code-5:1.188rem;--tgph-text-code-6:1.438rem;--tgph-text-code-7:1.75rem;--tgph-text-code-8:2.125rem;--tgph-text-code-9:2.875rem;--tgph-weight-regular:400;--tgph-weight-medium:500;--tgph-weight-semi-bold:600;--tgph-breakpoint-sm:640px;--tgph-breakpoint-md:768px;--tgph-breakpoint-lg:1024px;--tgph-breakpoint-xl:1280px;--tgph-breakpoint-2xl:1536px;--tgph-zIndex-hidden:-1;--tgph-zIndex-base:0;--tgph-zIndex-auto:auto;--tgph-zIndex-dropdown:1000;--tgph-zIndex-sticky:1100;--tgph-zIndex-banner:1200;--tgph-zIndex-overlay:1300;--tgph-zIndex-modal:1400;--tgph-zIndex-popover:1500;--tgph-zIndex-skipLink:1600;--tgph-zIndex-toast:1700;--tgph-zIndex-tooltip:1800;--tgph-surface-1:#fff;--tgph-surface-2:#fdfdfc;--tgph-surface-3:#fff;--tgph-gray-1:#fcfcfd;--tgph-gray-2:#f9f9fb;--tgph-gray-3:#eff0f3;--tgph-gray-4:#e6e8eb;--tgph-gray-5:#dfe2e5;--tgph-gray-6:#d7dadf;--tgph-gray-7:#cbcfd5;--tgph-gray-8:#b6bcc4;--tgph-gray-9:#888e95;--tgph-gray-10:#7e848a;--tgph-gray-11:#60646a;--tgph-gray-12:#1d2023;--tgph-beige-1:#fdfdfc;--tgph-beige-2:#f9f9f8;--tgph-beige-3:#f0f0ef;--tgph-beige-4:#e9e8e7;--tgph-beige-5:#e2e1df;--tgph-beige-6:#dad9d7;--tgph-beige-7:#cfcecc;--tgph-beige-8:#bcbbb8;--tgph-beige-9:#8e8c8a;--tgph-beige-10:#83827f;--tgph-beige-11:#646360;--tgph-beige-12:#21201e;--tgph-accent-1:#fffcfb;--tgph-accent-2:#fff5f2;--tgph-accent-3:#ffe9e2;--tgph-accent-4:#ffd6cb;--tgph-accent-5:#ffc8ba;--tgph-accent-6:#ffb7a6;--tgph-accent-7:#ffa28f;--tgph-accent-8:#f88872;--tgph-accent-9:#ff573a;--tgph-accent-10:#f2472a;--tgph-accent-11:#db3619;--tgph-accent-12:#5c291f;--tgph-green-1:#fbfefc;--tgph-green-2:#f4fbf7;--tgph-green-3:#e4f7ec;--tgph-green-4:#d3f1e0;--tgph-green-5:#bfead2;--tgph-green-6:#a7dfc1;--tgph-green-7:#86d0aa;--tgph-green-8:#4fba8a;--tgph-green-9:#00aa72;--tgph-green-10:#009c68;--tgph-green-11:#00834f;--tgph-green-12:#183b2b;--tgph-yellow-1:#fefdfb;--tgph-yellow-2:#fefbe9;--tgph-yellow-3:#fff7c2;--tgph-yellow-4:#ffee9c;--tgph-yellow-5:#fbe577;--tgph-yellow-6:#f3d673;--tgph-yellow-7:#e9c162;--tgph-yellow-8:#f3d673;--tgph-yellow-9:#ffc53d;--tgph-yellow-10:#ffba18;--tgph-yellow-11:#ab6400;--tgph-yellow-12:#4f3422;--tgph-blue-1:#fcfdff;--tgph-blue-2:#f6f9ff;--tgph-blue-3:#ebf2ff;--tgph-blue-4:#deebff;--tgph-blue-5:#cee0ff;--tgph-blue-6:#bbd3ff;--tgph-blue-7:#a3c1fb;--tgph-blue-8:#81a8f6;--tgph-blue-9:#4a82ff;--tgph-blue-10:#4276ec;--tgph-blue-11:#3569e0;--tgph-blue-12:#193065;--tgph-red-1:#fffcfc;--tgph-red-2:#fff7f7;--tgph-red-3:#ffe9e9;--tgph-red-4:#ffdadb;--tgph-red-5:#ffcbcd;--tgph-red-6:#ffbbbe;--tgph-red-7:#faa7ab;--tgph-red-8:#f28b92;--tgph-red-9:#e9004a;--tgph-red-10:#d9003d;--tgph-red-11:#d9003e;--tgph-red-12:#6c041f;--tgph-purple-1:#fcfcff;--tgph-purple-2:#f8f8ff;--tgph-purple-3:#f1f1ff;--tgph-purple-4:#e6e6ff;--tgph-purple-5:#dadaff;--tgph-purple-6:#cccbff;--tgph-purple-7:#b9b6ff;--tgph-purple-8:#9f99fc;--tgph-purple-9:#6547de;--tgph-purple-10:#583dc4;--tgph-purple-11:#6148d0;--tgph-purple-12:#2e2269}[data-tgph-appearance=dark]{--tgph-surface-1:#18191b;--tgph-surface-2:#101112;--tgph-surface-3:#101112;--tgph-gray-1:#101112;--tgph-gray-2:#18191b;--tgph-gray-3:#212325;--tgph-gray-4:#282a2d;--tgph-gray-5:#2f3235;--tgph-gray-6:#383b3e;--tgph-gray-7:#45484d;--tgph-gray-8:#5c6268;--tgph-gray-9:#6a6f76;--tgph-gray-10:#777d84;--tgph-gray-11:#afb5bb;--tgph-gray-12:#edeeef;--tgph-beige-1:#12110f;--tgph-beige-2:#191817;--tgph-beige-3:#232220;--tgph-beige-4:#2a2927;--tgph-beige-5:#31302e;--tgph-beige-6:#3b3937;--tgph-beige-7:#484745;--tgph-beige-8:#61605d;--tgph-beige-9:#6e6d6a;--tgph-beige-10:#7c7a78;--tgph-beige-11:#b4b3b0;--tgph-beige-12:#eeedeb;--tgph-accent-1:#160f0d;--tgph-accent-2:#201412;--tgph-accent-3:#3b140d;--tgph-accent-4:#530e04;--tgph-accent-5:#631507;--tgph-accent-6:#742315;--tgph-accent-7:#8d3323;--tgph-accent-8:#b5432f;--tgph-accent-9:#ff573a;--tgph-accent-10:#f1492d;--tgph-accent-11:#ff917a;--tgph-accent-12:#ffd1c7;--tgph-green-1:#0c130f;--tgph-green-2:#111b16;--tgph-green-3:#112d20;--tgph-green-4:#0c3c28;--tgph-green-5:#104a32;--tgph-green-6:#18583d;--tgph-green-7:#1e6949;--tgph-green-8:#217d57;--tgph-green-9:#00aa72;--tgph-green-10:#009d66;--tgph-green-11:#4dd399;--tgph-green-12:#aaf3cc;--tgph-yellow-1:#16120c;--tgph-yellow-2:#1d180f;--tgph-yellow-3:#302008;--tgph-yellow-4:#3f2700;--tgph-yellow-5:#4d3000;--tgph-yellow-6:#5c3d05;--tgph-yellow-7:#714f19;--tgph-yellow-8:#8f6424;--tgph-yellow-9:#ffc53d;--tgph-yellow-10:#ffd60a;--tgph-yellow-11:#ffca16;--tgph-yellow-12:#ffe7b3;--tgph-blue-1:#0b111c;--tgph-blue-2:#111826;--tgph-blue-3:#152548;--tgph-blue-4:#172e63;--tgph-blue-5:#1f3a76;--tgph-blue-6:#294787;--tgph-blue-7:#35569d;--tgph-blue-8:#3f66bb;--tgph-blue-9:#4a82ff;--tgph-blue-10:#3e75f1;--tgph-blue-11:#89b3ff;--tgph-blue-12:#d1e1ff;--tgph-red-1:#180e0f;--tgph-red-2:#201314;--tgph-red-3:#3f0f15;--tgph-red-4:#550517;--tgph-red-5:#670a1f;--tgph-red-6:#79182a;--tgph-red-7:#932738;--tgph-red-8:#c1334a;--tgph-red-9:#e9004a;--tgph-red-10:#c3354c;--tgph-red-11:#ff8e98;--tgph-red-12:#ffcfd1;--tgph-purple-1:#100f1d;--tgph-purple-2:#161528;--tgph-purple-3:#241e4b;--tgph-purple-4:#2e2368;--tgph-purple-5:#382c77;--tgph-purple-6:#423786;--tgph-purple-7:#4f449c;--tgph-purple-8:#6153bd;--tgph-purple-9:#6547de;--tgph-purple-10:#5936cd;--tgph-purple-11:#aea8ff;--tgph-purple-12:#dedeff}`;exports.default=e;
+//# sourceMappingURL=styles.inline.js.map

package/dist/cjs/modules/guide/components/Toolbar/styles.inline.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"styles.inline.js","names":[],"sources":["../../../../../../src/modules/guide/components/Toolbar/styles.css?inline"],"sourcesContent":["@telegraph tokens;\n@telegraph components;\n\n/* Animation effect for toolbar V2 when expanding and collapsing. */\n@keyframes toolbar-collapse-fade-in {\n  from {\n    opacity: 0;\n    transform: scale(0.8);\n  }\n  to {\n    opacity: 1;\n    transform: scale(1);\n  }\n}\n@keyframes toolbar-expand-fade-in {\n  from {\n    opacity: 0;\n    transform: scale(0.95);\n  }\n  to {\n    opacity: 1;\n    transform: scale(1);\n  }\n}"],"mappings":""}

package/dist/cjs/modules/guide/components/Toolbar/useToolbarStyles.js

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const n=require("react"),l=require("./styles.css.inline.js"),s=t=>t&&typeof t=="object"&&"default"in t?t:{default:t},c=s(n),o="knock-guide-toolbar-styles",u=t=>{c.default.useEffect(()=>{if(!t||document.getElementById(o))return;const e=document.createElement("style");e.id=o,e.textContent=l,document.head.appendChild(e)},[t])};exports.useToolbarStyles=u;
-//# sourceMappingURL=useToolbarStyles.js.map
+"use strict";const e=require("../../../../_virtual/_rolldown/runtime.js"),t=require("./styles.inline.js");let n=require("react");n=e.__toESM(n);var r=`knock-guide-toolbar-styles`,i=e=>{n.default.useEffect(()=>{if(!e||document.getElementById(r))return;let n=document.createElement(`style`);n.id=r,n.textContent=t.default,document.head.appendChild(n)},[e])};exports.useToolbarStyles=i;
+//# sourceMappingURL=useToolbarStyles.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"useToolbarStyles.js","sources":["../../../../../../src/modules/guide/components/Toolbar/useToolbarStyles.ts"],"sourcesContent":["import React from \"react\";\n\nimport toolbarStyles from \"./styles.css?inline\";\n\nconst STYLE_ELEMENT_ID = \"knock-guide-toolbar-styles\";\n\n// The toolbar's styles are bundled into dist/index.css, but consumers who only\n// render custom guide components have no reason to import that stylesheet.\n// Inject the toolbar's compiled styles at runtime when it becomes visible, so\n// the toolbar works without an explicit CSS import. When dist/index.css is\n// imported anyway, the injected rules are identical duplicates and harmless.\nexport const useToolbarStyles = (enabled: boolean) => {\n  React.useEffect(() => {\n    if (!enabled || document.getElementById(STYLE_ELEMENT_ID)) return;\n\n    const styleElement = document.createElement(\"style\");\n    styleElement.id = STYLE_ELEMENT_ID;\n    styleElement.textContent = toolbarStyles;\n    document.head.appendChild(styleElement);\n  }, [enabled]);\n};\n"],"names":["STYLE_ELEMENT_ID","useToolbarStyles","enabled","React","useEffect","document","getElementById","styleElement","createElement","id","textContent","toolbarStyles","head","appendChild"],"mappings":"4MAIMA,EAAmB,6BAOZC,EAAoBC,GAAqB,CACpDC,EAAAA,QAAMC,UAAU,IAAM,CACpB,GAAI,CAACF,GAAWG,SAASC,eAAeN,CAAgB,EAAG,OAErDO,MAAAA,EAAeF,SAASG,cAAc,OAAO,EACnDD,EAAaE,GAAKT,EAClBO,EAAaG,YAAcC,EAClBC,SAAAA,KAAKC,YAAYN,CAAY,CAAA,EACrC,CAACL,CAAO,CAAC,CACd"}
+{"version":3,"file":"useToolbarStyles.js","names":[],"sources":["../../../../../../src/modules/guide/components/Toolbar/useToolbarStyles.ts"],"sourcesContent":["import React from \"react\";\n\nimport toolbarStyles from \"./styles.css?inline\";\n\nconst STYLE_ELEMENT_ID = \"knock-guide-toolbar-styles\";\n\n// The toolbar's styles are bundled into dist/index.css, but consumers who only\n// render custom guide components have no reason to import that stylesheet.\n// Inject the toolbar's compiled styles at runtime when it becomes visible, so\n// the toolbar works without an explicit CSS import. When dist/index.css is\n// imported anyway, the injected rules are identical duplicates and harmless.\nexport const useToolbarStyles = (enabled: boolean) => {\n  React.useEffect(() => {\n    if (!enabled || document.getElementById(STYLE_ELEMENT_ID)) return;\n\n    const styleElement = document.createElement(\"style\");\n    styleElement.id = STYLE_ELEMENT_ID;\n    styleElement.textContent = toolbarStyles;\n    document.head.appendChild(styleElement);\n  }, [enabled]);\n};\n"],"mappings":"gJAIA,IAAM,EAAmB,6BAOZ,EAAoB,GAAqB,CACpD,EAAA,QAAM,cAAgB,CACpB,GAAI,CAAC,GAAW,SAAS,eAAe,CAAgB,EAAG,OAE3D,IAAM,EAAe,SAAS,cAAc,OAAO,EACnD,EAAa,GAAK,EAClB,EAAa,YAAc,EAAA,QAC3B,SAAS,KAAK,YAAY,CAAY,CACxC,EAAG,CAAC,CAAO,CAAC,CACd"}

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

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const o=e=>{let t;try{t=new URL(e)}catch{return!1}return t.protocol==="http:"||t.protocol==="https:"},i=(e,t=200)=>{window!=null&&window.location&&o(e)&&setTimeout(()=>window.location.assign(e),t)};exports.isValidHttpUrl=o;exports.maybeNavigateToUrlWithDelay=i;
-//# sourceMappingURL=helpers.js.map
+"use strict";var e=e=>{let t;try{t=new URL(e)}catch{return!1}return t.protocol===`http:`||t.protocol===`https:`},t=(t,n=200)=>{window?.location&&e(t)&&setTimeout(()=>window.location.assign(t),n)};exports.isValidHttpUrl=e,exports.maybeNavigateToUrlWithDelay=t;
+//# sourceMappingURL=helpers.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"helpers.js","sources":["../../../../../src/modules/guide/components/helpers.ts"],"sourcesContent":["export const isValidHttpUrl = (input: string) => {\n  let url;\n\n  try {\n    url = new URL(input);\n  } catch (_) {\n    return false;\n  }\n\n  return url.protocol === \"http:\" || url.protocol === \"https:\";\n};\n\nexport const maybeNavigateToUrlWithDelay = (\n  url: string,\n  delay: number = 200,\n) => {\n  if (!window?.location) return;\n  if (!isValidHttpUrl(url)) return;\n\n  setTimeout(() => window.location.assign(url), delay);\n};\n"],"names":["isValidHttpUrl","input","url","URL","protocol","maybeNavigateToUrlWithDelay","delay","window","location","setTimeout","assign"],"mappings":"gFAAaA,MAAAA,EAAkBC,GAAkB,CAC3CC,IAAAA,EAEA,GAAA,CACIA,EAAA,IAAIC,IAAIF,CAAK,OACT,CACH,MAAA,EAAA,CAGT,OAAOC,EAAIE,WAAa,SAAWF,EAAIE,WAAa,QACtD,EAEaC,EAA8BA,CACzCH,EACAI,EAAgB,MACb,CACEC,qBAAQC,UACRR,EAAeE,CAAG,GAEvBO,WAAW,IAAMF,OAAOC,SAASE,OAAOR,CAAG,EAAGI,CAAK,CACrD"}
+{"version":3,"file":"helpers.js","names":[],"sources":["../../../../../src/modules/guide/components/helpers.ts"],"sourcesContent":["export const isValidHttpUrl = (input: string) => {\n  let url;\n\n  try {\n    url = new URL(input);\n  } catch (_) {\n    return false;\n  }\n\n  return url.protocol === \"http:\" || url.protocol === \"https:\";\n};\n\nexport const maybeNavigateToUrlWithDelay = (\n  url: string,\n  delay: number = 200,\n) => {\n  if (!window?.location) return;\n  if (!isValidHttpUrl(url)) return;\n\n  setTimeout(() => window.location.assign(url), delay);\n};\n"],"mappings":"aAAA,IAAa,EAAkB,GAAkB,CAC/C,IAAI,EAEJ,GAAI,CACF,EAAM,IAAI,IAAI,CAAK,CACrB,MAAY,CACV,MAAO,EACT,CAEA,OAAO,EAAI,WAAa,SAAW,EAAI,WAAa,QACtD,EAEa,GACX,EACA,EAAgB,MACb,CACE,QAAQ,UACR,EAAe,CAAG,GAEvB,eAAiB,OAAO,SAAS,OAAO,CAAG,EAAG,CAAK,CACrD"}

package/dist/cjs/modules/guide/components/index.js

@@ -0,0 +1 @@
+"use strict";const e=require("./Banner/Banner.js");require("./Banner/index.js");const t=require("./Card/Card.js");require("./Card/index.js");const n=require("./Toolbar/V2/V2.js");require("./Toolbar/index.js");const r=require("./Modal/Modal.js");require("./Modal/index.js"),exports.Banner=e.Banner,exports.BannerView=e.BannerView,exports.Card=t.Card,exports.CardView=t.CardView,exports.Modal=r.Modal,exports.ModalView=r.ModalView,exports.ToolbarV2=n.V2;

package/dist/cjs/modules/guide/index.js

@@ -0,0 +1 @@
+"use strict";const e=require("./components/Banner/Banner.js"),t=require("./components/Card/Card.js");require("./components/Toolbar/V2/V2.js");const n=require("./components/Modal/Modal.js");require("./components/index.js");const r=require("./providers/KnockGuideProvider.js");require("./providers/index.js"),exports.Banner=e.Banner,exports.BannerView=e.BannerView,exports.Card=t.Card,exports.CardView=t.CardView,exports.KnockGuideProvider=r.KnockGuideProvider,exports.Modal=n.Modal,exports.ModalView=n.ModalView;

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

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const i=require("@knocklabs/react-core"),n=require("react");require("../components/Banner/Banner.js");require("../components/Card/Card.js");const a=require("../components/Toolbar/V2/V2.js");require("../components/Modal/Modal.js");const d=e=>e&&typeof e=="object"&&"default"in e?e:{default:e},u=d(n),l=({children:e,toolbar:o="v2",readyToTarget:t,listenForUpdates:r=!0,...c})=>u.default.createElement(i.KnockGuideProvider,{...c,readyToTarget:t,listenForUpdates:r},e,o==="v2"&&u.default.createElement(a.V2,{readyToTarget:t,listenForUpdates:r}));exports.KnockGuideProvider=l;
-//# sourceMappingURL=KnockGuideProvider.js.map
+"use strict";const e=require("../../../_virtual/_rolldown/runtime.js"),t=require("../components/Toolbar/V2/V2.js");require("../components/index.js");let n=require("@knocklabs/react-core"),r=require("react");r=e.__toESM(r);let i=require("react/jsx-runtime");var a=({children:e,toolbar:r=`v2`,readyToTarget:a,listenForUpdates:o=!0,...s})=>(0,i.jsxs)(n.KnockGuideProvider,{...s,readyToTarget:a,listenForUpdates:o,children:[e,r===`v2`&&(0,i.jsx)(t.V2,{readyToTarget:a,listenForUpdates:o})]});exports.KnockGuideProvider=a;
+//# 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 { ToolbarV2 } from \"../components\";\n\ntype Props = KnockGuideProviderProps & {\n  toolbar?: \"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  listenForUpdates = true,\n  ...props\n}) => {\n  return (\n    <KnockGuideProviderCore\n      {...props}\n      readyToTarget={readyToTarget}\n      listenForUpdates={listenForUpdates}\n    >\n      {children}\n      {toolbar === \"v2\" && (\n        <ToolbarV2\n          readyToTarget={readyToTarget}\n          listenForUpdates={listenForUpdates}\n        />\n      )}\n    </KnockGuideProviderCore>\n  );\n};\n"],"names":["KnockGuideProvider","children","toolbar","readyToTarget","listenForUpdates","props","React","KnockGuideProviderCore","ToolbarV2"],"mappings":"2XAeaA,EAA+DA,CAAC,CAC3EC,SAAAA,EACAC,QAAAA,EAAU,KACVC,cAAAA,EACAC,iBAAAA,EAAmB,GACnB,GAAGC,CACL,IAEKC,EAAAA,QAAA,cAAAC,EAAA,mBAAA,CACKF,GAAAA,EACJ,cAAAF,EACA,iBAAAC,GAECH,EACAC,IAAY,MACXI,EAAAA,QAAA,cAACE,EACC,GAAA,CAAA,cAAAL,EACA,iBAAAC,EAEH,CACH"}
+{"version":3,"file":"KnockGuideProvider.js","names":[],"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 { ToolbarV2 } from \"../components\";\n\ntype Props = KnockGuideProviderProps & {\n  toolbar?: \"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  listenForUpdates = true,\n  ...props\n}) => {\n  return (\n    <KnockGuideProviderCore\n      {...props}\n      readyToTarget={readyToTarget}\n      listenForUpdates={listenForUpdates}\n    >\n      {children}\n      {toolbar === \"v2\" && (\n        <ToolbarV2\n          readyToTarget={readyToTarget}\n          listenForUpdates={listenForUpdates}\n        />\n      )}\n    </KnockGuideProviderCore>\n  );\n};\n"],"mappings":"iQAeA,IAAa,GAAgE,CAC3E,WACA,UAAU,KACV,gBACA,mBAAmB,GACnB,GAAG,MAGD,EAAA,EAAA,KAAA,CAAC,EAAA,mBAAD,CACE,GAAI,EACW,gBACG,4BAHpB,CAKG,EACA,IAAY,OACX,EAAA,EAAA,IAAA,CAAC,EAAA,GAAD,CACiB,gBACG,kBACnB,CAAA,CAEmB"}

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

@@ -0,0 +1 @@
+"use strict";const e=require("./KnockGuideProvider.js");exports.KnockGuideProvider=e.KnockGuideProvider;

package/dist/cjs/modules/ms-teams/components/MsTeamsAuthButton/MsTeamsAuthButton.js

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const b=require("react"),c=require("@knocklabs/react-core"),T=require("../../../core/utils.js");;/* empty css               */const r=require("../MsTeamsIcon/MsTeamsIcon.js");;/* empty css            */const I=t=>t&&typeof t=="object"&&"default"in t?t:{default:t},e=I(b),x=({redirectUrl:t,onAuthenticationComplete:d,...l})=>{const f="graphApiClientId"in l?l.graphApiClientId:l.msTeamsBotId,{t:n}=c.useTranslations(),i=c.useKnockClient(),{setConnectionStatus:s,connectionStatus:o,setActionLabel:a,actionLabel:p,errorLabel:g,tenantId:h,knockMsTeamsChannelId:_,popupWindowRef:u}=c.useKnockMsTeamsClient(),{buildMsTeamsAuthUrl:k,disconnectFromMsTeams:C}=c.useMsTeamsAuth(f,t);c.useAuthPostMessageListener({knockHost:i.host,popupWindowRef:u,setConnectionStatus:s,onAuthenticationComplete:d}),c.useAuthPolling({popupWindowRef:u,setConnectionStatus:s,onAuthenticationComplete:d,authCheckFn:b.useCallback(async()=>i.msTeams.authCheck({tenant:h,knockChannelId:_}),[i.msTeams,h,_])});const M=n("msTeamsDisconnect")||null,E=n("msTeamsReconnect")||null;return o==="connecting"||o==="disconnecting"?e.default.createElement("div",{className:"rtk-connect__button rtk-connect__button--loading"},e.default.createElement(r.MsTeamsIcon,{height:"16px",width:"16px"}),e.default.createElement("span",null,n(o==="connecting"?"msTeamsConnecting":"msTeamsDisconnecting"))):o==="error"?e.default.createElement("button",{onClick:()=>{const m=T.openPopupWindow(k());u.current=m,s("connecting")},className:"rtk-connect__button rtk-connect__button--error",onMouseEnter:()=>a(E),onMouseLeave:()=>a(null)},e.default.createElement(r.MsTeamsIcon,{height:"16px",width:"16px"}),e.default.createElement("span",{className:"rtk-connect__button__text--error"},p||g||n("msTeamsError"))):o==="disconnected"?e.default.createElement("button",{onClick:()=>{const m=T.openPopupWindow(k());u.current=m,s("connecting")},className:"rtk-connect__button rtk-connect__button--disconnected"},e.default.createElement(r.MsTeamsIcon,{height:"16px",width:"16px"}),e.default.createElement("span",null,n("msTeamsConnect"))):e.default.createElement("button",{onClick:C,className:"rtk-connect__button rtk-connect__button--connected",onMouseEnter:()=>a(M),onMouseLeave:()=>a(null)},e.default.createElement(r.MsTeamsIcon,{height:"16px",width:"16px"}),e.default.createElement("span",{className:"rtk-connect__button__text--connected"},p||n("msTeamsConnected")))};exports.MsTeamsAuthButton=x;
-//# sourceMappingURL=MsTeamsAuthButton.js.map
+"use strict";const e=require("../../../core/utils.js");;/* empty css           */const t=require("../MsTeamsIcon/MsTeamsIcon.js");require("../MsTeamsIcon/index.js");/* empty css         */let n=require("@knocklabs/react-core"),r=require("react"),i=require("react/jsx-runtime");var a=({redirectUrl:a,onAuthenticationComplete:o,...s})=>{let c=`graphApiClientId`in s?s.graphApiClientId:s.msTeamsBotId,{t:l}=(0,n.useTranslations)(),u=(0,n.useKnockClient)(),{setConnectionStatus:d,connectionStatus:f,setActionLabel:p,actionLabel:m,errorLabel:h,tenantId:g,knockMsTeamsChannelId:_,popupWindowRef:v}=(0,n.useKnockMsTeamsClient)(),{buildMsTeamsAuthUrl:y,disconnectFromMsTeams:b}=(0,n.useMsTeamsAuth)(c,a);(0,n.useAuthPostMessageListener)({knockHost:u.host,popupWindowRef:v,setConnectionStatus:d,onAuthenticationComplete:o}),(0,n.useAuthPolling)({popupWindowRef:v,setConnectionStatus:d,onAuthenticationComplete:o,authCheckFn:(0,r.useCallback)(async()=>u.msTeams.authCheck({tenant:g,knockChannelId:_}),[u.msTeams,g,_])});let x=l(`msTeamsDisconnect`)||null,S=l(`msTeamsReconnect`)||null;return f===`connecting`||f===`disconnecting`?(0,i.jsxs)(`div`,{className:`rtk-connect__button rtk-connect__button--loading`,children:[(0,i.jsx)(t.MsTeamsIcon,{height:`16px`,width:`16px`}),(0,i.jsx)(`span`,{children:l(f===`connecting`?`msTeamsConnecting`:`msTeamsDisconnecting`)})]}):f===`error`?(0,i.jsxs)(`button`,{onClick:()=>{let t=e.openPopupWindow(y());v.current=t,d(`connecting`)},className:`rtk-connect__button rtk-connect__button--error`,onMouseEnter:()=>p(S),onMouseLeave:()=>p(null),children:[(0,i.jsx)(t.MsTeamsIcon,{height:`16px`,width:`16px`}),(0,i.jsx)(`span`,{className:`rtk-connect__button__text--error`,children:m||h||l(`msTeamsError`)})]}):f===`disconnected`?(0,i.jsxs)(`button`,{onClick:()=>{let t=e.openPopupWindow(y());v.current=t,d(`connecting`)},className:`rtk-connect__button rtk-connect__button--disconnected`,children:[(0,i.jsx)(t.MsTeamsIcon,{height:`16px`,width:`16px`}),(0,i.jsx)(`span`,{children:l(`msTeamsConnect`)})]}):(0,i.jsxs)(`button`,{onClick:b,className:`rtk-connect__button rtk-connect__button--connected`,onMouseEnter:()=>p(x),onMouseLeave:()=>p(null),children:[(0,i.jsx)(t.MsTeamsIcon,{height:`16px`,width:`16px`}),(0,i.jsx)(`span`,{className:`rtk-connect__button__text--connected`,children:m||l(`msTeamsConnected`)})]})};exports.MsTeamsAuthButton=a;
+//# sourceMappingURL=MsTeamsAuthButton.js.map