@knocklabs/react 0.11.17 → 0.11.19

package/CHANGELOG.md

@@ -1,5 +1,18 @@
 # Changelog
 
+## 0.11.19
+
+### Patch Changes
+
+- e474413: [Guide] Skip re-rendering in transient state in guide toolbar
+- 9d81dc2: [Guide] Add hotkey support for moving focus in guide toolbar
+
+## 0.11.18
+
+### Patch Changes
+
+- c22289c: chore(deps): bump the telegraph-packages group with 5 updates
+
 ## 0.11.17
 
 ### Patch Changes

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

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const m=require("@knocklabs/react-core"),d=require("@telegraph/button"),p=require("@telegraph/layout"),b=require("@telegraph/tooltip"),T=require("@telegraph/typography"),f=require("lucide-react"),v=require("react"),C=require("./GuideRow.js"),g=require("./helpers.js");function k(e){if(e&&typeof e=="object"&&"default"in e)return e;const n=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(e){for(const o in e)if(o!=="default"){const t=Object.getOwnPropertyDescriptor(e,o);Object.defineProperty(n,o,t.get?t:{enumerable:!0,get:()=>e[o]})}}return n.default=e,Object.freeze(n)}const r=k(v),y=60,h=(e,n)=>{requestAnimationFrame(()=>{const o=e.querySelector(`[${C.GUIDE_ROW_DATA_SELECTOR}="${CSS.escape(n)}"]`);if(!o||!(o instanceof HTMLElement))return;const t=e.getBoundingClientRect(),s=o.getBoundingClientRect();s.top<t.top?e.scrollTo({top:e.scrollTop-(t.top-s.top)-y,behavior:"smooth"}):s.bottom>t.bottom&&e.scrollTo({top:e.scrollTop+(s.bottom-t.bottom)+y,behavior:"smooth"})})},E=({guides:e,guideListRef:n})=>{const{client:o}=m.useGuideContext(),{debugSettings:t}=m.useStore(o.store,c=>({debugSettings:c.debug})),s=Object.keys((t==null?void 0:t.focusedGuideKeys)||{});if(!(s.length>0))return null;const a=s[0];return r.createElement(p.Box,{borderTop:"px",px:"3",py:"1",overflow:"hidden",backgroundColor:"blue-2"},r.createElement(p.Stack,{align:"center",justify:"space-between",gap:"4"},r.createElement(T.Text,{as:"span",size:"1",weight:"medium",color:"blue",style:{display:"block",overflow:"hidden",textOverflow:"ellipsis",whiteSpace:"nowrap",minWidth:0}},"Focus mode: ",a),r.createElement(p.Stack,{align:"center",gap:"1",style:{flexShrink:0}},r.createElement(b.Tooltip,{label:"Focus previous guide",...g.sharedTooltipProps},r.createElement(d.Button,{size:"0",variant:"ghost",color:"blue",leadingIcon:{icon:f.ChevronLeft,alt:"Previous guide"},onClick:()=>{const c=e.filter(i=>!!i.annotation.selectable.status),u=c.findIndex(i=>i.key===a),l=u<=0?void 0:c[u-1];l&&(o.setDebug({...t,focusedGuideKeys:{[l.key]:!0}}),n.current&&h(n.current,l.key))}})),r.createElement(b.Tooltip,{label:"Focus next guide",...g.sharedTooltipProps},r.createElement(d.Button,{size:"0",variant:"ghost",color:"blue",leadingIcon:{icon:f.ChevronRight,alt:"Next guide"},onClick:()=>{const c=e.filter(i=>!!i.annotation.selectable.status),u=c.findIndex(i=>i.key===a),l=u<0||u+1>c.length-1?void 0:c[u+1];l&&(o.setDebug({...t,focusedGuideKeys:{[l.key]:!0}}),n.current&&h(n.current,l.key))}})),r.createElement(b.Tooltip,{label:"Exit focus mode",...g.sharedTooltipProps},r.createElement(d.Button,{size:"0",variant:"ghost",color:"blue",leadingIcon:{icon:f.X,alt:"Clear focus"},onClick:()=>{o.setDebug({...t,focusedGuideKeys:{}})}})))))};exports.FocusChin=E;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const h=require("@knocklabs/react-core"),f=require("@telegraph/button"),d=require("@telegraph/layout"),b=require("@telegraph/tooltip"),m=require("@telegraph/typography"),g=require("lucide-react"),C=require("react"),S=require("./GuideRow.js"),p=require("./Kbd.js"),y=require("./helpers.js");function x(t){if(t&&typeof t=="object"&&"default"in t)return t;const r=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(t){for(const n in t)if(n!=="default"){const e=Object.getOwnPropertyDescriptor(t,n);Object.defineProperty(r,n,e.get?e:{enumerable:!0,get:()=>t[n]})}}return r.default=t,Object.freeze(r)}const o=x(C),k=60,O=",",w="/",R=(t,r)=>{requestAnimationFrame(()=>{const n=t.querySelector(`[${S.GUIDE_ROW_DATA_SELECTOR}="${CSS.escape(r)}"]`);if(!n||!(n instanceof HTMLElement))return;const e=t.getBoundingClientRect(),c=n.getBoundingClientRect();c.top<e.top?t.scrollTo({top:t.scrollTop-(e.top-c.top)-k,behavior:"smooth"}):c.bottom>e.bottom&&t.scrollTo({top:t.scrollTop+(c.bottom-e.bottom)+k,behavior:"smooth"})})},v=({guides:t,currentKey:r,focusGuide:n})=>{const e=t.filter(l=>!!l.annotation.selectable.status);if(e.length===0)return;if(!r){n(e[e.length-1].key);return}const c=e.findIndex(l=>l.key===r),s=c<=0?void 0:e[c-1];s&&n(s.key)},T=({guides:t,currentKey:r,focusGuide:n})=>{const e=t.filter(l=>!!l.annotation.selectable.status);if(e.length===0)return;if(!r){n(e[0].key);return}const c=e.findIndex(l=>l.key===r),s=c<0||c+1>e.length-1?void 0:e[c+1];s&&n(s.key)},q=({guides:t,guideListRef:r})=>{const{client:n}=h.useGuideContext(),{debugSettings:e}=h.useStore(n.store,i=>({debugSettings:i.debug})),c=Object.keys((e==null?void 0:e.focusedGuideKeys)||{}),s=c.length>0,l=c[0],E=o.useCallback(i=>{n.setDebug({...n.store.state.debug,focusedGuideKeys:{[i]:!0}}),r.current&&R(r.current,i)},[n,r]),a=o.useRef({guides:t,currentKey:l,focusGuide:E});return o.useEffect(()=>{a.current={guides:t,currentKey:l,focusGuide:E}}),o.useEffect(()=>{const i=u=>{!u.ctrlKey||u.repeat||(u.key===O?(u.preventDefault(),v(a.current)):u.key===w&&(u.preventDefault(),T(a.current)))};return window.addEventListener("keydown",i),()=>{window.removeEventListener("keydown",i)}},[]),s?o.createElement(d.Box,{borderTop:"px",px:"3",py:"1",overflow:"hidden",backgroundColor:"blue-2"},o.createElement(d.Stack,{align:"center",justify:"space-between",gap:"4"},o.createElement(m.Text,{as:"span",size:"1",weight:"medium",color:"blue",style:{display:"block",overflow:"hidden",textOverflow:"ellipsis",whiteSpace:"nowrap",minWidth:0}},"Focus mode: ",l),o.createElement(d.Stack,{align:"center",gap:"1",style:{flexShrink:0}},o.createElement(b.Tooltip,{label:o.createElement(m.Text,{as:"span",size:"1"},"Focus previous guide",o.createElement(d.Stack,{display:"inline-block",ml:"3"},o.createElement(p.Kbd,null,"ctrl")," + ",o.createElement(p.Kbd,null,","))),...y.sharedTooltipProps},o.createElement(f.Button,{size:"0",variant:"ghost",color:"blue",leadingIcon:{icon:g.ChevronLeft,alt:"Previous guide"},onClick:()=>v(a.current)})),o.createElement(b.Tooltip,{label:o.createElement(m.Text,{as:"span",size:"1"},"Focus next guide",o.createElement(d.Stack,{display:"inline-block",ml:"3"},o.createElement(p.Kbd,null,"ctrl")," + ",o.createElement(p.Kbd,null,"/"))),...y.sharedTooltipProps},o.createElement(f.Button,{size:"0",variant:"ghost",color:"blue",leadingIcon:{icon:g.ChevronRight,alt:"Next guide"},onClick:()=>T(a.current)})),o.createElement(b.Tooltip,{label:"Exit focus mode",...y.sharedTooltipProps},o.createElement(f.Button,{size:"0",variant:"ghost",color:"blue",leadingIcon:{icon:g.X,alt:"Clear focus"},onClick:()=>{n.setDebug({...e,focusedGuideKeys:{}})}}))))):null};exports.FocusChin=q;
 //# sourceMappingURL=FocusChin.js.map

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

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

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

@@ -0,0 +1,2 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const n=require("react");function a(e){if(e&&typeof e=="object"&&"default"in e)return e;const r=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(e){for(const t in e)if(t!=="default"){const o=Object.getOwnPropertyDescriptor(e,t);Object.defineProperty(r,t,o.get?o:{enumerable:!0,get:()=>e[t]})}}return r.default=e,Object.freeze(r)}const c=a(n),d=({children:e})=>c.createElement("kbd",{style:{display:"inline-block",padding:"1px 4px",borderRadius:"var(--tgph-rounded-2)",border:"1px solid rgba(255, 255, 255, 0.3)",backgroundColor:"rgba(255, 255, 255, 0.15)"}},e);exports.Kbd=d;
+//# sourceMappingURL=Kbd.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"Kbd.js","sources":["../../../../../../../src/modules/guide/components/Toolbar/V2/Kbd.tsx"],"sourcesContent":["import * as React from \"react\";\n\nexport const Kbd = ({ children }: { children: React.ReactNode }) => {\n  return (\n    <kbd\n      style={{\n        display: \"inline-block\",\n        padding: \"1px 4px\",\n        borderRadius: \"var(--tgph-rounded-2)\",\n        border: \"1px solid rgba(255, 255, 255, 0.3)\",\n        backgroundColor: \"rgba(255, 255, 255, 0.15)\",\n      }}\n    >\n      {children}\n    </kbd>\n  );\n};\n"],"names":["Kbd","children","React","display","padding","borderRadius","border","backgroundColor"],"mappings":"obAEaA,EAAMA,CAAC,CAAEC,SAAAA,CAAwC,IAE1DC,EAAA,cAAC,OACC,MAAO,CACLC,QAAS,eACTC,QAAS,UACTC,aAAc,wBACdC,OAAQ,qCACRC,gBAAiB,8BAGlBN,CACH"}

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

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const z=require("@knocklabs/client"),K=require("@knocklabs/react-core"),k=require("@telegraph/button"),A=require("@telegraph/icon"),o=require("@telegraph/layout"),p=require("@telegraph/segmented-control"),w=require("@telegraph/tooltip"),S=require("@telegraph/typography"),c=require("lucide-react"),L=require("react"),H=require("../KnockButton.js"),j=require("../shared.js");;/* empty css             */const V=require("./FocusChin.js"),M=require("./GuideContextDetails.js"),F=require("./GuideRow.js"),C=require("./helpers.js"),W=require("./useDraggable.js"),Y=require("./useInspectGuideClientStore.js"),X=a=>a&&typeof a=="object"&&"default"in a?a:{default:a},e=X(L),N=".",Z="540px",$=["0 0 0 1px rgba(0, 0, 0, 0.06)","0 0 0 1px rgba(255, 255, 255, 0.10)","inset 0 1px 0 rgba(255, 255, 255, 0.04)","0 1px 1px 0 rgba(0, 0, 0, 0.04)","0 4px 6px -1px rgba(0, 0, 0, 0.05)","0 8px 16px -4px rgba(0, 0, 0, 0.06)"].join(", "),q=({children:a})=>e.default.createElement("kbd",{style:{display:"inline-block",padding:"1px 4px",borderRadius:"var(--tgph-rounded-2)",border:"1px solid rgba(255, 255, 255, 0.3)",backgroundColor:"rgba(255, 255, 255, 0.15)"}},a),J=a=>{switch(a){case"all-guides":return"You have no guides. Get started by creating a guide.";case"only-active":return"There are no active guides.";case"only-eligible":return"Your current user is not eligible for any guides."}},B=(a,s)=>a.filter(l=>!(s==="only-eligible"&&!l.annotation.isEligible||s==="only-active"&&!l.annotation.active.status)),Q=({readyToTarget:a,listenForUpdates:s})=>{const{client:l}=K.useGuideContext(),[d,b]=e.default.useState("only-active"),[u,P]=e.default.useState(()=>z.KnockGuideClient.getToolbarRunConfigFromUrl()),[D,m]=e.default.useState(!1),[f,T]=e.default.useState(!1),[_,v]=e.default.useState();e.default.useEffect(()=>{v(void 0)},[d]),e.default.useEffect(()=>{var h;const{isVisible:t=!1,focusedGuideKeys:n={}}=u||{},r=(h=l.store.state.debug)==null?void 0:h.debugging;return t&&!r&&a&&(l.setDebug({focusedGuideKeys:n}),Object.keys(n).length>0&&b("all-guides")),!t&&r&&l.unsetDebug({listenForUpdates:s}),()=>{var g;(g=l.store.state.debug)!=null&&g.debugging&&l.unsetDebug({listenForUpdates:s})}},[a,s,u,l,b]),e.default.useEffect(()=>{const t=n=>{n.ctrlKey&&n.key===N&&!n.repeat&&(n.preventDefault(),m(r=>!r))};return window.addEventListener("keydown",t),()=>{window.removeEventListener("keydown",t)}},[]);const R=e.default.useRef(null),G=e.default.useRef(null),{position:O,isDragging:x,handlePointerDown:y,hasDraggedRef:I}=W.useDraggable({elementRef:R,reclampDeps:[D],initialPosition:{top:16,right:16}}),i=Y.useInspectGuideClientStore(u);if(!i||!(u!=null&&u.isVisible))return null;const E=i.status==="ok"?B(i.guides,d):[];return e.default.createElement(o.Box,{tgphRef:R,position:"fixed",style:{top:O.top+"px",right:O.right+"px",zIndex:j.TOOLBAR_Z_INDEX}},D?e.default.createElement(w.Tooltip,{side:"left",label:e.default.createElement(S.Text,{as:"span",size:"1"},"Guide Toolbar",e.default.createElement(o.Stack,{display:"inline-block",ml:"3"},e.default.createElement(q,null,"ctrl")," + ",e.default.createElement(q,null,"."))),...C.sharedTooltipProps},e.default.createElement(o.Stack,{border:"px",rounded:"4",align:"center",justify:"center",w:"10",h:"10",onPointerDown:y,backgroundColor:"surface-1",style:{cursor:x?"grabbing":"grab",touchAction:"none",userSelect:"none",animation:"toolbar-collapse-fade-in 150ms ease-out"}},e.default.createElement(o.Box,{style:{transform:"scale(0.7)",transformOrigin:"center center"}},e.default.createElement(H.KnockButton,{onClick:()=>{I.current||m(!1)},positioned:!1})))):e.default.createElement(o.Stack,{direction:"column",backgroundColor:"surface-1",rounded:"4",overflow:"hidden",style:{width:Z,boxShadow:$,animation:"toolbar-expand-fade-in 150ms ease-out"}},e.default.createElement(o.Stack,{w:"full",p:"2",justify:"space-between",direction:"row",align:"center",gap:"2",borderBottom:"px",onPointerDown:y,style:{boxSizing:"border-box",cursor:x?"grabbing":"grab",touchAction:"none",userSelect:"none"}},e.default.createElement(o.Stack,{align:"center",gap:"1_5",style:{minWidth:0,flex:1}},e.default.createElement(o.Stack,{display:"inline-flex",align:"center",style:{cursor:x?"grabbing":"grab",touchAction:"none",userSelect:"none"},onPointerDown:t=>{t.stopPropagation(),y(t)}},e.default.createElement(A.Icon,{color:"gray",size:"1",icon:c.GripVertical,"aria-hidden":!0})),e.default.createElement(o.Stack,{align:"center",gap:"1_5",onPointerDown:t=>t.stopPropagation()},e.default.createElement(p.SegmentedControl.Root,{size:"1",type:"single",value:d,onValueChange:t=>{if(!t)return;const n=l.store.state.debug,r=Object.keys((n==null?void 0:n.focusedGuideKeys)||{});i.status==="ok"&&r.length>0&&(B(i.guides,t).find(g=>g.key===r[0])||l.setDebug({...n,focusedGuideKeys:{}})),b(t)}},e.default.createElement(p.SegmentedControl.Option,{value:"all-guides",style:{width:"54px"}},"All"),e.default.createElement(p.SegmentedControl.Option,{value:"only-active",style:{width:"54px"}},"Active"),e.default.createElement(p.SegmentedControl.Option,{value:"only-eligible",style:{width:"54px"}},"Eligible")),e.default.createElement(w.Tooltip,{label:"Settings",...C.sharedTooltipProps},e.default.createElement(k.Button,{size:"1",variant:f?"outline":"ghost",color:f?"blue":"gray",leadingIcon:{icon:c.SlidersHorizontal,alt:"Inspect target params"},trailingIcon:f?{icon:c.ChevronDown,alt:"Hide context data"}:{icon:c.ChevronRight,alt:"Show context data"},onClick:()=>T(t=>!t)})))),e.default.createElement(o.Stack,{align:"center",gap:"1_5",style:{flexShrink:0},onPointerDown:t=>t.stopPropagation()},e.default.createElement(o.Stack,{align:"center",gap:"1_5"},e.default.createElement(k.Button,{size:"1",variant:"outline",leadingIcon:{icon:c.LogOut,alt:"Exit"},onClick:()=>{P(t=>({...t,isVisible:!1}))}},"Exit"),e.default.createElement(w.Tooltip,{label:"Minimize toolbar",...C.sharedTooltipProps},e.default.createElement(k.Button,{size:"1",variant:"outline",leadingIcon:{icon:c.Minimize2,alt:"Minimize"},onClick:()=>m(!0)}))))),f&&e.default.createElement(o.Box,{borderBottom:"px"},e.default.createElement(M.GuideContextDetails,null)),e.default.createElement(o.Box,{tgphRef:G,p:"1",overflow:"auto",style:{maxHeight:"calc(80vh - 96px)"}},i.status==="error"?e.default.createElement(o.Box,{px:"2",pb:"1",style:{lineHeight:"1.2"}},e.default.createElement(S.Text,{as:"span",size:"1",weight:"medium",color:i.error==="no_guides_fetched"?"default":"red"},i.message)):E.length===0?e.default.createElement(o.Box,{px:"2",pb:"1",style:{lineHeight:"1.2"}},e.default.createElement(S.Text,{as:"span",size:"1",weight:"medium",color:"default"},J(d))):E.map(t=>e.default.createElement(F.GuideRow,{key:t.key,guide:t,orderIndex:t.orderIndex,isExpanded:t.key===_,onClick:()=>{v(n=>n&&n===t.key?void 0:t.key)}}))),e.default.createElement(V.FocusChin,{guides:E,guideListRef:G})))};exports.V2=Q;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const K=require("@knocklabs/client"),z=require("@knocklabs/react-core"),k=require("@telegraph/button"),A=require("@telegraph/icon"),o=require("@telegraph/layout"),p=require("@telegraph/segmented-control"),w=require("@telegraph/tooltip"),S=require("@telegraph/typography"),c=require("lucide-react"),L=require("react"),H=require("../KnockButton.js"),j=require("../shared.js");;/* empty css             */const V=require("./FocusChin.js"),M=require("./GuideContextDetails.js"),F=require("./GuideRow.js"),q=require("./Kbd.js"),C=require("./helpers.js"),W=require("./useDraggable.js"),Y=require("./useInspectGuideClientStore.js"),X=a=>a&&typeof a=="object"&&"default"in a?a:{default:a},e=X(L),N=".",Z="540px",$=["0 0 0 1px rgba(0, 0, 0, 0.06)","0 0 0 1px rgba(255, 255, 255, 0.10)","inset 0 1px 0 rgba(255, 255, 255, 0.04)","0 1px 1px 0 rgba(0, 0, 0, 0.04)","0 4px 6px -1px rgba(0, 0, 0, 0.05)","0 8px 16px -4px rgba(0, 0, 0, 0.06)"].join(", "),J=a=>{switch(a){case"all-guides":return"You have no guides. Get started by creating a guide.";case"only-active":return"There are no active guides.";case"only-eligible":return"Your current user is not eligible for any guides."}},B=(a,s)=>a.filter(l=>!(s==="only-eligible"&&!l.annotation.isEligible||s==="only-active"&&!l.annotation.active.status)),Q=({readyToTarget:a,listenForUpdates:s})=>{const{client:l}=z.useGuideContext(),[d,m]=e.default.useState("only-active"),[u,P]=e.default.useState(()=>K.KnockGuideClient.getToolbarRunConfigFromUrl()),[D,b]=e.default.useState(!1),[f,T]=e.default.useState(!1),[_,v]=e.default.useState();e.default.useEffect(()=>{v(void 0)},[d]),e.default.useEffect(()=>{var h;const{isVisible:t=!1,focusedGuideKeys:n={}}=u||{},r=(h=l.store.state.debug)==null?void 0:h.debugging;return t&&!r&&a&&(l.setDebug({focusedGuideKeys:n}),Object.keys(n).length>0&&m("all-guides")),!t&&r&&l.unsetDebug({listenForUpdates:s}),()=>{var g;(g=l.store.state.debug)!=null&&g.debugging&&l.unsetDebug({listenForUpdates:s})}},[a,s,u,l,m]),e.default.useEffect(()=>{const t=n=>{n.ctrlKey&&n.key===N&&!n.repeat&&(n.preventDefault(),b(r=>!r))};return window.addEventListener("keydown",t),()=>{window.removeEventListener("keydown",t)}},[]);const G=e.default.useRef(null),O=e.default.useRef(null),{position:R,isDragging:x,handlePointerDown:y,hasDraggedRef:I}=W.useDraggable({elementRef:G,reclampDeps:[D],initialPosition:{top:16,right:16}}),i=Y.useInspectGuideClientStore(u);if(!i||!(u!=null&&u.isVisible))return null;const E=i.status==="ok"?B(i.guides,d):[];return e.default.createElement(o.Box,{tgphRef:G,position:"fixed",style:{top:R.top+"px",right:R.right+"px",zIndex:j.TOOLBAR_Z_INDEX}},D?e.default.createElement(w.Tooltip,{side:"left",label:e.default.createElement(S.Text,{as:"span",size:"1"},"Guide Toolbar",e.default.createElement(o.Stack,{display:"inline-block",ml:"3"},e.default.createElement(q.Kbd,null,"ctrl")," + ",e.default.createElement(q.Kbd,null,"."))),...C.sharedTooltipProps},e.default.createElement(o.Stack,{border:"px",rounded:"4",align:"center",justify:"center",w:"10",h:"10",onPointerDown:y,backgroundColor:"surface-1",style:{cursor:x?"grabbing":"grab",touchAction:"none",userSelect:"none",animation:"toolbar-collapse-fade-in 150ms ease-out"}},e.default.createElement(o.Box,{style:{transform:"scale(0.7)",transformOrigin:"center center"}},e.default.createElement(H.KnockButton,{onClick:()=>{I.current||b(!1)},positioned:!1})))):e.default.createElement(o.Stack,{direction:"column",backgroundColor:"surface-1",rounded:"4",overflow:"hidden",style:{width:Z,boxShadow:$,animation:"toolbar-expand-fade-in 150ms ease-out"}},e.default.createElement(o.Stack,{w:"full",p:"2",justify:"space-between",direction:"row",align:"center",gap:"2",borderBottom:"px",onPointerDown:y,style:{boxSizing:"border-box",cursor:x?"grabbing":"grab",touchAction:"none",userSelect:"none"}},e.default.createElement(o.Stack,{align:"center",gap:"1_5",style:{minWidth:0,flex:1}},e.default.createElement(o.Stack,{display:"inline-flex",align:"center",style:{cursor:x?"grabbing":"grab",touchAction:"none",userSelect:"none"},onPointerDown:t=>{t.stopPropagation(),y(t)}},e.default.createElement(A.Icon,{color:"gray",size:"1",icon:c.GripVertical,"aria-hidden":!0})),e.default.createElement(o.Stack,{align:"center",gap:"1_5",onPointerDown:t=>t.stopPropagation()},e.default.createElement(p.SegmentedControl.Root,{size:"1",type:"single",value:d,onValueChange:t=>{if(!t)return;const n=l.store.state.debug,r=Object.keys((n==null?void 0:n.focusedGuideKeys)||{});i.status==="ok"&&r.length>0&&(B(i.guides,t).find(g=>g.key===r[0])||l.setDebug({...n,focusedGuideKeys:{}})),m(t)}},e.default.createElement(p.SegmentedControl.Option,{value:"all-guides",style:{width:"54px"}},"All"),e.default.createElement(p.SegmentedControl.Option,{value:"only-active",style:{width:"54px"}},"Active"),e.default.createElement(p.SegmentedControl.Option,{value:"only-eligible",style:{width:"54px"}},"Eligible")),e.default.createElement(w.Tooltip,{label:"Settings",...C.sharedTooltipProps},e.default.createElement(k.Button,{size:"1",variant:f?"outline":"ghost",color:f?"blue":"gray",leadingIcon:{icon:c.SlidersHorizontal,alt:"Inspect target params"},trailingIcon:f?{icon:c.ChevronDown,alt:"Hide context data"}:{icon:c.ChevronRight,alt:"Show context data"},onClick:()=>T(t=>!t)})))),e.default.createElement(o.Stack,{align:"center",gap:"1_5",style:{flexShrink:0},onPointerDown:t=>t.stopPropagation()},e.default.createElement(o.Stack,{align:"center",gap:"1_5"},e.default.createElement(k.Button,{size:"1",variant:"outline",leadingIcon:{icon:c.LogOut,alt:"Exit"},onClick:()=>{P(t=>({...t,isVisible:!1}))}},"Exit"),e.default.createElement(w.Tooltip,{label:"Minimize toolbar",...C.sharedTooltipProps},e.default.createElement(k.Button,{size:"1",variant:"outline",leadingIcon:{icon:c.Minimize2,alt:"Minimize"},onClick:()=>b(!0)}))))),f&&e.default.createElement(o.Box,{borderBottom:"px"},e.default.createElement(M.GuideContextDetails,null)),e.default.createElement(o.Box,{tgphRef:O,p:"1",overflow:"auto",style:{maxHeight:"calc(80vh - 96px)"}},i.status==="error"?e.default.createElement(o.Box,{px:"2",pb:"1",style:{lineHeight:"1.2"}},e.default.createElement(S.Text,{as:"span",size:"1",weight:"medium",color:i.error==="no_guides_fetched"?"default":"red"},i.message)):E.length===0?e.default.createElement(o.Box,{px:"2",pb:"1",style:{lineHeight:"1.2"}},e.default.createElement(S.Text,{as:"span",size:"1",weight:"medium",color:"default"},J(d))):E.map(t=>e.default.createElement(F.GuideRow,{key:t.key,guide:t,orderIndex:t.orderIndex,isExpanded:t.key===_,onClick:()=>{v(n=>n&&n===t.key?void 0:t.key)}}))),e.default.createElement(V.FocusChin,{guides:E,guideListRef:O})))};exports.V2=Q;
 //# sourceMappingURL=V2.js.map

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\";\n\nimport { FocusChin } from \"./FocusChin\";\nimport { GuideContextDetails } from \"./GuideContextDetails\";\nimport { GuideRow } from \"./GuideRow\";\nimport { DisplayOption, sharedTooltipProps } from \"./helpers\";\nimport { useDraggable } from \"./useDraggable\";\nimport {\n  InspectionResultOk,\n  useInspectGuideClientStore,\n} from \"./useInspectGuideClientStore\";\n\nconst TOGGLE_COLLAPSED_HOTKEY = \".\";\n\nconst TOOLBAR_WIDTH = \"540px\";\n\nconst TOOLBAR_BOX_SHADOW = [\n  \"0 0 0 1px rgba(0, 0, 0, 0.06)\",\n  \"0 0 0 1px rgba(255, 255, 255, 0.10)\",\n  \"inset 0 1px 0 rgba(255, 255, 255, 0.04)\",\n  \"0 1px 1px 0 rgba(0, 0, 0, 0.04)\",\n  \"0 4px 6px -1px rgba(0, 0, 0, 0.05)\",\n  \"0 8px 16px -4px rgba(0, 0, 0, 0.06)\",\n].join(\", \");\n\nconst Kbd = ({ children }: { children: React.ReactNode }) => {\n  return (\n    <kbd\n      style={{\n        display: \"inline-block\",\n        padding: \"1px 4px\",\n        borderRadius: \"var(--tgph-rounded-2)\",\n        border: \"1px solid rgba(255, 255, 255, 0.3)\",\n        backgroundColor: \"rgba(255, 255, 255, 0.15)\",\n      }}\n    >\n      {children}\n    </kbd>\n  );\n};\n\nconst getEmptyStateMessage = (displayOption: DisplayOption) => {\n  switch (displayOption) {\n    case \"all-guides\":\n      return \"You have no guides. Get started by creating a guide.\";\n    case \"only-active\":\n      return \"There are no active guides.\";\n    case \"only-eligible\":\n      return \"Your current user is not eligible for any guides.\";\n  }\n};\n\nconst filterGuides = (\n  guides: InspectionResultOk[\"guides\"],\n  displayOption: DisplayOption,\n) => {\n  return guides.filter((guide) => {\n    if (displayOption === \"only-eligible\" && !guide.annotation.isEligible) {\n      return false;\n    }\n    if (displayOption === \"only-active\" && !guide.annotation.active.status) {\n      return false;\n    }\n    return true;\n  });\n};\n\ntype Props = {\n  readyToTarget: boolean;\n  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  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","Kbd","children","React","display","padding","borderRadius","border","backgroundColor","getEmptyStateMessage","displayOption","filterGuides","guides","filter","guide","annotation","isEligible","active","status","V2","readyToTarget","listenForUpdates","client","useGuideContext","setDisplayOption","useState","runConfig","setRunConfig","KnockGuideClient","getToolbarRunConfigFromUrl","isCollapsed","setIsCollapsed","isContextPanelOpen","setIsContextPanelOpen","expandedGuideRowKey","setExpandedGuideRowKey","useEffect","undefined","isVisible","focusedGuideKeys","isDebugging","store","state","debug","debugging","setDebug","Object","keys","length","unsetDebug","handleKeyDown","e","ctrlKey","key","repeat","preventDefault","prev","addEventListener","removeEventListener","containerRef","useRef","guideListRef","position","isDragging","handlePointerDown","hasDraggedRef","useDraggable","elementRef","reclampDeps","initialPosition","top","right","result","useInspectGuideClientStore","Box","zIndex","TOOLBAR_Z_INDEX","Tooltip","Text","Stack","sharedTooltipProps","cursor","touchAction","userSelect","animation","transform","transformOrigin","KnockButton","current","width","boxShadow","boxSizing","minWidth","flex","stopPropagation","Icon","GripVertical","SegmentedControl","val","debugSettings","find","g","Button","icon","SlidersHorizontal","alt","ChevronDown","ChevronRight","v","flexShrink","LogOut","curr","Minimize2","GuideContextDetails","maxHeight","lineHeight","error","message","map","GuideRow","orderIndex","k","FocusChin"],"mappings":"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"}
+{"version":3,"file":"V2.js","sources":["../../../../../../../src/modules/guide/components/Toolbar/V2/V2.tsx"],"sourcesContent":["import { KnockGuideClient } from \"@knocklabs/client\";\nimport { useGuideContext } from \"@knocklabs/react-core\";\nimport { Button } from \"@telegraph/button\";\nimport { Icon } from \"@telegraph/icon\";\nimport { Box, Stack } from \"@telegraph/layout\";\nimport { SegmentedControl } from \"@telegraph/segmented-control\";\nimport { Tooltip } from \"@telegraph/tooltip\";\nimport { Text } from \"@telegraph/typography\";\nimport {\n  ChevronDown,\n  ChevronRight,\n  GripVertical,\n  LogOut,\n  Minimize2,\n  SlidersHorizontal,\n} from \"lucide-react\";\nimport React from \"react\";\n\nimport { KnockButton } from \"../KnockButton\";\nimport { TOOLBAR_Z_INDEX } from \"../shared\";\nimport \"../styles.css\";\n\nimport { FocusChin } from \"./FocusChin\";\nimport { GuideContextDetails } from \"./GuideContextDetails\";\nimport { GuideRow } from \"./GuideRow\";\nimport { 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  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","useEffect","undefined","isVisible","focusedGuideKeys","isDebugging","store","state","debug","debugging","setDebug","Object","keys","length","unsetDebug","handleKeyDown","e","ctrlKey","key","repeat","preventDefault","prev","addEventListener","removeEventListener","containerRef","useRef","guideListRef","position","isDragging","handlePointerDown","hasDraggedRef","useDraggable","elementRef","reclampDeps","initialPosition","top","right","result","useInspectGuideClientStore","Box","zIndex","TOOLBAR_Z_INDEX","Tooltip","Text","Stack","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":"gwBAiCMA,EAA0B,IAE1BC,EAAgB,QAEhBC,EAAqB,CACzB,gCACA,sCACA,0CACA,kCACA,qCACA,qCAAqC,EACrCC,KAAK,IAAI,EAELC,EAAwBC,GAAiC,CAC7D,OAAQA,EAAa,CACnB,IAAK,aACI,MAAA,uDACT,IAAK,cACI,MAAA,8BACT,IAAK,gBACI,MAAA,mDAAA,CAEb,EAEMC,EAAeA,CACnBC,EACAF,IAEOE,EAAOC,OAAkBC,GAC1BJ,EAAAA,IAAkB,iBAAmB,CAACI,EAAMC,WAAWC,YAGvDN,IAAkB,eAAiB,CAACI,EAAMC,WAAWE,OAAOC,OAIjE,EAQUC,EAAKA,CAAC,CAAEC,cAAAA,EAAeC,iBAAAA,CAAwB,IAAM,CAC1D,KAAA,CAAEC,OAAAA,GAAWC,kBAAgB,EAE7B,CAACb,EAAec,CAAgB,EACpCC,EAAAA,QAAMC,SAAwB,aAAa,EACvC,CAACC,EAAWC,CAAY,EAAIH,EAAAA,QAAMC,SAAS,IAC/CG,EAAAA,iBAAiBC,4BACnB,EACM,CAACC,EAAaC,CAAc,EAAIP,EAAAA,QAAMC,SAAS,EAAK,EACpD,CAACO,EAAoBC,CAAqB,EAAIT,EAAAA,QAAMC,SAAS,EAAK,EAElE,CAACS,EAAqBC,CAAsB,EAAIX,EAAAA,QAAMC,SAE1D,EAEFD,EAAAA,QAAMY,UAAU,IAAM,CACpBD,EAAuBE,MAAS,CAAA,EAC/B,CAAC5B,CAAa,CAAC,EAElBe,EAAAA,QAAMY,UAAU,IAAM,OACd,KAAA,CAAEE,UAAAA,EAAY,GAAOC,iBAAAA,EAAmB,CAAA,CAAG,EAAIb,GAAa,CAAC,EAC7Dc,GAAcnB,EAAAA,EAAOoB,MAAMC,MAAMC,QAAnBtB,YAAAA,EAA0BuB,UAE1CN,OAAAA,GAAa,CAACE,GAAerB,IAC/BE,EAAOwB,SAAS,CAAEN,iBAAAA,CAAAA,CAAkB,EAGhCO,OAAOC,KAAKR,CAAgB,EAAES,OAAS,GACzCzB,EAAiB,YAAY,GAI7B,CAACe,GAAaE,GAChBnB,EAAO4B,WAAW,CAAE7B,iBAAAA,CAAAA,CAAkB,EAGjC,IAAM,QACPC,EAAAA,EAAOoB,MAAMC,MAAMC,QAAnBtB,MAAAA,EAA0BuB,WAC5BvB,EAAO4B,WAAW,CAAE7B,iBAAAA,CAAAA,CAAkB,CAE1C,CAAA,EACC,CAACD,EAAeC,EAAkBM,EAAWL,EAAQE,CAAgB,CAAC,EAGzEC,EAAAA,QAAMY,UAAU,IAAM,CACdc,MAAAA,EAAiBC,GAAqB,CACtCA,EAAEC,SAAWD,EAAEE,MAAQjD,GAA2B,CAAC+C,EAAEG,SACvDH,EAAEI,eAAe,EACDC,EAAAA,GAAS,CAACA,CAAI,EAElC,EAEOC,cAAAA,iBAAiB,UAAWP,CAAa,EACzC,IAAM,CACJQ,OAAAA,oBAAoB,UAAWR,CAAa,CACrD,CACF,EAAG,EAAE,EAECS,MAAAA,EAAenC,EAAAA,QAAMoC,OAAuB,IAAI,EAChDC,EAAerC,EAAAA,QAAMoC,OAAuB,IAAI,EAChD,CAAEE,SAAAA,EAAUC,WAAAA,EAAYC,kBAAAA,EAAmBC,cAAAA,GAC/CC,eAAa,CACXC,WAAYR,EACZS,YAAa,CAACtC,CAAW,EACzBuC,gBAAiB,CAAEC,IAAK,GAAIC,MAAO,EAAA,CAAG,CACvC,EAEGC,EAASC,6BAA2B/C,CAAS,EACnD,GAAI,CAAC8C,GAAU,EAAC9C,GAAAA,MAAAA,EAAWY,WAClB,OAAA,KAGH3B,MAAAA,EACJ6D,EAAOvD,SAAW,KAAOP,EAAa8D,EAAO7D,OAAQF,CAAa,EAAI,CAAE,EAE1E,+BACGiE,MACC,CAAA,QAASf,EACT,SAAS,QACT,MAAO,CACLW,IAAKR,EAASQ,IAAM,KACpBC,MAAOT,EAASS,MAAQ,KACxBI,OAAQC,EAAAA,eACV,CAAA,EAEC9C,EACEN,EAAAA,QAAA,cAAAqD,EAAAA,QAAA,CACC,KAAK,OACL,MACGrD,EAAA,QAAA,cAAAsD,EAAA,KAAA,CAAK,GAAG,OAAO,KAAK,GAAG,EAAA,gBAErBtD,EAAAA,QAAA,cAAAuD,EAAAA,MAAA,CAAM,QAAQ,eAAe,GAAG,GAC/B,EAAAvD,EAAAA,QAAA,cAACwD,EAAAA,IAAI,KAAA,MAAI,EAAM,8BAAIA,EAAAA,IAAI,KAAA,GAAC,CAC1B,CACF,EAEF,GAAIC,EAAAA,oBAEHzD,EAAA,QAAA,cAAAuD,EAAA,MAAA,CACC,OAAO,KACP,QAAQ,IACR,MAAM,SACN,QAAQ,SACR,EAAE,KACF,EAAE,KACF,cAAef,EACf,gBAAgB,YAChB,MAAO,CACLkB,OAAQnB,EAAa,WAAa,OAClCoB,YAAa,OACbC,WAAY,OACZC,UAAW,yCACb,CAAA,EAEC7D,EAAAA,QAAA,cAAAkD,EAAA,IAAA,CACC,MAAO,CACLY,UAAW,aACXC,gBAAiB,eAGnB,CAAA,EAAA/D,EAAAA,QAAA,cAACgE,EAAAA,YACC,CAAA,QAAS,IAAM,CACRvB,EAAcwB,SACjB1D,EAAe,EAAK,CACtB,EAEF,WAAY,GAAM,CAEtB,CACF,CACF,EAEAP,EAAA,QAAA,cAACuD,QACC,CAAA,UAAU,SACV,gBAAgB,YAChB,QAAQ,IACR,SAAS,SACT,MAAO,CACLW,MAAOrF,EACPsF,UAAWrF,EACX+E,UAAW,uCAAA,GAIZ7D,EAAAA,QAAA,cAAAuD,QAAA,CACC,EAAE,OACF,EAAE,IACF,QAAQ,gBACR,UAAU,MACV,MAAM,SACN,IAAI,IACJ,aAAa,KACb,cAAef,EACf,MAAO,CACL4B,UAAW,aACXV,OAAQnB,EAAa,WAAa,OAClCoB,YAAa,OACbC,WAAY,MAAA,GAIb5D,EAAAA,QAAA,cAAAuD,QAAA,CAAM,MAAM,SAAS,IAAI,MAAM,MAAO,CAAEc,SAAU,EAAGC,KAAM,CAAA,GACzDtE,EAAAA,QAAA,cAAAuD,QAAA,CACC,QAAQ,cACR,MAAM,SACN,MAAO,CACLG,OAAQnB,EAAa,WAAa,OAClCoB,YAAa,OACbC,WAAY,MAAA,EAEd,cAAgBjC,GAA0B,CAExCA,EAAE4C,gBAAgB,EAClB/B,EAAkBb,CAAC,CAAA,GAGpB3B,EAAAA,QAAA,cAAAwE,EAAA,KAAA,CAAK,MAAM,OAAO,KAAK,IAAI,KAAMC,EAAAA,aAAc,cAAW,GAAA,CAC7D,EACCzE,EAAA,QAAA,cAAAuD,EAAAA,MAAA,CACC,MAAM,SACN,IAAI,MACJ,cAAgB5B,GAA0BA,EAAE4C,iBAAgB,0BAE3DG,EAAiB,iBAAA,KAAjB,CACC,KAAK,IACL,KAAK,SACL,MAAOzF,EACP,cAAgB0F,GAAuB,CACrC,GAAI,CAACA,EAAK,OAEJC,MAAAA,EAAgB/E,EAAOoB,MAAMC,MAAMC,MAEnCJ,EAAmBO,OAAOC,MAC9BqD,GAAAA,YAAAA,EAAe7D,mBAAoB,CAAA,CACrC,EAIIiC,EAAOvD,SAAW,MAAQsB,EAAiBS,OAAS,IAC7BtC,EACvB8D,EAAO7D,OACPwF,CACF,EAAEE,KAAMC,GAAMA,EAAEjD,MAAQd,EAAiB,CAAC,CAAC,GAGzClB,EAAOwB,SAAS,CACd,GAAGuD,EACH7D,iBAAkB,CAAA,CAAC,CACpB,GAILhB,EAAiB4E,CAAG,CAAA,GAGrB3E,EAAAA,QAAA,cAAA0E,EAAA,iBAAiB,OAAjB,CACC,MAAM,aACN,MAAO,CAAER,MAAO,MAAA,GAAS,KAG3B,EACAlE,EAAAA,QAAA,cAAC0E,mBAAiB,OAAjB,CACC,MAAM,cACN,MAAO,CAAER,MAAO,MAAA,GAAS,QAG3B,EACAlE,EAAAA,QAAA,cAAC0E,mBAAiB,OAAjB,CACC,MAAM,gBACN,MAAO,CAAER,MAAO,MAAO,CAAA,EAAE,UAG3B,CACF,0BAECb,EAAAA,QAAQ,CAAA,MAAM,WAAeI,GAAAA,EAC5B,kBAAA,EAAAzD,EAAAA,QAAA,cAAC+E,UACC,KAAK,IACL,QAASvE,EAAqB,UAAY,QAC1C,MAAOA,EAAqB,OAAS,OACrC,YAAa,CACXwE,KAAMC,EAAAA,kBACNC,IAAK,uBAAA,EAEP,aACE1E,EACI,CAAEwE,KAAMG,EAAAA,YAAaD,IAAK,mBAAA,EAC1B,CAAEF,KAAMI,EAAAA,aAAcF,IAAK,mBAAA,EAEjC,QAAS,IAAMzE,EAA6B4E,GAAA,CAACA,CAAC,CAAE,CAAA,CAEpD,CACF,CACF,EAGCrF,EAAAA,QAAA,cAAAuD,EAAAA,MAAA,CACC,MAAM,SACN,IAAI,MACJ,MAAO,CAAE+B,WAAY,GACrB,cAAgB3D,GAA0BA,EAAE4C,gBAAAA,GAE3CvE,EAAAA,QAAA,cAAAuD,QAAA,CAAM,MAAM,SAAS,IAAI,OACvBvD,UAAA,cAAA+E,EAAA,OAAA,CACC,KAAK,IACL,QAAQ,UACR,YAAa,CAAEC,KAAMO,EAAAA,OAAQL,IAAK,MAAO,EACzC,QAAS,IAAM,CACb/E,EAAwBqF,IAAA,CAAE,GAAGA,EAAM1E,UAAW,EAAA,EAAQ,CAAA,GACtD,MAGJ,EACAd,UAAA,cAACqD,EAAAA,SAAQ,MAAM,mBAAuBI,GAAAA,EAAAA,kBAAAA,0BACnCsB,EAAAA,OACC,CAAA,KAAK,IACL,QAAQ,UACR,YAAa,CAAEC,KAAMS,EAAAA,UAAWP,IAAK,UACrC,EAAA,QAAS,IAAM3E,EAAe,EAAI,CAAA,CAAE,CAExC,CACF,CACF,CACF,EAGCC,GACER,EAAA,QAAA,cAAAkD,EAAA,IAAA,CAAI,aAAa,IAAA,EACflD,EAAA,QAAA,cAAA0F,EAAA,oBAAA,IAAmB,CACtB,EAID1F,EAAA,QAAA,cAAAkD,EAAA,IAAA,CACC,QAASb,EACT,EAAE,IACF,SAAS,OACT,MAAO,CAAEsD,UAAW,mBAAoB,CAAA,EAEvC3C,EAAOvD,SAAW,QACjBO,EAAA,QAAA,cAACkD,OAAI,GAAG,IAAI,GAAG,IAAI,MAAO,CAAE0C,WAAY,KAAA,CACtC,EAAA5F,EAAA,QAAA,cAACsD,EACC,KAAA,CAAA,GAAG,OACH,KAAK,IACL,OAAO,SACP,MACEN,EAAO6C,QAAU,oBAAsB,UAAY,KAGpD7C,EAAAA,EAAO8C,OACV,CACF,EACE3G,EAAOqC,SAAW,EACnBxB,EAAAA,QAAA,cAAAkD,EAAAA,IAAA,CAAI,GAAG,IAAI,GAAG,IAAI,MAAO,CAAE0C,WAAY,KAAA,CACtC,EAAA5F,EAAA,QAAA,cAACsD,EAAAA,KAAK,CAAA,GAAG,OAAO,KAAK,IAAI,OAAO,SAAS,MAAM,SAAA,EAC5CtE,EAAqBC,CAAa,CACrC,CACF,EAEAE,EAAO4G,IACL1G,GAAAW,EAAAA,QAAA,cAACgG,EACC,SAAA,CAAA,IAAK3G,EAAMwC,IACX,MAAAxC,EACA,WAAYA,EAAM4G,WAClB,WAAY5G,EAAMwC,MAAQnB,EAC1B,QAAS,IAAM,CACbC,KACEuF,GAAKA,IAAM7G,EAAMwC,IAAMhB,OAAYxB,EAAMwC,GAC3C,CAAA,GAGL,CAEL,0BAGCsE,EAAU,UAAA,CAAA,OAAAhH,EAAgB,aAAAkD,CAA2B,CAAA,CACxD,CAEJ,CAEJ"}

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

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

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\";\n\nimport { FOCUS_ERRORS } from \"./helpers\";\n\nconst byKey = <T extends { key: string }>(items: T[]) => {\n  return items.reduce((acc, item) => ({ ...acc, [item.key]: item }), {});\n};\n\n/**\n * This is the main module that will house core logic for the toolbar. It hooks\n * into the guide client state store, extracts relevant data for debugging, and\n * transforms it into easily consumable data for the toolbar - namely\n * \"annotating\" guides for its various statuses to display.\n */\n\n// Active: `true` status = good\ntype ActiveStatus = {\n  status: boolean;\n};\n\n// Targetable: `true` status = good\ntype TargetableStatusTrue = {\n  status: true;\n};\ntype TargetableStatusFalse = {\n  status: false;\n  reason: string;\n  message: string;\n};\ntype TargetableStatus = TargetableStatusTrue | TargetableStatusFalse;\n\ntype ActivatableStatus = {\n  status: boolean;\n};\n\n// Archived: `false` status = good\ntype ArchivedStatus = {\n  status: boolean;\n};\n\n// Selectable:\n//  - \"returned\": Queried and resolved to return the guide from useGuide(s).\n//  - \"throttled\": Queried and resolved but being throttled, so not yet returned.\n//  - \"queried\": Queried but not resolved, because there are other higher\n//    priority guides that are ahead of this guide in the query result.\n//  - undefined: Not reachable with any of the given queries and filters.\ntype SelectionResultByLimit = {\n  one?: KnockGuideSelectionResult;\n  all?: KnockGuideSelectionResult;\n};\ntype SelectionResultByQuery = {\n  key?: SelectionResultByLimit;\n  type?: SelectionResultByLimit;\n};\ntype SelectableStatusPresent = {\n  status: \"returned\" | \"throttled\" | \"queried\";\n  query: SelectionResultByQuery;\n};\ntype SelectableStatusAbsent = {\n  status: undefined;\n};\ntype SelectableStatus = SelectableStatusPresent | SelectableStatusAbsent;\n\nexport type AnnotatedStatuses = {\n  // Individual eligibility statuses:\n  active: ActiveStatus;\n  targetable: TargetableStatus;\n  archived: ArchivedStatus;\n  // Individual qualified statuses:\n  activatable: ActivatableStatus;\n  selectable: SelectableStatus;\n};\n\ntype GuideAnnotation = AnnotatedStatuses & {\n  // Resolved eligibility based on active, targetable and archived statuses,\n  // which are backend driven evaluation results that are exposed for debugging.\n  isEligible: boolean;\n\n  // Resolved display qualification based on an activatable status, which\n  // informs \"when\" and \"where\" an eligible guide can be displayed to user.\n  isQualified: boolean;\n};\n\nexport type AnnotatedGuide = KnockGuide & {\n  orderIndex: number;\n  annotation: GuideAnnotation;\n\n  // Legacy fields, typed only to make tsc happy when we prune these out.\n  activation_location_rules?: KnockGuide[\"activation_url_patterns\"];\n  priority?: number;\n};\n\n// Exists and ordered in control but absent in switchboard (therefore not\n// included in the api response), which implies a newly created guide that has\n// never been published to switchboard.\nexport type UncommittedGuide = {\n  __typename: \"UncommittedGuide\";\n  orderIndex: number;\n  key: KnockGuide[\"key\"];\n  active: false;\n  bypass_global_group_limit: false;\n  annotation: {\n    isEligible: false;\n    isQualified: false;\n    active: {\n      status: false;\n    };\n    selectable: {\n      status: undefined;\n    };\n  };\n};\n\nexport type InspectionResultOk = {\n  status: \"ok\";\n  guides: (AnnotatedGuide | UncommittedGuide)[];\n};\ntype InspectionResultError = {\n  status: \"error\";\n  error:\n    | \"no_guides_fetched\"\n    | \"no_guide_group\"\n    | \"focus_unknown_guide\"\n    | \"focus_uncommitted_guide\"\n    | \"focus_unselectable_guide\";\n  message: string;\n};\ntype InspectionResult = InspectionResultOk | InspectionResultError;\n\ntype StoreStateSnapshot = Pick<\n  KnockGuideClientStoreState,\n  | \"location\"\n  | \"guides\"\n  | \"guideGroups\"\n  | \"ineligibleGuides\"\n  | \"debug\"\n  | \"counter\"\n  | \"queries\"\n> & {\n  throttled: boolean;\n};\n\nconst inferSelectByKeyReturnStatus = (\n  guide: KnockGuide,\n  snapshot: StoreStateSnapshot,\n  stage: KnockGuideClientGroupStage,\n  query: SelectionResultByQuery,\n): SelectableStatusPresent[\"status\"] => {\n  const includeThrottled =\n    !!query.key?.one?.metadata?.opts?.includeThrottled ||\n    !!query.key?.all?.metadata?.opts?.includeThrottled;\n\n  // If unthrottled, then it should always be returned.\n  if (guide.bypass_global_group_limit) {\n    return \"returned\";\n  }\n\n  // If resolved, expect this guide to be returned unless being throttled.\n  if (guide.key === stage.resolved) {\n    if (snapshot.throttled && !includeThrottled) {\n      return \"throttled\";\n    }\n    return \"returned\";\n  }\n\n  // If queried but not resolved, it means this guide is being shadowed by\n  // another guide with higher priority because throttled guides can be\n  // displayed only one at a time.\n  return \"queried\";\n};\n\nconst inferSelectOneByTypeReturnStatus = (\n  guide: KnockGuide,\n  snapshot: StoreStateSnapshot,\n  stage: KnockGuideClientGroupStage,\n  query: SelectionResultByQuery,\n): SelectableStatusPresent[\"status\"] => {\n  const includeThrottled = !!query.type?.one?.metadata?.opts?.includeThrottled;\n\n  const result = query.type!.one!;\n  if (result.size === 0) {\n    return \"queried\";\n  }\n\n  // There may be multiple unthrottled guides of the same type, being queried\n  // by type to return a single guide, for example: useGuide({ type: \"card\" }).\n  //\n  // So it is possible for an unthrottled guide to be shadowed by another\n  // unthrottled guide of the same type with higher priority, so we need to\n  // look at the query result to determine its return status.\n  if (guide.bypass_global_group_limit) {\n    const guides = [...result.values()];\n    const first = guides[0]!;\n\n    if (guide.key !== first.key) {\n      // Being shadowed by another guide with higher priority.\n      return \"queried\";\n    }\n    return \"returned\";\n  }\n\n  // If resolved, expect this guide to be returned unless being throttled.\n  if (guide.key === stage.resolved) {\n    if (snapshot.throttled && !includeThrottled) {\n      return \"throttled\";\n    }\n    return \"returned\";\n  }\n\n  // If queried but not resolved, it means this guide is being shadowed by\n  // another guide with higher priority because throttled guides can be\n  // displayed only one at a time.\n  return \"queried\";\n};\n\nconst inferSelectAllByTypeReturnStatus = (\n  guide: KnockGuide,\n  snapshot: StoreStateSnapshot,\n  stage: KnockGuideClientGroupStage,\n  query: SelectionResultByQuery,\n): SelectableStatusPresent[\"status\"] => {\n  const result = query.type!.all!;\n  if (result.size === 0) {\n    return \"queried\";\n  }\n\n  const guides = [...result.values()];\n  const first = guides[0]!;\n\n  // Might want to consider moving this up to do once.\n  const guidesByKey: Record<KnockGuide[\"key\"], KnockGuide> = byKey(guides);\n\n  // If includeThrottled given, then expect all selected guides to be returned.\n  const includeThrottled = !!query.type?.all?.metadata?.opts?.includeThrottled;\n  if (includeThrottled) {\n    return guidesByKey[guide.key] ? \"returned\" : \"queried\";\n  }\n\n  // If the first selected guide is unthrottled or resolved, then we should\n  // have at minimum one guide to return, and potentially more based on whether\n  // we are throttling currently and which other guides are unthrottled.\n  if (first.bypass_global_group_limit || first.key === stage.resolved) {\n    if (!guidesByKey[guide.key]) {\n      return \"queried\";\n    }\n    if (snapshot.throttled) {\n      return guide.bypass_global_group_limit ? \"returned\" : \"throttled\";\n    }\n    return \"returned\";\n  }\n\n  return \"queried\";\n};\n\nconst inferSelectReturnStatus = (\n  guide: KnockGuide,\n  snapshot: StoreStateSnapshot,\n  stage: KnockGuideClientGroupStage,\n  query: SelectionResultByQuery,\n) => {\n  // Querying by key can only return up to a max of one guide, regardless of\n  // useGuide or useGuides, and should take precedence in status designation.\n  if (query.key) {\n    return inferSelectByKeyReturnStatus(guide, snapshot, stage, query);\n  }\n\n  if (query.type?.all) {\n    return inferSelectAllByTypeReturnStatus(guide, snapshot, stage, query);\n  }\n  if (query.type?.one) {\n    return inferSelectOneByTypeReturnStatus(guide, snapshot, stage, query);\n  }\n\n  // Should not happen but just for completeness.\n  return undefined;\n};\n\nconst toSelectableStatus = (\n  guide: KnockGuide,\n  snapshot: StoreStateSnapshot,\n  stage: KnockGuideClientGroupStage | undefined,\n): SelectableStatus => {\n  if (!stage || stage.status === \"open\") {\n    return { status: undefined };\n  }\n\n  const query = {\n    key: (stage.results.key || {})[guide.key],\n    type: (stage.results.type || {})[guide.type],\n  };\n\n  const queried = Boolean(query.key || query.type);\n  if (!queried) {\n    // No present query in the current location can select this guide.\n    return { status: undefined };\n  }\n\n  const status = inferSelectReturnStatus(guide, snapshot, stage, query);\n  if (!status) {\n    return { status: undefined };\n  }\n\n  return { status, query };\n};\n\nconst toIneligibilityStatus = (\n  guide: KnockGuide,\n  marker?: KnockGuideIneligibilityMarker,\n): Partial<AnnotatedStatuses> => {\n  const statuses: Partial<AnnotatedStatuses> = {};\n\n  if (\n    marker?.reason === \"not_in_target_audience\" ||\n    marker?.reason === \"target_conditions_not_met\"\n  ) {\n    statuses.targetable = {\n      status: false,\n      reason: marker.reason,\n      message: marker.message,\n    };\n  }\n\n  if (\n    marker?.reason === \"marked_as_archived\" ||\n    (guide.steps || []).every((s) => !!s.message.archived_at)\n  ) {\n    statuses.archived = {\n      status: true,\n    };\n  }\n\n  if (marker?.reason === \"guide_not_active\") {\n    statuses.active = {\n      status: false,\n    };\n  }\n\n  return statuses;\n};\n\nconst resolveIsEligible = ({\n  active,\n  targetable,\n  archived,\n}: AnnotatedStatuses) => {\n  if (!active.status) return false;\n  if (!targetable.status) return false;\n  if (archived.status) return false;\n  return true;\n};\n\nexport const resolveIsQualified = ({\n  activatable,\n  selectable,\n}: AnnotatedStatuses) => {\n  if (!activatable.status) return false;\n  if (!selectable.status) return false;\n  return true;\n};\n\nconst annotateGuide = (\n  guide: KnockGuide,\n  orderIndex: number,\n  snapshot: StoreStateSnapshot,\n  stage: KnockGuideClientGroupStage | undefined,\n): AnnotatedGuide => {\n  const { ineligibleGuides, location } = snapshot;\n  const marker = ineligibleGuides[guide.key];\n  const ineligiblity = toIneligibilityStatus(guide, marker);\n\n  const statuses: AnnotatedStatuses = {\n    // isEligible:\n    active: ineligiblity?.active || { status: true },\n    targetable: ineligiblity?.targetable || { status: true },\n    archived: ineligiblity?.archived || { status: false },\n    // isQualified:\n    activatable: { status: checkActivatable(guide, location) },\n    selectable: toSelectableStatus(guide, snapshot, stage),\n  };\n\n  const annotation: GuideAnnotation = {\n    ...statuses,\n    isEligible: resolveIsEligible(statuses),\n    isQualified: resolveIsQualified(statuses),\n  };\n\n  return {\n    ...guide,\n    orderIndex,\n    annotation,\n  };\n};\n\nconst newUncommittedGuide = (key: KnockGuide[\"key\"], orderIndex: number) =>\n  ({\n    __typename: \"UncommittedGuide\",\n    key,\n    orderIndex,\n    active: false,\n    bypass_global_group_limit: false,\n    annotation: {\n      isEligible: false,\n      isQualified: false,\n      active: {\n        status: false,\n      },\n      selectable: {\n        status: undefined,\n      },\n    },\n  }) as UncommittedGuide;\n\nexport const useInspectGuideClientStore = (\n  runConfig: ToolbarV2RunConfig,\n): InspectionResult | undefined => {\n  const { client } = useGuideContext();\n\n  // Extract a snapshot of the client store state for debugging.\n  const snapshot: StoreStateSnapshot = useStore(client.store, (state) => {\n    const throttled = checkStateIfThrottled(state);\n\n    return {\n      location: state.location,\n      guides: state.guides,\n      guideGroups: state.guideGroups,\n      ineligibleGuides: state.ineligibleGuides,\n      debug: state.debug,\n      counter: state.counter,\n      queries: state.queries,\n      throttled,\n    };\n  });\n\n  // Not in debugging session, so noop.\n  if (!snapshot.debug?.debugging) {\n    return undefined;\n  }\n\n  // No recorded fetch requests, which implies an inflight request loading.\n  const req = Object.entries(snapshot.queries)[0];\n  if (!req || req[1].status === \"loading\") {\n    return {\n      status: \"error\",\n      error: \"no_guides_fetched\",\n      message: \"Loading...\",\n    };\n  }\n\n  // Should always be a default group so this should never happen.\n  const defaultGroup = snapshot.guideGroups[0];\n  if (!defaultGroup) {\n    return {\n      status: \"error\",\n      error: \"no_guide_group\",\n      message: \"No guide group found\",\n    };\n  }\n\n  const groupStage = client.getStage();\n\n  // Annotate guides for various eligibility, activation and query statuses\n  // that are useful for debugging purposes.\n  const orderedGuides = defaultGroup.display_sequence.map((guideKey, index) => {\n    const guide = snapshot.guides[guideKey];\n    if (!guide) {\n      return newUncommittedGuide(guideKey, index);\n    }\n\n    return annotateGuide(guide, index, snapshot, groupStage);\n  });\n\n  // Check if the focused guide actually exists and is selectable on the page.\n  const focusedGuideKey = Object.keys(runConfig.focusedGuideKeys || {})[0];\n  if (groupStage?.status === \"closed\" && focusedGuideKey) {\n    const foundGuide = orderedGuides.find((g) => g.key === focusedGuideKey);\n\n    // No such guide exists for the given focused guide key.\n    if (!foundGuide) {\n      return {\n        status: \"error\",\n        error: \"focus_unknown_guide\",\n        message: `Unable to display \\`${focusedGuideKey}\\`, ${FOCUS_ERRORS.focusUnknownGuide.toLowerCase()}.`,\n      };\n    }\n\n    // This guide exists but has never been committed and published, so it is\n    // not present in the API response.\n    if (isUncommittedGuide(foundGuide)) {\n      return {\n        status: \"error\",\n        error: \"focus_uncommitted_guide\",\n        message: `Unable to display \\`${focusedGuideKey}\\`, ${FOCUS_ERRORS.focusUncommittedGuide.toLowerCase()}.`,\n      };\n    }\n\n    // This guide exists and is present in the response, but it is not queried\n    // in the current page so it is impossible to force render this guide.\n    if (!foundGuide.annotation.selectable.status) {\n      return {\n        status: \"error\",\n        error: \"focus_unselectable_guide\",\n        message: `Unable to display \\`${focusedGuideKey}\\`, ${FOCUS_ERRORS.focusUnselectableGuide.toLowerCase()}.`,\n      };\n    }\n  }\n\n  return {\n    status: \"ok\",\n    guides: orderedGuides,\n  };\n};\n\nexport const isUncommittedGuide = (input: unknown): input is UncommittedGuide =>\n  typeof input === \"object\" &&\n  input !== null &&\n  \"__typename\" in input &&\n  (input as UncommittedGuide).__typename === \"UncommittedGuide\";\n"],"names":["byKey","items","reduce","acc","item","key","inferSelectByKeyReturnStatus","guide","snapshot","stage","query","includeThrottled","one","metadata","opts","all","bypass_global_group_limit","resolved","throttled","inferSelectOneByTypeReturnStatus","type","result","size","first","values","inferSelectAllByTypeReturnStatus","guides","guidesByKey","inferSelectReturnStatus","toSelectableStatus","status","undefined","results","Boolean","toIneligibilityStatus","marker","statuses","reason","targetable","message","steps","every","s","archived_at","archived","active","resolveIsEligible","resolveIsQualified","activatable","selectable","annotateGuide","orderIndex","ineligibleGuides","location","ineligiblity","checkActivatable","annotation","isEligible","isQualified","newUncommittedGuide","__typename","useInspectGuideClientStore","runConfig","client","useGuideContext","useStore","store","state","checkStateIfThrottled","guideGroups","debug","counter","queries","debugging","req","Object","entries","error","defaultGroup","groupStage","getStage","orderedGuides","display_sequence","map","guideKey","index","focusedGuideKey","keys","focusedGuideKeys","foundGuide","find","g","FOCUS_ERRORS","focusUnknownGuide","toLowerCase","isUncommittedGuide","focusUncommittedGuide","focusUnselectableGuide","input"],"mappings":"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"}
+{"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":"ghBAeMA,EAAoCC,GACjCA,EAAMC,OAAO,CAACC,EAAKC,KAAU,CAAE,GAAGD,EAAK,CAACC,EAAKC,GAAG,EAAGD,CAAK,GAAI,CAAA,CAAE,EAyIjEE,EAA+BA,CACnCC,EACAC,EACAC,EACAC,IACsC,qBACtC,MAAMC,EACJ,CAAC,GAACD,GAAAA,GAAAA,GAAAA,EAAAA,EAAMV,QAANU,YAAAA,EAAaE,MAAbF,YAAAA,EAAkBG,WAAlBH,YAAAA,EAA4BI,OAA5BJ,MAAAA,EAAkCC,mBACpC,CAAC,GAACD,GAAAA,GAAAA,GAAAA,EAAAA,EAAMV,QAANU,YAAAA,EAAaK,MAAbL,YAAAA,EAAkBG,WAAlBH,YAAAA,EAA4BI,OAA5BJ,MAAAA,EAAkCC,kBAGtC,OAAIJ,EAAMS,0BACD,WAILT,EAAMF,MAAQI,EAAMQ,SAClBT,EAASU,WAAa,CAACP,EAClB,YAEF,WAMF,SACT,EAEMQ,EAAmCA,CACvCZ,EACAC,EACAC,EACAC,IACsC,aACtC,MAAMC,EACJ,CAAC,GAACD,GAAAA,GAAAA,GAAAA,EAAAA,EAAMU,SAANV,YAAAA,EAAcE,MAAdF,YAAAA,EAAmBG,WAAnBH,YAAAA,EAA6BI,OAA7BJ,MAAAA,EAAmCC,kBAEjCU,EAASX,EAAMU,OAAQR,IACzBS,GAAAA,EAAOC,OAAS,EACX,MAAA,UAST,GAAIf,EAAMS,0BAA2B,CAE7BO,MAAAA,EADS,CAAC,GAAGF,EAAOG,QAAQ,EACb,CAAC,EAElBjB,OAAAA,EAAMF,MAAQkB,EAAMlB,IAEf,UAEF,UAAA,CAILE,OAAAA,EAAMF,MAAQI,EAAMQ,SAClBT,EAASU,WAAa,CAACP,EAClB,YAEF,WAMF,SACT,EAEMc,EAAmCA,CACvClB,EACAC,EACAC,EACAC,IACsC,aAChCW,MAAAA,EAASX,EAAMU,OAAQL,IACzBM,GAAAA,EAAOC,OAAS,EACX,MAAA,UAGT,MAAMI,EAAS,CAAC,GAAGL,EAAOG,QAAQ,EAC5BD,EAAQG,EAAO,CAAC,EAGhBC,EAAqD3B,EAAM0B,CAAM,EAKvE,OADIhB,GAAAA,GAAAA,GAAAA,EAAAA,EAAMU,SAANV,YAAAA,EAAcK,MAAdL,YAAAA,EAAmBG,WAAnBH,YAAAA,EAA6BI,OAA7BJ,MAAAA,EAAmCC,iBAE9BgB,EAAYpB,EAAMF,GAAG,EAAI,WAAa,WAM3CkB,EAAMP,2BAA6BO,EAAMlB,MAAQI,EAAMQ,WACpDU,EAAYpB,EAAMF,GAAG,EAGtBG,EAASU,UACJX,EAAMS,0BAA4B,WAAa,YAEjD,WAGF,SACT,EAEMY,EAA0BA,CAC9BrB,EACAC,EACAC,EACAC,IACG,SAGH,GAAIA,EAAMV,MACR,OAAOM,EAA6BC,EAAOC,EAAUC,EAAOC,CAAK,EAG/DA,IAAAA,EAAAA,EAAMU,SAANV,MAAAA,EAAcK,IAChB,OAAOU,EAAiClB,EAAOC,EAAUC,EAAOC,CAAK,EAEnEA,IAAAA,EAAAA,EAAMU,SAANV,MAAAA,EAAcE,IAChB,OAAOO,EAAiCZ,EAAOC,EAAUC,EAAOC,CAAK,CAKzE,EAEMmB,EAAqBA,CACzBtB,EACAC,EACAC,IACqB,CACrB,GAAI,CAACA,GAASA,EAAMqB,SAAW,OACtB,MAAA,CAAEA,OAAQC,MAAU,EAG7B,MAAMrB,EAAQ,CACZV,OAAQS,EAAMuB,QAAQhC,OAAS,CAAC,GAAGO,EAAMF,GAAG,EAC5Ce,QAASX,EAAMuB,QAAQZ,QAAU,CAAA,GAAIb,EAAM0B,IAAI,CACjD,EAGA,GAAI,CADYC,GAAQxB,EAAMV,OAASU,EAAMU,QAGpC,MAAA,CAAEU,OAAQC,MAAU,EAG7B,MAAMD,EAASF,EAAwBrB,EAAOC,EAAUC,EAAOC,CAAK,EACpE,OAAKoB,EAIE,CAAEA,OAAAA,EAAQpB,MAAAA,CAAM,EAHd,CAAEoB,OAAQC,MAAU,CAI/B,EAEMI,EAAwBA,CAC5B5B,EACA6B,IAC+B,CAC/B,MAAMC,EAAuC,CAAC,EAE9C,QACED,GAAAA,YAAAA,EAAQE,UAAW,2BACnBF,GAAAA,YAAAA,EAAQE,UAAW,+BAEnBD,EAASE,WAAa,CACpBT,OAAQ,GACRQ,OAAQF,EAAOE,OACfE,QAASJ,EAAOI,OAClB,KAIAJ,GAAAA,YAAAA,EAAQE,UAAW,uBAClB/B,EAAMkC,OAAS,CAAA,GAAIC,MAAOC,GAAM,CAAC,CAACA,EAAEH,QAAQI,WAAW,KAExDP,EAASQ,SAAW,CAClBf,OAAQ,EACV,IAGEM,GAAAA,YAAAA,EAAQE,UAAW,qBACrBD,EAASS,OAAS,CAChBhB,OAAQ,EACV,GAGKO,CACT,EAEMU,EAAoBA,CAAC,CACzBD,OAAAA,EACAP,WAAAA,EACAM,SAAAA,CACiB,IACb,GAACC,EAAOhB,QACR,CAACS,EAAWT,QACZe,EAASf,QAIFkB,EAAqBA,CAAC,CACjCC,YAAAA,EACAC,WAAAA,CACiB,IACb,GAACD,EAAYnB,QACb,CAACoB,EAAWpB,QAIZqB,EAAgBA,CACpB5C,EACA6C,EACA5C,EACAC,IACmB,CACb,KAAA,CAAE4C,iBAAAA,EAAkBC,SAAAA,CAAAA,EAAa9C,EACjC4B,EAASiB,EAAiB9C,EAAMF,GAAG,EACnCkD,EAAepB,EAAsB5B,EAAO6B,CAAM,EAElDC,EAA8B,CAElCS,QAAQS,GAAAA,YAAAA,EAAcT,SAAU,CAAEhB,OAAQ,EAAK,EAC/CS,YAAYgB,GAAAA,YAAAA,EAAchB,aAAc,CAAET,OAAQ,EAAK,EACvDe,UAAUU,GAAAA,YAAAA,EAAcV,WAAY,CAAEf,OAAQ,EAAM,EAEpDmB,YAAa,CAAEnB,OAAQ0B,EAAAA,iBAAiBjD,EAAO+C,CAAQ,CAAE,EACzDJ,WAAYrB,EAAmBtB,EAAOC,EAAUC,CAAK,CACvD,EAEMgD,EAA8B,CAClC,GAAGpB,EACHqB,WAAYX,EAAkBV,CAAQ,EACtCsB,YAAaX,EAAmBX,CAAQ,CAC1C,EAEO,MAAA,CACL,GAAG9B,EACH6C,WAAAA,EACAK,WAAAA,CACF,CACF,EAEMG,EAAsBA,CAACvD,EAAwB+C,KAClD,CACCS,WAAY,mBACZxD,IAAAA,EACA+C,WAAAA,EACAN,OAAQ,GACR9B,0BAA2B,GAC3ByC,WAAY,CACVC,WAAY,GACZC,YAAa,GACbb,OAAQ,CACNhB,OAAQ,EACV,EACAoB,WAAY,CACVpB,OAAQC,MAAAA,CACV,CAEJ,GAEW+B,EACXC,GACiC,OAC3B,KAAA,CAAEC,OAAAA,GAAWC,kBAAgB,EAG7BzD,EAA+B0D,EAAAA,SAASF,EAAOG,MAAkBC,GAAA,CAC/DlD,MAAAA,EAAYmD,wBAAsBD,CAAK,EAEtC,MAAA,CACLd,SAAUc,EAAMd,SAChB5B,OAAQ0C,EAAM1C,OACd4C,YAAaF,EAAME,YACnBjB,iBAAkBe,EAAMf,iBACxBkB,MAAOH,EAAMG,MACbC,QAASJ,EAAMI,QACfC,QAASL,EAAMK,QACfvD,UAAAA,CACF,CAAA,CACD,EAIKwD,EAAmBC,EAAMC,OAE7B7C,MAAS,EAGP,GAAA,GAACvB,EAAAA,EAAS+D,QAAT/D,MAAAA,EAAgBqE,WACZ9C,OAIT,MAAM+C,EAAMC,OAAOC,QAAQxE,EAASiE,OAAO,EAAE,CAAC,EAC9C,GAAI,CAACK,GAAOA,EAAI,CAAC,EAAEhD,SAAW,UACrB,MAAA,CACLA,OAAQ,QACRmD,MAAO,oBACPzC,QAAS,YACX,EAII0C,MAAAA,EAAe1E,EAAS8D,YAAY,CAAC,EAC3C,GAAI,CAACY,EACI,MAAA,CACLpD,OAAQ,QACRmD,MAAO,iBACPzC,QAAS,sBACX,EAGI2C,MAAAA,EAAanB,EAAOoB,SAAS,EAM7BC,EAAc,CAACF,GAAcA,EAAWrD,SAAW,OAKrDwD,IAAAA,EACAD,GAAeX,EAAiBa,QAClCD,EAAgBZ,EAAiBa,SAEjCD,EAAgBJ,EAAaM,iBAAiBC,IAAI,CAACC,EAAUC,IAAU,CAC/DpF,MAAAA,EAAQC,EAASkB,OAAOgE,CAAQ,EACtC,OAAKnF,EAGE4C,EAAc5C,EAAOoF,EAAOnF,EAAU2E,CAAU,EAF9CvB,EAAoB8B,EAAUC,CAAK,CAEW,CACxD,EAEIN,IACHX,EAAiBa,QAAUD,IAKzBM,MAAAA,EAAkBb,OAAOc,KAAK9B,EAAU+B,kBAAoB,CAAA,CAAE,EAAE,CAAC,EACnEX,IAAAA,GAAAA,YAAAA,EAAYrD,UAAW,UAAY8D,EAAiB,CACtD,MAAMG,EAAaT,EAAcU,KAAYC,GAAAA,EAAE5F,MAAQuF,CAAe,EAGtE,GAAI,CAACG,EACI,MAAA,CACLjE,OAAQ,QACRmD,MAAO,sBACPzC,QAAS,uBAAuBoD,CAAe,OAAOM,EAAAA,aAAaC,kBAAkBC,aAAa,GACpG,EAKEC,GAAAA,EAAmBN,CAAU,EACxB,MAAA,CACLjE,OAAQ,QACRmD,MAAO,0BACPzC,QAAS,uBAAuBoD,CAAe,OAAOM,EAAAA,aAAaI,sBAAsBF,aAAa,GACxG,EAKF,GAAI,CAACL,EAAWtC,WAAWP,WAAWpB,OAC7B,MAAA,CACLA,OAAQ,QACRmD,MAAO,2BACPzC,QAAS,uBAAuBoD,CAAe,OAAOM,EAAAA,aAAaK,uBAAuBH,aAAa,GACzG,CACF,CAGK,MAAA,CACLtE,OAAQ,KACRJ,OAAQ4D,CACV,CACF,EAEae,EAAsBG,GACjC,OAAOA,GAAU,UACjBA,IAAU,MACV,eAAgBA,GACfA,EAA2B3C,aAAe"}