chordia-ui 3.3.8 → 3.3.9

package/dist/TourGuideTooltip.cjs.js.map

@@ -1 +1 @@
-{"version":3,"file":"TourGuideTooltip.cjs.js","sources":["../src/components/common/TourGuideTooltip.jsx"],"sourcesContent":["import React, { forwardRef, useId } from \"react\";\n\nconst CARD_W = 230;\nconst CARD_MIN_H = 141;\nconst BASE_BG = \"var(--Grey-Hover, #F3F7F7)\";\nconst BASE_BORDER = \"var(--Grey-absent, #D9D9D9)\";\n\nconst wrapperStyleByPosition = {\n  top: { left: \"50%\", bottom: \"100%\", transform: \"translateX(-50%)\" },\n  bottom: { left: \"50%\", top: \"100%\", transform: \"translateX(-50%)\" },\n  left: { top: \"50%\", right: \"100%\", transform: \"translateY(-50%)\" },\n  right: { top: \"50%\", left: \"100%\", transform: \"translateY(-50%)\" },\n};\n\nfunction getFixedPositionStyle(rect, position, gap) {\n  if (position === \"left\") {\n    return {\n      position: \"fixed\",\n      left: rect.left,\n      top: rect.centerY,\n      transform: `translate(calc(-100% - ${gap}px), -50%)`,\n    };\n  }\n\n  if (position === \"right\") {\n    return {\n      position: \"fixed\",\n      left: rect.right,\n      top: rect.centerY,\n      transform: `translate(${gap}px, -50%)`,\n    };\n  }\n\n  if (position === \"top\") {\n    return {\n      position: \"fixed\",\n      left: rect.centerX,\n      top: rect.top,\n      transform: `translate(-50%, calc(-100% - ${gap}px))`,\n    };\n  }\n\n  return {\n    position: \"fixed\",\n    left: rect.centerX,\n    top: rect.bottom,\n    transform: `translate(-50%, ${gap}px)`,\n  };\n}\n\nconst cardStyle = {\n  position: \"relative\",\n  borderRadius: 12,\n  boxShadow: \"0 2px 2px rgba(0, 0, 0, 0.25)\",\n  overflow: \"visible\",\n  fontFamily: \"Varta, var(--font-sans, sans-serif)\",\n};\n\nconst contentStyle = {\n  display: \"flex\",\n  flexDirection: \"column\",\n  padding: \"18px 20px 14px 20px\",\n};\n\nconst titleStyle = {\n  margin: 0,\n  fontSize: 14,\n  lineHeight: \"16px\",\n  fontWeight: 600,\n  color: \"var(--text-ink, #2e3236)\",\n};\n\nconst descriptionStyle = {\n  margin: \"12px 0 0 0\",\n  fontSize: 13,\n  lineHeight: 1.45,\n  fontWeight: 400,\n  color: \"var(--text-muted, #808183)\",\n  wordBreak: \"break-word\",\n};\n\nconst footerStyle = {\n  marginTop: 12,\n  height: 28,\n  display: \"flex\",\n  alignItems: \"center\",\n  justifyContent: \"space-between\",\n};\n\nconst stepStyle = {\n  fontSize: 12,\n  lineHeight: \"14px\",\n  fontWeight: 300,\n  color: \"var(--text-ink, #2e3236)\",\n};\n\nconst actionsStyle = {\n  display: \"flex\",\n  alignItems: \"center\",\n  gap: 4,\n};\n\nconst skipButtonStyle = {\n  height: 28,\n  border: \"none\",\n  borderRadius: 10,\n  fontSize: 13,\n  cursor: \"pointer\",\n  background: \"transparent\",\n  color: \"var(--text-ink, #2e3236)\",\n  fontWeight: 400,\n  padding: \"0 10px\",\n};\n\nconst nextButtonStyle = {\n  height: 28,\n  border: \"none\",\n  borderRadius: 10,\n  fontSize: 13,\n  cursor: \"pointer\",\n  background: \"#00a66e\",\n  color: \"#ffffff\",\n  fontWeight: 700,\n  padding: \"0 16px\",\n};\n\nconst arrowOuterByPosition = {\n  left: {\n    top: \"50%\",\n    right: -11,\n    transform: \"translateY(-50%)\",\n    borderTop: \"10px solid transparent\",\n    borderBottom: \"10px solid transparent\",\n    borderLeft: `11px solid ${BASE_BORDER}`,\n  },\n  right: {\n    top: \"50%\",\n    left: -11,\n    transform: \"translateY(-50%)\",\n    borderTop: \"10px solid transparent\",\n    borderBottom: \"10px solid transparent\",\n    borderRight: `11px solid ${BASE_BORDER}`,\n  },\n  top: {\n    left: \"50%\",\n    bottom: -11,\n    transform: \"translateX(-50%)\",\n    borderLeft: \"10px solid transparent\",\n    borderRight: \"10px solid transparent\",\n    borderTop: `11px solid ${BASE_BORDER}`,\n  },\n  bottom: {\n    left: \"50%\",\n    top: -11,\n    transform: \"translateX(-50%)\",\n    borderLeft: \"10px solid transparent\",\n    borderRight: \"10px solid transparent\",\n    borderBottom: `11px solid ${BASE_BORDER}`,\n  },\n};\n\nconst arrowInnerByPosition = {\n  left: {\n    top: \"50%\",\n    right: -10,\n    transform: \"translateY(-50%)\",\n    borderTop: \"9px solid transparent\",\n    borderBottom: \"9px solid transparent\",\n    borderLeft: `10px solid ${BASE_BG}`,\n  },\n  right: {\n    top: \"50%\",\n    left: -10,\n    transform: \"translateY(-50%)\",\n    borderTop: \"9px solid transparent\",\n    borderBottom: \"9px solid transparent\",\n    borderRight: `10px solid ${BASE_BG}`,\n  },\n  top: {\n    left: \"50%\",\n    bottom: -10,\n    transform: \"translateX(-50%)\",\n    borderLeft: \"9px solid transparent\",\n    borderRight: \"9px solid transparent\",\n    borderTop: `10px solid ${BASE_BG}`,\n  },\n  bottom: {\n    left: \"50%\",\n    top: -10,\n    transform: \"translateX(-50%)\",\n    borderLeft: \"9px solid transparent\",\n    borderRight: \"9px solid transparent\",\n    borderBottom: `10px solid ${BASE_BG}`,\n  },\n};\n\nconst TourGuideTooltip = forwardRef(function TourGuideTooltip(\n  {\n    title,\n    description,\n    step,\n    total,\n    onNext,\n    onSkip,\n    position = \"left\",\n    className = \"\",\n    style,\n    showArrow = true,\n    anchorId,\n    gap = 8,\n  },\n  ref\n) {\n  const titleId = useId();\n  const descriptionId = useId();\n  const [anchorRect, setAnchorRect] = React.useState(null);\n\n  React.useEffect(() => {\n    if (!anchorId) return undefined;\n\n    const updateRect = () => {\n      const target = document.getElementById(anchorId);\n      if (!target) {\n        setAnchorRect(null);\n        return;\n      }\n      const rect = target.getBoundingClientRect();\n      setAnchorRect({\n        left: rect.left,\n        right: rect.right,\n        top: rect.top,\n        bottom: rect.bottom,\n        centerX: rect.left + rect.width / 2,\n        centerY: rect.top + rect.height / 2,\n      });\n    };\n\n    updateRect();\n    window.addEventListener(\"resize\", updateRect);\n    window.addEventListener(\"scroll\", updateRect, true);\n    const timer = window.setInterval(updateRect, 120);\n\n    return () => {\n      window.removeEventListener(\"resize\", updateRect);\n      window.removeEventListener(\"scroll\", updateRect, true);\n      window.clearInterval(timer);\n    };\n  }, [anchorId]);\n\n  return (\n    <div\n      ref={ref}\n      role=\"dialog\"\n      aria-modal=\"false\"\n      aria-labelledby={titleId}\n      aria-describedby={descriptionId}\n      className={className}\n      style={{\n        zIndex: 1100,\n        ...(anchorId && anchorRect\n          ? getFixedPositionStyle(anchorRect, position, gap)\n          : { position: \"absolute\", ...wrapperStyleByPosition[position] }),\n        ...style,\n      }}\n    >\n      <div\n        style={{\n          ...cardStyle,\n          width: CARD_W,\n          minHeight: CARD_MIN_H,\n          background: BASE_BG,\n          border: `0.5px solid ${BASE_BORDER}`,\n        }}\n      >\n        {showArrow && (\n          <>\n            <span\n              style={{\n                position: \"absolute\",\n                width: 0,\n                height: 0,\n                ...arrowOuterByPosition[position],\n              }}\n            />\n            <span\n              style={{\n                position: \"absolute\",\n                width: 0,\n                height: 0,\n                ...arrowInnerByPosition[position],\n              }}\n            />\n          </>\n        )}\n\n        <div style={contentStyle}>\n          <h3 id={titleId} style={titleStyle}>\n            {title}\n          </h3>\n\n          <p id={descriptionId} style={descriptionStyle}>\n            {description}\n          </p>\n\n          <div style={footerStyle}>\n            <span aria-label={`Step ${step} of ${total}`} style={stepStyle}>\n              {step} of {total}\n            </span>\n\n            <div style={actionsStyle}>\n              <button\n                type=\"button\"\n                onClick={onSkip}\n                aria-label=\"Skip tour\"\n                style={skipButtonStyle}\n              >\n                Skip\n              </button>\n\n                <button\n                  type=\"button\"\n                  onClick={onNext}\n                  aria-label={`Go to next step (${step + 1} of ${total})`}\n                  style={nextButtonStyle}\n                >\n                  Next\n                </button>\n            </div>\n          </div>\n        </div>\n      </div>\n    </div>\n  );\n});\n\nexport default TourGuideTooltip;\n\n"],"names":["CARD_W","CARD_MIN_H","BASE_BG","BASE_BORDER","wrapperStyleByPosition","getFixedPositionStyle","rect","position","gap","cardStyle","contentStyle","titleStyle","descriptionStyle","footerStyle","stepStyle","actionsStyle","skipButtonStyle","nextButtonStyle","arrowOuterByPosition","arrowInnerByPosition","TourGuideTooltip","forwardRef","title","description","step","total","onNext","onSkip","className","style","showArrow","anchorId","ref","titleId","useId","descriptionId","anchorRect","setAnchorRect","React","updateRect","target","timer","jsx","jsxs","Fragment"],"mappings":"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"}
+{"version":3,"file":"TourGuideTooltip.cjs.js","sources":["../src/components/common/TourGuideTooltip.jsx"],"sourcesContent":["import React, { forwardRef, useId } from \"react\";\n\nconst CARD_W = 230;\nconst CARD_MIN_H = 141;\nconst BASE_BG = \"var(--Grey-Hover, #F3F7F7)\";\nconst BASE_BORDER = \"var(--Grey-absent, #D9D9D9)\";\n\nconst wrapperStyleByPosition = {\n  top: { left: \"50%\", bottom: \"100%\", transform: \"translateX(-50%)\" },\n  bottom: { left: \"50%\", top: \"100%\", transform: \"translateX(-50%)\" },\n  left: { top: \"50%\", right: \"100%\", transform: \"translateY(-50%)\" },\n  right: { top: \"50%\", left: \"100%\", transform: \"translateY(-50%)\" },\n};\n\nfunction getFixedPositionStyle(rect, position, gap) {\n  if (position === \"left\") {\n    return {\n      position: \"fixed\",\n      left: rect.left,\n      top: rect.centerY,\n      transform: `translate(calc(-100% - ${gap}px), -50%)`,\n    };\n  }\n\n  if (position === \"right\") {\n    return {\n      position: \"fixed\",\n      left: rect.right,\n      top: rect.centerY,\n      transform: `translate(${gap}px, -50%)`,\n    };\n  }\n\n  if (position === \"top\") {\n    return {\n      position: \"fixed\",\n      left: rect.centerX,\n      top: rect.top,\n      transform: `translate(-50%, calc(-100% - ${gap}px))`,\n    };\n  }\n\n  return {\n    position: \"fixed\",\n    left: rect.centerX,\n    top: rect.bottom,\n    transform: `translate(-50%, ${gap}px)`,\n  };\n}\n\nconst cardStyle = {\n  position: \"relative\",\n  borderRadius: 12,\n  boxShadow: \"0 2px 2px rgba(0, 0, 0, 0.25)\",\n  overflow: \"visible\",\n  fontFamily: \"Varta, var(--font-sans, sans-serif)\",\n};\n\nconst contentStyle = {\n  display: \"flex\",\n  flexDirection: \"column\",\n  padding: \"18px 20px 14px 20px\",\n};\n\nconst titleStyle = {\n  margin: 0,\n  fontSize: 14,\n  lineHeight: \"16px\",\n  fontWeight: 600,\n  color: \"var(--text-ink, #2e3236)\",\n};\n\nconst descriptionStyle = {\n  margin: \"12px 0 0 0\",\n  fontSize: 13,\n  lineHeight: 1.45,\n  fontWeight: 400,\n  color: \"var(--text-muted, #808183)\",\n  wordBreak: \"break-word\",\n};\n\nconst footerStyle = {\n  marginTop: 12,\n  height: 28,\n  display: \"flex\",\n  alignItems: \"center\",\n  justifyContent: \"space-between\",\n};\n\nconst stepStyle = {\n  fontSize: 12,\n  lineHeight: \"14px\",\n  fontWeight: 300,\n  color: \"var(--text-ink, #2e3236)\",\n};\n\nconst actionsStyle = {\n  display: \"flex\",\n  alignItems: \"center\",\n  gap: 4,\n};\n\nconst skipButtonStyle = {\n  height: 28,\n  border: \"none\",\n  borderRadius: 10,\n  fontSize: 13,\n  cursor: \"pointer\",\n  background: \"transparent\",\n  color: \"var(--text-ink, #2e3236)\",\n  fontWeight: 400,\n  padding: \"0 10px\",\n};\n\nconst nextButtonStyle = {\n  height: 28,\n  border: \"none\",\n  borderRadius: 10,\n  fontSize: 13,\n  cursor: \"pointer\",\n  background: \"#00a66e\",\n  color: \"#ffffff\",\n  fontWeight: 700,\n  padding: \"0 16px\",\n};\n\nconst arrowOuterByPosition = {\n  left: {\n    top: \"50%\",\n    right: -11,\n    transform: \"translateY(-50%)\",\n    borderTop: \"10px solid transparent\",\n    borderBottom: \"10px solid transparent\",\n    borderLeft: `11px solid ${BASE_BORDER}`,\n  },\n  right: {\n    top: \"50%\",\n    left: -11,\n    transform: \"translateY(-50%)\",\n    borderTop: \"10px solid transparent\",\n    borderBottom: \"10px solid transparent\",\n    borderRight: `11px solid ${BASE_BORDER}`,\n  },\n  top: {\n    left: \"50%\",\n    bottom: -11,\n    transform: \"translateX(-50%)\",\n    borderLeft: \"10px solid transparent\",\n    borderRight: \"10px solid transparent\",\n    borderTop: `11px solid ${BASE_BORDER}`,\n  },\n  bottom: {\n    left: \"50%\",\n    top: -11,\n    transform: \"translateX(-50%)\",\n    borderLeft: \"10px solid transparent\",\n    borderRight: \"10px solid transparent\",\n    borderBottom: `11px solid ${BASE_BORDER}`,\n  },\n};\n\nconst arrowInnerByPosition = {\n  left: {\n    top: \"50%\",\n    right: -10,\n    transform: \"translateY(-50%)\",\n    borderTop: \"9px solid transparent\",\n    borderBottom: \"9px solid transparent\",\n    borderLeft: `10px solid ${BASE_BG}`,\n  },\n  right: {\n    top: \"50%\",\n    left: -10,\n    transform: \"translateY(-50%)\",\n    borderTop: \"9px solid transparent\",\n    borderBottom: \"9px solid transparent\",\n    borderRight: `10px solid ${BASE_BG}`,\n  },\n  top: {\n    left: \"50%\",\n    bottom: -10,\n    transform: \"translateX(-50%)\",\n    borderLeft: \"9px solid transparent\",\n    borderRight: \"9px solid transparent\",\n    borderTop: `10px solid ${BASE_BG}`,\n  },\n  bottom: {\n    left: \"50%\",\n    top: -10,\n    transform: \"translateX(-50%)\",\n    borderLeft: \"9px solid transparent\",\n    borderRight: \"9px solid transparent\",\n    borderBottom: `10px solid ${BASE_BG}`,\n  },\n};\n\nconst TourGuideTooltip = forwardRef(function TourGuideTooltip(\n  {\n    title,\n    description,\n    step,\n    total,\n    onNext,\n    onSkip,\n    position = \"left\",\n    className = \"\",\n    style,\n    showArrow = true,\n    anchorId,\n    gap = 8,\n  },\n  ref\n) {\n  const titleId = useId();\n  const descriptionId = useId();\n  const [anchorRect, setAnchorRect] = React.useState(null);\n\n  React.useEffect(() => {\n    if (!anchorId) return undefined;\n\n    const updateRect = () => {\n      const target = document.getElementById(anchorId);\n      if (!target) {\n        setAnchorRect(null);\n        return;\n      }\n      const rect = target.getBoundingClientRect();\n      setAnchorRect({\n        left: rect.left,\n        right: rect.right,\n        top: rect.top,\n        bottom: rect.bottom,\n        centerX: rect.left + rect.width / 2,\n        centerY: rect.top + rect.height / 2,\n      });\n    };\n\n    updateRect();\n    window.addEventListener(\"resize\", updateRect);\n    window.addEventListener(\"scroll\", updateRect, true);\n    const timer = window.setInterval(updateRect, 120);\n\n    return () => {\n      window.removeEventListener(\"resize\", updateRect);\n      window.removeEventListener(\"scroll\", updateRect, true);\n      window.clearInterval(timer);\n    };\n  }, [anchorId]);\n\n  return (\n    <div\n      ref={ref}\n      role=\"dialog\"\n      aria-modal=\"false\"\n      aria-labelledby={titleId}\n      aria-describedby={descriptionId}\n      className={className}\n      style={{\n        zIndex: 1100,\n        ...(anchorId && anchorRect\n          ? getFixedPositionStyle(anchorRect, position, gap)\n          : { position: \"absolute\", ...wrapperStyleByPosition[position] }),\n        ...style,\n      }}\n    >\n      <div\n        style={{\n          ...cardStyle,\n          width: CARD_W,\n          minHeight: CARD_MIN_H,\n          background: BASE_BG,\n          border: `0.5px solid ${BASE_BORDER}`,\n        }}\n      >\n        {showArrow && (\n          <>\n            <span\n              style={{\n                position: \"absolute\",\n                width: 0,\n                height: 0,\n                ...arrowOuterByPosition[position],\n              }}\n            />\n            <span\n              style={{\n                position: \"absolute\",\n                width: 0,\n                height: 0,\n                ...arrowInnerByPosition[position],\n              }}\n            />\n          </>\n        )}\n\n        <div style={contentStyle}>\n          <h3 id={titleId} style={titleStyle}>\n            {title}\n          </h3>\n\n          <p id={descriptionId} style={descriptionStyle}>\n            {description}\n          </p>\n\n          <div style={footerStyle}>\n            <span aria-label={`Step ${step} of ${total}`} style={stepStyle}>\n              {step} of {total}\n            </span>\n\n            <div style={actionsStyle}>\n              <button\n                type=\"button\"\n                onClick={onSkip}\n                aria-label=\"Skip tour\"\n                style={skipButtonStyle}\n              >\n                Skip\n              </button>\n\n                <button\n                  type=\"button\"\n                  onClick={onNext}\n                  aria-label={`Go to next step (${step + 1} of ${total})`}\n                  style={nextButtonStyle}\n                >\n                  Next\n                </button>\n            </div>\n          </div>\n        </div>\n      </div>\n    </div>\n  );\n});\n\nexport default TourGuideTooltip;\n\n"],"names":["CARD_W","CARD_MIN_H","BASE_BG","BASE_BORDER","wrapperStyleByPosition","getFixedPositionStyle","rect","position","gap","cardStyle","contentStyle","titleStyle","descriptionStyle","footerStyle","stepStyle","actionsStyle","skipButtonStyle","nextButtonStyle","arrowOuterByPosition","arrowInnerByPosition","TourGuideTooltip","forwardRef","title","description","step","total","onNext","onSkip","className","style","showArrow","anchorId","ref","titleId","useId","descriptionId","anchorRect","setAnchorRect","React","updateRect","target","timer","jsx","jsxs","Fragment"],"mappings":"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"}

package/dist/TourGuideTooltip.es.js

@@ -169,7 +169,8 @@ const D = {
 }, k) {
   const b = y(), x = y(), [h, m] = u.useState(null);
   return u.useEffect(() => {
-    if (!p) return;
+    if (!p)
+      return;
     const n = () => {
       const g = document.getElementById(p);
       if (!g) {

package/dist/TourGuideTooltip.es.js.map

@@ -1 +1 @@
-{"version":3,"file":"TourGuideTooltip.es.js","sources":["../src/components/common/TourGuideTooltip.jsx"],"sourcesContent":["import React, { forwardRef, useId } from \"react\";\n\nconst CARD_W = 230;\nconst CARD_MIN_H = 141;\nconst BASE_BG = \"var(--Grey-Hover, #F3F7F7)\";\nconst BASE_BORDER = \"var(--Grey-absent, #D9D9D9)\";\n\nconst wrapperStyleByPosition = {\n  top: { left: \"50%\", bottom: \"100%\", transform: \"translateX(-50%)\" },\n  bottom: { left: \"50%\", top: \"100%\", transform: \"translateX(-50%)\" },\n  left: { top: \"50%\", right: \"100%\", transform: \"translateY(-50%)\" },\n  right: { top: \"50%\", left: \"100%\", transform: \"translateY(-50%)\" },\n};\n\nfunction getFixedPositionStyle(rect, position, gap) {\n  if (position === \"left\") {\n    return {\n      position: \"fixed\",\n      left: rect.left,\n      top: rect.centerY,\n      transform: `translate(calc(-100% - ${gap}px), -50%)`,\n    };\n  }\n\n  if (position === \"right\") {\n    return {\n      position: \"fixed\",\n      left: rect.right,\n      top: rect.centerY,\n      transform: `translate(${gap}px, -50%)`,\n    };\n  }\n\n  if (position === \"top\") {\n    return {\n      position: \"fixed\",\n      left: rect.centerX,\n      top: rect.top,\n      transform: `translate(-50%, calc(-100% - ${gap}px))`,\n    };\n  }\n\n  return {\n    position: \"fixed\",\n    left: rect.centerX,\n    top: rect.bottom,\n    transform: `translate(-50%, ${gap}px)`,\n  };\n}\n\nconst cardStyle = {\n  position: \"relative\",\n  borderRadius: 12,\n  boxShadow: \"0 2px 2px rgba(0, 0, 0, 0.25)\",\n  overflow: \"visible\",\n  fontFamily: \"Varta, var(--font-sans, sans-serif)\",\n};\n\nconst contentStyle = {\n  display: \"flex\",\n  flexDirection: \"column\",\n  padding: \"18px 20px 14px 20px\",\n};\n\nconst titleStyle = {\n  margin: 0,\n  fontSize: 14,\n  lineHeight: \"16px\",\n  fontWeight: 600,\n  color: \"var(--text-ink, #2e3236)\",\n};\n\nconst descriptionStyle = {\n  margin: \"12px 0 0 0\",\n  fontSize: 13,\n  lineHeight: 1.45,\n  fontWeight: 400,\n  color: \"var(--text-muted, #808183)\",\n  wordBreak: \"break-word\",\n};\n\nconst footerStyle = {\n  marginTop: 12,\n  height: 28,\n  display: \"flex\",\n  alignItems: \"center\",\n  justifyContent: \"space-between\",\n};\n\nconst stepStyle = {\n  fontSize: 12,\n  lineHeight: \"14px\",\n  fontWeight: 300,\n  color: \"var(--text-ink, #2e3236)\",\n};\n\nconst actionsStyle = {\n  display: \"flex\",\n  alignItems: \"center\",\n  gap: 4,\n};\n\nconst skipButtonStyle = {\n  height: 28,\n  border: \"none\",\n  borderRadius: 10,\n  fontSize: 13,\n  cursor: \"pointer\",\n  background: \"transparent\",\n  color: \"var(--text-ink, #2e3236)\",\n  fontWeight: 400,\n  padding: \"0 10px\",\n};\n\nconst nextButtonStyle = {\n  height: 28,\n  border: \"none\",\n  borderRadius: 10,\n  fontSize: 13,\n  cursor: \"pointer\",\n  background: \"#00a66e\",\n  color: \"#ffffff\",\n  fontWeight: 700,\n  padding: \"0 16px\",\n};\n\nconst arrowOuterByPosition = {\n  left: {\n    top: \"50%\",\n    right: -11,\n    transform: \"translateY(-50%)\",\n    borderTop: \"10px solid transparent\",\n    borderBottom: \"10px solid transparent\",\n    borderLeft: `11px solid ${BASE_BORDER}`,\n  },\n  right: {\n    top: \"50%\",\n    left: -11,\n    transform: \"translateY(-50%)\",\n    borderTop: \"10px solid transparent\",\n    borderBottom: \"10px solid transparent\",\n    borderRight: `11px solid ${BASE_BORDER}`,\n  },\n  top: {\n    left: \"50%\",\n    bottom: -11,\n    transform: \"translateX(-50%)\",\n    borderLeft: \"10px solid transparent\",\n    borderRight: \"10px solid transparent\",\n    borderTop: `11px solid ${BASE_BORDER}`,\n  },\n  bottom: {\n    left: \"50%\",\n    top: -11,\n    transform: \"translateX(-50%)\",\n    borderLeft: \"10px solid transparent\",\n    borderRight: \"10px solid transparent\",\n    borderBottom: `11px solid ${BASE_BORDER}`,\n  },\n};\n\nconst arrowInnerByPosition = {\n  left: {\n    top: \"50%\",\n    right: -10,\n    transform: \"translateY(-50%)\",\n    borderTop: \"9px solid transparent\",\n    borderBottom: \"9px solid transparent\",\n    borderLeft: `10px solid ${BASE_BG}`,\n  },\n  right: {\n    top: \"50%\",\n    left: -10,\n    transform: \"translateY(-50%)\",\n    borderTop: \"9px solid transparent\",\n    borderBottom: \"9px solid transparent\",\n    borderRight: `10px solid ${BASE_BG}`,\n  },\n  top: {\n    left: \"50%\",\n    bottom: -10,\n    transform: \"translateX(-50%)\",\n    borderLeft: \"9px solid transparent\",\n    borderRight: \"9px solid transparent\",\n    borderTop: `10px solid ${BASE_BG}`,\n  },\n  bottom: {\n    left: \"50%\",\n    top: -10,\n    transform: \"translateX(-50%)\",\n    borderLeft: \"9px solid transparent\",\n    borderRight: \"9px solid transparent\",\n    borderBottom: `10px solid ${BASE_BG}`,\n  },\n};\n\nconst TourGuideTooltip = forwardRef(function TourGuideTooltip(\n  {\n    title,\n    description,\n    step,\n    total,\n    onNext,\n    onSkip,\n    position = \"left\",\n    className = \"\",\n    style,\n    showArrow = true,\n    anchorId,\n    gap = 8,\n  },\n  ref\n) {\n  const titleId = useId();\n  const descriptionId = useId();\n  const [anchorRect, setAnchorRect] = React.useState(null);\n\n  React.useEffect(() => {\n    if (!anchorId) return undefined;\n\n    const updateRect = () => {\n      const target = document.getElementById(anchorId);\n      if (!target) {\n        setAnchorRect(null);\n        return;\n      }\n      const rect = target.getBoundingClientRect();\n      setAnchorRect({\n        left: rect.left,\n        right: rect.right,\n        top: rect.top,\n        bottom: rect.bottom,\n        centerX: rect.left + rect.width / 2,\n        centerY: rect.top + rect.height / 2,\n      });\n    };\n\n    updateRect();\n    window.addEventListener(\"resize\", updateRect);\n    window.addEventListener(\"scroll\", updateRect, true);\n    const timer = window.setInterval(updateRect, 120);\n\n    return () => {\n      window.removeEventListener(\"resize\", updateRect);\n      window.removeEventListener(\"scroll\", updateRect, true);\n      window.clearInterval(timer);\n    };\n  }, [anchorId]);\n\n  return (\n    <div\n      ref={ref}\n      role=\"dialog\"\n      aria-modal=\"false\"\n      aria-labelledby={titleId}\n      aria-describedby={descriptionId}\n      className={className}\n      style={{\n        zIndex: 1100,\n        ...(anchorId && anchorRect\n          ? getFixedPositionStyle(anchorRect, position, gap)\n          : { position: \"absolute\", ...wrapperStyleByPosition[position] }),\n        ...style,\n      }}\n    >\n      <div\n        style={{\n          ...cardStyle,\n          width: CARD_W,\n          minHeight: CARD_MIN_H,\n          background: BASE_BG,\n          border: `0.5px solid ${BASE_BORDER}`,\n        }}\n      >\n        {showArrow && (\n          <>\n            <span\n              style={{\n                position: \"absolute\",\n                width: 0,\n                height: 0,\n                ...arrowOuterByPosition[position],\n              }}\n            />\n            <span\n              style={{\n                position: \"absolute\",\n                width: 0,\n                height: 0,\n                ...arrowInnerByPosition[position],\n              }}\n            />\n          </>\n        )}\n\n        <div style={contentStyle}>\n          <h3 id={titleId} style={titleStyle}>\n            {title}\n          </h3>\n\n          <p id={descriptionId} style={descriptionStyle}>\n            {description}\n          </p>\n\n          <div style={footerStyle}>\n            <span aria-label={`Step ${step} of ${total}`} style={stepStyle}>\n              {step} of {total}\n            </span>\n\n            <div style={actionsStyle}>\n              <button\n                type=\"button\"\n                onClick={onSkip}\n                aria-label=\"Skip tour\"\n                style={skipButtonStyle}\n              >\n                Skip\n              </button>\n\n                <button\n                  type=\"button\"\n                  onClick={onNext}\n                  aria-label={`Go to next step (${step + 1} of ${total})`}\n                  style={nextButtonStyle}\n                >\n                  Next\n                </button>\n            </div>\n          </div>\n        </div>\n      </div>\n    </div>\n  );\n});\n\nexport default TourGuideTooltip;\n\n"],"names":["CARD_W","CARD_MIN_H","BASE_BG","BASE_BORDER","wrapperStyleByPosition","getFixedPositionStyle","rect","position","gap","cardStyle","contentStyle","titleStyle","descriptionStyle","footerStyle","stepStyle","actionsStyle","skipButtonStyle","nextButtonStyle","arrowOuterByPosition","arrowInnerByPosition","TourGuideTooltip","forwardRef","title","description","step","total","onNext","onSkip","className","style","showArrow","anchorId","ref","titleId","useId","descriptionId","anchorRect","setAnchorRect","React","updateRect","target","timer","jsx","jsxs","Fragment"],"mappings":"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"}
+{"version":3,"file":"TourGuideTooltip.es.js","sources":["../src/components/common/TourGuideTooltip.jsx"],"sourcesContent":["import React, { forwardRef, useId } from \"react\";\n\nconst CARD_W = 230;\nconst CARD_MIN_H = 141;\nconst BASE_BG = \"var(--Grey-Hover, #F3F7F7)\";\nconst BASE_BORDER = \"var(--Grey-absent, #D9D9D9)\";\n\nconst wrapperStyleByPosition = {\n  top: { left: \"50%\", bottom: \"100%\", transform: \"translateX(-50%)\" },\n  bottom: { left: \"50%\", top: \"100%\", transform: \"translateX(-50%)\" },\n  left: { top: \"50%\", right: \"100%\", transform: \"translateY(-50%)\" },\n  right: { top: \"50%\", left: \"100%\", transform: \"translateY(-50%)\" },\n};\n\nfunction getFixedPositionStyle(rect, position, gap) {\n  if (position === \"left\") {\n    return {\n      position: \"fixed\",\n      left: rect.left,\n      top: rect.centerY,\n      transform: `translate(calc(-100% - ${gap}px), -50%)`,\n    };\n  }\n\n  if (position === \"right\") {\n    return {\n      position: \"fixed\",\n      left: rect.right,\n      top: rect.centerY,\n      transform: `translate(${gap}px, -50%)`,\n    };\n  }\n\n  if (position === \"top\") {\n    return {\n      position: \"fixed\",\n      left: rect.centerX,\n      top: rect.top,\n      transform: `translate(-50%, calc(-100% - ${gap}px))`,\n    };\n  }\n\n  return {\n    position: \"fixed\",\n    left: rect.centerX,\n    top: rect.bottom,\n    transform: `translate(-50%, ${gap}px)`,\n  };\n}\n\nconst cardStyle = {\n  position: \"relative\",\n  borderRadius: 12,\n  boxShadow: \"0 2px 2px rgba(0, 0, 0, 0.25)\",\n  overflow: \"visible\",\n  fontFamily: \"Varta, var(--font-sans, sans-serif)\",\n};\n\nconst contentStyle = {\n  display: \"flex\",\n  flexDirection: \"column\",\n  padding: \"18px 20px 14px 20px\",\n};\n\nconst titleStyle = {\n  margin: 0,\n  fontSize: 14,\n  lineHeight: \"16px\",\n  fontWeight: 600,\n  color: \"var(--text-ink, #2e3236)\",\n};\n\nconst descriptionStyle = {\n  margin: \"12px 0 0 0\",\n  fontSize: 13,\n  lineHeight: 1.45,\n  fontWeight: 400,\n  color: \"var(--text-muted, #808183)\",\n  wordBreak: \"break-word\",\n};\n\nconst footerStyle = {\n  marginTop: 12,\n  height: 28,\n  display: \"flex\",\n  alignItems: \"center\",\n  justifyContent: \"space-between\",\n};\n\nconst stepStyle = {\n  fontSize: 12,\n  lineHeight: \"14px\",\n  fontWeight: 300,\n  color: \"var(--text-ink, #2e3236)\",\n};\n\nconst actionsStyle = {\n  display: \"flex\",\n  alignItems: \"center\",\n  gap: 4,\n};\n\nconst skipButtonStyle = {\n  height: 28,\n  border: \"none\",\n  borderRadius: 10,\n  fontSize: 13,\n  cursor: \"pointer\",\n  background: \"transparent\",\n  color: \"var(--text-ink, #2e3236)\",\n  fontWeight: 400,\n  padding: \"0 10px\",\n};\n\nconst nextButtonStyle = {\n  height: 28,\n  border: \"none\",\n  borderRadius: 10,\n  fontSize: 13,\n  cursor: \"pointer\",\n  background: \"#00a66e\",\n  color: \"#ffffff\",\n  fontWeight: 700,\n  padding: \"0 16px\",\n};\n\nconst arrowOuterByPosition = {\n  left: {\n    top: \"50%\",\n    right: -11,\n    transform: \"translateY(-50%)\",\n    borderTop: \"10px solid transparent\",\n    borderBottom: \"10px solid transparent\",\n    borderLeft: `11px solid ${BASE_BORDER}`,\n  },\n  right: {\n    top: \"50%\",\n    left: -11,\n    transform: \"translateY(-50%)\",\n    borderTop: \"10px solid transparent\",\n    borderBottom: \"10px solid transparent\",\n    borderRight: `11px solid ${BASE_BORDER}`,\n  },\n  top: {\n    left: \"50%\",\n    bottom: -11,\n    transform: \"translateX(-50%)\",\n    borderLeft: \"10px solid transparent\",\n    borderRight: \"10px solid transparent\",\n    borderTop: `11px solid ${BASE_BORDER}`,\n  },\n  bottom: {\n    left: \"50%\",\n    top: -11,\n    transform: \"translateX(-50%)\",\n    borderLeft: \"10px solid transparent\",\n    borderRight: \"10px solid transparent\",\n    borderBottom: `11px solid ${BASE_BORDER}`,\n  },\n};\n\nconst arrowInnerByPosition = {\n  left: {\n    top: \"50%\",\n    right: -10,\n    transform: \"translateY(-50%)\",\n    borderTop: \"9px solid transparent\",\n    borderBottom: \"9px solid transparent\",\n    borderLeft: `10px solid ${BASE_BG}`,\n  },\n  right: {\n    top: \"50%\",\n    left: -10,\n    transform: \"translateY(-50%)\",\n    borderTop: \"9px solid transparent\",\n    borderBottom: \"9px solid transparent\",\n    borderRight: `10px solid ${BASE_BG}`,\n  },\n  top: {\n    left: \"50%\",\n    bottom: -10,\n    transform: \"translateX(-50%)\",\n    borderLeft: \"9px solid transparent\",\n    borderRight: \"9px solid transparent\",\n    borderTop: `10px solid ${BASE_BG}`,\n  },\n  bottom: {\n    left: \"50%\",\n    top: -10,\n    transform: \"translateX(-50%)\",\n    borderLeft: \"9px solid transparent\",\n    borderRight: \"9px solid transparent\",\n    borderBottom: `10px solid ${BASE_BG}`,\n  },\n};\n\nconst TourGuideTooltip = forwardRef(function TourGuideTooltip(\n  {\n    title,\n    description,\n    step,\n    total,\n    onNext,\n    onSkip,\n    position = \"left\",\n    className = \"\",\n    style,\n    showArrow = true,\n    anchorId,\n    gap = 8,\n  },\n  ref\n) {\n  const titleId = useId();\n  const descriptionId = useId();\n  const [anchorRect, setAnchorRect] = React.useState(null);\n\n  React.useEffect(() => {\n    if (!anchorId) return undefined;\n\n    const updateRect = () => {\n      const target = document.getElementById(anchorId);\n      if (!target) {\n        setAnchorRect(null);\n        return;\n      }\n      const rect = target.getBoundingClientRect();\n      setAnchorRect({\n        left: rect.left,\n        right: rect.right,\n        top: rect.top,\n        bottom: rect.bottom,\n        centerX: rect.left + rect.width / 2,\n        centerY: rect.top + rect.height / 2,\n      });\n    };\n\n    updateRect();\n    window.addEventListener(\"resize\", updateRect);\n    window.addEventListener(\"scroll\", updateRect, true);\n    const timer = window.setInterval(updateRect, 120);\n\n    return () => {\n      window.removeEventListener(\"resize\", updateRect);\n      window.removeEventListener(\"scroll\", updateRect, true);\n      window.clearInterval(timer);\n    };\n  }, [anchorId]);\n\n  return (\n    <div\n      ref={ref}\n      role=\"dialog\"\n      aria-modal=\"false\"\n      aria-labelledby={titleId}\n      aria-describedby={descriptionId}\n      className={className}\n      style={{\n        zIndex: 1100,\n        ...(anchorId && anchorRect\n          ? getFixedPositionStyle(anchorRect, position, gap)\n          : { position: \"absolute\", ...wrapperStyleByPosition[position] }),\n        ...style,\n      }}\n    >\n      <div\n        style={{\n          ...cardStyle,\n          width: CARD_W,\n          minHeight: CARD_MIN_H,\n          background: BASE_BG,\n          border: `0.5px solid ${BASE_BORDER}`,\n        }}\n      >\n        {showArrow && (\n          <>\n            <span\n              style={{\n                position: \"absolute\",\n                width: 0,\n                height: 0,\n                ...arrowOuterByPosition[position],\n              }}\n            />\n            <span\n              style={{\n                position: \"absolute\",\n                width: 0,\n                height: 0,\n                ...arrowInnerByPosition[position],\n              }}\n            />\n          </>\n        )}\n\n        <div style={contentStyle}>\n          <h3 id={titleId} style={titleStyle}>\n            {title}\n          </h3>\n\n          <p id={descriptionId} style={descriptionStyle}>\n            {description}\n          </p>\n\n          <div style={footerStyle}>\n            <span aria-label={`Step ${step} of ${total}`} style={stepStyle}>\n              {step} of {total}\n            </span>\n\n            <div style={actionsStyle}>\n              <button\n                type=\"button\"\n                onClick={onSkip}\n                aria-label=\"Skip tour\"\n                style={skipButtonStyle}\n              >\n                Skip\n              </button>\n\n                <button\n                  type=\"button\"\n                  onClick={onNext}\n                  aria-label={`Go to next step (${step + 1} of ${total})`}\n                  style={nextButtonStyle}\n                >\n                  Next\n                </button>\n            </div>\n          </div>\n        </div>\n      </div>\n    </div>\n  );\n});\n\nexport default TourGuideTooltip;\n\n"],"names":["CARD_W","CARD_MIN_H","BASE_BG","BASE_BORDER","wrapperStyleByPosition","getFixedPositionStyle","rect","position","gap","cardStyle","contentStyle","titleStyle","descriptionStyle","footerStyle","stepStyle","actionsStyle","skipButtonStyle","nextButtonStyle","arrowOuterByPosition","arrowInnerByPosition","TourGuideTooltip","forwardRef","title","description","step","total","onNext","onSkip","className","style","showArrow","anchorId","ref","titleId","useId","descriptionId","anchorRect","setAnchorRect","React","updateRect","target","timer","jsx","jsxs","Fragment"],"mappings":"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"}

package/dist/UpdatedInteractionRecording.cjs.js

@@ -1,2 +1,2 @@
-"use strict";const e=require("react/jsx-runtime"),a=require("react"),i=require("lucide-react"),O=require("./Timeline.cjs.js");function X(b){const l=Math.floor(b/60),j=Math.round(b%60);return`${l}:${j.toString().padStart(2,"0")}`}const de={David:[{start:0,end:.08},{start:.18,end:.22},{start:.38,end:.42},{start:.55,end:.58},{start:.68,end:.72},{start:.82,end:.88},{start:.94,end:1}],Customer:[{start:.1,end:.16},{start:.24,end:.36},{start:.44,end:.52},{start:.6,end:.66},{start:.74,end:.8}]},v=[{speaker:"David",type:"agent",time:"00:04",text:"Thanks for calling Miles Point S Pensau. This is Steve. How can I help you?"},{speaker:"Customer",type:"customer",time:"00:12",text:"Hi, Steve. This is Sandra with Botai Catering."},{speaker:"David",type:"agent",time:"00:18",text:"Hello. How are you?"},{speaker:"Customer",type:"customer",time:"00:20",text:"I'm doing really good. Hey. I brought my vans in last week, and I call it a beeping van, the one that beeps when you back up. Makes the crunchy noise. So I just took it on Saturday after, I think I had the, the Miles. I picked it up on Saturday morning, and I went to an event. So So I don't know if it's the tire or something, but makes it a little crunchy noise. Sometimes when I do the brake, but only if I turn the wheel too."},{speaker:"David",type:"agent",time:"00:21",text:"Oh, interesting. Okay. Can you swing by with it one of these days?"}],ce=a.forwardRef(function({audioUrl:l,timelineSegments:j=[],durationSeconds:g=0,currentTimeSeconds:I=0,timelinePlaying:d=!1,playbackRate:k=1,onSeek:S,onTogglePlay:R,onSeekBack:G,onSeekForward:W,onSetPlaybackRate:T,audioRef:q,transcript:c,highlightedTurns:N=new Set,activeTurnIndex:M,activeDemoIndex:Y=1,turnObservations:K={},setExpandedSignals:F,onTurnPlayPause:V},Z){var L;const p=a.useRef(null),[y,J]=a.useState(null),[Q,U]=a.useState(k||1),[w,x]=a.useState(d),[ee,E]=a.useState(!1),[z,C]=a.useState(Y),H=t=>{for(let n=v.length-1;n>=0;n--){const o=$(v[n].time);if(t>=o)return n}return 0},$=t=>{if(!t)return 0;const n=t.split(":").map(Number);return(n[0]||0)*60+(n[1]||0)},te=[1,1.25,1.5,2],P=!l,D=P?Q:k,ne=P?w:d;a.useImperativeHandle(Z,()=>({seekTo:t=>{h(t),x(!0);const n=H(t);C(n),setTimeout(()=>{var r;const o=(r=p.current)==null?void 0:r.children;o!=null&&o[n]&&o[n].scrollIntoView({behavior:"smooth",block:"nearest"})},50)}}));const h=t=>{const n=Math.max(0,Math.min(t,g||156));S&&S(n),J(n),C(H(n))},oe=()=>{R?R():x(t=>!t)},re=()=>{G?G():h(Math.max(0,(y??0)-10))},ie=()=>{W?W():h(Math.min(g||156,(y??0)+10))},se=t=>{T&&T(t),U(t),E(!1)},ae=t=>{var n;if(z===t&&w)x(!1);else{const o=$((n=v[t])==null?void 0:n.time);C(t),x(!0),h(o)}},le=(t,n)=>{if(t==null)return;const o=r=>{const s=Math.floor(r/6e4),u=Math.floor(r%6e4/1e3);return`${s.toString().padStart(2,"0")}:${u.toString().padStart(2,"0")}`};return`${o(t)}–${n!=null?o(n):o(t)}`},A=(L=c==null?void 0:c.messages)!=null&&L.length?c.messages.map((t,n)=>{var o,r;return{actor:t.actor==="agent"?((o=c.actor_map)==null?void 0:o.agent)||"Agent":((r=c.actor_map)==null?void 0:r.customer)||"Customer",actorType:t.actor==="agent"?"agent":"customer",text:t.text||"",timeRange:le(t.start??t.start_ms,t.end??t.end_ms),isHighlighted:N.has(n),highlightColor:d&&M===n?t.actor==="agent"?"var(--rail-outcome)":"var(--rail-discovery)":void 0,observations:(K[n]||[]).map(s=>({...s,onClick:()=>{F==null||F(u=>new Set([...u,s.signalKey])),setTimeout(()=>{const u=document.getElementById(`signal-${s.signalKey}`);u&&u.scrollIntoView({behavior:"smooth",block:"nearest"})},100)}}))}}):null,m=g||156,B=y??(g>0?I:0),f=m>0?B/m*100:0,_=Math.round(B);return e.jsxs("div",{style:{display:"flex",padding:24,flexDirection:"column",alignItems:"flex-start",gap:24,borderRadius:8,border:"1px solid var(--Grey-absent, #D9D9D9)",background:"var(--Grey-White, #FFF)"},children:[e.jsxs("div",{style:{width:"100%",display:"flex",flexDirection:"column",gap:16},children:[e.jsxs("div",{style:{display:"flex",alignItems:"center",justifyContent:"space-between",gap:24},children:[e.jsx("span",{style:{fontSize:15,fontWeight:600,color:"var(--Grey-Strong, #2E3236)",lineHeight:1.2},children:"Recording"}),e.jsxs("div",{style:{display:"flex",alignItems:"center",gap:12,flex:1,justifyContent:"center"},children:[e.jsx("span",{style:{fontSize:13,fontWeight:400,color:"var(--Grey-Muted, #808183)",lineHeight:1.2},children:"10"}),e.jsx("button",{onClick:re,style:{background:"none",border:"none",cursor:"pointer",padding:0,display:"flex",alignItems:"center"},children:e.jsx(i.RotateCcw,{size:20,color:"#808183",strokeWidth:1.5})}),e.jsx("button",{onClick:oe,style:{background:"var(--Grey-Strong, #2E3236)",border:"none",cursor:"pointer",width:32,height:32,borderRadius:48,padding:0,display:"flex",alignItems:"center",justifyContent:"center"},children:ne?e.jsx(i.Pause,{size:14,color:"#FFF",fill:"#FFF"}):e.jsx(i.Play,{size:14,color:"#FFF",fill:"#FFF",strokeWidth:1.5,style:{marginLeft:2}})}),e.jsx("button",{onClick:ie,style:{background:"none",border:"none",cursor:"pointer",padding:0,display:"flex",alignItems:"center"},children:e.jsx(i.RotateCw,{size:20,color:"#808183",strokeWidth:1.5})}),e.jsx("span",{style:{fontSize:13,fontWeight:400,color:"var(--Grey-Muted, #808183)",lineHeight:1.2},children:"10"})]}),e.jsxs("div",{style:{position:"relative"},children:[e.jsxs("button",{onClick:()=>E(t=>!t),style:{background:"var(--Grey-White, #FFF)",border:"1px solid var(--Grey-absent, #D9D9D9)",borderRadius:20,padding:"0 5px 0 10px",height:24,minWidth:56,cursor:"pointer",fontSize:13,fontWeight:400,color:"var(--Grey-Strong, #2E3236)",fontFamily:"var(--font-sans)",lineHeight:1.2,display:"flex",alignItems:"center",justifyContent:"center",gap:4},children:[D,"x",e.jsx(i.ChevronDown,{size:12,color:"#808183"})]}),ee&&e.jsx("div",{style:{position:"absolute",top:"100%",right:0,marginTop:4,background:"var(--Grey-White, #FFF)",border:"1px solid var(--Grey-absent, #D9D9D9)",borderRadius:8,boxShadow:"0 4px 12px rgba(0,0,0,0.1)",zIndex:10,overflow:"hidden",minWidth:80},children:te.map(t=>e.jsxs("button",{onClick:()=>se(t),style:{display:"block",width:"100%",padding:"8px 12px",border:"none",background:D===t?"var(--surface-hover, #F3F7F7)":"var(--Grey-White, #FFF)",cursor:"pointer",fontSize:13,fontWeight:D===t?600:400,color:"var(--Grey-Strong, #2E3236)",fontFamily:"var(--font-sans)",textAlign:"left"},children:[t,"x"]},t))})]})]}),l?e.jsxs(e.Fragment,{children:[e.jsx(O.Timeline,{segments:j,durationSeconds:g,currentTimeSeconds:I,onSeek:S,showControls:!1,hasRecording:!0,timelinePlaying:d,playbackRate:k}),e.jsx("audio",{ref:q,preload:"none",style:{display:"none"},children:e.jsx("source",{src:l,type:"audio/mpeg"})})]}):e.jsxs("div",{style:{display:"flex",flexDirection:"column",gap:12},children:[e.jsxs("div",{style:{display:"flex",alignItems:"center",gap:8},children:[e.jsx("span",{style:{fontSize:13,fontWeight:600,color:f>0?"var(--Green-Primary, #00925F)":"var(--Grey-Strong, #2E3236)",fontFamily:"var(--font-sans)",lineHeight:1.2,minWidth:60},children:X(_)}),e.jsxs("div",{onClick:t=>{const n=t.currentTarget.getBoundingClientRect(),o=t.clientX-n.left,s=Math.max(0,Math.min(1,o/n.width))*m;h(s)},style:{flex:1,height:16,position:"relative",display:"flex",alignItems:"center",cursor:"pointer"},children:[e.jsx("div",{style:{position:"absolute",left:0,right:0,height:4,borderRadius:2,background:"var(--rail-surface-2, #E3E1D7)",pointerEvents:"none"}}),e.jsx("div",{style:{position:"absolute",left:0,top:"50%",transform:"translateY(-50%)",width:`${f}%`,height:4,borderRadius:2,background:"var(--Green-Primary, #00925F)",pointerEvents:"none"}}),e.jsx("svg",{width:"16",height:"16",viewBox:"0 0 16 16",fill:"none",xmlns:"http://www.w3.org/2000/svg",style:{position:"absolute",left:`${f}%`,top:"50%",transform:"translate(-50%, -50%)",pointerEvents:"none"},children:e.jsx("path",{d:"M7.875 1C11.6572 1 14.75 4.1191 14.75 8C14.75 11.8809 11.6572 15 7.875 15C4.09284 15 1 11.8809 1 8C1 4.1191 4.09284 1 7.875 1Z",fill:"#FFF",stroke:"#00925F",strokeWidth:"2"})})]})]}),e.jsxs("div",{style:{position:"relative",paddingBottom:30,cursor:"pointer"},children:[["David","Customer"].map((t,n)=>e.jsxs("div",{style:{display:"flex",alignItems:"center",gap:8,height:20,marginBottom:n===0?4:0},children:[e.jsx("span",{style:{fontSize:13,fontWeight:400,color:"var(--Grey-Muted, #808183)",fontFamily:"var(--font-sans)",lineHeight:1.2,minWidth:60},children:t}),e.jsxs("div",{onClick:o=>{const r=o.currentTarget.getBoundingClientRect(),s=Math.max(0,Math.min(1,(o.clientX-r.left)/r.width));h(s*m)},style:{flex:1,height:6,position:"relative",borderRadius:3,cursor:"pointer"},children:[e.jsx("div",{style:{position:"absolute",left:0,right:0,top:"50%",transform:"translateY(-50%)",height:4,borderRadius:2,background:"var(--rail-surface-2, #E3E1D7)"}}),de[t].map((o,r)=>e.jsx("div",{style:{position:"absolute",left:`${o.start*100}%`,width:`${(o.end-o.start)*100}%`,top:0,bottom:0,borderRadius:3,background:t==="David"?"var(--Grey-Strong, #2E3236)":"var(--Grey-Muted, #808183)"}},r))]})]},t)),e.jsxs("div",{style:{position:"absolute",left:68,right:0,top:0,bottom:0,pointerEvents:"none"},children:[e.jsx("div",{style:{position:"absolute",left:`${f}%`,top:0,height:44,transform:"translateX(-50%)",borderLeft:"1.5px dashed var(--Grey-Muted, #808183)",opacity:.5}}),e.jsx("div",{style:{position:"absolute",left:`${f}%`,bottom:0,transform:"translateX(-50%)",background:"var(--Grey-Strong, #2E3236)",color:"var(--Grey-White, #FFF)",fontSize:14,fontWeight:600,lineHeight:1.2,padding:"4px 6px",borderRadius:4,whiteSpace:"nowrap"},children:X(_)})]})]})]})]}),e.jsxs("div",{style:{width:"100%",display:"flex",flexDirection:"column",gap:16},children:[e.jsxs("div",{style:{display:"flex",alignItems:"center",gap:12},children:[e.jsx("span",{style:{fontSize:14,fontWeight:400,color:"var(--Grey-Strong, #2E3236)",lineHeight:1.2},children:"Transcript"}),e.jsxs("div",{style:{display:"flex",alignItems:"center",gap:12,marginLeft:"auto"},children:[e.jsx("button",{onClick:()=>{var t;return(t=p.current)==null?void 0:t.scrollBy({top:-200,behavior:"smooth"})},style:{background:"none",border:"none",cursor:"pointer",padding:0,display:"flex"},children:e.jsx(i.ChevronLeft,{size:16,color:"#808183",strokeWidth:1.5})}),e.jsx("button",{onClick:()=>{var t;return(t=p.current)==null?void 0:t.scrollBy({top:200,behavior:"smooth"})},style:{background:"none",border:"none",cursor:"pointer",padding:0,display:"flex"},children:e.jsx(i.ChevronRight,{size:16,color:"#808183",strokeWidth:1.5})})]})]}),A?e.jsx("div",{id:"transcript-container",ref:p,style:{maxHeight:600,overflowY:"auto"},children:e.jsx(O.TranscriptCard,{turns:A,audioUrl:l,activeTurnIndex:M,autoScrollActiveTurn:d,isExternalPlaying:d,onTurnPlayPause:V})}):e.jsx("div",{ref:p,style:{display:"flex",flexDirection:"column",maxHeight:600,overflowY:"auto"},children:v.map((t,n)=>{const o=n===z&&w,r=t.type==="customer";return e.jsxs("div",{style:{display:"flex",padding:16,flexDirection:"column",alignItems:"flex-start",gap:16,alignSelf:"stretch",border:"1px solid var(--Grey-absent, #D9D9D9)",background:o?"var(--surface-hover, #F3F7F7)":"var(--Grey-White, #FFF)"},children:[e.jsxs("div",{style:{display:"flex",alignItems:"center",justifyContent:"space-between",width:"100%",gap:8},children:[e.jsx("span",{style:{fontSize:14,fontWeight:600,lineHeight:1.2,color:r?"var(--Grey-Strong, #2E3236)":"var(--Grey-Muted, #808183)"},children:t.speaker}),e.jsxs("div",{style:{display:"flex",alignItems:"center",gap:8},children:[o&&e.jsxs(e.Fragment,{children:[e.jsx(i.AudioLines,{size:12,color:"#2E3236"}),e.jsx(i.AudioLines,{size:12,color:"#2E3236"})]}),e.jsx("span",{style:{fontSize:13,fontWeight:400,lineHeight:1.2,color:"var(--Grey-Muted, #808183)"},children:t.time})]})]}),e.jsxs("div",{style:{display:"flex",alignItems:"flex-start",gap:8,width:"100%"},children:[e.jsx("button",{onClick:()=>ae(n),style:{background:"none",border:"none",cursor:"pointer",padding:0,flexShrink:0,display:"flex"},children:o?e.jsx(i.PauseCircle,{size:17,color:"#2E3236",strokeWidth:1.5}):e.jsx(i.PlayCircle,{size:17,color:"#808183",strokeWidth:1})}),e.jsx("p",{style:{fontSize:13,fontWeight:400,color:"var(--Grey-Strong, #2E3236)",lineHeight:1.2,margin:0,flex:1},children:t.text})]})]},n)})})]})]})});exports.UpdatedInteractionRecording=ce;
+"use strict";const e=require("react/jsx-runtime"),a=require("react"),s=require("lucide-react"),X=require("./Timeline.cjs.js");function q(v){const l=Math.floor(v/60),b=Math.round(v%60);return`${l}:${b.toString().padStart(2,"0")}`}const de={David:[{start:0,end:.08},{start:.18,end:.22},{start:.38,end:.42},{start:.55,end:.58},{start:.68,end:.72},{start:.82,end:.88},{start:.94,end:1}],Customer:[{start:.1,end:.16},{start:.24,end:.36},{start:.44,end:.52},{start:.6,end:.66},{start:.74,end:.8}]},x=[{speaker:"David",type:"agent",time:"00:04",text:"Thanks for calling Miles Point S Pensau. This is Steve. How can I help you?"},{speaker:"Customer",type:"customer",time:"00:12",text:"Hi, Steve. This is Sandra with Botai Catering."},{speaker:"David",type:"agent",time:"00:18",text:"Hello. How are you?"},{speaker:"Customer",type:"customer",time:"00:20",text:"I'm doing really good. Hey. I brought my vans in last week, and I call it a beeping van, the one that beeps when you back up. Makes the crunchy noise. So I just took it on Saturday after, I think I had the, the Miles. I picked it up on Saturday morning, and I went to an event. So So I don't know if it's the tire or something, but makes it a little crunchy noise. Sometimes when I do the brake, but only if I turn the wheel too."},{speaker:"David",type:"agent",time:"00:21",text:"Oh, interesting. Okay. Can you swing by with it one of these days?"}],ce=a.forwardRef(function({audioUrl:l,timelineSegments:b=[],durationSeconds:g=0,currentTimeSeconds:I=0,timelinePlaying:d=!1,playbackRate:j=1,onSeek:k,onTogglePlay:G,onSeekBack:R,onSeekForward:T,onSetPlaybackRate:W,audioRef:L,transcript:c,highlightedTurns:N=new Set,activeTurnIndex:M,activeDemoIndex:Y=1,turnObservations:K={},setExpandedSignals:S,onTurnPlayPause:V},Z){var O;const F=a.useRef(null),[f,J]=a.useState(null),[Q,U]=a.useState(j||1),[w,y]=a.useState(d),[ee,E]=a.useState(!1),[z,D]=a.useState(Y),H=t=>{for(let n=x.length-1;n>=0;n--){const o=$(x[n].time);if(t>=o)return n}return 0},$=t=>{if(!t)return 0;const n=t.split(":").map(Number);return(n[0]||0)*60+(n[1]||0)},te=[1,1.25,1.5,2],P=!l,C=P?Q:j,ne=P?w:d;a.useImperativeHandle(Z,()=>({seekTo:t=>{h(t),y(!0);const n=H(t);D(n),setTimeout(()=>{var r;const o=(r=F.current)==null?void 0:r.children;o!=null&&o[n]&&o[n].scrollIntoView({behavior:"smooth",block:"nearest"})},50)}}));const h=t=>{const n=Math.max(0,Math.min(t,g||156));k&&k(n),J(n),D(H(n))},oe=()=>{G?G():y(t=>!t)},re=()=>{R?R():h(Math.max(0,(f??0)-10))},ie=()=>{T?T():h(Math.min(g||156,(f??0)+10))},se=t=>{W&&W(t),U(t),E(!1)},ae=t=>{var n;if(z===t&&w)y(!1);else{const o=$((n=x[t])==null?void 0:n.time);D(t),y(!0),h(o)}},le=(t,n)=>{if(t==null)return;const o=r=>{const i=Math.floor(r/6e4),u=Math.floor(r%6e4/1e3);return`${i.toString().padStart(2,"0")}:${u.toString().padStart(2,"0")}`};return`${o(t)}–${n!=null?o(n):o(t)}`},A=(O=c==null?void 0:c.messages)!=null&&O.length?c.messages.map((t,n)=>{var o,r;return{actor:t.actor==="agent"?((o=c.actor_map)==null?void 0:o.agent)||"Agent":((r=c.actor_map)==null?void 0:r.customer)||"Customer",actorType:t.actor==="agent"?"agent":"customer",text:t.text||"",timeRange:le(t.start??t.start_ms,t.end??t.end_ms),isHighlighted:N.has(n),highlightColor:d&&M===n?t.actor==="agent"?"var(--rail-outcome)":"var(--rail-discovery)":void 0,observations:(K[n]||[]).map(i=>({...i,onClick:()=>{S==null||S(u=>new Set([...u,i.signalKey])),setTimeout(()=>{const u=document.getElementById(`signal-${i.signalKey}`);u&&u.scrollIntoView({behavior:"smooth",block:"nearest"})},100)}}))}}):null,m=g||156,B=f??(g>0?I:0),p=m>0?B/m*100:0,_=Math.round(B);return e.jsxs("div",{style:{display:"flex",padding:24,flexDirection:"column",alignItems:"flex-start",gap:24,borderRadius:8,border:"1px solid var(--Grey-absent, #D9D9D9)",background:"var(--Grey-White, #FFF)"},children:[e.jsxs("div",{style:{width:"100%",display:"flex",flexDirection:"column",gap:16},children:[e.jsxs("div",{style:{display:"flex",alignItems:"center",justifyContent:"space-between",gap:24},children:[e.jsx("span",{style:{fontSize:15,fontWeight:600,color:"var(--Grey-Strong, #2E3236)",lineHeight:1.2},children:"Recording"}),e.jsxs("div",{style:{display:"flex",alignItems:"center",gap:12,flex:1,justifyContent:"center"},children:[e.jsx("span",{style:{fontSize:13,fontWeight:400,color:"var(--Grey-Muted, #808183)",lineHeight:1.2},children:"10"}),e.jsx("button",{onClick:re,style:{background:"none",border:"none",cursor:"pointer",padding:0,display:"flex",alignItems:"center"},children:e.jsx(s.RotateCcw,{size:20,color:"#808183",strokeWidth:1.5})}),e.jsx("button",{onClick:oe,style:{background:"var(--Grey-Strong, #2E3236)",border:"none",cursor:"pointer",width:32,height:32,borderRadius:48,padding:0,display:"flex",alignItems:"center",justifyContent:"center"},children:ne?e.jsx(s.Pause,{size:14,color:"#FFF",fill:"#FFF"}):e.jsx(s.Play,{size:14,color:"#FFF",fill:"#FFF",strokeWidth:1.5,style:{marginLeft:2}})}),e.jsx("button",{onClick:ie,style:{background:"none",border:"none",cursor:"pointer",padding:0,display:"flex",alignItems:"center"},children:e.jsx(s.RotateCw,{size:20,color:"#808183",strokeWidth:1.5})}),e.jsx("span",{style:{fontSize:13,fontWeight:400,color:"var(--Grey-Muted, #808183)",lineHeight:1.2},children:"10"})]}),e.jsxs("div",{style:{position:"relative"},children:[e.jsxs("button",{onClick:()=>E(t=>!t),style:{background:"var(--Grey-White, #FFF)",border:"1px solid var(--Grey-absent, #D9D9D9)",borderRadius:20,padding:"0 5px 0 10px",height:24,minWidth:56,cursor:"pointer",fontSize:13,fontWeight:400,color:"var(--Grey-Strong, #2E3236)",fontFamily:"var(--font-sans)",lineHeight:1.2,display:"flex",alignItems:"center",justifyContent:"center",gap:4},children:[C,"x",e.jsx(s.ChevronDown,{size:12,color:"#808183"})]}),ee&&e.jsx("div",{style:{position:"absolute",top:"100%",right:0,marginTop:4,background:"var(--Grey-White, #FFF)",border:"1px solid var(--Grey-absent, #D9D9D9)",borderRadius:8,boxShadow:"0 4px 12px rgba(0,0,0,0.1)",zIndex:10,overflow:"hidden",minWidth:80},children:te.map(t=>e.jsxs("button",{onClick:()=>se(t),style:{display:"block",width:"100%",padding:"8px 12px",border:"none",background:C===t?"var(--surface-hover, #F3F7F7)":"var(--Grey-White, #FFF)",cursor:"pointer",fontSize:13,fontWeight:C===t?600:400,color:"var(--Grey-Strong, #2E3236)",fontFamily:"var(--font-sans)",textAlign:"left"},children:[t,"x"]},t))})]})]}),l?e.jsxs(e.Fragment,{children:[e.jsx(X.Timeline,{segments:b,durationSeconds:g,currentTimeSeconds:I,onSeek:k,showControls:!1,hasRecording:!0,timelinePlaying:d,playbackRate:j}),e.jsx("audio",{ref:L,preload:"none",style:{display:"none"},children:e.jsx("source",{src:l,type:"audio/mpeg"})})]}):e.jsxs("div",{style:{display:"flex",flexDirection:"column",gap:12},children:[e.jsxs("div",{style:{display:"flex",alignItems:"center",gap:8},children:[e.jsx("span",{style:{fontSize:13,fontWeight:600,color:p>0?"var(--Green-Primary, #00925F)":"var(--Grey-Strong, #2E3236)",fontFamily:"var(--font-sans)",lineHeight:1.2,minWidth:60},children:q(_)}),e.jsxs("div",{onClick:t=>{const n=t.currentTarget.getBoundingClientRect(),o=t.clientX-n.left,i=Math.max(0,Math.min(1,o/n.width))*m;h(i)},style:{flex:1,height:16,position:"relative",display:"flex",alignItems:"center",cursor:"pointer"},children:[e.jsx("div",{style:{position:"absolute",left:0,right:0,height:4,borderRadius:2,background:"var(--rail-surface-2, #E3E1D7)",pointerEvents:"none"}}),e.jsx("div",{style:{position:"absolute",left:0,top:"50%",transform:"translateY(-50%)",width:`${p}%`,height:4,borderRadius:2,background:"var(--Green-Primary, #00925F)",pointerEvents:"none"}}),e.jsx("svg",{width:"16",height:"16",viewBox:"0 0 16 16",fill:"none",xmlns:"http://www.w3.org/2000/svg",style:{position:"absolute",left:`${p}%`,top:"50%",transform:"translate(-50%, -50%)",pointerEvents:"none"},children:e.jsx("path",{d:"M7.875 1C11.6572 1 14.75 4.1191 14.75 8C14.75 11.8809 11.6572 15 7.875 15C4.09284 15 1 11.8809 1 8C1 4.1191 4.09284 1 7.875 1Z",fill:"#FFF",stroke:"#00925F",strokeWidth:"2"})})]})]}),e.jsxs("div",{style:{position:"relative",paddingBottom:30,cursor:"pointer"},children:[["David","Customer"].map((t,n)=>e.jsxs("div",{style:{display:"flex",alignItems:"center",gap:8,height:20,marginBottom:n===0?4:0},children:[e.jsx("span",{style:{fontSize:13,fontWeight:400,color:"var(--Grey-Muted, #808183)",fontFamily:"var(--font-sans)",lineHeight:1.2,minWidth:60},children:t}),e.jsxs("div",{onClick:o=>{const r=o.currentTarget.getBoundingClientRect(),i=Math.max(0,Math.min(1,(o.clientX-r.left)/r.width));h(i*m)},style:{flex:1,height:6,position:"relative",borderRadius:3,cursor:"pointer"},children:[e.jsx("div",{style:{position:"absolute",left:0,right:0,top:"50%",transform:"translateY(-50%)",height:4,borderRadius:2,background:"var(--rail-surface-2, #E3E1D7)"}}),de[t].map((o,r)=>e.jsx("div",{style:{position:"absolute",left:`${o.start*100}%`,width:`${(o.end-o.start)*100}%`,top:0,bottom:0,borderRadius:3,background:t==="David"?"var(--Grey-Strong, #2E3236)":"var(--Grey-Muted, #808183)"}},r))]})]},t)),e.jsxs("div",{style:{position:"absolute",left:68,right:0,top:0,bottom:0,pointerEvents:"none"},children:[e.jsx("div",{style:{position:"absolute",left:`${p}%`,top:0,height:44,transform:"translateX(-50%)",borderLeft:"1.5px dashed var(--Grey-Muted, #808183)",opacity:.5}}),e.jsx("div",{style:{position:"absolute",left:`${p}%`,bottom:0,transform:"translateX(-50%)",background:"var(--Grey-Strong, #2E3236)",color:"var(--Grey-White, #FFF)",fontSize:14,fontWeight:600,lineHeight:1.2,padding:"4px 6px",borderRadius:4,whiteSpace:"nowrap"},children:q(_)})]})]})]})]}),e.jsxs("div",{style:{width:"100%",display:"flex",flexDirection:"column",gap:16},children:[e.jsx("div",{style:{borderBottom:"1px solid var(--Grey-absent, #D9D9D9)",paddingBottom:16},children:e.jsx("span",{style:{fontSize:14,fontWeight:400,color:"var(--Grey-Strong, #2E3236)",lineHeight:1.2},children:"Transcript"})}),A?e.jsx("div",{id:"transcript-container",ref:F,style:{maxHeight:600,overflowY:"auto"},children:e.jsx(X.TranscriptCard,{turns:A,audioUrl:l,activeTurnIndex:M,autoScrollActiveTurn:d,isExternalPlaying:d,onTurnPlayPause:V})}):e.jsx("div",{ref:F,style:{display:"flex",flexDirection:"column",maxHeight:600,overflowY:"auto"},children:x.map((t,n)=>{const o=n===z&&w,r=t.type==="customer";return e.jsxs("div",{style:{display:"flex",padding:16,flexDirection:"column",alignItems:"flex-start",gap:16,alignSelf:"stretch",borderTop:n>0?"1px solid var(--Grey-absent, #D9D9D9)":"none",background:o?"var(--surface-hover, #F3F7F7)":"var(--Grey-White, #FFF)"},children:[e.jsxs("div",{style:{display:"flex",alignItems:"center",justifyContent:"space-between",width:"100%",gap:8},children:[e.jsx("span",{style:{fontSize:14,fontWeight:600,lineHeight:1.2,color:r?"var(--Grey-Strong, #2E3236)":"var(--Grey-Muted, #808183)"},children:t.speaker}),e.jsxs("div",{style:{display:"flex",alignItems:"center",gap:8},children:[o&&e.jsxs(e.Fragment,{children:[e.jsx(s.AudioLines,{size:12,color:"#2E3236"}),e.jsx(s.AudioLines,{size:12,color:"#2E3236"})]}),e.jsx("span",{style:{fontSize:13,fontWeight:400,lineHeight:1.2,color:"var(--Grey-Muted, #808183)"},children:t.time})]})]}),e.jsxs("div",{style:{display:"flex",alignItems:"flex-start",gap:8,width:"100%"},children:[e.jsx("button",{onClick:()=>ae(n),style:{background:"none",border:"none",cursor:"pointer",padding:0,flexShrink:0,display:"flex"},children:o?e.jsx(s.PauseCircle,{size:17,color:"#2E3236",strokeWidth:1.5}):e.jsx(s.PlayCircle,{size:17,color:"#808183",strokeWidth:1})}),e.jsx("p",{style:{fontSize:13,fontWeight:400,color:"var(--Grey-Strong, #2E3236)",lineHeight:1.2,margin:0,flex:1},children:t.text})]})]},n)})})]})]})});exports.UpdatedInteractionRecording=ce;
 //# sourceMappingURL=UpdatedInteractionRecording.cjs.js.map

package/dist/UpdatedInteractionRecording.cjs.js.map

@@ -1 +1 @@
-{"version":3,"file":"UpdatedInteractionRecording.cjs.js","sources":["../src/components/UpdatedInteractionDetails/UpdatedInteractionRecording.jsx"],"sourcesContent":["import { useRef, useState, forwardRef, useImperativeHandle } from 'react';\nimport {\n  Play, Pause, RotateCcw, RotateCw,\n  ChevronLeft, ChevronRight, ChevronDown,\n  AudioLines, PlayCircle, PauseCircle,\n} from 'lucide-react';\nimport Timeline from '../media/Timeline.jsx';\nimport TranscriptCard from '../media/TranscriptCard.jsx';\n\nfunction fmtTime(seconds) {\n  const m = Math.floor(seconds / 60);\n  const s = Math.round(seconds % 60);\n  return `${m}:${s.toString().padStart(2, '0')}`;\n}\n\n/* ── Demo data for static preview ── */\nconst DEMO_SEGMENTS = {\n  David: [\n    { start: 0, end: 0.08 },\n    { start: 0.18, end: 0.22 },\n    { start: 0.38, end: 0.42 },\n    { start: 0.55, end: 0.58 },\n    { start: 0.68, end: 0.72 },\n    { start: 0.82, end: 0.88 },\n    { start: 0.94, end: 1 },\n  ],\n  Customer: [\n    { start: 0.1, end: 0.16 },\n    { start: 0.24, end: 0.36 },\n    { start: 0.44, end: 0.52 },\n    { start: 0.6, end: 0.66 },\n    { start: 0.74, end: 0.80 },\n  ],\n};\n\nconst DEMO_TRANSCRIPT = [\n  { speaker: 'David', type: 'agent', time: '00:04', text: 'Thanks for calling Miles Point S Pensau. This is Steve. How can I help you?' },\n  { speaker: 'Customer', type: 'customer', time: '00:12', text: 'Hi, Steve. This is Sandra with Botai Catering.' },\n  { speaker: 'David', type: 'agent', time: '00:18', text: 'Hello. How are you?' },\n  { speaker: 'Customer', type: 'customer', time: '00:20', text: \"I'm doing really good. Hey. I brought my vans in last week, and I call it a beeping van, the one that beeps when you back up. Makes the crunchy noise. So I just took it on Saturday after, I think I had the, the Miles. I picked it up on Saturday morning, and I went to an event. So So I don't know if it's the tire or something, but makes it a little crunchy noise. Sometimes when I do the brake, but only if I turn the wheel too.\" },\n  { speaker: 'David', type: 'agent', time: '00:21', text: 'Oh, interesting. Okay. Can you swing by with it one of these days?' },\n];\n\n/* ── Component ── */\nconst UpdatedInteractionRecording = forwardRef(function UpdatedInteractionRecording({\n  audioUrl,\n  timelineSegments = [],\n  durationSeconds = 0,\n  currentTimeSeconds = 0,\n  timelinePlaying = false,\n  playbackRate = 1,\n  onSeek,\n  onTogglePlay,\n  onSeekBack,\n  onSeekForward,\n  onSetPlaybackRate,\n  audioRef,\n  transcript,\n  highlightedTurns = new Set(),\n  activeTurnIndex,\n  activeDemoIndex = 1,\n  turnObservations = {},\n  setExpandedSignals,\n  onTurnPlayPause,\n}, ref) {\n  const scrollRef = useRef(null);\n  const [demoSeekTime, setDemoSeekTime] = useState(null);\n  const [demoRate, setDemoRate] = useState(playbackRate || 1);\n  const [demoPlaying, setDemoPlaying] = useState(timelinePlaying);\n  const [showSpeedMenu, setShowSpeedMenu] = useState(false);\n  const [activeDemoIdx, setActiveDemoIdx] = useState(activeDemoIndex);\n\n  /* Compute which transcript card matches current playback time */\n  const computeActiveIdx = (timeSec) => {\n    for (let i = DEMO_TRANSCRIPT.length - 1; i >= 0; i--) {\n      const turnTime = parseTimeStr(DEMO_TRANSCRIPT[i].time);\n      if (timeSec >= turnTime) return i;\n    }\n    return 0;\n  };\n\n  const parseTimeStr = (timeStr) => {\n    if (!timeStr) return 0;\n    const parts = timeStr.split(':').map(Number);\n    return (parts[0] || 0) * 60 + (parts[1] || 0);\n  };\n\n  const SPEED_OPTIONS = [1, 1.25, 1.5, 2];\n  const isDemo = !audioUrl;\n  const activeRate = isDemo ? demoRate : playbackRate;\n  const activePlaying = isDemo ? demoPlaying : timelinePlaying;\n\n  /* Expose seekTo for parent to call via ref */\n  useImperativeHandle(ref, () => ({\n    seekTo: (timeSec) => {\n      handleSeek(timeSec);\n      setDemoPlaying(true);\n      // Scroll to matching transcript card\n      const idx = computeActiveIdx(timeSec);\n      setActiveDemoIdx(idx);\n      setTimeout(() => {\n        const cards = scrollRef.current?.children;\n        if (cards?.[idx]) {\n          cards[idx].scrollIntoView({ behavior: 'smooth', block: 'nearest' });\n        }\n      }, 50);\n    },\n  }));\n\n  /* Handle seek — updates local demo state or calls parent onSeek */\n  const handleSeek = (timeSeconds) => {\n    const clamped = Math.max(0, Math.min(timeSeconds, durationSeconds || 156));\n    if (onSeek) onSeek(clamped);\n    setDemoSeekTime(clamped);\n    setActiveDemoIdx(computeActiveIdx(clamped));\n  };\n\n  const handleTogglePlay = () => {\n    if (onTogglePlay) onTogglePlay();\n    else setDemoPlaying((prev) => !prev);\n  };\n\n  const handleSeekBack = () => {\n    if (onSeekBack) onSeekBack();\n    else handleSeek(Math.max(0, (demoSeekTime ?? 0) - 10));\n  };\n\n  const handleSeekForward = () => {\n    if (onSeekForward) onSeekForward();\n    else {\n      const demoDur = durationSeconds || 156;\n      handleSeek(Math.min(demoDur, (demoSeekTime ?? 0) + 10));\n    }\n  };\n\n  const handleSetRate = (rate) => {\n    if (onSetPlaybackRate) onSetPlaybackRate(rate);\n    setDemoRate(rate);\n    setShowSpeedMenu(false);\n  };\n\n  /* Handle transcript card play/pause */\n  const handleDemoTurnPlayPause = (idx) => {\n    if (activeDemoIdx === idx && demoPlaying) {\n      setDemoPlaying(false);\n    } else {\n      const turnTime = parseTimeStr(DEMO_TRANSCRIPT[idx]?.time);\n      setActiveDemoIdx(idx);\n      setDemoPlaying(true);\n      handleSeek(turnTime);\n    }\n  };\n\n  /* transcript turn builder */\n  const formatTimeRange = (startMs, endMs) => {\n    if (startMs == null) return undefined;\n    const fmt = (ms) => {\n      const minutes = Math.floor(ms / 60000);\n      const seconds = Math.floor((ms % 60000) / 1000);\n      return `${minutes.toString().padStart(2, '0')}:${seconds.toString().padStart(2, '0')}`;\n    };\n    return `${fmt(startMs)}\\u2013${endMs != null ? fmt(endMs) : fmt(startMs)}`;\n  };\n\n  const turns = transcript?.messages?.length\n    ? transcript.messages.map((m, i) => ({\n        actor: m.actor === 'agent' ? (transcript.actor_map?.agent || 'Agent') : (transcript.actor_map?.customer || 'Customer'),\n        actorType: m.actor === 'agent' ? 'agent' : 'customer',\n        text: m.text || '',\n        timeRange: formatTimeRange(m.start ?? m.start_ms, m.end ?? m.end_ms),\n        isHighlighted: highlightedTurns.has(i),\n        highlightColor: timelinePlaying && activeTurnIndex === i\n          ? (m.actor === 'agent' ? 'var(--rail-outcome)' : 'var(--rail-discovery)')\n          : undefined,\n        observations: (turnObservations[i] || []).map((obs) => ({\n          ...obs,\n          onClick: () => {\n            setExpandedSignals?.((prev) => new Set([...prev, obs.signalKey]));\n            setTimeout(() => {\n              const el = document.getElementById(`signal-${obs.signalKey}`);\n              if (el) el.scrollIntoView({ behavior: 'smooth', block: 'nearest' });\n            }, 100);\n          },\n        })),\n      }))\n    : null;\n\n  const demoDuration = durationSeconds || 156;\n  const effectiveTime = demoSeekTime != null ? demoSeekTime : (durationSeconds > 0 ? currentTimeSeconds : 0);\n  const progress = demoDuration > 0 ? (effectiveTime / demoDuration) * 100 : 0;\n  const demoCurrentTime = Math.round(effectiveTime);\n\n  return (\n    <div style={{\n      display: 'flex',\n      padding: 24,\n      flexDirection: 'column',\n      alignItems: 'flex-start',\n      gap: 24,\n      borderRadius: 8,\n      border: '1px solid var(--Grey-absent, #D9D9D9)',\n      background: 'var(--Grey-White, #FFF)',\n    }}>\n\n      {/* ════════════════════════════════════════\n          RECORDING SECTION\n          ════════════════════════════════════════ */}\n      <div style={{ width: '100%', display: 'flex', flexDirection: 'column', gap: 16 }}>\n\n        {/* ── Row 1: Title + Controls — Figma: Frame 35, horizontal, space-between, center ── */}\n        <div style={{ display: 'flex', alignItems: 'center', justifyContent: 'space-between', gap: 24 }}>\n          <span style={{\n            fontSize: 15, fontWeight: 600,\n            color: 'var(--Grey-Strong, #2E3236)',\n            lineHeight: 1.2,\n          }}>\n            Recording\n          </span>\n\n          {/* Frame 34: controls — horizontal, gap: 12, center */}\n          <div style={{ display: 'flex', alignItems: 'center', gap: 12, flex: 1, justifyContent: 'center' }}>\n            {/* Skip back 10s */}\n            <span style={{ fontSize: 13, fontWeight: 400, color: 'var(--Grey-Muted, #808183)', lineHeight: 1.2 }}>10</span>\n            <button onClick={handleSeekBack} style={{ background: 'none', border: 'none', cursor: 'pointer', padding: 0, display: 'flex', alignItems: 'center' }}>\n              <RotateCcw size={20} color=\"#808183\" strokeWidth={1.5} />\n            </button>\n\n            {/* Play / Pause — 32x32 dark circle */}\n            <button onClick={handleTogglePlay} style={{\n              background: 'var(--Grey-Strong, #2E3236)',\n              border: 'none', cursor: 'pointer',\n              width: 32, height: 32, borderRadius: 48,\n              padding: 0,\n              display: 'flex', alignItems: 'center', justifyContent: 'center',\n            }}>\n              {activePlaying\n                ? <Pause size={14} color=\"#FFF\" fill=\"#FFF\" />\n                : <Play size={14} color=\"#FFF\" fill=\"#FFF\" strokeWidth={1.5} style={{ marginLeft: 2 }} />\n              }\n            </button>\n\n            {/* Skip forward 10s */}\n            <button onClick={handleSeekForward} style={{ background: 'none', border: 'none', cursor: 'pointer', padding: 0, display: 'flex', alignItems: 'center' }}>\n              <RotateCw size={20} color=\"#808183\" strokeWidth={1.5} />\n            </button>\n            <span style={{ fontSize: 13, fontWeight: 400, color: 'var(--Grey-Muted, #808183)', lineHeight: 1.2 }}>10</span>\n          </div>\n\n          {/* Speed pill with dropdown */}\n          <div style={{ position: 'relative' }}>\n            <button\n              onClick={() => setShowSpeedMenu((prev) => !prev)}\n              style={{\n                background: 'var(--Grey-White, #FFF)',\n                border: '1px solid var(--Grey-absent, #D9D9D9)',\n                borderRadius: 20,\n                padding: '0 5px 0 10px',\n                height: 24,\n                minWidth: 56,\n                cursor: 'pointer',\n                fontSize: 13, fontWeight: 400,\n                color: 'var(--Grey-Strong, #2E3236)',\n                fontFamily: 'var(--font-sans)',\n                lineHeight: 1.2,\n                display: 'flex', alignItems: 'center', justifyContent: 'center', gap: 4,\n              }}\n            >\n              {activeRate}x\n              <ChevronDown size={12} color=\"#808183\" />\n            </button>\n\n            {showSpeedMenu && (\n              <div style={{\n                position: 'absolute',\n                top: '100%',\n                right: 0,\n                marginTop: 4,\n                background: 'var(--Grey-White, #FFF)',\n                border: '1px solid var(--Grey-absent, #D9D9D9)',\n                borderRadius: 8,\n                boxShadow: '0 4px 12px rgba(0,0,0,0.1)',\n                zIndex: 10,\n                overflow: 'hidden',\n                minWidth: 80,\n              }}>\n                {SPEED_OPTIONS.map((speed) => (\n                  <button\n                    key={speed}\n                    onClick={() => handleSetRate(speed)}\n                    style={{\n                      display: 'block',\n                      width: '100%',\n                      padding: '8px 12px',\n                      border: 'none',\n                      background: activeRate === speed ? 'var(--surface-hover, #F3F7F7)' : 'var(--Grey-White, #FFF)',\n                      cursor: 'pointer',\n                      fontSize: 13,\n                      fontWeight: activeRate === speed ? 600 : 400,\n                      color: 'var(--Grey-Strong, #2E3236)',\n                      fontFamily: 'var(--font-sans)',\n                      textAlign: 'left',\n                    }}\n                  >\n                    {speed}x\n                  </button>\n                ))}\n              </div>\n            )}\n          </div>\n        </div>\n\n        {/* ── Row 2: Progress bar ── */}\n        {audioUrl ? (\n          <>\n            <Timeline\n              segments={timelineSegments}\n              durationSeconds={durationSeconds}\n              currentTimeSeconds={currentTimeSeconds}\n              onSeek={onSeek}\n              showControls={false}\n              hasRecording\n              timelinePlaying={timelinePlaying}\n              playbackRate={playbackRate}\n            />\n            <audio ref={audioRef} preload=\"none\" style={{ display: 'none' }}>\n              <source src={audioUrl} type=\"audio/mpeg\" />\n            </audio>\n          </>\n        ) : (\n          <div style={{ display: 'flex', flexDirection: 'column', gap: 12 }}>\n            {/* Time label + scrubber bar */}\n            <div style={{ display: 'flex', alignItems: 'center', gap: 8 }}>\n              <span style={{\n                fontSize: 13, fontWeight: 600,\n                color: progress > 0 ? 'var(--Green-Primary, #00925F)' : 'var(--Grey-Strong, #2E3236)',\n                fontFamily: 'var(--font-sans)',\n                lineHeight: 1.2,\n                minWidth: 60,\n              }}>\n                {fmtTime(demoCurrentTime)}\n              </span>\n              <div\n                onClick={(e) => {\n                  const rect = e.currentTarget.getBoundingClientRect();\n                  const clickX = e.clientX - rect.left;\n                  const pct = Math.max(0, Math.min(1, clickX / rect.width));\n                  const seekTime = pct * demoDuration;\n                  handleSeek(seekTime);\n                }}\n                style={{\n                  flex: 1, height: 16,\n                  position: 'relative',\n                  display: 'flex', alignItems: 'center',\n                  cursor: 'pointer',\n                }}\n              >\n                {/* Background track — Figma: #E3E1D7, stroke w=4 */}\n                <div style={{\n                  position: 'absolute', left: 0, right: 0,\n                  height: 4, borderRadius: 2,\n                  background: 'var(--rail-surface-2, #E3E1D7)',\n                  pointerEvents: 'none',\n                }} />\n                {/* Played portion — Figma: #00925F, stroke w=4 */}\n                <div style={{\n                  position: 'absolute', left: 0, top: '50%',\n                  transform: 'translateY(-50%)',\n                  width: `${progress}%`,\n                  height: 4, borderRadius: 2,\n                  background: 'var(--Green-Primary, #00925F)',\n                  pointerEvents: 'none',\n                }} />\n                {/* Scrubber handle — Figma ellipse */}\n                <svg\n                  width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\"\n                  xmlns=\"http://www.w3.org/2000/svg\"\n                  style={{\n                    position: 'absolute',\n                    left: `${progress}%`,\n                    top: '50%',\n                    transform: 'translate(-50%, -50%)',\n                    pointerEvents: 'none',\n                  }}\n                >\n                  <path\n                    d=\"M7.875 1C11.6572 1 14.75 4.1191 14.75 8C14.75 11.8809 11.6572 15 7.875 15C4.09284 15 1 11.8809 1 8C1 4.1191 4.09284 1 7.875 1Z\"\n                    fill=\"#FFF\"\n                    stroke=\"#00925F\"\n                    strokeWidth=\"2\"\n                  />\n                </svg>\n              </div>\n            </div>\n\n            {/* ── Row 3: Speaker timeline bars + playback indicator ── */}\n            <div style={{ position: 'relative', paddingBottom: 30, cursor: 'pointer' }}>\n              {['David', 'Customer'].map((speaker, rowIdx) => (\n                <div key={speaker} style={{\n                  display: 'flex', alignItems: 'center', gap: 8,\n                  height: 20,\n                  marginBottom: rowIdx === 0 ? 4 : 0,\n                }}>\n                  <span style={{\n                    fontSize: 13, fontWeight: 400,\n                    color: 'var(--Grey-Muted, #808183)',\n                    fontFamily: 'var(--font-sans)',\n                    lineHeight: 1.2,\n                    minWidth: 60,\n                  }}>\n                    {speaker}\n                  </span>\n                  <div\n                    onClick={(e) => {\n                      const rect = e.currentTarget.getBoundingClientRect();\n                      const pct = Math.max(0, Math.min(1, (e.clientX - rect.left) / rect.width));\n                      handleSeek(pct * demoDuration);\n                    }}\n                    style={{\n                      flex: 1, height: 6,\n                      position: 'relative', borderRadius: 3,\n                      cursor: 'pointer',\n                    }}\n                  >\n                    {/* Thin baseline — Figma: #E3E1D7, stroke w=4 */}\n                    <div style={{\n                      position: 'absolute', left: 0, right: 0,\n                      top: '50%', transform: 'translateY(-50%)',\n                      height: 4, borderRadius: 2,\n                      background: 'var(--rail-surface-2, #E3E1D7)',\n                    }} />\n                    {/* Speech segments */}\n                    {DEMO_SEGMENTS[speaker].map((seg, i) => (\n                      <div key={i} style={{\n                        position: 'absolute',\n                        left: `${seg.start * 100}%`,\n                        width: `${(seg.end - seg.start) * 100}%`,\n                        top: 0, bottom: 0, borderRadius: 3,\n                        background: speaker === 'David'\n                          ? 'var(--Grey-Strong, #2E3236)'\n                          : 'var(--Grey-Muted, #808183)',\n                      }} />\n                    ))}\n                  </div>\n                </div>\n              ))}\n\n              {/* ── Playback position: dotted line + avatar + time tooltip ── */}\n              <div style={{\n                position: 'absolute',\n                left: 68,   /* 60 label + 8 gap */\n                right: 0,\n                top: 0,\n                bottom: 0,\n                pointerEvents: 'none',\n              }}>\n                {/* Dotted vertical line */}\n                <div style={{\n                  position: 'absolute',\n                  left: `${progress}%`,\n                  top: 0,\n                  height: 44, /* spans both rows */\n                  transform: 'translateX(-50%)',\n                  borderLeft: '1.5px dashed var(--Grey-Muted, #808183)',\n                  opacity: 0.5,\n                }} />\n\n                {/* Time tooltip — Figma: Frame 30, bg=#2E3236, pad 4 6, r=4, 14px/600/#FFF */}\n                <div style={{\n                  position: 'absolute',\n                  left: `${progress}%`,\n                  bottom: 0,\n                  transform: 'translateX(-50%)',\n                  background: 'var(--Grey-Strong, #2E3236)',\n                  color: 'var(--Grey-White, #FFF)',\n                  fontSize: 14, fontWeight: 600,\n                  lineHeight: 1.2,\n                  padding: '4px 6px',\n                  borderRadius: 4,\n                  whiteSpace: 'nowrap',\n                }}>\n                  {fmtTime(demoCurrentTime)}\n                </div>\n              </div>\n            </div>\n          </div>\n        )}\n      </div>\n\n      {/* ════════════════════════════════════════\n          TRANSCRIPT SECTION\n          ════════════════════════════════════════ */}\n      {/* Figma: Frame 49, vertical, gap: 16 */}\n      <div style={{\n        width: '100%',\n        display: 'flex', flexDirection: 'column', gap: 16,\n      }}>\n        {/* ── Header: Frame 50 — Transcript + nav arrows, horizontal, gap: 12, center ── */}\n        <div style={{ display: 'flex', alignItems: 'center', gap: 12 }}>\n          <span style={{\n            fontSize: 14, fontWeight: 400,\n            color: 'var(--Grey-Strong, #2E3236)',\n            lineHeight: 1.2,\n          }}>\n            Transcript\n          </span>\n          {/* Frame 51: nav arrows — horizontal, gap: 12, align: end, center */}\n          <div style={{ display: 'flex', alignItems: 'center', gap: 12, marginLeft: 'auto' }}>\n            <button onClick={() => scrollRef.current?.scrollBy({ top: -200, behavior: 'smooth' })} style={{\n              background: 'none', border: 'none', cursor: 'pointer', padding: 0, display: 'flex',\n            }}>\n              <ChevronLeft size={16} color=\"#808183\" strokeWidth={1.5} />\n            </button>\n            <button onClick={() => scrollRef.current?.scrollBy({ top: 200, behavior: 'smooth' })} style={{\n              background: 'none', border: 'none', cursor: 'pointer', padding: 0, display: 'flex',\n            }}>\n              <ChevronRight size={16} color=\"#808183\" strokeWidth={1.5} />\n            </button>\n          </div>\n        </div>\n\n        {/* ── Cards ── */}\n        {turns ? (\n          <div id=\"transcript-container\" ref={scrollRef} style={{ maxHeight: 600, overflowY: 'auto' }}>\n            <TranscriptCard\n              turns={turns}\n              audioUrl={audioUrl}\n              activeTurnIndex={activeTurnIndex}\n              autoScrollActiveTurn={timelinePlaying}\n              isExternalPlaying={timelinePlaying}\n              onTurnPlayPause={onTurnPlayPause}\n            />\n          </div>\n        ) : (\n          <div ref={scrollRef} style={{\n            display: 'flex', flexDirection: 'column',\n            maxHeight: 600, overflowY: 'auto',\n          }}>\n            {DEMO_TRANSCRIPT.map((card, i) => {\n              const isActive = i === activeDemoIdx && demoPlaying;\n              const isCustomer = card.type === 'customer';\n\n              return (\n                <div key={i} style={{\n                  display: 'flex',\n                  padding: 16,\n                  flexDirection: 'column',\n                  alignItems: 'flex-start',\n                  gap: 16,\n                  alignSelf: 'stretch',\n                  border: '1px solid var(--Grey-absent, #D9D9D9)',\n                  background: isActive ? 'var(--surface-hover, #F3F7F7)' : 'var(--Grey-White, #FFF)',\n                }}>\n                  {/* Frame 40: Speaker name + time — horizontal, space-between, center */}\n                  <div style={{\n                    display: 'flex', alignItems: 'center',\n                    justifyContent: 'space-between', width: '100%',\n                    gap: 8,\n                  }}>\n                    <span style={{\n                      fontSize: 14, fontWeight: 600,\n                      lineHeight: 1.2,\n                      color: isCustomer ? 'var(--Grey-Strong, #2E3236)' : 'var(--Grey-Muted, #808183)',\n                    }}>\n                      {card.speaker}\n                    </span>\n                    <div style={{ display: 'flex', alignItems: 'center', gap: 8 }}>\n                      {isActive && (\n                        <>\n                          <AudioLines size={12} color=\"#2E3236\" />\n                          <AudioLines size={12} color=\"#2E3236\" />\n                        </>\n                      )}\n                      <span style={{\n                        fontSize: 13, fontWeight: 400,\n                        lineHeight: 1.2,\n                        color: 'var(--Grey-Muted, #808183)',\n                      }}>\n                        {card.time}\n                      </span>\n                    </div>\n                  </div>\n\n                  {/* Frame 39: Play/Pause icon + text — horizontal, gap: 8 */}\n                  <div style={{ display: 'flex', alignItems: 'flex-start', gap: 8, width: '100%' }}>\n                    <button\n                      onClick={() => handleDemoTurnPlayPause(i)}\n                      style={{\n                        background: 'none', border: 'none',\n                        cursor: 'pointer', padding: 0,\n                        flexShrink: 0,\n                        display: 'flex',\n                      }}\n                    >\n                      {isActive ? (\n                        <PauseCircle size={17} color=\"#2E3236\" strokeWidth={1.5} />\n                      ) : (\n                        <PlayCircle size={17} color=\"#808183\" strokeWidth={1} />\n                      )}\n                    </button>\n                    <p style={{\n                      fontSize: 13, fontWeight: 400,\n                      color: 'var(--Grey-Strong, #2E3236)',\n                      lineHeight: 1.2,\n                      margin: 0,\n                      flex: 1,\n                    }}>\n                      {card.text}\n                    </p>\n                  </div>\n                </div>\n              );\n            })}\n          </div>\n        )}\n      </div>\n    </div>\n  );\n});\n\nexport default UpdatedInteractionRecording;\n"],"names":["fmtTime","seconds","m","s","DEMO_SEGMENTS","DEMO_TRANSCRIPT","UpdatedInteractionRecording","forwardRef","audioUrl","timelineSegments","durationSeconds","currentTimeSeconds","timelinePlaying","playbackRate","onSeek","onTogglePlay","onSeekBack","onSeekForward","onSetPlaybackRate","audioRef","transcript","highlightedTurns","activeTurnIndex","activeDemoIndex","turnObservations","setExpandedSignals","onTurnPlayPause","ref","scrollRef","useRef","demoSeekTime","setDemoSeekTime","useState","demoRate","setDemoRate","demoPlaying","setDemoPlaying","showSpeedMenu","setShowSpeedMenu","activeDemoIdx","setActiveDemoIdx","computeActiveIdx","timeSec","i","turnTime","parseTimeStr","timeStr","parts","SPEED_OPTIONS","isDemo","activeRate","activePlaying","useImperativeHandle","handleSeek","idx","cards","_a","timeSeconds","clamped","handleTogglePlay","prev","handleSeekBack","handleSeekForward","handleSetRate","rate","handleDemoTurnPlayPause","formatTimeRange","startMs","endMs","fmt","ms","minutes","turns","_b","obs","el","demoDuration","effectiveTime","progress","demoCurrentTime","jsxs","jsx","RotateCcw","Pause","Play","RotateCw","ChevronDown","speed","Fragment","Timeline","e","rect","clickX","seekTime","speaker","rowIdx","pct","seg","ChevronLeft","ChevronRight","TranscriptCard","card","isActive","isCustomer","AudioLines","PauseCircle","PlayCircle"],"mappings":"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"}
+{"version":3,"file":"UpdatedInteractionRecording.cjs.js","sources":["../src/components/UpdatedInteractionDetails/UpdatedInteractionRecording.jsx"],"sourcesContent":["import { useRef, useState, forwardRef, useImperativeHandle } from 'react';\nimport {\n  Play, Pause, RotateCcw, RotateCw,\n  ChevronDown,\n  AudioLines, PlayCircle, PauseCircle,\n} from 'lucide-react';\nimport Timeline from '../media/Timeline.jsx';\nimport TranscriptCard from '../media/TranscriptCard.jsx';\n\nfunction fmtTime(seconds) {\n  const m = Math.floor(seconds / 60);\n  const s = Math.round(seconds % 60);\n  return `${m}:${s.toString().padStart(2, '0')}`;\n}\n\n/* ── Demo data for static preview ── */\nconst DEMO_SEGMENTS = {\n  David: [\n    { start: 0, end: 0.08 },\n    { start: 0.18, end: 0.22 },\n    { start: 0.38, end: 0.42 },\n    { start: 0.55, end: 0.58 },\n    { start: 0.68, end: 0.72 },\n    { start: 0.82, end: 0.88 },\n    { start: 0.94, end: 1 },\n  ],\n  Customer: [\n    { start: 0.1, end: 0.16 },\n    { start: 0.24, end: 0.36 },\n    { start: 0.44, end: 0.52 },\n    { start: 0.6, end: 0.66 },\n    { start: 0.74, end: 0.80 },\n  ],\n};\n\nconst DEMO_TRANSCRIPT = [\n  { speaker: 'David', type: 'agent', time: '00:04', text: 'Thanks for calling Miles Point S Pensau. This is Steve. How can I help you?' },\n  { speaker: 'Customer', type: 'customer', time: '00:12', text: 'Hi, Steve. This is Sandra with Botai Catering.' },\n  { speaker: 'David', type: 'agent', time: '00:18', text: 'Hello. How are you?' },\n  { speaker: 'Customer', type: 'customer', time: '00:20', text: \"I'm doing really good. Hey. I brought my vans in last week, and I call it a beeping van, the one that beeps when you back up. Makes the crunchy noise. So I just took it on Saturday after, I think I had the, the Miles. I picked it up on Saturday morning, and I went to an event. So So I don't know if it's the tire or something, but makes it a little crunchy noise. Sometimes when I do the brake, but only if I turn the wheel too.\" },\n  { speaker: 'David', type: 'agent', time: '00:21', text: 'Oh, interesting. Okay. Can you swing by with it one of these days?' },\n];\n\n/* ── Component ── */\nconst UpdatedInteractionRecording = forwardRef(function UpdatedInteractionRecording({\n  audioUrl,\n  timelineSegments = [],\n  durationSeconds = 0,\n  currentTimeSeconds = 0,\n  timelinePlaying = false,\n  playbackRate = 1,\n  onSeek,\n  onTogglePlay,\n  onSeekBack,\n  onSeekForward,\n  onSetPlaybackRate,\n  audioRef,\n  transcript,\n  highlightedTurns = new Set(),\n  activeTurnIndex,\n  activeDemoIndex = 1,\n  turnObservations = {},\n  setExpandedSignals,\n  onTurnPlayPause,\n}, ref) {\n  const scrollRef = useRef(null);\n  const [demoSeekTime, setDemoSeekTime] = useState(null);\n  const [demoRate, setDemoRate] = useState(playbackRate || 1);\n  const [demoPlaying, setDemoPlaying] = useState(timelinePlaying);\n  const [showSpeedMenu, setShowSpeedMenu] = useState(false);\n  const [activeDemoIdx, setActiveDemoIdx] = useState(activeDemoIndex);\n\n  /* Compute which transcript card matches current playback time */\n  const computeActiveIdx = (timeSec) => {\n    for (let i = DEMO_TRANSCRIPT.length - 1; i >= 0; i--) {\n      const turnTime = parseTimeStr(DEMO_TRANSCRIPT[i].time);\n      if (timeSec >= turnTime) return i;\n    }\n    return 0;\n  };\n\n  const parseTimeStr = (timeStr) => {\n    if (!timeStr) return 0;\n    const parts = timeStr.split(':').map(Number);\n    return (parts[0] || 0) * 60 + (parts[1] || 0);\n  };\n\n  const SPEED_OPTIONS = [1, 1.25, 1.5, 2];\n  const isDemo = !audioUrl;\n  const activeRate = isDemo ? demoRate : playbackRate;\n  const activePlaying = isDemo ? demoPlaying : timelinePlaying;\n\n  /* Expose seekTo for parent to call via ref */\n  useImperativeHandle(ref, () => ({\n    seekTo: (timeSec) => {\n      handleSeek(timeSec);\n      setDemoPlaying(true);\n      // Scroll to matching transcript card\n      const idx = computeActiveIdx(timeSec);\n      setActiveDemoIdx(idx);\n      setTimeout(() => {\n        const cards = scrollRef.current?.children;\n        if (cards?.[idx]) {\n          cards[idx].scrollIntoView({ behavior: 'smooth', block: 'nearest' });\n        }\n      }, 50);\n    },\n  }));\n\n  /* Handle seek — updates local demo state or calls parent onSeek */\n  const handleSeek = (timeSeconds) => {\n    const clamped = Math.max(0, Math.min(timeSeconds, durationSeconds || 156));\n    if (onSeek) onSeek(clamped);\n    setDemoSeekTime(clamped);\n    setActiveDemoIdx(computeActiveIdx(clamped));\n  };\n\n  const handleTogglePlay = () => {\n    if (onTogglePlay) onTogglePlay();\n    else setDemoPlaying((prev) => !prev);\n  };\n\n  const handleSeekBack = () => {\n    if (onSeekBack) onSeekBack();\n    else handleSeek(Math.max(0, (demoSeekTime ?? 0) - 10));\n  };\n\n  const handleSeekForward = () => {\n    if (onSeekForward) onSeekForward();\n    else {\n      const demoDur = durationSeconds || 156;\n      handleSeek(Math.min(demoDur, (demoSeekTime ?? 0) + 10));\n    }\n  };\n\n  const handleSetRate = (rate) => {\n    if (onSetPlaybackRate) onSetPlaybackRate(rate);\n    setDemoRate(rate);\n    setShowSpeedMenu(false);\n  };\n\n  /* Handle transcript card play/pause */\n  const handleDemoTurnPlayPause = (idx) => {\n    if (activeDemoIdx === idx && demoPlaying) {\n      setDemoPlaying(false);\n    } else {\n      const turnTime = parseTimeStr(DEMO_TRANSCRIPT[idx]?.time);\n      setActiveDemoIdx(idx);\n      setDemoPlaying(true);\n      handleSeek(turnTime);\n    }\n  };\n\n  /* transcript turn builder */\n  const formatTimeRange = (startMs, endMs) => {\n    if (startMs == null) return undefined;\n    const fmt = (ms) => {\n      const minutes = Math.floor(ms / 60000);\n      const seconds = Math.floor((ms % 60000) / 1000);\n      return `${minutes.toString().padStart(2, '0')}:${seconds.toString().padStart(2, '0')}`;\n    };\n    return `${fmt(startMs)}\\u2013${endMs != null ? fmt(endMs) : fmt(startMs)}`;\n  };\n\n  const turns = transcript?.messages?.length\n    ? transcript.messages.map((m, i) => ({\n        actor: m.actor === 'agent' ? (transcript.actor_map?.agent || 'Agent') : (transcript.actor_map?.customer || 'Customer'),\n        actorType: m.actor === 'agent' ? 'agent' : 'customer',\n        text: m.text || '',\n        timeRange: formatTimeRange(m.start ?? m.start_ms, m.end ?? m.end_ms),\n        isHighlighted: highlightedTurns.has(i),\n        highlightColor: timelinePlaying && activeTurnIndex === i\n          ? (m.actor === 'agent' ? 'var(--rail-outcome)' : 'var(--rail-discovery)')\n          : undefined,\n        observations: (turnObservations[i] || []).map((obs) => ({\n          ...obs,\n          onClick: () => {\n            setExpandedSignals?.((prev) => new Set([...prev, obs.signalKey]));\n            setTimeout(() => {\n              const el = document.getElementById(`signal-${obs.signalKey}`);\n              if (el) el.scrollIntoView({ behavior: 'smooth', block: 'nearest' });\n            }, 100);\n          },\n        })),\n      }))\n    : null;\n\n  const demoDuration = durationSeconds || 156;\n  const effectiveTime = demoSeekTime != null ? demoSeekTime : (durationSeconds > 0 ? currentTimeSeconds : 0);\n  const progress = demoDuration > 0 ? (effectiveTime / demoDuration) * 100 : 0;\n  const demoCurrentTime = Math.round(effectiveTime);\n\n  return (\n    <div style={{\n      display: 'flex',\n      padding: 24,\n      flexDirection: 'column',\n      alignItems: 'flex-start',\n      gap: 24,\n      borderRadius: 8,\n      border: '1px solid var(--Grey-absent, #D9D9D9)',\n      background: 'var(--Grey-White, #FFF)',\n    }}>\n\n      {/* ════════════════════════════════════════\n          RECORDING SECTION\n          ════════════════════════════════════════ */}\n      <div style={{ width: '100%', display: 'flex', flexDirection: 'column', gap: 16 }}>\n\n        {/* ── Row 1: Title + Controls — Figma: Frame 35, horizontal, space-between, center ── */}\n        <div style={{ display: 'flex', alignItems: 'center', justifyContent: 'space-between', gap: 24 }}>\n          <span style={{\n            fontSize: 15, fontWeight: 600,\n            color: 'var(--Grey-Strong, #2E3236)',\n            lineHeight: 1.2,\n          }}>\n            Recording\n          </span>\n\n          {/* Frame 34: controls — horizontal, gap: 12, center */}\n          <div style={{ display: 'flex', alignItems: 'center', gap: 12, flex: 1, justifyContent: 'center' }}>\n            {/* Skip back 10s */}\n            <span style={{ fontSize: 13, fontWeight: 400, color: 'var(--Grey-Muted, #808183)', lineHeight: 1.2 }}>10</span>\n            <button onClick={handleSeekBack} style={{ background: 'none', border: 'none', cursor: 'pointer', padding: 0, display: 'flex', alignItems: 'center' }}>\n              <RotateCcw size={20} color=\"#808183\" strokeWidth={1.5} />\n            </button>\n\n            {/* Play / Pause — 32x32 dark circle */}\n            <button onClick={handleTogglePlay} style={{\n              background: 'var(--Grey-Strong, #2E3236)',\n              border: 'none', cursor: 'pointer',\n              width: 32, height: 32, borderRadius: 48,\n              padding: 0,\n              display: 'flex', alignItems: 'center', justifyContent: 'center',\n            }}>\n              {activePlaying\n                ? <Pause size={14} color=\"#FFF\" fill=\"#FFF\" />\n                : <Play size={14} color=\"#FFF\" fill=\"#FFF\" strokeWidth={1.5} style={{ marginLeft: 2 }} />\n              }\n            </button>\n\n            {/* Skip forward 10s */}\n            <button onClick={handleSeekForward} style={{ background: 'none', border: 'none', cursor: 'pointer', padding: 0, display: 'flex', alignItems: 'center' }}>\n              <RotateCw size={20} color=\"#808183\" strokeWidth={1.5} />\n            </button>\n            <span style={{ fontSize: 13, fontWeight: 400, color: 'var(--Grey-Muted, #808183)', lineHeight: 1.2 }}>10</span>\n          </div>\n\n          {/* Speed pill with dropdown */}\n          <div style={{ position: 'relative' }}>\n            <button\n              onClick={() => setShowSpeedMenu((prev) => !prev)}\n              style={{\n                background: 'var(--Grey-White, #FFF)',\n                border: '1px solid var(--Grey-absent, #D9D9D9)',\n                borderRadius: 20,\n                padding: '0 5px 0 10px',\n                height: 24,\n                minWidth: 56,\n                cursor: 'pointer',\n                fontSize: 13, fontWeight: 400,\n                color: 'var(--Grey-Strong, #2E3236)',\n                fontFamily: 'var(--font-sans)',\n                lineHeight: 1.2,\n                display: 'flex', alignItems: 'center', justifyContent: 'center', gap: 4,\n              }}\n            >\n              {activeRate}x\n              <ChevronDown size={12} color=\"#808183\" />\n            </button>\n\n            {showSpeedMenu && (\n              <div style={{\n                position: 'absolute',\n                top: '100%',\n                right: 0,\n                marginTop: 4,\n                background: 'var(--Grey-White, #FFF)',\n                border: '1px solid var(--Grey-absent, #D9D9D9)',\n                borderRadius: 8,\n                boxShadow: '0 4px 12px rgba(0,0,0,0.1)',\n                zIndex: 10,\n                overflow: 'hidden',\n                minWidth: 80,\n              }}>\n                {SPEED_OPTIONS.map((speed) => (\n                  <button\n                    key={speed}\n                    onClick={() => handleSetRate(speed)}\n                    style={{\n                      display: 'block',\n                      width: '100%',\n                      padding: '8px 12px',\n                      border: 'none',\n                      background: activeRate === speed ? 'var(--surface-hover, #F3F7F7)' : 'var(--Grey-White, #FFF)',\n                      cursor: 'pointer',\n                      fontSize: 13,\n                      fontWeight: activeRate === speed ? 600 : 400,\n                      color: 'var(--Grey-Strong, #2E3236)',\n                      fontFamily: 'var(--font-sans)',\n                      textAlign: 'left',\n                    }}\n                  >\n                    {speed}x\n                  </button>\n                ))}\n              </div>\n            )}\n          </div>\n        </div>\n\n        {/* ── Row 2: Progress bar ── */}\n        {audioUrl ? (\n          <>\n            <Timeline\n              segments={timelineSegments}\n              durationSeconds={durationSeconds}\n              currentTimeSeconds={currentTimeSeconds}\n              onSeek={onSeek}\n              showControls={false}\n              hasRecording\n              timelinePlaying={timelinePlaying}\n              playbackRate={playbackRate}\n            />\n            <audio ref={audioRef} preload=\"none\" style={{ display: 'none' }}>\n              <source src={audioUrl} type=\"audio/mpeg\" />\n            </audio>\n          </>\n        ) : (\n          <div style={{ display: 'flex', flexDirection: 'column', gap: 12 }}>\n            {/* Time label + scrubber bar */}\n            <div style={{ display: 'flex', alignItems: 'center', gap: 8 }}>\n              <span style={{\n                fontSize: 13, fontWeight: 600,\n                color: progress > 0 ? 'var(--Green-Primary, #00925F)' : 'var(--Grey-Strong, #2E3236)',\n                fontFamily: 'var(--font-sans)',\n                lineHeight: 1.2,\n                minWidth: 60,\n              }}>\n                {fmtTime(demoCurrentTime)}\n              </span>\n              <div\n                onClick={(e) => {\n                  const rect = e.currentTarget.getBoundingClientRect();\n                  const clickX = e.clientX - rect.left;\n                  const pct = Math.max(0, Math.min(1, clickX / rect.width));\n                  const seekTime = pct * demoDuration;\n                  handleSeek(seekTime);\n                }}\n                style={{\n                  flex: 1, height: 16,\n                  position: 'relative',\n                  display: 'flex', alignItems: 'center',\n                  cursor: 'pointer',\n                }}\n              >\n                {/* Background track — Figma: #E3E1D7, stroke w=4 */}\n                <div style={{\n                  position: 'absolute', left: 0, right: 0,\n                  height: 4, borderRadius: 2,\n                  background: 'var(--rail-surface-2, #E3E1D7)',\n                  pointerEvents: 'none',\n                }} />\n                {/* Played portion — Figma: #00925F, stroke w=4 */}\n                <div style={{\n                  position: 'absolute', left: 0, top: '50%',\n                  transform: 'translateY(-50%)',\n                  width: `${progress}%`,\n                  height: 4, borderRadius: 2,\n                  background: 'var(--Green-Primary, #00925F)',\n                  pointerEvents: 'none',\n                }} />\n                {/* Scrubber handle — Figma ellipse */}\n                <svg\n                  width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\"\n                  xmlns=\"http://www.w3.org/2000/svg\"\n                  style={{\n                    position: 'absolute',\n                    left: `${progress}%`,\n                    top: '50%',\n                    transform: 'translate(-50%, -50%)',\n                    pointerEvents: 'none',\n                  }}\n                >\n                  <path\n                    d=\"M7.875 1C11.6572 1 14.75 4.1191 14.75 8C14.75 11.8809 11.6572 15 7.875 15C4.09284 15 1 11.8809 1 8C1 4.1191 4.09284 1 7.875 1Z\"\n                    fill=\"#FFF\"\n                    stroke=\"#00925F\"\n                    strokeWidth=\"2\"\n                  />\n                </svg>\n              </div>\n            </div>\n\n            {/* ── Row 3: Speaker timeline bars + playback indicator ── */}\n            <div style={{ position: 'relative', paddingBottom: 30, cursor: 'pointer' }}>\n              {['David', 'Customer'].map((speaker, rowIdx) => (\n                <div key={speaker} style={{\n                  display: 'flex', alignItems: 'center', gap: 8,\n                  height: 20,\n                  marginBottom: rowIdx === 0 ? 4 : 0,\n                }}>\n                  <span style={{\n                    fontSize: 13, fontWeight: 400,\n                    color: 'var(--Grey-Muted, #808183)',\n                    fontFamily: 'var(--font-sans)',\n                    lineHeight: 1.2,\n                    minWidth: 60,\n                  }}>\n                    {speaker}\n                  </span>\n                  <div\n                    onClick={(e) => {\n                      const rect = e.currentTarget.getBoundingClientRect();\n                      const pct = Math.max(0, Math.min(1, (e.clientX - rect.left) / rect.width));\n                      handleSeek(pct * demoDuration);\n                    }}\n                    style={{\n                      flex: 1, height: 6,\n                      position: 'relative', borderRadius: 3,\n                      cursor: 'pointer',\n                    }}\n                  >\n                    {/* Thin baseline — Figma: #E3E1D7, stroke w=4 */}\n                    <div style={{\n                      position: 'absolute', left: 0, right: 0,\n                      top: '50%', transform: 'translateY(-50%)',\n                      height: 4, borderRadius: 2,\n                      background: 'var(--rail-surface-2, #E3E1D7)',\n                    }} />\n                    {/* Speech segments */}\n                    {DEMO_SEGMENTS[speaker].map((seg, i) => (\n                      <div key={i} style={{\n                        position: 'absolute',\n                        left: `${seg.start * 100}%`,\n                        width: `${(seg.end - seg.start) * 100}%`,\n                        top: 0, bottom: 0, borderRadius: 3,\n                        background: speaker === 'David'\n                          ? 'var(--Grey-Strong, #2E3236)'\n                          : 'var(--Grey-Muted, #808183)',\n                      }} />\n                    ))}\n                  </div>\n                </div>\n              ))}\n\n              {/* ── Playback position: dotted line + avatar + time tooltip ── */}\n              <div style={{\n                position: 'absolute',\n                left: 68,   /* 60 label + 8 gap */\n                right: 0,\n                top: 0,\n                bottom: 0,\n                pointerEvents: 'none',\n              }}>\n                {/* Dotted vertical line */}\n                <div style={{\n                  position: 'absolute',\n                  left: `${progress}%`,\n                  top: 0,\n                  height: 44, /* spans both rows */\n                  transform: 'translateX(-50%)',\n                  borderLeft: '1.5px dashed var(--Grey-Muted, #808183)',\n                  opacity: 0.5,\n                }} />\n\n                {/* Time tooltip — Figma: Frame 30, bg=#2E3236, pad 4 6, r=4, 14px/600/#FFF */}\n                <div style={{\n                  position: 'absolute',\n                  left: `${progress}%`,\n                  bottom: 0,\n                  transform: 'translateX(-50%)',\n                  background: 'var(--Grey-Strong, #2E3236)',\n                  color: 'var(--Grey-White, #FFF)',\n                  fontSize: 14, fontWeight: 600,\n                  lineHeight: 1.2,\n                  padding: '4px 6px',\n                  borderRadius: 4,\n                  whiteSpace: 'nowrap',\n                }}>\n                  {fmtTime(demoCurrentTime)}\n                </div>\n              </div>\n            </div>\n          </div>\n        )}\n      </div>\n\n      {/* ════════════════════════════════════════\n          TRANSCRIPT SECTION\n          ════════════════════════════════════════ */}\n      {/* Figma: Frame 49, vertical, gap: 16 */}\n      <div style={{\n        width: '100%',\n        display: 'flex', flexDirection: 'column', gap: 16,\n      }}>\n        {/* ── Header: Transcript ── */}\n        <div style={{\n          borderBottom: '1px solid var(--Grey-absent, #D9D9D9)',\n          paddingBottom: 16,\n        }}>\n          <span style={{\n            fontSize: 14, fontWeight: 400,\n            color: 'var(--Grey-Strong, #2E3236)',\n            lineHeight: 1.2,\n          }}>\n            Transcript\n          </span>\n        </div>\n\n        {/* ── Cards ── */}\n        {turns ? (\n          <div id=\"transcript-container\" ref={scrollRef} style={{ maxHeight: 600, overflowY: 'auto' }}>\n            <TranscriptCard\n              turns={turns}\n              audioUrl={audioUrl}\n              activeTurnIndex={activeTurnIndex}\n              autoScrollActiveTurn={timelinePlaying}\n              isExternalPlaying={timelinePlaying}\n              onTurnPlayPause={onTurnPlayPause}\n            />\n          </div>\n        ) : (\n          <div ref={scrollRef} style={{\n            display: 'flex', flexDirection: 'column',\n            maxHeight: 600, overflowY: 'auto',\n          }}>\n            {DEMO_TRANSCRIPT.map((card, i) => {\n              const isActive = i === activeDemoIdx && demoPlaying;\n              const isCustomer = card.type === 'customer';\n\n              return (\n                <div key={i} style={{\n                  display: 'flex',\n                  padding: 16,\n                  flexDirection: 'column',\n                  alignItems: 'flex-start',\n                  gap: 16,\n                  alignSelf: 'stretch',\n                  borderTop: i > 0 ? '1px solid var(--Grey-absent, #D9D9D9)' : 'none',\n                  background: isActive ? 'var(--surface-hover, #F3F7F7)' : 'var(--Grey-White, #FFF)',\n                }}>\n                  {/* Frame 40: Speaker name + time — horizontal, space-between, center */}\n                  <div style={{\n                    display: 'flex', alignItems: 'center',\n                    justifyContent: 'space-between', width: '100%',\n                    gap: 8,\n                  }}>\n                    <span style={{\n                      fontSize: 14, fontWeight: 600,\n                      lineHeight: 1.2,\n                      color: isCustomer ? 'var(--Grey-Strong, #2E3236)' : 'var(--Grey-Muted, #808183)',\n                    }}>\n                      {card.speaker}\n                    </span>\n                    <div style={{ display: 'flex', alignItems: 'center', gap: 8 }}>\n                      {isActive && (\n                        <>\n                          <AudioLines size={12} color=\"#2E3236\" />\n                          <AudioLines size={12} color=\"#2E3236\" />\n                        </>\n                      )}\n                      <span style={{\n                        fontSize: 13, fontWeight: 400,\n                        lineHeight: 1.2,\n                        color: 'var(--Grey-Muted, #808183)',\n                      }}>\n                        {card.time}\n                      </span>\n                    </div>\n                  </div>\n\n                  {/* Frame 39: Play/Pause icon + text — horizontal, gap: 8 */}\n                  <div style={{ display: 'flex', alignItems: 'flex-start', gap: 8, width: '100%' }}>\n                    <button\n                      onClick={() => handleDemoTurnPlayPause(i)}\n                      style={{\n                        background: 'none', border: 'none',\n                        cursor: 'pointer', padding: 0,\n                        flexShrink: 0,\n                        display: 'flex',\n                      }}\n                    >\n                      {isActive ? (\n                        <PauseCircle size={17} color=\"#2E3236\" strokeWidth={1.5} />\n                      ) : (\n                        <PlayCircle size={17} color=\"#808183\" strokeWidth={1} />\n                      )}\n                    </button>\n                    <p style={{\n                      fontSize: 13, fontWeight: 400,\n                      color: 'var(--Grey-Strong, #2E3236)',\n                      lineHeight: 1.2,\n                      margin: 0,\n                      flex: 1,\n                    }}>\n                      {card.text}\n                    </p>\n                  </div>\n                </div>\n              );\n            })}\n          </div>\n        )}\n      </div>\n    </div>\n  );\n});\n\nexport default UpdatedInteractionRecording;\n"],"names":["fmtTime","seconds","m","s","DEMO_SEGMENTS","DEMO_TRANSCRIPT","UpdatedInteractionRecording","forwardRef","audioUrl","timelineSegments","durationSeconds","currentTimeSeconds","timelinePlaying","playbackRate","onSeek","onTogglePlay","onSeekBack","onSeekForward","onSetPlaybackRate","audioRef","transcript","highlightedTurns","activeTurnIndex","activeDemoIndex","turnObservations","setExpandedSignals","onTurnPlayPause","ref","scrollRef","useRef","demoSeekTime","setDemoSeekTime","useState","demoRate","setDemoRate","demoPlaying","setDemoPlaying","showSpeedMenu","setShowSpeedMenu","activeDemoIdx","setActiveDemoIdx","computeActiveIdx","timeSec","i","turnTime","parseTimeStr","timeStr","parts","SPEED_OPTIONS","isDemo","activeRate","activePlaying","useImperativeHandle","handleSeek","idx","cards","_a","timeSeconds","clamped","handleTogglePlay","prev","handleSeekBack","handleSeekForward","handleSetRate","rate","handleDemoTurnPlayPause","formatTimeRange","startMs","endMs","fmt","ms","minutes","turns","_b","obs","el","demoDuration","effectiveTime","progress","demoCurrentTime","jsxs","jsx","RotateCcw","Pause","Play","RotateCw","ChevronDown","speed","Fragment","Timeline","e","rect","clickX","seekTime","speaker","rowIdx","pct","seg","TranscriptCard","card","isActive","isCustomer","AudioLines","PauseCircle","PlayCircle"],"mappings":"8HASA,SAASA,EAAQC,EAAS,CACxB,MAAMC,EAAI,KAAK,MAAMD,EAAU,EAAE,EAC3BE,EAAI,KAAK,MAAMF,EAAU,EAAE,EAC1B,MAAA,GAAGC,CAAC,IAAIC,EAAE,WAAW,SAAS,EAAG,GAAG,CAAC,EAC9C,CAGA,MAAMC,GAAgB,CACpB,MAAO,CACL,CAAE,MAAO,EAAG,IAAK,GAAK,EACtB,CAAE,MAAO,IAAM,IAAK,GAAK,EACzB,CAAE,MAAO,IAAM,IAAK,GAAK,EACzB,CAAE,MAAO,IAAM,IAAK,GAAK,EACzB,CAAE,MAAO,IAAM,IAAK,GAAK,EACzB,CAAE,MAAO,IAAM,IAAK,GAAK,EACzB,CAAE,MAAO,IAAM,IAAK,CAAE,CACxB,EACA,SAAU,CACR,CAAE,MAAO,GAAK,IAAK,GAAK,EACxB,CAAE,MAAO,IAAM,IAAK,GAAK,EACzB,CAAE,MAAO,IAAM,IAAK,GAAK,EACzB,CAAE,MAAO,GAAK,IAAK,GAAK,EACxB,CAAE,MAAO,IAAM,IAAK,EAAK,CAC3B,CACF,EAEMC,EAAkB,CACtB,CAAE,QAAS,QAAS,KAAM,QAAS,KAAM,QAAS,KAAM,6EAA8E,EACtI,CAAE,QAAS,WAAY,KAAM,WAAY,KAAM,QAAS,KAAM,gDAAiD,EAC/G,CAAE,QAAS,QAAS,KAAM,QAAS,KAAM,QAAS,KAAM,qBAAsB,EAC9E,CAAE,QAAS,WAAY,KAAM,WAAY,KAAM,QAAS,KAAM,+aAAgb,EAC9e,CAAE,QAAS,QAAS,KAAM,QAAS,KAAM,QAAS,KAAM,oEAAqE,CAC/H,EAGMC,GAA8BC,EAAAA,WAAW,SAAqC,CAClF,SAAAC,EACA,iBAAAC,EAAmB,CAAC,EACpB,gBAAAC,EAAkB,EAClB,mBAAAC,EAAqB,EACrB,gBAAAC,EAAkB,GAClB,aAAAC,EAAe,EACf,OAAAC,EACA,aAAAC,EACA,WAAAC,EACA,cAAAC,EACA,kBAAAC,EACA,SAAAC,EACA,WAAAC,EACA,iBAAAC,MAAuB,IACvB,gBAAAC,EACA,gBAAAC,EAAkB,EAClB,iBAAAC,EAAmB,CAAC,EACpB,mBAAAC,EACA,gBAAAC,CACF,EAAGC,EAAK,OACA,MAAAC,EAAYC,SAAO,IAAI,EACvB,CAACC,EAAcC,CAAe,EAAIC,WAAS,IAAI,EAC/C,CAACC,EAAUC,CAAW,EAAIF,EAAAA,SAASnB,GAAgB,CAAC,EACpD,CAACsB,EAAaC,CAAc,EAAIJ,WAASpB,CAAe,EACxD,CAACyB,GAAeC,CAAgB,EAAIN,WAAS,EAAK,EAClD,CAACO,EAAeC,CAAgB,EAAIR,WAAST,CAAe,EAG5DkB,EAAoBC,GAAY,CACpC,QAASC,EAAItC,EAAgB,OAAS,EAAGsC,GAAK,EAAGA,IAAK,CACpD,MAAMC,EAAWC,EAAaxC,EAAgBsC,CAAC,EAAE,IAAI,EACrD,GAAID,GAAWE,EAAiB,OAAAD,CAClC,CACO,MAAA,EAAA,EAGHE,EAAgBC,GAAY,CAChC,GAAI,CAACA,EAAgB,MAAA,GACrB,MAAMC,EAAQD,EAAQ,MAAM,GAAG,EAAE,IAAI,MAAM,EAC3C,OAAQC,EAAM,CAAC,GAAK,GAAK,IAAMA,EAAM,CAAC,GAAK,EAAA,EAGvCC,GAAgB,CAAC,EAAG,KAAM,IAAK,CAAC,EAChCC,EAAS,CAACzC,EACV0C,EAAaD,EAAShB,EAAWpB,EACjCsC,GAAgBF,EAASd,EAAcvB,EAG7CwC,EAAA,oBAAoBzB,EAAK,KAAO,CAC9B,OAASe,GAAY,CACnBW,EAAWX,CAAO,EAClBN,EAAe,EAAI,EAEb,MAAAkB,EAAMb,EAAiBC,CAAO,EACpCF,EAAiBc,CAAG,EACpB,WAAW,IAAM,OACT,MAAAC,GAAQC,EAAA5B,EAAU,UAAV,YAAA4B,EAAmB,SAC7BD,GAAA,MAAAA,EAAQD,IACJC,EAAAD,CAAG,EAAE,eAAe,CAAE,SAAU,SAAU,MAAO,UAAW,GAEnE,EAAE,CACP,CACA,EAAA,EAGI,MAAAD,EAAcI,GAAgB,CAC5B,MAAAC,EAAU,KAAK,IAAI,EAAG,KAAK,IAAID,EAAa/C,GAAmB,GAAG,CAAC,EACrEI,GAAQA,EAAO4C,CAAO,EAC1B3B,EAAgB2B,CAAO,EACNlB,EAAAC,EAAiBiB,CAAO,CAAC,CAAA,EAGtCC,GAAmB,IAAM,CACzB5C,EAA2BA,IACXqB,EAACwB,GAAS,CAACA,CAAI,CAAA,EAG/BC,GAAiB,IAAM,CACvB7C,EAAuBA,IACtBqC,EAAW,KAAK,IAAI,GAAIvB,GAAgB,GAAK,EAAE,CAAC,CAAA,EAGjDgC,GAAoB,IAAM,CAC1B7C,EAA6BA,IAG/BoC,EAAW,KAAK,IADA3C,GAAmB,KACLoB,GAAgB,GAAK,EAAE,CAAC,CACxD,EAGIiC,GAAiBC,GAAS,CAC1B9C,GAAmBA,EAAkB8C,CAAI,EAC7C9B,EAAY8B,CAAI,EAChB1B,EAAiB,EAAK,CAAA,EAIlB2B,GAA2BX,GAAQ,OACnC,GAAAf,IAAkBe,GAAOnB,EAC3BC,EAAe,EAAK,MACf,CACL,MAAMQ,EAAWC,GAAaW,EAAAnD,EAAgBiD,CAAG,IAAnB,YAAAE,EAAsB,IAAI,EACxDhB,EAAiBc,CAAG,EACpBlB,EAAe,EAAI,EACnBiB,EAAWT,CAAQ,CACrB,CAAA,EAIIsB,GAAkB,CAACC,EAASC,IAAU,CAC1C,GAAID,GAAW,KAAa,OACtB,MAAAE,EAAOC,GAAO,CAClB,MAAMC,EAAU,KAAK,MAAMD,EAAK,GAAK,EAC/BrE,EAAU,KAAK,MAAOqE,EAAK,IAAS,GAAI,EAC9C,MAAO,GAAGC,EAAQ,SAAS,EAAE,SAAS,EAAG,GAAG,CAAC,IAAItE,EAAQ,SAAS,EAAE,SAAS,EAAG,GAAG,CAAC,EAAA,EAEtF,MAAO,GAAGoE,EAAIF,CAAO,CAAC,IAASC,GAAS,KAAOC,EAAID,CAAK,EAAIC,EAAIF,CAAO,CAAC,EAAA,EAGpEK,GAAQhB,EAAApC,GAAA,YAAAA,EAAY,WAAZ,MAAAoC,EAAsB,OAChCpC,EAAW,SAAS,IAAI,CAAClB,EAAGyC,IAAO,SAAA,OACjC,MAAOzC,EAAE,QAAU,UAAWsD,EAAApC,EAAW,YAAX,YAAAoC,EAAsB,QAAS,UAAYiB,EAAArD,EAAW,YAAX,YAAAqD,EAAsB,WAAY,WAC3G,UAAWvE,EAAE,QAAU,QAAU,QAAU,WAC3C,KAAMA,EAAE,MAAQ,GAChB,UAAWgE,GAAgBhE,EAAE,OAASA,EAAE,SAAUA,EAAE,KAAOA,EAAE,MAAM,EACnE,cAAemB,EAAiB,IAAIsB,CAAC,EACrC,eAAgB/B,GAAmBU,IAAoBqB,EAClDzC,EAAE,QAAU,QAAU,sBAAwB,wBAC/C,OACJ,cAAesB,EAAiBmB,CAAC,GAAK,CAAA,GAAI,IAAK+B,IAAS,CACtD,GAAGA,EACH,QAAS,IAAM,CACQjD,GAAA,MAAAA,EAACmC,GAAS,IAAI,IAAI,CAAC,GAAGA,EAAMc,EAAI,SAAS,CAAC,GAC/D,WAAW,IAAM,CACf,MAAMC,EAAK,SAAS,eAAe,UAAUD,EAAI,SAAS,EAAE,EACxDC,GAAIA,EAAG,eAAe,CAAE,SAAU,SAAU,MAAO,UAAW,GACjE,GAAG,CACR,CAAA,EACA,CAAA,EACF,EACF,KAEEC,EAAelE,GAAmB,IAClCmE,EAAgB/C,IAAuCpB,EAAkB,EAAIC,EAAqB,GAClGmE,EAAWF,EAAe,EAAKC,EAAgBD,EAAgB,IAAM,EACrEG,EAAkB,KAAK,MAAMF,CAAa,EAG9C,OAAAG,EAAA,KAAC,OAAI,MAAO,CACV,QAAS,OACT,QAAS,GACT,cAAe,SACf,WAAY,aACZ,IAAK,GACL,aAAc,EACd,OAAQ,wCACR,WAAY,yBAMZ,EAAA,SAAA,CAACA,EAAAA,KAAA,MAAA,CAAI,MAAO,CAAE,MAAO,OAAQ,QAAS,OAAQ,cAAe,SAAU,IAAK,EAAA,EAG1E,SAAA,CAACA,EAAAA,KAAA,MAAA,CAAI,MAAO,CAAE,QAAS,OAAQ,WAAY,SAAU,eAAgB,gBAAiB,IAAK,EAAA,EACzF,SAAA,CAAAC,MAAC,QAAK,MAAO,CACX,SAAU,GAAI,WAAY,IAC1B,MAAO,8BACP,WAAY,GAAA,EACX,SAEH,YAAA,EAGCD,EAAA,KAAA,MAAA,CAAI,MAAO,CAAE,QAAS,OAAQ,WAAY,SAAU,IAAK,GAAI,KAAM,EAAG,eAAgB,QAErF,EAAA,SAAA,CAAAC,EAAA,IAAC,OAAK,CAAA,MAAO,CAAE,SAAU,GAAI,WAAY,IAAK,MAAO,6BAA8B,WAAY,GAAI,EAAG,SAAE,KAAA,EACxGA,EAAAA,IAAC,SAAO,CAAA,QAASpB,GAAgB,MAAO,CAAE,WAAY,OAAQ,OAAQ,OAAQ,OAAQ,UAAW,QAAS,EAAG,QAAS,OAAQ,WAAY,QAAS,EACjJ,SAACoB,EAAAA,IAAAC,EAAAA,UAAA,CAAU,KAAM,GAAI,MAAM,UAAU,YAAa,GAAA,CAAK,CACzD,CAAA,EAGCD,EAAAA,IAAA,SAAA,CAAO,QAAStB,GAAkB,MAAO,CACxC,WAAY,8BACZ,OAAQ,OAAQ,OAAQ,UACxB,MAAO,GAAI,OAAQ,GAAI,aAAc,GACrC,QAAS,EACT,QAAS,OAAQ,WAAY,SAAU,eAAgB,QACzD,EACG,SACGR,GAAA8B,MAACE,EAAAA,MAAM,CAAA,KAAM,GAAI,MAAM,OAAO,KAAK,MAAO,CAAA,EACzCF,EAAAA,IAAAG,EAAAA,KAAA,CAAK,KAAM,GAAI,MAAM,OAAO,KAAK,OAAO,YAAa,IAAK,MAAO,CAAE,WAAY,CAAE,CAAA,CAAG,CAE3F,CAAA,EAGAH,EAAAA,IAAC,SAAO,CAAA,QAASnB,GAAmB,MAAO,CAAE,WAAY,OAAQ,OAAQ,OAAQ,OAAQ,UAAW,QAAS,EAAG,QAAS,OAAQ,WAAY,QAAS,EACpJ,SAACmB,EAAAA,IAAAI,EAAAA,SAAA,CAAS,KAAM,GAAI,MAAM,UAAU,YAAa,GAAA,CAAK,CACxD,CAAA,EACCJ,EAAA,IAAA,OAAA,CAAK,MAAO,CAAE,SAAU,GAAI,WAAY,IAAK,MAAO,6BAA8B,WAAY,GAAA,EAAO,SAAE,KAAA,CAAA,EAC1G,SAGC,MAAI,CAAA,MAAO,CAAE,SAAU,UACtB,EAAA,SAAA,CAAAD,EAAA,KAAC,SAAA,CACC,QAAS,IAAM1C,EAAkBsB,GAAS,CAACA,CAAI,EAC/C,MAAO,CACL,WAAY,0BACZ,OAAQ,wCACR,aAAc,GACd,QAAS,eACT,OAAQ,GACR,SAAU,GACV,OAAQ,UACR,SAAU,GAAI,WAAY,IAC1B,MAAO,8BACP,WAAY,mBACZ,WAAY,IACZ,QAAS,OAAQ,WAAY,SAAU,eAAgB,SAAU,IAAK,CACxE,EAEC,SAAA,CAAAV,EAAW,IACX+B,EAAA,IAAAK,EAAA,YAAA,CAAY,KAAM,GAAI,MAAM,UAAU,CAAA,CAAA,CACzC,EAECjD,IACE4C,EAAA,IAAA,MAAA,CAAI,MAAO,CACV,SAAU,WACV,IAAK,OACL,MAAO,EACP,UAAW,EACX,WAAY,0BACZ,OAAQ,wCACR,aAAc,EACd,UAAW,6BACX,OAAQ,GACR,SAAU,SACV,SAAU,EAET,EAAA,SAAAjC,GAAc,IAAKuC,GAClBP,EAAA,KAAC,SAAA,CAEC,QAAS,IAAMjB,GAAcwB,CAAK,EAClC,MAAO,CACL,QAAS,QACT,MAAO,OACP,QAAS,WACT,OAAQ,OACR,WAAYrC,IAAeqC,EAAQ,gCAAkC,0BACrE,OAAQ,UACR,SAAU,GACV,WAAYrC,IAAeqC,EAAQ,IAAM,IACzC,MAAO,8BACP,WAAY,mBACZ,UAAW,MACb,EAEC,SAAA,CAAAA,EAAM,GAAA,CAAA,EAhBFA,CAkBR,CAAA,EACH,CAAA,EAEJ,CAAA,EACF,EAGC/E,EAEGwE,EAAA,KAAAQ,WAAA,CAAA,SAAA,CAAAP,EAAA,IAACQ,EAAA,SAAA,CACC,SAAUhF,EACV,gBAAAC,EACA,mBAAAC,EACA,OAAAG,EACA,aAAc,GACd,aAAY,GACZ,gBAAAF,EACA,aAAAC,CAAA,CACF,QACC,QAAM,CAAA,IAAKM,EAAU,QAAQ,OAAO,MAAO,CAAE,QAAS,QACrD,SAAC8D,EAAAA,IAAA,SAAA,CAAO,IAAKzE,EAAU,KAAK,YAAa,CAAA,EAC3C,CACF,CAAA,CAAA,EAECwE,EAAA,KAAA,MAAA,CAAI,MAAO,CAAE,QAAS,OAAQ,cAAe,SAAU,IAAK,EAAA,EAE3D,SAAA,CAACA,EAAAA,KAAA,MAAA,CAAI,MAAO,CAAE,QAAS,OAAQ,WAAY,SAAU,IAAK,CAAA,EACxD,SAAA,CAAAC,MAAC,QAAK,MAAO,CACX,SAAU,GAAI,WAAY,IAC1B,MAAOH,EAAW,EAAI,gCAAkC,8BACxD,WAAY,mBACZ,WAAY,IACZ,SAAU,EACZ,EACG,SAAQ9E,EAAA+E,CAAe,EAC1B,EACAC,EAAA,KAAC,MAAA,CACC,QAAUU,GAAM,CACR,MAAAC,EAAOD,EAAE,cAAc,sBAAsB,EAC7CE,EAASF,EAAE,QAAUC,EAAK,KAE1BE,EADM,KAAK,IAAI,EAAG,KAAK,IAAI,EAAGD,EAASD,EAAK,KAAK,CAAC,EACjCf,EACvBvB,EAAWwC,CAAQ,CACrB,EACA,MAAO,CACL,KAAM,EAAG,OAAQ,GACjB,SAAU,WACV,QAAS,OAAQ,WAAY,SAC7B,OAAQ,SACV,EAGA,SAAA,CAAAZ,MAAC,OAAI,MAAO,CACV,SAAU,WAAY,KAAM,EAAG,MAAO,EACtC,OAAQ,EAAG,aAAc,EACzB,WAAY,iCACZ,cAAe,MAAA,EACd,EAEHA,MAAC,OAAI,MAAO,CACV,SAAU,WAAY,KAAM,EAAG,IAAK,MACpC,UAAW,mBACX,MAAO,GAAGH,CAAQ,IAClB,OAAQ,EAAG,aAAc,EACzB,WAAY,gCACZ,cAAe,MAAA,EACd,EAEHG,EAAA,IAAC,MAAA,CACC,MAAM,KAAK,OAAO,KAAK,QAAQ,YAAY,KAAK,OAChD,MAAM,6BACN,MAAO,CACL,SAAU,WACV,KAAM,GAAGH,CAAQ,IACjB,IAAK,MACL,UAAW,wBACX,cAAe,MACjB,EAEA,SAAAG,EAAA,IAAC,OAAA,CACC,EAAE,iIACF,KAAK,OACL,OAAO,UACP,YAAY,GAAA,CACd,CAAA,CACF,CAAA,CAAA,CACF,CAAA,EACF,EAGAD,EAAAA,KAAC,MAAI,CAAA,MAAO,CAAE,SAAU,WAAY,cAAe,GAAI,OAAQ,SAAA,EAC5D,SAAA,CAAC,CAAA,QAAS,UAAU,EAAE,IAAI,CAACc,EAASC,IAClCf,EAAA,KAAA,MAAA,CAAkB,MAAO,CACxB,QAAS,OAAQ,WAAY,SAAU,IAAK,EAC5C,OAAQ,GACR,aAAce,IAAW,EAAI,EAAI,CAEjC,EAAA,SAAA,CAAAd,MAAC,QAAK,MAAO,CACX,SAAU,GAAI,WAAY,IAC1B,MAAO,6BACP,WAAY,mBACZ,WAAY,IACZ,SAAU,EAAA,EAET,SACHa,EAAA,EACAd,EAAA,KAAC,MAAA,CACC,QAAUU,GAAM,CACR,MAAAC,EAAOD,EAAE,cAAc,sBAAsB,EAC7CM,EAAM,KAAK,IAAI,EAAG,KAAK,IAAI,GAAIN,EAAE,QAAUC,EAAK,MAAQA,EAAK,KAAK,CAAC,EACzEtC,EAAW2C,EAAMpB,CAAY,CAC/B,EACA,MAAO,CACL,KAAM,EAAG,OAAQ,EACjB,SAAU,WAAY,aAAc,EACpC,OAAQ,SACV,EAGA,SAAA,CAAAK,MAAC,OAAI,MAAO,CACV,SAAU,WAAY,KAAM,EAAG,MAAO,EACtC,IAAK,MAAO,UAAW,mBACvB,OAAQ,EAAG,aAAc,EACzB,WAAY,gCAAA,EACX,EAEF7E,GAAc0F,CAAO,EAAE,IAAI,CAACG,EAAKtD,IAC/BsC,EAAA,IAAA,MAAA,CAAY,MAAO,CAClB,SAAU,WACV,KAAM,GAAGgB,EAAI,MAAQ,GAAG,IACxB,MAAO,IAAIA,EAAI,IAAMA,EAAI,OAAS,GAAG,IACrC,IAAK,EAAG,OAAQ,EAAG,aAAc,EACjC,WAAYH,IAAY,QACpB,8BACA,4BAAA,CACN,EARUnD,CAQP,CACJ,CAAA,CAAA,CACH,CAAA,CAAA,EA7CQmD,CA8CV,CACD,EAGDd,OAAC,OAAI,MAAO,CACV,SAAU,WACV,KAAM,GACN,MAAO,EACP,IAAK,EACL,OAAQ,EACR,cAAe,MAGf,EAAA,SAAA,CAAAC,MAAC,OAAI,MAAO,CACV,SAAU,WACV,KAAM,GAAGH,CAAQ,IACjB,IAAK,EACL,OAAQ,GACR,UAAW,mBACX,WAAY,0CACZ,QAAS,EAAA,EACR,EAGHG,MAAC,OAAI,MAAO,CACV,SAAU,WACV,KAAM,GAAGH,CAAQ,IACjB,OAAQ,EACR,UAAW,mBACX,WAAY,8BACZ,MAAO,0BACP,SAAU,GAAI,WAAY,IAC1B,WAAY,IACZ,QAAS,UACT,aAAc,EACd,WAAY,QACd,EACG,SAAQ9E,EAAA+E,CAAe,EAC1B,CAAA,EACF,CAAA,EACF,CAAA,EACF,CAAA,EAEJ,EAMAC,OAAC,OAAI,MAAO,CACV,MAAO,OACP,QAAS,OAAQ,cAAe,SAAU,IAAK,EAG/C,EAAA,SAAA,CAAAC,MAAC,OAAI,MAAO,CACV,aAAc,wCACd,cAAe,EACjB,EACE,SAACA,EAAAA,IAAA,OAAA,CAAK,MAAO,CACX,SAAU,GAAI,WAAY,IAC1B,MAAO,8BACP,WAAY,GAAA,EACX,qBAEH,CAAA,EACF,EAGCT,EACCS,EAAA,IAAC,MAAI,CAAA,GAAG,uBAAuB,IAAKrD,EAAW,MAAO,CAAE,UAAW,IAAK,UAAW,QACjF,SAAAqD,EAAA,IAACiB,EAAA,eAAA,CACC,MAAA1B,EACA,SAAAhE,EACA,gBAAAc,EACA,qBAAsBV,EACtB,kBAAmBA,EACnB,gBAAAc,CAAA,CAAA,CAEJ,CAAA,EAEAuD,EAAAA,IAAC,MAAI,CAAA,IAAKrD,EAAW,MAAO,CAC1B,QAAS,OAAQ,cAAe,SAChC,UAAW,IAAK,UAAW,MAE1B,EAAA,SAAAvB,EAAgB,IAAI,CAAC8F,EAAMxD,IAAM,CAC1B,MAAAyD,EAAWzD,IAAMJ,GAAiBJ,EAClCkE,EAAaF,EAAK,OAAS,WAG/B,OAAAnB,EAAA,KAAC,OAAY,MAAO,CAClB,QAAS,OACT,QAAS,GACT,cAAe,SACf,WAAY,aACZ,IAAK,GACL,UAAW,UACX,UAAWrC,EAAI,EAAI,wCAA0C,OAC7D,WAAYyD,EAAW,gCAAkC,yBAGzD,EAAA,SAAA,CAAApB,OAAC,OAAI,MAAO,CACV,QAAS,OAAQ,WAAY,SAC7B,eAAgB,gBAAiB,MAAO,OACxC,IAAK,CAEL,EAAA,SAAA,CAAAC,MAAC,QAAK,MAAO,CACX,SAAU,GAAI,WAAY,IAC1B,WAAY,IACZ,MAAOoB,EAAa,8BAAgC,4BAAA,EAEnD,WAAK,QACR,EACArB,EAAAA,KAAC,MAAI,CAAA,MAAO,CAAE,QAAS,OAAQ,WAAY,SAAU,IAAK,CAAA,EACvD,SAAA,CAAAoB,GAEGpB,EAAA,KAAAQ,WAAA,CAAA,SAAA,CAAAP,EAAA,IAACqB,EAAW,WAAA,CAAA,KAAM,GAAI,MAAM,UAAU,EACrCrB,EAAA,IAAAqB,EAAA,WAAA,CAAW,KAAM,GAAI,MAAM,UAAU,CAAA,EACxC,EAEFrB,MAAC,QAAK,MAAO,CACX,SAAU,GAAI,WAAY,IAC1B,WAAY,IACZ,MAAO,4BAAA,EAEN,WAAK,KACR,CAAA,EACF,CAAA,EACF,EAGCD,EAAAA,KAAA,MAAA,CAAI,MAAO,CAAE,QAAS,OAAQ,WAAY,aAAc,IAAK,EAAG,MAAO,MAAA,EACtE,SAAA,CAAAC,EAAA,IAAC,SAAA,CACC,QAAS,IAAMhB,GAAwBtB,CAAC,EACxC,MAAO,CACL,WAAY,OAAQ,OAAQ,OAC5B,OAAQ,UAAW,QAAS,EAC5B,WAAY,EACZ,QAAS,MACX,EAEC,WACEsC,EAAA,IAAAsB,cAAA,CAAY,KAAM,GAAI,MAAM,UAAU,YAAa,GAAK,CAAA,QAExDC,aAAW,CAAA,KAAM,GAAI,MAAM,UAAU,YAAa,EAAG,CAAA,CAE1D,EACAvB,MAAC,KAAE,MAAO,CACR,SAAU,GAAI,WAAY,IAC1B,MAAO,8BACP,WAAY,IACZ,OAAQ,EACR,KAAM,CAAA,EAEL,WAAK,KACR,CAAA,EACF,CAAA,CAAA,EAlEQtC,CAmEV,CAEH,CAAA,EACH,CAAA,EAEJ,CACF,CAAA,CAAA,CAEJ,CAAC"}