@knocklabs/react 0.11.12 → 0.11.13

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

@@ -1 +1 @@
-{"version":3,"file":"GuideContextDetails.mjs","sources":["../../../../../../../src/modules/guide/components/Toolbar/V2/GuideContextDetails.tsx"],"sourcesContent":["import { useGuideContext, useStore } from \"@knocklabs/react-core\";\nimport { Box, Stack } from \"@telegraph/layout\";\nimport { Toggle } from \"@telegraph/toggle\";\nimport { Tooltip } from \"@telegraph/tooltip\";\nimport { Text } from \"@telegraph/typography\";\n\nexport const GuideContextDetails = () => {\n  const { client } = useGuideContext();\n  const { debugSettings } = useStore(client.store, (state) => ({\n    debugSettings: state.debug || {},\n  }));\n\n  return (\n    <Box py=\"3\" px=\"3\">\n      <Stack direction=\"column\" gap=\"1\" width=\"full\">\n        <Text as=\"span\" size=\"1\" weight=\"medium\" display=\"block\">\n          Toolbar settings\n        </Text>\n        <Stack direction=\"column\" gap=\"1\">\n          <Stack direction=\"row\" gap=\"2\" align=\"center\" h=\"7\">\n            <Tooltip label=\"Contain engagement actions to client side only\">\n              <Box width=\"36\" mt=\"1\">\n                <Text\n                  as=\"span\"\n                  size=\"1\"\n                  weight=\"medium\"\n                  color=\"gray\"\n                  borderBottom=\"px\"\n                  borderStyle=\"dashed\"\n                >\n                  Sandbox engagement\n                </Text>\n              </Box>\n            </Tooltip>\n            <Toggle.Default\n              size=\"1\"\n              pt=\"1_5\"\n              value={!!debugSettings.skipEngagementTracking}\n              onValueChange={(value: boolean) => {\n                client.setDebug({\n                  ...debugSettings,\n                  skipEngagementTracking: value,\n                });\n              }}\n            />\n          </Stack>\n          <Stack direction=\"row\" gap=\"2\" align=\"center\" h=\"7\">\n            <Tooltip label=\"Ignore throttle and show next guide immediately\">\n              <Box width=\"36\" mt=\"1\">\n                <Text\n                  as=\"span\"\n                  size=\"1\"\n                  weight=\"medium\"\n                  color=\"gray\"\n                  borderBottom=\"px\"\n                  borderStyle=\"dashed\"\n                >\n                  Ignore throttle\n                </Text>\n              </Box>\n            </Tooltip>\n            <Toggle.Default\n              size=\"1\"\n              pt=\"1_5\"\n              value={!!debugSettings.ignoreDisplayInterval}\n              onValueChange={(value: boolean) => {\n                client.setDebug({\n                  ...debugSettings,\n                  ignoreDisplayInterval: value,\n                });\n              }}\n            />\n          </Stack>\n        </Stack>\n      </Stack>\n      <Stack direction=\"column\" gap=\"1\" width=\"full\">\n        <Tooltip\n          label={\n            <Text as=\"span\" size=\"1\">\n              The tenant and data payload passed to the guide client that are\n              used for targeting\n              <br />\n              (via the targetParams prop to KnockGuideProvider)\n            </Text>\n          }\n          delayDuration={500}\n        >\n          <Text\n            as=\"span\"\n            size=\"1\"\n            weight=\"medium\"\n            borderBottom=\"px\"\n            borderStyle=\"dashed\"\n            mt=\"4\"\n            style={{\n              whiteSpace: \"nowrap\",\n              width: \"fit-content\",\n            }}\n          >\n            Target params\n          </Text>\n        </Tooltip>\n        <Stack direction=\"column\" gap=\"2\">\n          <Stack direction=\"row\" gap=\"2\" align=\"center\">\n            <Text\n              as=\"span\"\n              size=\"1\"\n              weight=\"medium\"\n              color=\"gray\"\n              width=\"36\"\n              mt=\"1\"\n            >\n              Tenant\n            </Text>\n            <Box\n              rounded=\"2\"\n              overflow=\"auto\"\n              backgroundColor=\"surface-2\"\n              border=\"px\"\n              p=\"1\"\n              style={{ flex: 1, minWidth: 0 }}\n            >\n              <pre style={{ fontSize: \"11px\", margin: 0 }}>\n                <code>{client.targetParams.tenant || \"-\"}</code>\n              </pre>\n            </Box>\n          </Stack>\n          <Stack direction=\"row\" gap=\"2\" align=\"flex-start\">\n            <Text\n              as=\"span\"\n              size=\"1\"\n              weight=\"medium\"\n              color=\"gray\"\n              width=\"36\"\n              mt=\"1\"\n            >\n              Data\n            </Text>\n            <Box\n              rounded=\"2\"\n              overflow=\"auto\"\n              backgroundColor=\"surface-2\"\n              border=\"px\"\n              p=\"1\"\n              style={{\n                flex: 1,\n                minWidth: 0,\n                minHeight: \"50px\",\n                maxHeight: \"200px\",\n              }}\n            >\n              <pre style={{ fontSize: \"11px\", margin: 0 }}>\n                <code>\n                  {client.targetParams.data\n                    ? JSON.stringify(client.targetParams.data, null, 2)\n                    : \"-\"}\n                </code>\n              </pre>\n            </Box>\n          </Stack>\n        </Stack>\n      </Stack>\n    </Box>\n  );\n};\n"],"names":["GuideContextDetails","client","useGuideContext","debugSettings","useStore","store","state","debug","Box","Stack","Text","React","Tooltip","Toggle","skipEngagementTracking","value","setDebug","ignoreDisplayInterval","whiteSpace","width","flex","minWidth","fontSize","margin","targetParams","tenant","minHeight","maxHeight","data","JSON","stringify"],"mappings":"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"}
+{"version":3,"file":"GuideContextDetails.mjs","sources":["../../../../../../../src/modules/guide/components/Toolbar/V2/GuideContextDetails.tsx"],"sourcesContent":["import { useGuideContext, useStore } from \"@knocklabs/react-core\";\nimport { Box, Stack } from \"@telegraph/layout\";\nimport { Toggle } from \"@telegraph/toggle\";\nimport { Tooltip } from \"@telegraph/tooltip\";\nimport { Text } from \"@telegraph/typography\";\n\nimport { sharedTooltipProps } from \"./helpers\";\n\nexport const GuideContextDetails = () => {\n  const { client } = useGuideContext();\n  const { debugSettings } = useStore(client.store, (state) => ({\n    debugSettings: state.debug || {},\n  }));\n\n  return (\n    <Box py=\"3\" px=\"3\">\n      <Stack direction=\"column\" gap=\"1\" width=\"full\">\n        <Text as=\"span\" size=\"1\" weight=\"medium\" display=\"block\">\n          Toolbar settings\n        </Text>\n        <Stack direction=\"column\" gap=\"1\">\n          <Stack direction=\"row\" gap=\"2\" align=\"center\" h=\"7\">\n            <Tooltip\n              label=\"When enabled, engagement actions are not sent to Knock.\"\n              {...sharedTooltipProps}\n            >\n              <Box width=\"36\" mt=\"1\">\n                <Text\n                  as=\"span\"\n                  size=\"1\"\n                  weight=\"medium\"\n                  color=\"gray\"\n                  borderBottom=\"px\"\n                  borderStyle=\"dashed\"\n                >\n                  Sandbox engagement\n                </Text>\n              </Box>\n            </Tooltip>\n            <Toggle.Default\n              size=\"1\"\n              pt=\"1_5\"\n              value={!!debugSettings.skipEngagementTracking}\n              onValueChange={(value: boolean) => {\n                client.setDebug({\n                  ...debugSettings,\n                  skipEngagementTracking: value,\n                });\n              }}\n            />\n          </Stack>\n          <Stack direction=\"row\" gap=\"2\" align=\"center\" h=\"7\">\n            <Tooltip\n              label=\"Ignore throttle and show next guide immediately\"\n              {...sharedTooltipProps}\n            >\n              <Box width=\"36\" mt=\"1\">\n                <Text\n                  as=\"span\"\n                  size=\"1\"\n                  weight=\"medium\"\n                  color=\"gray\"\n                  borderBottom=\"px\"\n                  borderStyle=\"dashed\"\n                >\n                  Ignore throttle\n                </Text>\n              </Box>\n            </Tooltip>\n            <Toggle.Default\n              size=\"1\"\n              pt=\"1_5\"\n              value={!!debugSettings.ignoreDisplayInterval}\n              onValueChange={(value: boolean) => {\n                client.setDebug({\n                  ...debugSettings,\n                  ignoreDisplayInterval: value,\n                });\n              }}\n            />\n          </Stack>\n        </Stack>\n      </Stack>\n      <Stack direction=\"column\" gap=\"1\" width=\"full\">\n        <Tooltip\n          label={\n            <Text as=\"span\" size=\"1\">\n              The tenant and data payload passed to KnockGuideProvider.\n              Available for use in runtime conditions.\n            </Text>\n          }\n          {...sharedTooltipProps}\n        >\n          <Text\n            as=\"span\"\n            size=\"1\"\n            weight=\"medium\"\n            borderBottom=\"px\"\n            borderStyle=\"dashed\"\n            mt=\"4\"\n            style={{\n              whiteSpace: \"nowrap\",\n              width: \"fit-content\",\n            }}\n          >\n            Target params\n          </Text>\n        </Tooltip>\n        <Stack direction=\"column\" gap=\"2\">\n          <Stack direction=\"row\" gap=\"2\" align=\"center\">\n            <Text\n              as=\"span\"\n              size=\"1\"\n              weight=\"medium\"\n              color=\"gray\"\n              width=\"36\"\n              mt=\"1\"\n            >\n              Tenant\n            </Text>\n            <Box\n              rounded=\"2\"\n              overflow=\"auto\"\n              backgroundColor=\"surface-2\"\n              border=\"px\"\n              p=\"1\"\n              style={{ flex: 1, minWidth: 0 }}\n            >\n              <pre style={{ fontSize: \"11px\", margin: 0 }}>\n                <code>{client.targetParams.tenant || \"-\"}</code>\n              </pre>\n            </Box>\n          </Stack>\n          <Stack direction=\"row\" gap=\"2\" align=\"flex-start\">\n            <Text\n              as=\"span\"\n              size=\"1\"\n              weight=\"medium\"\n              color=\"gray\"\n              width=\"36\"\n              mt=\"1\"\n            >\n              Data\n            </Text>\n            <Box\n              rounded=\"2\"\n              overflow=\"auto\"\n              backgroundColor=\"surface-2\"\n              border=\"px\"\n              p=\"1\"\n              style={{\n                flex: 1,\n                minWidth: 0,\n                minHeight: \"50px\",\n                maxHeight: \"200px\",\n              }}\n            >\n              <pre style={{ fontSize: \"11px\", margin: 0 }}>\n                <code>\n                  {client.targetParams.data\n                    ? JSON.stringify(client.targetParams.data, null, 2)\n                    : \"-\"}\n                </code>\n              </pre>\n            </Box>\n          </Stack>\n        </Stack>\n      </Stack>\n    </Box>\n  );\n};\n"],"names":["GuideContextDetails","client","useGuideContext","debugSettings","useStore","store","state","debug","Box","Stack","Text","React","Tooltip","sharedTooltipProps","Toggle","skipEngagementTracking","value","setDebug","ignoreDisplayInterval","whiteSpace","width","flex","minWidth","fontSize","margin","targetParams","tenant","minHeight","maxHeight","data","JSON","stringify"],"mappings":"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"}

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

@@ -1,22 +1,22 @@
 import { useGuideContext as x, useStore as G } from "@knocklabs/react-core";
-import { Button as C } from "@telegraph/button";
-import { Icon as T } from "@telegraph/icon";
-import { Box as h, Stack as n } from "@telegraph/layout";
-import { Tag as A } from "@telegraph/tag";
-import { Tooltip as y } from "@telegraph/tooltip";
-import { Text as v } from "@telegraph/typography";
-import { Gauge as R } from "lucide-react";
+import { Button as T } from "@telegraph/button";
+import { Icon as A } from "@telegraph/icon";
+import { Box as f, Stack as i } from "@telegraph/layout";
+import { Tag as C } from "@telegraph/tag";
+import { Tooltip as h } from "@telegraph/tooltip";
+import { Text as y } from "@telegraph/typography";
+import { Gauge as D } from "lucide-react";
 import * as t from "react";
-import { GuideAnnotatedStatusDot as i } from "./GuideAnnotatedStatusDot.mjs";
-import { GuideRowDetails as D, getSelectableStatusSummary as w } from "./GuideRowDetails.mjs";
-import { FOCUS_ERRORS as E } from "./helpers.mjs";
-import { isUncommittedGuide as l } from "./useInspectGuideClientStore.mjs";
-const z = "data-kgt-guide-row-key", S = ({
+import { GuideAnnotatedStatusDot as c } from "./GuideAnnotatedStatusDot.mjs";
+import { GuideRowDetails as z, getSelectableStatusSummary as w } from "./GuideRowDetails.mjs";
+import { sharedTooltipProps as E } from "./helpers.mjs";
+import { isUncommittedGuide as n } from "./useInspectGuideClientStore.mjs";
+const N = "data-kgt-guide-row-key", S = ({
   label: e,
   color: o = "gray",
   children: a
-}) => /* @__PURE__ */ t.createElement(n, { direction: "row", align: "center", gap: "0_5", px: "1", height: "5", bg: "surface-2", rounded: "full", border: "px", borderColor: "gray-4" }, /* @__PURE__ */ t.createElement(v, { as: "span", size: "0", color: o, weight: "medium" }, e), a), N = (e) => {
-  if (l(e))
+}) => /* @__PURE__ */ t.createElement(i, { direction: "row", align: "center", gap: "0_5", px: "1", height: "5", bg: "surface-2", rounded: "full", border: "px", borderColor: "gray-4" }, /* @__PURE__ */ t.createElement(y, { as: "span", size: "0", color: o, weight: "medium" }, e), a), $ = (e) => {
+  if (n(e))
     return {
       color: "red",
       label: "Inactive",
@@ -55,8 +55,8 @@ const z = "data-kgt-guide-row-key", S = ({
     label: "Not activated",
     description: "This guide cannot be activated in the current location"
   };
-}, O = (e) => {
-  if (l(e))
+}, I = (e) => {
+  if (n(e))
     return {
       active: {
         color: "gray"
@@ -85,21 +85,21 @@ const z = "data-kgt-guide-row-key", S = ({
   }, u = {
     color: o.targetable.status ? "blue" : "red",
     tooltip: `Targeting: ${o.targetable.status ? "Yes" : "No"}`
-  }, b = {
+  }, d = {
     color: o.activatable.status ? "blue" : "red",
     tooltip: `Activated: ${o.activatable.status ? "Yes" : "No"}`
-  }, s = w(o.selectable.status), d = {
-    color: s.color,
-    tooltip: s.label
+  }, l = w(o.selectable.status), b = {
+    color: l.color,
+    tooltip: l.label
   };
   return {
     active: a,
     archived: m,
     targetable: u,
-    activatable: b,
-    selectable: d
+    activatable: d,
+    selectable: b
   };
-}, P = ({
+}, M = ({
   guide: e,
   orderIndex: o,
   isExpanded: a,
@@ -108,38 +108,38 @@ const z = "data-kgt-guide-row-key", S = ({
   const {
     client: u
   } = x(), {
-    debugSettings: b
+    debugSettings: d
   } = G(u.store, (g) => ({
     debugSettings: g.debug || {}
-  })), [s, d] = t.useState(!1), f = b.focusedGuideKeys || {}, _ = Object.keys(f).length > 0, c = !!f[e.key], r = O(e), p = N(e), k = {
-    [z]: e.key
+  })), [l, b] = t.useState(!1), v = d.focusedGuideKeys || {}, k = Object.keys(v).length > 0, s = !!v[e.key], r = I(e), p = $(e), _ = {
+    [N]: e.key
   };
-  return /* @__PURE__ */ t.createElement(h, { rounded: "3", overflow: "hidden", border: "px", borderStyle: "solid", borderColor: a ? "gray-6" : "transparent", onMouseEnter: () => d(!0), onMouseLeave: () => d(!1), style: {
+  return /* @__PURE__ */ t.createElement(f, { rounded: "3", overflow: "hidden", border: "px", borderStyle: "solid", borderColor: a ? "gray-6" : "transparent", onMouseEnter: () => b(!0), onMouseLeave: () => b(!1), style: {
     cursor: "pointer"
-  }, ...k }, /* @__PURE__ */ t.createElement(n, { h: "7", px: "1", gap: "1", align: "center", justify: "space-between", rounded: "3", overflow: "hidden", border: "px", borderStyle: "solid", borderColor: a ? "transparent" : c ? "gray-6" : s ? "gray-4" : "transparent", backgroundColor: a ? "surface-2" : c ? "gray-2" : s ? "surface-2" : "transparent", onClick: () => m(e.key) }, /* @__PURE__ */ t.createElement(n, { align: "center", gap: "1_5", style: {
+  }, ..._ }, /* @__PURE__ */ t.createElement(i, { h: "7", px: "1", gap: "1", align: "center", justify: "space-between", rounded: "3", overflow: "hidden", border: "px", borderStyle: "solid", borderColor: a ? "transparent" : s ? "gray-6" : l ? "gray-4" : "transparent", backgroundColor: a ? "surface-2" : s ? "gray-2" : l ? "surface-2" : "transparent", onClick: () => m(e.key) }, /* @__PURE__ */ t.createElement(i, { align: "center", gap: "1_5", style: {
     minWidth: 0,
     flex: 1
-  } }, /* @__PURE__ */ t.createElement(n, { w: "7", justify: "space-between", align: "center", gap: "0_5" }, /* @__PURE__ */ t.createElement(h, { w: "3" }, !e.bypass_global_group_limit && /* @__PURE__ */ t.createElement(T, { icon: R, size: "0", color: "gray", alt: "Subject to throttling" })), /* @__PURE__ */ t.createElement(v, { as: "span", size: "1", weight: "medium", color: e.bypass_global_group_limit ? "blue" : "default", style: {
+  } }, /* @__PURE__ */ t.createElement(i, { w: "7", justify: "space-between", align: "center", gap: "0_5" }, /* @__PURE__ */ t.createElement(f, { w: "3" }, !e.bypass_global_group_limit && /* @__PURE__ */ t.createElement(A, { icon: D, size: "0", color: "gray", alt: "Subject to throttling" })), /* @__PURE__ */ t.createElement(y, { as: "span", size: "1", weight: "medium", color: e.bypass_global_group_limit ? "blue" : "default", style: {
     flexShrink: 0
-  } }, o + 1)), /* @__PURE__ */ t.createElement(y, { label: `${e.key}${e.bypass_global_group_limit ? " (unthrottled)" : ""}` }, /* @__PURE__ */ t.createElement(v, { as: "code", size: "1", weight: "medium", color: "default", style: {
+  } }, o + 1)), /* @__PURE__ */ t.createElement(h, { label: `${e.key}${e.bypass_global_group_limit ? " (unthrottled)" : ""}`, ...E }, /* @__PURE__ */ t.createElement(y, { as: "code", size: "1", weight: "medium", color: "default", style: {
     display: "block",
     overflow: "hidden",
     textOverflow: "ellipsis",
     whiteSpace: "nowrap",
     maxWidth: "200px"
-  } }, e.key))), /* @__PURE__ */ t.createElement(n, { align: "center", gap: "1_5", style: {
+  } }, e.key))), /* @__PURE__ */ t.createElement(i, { align: "center", gap: "1_5", style: {
     flexShrink: 0
-  } }, !_ && /* @__PURE__ */ t.createElement(y, { label: p.description }, /* @__PURE__ */ t.createElement(A, { size: "0", variant: "soft", color: p.color }, p.label)), /* @__PURE__ */ t.createElement(S, { label: "Elig:", color: l(e) ? "disabled" : e.annotation.isEligible ? "blue" : "gray" }, /* @__PURE__ */ t.createElement(i, { color: r.active.color, tooltip: r.active.tooltip }), /* @__PURE__ */ t.createElement(i, { color: r.archived.color, tooltip: r.archived.tooltip }), /* @__PURE__ */ t.createElement(i, { color: r.targetable.color, tooltip: r.targetable.tooltip })), /* @__PURE__ */ t.createElement(S, { label: "Vis:", color: l(e) ? "disabled" : e.annotation.isQualified && e.annotation.selectable.status === "returned" ? "blue" : "gray" }, /* @__PURE__ */ t.createElement(i, { color: r.activatable.color, tooltip: r.activatable.tooltip }), /* @__PURE__ */ t.createElement(i, { color: r.selectable.color, tooltip: r.selectable.tooltip })), /* @__PURE__ */ t.createElement(y, { label: l(e) ? E.focusUncommittedGuide : e.annotation.selectable.status === void 0 ? E.focusUnselectableGuide : "", enabled: l(e) || e.annotation.selectable.status === void 0 }, /* @__PURE__ */ t.createElement(C, { size: "0", variant: c ? "solid" : "outline", color: c ? "blue" : "gray", disabled: l(e) || e.annotation.selectable.status === void 0, onClick: (g) => {
+  } }, !k && /* @__PURE__ */ t.createElement(h, { label: p.description, ...E }, /* @__PURE__ */ t.createElement(C, { size: "0", variant: "soft", color: p.color }, p.label)), /* @__PURE__ */ t.createElement(S, { label: "Elig:", color: n(e) ? "disabled" : e.annotation.isEligible ? "blue" : "gray" }, /* @__PURE__ */ t.createElement(c, { color: r.active.color, tooltip: r.active.tooltip }), /* @__PURE__ */ t.createElement(c, { color: r.archived.color, tooltip: r.archived.tooltip }), /* @__PURE__ */ t.createElement(c, { color: r.targetable.color, tooltip: r.targetable.tooltip })), /* @__PURE__ */ t.createElement(S, { label: "Vis:", color: n(e) ? "disabled" : e.annotation.isQualified && e.annotation.selectable.status === "returned" ? "blue" : "gray" }, /* @__PURE__ */ t.createElement(c, { color: r.activatable.color, tooltip: r.activatable.tooltip }), /* @__PURE__ */ t.createElement(c, { color: r.selectable.color, tooltip: r.selectable.tooltip })), /* @__PURE__ */ t.createElement(T, { size: "0", variant: s ? "solid" : "outline", color: s ? "blue" : "gray", disabled: n(e) || e.annotation.selectable.status === void 0, onClick: (g) => {
     g.stopPropagation(), u.setDebug({
-      ...b,
-      focusedGuideKeys: c ? {} : {
+      ...d,
+      focusedGuideKeys: s ? {} : {
         [e.key]: !0
       }
     });
-  } }, "Focus")))), a && /* @__PURE__ */ t.createElement(D, { guide: e }));
+  } }, "Focus"))), a && /* @__PURE__ */ t.createElement(z, { guide: e }));
 };
 export {
-  z as GUIDE_ROW_DATA_SELECTOR,
-  P as GuideRow
+  N as GUIDE_ROW_DATA_SELECTOR,
+  M as GuideRow
 };
 //# sourceMappingURL=GuideRow.mjs.map

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

@@ -1 +1 @@
-{"version":3,"file":"GuideRow.mjs","sources":["../../../../../../../src/modules/guide/components/Toolbar/V2/GuideRow.tsx"],"sourcesContent":["import { useGuideContext, useStore } from \"@knocklabs/react-core\";\nimport { Button } from \"@telegraph/button\";\nimport { Icon } from \"@telegraph/icon\";\nimport { Box, Stack } from \"@telegraph/layout\";\nimport { Tag } from \"@telegraph/tag\";\nimport { Tooltip } from \"@telegraph/tooltip\";\nimport { Text } from \"@telegraph/typography\";\nimport { Gauge } from \"lucide-react\";\nimport * as React from \"react\";\n\nimport {\n  StatusColor,\n  GuideAnnotatedStatusDot as StatusDot,\n} from \"./GuideAnnotatedStatusDot\";\nimport {\n  GuideRowDetails,\n  StatusSummary,\n  getSelectableStatusSummary,\n} from \"./GuideRowDetails\";\nimport { FOCUS_ERRORS } from \"./helpers\";\nimport {\n  AnnotatedGuide,\n  AnnotatedStatuses,\n  UncommittedGuide,\n  isUncommittedGuide,\n} from \"./useInspectGuideClientStore\";\n\nexport const GUIDE_ROW_DATA_SELECTOR = \"data-kgt-guide-row-key\";\n\nconst Pill = ({\n  label,\n  color = \"gray\",\n  children,\n}: {\n  label: string;\n  color?: StatusColor | \"disabled\";\n  children: React.ReactNode;\n}) => {\n  return (\n    <Stack\n      direction=\"row\"\n      align=\"center\"\n      gap=\"0_5\"\n      px=\"1\"\n      height=\"5\"\n      bg=\"surface-2\"\n      rounded=\"full\"\n      border=\"px\"\n      borderColor=\"gray-4\"\n    >\n      <Text as=\"span\" size=\"0\" color={color} weight=\"medium\">\n        {label}\n      </Text>\n      {children}\n    </Stack>\n  );\n};\n\nconst getStatusSummary = (\n  guide: AnnotatedGuide | UncommittedGuide,\n): StatusSummary => {\n  if (isUncommittedGuide(guide)) {\n    return {\n      color: \"red\",\n      label: \"Inactive\",\n      description: \"This guide has never been committed and published yet\",\n    };\n  }\n\n  const { annotation } = guide;\n\n  if (!annotation.active.status) {\n    return {\n      color: \"red\",\n      label: \"Inactive\",\n      description: \"This guide is inactive\",\n    };\n  }\n  if (annotation.archived.status) {\n    return {\n      color: \"red\",\n      label: \"Archived\",\n      description: \"User has already dismissed this guide\",\n    };\n  }\n  if (!annotation.targetable.status) {\n    return {\n      color: \"red\",\n      label: \"Not targeted\",\n      description: annotation.targetable.message,\n    };\n  }\n\n  const selectableStatusSummary = getSelectableStatusSummary(\n    annotation.selectable.status,\n  );\n\n  // Prioritize an undefined selectable status ahead of activatable status.\n  if (annotation.selectable.status === undefined) {\n    return selectableStatusSummary;\n  }\n\n  if (!annotation.activatable.status) {\n    return {\n      color: \"red\",\n      label: \"Not activated\",\n      description: \"This guide cannot be activated in the current location\",\n    };\n  }\n\n  return {\n    ...selectableStatusSummary,\n\n    // Shorten the label we display here for space.\n    ...(annotation.selectable.status === \"returned\"\n      ? { label: \"Display\" }\n      : undefined),\n  };\n};\n\ntype StatusDot = {\n  color: StatusColor;\n  tooltip?: string;\n};\n\nconst getStatusDots = (\n  guide: AnnotatedGuide | UncommittedGuide,\n): Record<keyof AnnotatedStatuses, StatusDot> => {\n  if (isUncommittedGuide(guide)) {\n    return {\n      active: { color: \"gray\" },\n      archived: { color: \"gray\" },\n      targetable: { color: \"gray\" },\n      activatable: { color: \"gray\" },\n      selectable: { color: \"gray\" },\n    };\n  }\n\n  const { annotation } = guide;\n\n  const active: StatusDot = {\n    color: annotation.active.status ? \"blue\" : \"red\",\n    tooltip: `Active: ${annotation.active.status ? \"Yes\" : \"No\"}`,\n  };\n\n  const archived: StatusDot = {\n    color: annotation.archived.status ? \"red\" : \"blue\",\n    tooltip: `Archived: ${annotation.archived.status ? \"Yes\" : \"No\"}`,\n  };\n\n  const targetable: StatusDot = {\n    color: annotation.targetable.status ? \"blue\" : \"red\",\n    tooltip: `Targeting: ${annotation.targetable.status ? \"Yes\" : \"No\"}`,\n  };\n\n  const activatable: StatusDot = {\n    color: annotation.activatable.status ? \"blue\" : \"red\",\n    tooltip: `Activated: ${annotation.activatable.status ? \"Yes\" : \"No\"}`,\n  };\n\n  const selectableStatusSummary = getSelectableStatusSummary(\n    annotation.selectable.status,\n  );\n\n  const selectable = {\n    color: selectableStatusSummary.color,\n    tooltip: selectableStatusSummary.label,\n  };\n\n  return { active, archived, targetable, activatable, selectable };\n};\n\ntype Props = {\n  guide: UncommittedGuide | AnnotatedGuide;\n  orderIndex: number;\n  isExpanded: boolean;\n  onClick: (guideKey: string) => void;\n};\n\nexport const GuideRow = ({ guide, orderIndex, isExpanded, onClick }: Props) => {\n  const { client } = useGuideContext();\n  const { debugSettings } = useStore(client.store, (state) => ({\n    debugSettings: state.debug || {},\n  }));\n  const [isHovered, setIsHovered] = React.useState(false);\n\n  const focusedGuideKeys = debugSettings.focusedGuideKeys || {};\n  const hasFocus = Object.keys(focusedGuideKeys).length > 0;\n  const isFocused = !!focusedGuideKeys[guide.key];\n\n  const dots = getStatusDots(guide);\n  const summary = getStatusSummary(guide);\n  const dataAttrs = { [GUIDE_ROW_DATA_SELECTOR]: guide.key };\n\n  return (\n    <Box\n      rounded=\"3\"\n      overflow=\"hidden\"\n      border=\"px\"\n      borderStyle=\"solid\"\n      borderColor={isExpanded ? \"gray-6\" : \"transparent\"}\n      onMouseEnter={() => setIsHovered(true)}\n      onMouseLeave={() => setIsHovered(false)}\n      style={{ cursor: \"pointer\" }}\n      {...dataAttrs}\n    >\n      <Stack\n        h=\"7\"\n        px=\"1\"\n        gap=\"1\"\n        align=\"center\"\n        justify=\"space-between\"\n        rounded=\"3\"\n        overflow=\"hidden\"\n        border=\"px\"\n        borderStyle=\"solid\"\n        borderColor={\n          isExpanded\n            ? \"transparent\"\n            : isFocused\n              ? \"gray-6\"\n              : isHovered\n                ? \"gray-4\"\n                : \"transparent\"\n        }\n        backgroundColor={\n          isExpanded\n            ? \"surface-2\"\n            : isFocused\n              ? \"gray-2\"\n              : isHovered\n                ? \"surface-2\"\n                : \"transparent\"\n        }\n        onClick={() => onClick(guide.key)}\n      >\n        {/* Left section: order + key */}\n        <Stack align=\"center\" gap=\"1_5\" style={{ minWidth: 0, flex: 1 }}>\n          <Stack w=\"7\" justify=\"space-between\" align=\"center\" gap=\"0_5\">\n            <Box w=\"3\">\n              {!guide.bypass_global_group_limit && (\n                <Icon\n                  icon={Gauge}\n                  size=\"0\"\n                  color=\"gray\"\n                  alt=\"Subject to throttling\"\n                />\n              )}\n            </Box>\n            <Text\n              as=\"span\"\n              size=\"1\"\n              weight=\"medium\"\n              color={guide.bypass_global_group_limit ? \"blue\" : \"default\"}\n              style={{ flexShrink: 0 }}\n            >\n              {orderIndex + 1}\n            </Text>\n          </Stack>\n          <Tooltip\n            label={`${guide.key}${guide.bypass_global_group_limit ? \" (unthrottled)\" : \"\"}`}\n          >\n            <Text\n              as=\"code\"\n              size=\"1\"\n              weight=\"medium\"\n              color=\"default\"\n              style={{\n                display: \"block\",\n                overflow: \"hidden\",\n                textOverflow: \"ellipsis\",\n                whiteSpace: \"nowrap\",\n                maxWidth: \"200px\",\n              }}\n            >\n              {guide.key}\n            </Text>\n          </Tooltip>\n        </Stack>\n\n        {/* Right section: verdict + pills + focus */}\n        <Stack align=\"center\" gap=\"1_5\" style={{ flexShrink: 0 }}>\n          {!hasFocus && (\n            <Tooltip label={summary.description}>\n              <Tag size=\"0\" variant=\"soft\" color={summary.color}>\n                {summary.label}\n              </Tag>\n            </Tooltip>\n          )}\n\n          <Pill\n            label=\"Elig:\"\n            color={\n              isUncommittedGuide(guide)\n                ? \"disabled\"\n                : guide.annotation.isEligible\n                  ? \"blue\"\n                  : \"gray\"\n            }\n          >\n            <StatusDot\n              color={dots.active.color}\n              tooltip={dots.active.tooltip!}\n            />\n            <StatusDot\n              color={dots.archived.color}\n              tooltip={dots.archived.tooltip!}\n            />\n            <StatusDot\n              color={dots.targetable.color}\n              tooltip={dots.targetable.tooltip!}\n            />\n          </Pill>\n          <Pill\n            label=\"Vis:\"\n            color={\n              isUncommittedGuide(guide)\n                ? \"disabled\"\n                : guide.annotation.isQualified &&\n                    guide.annotation.selectable.status === \"returned\"\n                  ? \"blue\"\n                  : \"gray\"\n            }\n          >\n            <StatusDot\n              color={dots.activatable.color}\n              tooltip={dots.activatable.tooltip!}\n            />\n            <StatusDot\n              color={dots.selectable.color}\n              tooltip={dots.selectable.tooltip!}\n            />\n          </Pill>\n\n          <Tooltip\n            label={\n              isUncommittedGuide(guide)\n                ? FOCUS_ERRORS.focusUncommittedGuide\n                : guide.annotation.selectable.status === undefined\n                  ? FOCUS_ERRORS.focusUnselectableGuide\n                  : \"\"\n            }\n            enabled={\n              isUncommittedGuide(guide) ||\n              guide.annotation.selectable.status === undefined\n            }\n          >\n            <Button\n              size=\"0\"\n              variant={isFocused ? \"solid\" : \"outline\"}\n              color={isFocused ? \"blue\" : \"gray\"}\n              disabled={\n                isUncommittedGuide(guide) ||\n                guide.annotation.selectable.status === undefined\n              }\n              onClick={(e: React.MouseEvent) => {\n                e.stopPropagation();\n                client.setDebug({\n                  ...debugSettings,\n                  focusedGuideKeys: isFocused ? {} : { [guide.key]: true },\n                });\n              }}\n            >\n              Focus\n            </Button>\n          </Tooltip>\n        </Stack>\n      </Stack>\n\n      {isExpanded && <GuideRowDetails guide={guide} />}\n    </Box>\n  );\n};\n"],"names":["GUIDE_ROW_DATA_SELECTOR","Pill","label","color","children","React","Stack","Text","getStatusSummary","guide","isUncommittedGuide","description","annotation","active","status","archived","targetable","message","selectableStatusSummary","getSelectableStatusSummary","selectable","undefined","activatable","getStatusDots","tooltip","GuideRow","orderIndex","isExpanded","onClick","client","useGuideContext","debugSettings","useStore","store","state","debug","isHovered","setIsHovered","useState","focusedGuideKeys","hasFocus","Object","keys","length","isFocused","key","dots","summary","dataAttrs","Box","cursor","minWidth","flex","bypass_global_group_limit","Icon","Gauge","flexShrink","Tooltip","display","overflow","textOverflow","whiteSpace","maxWidth","Tag","isEligible","StatusDot","isQualified","FOCUS_ERRORS","focusUncommittedGuide","focusUnselectableGuide","Button","e","stopPropagation","setDebug","GuideRowDetails"],"mappings":"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"}
+{"version":3,"file":"GuideRow.mjs","sources":["../../../../../../../src/modules/guide/components/Toolbar/V2/GuideRow.tsx"],"sourcesContent":["import { useGuideContext, useStore } from \"@knocklabs/react-core\";\nimport { Button } from \"@telegraph/button\";\nimport { Icon } from \"@telegraph/icon\";\nimport { Box, Stack } from \"@telegraph/layout\";\nimport { Tag } from \"@telegraph/tag\";\nimport { Tooltip } from \"@telegraph/tooltip\";\nimport { Text } from \"@telegraph/typography\";\nimport { Gauge } from \"lucide-react\";\nimport * as React from \"react\";\n\nimport {\n  StatusColor,\n  GuideAnnotatedStatusDot as StatusDot,\n} from \"./GuideAnnotatedStatusDot\";\nimport {\n  GuideRowDetails,\n  StatusSummary,\n  getSelectableStatusSummary,\n} from \"./GuideRowDetails\";\nimport { sharedTooltipProps } from \"./helpers\";\nimport {\n  AnnotatedGuide,\n  AnnotatedStatuses,\n  UncommittedGuide,\n  isUncommittedGuide,\n} from \"./useInspectGuideClientStore\";\n\nexport const GUIDE_ROW_DATA_SELECTOR = \"data-kgt-guide-row-key\";\n\nconst Pill = ({\n  label,\n  color = \"gray\",\n  children,\n}: {\n  label: string;\n  color?: StatusColor | \"disabled\";\n  children: React.ReactNode;\n}) => {\n  return (\n    <Stack\n      direction=\"row\"\n      align=\"center\"\n      gap=\"0_5\"\n      px=\"1\"\n      height=\"5\"\n      bg=\"surface-2\"\n      rounded=\"full\"\n      border=\"px\"\n      borderColor=\"gray-4\"\n    >\n      <Text as=\"span\" size=\"0\" color={color} weight=\"medium\">\n        {label}\n      </Text>\n      {children}\n    </Stack>\n  );\n};\n\nconst getStatusSummary = (\n  guide: AnnotatedGuide | UncommittedGuide,\n): StatusSummary => {\n  if (isUncommittedGuide(guide)) {\n    return {\n      color: \"red\",\n      label: \"Inactive\",\n      description: \"This guide has never been committed and published yet\",\n    };\n  }\n\n  const { annotation } = guide;\n\n  if (!annotation.active.status) {\n    return {\n      color: \"red\",\n      label: \"Inactive\",\n      description: \"This guide is inactive\",\n    };\n  }\n  if (annotation.archived.status) {\n    return {\n      color: \"red\",\n      label: \"Archived\",\n      description: \"User has already dismissed this guide\",\n    };\n  }\n  if (!annotation.targetable.status) {\n    return {\n      color: \"red\",\n      label: \"Not targeted\",\n      description: annotation.targetable.message,\n    };\n  }\n\n  const selectableStatusSummary = getSelectableStatusSummary(\n    annotation.selectable.status,\n  );\n\n  // Prioritize an undefined selectable status ahead of activatable status.\n  if (annotation.selectable.status === undefined) {\n    return selectableStatusSummary;\n  }\n\n  if (!annotation.activatable.status) {\n    return {\n      color: \"red\",\n      label: \"Not activated\",\n      description: \"This guide cannot be activated in the current location\",\n    };\n  }\n\n  return {\n    ...selectableStatusSummary,\n\n    // Shorten the label we display here for space.\n    ...(annotation.selectable.status === \"returned\"\n      ? { label: \"Display\" }\n      : undefined),\n  };\n};\n\ntype StatusDot = {\n  color: StatusColor;\n  tooltip?: string;\n};\n\nconst getStatusDots = (\n  guide: AnnotatedGuide | UncommittedGuide,\n): Record<keyof AnnotatedStatuses, StatusDot> => {\n  if (isUncommittedGuide(guide)) {\n    return {\n      active: { color: \"gray\" },\n      archived: { color: \"gray\" },\n      targetable: { color: \"gray\" },\n      activatable: { color: \"gray\" },\n      selectable: { color: \"gray\" },\n    };\n  }\n\n  const { annotation } = guide;\n\n  const active: StatusDot = {\n    color: annotation.active.status ? \"blue\" : \"red\",\n    tooltip: `Active: ${annotation.active.status ? \"Yes\" : \"No\"}`,\n  };\n\n  const archived: StatusDot = {\n    color: annotation.archived.status ? \"red\" : \"blue\",\n    tooltip: `Archived: ${annotation.archived.status ? \"Yes\" : \"No\"}`,\n  };\n\n  const targetable: StatusDot = {\n    color: annotation.targetable.status ? \"blue\" : \"red\",\n    tooltip: `Targeting: ${annotation.targetable.status ? \"Yes\" : \"No\"}`,\n  };\n\n  const activatable: StatusDot = {\n    color: annotation.activatable.status ? \"blue\" : \"red\",\n    tooltip: `Activated: ${annotation.activatable.status ? \"Yes\" : \"No\"}`,\n  };\n\n  const selectableStatusSummary = getSelectableStatusSummary(\n    annotation.selectable.status,\n  );\n\n  const selectable = {\n    color: selectableStatusSummary.color,\n    tooltip: selectableStatusSummary.label,\n  };\n\n  return { active, archived, targetable, activatable, selectable };\n};\n\ntype Props = {\n  guide: UncommittedGuide | AnnotatedGuide;\n  orderIndex: number;\n  isExpanded: boolean;\n  onClick: (guideKey: string) => void;\n};\n\nexport const GuideRow = ({ guide, orderIndex, isExpanded, onClick }: Props) => {\n  const { client } = useGuideContext();\n  const { debugSettings } = useStore(client.store, (state) => ({\n    debugSettings: state.debug || {},\n  }));\n  const [isHovered, setIsHovered] = React.useState(false);\n\n  const focusedGuideKeys = debugSettings.focusedGuideKeys || {};\n  const hasFocus = Object.keys(focusedGuideKeys).length > 0;\n  const isFocused = !!focusedGuideKeys[guide.key];\n\n  const dots = getStatusDots(guide);\n  const summary = getStatusSummary(guide);\n  const dataAttrs = { [GUIDE_ROW_DATA_SELECTOR]: guide.key };\n\n  return (\n    <Box\n      rounded=\"3\"\n      overflow=\"hidden\"\n      border=\"px\"\n      borderStyle=\"solid\"\n      borderColor={isExpanded ? \"gray-6\" : \"transparent\"}\n      onMouseEnter={() => setIsHovered(true)}\n      onMouseLeave={() => setIsHovered(false)}\n      style={{ cursor: \"pointer\" }}\n      {...dataAttrs}\n    >\n      <Stack\n        h=\"7\"\n        px=\"1\"\n        gap=\"1\"\n        align=\"center\"\n        justify=\"space-between\"\n        rounded=\"3\"\n        overflow=\"hidden\"\n        border=\"px\"\n        borderStyle=\"solid\"\n        borderColor={\n          isExpanded\n            ? \"transparent\"\n            : isFocused\n              ? \"gray-6\"\n              : isHovered\n                ? \"gray-4\"\n                : \"transparent\"\n        }\n        backgroundColor={\n          isExpanded\n            ? \"surface-2\"\n            : isFocused\n              ? \"gray-2\"\n              : isHovered\n                ? \"surface-2\"\n                : \"transparent\"\n        }\n        onClick={() => onClick(guide.key)}\n      >\n        {/* Left section: order + key */}\n        <Stack align=\"center\" gap=\"1_5\" style={{ minWidth: 0, flex: 1 }}>\n          <Stack w=\"7\" justify=\"space-between\" align=\"center\" gap=\"0_5\">\n            <Box w=\"3\">\n              {!guide.bypass_global_group_limit && (\n                <Icon\n                  icon={Gauge}\n                  size=\"0\"\n                  color=\"gray\"\n                  alt=\"Subject to throttling\"\n                />\n              )}\n            </Box>\n            <Text\n              as=\"span\"\n              size=\"1\"\n              weight=\"medium\"\n              color={guide.bypass_global_group_limit ? \"blue\" : \"default\"}\n              style={{ flexShrink: 0 }}\n            >\n              {orderIndex + 1}\n            </Text>\n          </Stack>\n          <Tooltip\n            label={`${guide.key}${guide.bypass_global_group_limit ? \" (unthrottled)\" : \"\"}`}\n            {...sharedTooltipProps}\n          >\n            <Text\n              as=\"code\"\n              size=\"1\"\n              weight=\"medium\"\n              color=\"default\"\n              style={{\n                display: \"block\",\n                overflow: \"hidden\",\n                textOverflow: \"ellipsis\",\n                whiteSpace: \"nowrap\",\n                maxWidth: \"200px\",\n              }}\n            >\n              {guide.key}\n            </Text>\n          </Tooltip>\n        </Stack>\n\n        {/* Right section: verdict + pills + focus */}\n        <Stack align=\"center\" gap=\"1_5\" style={{ flexShrink: 0 }}>\n          {!hasFocus && (\n            <Tooltip label={summary.description} {...sharedTooltipProps}>\n              <Tag size=\"0\" variant=\"soft\" color={summary.color}>\n                {summary.label}\n              </Tag>\n            </Tooltip>\n          )}\n\n          <Pill\n            label=\"Elig:\"\n            color={\n              isUncommittedGuide(guide)\n                ? \"disabled\"\n                : guide.annotation.isEligible\n                  ? \"blue\"\n                  : \"gray\"\n            }\n          >\n            <StatusDot\n              color={dots.active.color}\n              tooltip={dots.active.tooltip!}\n            />\n            <StatusDot\n              color={dots.archived.color}\n              tooltip={dots.archived.tooltip!}\n            />\n            <StatusDot\n              color={dots.targetable.color}\n              tooltip={dots.targetable.tooltip!}\n            />\n          </Pill>\n          <Pill\n            label=\"Vis:\"\n            color={\n              isUncommittedGuide(guide)\n                ? \"disabled\"\n                : guide.annotation.isQualified &&\n                    guide.annotation.selectable.status === \"returned\"\n                  ? \"blue\"\n                  : \"gray\"\n            }\n          >\n            <StatusDot\n              color={dots.activatable.color}\n              tooltip={dots.activatable.tooltip!}\n            />\n            <StatusDot\n              color={dots.selectable.color}\n              tooltip={dots.selectable.tooltip!}\n            />\n          </Pill>\n\n          <Button\n            size=\"0\"\n            variant={isFocused ? \"solid\" : \"outline\"}\n            color={isFocused ? \"blue\" : \"gray\"}\n            disabled={\n              isUncommittedGuide(guide) ||\n              guide.annotation.selectable.status === undefined\n            }\n            onClick={(e: React.MouseEvent) => {\n              e.stopPropagation();\n              client.setDebug({\n                ...debugSettings,\n                focusedGuideKeys: isFocused ? {} : { [guide.key]: true },\n              });\n            }}\n          >\n            Focus\n          </Button>\n        </Stack>\n      </Stack>\n\n      {isExpanded && <GuideRowDetails guide={guide} />}\n    </Box>\n  );\n};\n"],"names":["GUIDE_ROW_DATA_SELECTOR","Pill","label","color","children","React","Stack","Text","getStatusSummary","guide","isUncommittedGuide","description","annotation","active","status","archived","targetable","message","selectableStatusSummary","getSelectableStatusSummary","selectable","undefined","activatable","getStatusDots","tooltip","GuideRow","orderIndex","isExpanded","onClick","client","useGuideContext","debugSettings","useStore","store","state","debug","isHovered","setIsHovered","useState","focusedGuideKeys","hasFocus","Object","keys","length","isFocused","key","dots","summary","dataAttrs","Box","cursor","minWidth","flex","bypass_global_group_limit","Icon","Gauge","flexShrink","Tooltip","sharedTooltipProps","display","overflow","textOverflow","whiteSpace","maxWidth","Tag","isEligible","StatusDot","isQualified","Button","e","stopPropagation","setDebug","GuideRowDetails"],"mappings":"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"}

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

@@ -1,59 +1,69 @@
 import e from "react";
-import { Box as c, Stack as l } from "@telegraph/layout";
-import { Tooltip as u } from "@telegraph/tooltip";
+import { useGuideContext as h } from "@knocklabs/react-core";
+import { Button as c } from "@telegraph/button";
+import { Box as p, Stack as l } from "@telegraph/layout";
+import { Tooltip as d } from "@telegraph/tooltip";
 import { Text as s } from "@telegraph/typography";
-import { GuideAnnotatedStatusDot as d } from "./GuideAnnotatedStatusDot.mjs";
-import { FOCUS_ERRORS as m } from "./helpers.mjs";
-import { isUncommittedGuide as p } from "./useInspectGuideClientStore.mjs";
-const n = ({
-  title: i,
-  children: t
+import { GuideAnnotatedStatusDot as g } from "./GuideAnnotatedStatusDot.mjs";
+import { sharedTooltipProps as m } from "./helpers.mjs";
+import { isUncommittedGuide as b } from "./useInspectGuideClientStore.mjs";
+const u = ({
+  title: r,
+  children: i
 }) => /* @__PURE__ */ e.createElement(l, { direction: "column", justify: "flex-start", gap: "1", px: "1_5", py: "1", rounded: "2", bg: "surface-1", border: "px", borderColor: "gray-4", style: {
-  flex: 1
-} }, /* @__PURE__ */ e.createElement(s, { as: "span", size: "0", color: "gray", weight: "medium" }, i), /* @__PURE__ */ e.createElement(l, { direction: "column", gap: "1", mt: "1" }, t)), r = ({
-  label: i,
-  value: t,
-  color: a,
-  tooltip: o
-}) => /* @__PURE__ */ e.createElement(l, { align: "center", gap: "1" }, /* @__PURE__ */ e.createElement(u, { enabled: !!o, label: o, delayDuration: 500 }, /* @__PURE__ */ e.createElement(l, { as: "span", align: "center", gap: "1", display: "inline-flex" }, /* @__PURE__ */ e.createElement(d, { color: a, tooltip: `${i}: ${t}` }), /* @__PURE__ */ e.createElement(s, { as: "span", size: "1", weight: "medium" }, i, ":"), /* @__PURE__ */ e.createElement(s, { as: "span", size: "1", weight: "medium", color: a }, t)))), b = (i) => {
-  switch (i) {
+  flex: 1,
+  alignSelf: "stretch"
+} }, /* @__PURE__ */ e.createElement(s, { as: "span", size: "0", color: "gray", weight: "medium" }, r), /* @__PURE__ */ e.createElement(l, { direction: "column", gap: "1" }, i)), n = ({
+  label: r,
+  value: i,
+  color: t,
+  tooltip: o,
+  children: a
+}) => /* @__PURE__ */ e.createElement(l, { align: "center", gap: "1" }, /* @__PURE__ */ e.createElement(d, { enabled: !!o, label: o, ...m }, /* @__PURE__ */ e.createElement(l, { align: "center", gap: "1", display: "inline-flex" }, /* @__PURE__ */ e.createElement(g, { color: t, tooltip: `${r}: ${i}` }), /* @__PURE__ */ e.createElement(s, { as: "span", size: "1", weight: "medium" }, r, ":"), !a && /* @__PURE__ */ e.createElement(s, { as: "span", size: "1", weight: "medium", color: t }, i))), a), E = (r) => {
+  switch (r) {
     case "returned":
       return {
         label: "Ready to display",
         color: "blue",
-        description: "This guide is queried and ready to display"
+        description: "The guide is queried and ready to render."
       };
     case "throttled":
       return {
         label: "Throttled",
         color: "yellow",
-        description: "This guide is queried and ready to display, but throttled currently"
+        description: "The guide is queried but held back by throttle settings."
       };
     case "queried":
       return {
         label: "Queued",
         color: "gray",
-        description: "This guide is queried but is not ready to display"
+        description: "The guide is queried but waiting behind higher-priority guides."
       };
     default:
       return {
         label: "Not queried",
         color: "red",
-        description: `This guide is not queried (${m.focusUnselectableGuide.toLowerCase()})`
+        description: "No useGuide(s) call on this page matches this guide."
       };
   }
-}, x = ({
-  guide: i
+}, C = ({
+  guide: r
 }) => {
-  if (p(i))
-    return /* @__PURE__ */ e.createElement(c, { px: "3", py: "2" }, /* @__PURE__ */ e.createElement(s, { as: "span", size: "1", color: "gray" }, "This guide has never been committed and published."));
   const {
-    annotation: t
-  } = i, a = b(t.selectable.status);
-  return /* @__PURE__ */ e.createElement(l, { px: "3", py: "2", gap: "2", direction: "row", align: "flex-start" }, /* @__PURE__ */ e.createElement(n, { title: "Eligibility" }, /* @__PURE__ */ e.createElement(r, { label: "Active", value: t.active.status ? "Yes" : "No", color: t.active.status ? "blue" : "red", tooltip: "Eligible if the guide is currently active" }), /* @__PURE__ */ e.createElement(r, { label: "Archived", value: t.archived.status ? "Yes" : "No", color: t.archived.status ? "red" : "blue", tooltip: "Eligible if the guide has not been dismissed/archived by the user already" }), /* @__PURE__ */ e.createElement(r, { label: "Targeting", value: t.targetable.status ? "Yes" : "No", color: t.targetable.status ? "blue" : "red", tooltip: "Eligible if the user meets the guide's targeting conditions" })), /* @__PURE__ */ e.createElement(n, { title: "Visibility" }, /* @__PURE__ */ e.createElement(r, { label: "Activation", value: t.activatable.status ? "Yes" : "No", color: t.activatable.status ? "blue" : "red", tooltip: "Visible when the user's current location matches the guide's activation rules" }), /* @__PURE__ */ e.createElement(r, { label: "Display", value: a.label, color: a.color, tooltip: /* @__PURE__ */ e.createElement(s, { as: "span", size: "1" }, "Visible when the guide is queried via `useGuide(s)` in the current page,", /* @__PURE__ */ e.createElement("br", null), "and ready to display per its position in the display pipeline:", /* @__PURE__ */ e.createElement("br", null), a.description) })));
+    client: i
+  } = h();
+  if (b(r))
+    return /* @__PURE__ */ e.createElement(p, { px: "3", py: "2" }, /* @__PURE__ */ e.createElement(s, { as: "span", size: "1", color: "gray" }, "This guide has never been committed and published."));
+  const {
+    annotation: t,
+    dashboard_url: o
+  } = r, a = E(t.selectable.status);
+  return /* @__PURE__ */ e.createElement(l, { p: "1", gap: "2", direction: "row", align: "flex-start" }, /* @__PURE__ */ e.createElement(u, { title: "Eligibility" }, /* @__PURE__ */ e.createElement(n, { label: "Active", value: t.active.status ? "Yes" : "No", color: t.active.status ? "blue" : "red", tooltip: "Whether the guide is active in this environment." }), /* @__PURE__ */ e.createElement(n, { label: "Archived", value: t.archived.status ? "Yes" : "No", color: t.archived.status ? "red" : "blue", tooltip: "Whether the current user has dismissed this guide." }), /* @__PURE__ */ e.createElement(n, { label: "Targeting", value: t.targetable.status ? "Yes" : "No", color: t.targetable.status ? "blue" : "red", tooltip: "Whether the current user matches the guide's targeting conditions." })), /* @__PURE__ */ e.createElement(u, { title: "Visibility" }, /* @__PURE__ */ e.createElement(n, { label: "Activation", value: t.activatable.status ? "Yes" : "No", color: t.activatable.status ? "blue" : "red", tooltip: "Whether the current page matches the guide's activation rules." }), /* @__PURE__ */ e.createElement(n, { label: "Display", value: a.label, color: a.color, tooltip: "Whether the guide has been queried and is ready to render on the current page." }, /* @__PURE__ */ e.createElement(d, { label: a.description, ...m }, /* @__PURE__ */ e.createElement(s, { as: "span", size: "1", weight: "medium", color: a.color }, a.label)))), /* @__PURE__ */ e.createElement(l, { direction: "column", justify: "flex-end", gap: "1", style: {
+    alignSelf: "stretch"
+  } }, /* @__PURE__ */ e.createElement(c, { size: "0", variant: "outline", onClick: () => i.resetEngagement(r) }, "Reset engagement"), o && /* @__PURE__ */ e.createElement(c, { size: "0", variant: "outline", onClick: () => window.open(o, "_blank", "noopener") }, "Open in dashboard")));
 };
 export {
-  x as GuideRowDetails,
-  b as getSelectableStatusSummary
+  C as GuideRowDetails,
+  E as getSelectableStatusSummary
 };
 //# sourceMappingURL=GuideRowDetails.mjs.map

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

@@ -1 +1 @@
-{"version":3,"file":"GuideRowDetails.mjs","sources":["../../../../../../../src/modules/guide/components/Toolbar/V2/GuideRowDetails.tsx"],"sourcesContent":["import { Box, Stack } from \"@telegraph/layout\";\nimport { Tooltip } from \"@telegraph/tooltip\";\nimport { Text } from \"@telegraph/typography\";\n\nimport {\n  StatusColor,\n  GuideAnnotatedStatusDot as StatusDot,\n} from \"./GuideAnnotatedStatusDot\";\nimport { FOCUS_ERRORS } from \"./helpers\";\nimport {\n  AnnotatedGuide,\n  UncommittedGuide,\n  isUncommittedGuide,\n} from \"./useInspectGuideClientStore\";\n\nconst CardContainer = ({\n  title,\n  children,\n}: {\n  title: string;\n  children: React.ReactNode;\n}) => (\n  <Stack\n    direction=\"column\"\n    justify=\"flex-start\"\n    gap=\"1\"\n    px=\"1_5\"\n    py=\"1\"\n    rounded=\"2\"\n    bg=\"surface-1\"\n    border=\"px\"\n    borderColor=\"gray-4\"\n    style={{ flex: 1 }}\n  >\n    <Text as=\"span\" size=\"0\" color=\"gray\" weight=\"medium\">\n      {title}\n    </Text>\n    <Stack direction=\"column\" gap=\"1\" mt=\"1\">\n      {children}\n    </Stack>\n  </Stack>\n);\n\nconst StatusRow = ({\n  label,\n  value,\n  color,\n  tooltip,\n}: {\n  label: string;\n  value: string;\n  color: StatusColor;\n  tooltip?: React.ReactNode;\n}) => {\n  return (\n    <Stack align=\"center\" gap=\"1\">\n      <Tooltip enabled={!!tooltip} label={tooltip} delayDuration={500}>\n        <Stack as=\"span\" align=\"center\" gap=\"1\" display=\"inline-flex\">\n          <StatusDot color={color} tooltip={`${label}: ${value}`} />\n          <Text as=\"span\" size=\"1\" weight=\"medium\">\n            {label}:\n          </Text>\n          <Text as=\"span\" size=\"1\" weight=\"medium\" color={color}>\n            {value}\n          </Text>\n        </Stack>\n      </Tooltip>\n    </Stack>\n  );\n};\n\nexport type StatusSummary = {\n  color: StatusColor;\n  label: string;\n  description: string;\n};\n\nexport const getSelectableStatusSummary = (\n  status: \"returned\" | \"throttled\" | \"queried\" | undefined,\n): StatusSummary => {\n  switch (status) {\n    case \"returned\":\n      return {\n        label: \"Ready to display\",\n        color: \"blue\",\n        description: \"This guide is queried and ready to display\",\n      };\n    case \"throttled\":\n      return {\n        label: \"Throttled\",\n        color: \"yellow\",\n        description:\n          \"This guide is queried and ready to display, but throttled currently\",\n      };\n    case \"queried\":\n      return {\n        label: \"Queued\",\n        color: \"gray\",\n        description: \"This guide is queried but is not ready to display\",\n      };\n    default:\n      return {\n        label: \"Not queried\",\n        color: \"red\",\n        description: `This guide is not queried (${FOCUS_ERRORS.focusUnselectableGuide.toLowerCase()})`,\n      };\n  }\n};\n\nexport const GuideRowDetails = ({\n  guide,\n}: {\n  guide: AnnotatedGuide | UncommittedGuide;\n}) => {\n  if (isUncommittedGuide(guide)) {\n    return (\n      <Box px=\"3\" py=\"2\">\n        <Text as=\"span\" size=\"1\" color=\"gray\">\n          This guide has never been committed and published.\n        </Text>\n      </Box>\n    );\n  }\n\n  const { annotation } = guide;\n  const selectableStatusSummary = getSelectableStatusSummary(\n    annotation.selectable.status,\n  );\n\n  return (\n    <Stack px=\"3\" py=\"2\" gap=\"2\" direction=\"row\" align=\"flex-start\">\n      <CardContainer title=\"Eligibility\">\n        <StatusRow\n          label=\"Active\"\n          value={annotation.active.status ? \"Yes\" : \"No\"}\n          color={annotation.active.status ? \"blue\" : \"red\"}\n          tooltip=\"Eligible if the guide is currently active\"\n        />\n        <StatusRow\n          label=\"Archived\"\n          value={annotation.archived.status ? \"Yes\" : \"No\"}\n          color={annotation.archived.status ? \"red\" : \"blue\"}\n          tooltip=\"Eligible if the guide has not been dismissed/archived by the user already\"\n        />\n        <StatusRow\n          label=\"Targeting\"\n          value={annotation.targetable.status ? \"Yes\" : \"No\"}\n          color={annotation.targetable.status ? \"blue\" : \"red\"}\n          tooltip=\"Eligible if the user meets the guide's targeting conditions\"\n        />\n      </CardContainer>\n\n      <CardContainer title=\"Visibility\">\n        <StatusRow\n          label=\"Activation\"\n          value={annotation.activatable.status ? \"Yes\" : \"No\"}\n          color={annotation.activatable.status ? \"blue\" : \"red\"}\n          tooltip=\"Visible when the user's current location matches the guide's activation rules\"\n        />\n        <StatusRow\n          label=\"Display\"\n          value={selectableStatusSummary.label}\n          color={selectableStatusSummary.color}\n          tooltip={\n            <Text as=\"span\" size=\"1\">\n              Visible when the guide is queried via `useGuide(s)` in the current\n              page,\n              <br />\n              and ready to display per its position in the display pipeline:\n              <br />\n              {selectableStatusSummary.description}\n            </Text>\n          }\n        />\n      </CardContainer>\n    </Stack>\n  );\n};\n"],"names":["CardContainer","title","children","React","Stack","flex","Text","StatusRow","label","value","color","tooltip","Tooltip","StatusDot","getSelectableStatusSummary","status","description","FOCUS_ERRORS","focusUnselectableGuide","toLowerCase","GuideRowDetails","guide","isUncommittedGuide","Box","annotation","selectableStatusSummary","selectable","active","archived","targetable","activatable"],"mappings":"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"}
+{"version":3,"file":"GuideRowDetails.mjs","sources":["../../../../../../../src/modules/guide/components/Toolbar/V2/GuideRowDetails.tsx"],"sourcesContent":["import { useGuideContext } 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\";\n\nimport {\n  StatusColor,\n  GuideAnnotatedStatusDot as StatusDot,\n} from \"./GuideAnnotatedStatusDot\";\nimport { sharedTooltipProps } from \"./helpers\";\nimport {\n  AnnotatedGuide,\n  UncommittedGuide,\n  isUncommittedGuide,\n} from \"./useInspectGuideClientStore\";\n\nconst CardContainer = ({\n  title,\n  children,\n}: {\n  title: string;\n  children: React.ReactNode;\n}) => (\n  <Stack\n    direction=\"column\"\n    justify=\"flex-start\"\n    gap=\"1\"\n    px=\"1_5\"\n    py=\"1\"\n    rounded=\"2\"\n    bg=\"surface-1\"\n    border=\"px\"\n    borderColor=\"gray-4\"\n    style={{ flex: 1, alignSelf: \"stretch\" }}\n  >\n    <Text as=\"span\" size=\"0\" color=\"gray\" weight=\"medium\">\n      {title}\n    </Text>\n    <Stack direction=\"column\" gap=\"1\">\n      {children}\n    </Stack>\n  </Stack>\n);\n\nconst StatusRow = ({\n  label,\n  value,\n  color,\n  tooltip,\n  children,\n}: {\n  label: string;\n  value: string;\n  color: StatusColor;\n  tooltip?: React.ReactNode;\n  children?: React.ReactNode;\n}) => {\n  return (\n    <Stack align=\"center\" gap=\"1\">\n      <Tooltip enabled={!!tooltip} label={tooltip} {...sharedTooltipProps}>\n        <Stack align=\"center\" gap=\"1\" display=\"inline-flex\">\n          <StatusDot color={color} tooltip={`${label}: ${value}`} />\n          <Text as=\"span\" size=\"1\" weight=\"medium\">\n            {label}:\n          </Text>\n          {/* User children over value when provided, for cases when we want to\n              have its own tooltip over it */}\n          {!children && (\n            <Text as=\"span\" size=\"1\" weight=\"medium\" color={color}>\n              {value}\n            </Text>\n          )}\n        </Stack>\n      </Tooltip>\n      {children}\n    </Stack>\n  );\n};\n\nexport type StatusSummary = {\n  color: StatusColor;\n  label: string;\n  description: string;\n};\n\nexport const getSelectableStatusSummary = (\n  status: \"returned\" | \"throttled\" | \"queried\" | undefined,\n): StatusSummary => {\n  switch (status) {\n    case \"returned\":\n      return {\n        label: \"Ready to display\",\n        color: \"blue\",\n        description: \"The guide is queried and ready to render.\",\n      };\n    case \"throttled\":\n      return {\n        label: \"Throttled\",\n        color: \"yellow\",\n        description: \"The guide is queried but held back by throttle settings.\",\n      };\n    case \"queried\":\n      return {\n        label: \"Queued\",\n        color: \"gray\",\n        description:\n          \"The guide is queried but waiting behind higher-priority guides.\",\n      };\n    default:\n      return {\n        label: \"Not queried\",\n        color: \"red\",\n        description: \"No useGuide(s) call on this page matches this guide.\",\n      };\n  }\n};\n\nexport const GuideRowDetails = ({\n  guide,\n}: {\n  guide: AnnotatedGuide | UncommittedGuide;\n}) => {\n  const { client } = useGuideContext();\n\n  if (isUncommittedGuide(guide)) {\n    return (\n      <Box px=\"3\" py=\"2\">\n        <Text as=\"span\" size=\"1\" color=\"gray\">\n          This guide has never been committed and published.\n        </Text>\n      </Box>\n    );\n  }\n\n  const { annotation, dashboard_url: dashboardUrl } = guide;\n  const selectableStatusSummary = getSelectableStatusSummary(\n    annotation.selectable.status,\n  );\n\n  return (\n    <Stack p=\"1\" gap=\"2\" direction=\"row\" align=\"flex-start\">\n      <CardContainer title=\"Eligibility\">\n        <StatusRow\n          label=\"Active\"\n          value={annotation.active.status ? \"Yes\" : \"No\"}\n          color={annotation.active.status ? \"blue\" : \"red\"}\n          tooltip=\"Whether the guide is active in this environment.\"\n        />\n        <StatusRow\n          label=\"Archived\"\n          value={annotation.archived.status ? \"Yes\" : \"No\"}\n          color={annotation.archived.status ? \"red\" : \"blue\"}\n          tooltip=\"Whether the current user has dismissed this guide.\"\n        />\n        <StatusRow\n          label=\"Targeting\"\n          value={annotation.targetable.status ? \"Yes\" : \"No\"}\n          color={annotation.targetable.status ? \"blue\" : \"red\"}\n          tooltip=\"Whether the current user matches the guide's targeting conditions.\"\n        />\n      </CardContainer>\n      <CardContainer title=\"Visibility\">\n        <StatusRow\n          label=\"Activation\"\n          value={annotation.activatable.status ? \"Yes\" : \"No\"}\n          color={annotation.activatable.status ? \"blue\" : \"red\"}\n          tooltip=\"Whether the current page matches the guide's activation rules.\"\n        />\n        <StatusRow\n          label=\"Display\"\n          value={selectableStatusSummary.label}\n          color={selectableStatusSummary.color}\n          tooltip=\"Whether the guide has been queried and is ready to render on the current page.\"\n        >\n          <Tooltip\n            label={selectableStatusSummary.description}\n            {...sharedTooltipProps}\n          >\n            <Text\n              as=\"span\"\n              size=\"1\"\n              weight=\"medium\"\n              color={selectableStatusSummary.color}\n            >\n              {selectableStatusSummary.label}\n            </Text>\n          </Tooltip>\n        </StatusRow>\n      </CardContainer>\n      <Stack\n        direction=\"column\"\n        justify=\"flex-end\"\n        gap=\"1\"\n        style={{ alignSelf: \"stretch\" }}\n      >\n        <Button\n          size=\"0\"\n          variant=\"outline\"\n          onClick={() => client.resetEngagement(guide)}\n        >\n          Reset engagement\n        </Button>\n        {dashboardUrl && (\n          <Button\n            size=\"0\"\n            variant=\"outline\"\n            onClick={() => window.open(dashboardUrl, \"_blank\", \"noopener\")}\n          >\n            Open in dashboard\n          </Button>\n        )}\n      </Stack>\n    </Stack>\n  );\n};\n"],"names":["CardContainer","title","children","React","Stack","flex","alignSelf","Text","StatusRow","label","value","color","tooltip","Tooltip","sharedTooltipProps","StatusDot","getSelectableStatusSummary","status","description","GuideRowDetails","guide","client","useGuideContext","isUncommittedGuide","Box","annotation","dashboard_url","dashboardUrl","selectableStatusSummary","selectable","active","archived","targetable","activatable","Button","resetEngagement","window","open"],"mappings":";;;;;;;;;AAiBA,MAAMA,IAAgBA,CAAC;AAAA,EACrBC,OAAAA;AAAAA,EACAC,UAAAA;AAIF,MACEC,gBAAAA,EAAA,cAACC,KACC,WAAU,UACV,SAAQ,cACR,KAAI,KACJ,IAAG,OACH,IAAG,KACH,SAAQ,KACR,IAAG,aACH,QAAO,MACP,aAAY,UACZ,OAAO;AAAA,EAAEC,MAAM;AAAA,EAAGC,WAAW;AAAU,EAAA,mCAEtCC,GAAK,EAAA,IAAG,QAAO,MAAK,KAAI,OAAM,QAAO,QAAO,YAC1CN,CACH,mCACCG,GAAM,EAAA,WAAU,UAAS,KAAI,IAAA,GAC3BF,CACH,CACF,GAGIM,IAAYA,CAAC;AAAA,EACjBC,OAAAA;AAAAA,EACAC,OAAAA;AAAAA,EACAC,OAAAA;AAAAA,EACAC,SAAAA;AAAAA,EACAV,UAAAA;AAOF,MAEKC,gBAAAA,EAAA,cAAAC,GAAA,EAAM,OAAM,UAAS,KAAI,IAAA,GACvBD,gBAAAA,EAAA,cAAAU,GAAA,EAAQ,SAAS,CAAC,CAACD,GAAS,OAAOA,GAAS,GAAIE,EAAAA,GAC9CX,gBAAAA,EAAA,cAAAC,GAAA,EAAM,OAAM,UAAS,KAAI,KAAI,SAAQ,iBACnCD,gBAAAA,EAAA,cAAAY,GAAA,EAAU,OAAAJ,GAAc,SAAS,GAAGF,CAAK,KAAKC,CAAK,GAAG,CAAA,GACtDP,gBAAAA,EAAA,cAAAI,GAAA,EAAK,IAAG,QAAO,MAAK,KAAI,QAAO,SAAA,GAC7BE,GAAM,GACT,GAGC,CAACP,KACAC,gBAAAA,EAAA,cAACI,GAAK,EAAA,IAAG,QAAO,MAAK,KAAI,QAAO,UAAS,OAAAI,EAAA,GACtCD,CACH,CAEJ,CACF,GACCR,CACH,GAUSc,IAA6BA,CACxCC,MACkB;AAClB,UAAQA,GAAM;AAAA,IACZ,KAAK;AACI,aAAA;AAAA,QACLR,OAAO;AAAA,QACPE,OAAO;AAAA,QACPO,aAAa;AAAA,MACf;AAAA,IACF,KAAK;AACI,aAAA;AAAA,QACLT,OAAO;AAAA,QACPE,OAAO;AAAA,QACPO,aAAa;AAAA,MACf;AAAA,IACF,KAAK;AACI,aAAA;AAAA,QACLT,OAAO;AAAA,QACPE,OAAO;AAAA,QACPO,aACE;AAAA,MACJ;AAAA,IACF;AACS,aAAA;AAAA,QACLT,OAAO;AAAA,QACPE,OAAO;AAAA,QACPO,aAAa;AAAA,MACf;AAAA,EAAA;AAEN,GAEaC,IAAkBA,CAAC;AAAA,EAC9BC,OAAAA;AAGF,MAAM;AACE,QAAA;AAAA,IAAEC,QAAAA;AAAAA,MAAWC,EAAgB;AAE/BC,MAAAA,EAAmBH,CAAK;AAC1B,WACGjB,gBAAAA,EAAA,cAAAqB,GAAA,EAAI,IAAG,KAAI,IAAG,IACb,GAAArB,gBAAAA,EAAA,cAACI,GAAK,EAAA,IAAG,QAAO,MAAK,KAAI,OAAM,UAAM,oDAErC,CACF;AAIE,QAAA;AAAA,IAAEkB,YAAAA;AAAAA,IAAYC,eAAeC;AAAAA,EAAAA,IAAiBP,GAC9CQ,IAA0BZ,EAC9BS,EAAWI,WAAWZ,MACxB;AAEA,SACGd,gBAAAA,EAAA,cAAAC,GAAA,EAAM,GAAE,KAAI,KAAI,KAAI,WAAU,OAAM,OAAM,aAAA,GACxCD,gBAAAA,EAAA,cAAAH,GAAA,EAAc,OAAM,cACnB,GAAAG,gBAAAA,EAAA,cAACK,GACC,EAAA,OAAM,UACN,OAAOiB,EAAWK,OAAOb,SAAS,QAAQ,MAC1C,OAAOQ,EAAWK,OAAOb,SAAS,SAAS,OAC3C,SAAQ,mDAAkD,CAAA,GAE3Dd,gBAAAA,EAAA,cAAAK,GAAA,EACC,OAAM,YACN,OAAOiB,EAAWM,SAASd,SAAS,QAAQ,MAC5C,OAAOQ,EAAWM,SAASd,SAAS,QAAQ,QAC5C,SAAQ,qDAAoD,CAAA,GAE9Dd,gBAAAA,EAAA,cAACK,GACC,EAAA,OAAM,aACN,OAAOiB,EAAWO,WAAWf,SAAS,QAAQ,MAC9C,OAAOQ,EAAWO,WAAWf,SAAS,SAAS,OAC/C,SAAQ,qEAAoE,CAAA,CAEhF,GACAd,gBAAAA,EAAA,cAACH,GAAc,EAAA,OAAM,gBAClBG,gBAAAA,EAAA,cAAAK,GAAA,EACC,OAAM,cACN,OAAOiB,EAAWQ,YAAYhB,SAAS,QAAQ,MAC/C,OAAOQ,EAAWQ,YAAYhB,SAAS,SAAS,OAChD,SAAQ,kEAAgE,GAE1Ed,gBAAAA,EAAA,cAACK,GACC,EAAA,OAAM,WACN,OAAOoB,EAAwBnB,OAC/B,OAAOmB,EAAwBjB,OAC/B,SAAQ,iFAAA,GAEPR,gBAAAA,EAAA,cAAAU,GAAA,EACC,OAAOe,EAAwBV,aAC/B,GAAIJ,KAEHX,gBAAAA,EAAA,cAAAI,GAAA,EACC,IAAG,QACH,MAAK,KACL,QAAO,UACP,OAAOqB,EAAwBjB,MAAAA,GAE9BiB,EAAwBnB,KAC3B,CACF,CACF,CACF,GACAN,gBAAAA,EAAA,cAACC,GACC,EAAA,WAAU,UACV,SAAQ,YACR,KAAI,KACJ,OAAO;AAAA,IAAEE,WAAW;AAAA,EAAA,EAEpB,GAAAH,gBAAAA,EAAA,cAAC+B,GACC,EAAA,MAAK,KACL,SAAQ,WACR,SAAS,MAAMb,EAAOc,gBAAgBf,CAAK,EAAA,GAAE,kBAG/C,GACCO,KACExB,gBAAAA,EAAA,cAAA+B,GAAA,EACC,MAAK,KACL,SAAQ,WACR,SAAS,MAAME,OAAOC,KAAKV,GAAc,UAAU,UAAU,EAAE,GAAA,mBAGjE,CAEJ,CACF;AAEJ;"}