@knocklabs/react 0.11.16 → 0.11.17

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/CHANGELOG.md CHANGED
@@ -1,5 +1,14 @@
1
1
  # Changelog
2
2
 
3
+ ## 0.11.17
4
+
5
+ ### Patch Changes
6
+
7
+ - ee35de2: [Guides] Only re-subscribe per listenForUpdates when exiting debugging in guide toolbar v2
8
+ - Updated dependencies [ee35de2]
9
+ - @knocklabs/react-core@0.13.11
10
+ - @knocklabs/client@0.21.10
11
+
3
12
  ## 0.11.16
4
13
 
5
14
  ### Patch Changes
@@ -1,2 +1,2 @@
1
- "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const I=require("@knocklabs/client"),z=require("@knocklabs/react-core"),E=require("@telegraph/button"),K=require("@telegraph/icon"),o=require("@telegraph/layout"),f=require("@telegraph/segmented-control"),h=require("@telegraph/tooltip"),k=require("@telegraph/typography"),c=require("lucide-react"),A=require("react"),L=require("../KnockButton.js"),H=require("../shared.js");;/* empty css */const j=require("./FocusChin.js"),V=require("./GuideContextDetails.js"),F=require("./GuideRow.js"),w=require("./helpers.js"),M=require("./useDraggable.js"),W=require("./useInspectGuideClientStore.js"),Y=a=>a&&typeof a=="object"&&"default"in a?a:{default:a},e=Y(A),X=".",N="540px",U=["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(", "),G=({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),Z=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."}},O=(a,l)=>a.filter(i=>!(l==="only-eligible"&&!i.annotation.isEligible||l==="only-active"&&!i.annotation.active.status)),$=({readyToTarget:a})=>{const{client:l}=z.useGuideContext(),[i,g]=e.default.useState("only-active"),[s,q]=e.default.useState(()=>I.KnockGuideClient.getToolbarRunConfigFromUrl()),[S,p]=e.default.useState(!1),[d,B]=e.default.useState(!1),[P,C]=e.default.useState();e.default.useEffect(()=>{C(void 0)},[i]),e.default.useEffect(()=>{var y;const{isVisible:t=!1,focusedGuideKeys:n={}}=s||{},u=(y=l.store.state.debug)==null?void 0:y.debugging;return t&&!u&&a&&(l.setDebug({focusedGuideKeys:n}),Object.keys(n).length>0&&g("all-guides")),()=>{l.unsetDebug()}},[a,s,l,g]),e.default.useEffect(()=>{const t=n=>{n.ctrlKey&&n.key===X&&!n.repeat&&(n.preventDefault(),p(u=>!u))};return window.addEventListener("keydown",t),()=>{window.removeEventListener("keydown",t)}},[]);const D=e.default.useRef(null),v=e.default.useRef(null),{position:R,isDragging:b,handlePointerDown:m,hasDraggedRef:T}=M.useDraggable({elementRef:D,reclampDeps:[S],initialPosition:{top:16,right:16}}),r=W.useInspectGuideClientStore(s);if(!r||!(s!=null&&s.isVisible))return null;const x=r.status==="ok"?O(r.guides,i):[];return e.default.createElement(o.Box,{tgphRef:D,position:"fixed",style:{top:R.top+"px",right:R.right+"px",zIndex:H.TOOLBAR_Z_INDEX}},S?e.default.createElement(h.Tooltip,{side:"left",label:e.default.createElement(k.Text,{as:"span",size:"1"},"Guide Toolbar",e.default.createElement(o.Stack,{display:"inline-block",ml:"3"},e.default.createElement(G,null,"ctrl")," + ",e.default.createElement(G,null,"."))),...w.sharedTooltipProps},e.default.createElement(o.Stack,{border:"px",rounded:"4",align:"center",justify:"center",w:"10",h:"10",onPointerDown:m,backgroundColor:"surface-1",style:{cursor:b?"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(L.KnockButton,{onClick:()=>{T.current||p(!1)},positioned:!1})))):e.default.createElement(o.Stack,{direction:"column",backgroundColor:"surface-1",rounded:"4",overflow:"hidden",style:{width:N,boxShadow:U,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:m,style:{boxSizing:"border-box",cursor:b?"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:b?"grabbing":"grab",touchAction:"none",userSelect:"none"},onPointerDown:t=>{t.stopPropagation(),m(t)}},e.default.createElement(K.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(f.SegmentedControl.Root,{size:"1",type:"single",value:i,onValueChange:t=>{if(!t)return;const n=l.store.state.debug,u=Object.keys((n==null?void 0:n.focusedGuideKeys)||{});r.status==="ok"&&u.length>0&&(O(r.guides,t).find(_=>_.key===u[0])||l.setDebug({...n,focusedGuideKeys:{}})),g(t)}},e.default.createElement(f.SegmentedControl.Option,{value:"all-guides",style:{width:"54px"}},"All"),e.default.createElement(f.SegmentedControl.Option,{value:"only-active",style:{width:"54px"}},"Active"),e.default.createElement(f.SegmentedControl.Option,{value:"only-eligible",style:{width:"54px"}},"Eligible")),e.default.createElement(h.Tooltip,{label:"Settings",...w.sharedTooltipProps},e.default.createElement(E.Button,{size:"1",variant:d?"outline":"ghost",color:d?"blue":"gray",leadingIcon:{icon:c.SlidersHorizontal,alt:"Inspect target params"},trailingIcon:d?{icon:c.ChevronDown,alt:"Hide context data"}:{icon:c.ChevronRight,alt:"Show context data"},onClick:()=>B(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(E.Button,{size:"1",variant:"outline",leadingIcon:{icon:c.LogOut,alt:"Exit"},onClick:()=>{q(t=>({...t,isVisible:!1})),l.unsetDebug()}},"Exit"),e.default.createElement(h.Tooltip,{label:"Minimize toolbar",...w.sharedTooltipProps},e.default.createElement(E.Button,{size:"1",variant:"outline",leadingIcon:{icon:c.Minimize2,alt:"Minimize"},onClick:()=>p(!0)}))))),d&&e.default.createElement(o.Box,{borderBottom:"px"},e.default.createElement(V.GuideContextDetails,null)),e.default.createElement(o.Box,{tgphRef:v,p:"1",overflow:"auto",style:{maxHeight:"calc(80vh - 96px)"}},r.status==="error"?e.default.createElement(o.Box,{px:"2",pb:"1",style:{lineHeight:"1.2"}},e.default.createElement(k.Text,{as:"span",size:"1",weight:"medium",color:r.error==="no_guides_fetched"?"default":"red"},r.message)):x.length===0?e.default.createElement(o.Box,{px:"2",pb:"1",style:{lineHeight:"1.2"}},e.default.createElement(k.Text,{as:"span",size:"1",weight:"medium",color:"default"},Z(i))):x.map(t=>e.default.createElement(F.GuideRow,{key:t.key,guide:t,orderIndex:t.orderIndex,isExpanded:t.key===P,onClick:()=>{C(n=>n&&n===t.key?void 0:t.key)}}))),e.default.createElement(j.FocusChin,{guides:x,guideListRef:v})))};exports.V2=$;
1
+ "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;
2
2
  //# sourceMappingURL=V2.js.map
@@ -1 +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};\n\nexport const V2 = ({ readyToTarget }: Props) => {\n const { client } = useGuideContext();\n\n const [displayOption, setDisplayOption] =\n React.useState<DisplayOption>(\"only-active\");\n const [runConfig, setRunConfig] = React.useState(() =>\n KnockGuideClient.getToolbarRunConfigFromUrl(),\n );\n const [isCollapsed, setIsCollapsed] = React.useState(false);\n const [isContextPanelOpen, setIsContextPanelOpen] = React.useState(false);\n\n const [expandedGuideRowKey, setExpandedGuideRowKey] = React.useState<\n string | undefined\n >();\n\n React.useEffect(() => {\n setExpandedGuideRowKey(undefined);\n }, [displayOption]);\n\n React.useEffect(() => {\n const { isVisible = false, focusedGuideKeys = {} } = runConfig || {};\n const isDebugging = client.store.state.debug?.debugging;\n if (isVisible && !isDebugging && readyToTarget) {\n client.setDebug({ focusedGuideKeys });\n\n // If focused, switch to all guides so you can see in the list.\n if (Object.keys(focusedGuideKeys).length > 0) {\n setDisplayOption(\"all-guides\");\n }\n }\n\n return () => {\n client.unsetDebug();\n };\n }, [readyToTarget, runConfig, client, setDisplayOption]);\n\n // Toggle collapsed state with Ctrl + .\n React.useEffect(() => {\n const handleKeyDown = (e: KeyboardEvent) => {\n if (e.ctrlKey && e.key === TOGGLE_COLLAPSED_HOTKEY && !e.repeat) {\n e.preventDefault();\n setIsCollapsed((prev) => !prev);\n }\n };\n\n window.addEventListener(\"keydown\", handleKeyDown);\n return () => {\n window.removeEventListener(\"keydown\", handleKeyDown);\n };\n }, []);\n\n const containerRef = React.useRef<HTMLDivElement>(null);\n const guideListRef = React.useRef<HTMLDivElement>(null);\n const { position, isDragging, handlePointerDown, hasDraggedRef } =\n useDraggable({\n elementRef: containerRef,\n reclampDeps: [isCollapsed],\n initialPosition: { top: 16, right: 16 },\n });\n\n const result = useInspectGuideClientStore(runConfig);\n if (!result || !runConfig?.isVisible) {\n return null;\n }\n\n const guides =\n result.status === \"ok\" ? filterGuides(result.guides, displayOption) : [];\n\n return (\n <Box\n tgphRef={containerRef}\n position=\"fixed\"\n style={{\n top: position.top + \"px\",\n right: position.right + \"px\",\n zIndex: TOOLBAR_Z_INDEX,\n }}\n >\n {isCollapsed ? (\n <Tooltip\n side=\"left\"\n label={\n <Text as=\"span\" size=\"1\">\n Guide Toolbar\n <Stack display=\"inline-block\" ml=\"3\">\n <Kbd>ctrl</Kbd> + <Kbd>.</Kbd>\n </Stack>\n </Text>\n }\n {...sharedTooltipProps}\n >\n <Stack\n border=\"px\"\n rounded=\"4\"\n align=\"center\"\n justify=\"center\"\n w=\"10\"\n h=\"10\"\n onPointerDown={handlePointerDown}\n backgroundColor=\"surface-1\"\n style={{\n cursor: isDragging ? \"grabbing\" : \"grab\",\n touchAction: \"none\",\n userSelect: \"none\",\n animation: \"toolbar-collapse-fade-in 150ms ease-out\",\n }}\n >\n <Box\n style={{\n transform: \"scale(0.7)\",\n transformOrigin: \"center center\",\n }}\n >\n <KnockButton\n onClick={() => {\n if (!hasDraggedRef.current) {\n setIsCollapsed(false);\n }\n }}\n positioned={false}\n />\n </Box>\n </Stack>\n </Tooltip>\n ) : (\n <Stack\n direction=\"column\"\n backgroundColor=\"surface-1\"\n rounded=\"4\"\n overflow=\"hidden\"\n style={{\n width: TOOLBAR_WIDTH,\n boxShadow: TOOLBAR_BOX_SHADOW,\n animation: \"toolbar-expand-fade-in 150ms ease-out\",\n }}\n >\n {/* Header — also acts as drag handle area */}\n <Stack\n w=\"full\"\n p=\"2\"\n justify=\"space-between\"\n direction=\"row\"\n align=\"center\"\n gap=\"2\"\n borderBottom=\"px\"\n onPointerDown={handlePointerDown}\n style={{\n boxSizing: \"border-box\",\n cursor: isDragging ? \"grabbing\" : \"grab\",\n touchAction: \"none\",\n userSelect: \"none\",\n }}\n >\n {/* Left: drag icon + segmented control + settings */}\n <Stack align=\"center\" gap=\"1_5\" style={{ minWidth: 0, flex: 1 }}>\n <Stack\n display=\"inline-flex\"\n align=\"center\"\n style={{\n cursor: isDragging ? \"grabbing\" : \"grab\",\n touchAction: \"none\",\n userSelect: \"none\",\n }}\n onPointerDown={(e: React.PointerEvent) => {\n // Already handled by parent, prevent double-fire\n e.stopPropagation();\n handlePointerDown(e);\n }}\n >\n <Icon color=\"gray\" size=\"1\" icon={GripVertical} aria-hidden />\n </Stack>\n <Stack\n align=\"center\"\n gap=\"1_5\"\n onPointerDown={(e: React.PointerEvent) => e.stopPropagation()}\n >\n <SegmentedControl.Root\n size=\"1\"\n type=\"single\"\n value={displayOption}\n onValueChange={(val: DisplayOption) => {\n if (!val) return;\n\n const debugSettings = client.store.state.debug;\n\n const focusedGuideKeys = Object.keys(\n debugSettings?.focusedGuideKeys || {},\n );\n\n // Exit out of focus if the currently focused guide is not\n // part of the selected list filter.\n if (result.status === \"ok\" && focusedGuideKeys.length > 0) {\n const currFocusedGuide = filterGuides(\n result.guides,\n val,\n ).find((g) => g.key === focusedGuideKeys[0]);\n\n if (!currFocusedGuide) {\n client.setDebug({\n ...debugSettings,\n focusedGuideKeys: {},\n });\n }\n }\n\n setDisplayOption(val);\n }}\n >\n <SegmentedControl.Option\n value=\"all-guides\"\n style={{ width: \"54px\" }}\n >\n All\n </SegmentedControl.Option>\n <SegmentedControl.Option\n value=\"only-active\"\n style={{ width: \"54px\" }}\n >\n Active\n </SegmentedControl.Option>\n <SegmentedControl.Option\n value=\"only-eligible\"\n style={{ width: \"54px\" }}\n >\n Eligible\n </SegmentedControl.Option>\n </SegmentedControl.Root>\n\n <Tooltip label=\"Settings\" {...sharedTooltipProps}>\n <Button\n size=\"1\"\n variant={isContextPanelOpen ? \"outline\" : \"ghost\"}\n color={isContextPanelOpen ? \"blue\" : \"gray\"}\n leadingIcon={{\n icon: SlidersHorizontal,\n alt: \"Inspect target params\",\n }}\n trailingIcon={\n isContextPanelOpen\n ? { icon: ChevronDown, alt: \"Hide context data\" }\n : { icon: ChevronRight, alt: \"Show context data\" }\n }\n onClick={() => setIsContextPanelOpen((v) => !v)}\n />\n </Tooltip>\n </Stack>\n </Stack>\n\n {/* Right: exit + minimize buttons */}\n <Stack\n align=\"center\"\n gap=\"1_5\"\n style={{ flexShrink: 0 }}\n onPointerDown={(e: React.PointerEvent) => e.stopPropagation()}\n >\n <Stack align=\"center\" gap=\"1_5\">\n <Button\n size=\"1\"\n variant=\"outline\"\n leadingIcon={{ icon: LogOut, alt: \"Exit\" }}\n onClick={() => {\n setRunConfig((curr) => ({ ...curr, isVisible: false }));\n client.unsetDebug();\n }}\n >\n Exit\n </Button>\n <Tooltip label=\"Minimize toolbar\" {...sharedTooltipProps}>\n <Button\n size=\"1\"\n variant=\"outline\"\n leadingIcon={{ icon: Minimize2, alt: \"Minimize\" }}\n onClick={() => setIsCollapsed(true)}\n />\n </Tooltip>\n </Stack>\n </Stack>\n </Stack>\n\n {/* Collapsible panel to show context data */}\n {isContextPanelOpen && (\n <Box borderBottom=\"px\">\n <GuideContextDetails />\n </Box>\n )}\n\n {/* Guide list content area */}\n <Box\n tgphRef={guideListRef}\n p=\"1\"\n overflow=\"auto\"\n style={{ maxHeight: \"calc(80vh - 96px)\" }}\n >\n {result.status === \"error\" ? (\n <Box px=\"2\" pb=\"1\" style={{ lineHeight: \"1.2\" }}>\n <Text\n as=\"span\"\n size=\"1\"\n weight=\"medium\"\n color={\n result.error === \"no_guides_fetched\" ? \"default\" : \"red\"\n }\n >\n {result.message}\n </Text>\n </Box>\n ) : guides.length === 0 ? (\n <Box px=\"2\" pb=\"1\" style={{ lineHeight: \"1.2\" }}>\n <Text as=\"span\" size=\"1\" weight=\"medium\" color=\"default\">\n {getEmptyStateMessage(displayOption)}\n </Text>\n </Box>\n ) : (\n guides.map((guide) => (\n <GuideRow\n key={guide.key}\n guide={guide}\n orderIndex={guide.orderIndex}\n isExpanded={guide.key === expandedGuideRowKey}\n onClick={() => {\n setExpandedGuideRowKey((k) =>\n k && k === guide.key ? undefined : guide.key,\n );\n }}\n />\n ))\n )}\n </Box>\n\n {/* Focus chin with dedicated controls */}\n <FocusChin guides={guides} guideListRef={guideListRef} />\n </Stack>\n )}\n </Box>\n );\n};\n"],"names":["TOGGLE_COLLAPSED_HOTKEY","TOOLBAR_WIDTH","TOOLBAR_BOX_SHADOW","join","Kbd","children","React","display","padding","borderRadius","border","backgroundColor","getEmptyStateMessage","displayOption","filterGuides","guides","filter","guide","annotation","isEligible","active","status","V2","readyToTarget","client","useGuideContext","setDisplayOption","useState","runConfig","setRunConfig","KnockGuideClient","getToolbarRunConfigFromUrl","isCollapsed","setIsCollapsed","isContextPanelOpen","setIsContextPanelOpen","expandedGuideRowKey","setExpandedGuideRowKey","useEffect","undefined","isVisible","focusedGuideKeys","isDebugging","store","state","debug","debugging","setDebug","Object","keys","length","unsetDebug","handleKeyDown","e","ctrlKey","key","repeat","preventDefault","prev","addEventListener","removeEventListener","containerRef","useRef","guideListRef","position","isDragging","handlePointerDown","hasDraggedRef","useDraggable","elementRef","reclampDeps","initialPosition","top","right","result","useInspectGuideClientStore","Box","zIndex","TOOLBAR_Z_INDEX","Tooltip","Text","Stack","sharedTooltipProps","cursor","touchAction","userSelect","animation","transform","transformOrigin","KnockButton","current","width","boxShadow","boxSizing","minWidth","flex","stopPropagation","Icon","GripVertical","SegmentedControl","val","debugSettings","find","g","Button","icon","SlidersHorizontal","alt","ChevronDown","ChevronRight","v","flexShrink","LogOut","curr","Minimize2","GuideContextDetails","maxHeight","lineHeight","error","message","map","GuideRow","orderIndex","k","FocusChin"],"mappings":"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"}
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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"}
@@ -1,2 +1,2 @@
1
- "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const n=require("@knocklabs/react-core"),o=require("react");require("../components/Banner/Banner.js");require("../components/Card/Card.js");const i=require("../components/Toolbar/V1/V1.js"),a=require("../components/Toolbar/V2/V2.js");require("../components/Modal/Modal.js");const l=e=>e&&typeof e=="object"&&"default"in e?e:{default:e},t=l(o),d=({children:e,toolbar:r="v2",readyToTarget:u,...c})=>t.default.createElement(n.KnockGuideProvider,{...c,readyToTarget:u,trackDebugParams:r==="v1"},e,r==="v2"?t.default.createElement(a.V2,{readyToTarget:u}):t.default.createElement(i.V1,null));exports.KnockGuideProvider=d;
1
+ "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const o=require("@knocklabs/react-core"),i=require("react");require("../components/Banner/Banner.js");require("../components/Card/Card.js");const a=require("../components/Toolbar/V1/V1.js"),l=require("../components/Toolbar/V2/V2.js");require("../components/Modal/Modal.js");const d=e=>e&&typeof e=="object"&&"default"in e?e:{default:e},t=d(i),f=({children:e,toolbar:r="v2",readyToTarget:u,listenForUpdates:c=!0,...n})=>t.default.createElement(o.KnockGuideProvider,{...n,readyToTarget:u,listenForUpdates:c,trackDebugParams:r==="v1"},e,r==="v2"?t.default.createElement(l.V2,{readyToTarget:u,listenForUpdates:c}):t.default.createElement(a.V1,null));exports.KnockGuideProvider=f;
2
2
  //# sourceMappingURL=KnockGuideProvider.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"KnockGuideProvider.js","sources":["../../../../../src/modules/guide/providers/KnockGuideProvider.tsx"],"sourcesContent":["import {\n KnockGuideProvider as KnockGuideProviderCore,\n type KnockGuideProviderProps,\n} from \"@knocklabs/react-core\";\nimport React from \"react\";\n\nimport { ToolbarV1, ToolbarV2 } from \"../components\";\n\ntype Props = KnockGuideProviderProps & {\n toolbar?: \"v1\" | \"v2\";\n};\n\n// Re-export the core KnockGuideProvider, so we can add React specific\n// functionality like the Toolbar component which shouldn't be included in other\n// contexts (e.g. React Native).\nexport const KnockGuideProvider: React.FC<React.PropsWithChildren<Props>> = ({\n children,\n toolbar = \"v2\",\n readyToTarget,\n ...props\n}) => {\n return (\n <KnockGuideProviderCore\n {...props}\n readyToTarget={readyToTarget}\n // For backward compatibility with toolbar v1. Remove once v2 ships.\n trackDebugParams={toolbar === \"v1\"}\n >\n {children}\n {toolbar === \"v2\" ? (\n <ToolbarV2 readyToTarget={readyToTarget} />\n ) : (\n <ToolbarV1 />\n )}\n </KnockGuideProviderCore>\n );\n};\n"],"names":["KnockGuideProvider","children","toolbar","readyToTarget","props","React","KnockGuideProviderCore","ToolbarV2","ToolbarV1"],"mappings":"uaAeaA,EAA+DA,CAAC,CAC3EC,SAAAA,EACAC,QAAAA,EAAU,KACVC,cAAAA,EACA,GAAGC,CACL,IAEIC,EAAA,QAAA,cAACC,EAAA,mBAAA,CACKF,GAAAA,EACJ,cAAAD,EAEA,iBAAkBD,IAAY,IAAA,EAE7BD,EACAC,IAAY,KACXG,UAAA,cAACE,MAAU,cAAAJ,4BAEVK,EACF,GAAA,IAAA,CACH"}
1
+ {"version":3,"file":"KnockGuideProvider.js","sources":["../../../../../src/modules/guide/providers/KnockGuideProvider.tsx"],"sourcesContent":["import {\n KnockGuideProvider as KnockGuideProviderCore,\n type KnockGuideProviderProps,\n} from \"@knocklabs/react-core\";\nimport React from \"react\";\n\nimport { ToolbarV1, ToolbarV2 } from \"../components\";\n\ntype Props = KnockGuideProviderProps & {\n toolbar?: \"v1\" | \"v2\";\n};\n\n// Re-export the core KnockGuideProvider, so we can add React specific\n// functionality like the Toolbar component which shouldn't be included in other\n// contexts (e.g. React Native).\nexport const KnockGuideProvider: React.FC<React.PropsWithChildren<Props>> = ({\n children,\n toolbar = \"v2\",\n readyToTarget,\n listenForUpdates = true,\n ...props\n}) => {\n return (\n <KnockGuideProviderCore\n {...props}\n readyToTarget={readyToTarget}\n listenForUpdates={listenForUpdates}\n // For backward compatibility with toolbar v1. Remove once v2 ships.\n trackDebugParams={toolbar === \"v1\"}\n >\n {children}\n {toolbar === \"v2\" ? (\n <ToolbarV2\n readyToTarget={readyToTarget}\n listenForUpdates={listenForUpdates}\n />\n ) : (\n <ToolbarV1 />\n )}\n </KnockGuideProviderCore>\n );\n};\n"],"names":["KnockGuideProvider","children","toolbar","readyToTarget","listenForUpdates","props","React","KnockGuideProviderCore","ToolbarV2","ToolbarV1"],"mappings":"uaAeaA,EAA+DA,CAAC,CAC3EC,SAAAA,EACAC,QAAAA,EAAU,KACVC,cAAAA,EACAC,iBAAAA,EAAmB,GACnB,GAAGC,CACL,IAEIC,EAAA,QAAA,cAACC,EAAA,mBAAA,CACKF,GAAAA,EACJ,cAAAF,EACA,iBAAAC,EAEA,iBAAkBF,IAAY,IAAA,EAE7BD,EACAC,IAAY,KACVI,UAAA,cAAAE,EAAAA,GAAA,CACC,cAAAL,EACA,iBAAAC,CACA,CAAA,0BAEDK,EACF,GAAA,IAAA,CACH"}
@@ -1,32 +1,32 @@
1
- import { KnockGuideClient as A } from "@knocklabs/client";
2
- import { useGuideContext as L } from "@knocklabs/react-core";
3
- import { Button as E } from "@telegraph/button";
4
- import { Icon as T } from "@telegraph/icon";
5
- import { Box as u, Stack as r } from "@telegraph/layout";
6
- import { SegmentedControl as p } from "@telegraph/segmented-control";
7
- import { Tooltip as h } from "@telegraph/tooltip";
8
- import { Text as w } from "@telegraph/typography";
9
- import { GripVertical as B, ChevronDown as H, ChevronRight as V, SlidersHorizontal as j, LogOut as F, Minimize2 as M } from "lucide-react";
1
+ import { KnockGuideClient as L } from "@knocklabs/client";
2
+ import { useGuideContext as T } from "@knocklabs/react-core";
3
+ import { Button as w } from "@telegraph/button";
4
+ import { Icon as B } from "@telegraph/icon";
5
+ import { Box as u, Stack as i } from "@telegraph/layout";
6
+ import { SegmentedControl as m } from "@telegraph/segmented-control";
7
+ import { Tooltip as k } from "@telegraph/tooltip";
8
+ import { Text as v } from "@telegraph/typography";
9
+ import { GripVertical as H, ChevronDown as V, ChevronRight as j, SlidersHorizontal as M, LogOut as W, Minimize2 as Y } from "lucide-react";
10
10
  import e from "react";
11
- import { KnockButton as W } from "../KnockButton.mjs";
12
- import { TOOLBAR_Z_INDEX as Y } from "../shared.mjs";
11
+ import { KnockButton as F } from "../KnockButton.mjs";
12
+ import { TOOLBAR_Z_INDEX as X } from "../shared.mjs";
13
13
  /* empty css */
14
- import { FocusChin as X } from "./FocusChin.mjs";
15
- import { GuideContextDetails as N } from "./GuideContextDetails.mjs";
16
- import { GuideRow as U } from "./GuideRow.mjs";
17
- import { sharedTooltipProps as k } from "./helpers.mjs";
18
- import { useDraggable as Z } from "./useDraggable.mjs";
19
- import { useInspectGuideClientStore as q } from "./useInspectGuideClientStore.mjs";
20
- const J = ".", Q = "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(", "), G = ({
21
- children: i
14
+ import { FocusChin as N } from "./FocusChin.mjs";
15
+ import { GuideContextDetails as Z } from "./GuideContextDetails.mjs";
16
+ import { GuideRow as q } from "./GuideRow.mjs";
17
+ import { sharedTooltipProps as D } from "./helpers.mjs";
18
+ import { useDraggable as J } from "./useDraggable.mjs";
19
+ import { useInspectGuideClientStore as Q } from "./useInspectGuideClientStore.mjs";
20
+ const $ = ".", U = "540px", ee = ["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(", "), _ = ({
21
+ children: r
22
22
  }) => /* @__PURE__ */ e.createElement("kbd", { style: {
23
23
  display: "inline-block",
24
24
  padding: "1px 4px",
25
25
  borderRadius: "var(--tgph-rounded-2)",
26
26
  border: "1px solid rgba(255, 255, 255, 0.3)",
27
27
  backgroundColor: "rgba(255, 255, 255, 0.15)"
28
- } }, i), ee = (i) => {
29
- switch (i) {
28
+ } }, r), te = (r) => {
29
+ switch (r) {
30
30
  case "all-guides":
31
31
  return "You have no guides. Get started by creating a guide.";
32
32
  case "only-active":
@@ -34,127 +34,133 @@ const J = ".", Q = "540px", $ = ["0 0 0 1px rgba(0, 0, 0, 0.06)", "0 0 0 1px rgb
34
34
  case "only-eligible":
35
35
  return "Your current user is not eligible for any guides.";
36
36
  }
37
- }, S = (i, o) => i.filter((l) => !(o === "only-eligible" && !l.annotation.isEligible || o === "only-active" && !l.annotation.active.status)), he = ({
38
- readyToTarget: i
37
+ }, z = (r, s) => r.filter((o) => !(s === "only-eligible" && !o.annotation.isEligible || s === "only-active" && !o.annotation.active.status)), we = ({
38
+ readyToTarget: r,
39
+ listenForUpdates: s
39
40
  }) => {
40
41
  const {
41
42
  client: o
42
- } = L(), [l, m] = e.useState("only-active"), [s, _] = e.useState(() => A.getToolbarRunConfigFromUrl()), [v, g] = e.useState(!1), [d, z] = e.useState(!1), [I, D] = e.useState();
43
+ } = T(), [d, f] = e.useState("only-active"), [c, I] = e.useState(() => L.getToolbarRunConfigFromUrl()), [C, b] = e.useState(!1), [g, P] = e.useState(!1), [K, O] = e.useState();
43
44
  e.useEffect(() => {
44
- D(void 0);
45
- }, [l]), e.useEffect(() => {
46
- var y;
45
+ O(void 0);
46
+ }, [d]), e.useEffect(() => {
47
+ var h;
47
48
  const {
48
49
  isVisible: t = !1,
49
50
  focusedGuideKeys: n = {}
50
- } = s || {}, c = (y = o.store.state.debug) == null ? void 0 : y.debugging;
51
- return t && !c && i && (o.setDebug({
51
+ } = c || {}, l = (h = o.store.state.debug) == null ? void 0 : h.debugging;
52
+ return t && !l && r && (o.setDebug({
52
53
  focusedGuideKeys: n
53
- }), Object.keys(n).length > 0 && m("all-guides")), () => {
54
- o.unsetDebug();
54
+ }), Object.keys(n).length > 0 && f("all-guides")), !t && l && o.unsetDebug({
55
+ listenForUpdates: s
56
+ }), () => {
57
+ var p;
58
+ (p = o.store.state.debug) != null && p.debugging && o.unsetDebug({
59
+ listenForUpdates: s
60
+ });
55
61
  };
56
- }, [i, s, o, m]), e.useEffect(() => {
62
+ }, [r, s, c, o, f]), e.useEffect(() => {
57
63
  const t = (n) => {
58
- n.ctrlKey && n.key === J && !n.repeat && (n.preventDefault(), g((c) => !c));
64
+ n.ctrlKey && n.key === $ && !n.repeat && (n.preventDefault(), b((l) => !l));
59
65
  };
60
66
  return window.addEventListener("keydown", t), () => {
61
67
  window.removeEventListener("keydown", t);
62
68
  };
63
69
  }, []);
64
- const C = e.useRef(null), O = e.useRef(null), {
65
- position: R,
66
- isDragging: f,
67
- handlePointerDown: b,
68
- hasDraggedRef: P
69
- } = Z({
70
- elementRef: C,
71
- reclampDeps: [v],
70
+ const R = e.useRef(null), G = e.useRef(null), {
71
+ position: S,
72
+ isDragging: x,
73
+ handlePointerDown: y,
74
+ hasDraggedRef: A
75
+ } = J({
76
+ elementRef: R,
77
+ reclampDeps: [C],
72
78
  initialPosition: {
73
79
  top: 16,
74
80
  right: 16
75
81
  }
76
- }), a = q(s);
77
- if (!a || !(s != null && s.isVisible))
82
+ }), a = Q(c);
83
+ if (!a || !(c != null && c.isVisible))
78
84
  return null;
79
- const x = a.status === "ok" ? S(a.guides, l) : [];
80
- return /* @__PURE__ */ e.createElement(u, { tgphRef: C, position: "fixed", style: {
81
- top: R.top + "px",
82
- right: R.right + "px",
83
- zIndex: Y
84
- } }, v ? /* @__PURE__ */ e.createElement(h, { side: "left", label: /* @__PURE__ */ e.createElement(w, { as: "span", size: "1" }, "Guide Toolbar", /* @__PURE__ */ e.createElement(r, { display: "inline-block", ml: "3" }, /* @__PURE__ */ e.createElement(G, null, "ctrl"), " + ", /* @__PURE__ */ e.createElement(G, null, "."))), ...k }, /* @__PURE__ */ e.createElement(r, { border: "px", rounded: "4", align: "center", justify: "center", w: "10", h: "10", onPointerDown: b, backgroundColor: "surface-1", style: {
85
- cursor: f ? "grabbing" : "grab",
85
+ const E = a.status === "ok" ? z(a.guides, d) : [];
86
+ return /* @__PURE__ */ e.createElement(u, { tgphRef: R, position: "fixed", style: {
87
+ top: S.top + "px",
88
+ right: S.right + "px",
89
+ zIndex: X
90
+ } }, C ? /* @__PURE__ */ e.createElement(k, { side: "left", label: /* @__PURE__ */ e.createElement(v, { as: "span", size: "1" }, "Guide Toolbar", /* @__PURE__ */ e.createElement(i, { display: "inline-block", ml: "3" }, /* @__PURE__ */ e.createElement(_, null, "ctrl"), " + ", /* @__PURE__ */ e.createElement(_, null, "."))), ...D }, /* @__PURE__ */ e.createElement(i, { border: "px", rounded: "4", align: "center", justify: "center", w: "10", h: "10", onPointerDown: y, backgroundColor: "surface-1", style: {
91
+ cursor: x ? "grabbing" : "grab",
86
92
  touchAction: "none",
87
93
  userSelect: "none",
88
94
  animation: "toolbar-collapse-fade-in 150ms ease-out"
89
95
  } }, /* @__PURE__ */ e.createElement(u, { style: {
90
96
  transform: "scale(0.7)",
91
97
  transformOrigin: "center center"
92
- } }, /* @__PURE__ */ e.createElement(W, { onClick: () => {
93
- P.current || g(!1);
94
- }, positioned: !1 })))) : /* @__PURE__ */ e.createElement(r, { direction: "column", backgroundColor: "surface-1", rounded: "4", overflow: "hidden", style: {
95
- width: Q,
96
- boxShadow: $,
98
+ } }, /* @__PURE__ */ e.createElement(F, { onClick: () => {
99
+ A.current || b(!1);
100
+ }, positioned: !1 })))) : /* @__PURE__ */ e.createElement(i, { direction: "column", backgroundColor: "surface-1", rounded: "4", overflow: "hidden", style: {
101
+ width: U,
102
+ boxShadow: ee,
97
103
  animation: "toolbar-expand-fade-in 150ms ease-out"
98
- } }, /* @__PURE__ */ e.createElement(r, { w: "full", p: "2", justify: "space-between", direction: "row", align: "center", gap: "2", borderBottom: "px", onPointerDown: b, style: {
104
+ } }, /* @__PURE__ */ e.createElement(i, { w: "full", p: "2", justify: "space-between", direction: "row", align: "center", gap: "2", borderBottom: "px", onPointerDown: y, style: {
99
105
  boxSizing: "border-box",
100
- cursor: f ? "grabbing" : "grab",
106
+ cursor: x ? "grabbing" : "grab",
101
107
  touchAction: "none",
102
108
  userSelect: "none"
103
- } }, /* @__PURE__ */ e.createElement(r, { align: "center", gap: "1_5", style: {
109
+ } }, /* @__PURE__ */ e.createElement(i, { align: "center", gap: "1_5", style: {
104
110
  minWidth: 0,
105
111
  flex: 1
106
- } }, /* @__PURE__ */ e.createElement(r, { display: "inline-flex", align: "center", style: {
107
- cursor: f ? "grabbing" : "grab",
112
+ } }, /* @__PURE__ */ e.createElement(i, { display: "inline-flex", align: "center", style: {
113
+ cursor: x ? "grabbing" : "grab",
108
114
  touchAction: "none",
109
115
  userSelect: "none"
110
116
  }, onPointerDown: (t) => {
111
- t.stopPropagation(), b(t);
112
- } }, /* @__PURE__ */ e.createElement(T, { color: "gray", size: "1", icon: B, "aria-hidden": !0 })), /* @__PURE__ */ e.createElement(r, { align: "center", gap: "1_5", onPointerDown: (t) => t.stopPropagation() }, /* @__PURE__ */ e.createElement(p.Root, { size: "1", type: "single", value: l, onValueChange: (t) => {
117
+ t.stopPropagation(), y(t);
118
+ } }, /* @__PURE__ */ e.createElement(B, { color: "gray", size: "1", icon: H, "aria-hidden": !0 })), /* @__PURE__ */ e.createElement(i, { align: "center", gap: "1_5", onPointerDown: (t) => t.stopPropagation() }, /* @__PURE__ */ e.createElement(m.Root, { size: "1", type: "single", value: d, onValueChange: (t) => {
113
119
  if (!t) return;
114
- const n = o.store.state.debug, c = Object.keys((n == null ? void 0 : n.focusedGuideKeys) || {});
115
- a.status === "ok" && c.length > 0 && (S(a.guides, t).find((K) => K.key === c[0]) || o.setDebug({
120
+ const n = o.store.state.debug, l = Object.keys((n == null ? void 0 : n.focusedGuideKeys) || {});
121
+ a.status === "ok" && l.length > 0 && (z(a.guides, t).find((p) => p.key === l[0]) || o.setDebug({
116
122
  ...n,
117
123
  focusedGuideKeys: {}
118
- })), m(t);
119
- } }, /* @__PURE__ */ e.createElement(p.Option, { value: "all-guides", style: {
124
+ })), f(t);
125
+ } }, /* @__PURE__ */ e.createElement(m.Option, { value: "all-guides", style: {
120
126
  width: "54px"
121
- } }, "All"), /* @__PURE__ */ e.createElement(p.Option, { value: "only-active", style: {
127
+ } }, "All"), /* @__PURE__ */ e.createElement(m.Option, { value: "only-active", style: {
122
128
  width: "54px"
123
- } }, "Active"), /* @__PURE__ */ e.createElement(p.Option, { value: "only-eligible", style: {
129
+ } }, "Active"), /* @__PURE__ */ e.createElement(m.Option, { value: "only-eligible", style: {
124
130
  width: "54px"
125
- } }, "Eligible")), /* @__PURE__ */ e.createElement(h, { label: "Settings", ...k }, /* @__PURE__ */ e.createElement(E, { size: "1", variant: d ? "outline" : "ghost", color: d ? "blue" : "gray", leadingIcon: {
126
- icon: j,
131
+ } }, "Eligible")), /* @__PURE__ */ e.createElement(k, { label: "Settings", ...D }, /* @__PURE__ */ e.createElement(w, { size: "1", variant: g ? "outline" : "ghost", color: g ? "blue" : "gray", leadingIcon: {
132
+ icon: M,
127
133
  alt: "Inspect target params"
128
- }, trailingIcon: d ? {
129
- icon: H,
134
+ }, trailingIcon: g ? {
135
+ icon: V,
130
136
  alt: "Hide context data"
131
137
  } : {
132
- icon: V,
138
+ icon: j,
133
139
  alt: "Show context data"
134
- }, onClick: () => z((t) => !t) })))), /* @__PURE__ */ e.createElement(r, { align: "center", gap: "1_5", style: {
140
+ }, onClick: () => P((t) => !t) })))), /* @__PURE__ */ e.createElement(i, { align: "center", gap: "1_5", style: {
135
141
  flexShrink: 0
136
- }, onPointerDown: (t) => t.stopPropagation() }, /* @__PURE__ */ e.createElement(r, { align: "center", gap: "1_5" }, /* @__PURE__ */ e.createElement(E, { size: "1", variant: "outline", leadingIcon: {
137
- icon: F,
142
+ }, onPointerDown: (t) => t.stopPropagation() }, /* @__PURE__ */ e.createElement(i, { align: "center", gap: "1_5" }, /* @__PURE__ */ e.createElement(w, { size: "1", variant: "outline", leadingIcon: {
143
+ icon: W,
138
144
  alt: "Exit"
139
145
  }, onClick: () => {
140
- _((t) => ({
146
+ I((t) => ({
141
147
  ...t,
142
148
  isVisible: !1
143
- })), o.unsetDebug();
144
- } }, "Exit"), /* @__PURE__ */ e.createElement(h, { label: "Minimize toolbar", ...k }, /* @__PURE__ */ e.createElement(E, { size: "1", variant: "outline", leadingIcon: {
145
- icon: M,
149
+ }));
150
+ } }, "Exit"), /* @__PURE__ */ e.createElement(k, { label: "Minimize toolbar", ...D }, /* @__PURE__ */ e.createElement(w, { size: "1", variant: "outline", leadingIcon: {
151
+ icon: Y,
146
152
  alt: "Minimize"
147
- }, onClick: () => g(!0) }))))), d && /* @__PURE__ */ e.createElement(u, { borderBottom: "px" }, /* @__PURE__ */ e.createElement(N, null)), /* @__PURE__ */ e.createElement(u, { tgphRef: O, p: "1", overflow: "auto", style: {
153
+ }, onClick: () => b(!0) }))))), g && /* @__PURE__ */ e.createElement(u, { borderBottom: "px" }, /* @__PURE__ */ e.createElement(Z, null)), /* @__PURE__ */ e.createElement(u, { tgphRef: G, p: "1", overflow: "auto", style: {
148
154
  maxHeight: "calc(80vh - 96px)"
149
155
  } }, a.status === "error" ? /* @__PURE__ */ e.createElement(u, { px: "2", pb: "1", style: {
150
156
  lineHeight: "1.2"
151
- } }, /* @__PURE__ */ e.createElement(w, { as: "span", size: "1", weight: "medium", color: a.error === "no_guides_fetched" ? "default" : "red" }, a.message)) : x.length === 0 ? /* @__PURE__ */ e.createElement(u, { px: "2", pb: "1", style: {
157
+ } }, /* @__PURE__ */ e.createElement(v, { as: "span", size: "1", weight: "medium", color: a.error === "no_guides_fetched" ? "default" : "red" }, a.message)) : E.length === 0 ? /* @__PURE__ */ e.createElement(u, { px: "2", pb: "1", style: {
152
158
  lineHeight: "1.2"
153
- } }, /* @__PURE__ */ e.createElement(w, { as: "span", size: "1", weight: "medium", color: "default" }, ee(l))) : x.map((t) => /* @__PURE__ */ e.createElement(U, { key: t.key, guide: t, orderIndex: t.orderIndex, isExpanded: t.key === I, onClick: () => {
154
- D((n) => n && n === t.key ? void 0 : t.key);
155
- } }))), /* @__PURE__ */ e.createElement(X, { guides: x, guideListRef: O })));
159
+ } }, /* @__PURE__ */ e.createElement(v, { as: "span", size: "1", weight: "medium", color: "default" }, te(d))) : E.map((t) => /* @__PURE__ */ e.createElement(q, { key: t.key, guide: t, orderIndex: t.orderIndex, isExpanded: t.key === K, onClick: () => {
160
+ O((n) => n && n === t.key ? void 0 : t.key);
161
+ } }))), /* @__PURE__ */ e.createElement(N, { guides: E, guideListRef: G })));
156
162
  };
157
163
  export {
158
- he as V2
164
+ we as V2
159
165
  };
160
166
  //# sourceMappingURL=V2.mjs.map
@@ -1 +1 @@
1
- {"version":3,"file":"V2.mjs","sources":["../../../../../../../src/modules/guide/components/Toolbar/V2/V2.tsx"],"sourcesContent":["import { KnockGuideClient } from \"@knocklabs/client\";\nimport { useGuideContext } from \"@knocklabs/react-core\";\nimport { Button } from \"@telegraph/button\";\nimport { Icon } from \"@telegraph/icon\";\nimport { Box, Stack } from \"@telegraph/layout\";\nimport { SegmentedControl } from \"@telegraph/segmented-control\";\nimport { Tooltip } from \"@telegraph/tooltip\";\nimport { Text } from \"@telegraph/typography\";\nimport {\n ChevronDown,\n ChevronRight,\n GripVertical,\n LogOut,\n Minimize2,\n SlidersHorizontal,\n} from \"lucide-react\";\nimport React from \"react\";\n\nimport { KnockButton } from \"../KnockButton\";\nimport { TOOLBAR_Z_INDEX } from \"../shared\";\nimport \"../styles.css\";\n\nimport { FocusChin } from \"./FocusChin\";\nimport { GuideContextDetails } from \"./GuideContextDetails\";\nimport { GuideRow } from \"./GuideRow\";\nimport { DisplayOption, sharedTooltipProps } from \"./helpers\";\nimport { useDraggable } from \"./useDraggable\";\nimport {\n InspectionResultOk,\n useInspectGuideClientStore,\n} from \"./useInspectGuideClientStore\";\n\nconst TOGGLE_COLLAPSED_HOTKEY = \".\";\n\nconst TOOLBAR_WIDTH = \"540px\";\n\nconst TOOLBAR_BOX_SHADOW = [\n \"0 0 0 1px rgba(0, 0, 0, 0.06)\",\n \"0 0 0 1px rgba(255, 255, 255, 0.10)\",\n \"inset 0 1px 0 rgba(255, 255, 255, 0.04)\",\n \"0 1px 1px 0 rgba(0, 0, 0, 0.04)\",\n \"0 4px 6px -1px rgba(0, 0, 0, 0.05)\",\n \"0 8px 16px -4px rgba(0, 0, 0, 0.06)\",\n].join(\", \");\n\nconst Kbd = ({ children }: { children: React.ReactNode }) => {\n return (\n <kbd\n style={{\n display: \"inline-block\",\n padding: \"1px 4px\",\n borderRadius: \"var(--tgph-rounded-2)\",\n border: \"1px solid rgba(255, 255, 255, 0.3)\",\n backgroundColor: \"rgba(255, 255, 255, 0.15)\",\n }}\n >\n {children}\n </kbd>\n );\n};\n\nconst getEmptyStateMessage = (displayOption: DisplayOption) => {\n switch (displayOption) {\n case \"all-guides\":\n return \"You have no guides. Get started by creating a guide.\";\n case \"only-active\":\n return \"There are no active guides.\";\n case \"only-eligible\":\n return \"Your current user is not eligible for any guides.\";\n }\n};\n\nconst filterGuides = (\n guides: InspectionResultOk[\"guides\"],\n displayOption: DisplayOption,\n) => {\n return guides.filter((guide) => {\n if (displayOption === \"only-eligible\" && !guide.annotation.isEligible) {\n return false;\n }\n if (displayOption === \"only-active\" && !guide.annotation.active.status) {\n return false;\n }\n return true;\n });\n};\n\ntype Props = {\n readyToTarget: boolean;\n};\n\nexport const V2 = ({ readyToTarget }: Props) => {\n const { client } = useGuideContext();\n\n const [displayOption, setDisplayOption] =\n React.useState<DisplayOption>(\"only-active\");\n const [runConfig, setRunConfig] = React.useState(() =>\n KnockGuideClient.getToolbarRunConfigFromUrl(),\n );\n const [isCollapsed, setIsCollapsed] = React.useState(false);\n const [isContextPanelOpen, setIsContextPanelOpen] = React.useState(false);\n\n const [expandedGuideRowKey, setExpandedGuideRowKey] = React.useState<\n string | undefined\n >();\n\n React.useEffect(() => {\n setExpandedGuideRowKey(undefined);\n }, [displayOption]);\n\n React.useEffect(() => {\n const { isVisible = false, focusedGuideKeys = {} } = runConfig || {};\n const isDebugging = client.store.state.debug?.debugging;\n if (isVisible && !isDebugging && readyToTarget) {\n client.setDebug({ focusedGuideKeys });\n\n // If focused, switch to all guides so you can see in the list.\n if (Object.keys(focusedGuideKeys).length > 0) {\n setDisplayOption(\"all-guides\");\n }\n }\n\n return () => {\n client.unsetDebug();\n };\n }, [readyToTarget, runConfig, client, setDisplayOption]);\n\n // Toggle collapsed state with Ctrl + .\n React.useEffect(() => {\n const handleKeyDown = (e: KeyboardEvent) => {\n if (e.ctrlKey && e.key === TOGGLE_COLLAPSED_HOTKEY && !e.repeat) {\n e.preventDefault();\n setIsCollapsed((prev) => !prev);\n }\n };\n\n window.addEventListener(\"keydown\", handleKeyDown);\n return () => {\n window.removeEventListener(\"keydown\", handleKeyDown);\n };\n }, []);\n\n const containerRef = React.useRef<HTMLDivElement>(null);\n const guideListRef = React.useRef<HTMLDivElement>(null);\n const { position, isDragging, handlePointerDown, hasDraggedRef } =\n useDraggable({\n elementRef: containerRef,\n reclampDeps: [isCollapsed],\n initialPosition: { top: 16, right: 16 },\n });\n\n const result = useInspectGuideClientStore(runConfig);\n if (!result || !runConfig?.isVisible) {\n return null;\n }\n\n const guides =\n result.status === \"ok\" ? filterGuides(result.guides, displayOption) : [];\n\n return (\n <Box\n tgphRef={containerRef}\n position=\"fixed\"\n style={{\n top: position.top + \"px\",\n right: position.right + \"px\",\n zIndex: TOOLBAR_Z_INDEX,\n }}\n >\n {isCollapsed ? (\n <Tooltip\n side=\"left\"\n label={\n <Text as=\"span\" size=\"1\">\n Guide Toolbar\n <Stack display=\"inline-block\" ml=\"3\">\n <Kbd>ctrl</Kbd> + <Kbd>.</Kbd>\n </Stack>\n </Text>\n }\n {...sharedTooltipProps}\n >\n <Stack\n border=\"px\"\n rounded=\"4\"\n align=\"center\"\n justify=\"center\"\n w=\"10\"\n h=\"10\"\n onPointerDown={handlePointerDown}\n backgroundColor=\"surface-1\"\n style={{\n cursor: isDragging ? \"grabbing\" : \"grab\",\n touchAction: \"none\",\n userSelect: \"none\",\n animation: \"toolbar-collapse-fade-in 150ms ease-out\",\n }}\n >\n <Box\n style={{\n transform: \"scale(0.7)\",\n transformOrigin: \"center center\",\n }}\n >\n <KnockButton\n onClick={() => {\n if (!hasDraggedRef.current) {\n setIsCollapsed(false);\n }\n }}\n positioned={false}\n />\n </Box>\n </Stack>\n </Tooltip>\n ) : (\n <Stack\n direction=\"column\"\n backgroundColor=\"surface-1\"\n rounded=\"4\"\n overflow=\"hidden\"\n style={{\n width: TOOLBAR_WIDTH,\n boxShadow: TOOLBAR_BOX_SHADOW,\n animation: \"toolbar-expand-fade-in 150ms ease-out\",\n }}\n >\n {/* Header — also acts as drag handle area */}\n <Stack\n w=\"full\"\n p=\"2\"\n justify=\"space-between\"\n direction=\"row\"\n align=\"center\"\n gap=\"2\"\n borderBottom=\"px\"\n onPointerDown={handlePointerDown}\n style={{\n boxSizing: \"border-box\",\n cursor: isDragging ? \"grabbing\" : \"grab\",\n touchAction: \"none\",\n userSelect: \"none\",\n }}\n >\n {/* Left: drag icon + segmented control + settings */}\n <Stack align=\"center\" gap=\"1_5\" style={{ minWidth: 0, flex: 1 }}>\n <Stack\n display=\"inline-flex\"\n align=\"center\"\n style={{\n cursor: isDragging ? \"grabbing\" : \"grab\",\n touchAction: \"none\",\n userSelect: \"none\",\n }}\n onPointerDown={(e: React.PointerEvent) => {\n // Already handled by parent, prevent double-fire\n e.stopPropagation();\n handlePointerDown(e);\n }}\n >\n <Icon color=\"gray\" size=\"1\" icon={GripVertical} aria-hidden />\n </Stack>\n <Stack\n align=\"center\"\n gap=\"1_5\"\n onPointerDown={(e: React.PointerEvent) => e.stopPropagation()}\n >\n <SegmentedControl.Root\n size=\"1\"\n type=\"single\"\n value={displayOption}\n onValueChange={(val: DisplayOption) => {\n if (!val) return;\n\n const debugSettings = client.store.state.debug;\n\n const focusedGuideKeys = Object.keys(\n debugSettings?.focusedGuideKeys || {},\n );\n\n // Exit out of focus if the currently focused guide is not\n // part of the selected list filter.\n if (result.status === \"ok\" && focusedGuideKeys.length > 0) {\n const currFocusedGuide = filterGuides(\n result.guides,\n val,\n ).find((g) => g.key === focusedGuideKeys[0]);\n\n if (!currFocusedGuide) {\n client.setDebug({\n ...debugSettings,\n focusedGuideKeys: {},\n });\n }\n }\n\n setDisplayOption(val);\n }}\n >\n <SegmentedControl.Option\n value=\"all-guides\"\n style={{ width: \"54px\" }}\n >\n All\n </SegmentedControl.Option>\n <SegmentedControl.Option\n value=\"only-active\"\n style={{ width: \"54px\" }}\n >\n Active\n </SegmentedControl.Option>\n <SegmentedControl.Option\n value=\"only-eligible\"\n style={{ width: \"54px\" }}\n >\n Eligible\n </SegmentedControl.Option>\n </SegmentedControl.Root>\n\n <Tooltip label=\"Settings\" {...sharedTooltipProps}>\n <Button\n size=\"1\"\n variant={isContextPanelOpen ? \"outline\" : \"ghost\"}\n color={isContextPanelOpen ? \"blue\" : \"gray\"}\n leadingIcon={{\n icon: SlidersHorizontal,\n alt: \"Inspect target params\",\n }}\n trailingIcon={\n isContextPanelOpen\n ? { icon: ChevronDown, alt: \"Hide context data\" }\n : { icon: ChevronRight, alt: \"Show context data\" }\n }\n onClick={() => setIsContextPanelOpen((v) => !v)}\n />\n </Tooltip>\n </Stack>\n </Stack>\n\n {/* Right: exit + minimize buttons */}\n <Stack\n align=\"center\"\n gap=\"1_5\"\n style={{ flexShrink: 0 }}\n onPointerDown={(e: React.PointerEvent) => e.stopPropagation()}\n >\n <Stack align=\"center\" gap=\"1_5\">\n <Button\n size=\"1\"\n variant=\"outline\"\n leadingIcon={{ icon: LogOut, alt: \"Exit\" }}\n onClick={() => {\n setRunConfig((curr) => ({ ...curr, isVisible: false }));\n client.unsetDebug();\n }}\n >\n Exit\n </Button>\n <Tooltip label=\"Minimize toolbar\" {...sharedTooltipProps}>\n <Button\n size=\"1\"\n variant=\"outline\"\n leadingIcon={{ icon: Minimize2, alt: \"Minimize\" }}\n onClick={() => setIsCollapsed(true)}\n />\n </Tooltip>\n </Stack>\n </Stack>\n </Stack>\n\n {/* Collapsible panel to show context data */}\n {isContextPanelOpen && (\n <Box borderBottom=\"px\">\n <GuideContextDetails />\n </Box>\n )}\n\n {/* Guide list content area */}\n <Box\n tgphRef={guideListRef}\n p=\"1\"\n overflow=\"auto\"\n style={{ maxHeight: \"calc(80vh - 96px)\" }}\n >\n {result.status === \"error\" ? (\n <Box px=\"2\" pb=\"1\" style={{ lineHeight: \"1.2\" }}>\n <Text\n as=\"span\"\n size=\"1\"\n weight=\"medium\"\n color={\n result.error === \"no_guides_fetched\" ? \"default\" : \"red\"\n }\n >\n {result.message}\n </Text>\n </Box>\n ) : guides.length === 0 ? (\n <Box px=\"2\" pb=\"1\" style={{ lineHeight: \"1.2\" }}>\n <Text as=\"span\" size=\"1\" weight=\"medium\" color=\"default\">\n {getEmptyStateMessage(displayOption)}\n </Text>\n </Box>\n ) : (\n guides.map((guide) => (\n <GuideRow\n key={guide.key}\n guide={guide}\n orderIndex={guide.orderIndex}\n isExpanded={guide.key === expandedGuideRowKey}\n onClick={() => {\n setExpandedGuideRowKey((k) =>\n k && k === guide.key ? undefined : guide.key,\n );\n }}\n />\n ))\n )}\n </Box>\n\n {/* Focus chin with dedicated controls */}\n <FocusChin guides={guides} guideListRef={guideListRef} />\n </Stack>\n )}\n </Box>\n );\n};\n"],"names":["TOGGLE_COLLAPSED_HOTKEY","TOOLBAR_WIDTH","TOOLBAR_BOX_SHADOW","join","Kbd","children","React","display","padding","borderRadius","border","backgroundColor","getEmptyStateMessage","displayOption","filterGuides","guides","filter","guide","annotation","isEligible","active","status","V2","readyToTarget","client","useGuideContext","setDisplayOption","useState","runConfig","setRunConfig","KnockGuideClient","getToolbarRunConfigFromUrl","isCollapsed","setIsCollapsed","isContextPanelOpen","setIsContextPanelOpen","expandedGuideRowKey","setExpandedGuideRowKey","useEffect","undefined","isVisible","focusedGuideKeys","isDebugging","store","state","debug","debugging","setDebug","Object","keys","length","unsetDebug","handleKeyDown","e","ctrlKey","key","repeat","preventDefault","prev","addEventListener","removeEventListener","containerRef","useRef","guideListRef","position","isDragging","handlePointerDown","hasDraggedRef","useDraggable","elementRef","reclampDeps","initialPosition","top","right","result","useInspectGuideClientStore","Box","zIndex","TOOLBAR_Z_INDEX","Tooltip","Text","Stack","sharedTooltipProps","cursor","touchAction","userSelect","animation","transform","transformOrigin","KnockButton","current","width","boxShadow","boxSizing","minWidth","flex","stopPropagation","Icon","GripVertical","SegmentedControl","val","debugSettings","find","g","Button","icon","SlidersHorizontal","alt","ChevronDown","ChevronRight","v","flexShrink","LogOut","curr","Minimize2","GuideContextDetails","maxHeight","lineHeight","error","message","map","GuideRow","orderIndex","k","FocusChin"],"mappings":"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"}
1
+ {"version":3,"file":"V2.mjs","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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"}
@@ -1,26 +1,28 @@
1
- import { KnockGuideProvider as i } from "@knocklabs/react-core";
1
+ import { KnockGuideProvider as c } from "@knocklabs/react-core";
2
2
  import r from "react";
3
3
  import "../components/Banner/Banner.mjs";
4
4
  import "../components/Card/Card.mjs";
5
- import { V1 as c } from "../components/Toolbar/V1/V1.mjs";
6
- import { V2 as n } from "../components/Toolbar/V2/V2.mjs";
5
+ import { V1 as n } from "../components/Toolbar/V1/V1.mjs";
6
+ import { V2 as u } from "../components/Toolbar/V2/V2.mjs";
7
7
  import "../components/Modal/Modal.mjs";
8
- const k = ({
8
+ const P = ({
9
9
  children: o,
10
10
  toolbar: e = "v2",
11
11
  readyToTarget: t,
12
- ...m
12
+ listenForUpdates: m = !0,
13
+ ...i
13
14
  }) => /* @__PURE__ */ r.createElement(
14
- i,
15
+ c,
15
16
  {
16
- ...m,
17
+ ...i,
17
18
  readyToTarget: t,
19
+ listenForUpdates: m,
18
20
  trackDebugParams: e === "v1"
19
21
  },
20
22
  o,
21
- e === "v2" ? /* @__PURE__ */ r.createElement(n, { readyToTarget: t }) : /* @__PURE__ */ r.createElement(c, null)
23
+ e === "v2" ? /* @__PURE__ */ r.createElement(u, { readyToTarget: t, listenForUpdates: m }) : /* @__PURE__ */ r.createElement(n, null)
22
24
  );
23
25
  export {
24
- k as KnockGuideProvider
26
+ P as KnockGuideProvider
25
27
  };
26
28
  //# sourceMappingURL=KnockGuideProvider.mjs.map
@@ -1 +1 @@
1
- {"version":3,"file":"KnockGuideProvider.mjs","sources":["../../../../../src/modules/guide/providers/KnockGuideProvider.tsx"],"sourcesContent":["import {\n KnockGuideProvider as KnockGuideProviderCore,\n type KnockGuideProviderProps,\n} from \"@knocklabs/react-core\";\nimport React from \"react\";\n\nimport { ToolbarV1, ToolbarV2 } from \"../components\";\n\ntype Props = KnockGuideProviderProps & {\n toolbar?: \"v1\" | \"v2\";\n};\n\n// Re-export the core KnockGuideProvider, so we can add React specific\n// functionality like the Toolbar component which shouldn't be included in other\n// contexts (e.g. React Native).\nexport const KnockGuideProvider: React.FC<React.PropsWithChildren<Props>> = ({\n children,\n toolbar = \"v2\",\n readyToTarget,\n ...props\n}) => {\n return (\n <KnockGuideProviderCore\n {...props}\n readyToTarget={readyToTarget}\n // For backward compatibility with toolbar v1. Remove once v2 ships.\n trackDebugParams={toolbar === \"v1\"}\n >\n {children}\n {toolbar === \"v2\" ? (\n <ToolbarV2 readyToTarget={readyToTarget} />\n ) : (\n <ToolbarV1 />\n )}\n </KnockGuideProviderCore>\n );\n};\n"],"names":["KnockGuideProvider","children","toolbar","readyToTarget","props","React","KnockGuideProviderCore","ToolbarV2","ToolbarV1"],"mappings":";;;;;;;AAeO,MAAMA,IAA+DA,CAAC;AAAA,EAC3EC,UAAAA;AAAAA,EACAC,SAAAA,IAAU;AAAA,EACVC,eAAAA;AAAAA,EACA,GAAGC;AACL,MAEIC,gBAAAA,EAAA;AAAA,EAACC;AAAAA,EAAA;AAAA,IACKF,GAAAA;AAAAA,IACJ,eAAAD;AAAA,IAEA,kBAAkBD,MAAY;AAAA,EAAA;AAAA,EAE7BD;AAAAA,EACAC,MAAY,OACXG,gBAAAA,EAAA,cAACE,KAAU,eAAAJ,uCAEVK,GACF,IAAA;AACH;"}
1
+ {"version":3,"file":"KnockGuideProvider.mjs","sources":["../../../../../src/modules/guide/providers/KnockGuideProvider.tsx"],"sourcesContent":["import {\n KnockGuideProvider as KnockGuideProviderCore,\n type KnockGuideProviderProps,\n} from \"@knocklabs/react-core\";\nimport React from \"react\";\n\nimport { ToolbarV1, ToolbarV2 } from \"../components\";\n\ntype Props = KnockGuideProviderProps & {\n toolbar?: \"v1\" | \"v2\";\n};\n\n// Re-export the core KnockGuideProvider, so we can add React specific\n// functionality like the Toolbar component which shouldn't be included in other\n// contexts (e.g. React Native).\nexport const KnockGuideProvider: React.FC<React.PropsWithChildren<Props>> = ({\n children,\n toolbar = \"v2\",\n readyToTarget,\n listenForUpdates = true,\n ...props\n}) => {\n return (\n <KnockGuideProviderCore\n {...props}\n readyToTarget={readyToTarget}\n listenForUpdates={listenForUpdates}\n // For backward compatibility with toolbar v1. Remove once v2 ships.\n trackDebugParams={toolbar === \"v1\"}\n >\n {children}\n {toolbar === \"v2\" ? (\n <ToolbarV2\n readyToTarget={readyToTarget}\n listenForUpdates={listenForUpdates}\n />\n ) : (\n <ToolbarV1 />\n )}\n </KnockGuideProviderCore>\n );\n};\n"],"names":["KnockGuideProvider","children","toolbar","readyToTarget","listenForUpdates","props","React","KnockGuideProviderCore","ToolbarV2","ToolbarV1"],"mappings":";;;;;;;AAeO,MAAMA,IAA+DA,CAAC;AAAA,EAC3EC,UAAAA;AAAAA,EACAC,SAAAA,IAAU;AAAA,EACVC,eAAAA;AAAAA,EACAC,kBAAAA,IAAmB;AAAA,EACnB,GAAGC;AACL,MAEIC,gBAAAA,EAAA;AAAA,EAACC;AAAAA,EAAA;AAAA,IACKF,GAAAA;AAAAA,IACJ,eAAAF;AAAA,IACA,kBAAAC;AAAA,IAEA,kBAAkBF,MAAY;AAAA,EAAA;AAAA,EAE7BD;AAAAA,EACAC,MAAY,OACVI,gBAAAA,EAAA,cAAAE,GAAA,EACC,eAAAL,GACA,kBAAAC,EACA,CAAA,oCAEDK,GACF,IAAA;AACH;"}
@@ -1,6 +1,7 @@
1
1
  type Props = {
2
2
  readyToTarget: boolean;
3
+ listenForUpdates: boolean;
3
4
  };
4
- export declare const V2: ({ readyToTarget }: Props) => import("react/jsx-runtime").JSX.Element | null;
5
+ export declare const V2: ({ readyToTarget, listenForUpdates }: Props) => import("react/jsx-runtime").JSX.Element | null;
5
6
  export {};
6
7
  //# sourceMappingURL=V2.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"V2.d.ts","sourceRoot":"","sources":["../../../../../../../src/modules/guide/components/Toolbar/V2/V2.tsx"],"names":[],"mappings":"AAoBA,OAAO,eAAe,CAAC;AAmEvB,KAAK,KAAK,GAAG;IACX,aAAa,EAAE,OAAO,CAAC;CACxB,CAAC;AAEF,eAAO,MAAM,EAAE,GAAI,mBAAmB,KAAK,mDA+U1C,CAAC"}
1
+ {"version":3,"file":"V2.d.ts","sourceRoot":"","sources":["../../../../../../../src/modules/guide/components/Toolbar/V2/V2.tsx"],"names":[],"mappings":"AAoBA,OAAO,eAAe,CAAC;AAmEvB,KAAK,KAAK,GAAG;IACX,aAAa,EAAE,OAAO,CAAC;IACvB,gBAAgB,EAAE,OAAO,CAAC;CAC3B,CAAC;AAEF,eAAO,MAAM,EAAE,GAAI,qCAAqC,KAAK,mDAqV5D,CAAC"}
@@ -1 +1 @@
1
- {"version":3,"file":"KnockGuideProvider.d.ts","sourceRoot":"","sources":["../../../../../src/modules/guide/providers/KnockGuideProvider.tsx"],"names":[],"mappings":"AAAA,OAAO,EAEL,KAAK,uBAAuB,EAC7B,MAAM,uBAAuB,CAAC;AAC/B,OAAO,KAAK,MAAM,OAAO,CAAC;AAI1B,KAAK,KAAK,GAAG,uBAAuB,GAAG;IACrC,OAAO,CAAC,EAAE,IAAI,GAAG,IAAI,CAAC;CACvB,CAAC;AAKF,eAAO,MAAM,kBAAkB,EAAE,KAAK,CAAC,EAAE,CAAC,KAAK,CAAC,iBAAiB,CAAC,KAAK,CAAC,CAqBvE,CAAC"}
1
+ {"version":3,"file":"KnockGuideProvider.d.ts","sourceRoot":"","sources":["../../../../../src/modules/guide/providers/KnockGuideProvider.tsx"],"names":[],"mappings":"AAAA,OAAO,EAEL,KAAK,uBAAuB,EAC7B,MAAM,uBAAuB,CAAC;AAC/B,OAAO,KAAK,MAAM,OAAO,CAAC;AAI1B,KAAK,KAAK,GAAG,uBAAuB,GAAG;IACrC,OAAO,CAAC,EAAE,IAAI,GAAG,IAAI,CAAC;CACvB,CAAC;AAKF,eAAO,MAAM,kBAAkB,EAAE,KAAK,CAAC,EAAE,CAAC,KAAK,CAAC,iBAAiB,CAAC,KAAK,CAAC,CA0BvE,CAAC"}
package/package.json CHANGED
@@ -2,7 +2,7 @@
2
2
  "name": "@knocklabs/react",
3
3
  "description": "A set of React components to build notification experiences powered by Knock",
4
4
  "author": "@knocklabs",
5
- "version": "0.11.16",
5
+ "version": "0.11.17",
6
6
  "license": "MIT",
7
7
  "main": "dist/cjs/index.js",
8
8
  "module": "dist/esm/index.mjs",
@@ -72,8 +72,8 @@
72
72
  }
73
73
  },
74
74
  "dependencies": {
75
- "@knocklabs/client": "^0.21.9",
76
- "@knocklabs/react-core": "^0.13.10",
75
+ "@knocklabs/client": "^0.21.10",
76
+ "@knocklabs/react-core": "^0.13.11",
77
77
  "@popperjs/core": "^2.11.8",
78
78
  "@radix-ui/react-dialog": "^1.1.15",
79
79
  "@radix-ui/react-hover-card": "^1.1.15",