npm - @workflow/web-shared - Versions diffs - 5.0.0-beta.2 → 5.0.0-beta.4 - Mend

@workflow/web-shared 5.0.0-beta.2 → 5.0.0-beta.4

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (161) hide show

package/dist/components/new-trace-viewer/detail-panel.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"detail-panel.js","sourceRoot":"","sources":["../../../src/components/new-trace-viewer/detail-panel.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;;AAEb,OAAO,EAAE,CAAC,EAAE,MAAM,cAAc,CAAC;AAGjC,OAAO,EAAE,cAAc,EAAE,cAAc,EAAE,MAAM,6BAA6B,CAAC;AAC7E,OAAO,EAAE,iBAAiB,EAAE,MAAM,SAAS,CAAC;AAQ5C,MAAM,UAAU,WAAW,CAAC,EAC1B,IAAI,EACJ,SAAS,EACT,OAAO,GACU;IACjB,MAAM,OAAO,GAAG,cAAc,CAAC,IAAI,CAAC,SAAS,CAAC,CAAC;IAC/C,MAAM,UAAU,GAAG,iBAAiB,CAAC,IAAI,CAAC,CAAC;IAC3C,MAAM,QAAQ,GAAG,OAAO,GAAG,SAAS,CAAC;IAErC,OAAO,CACL,iBAAO,SAAS,EAAC,iEAAiE,aAChF,eAAK,SAAS,EAAC,uEAAuE,aACpF,eAAM,SAAS,EAAC,6CAA6C,YAC1D,IAAI,CAAC,IAAI,GACL,EACP,iBACE,IAAI,EAAC,QAAQ,EACb,SAAS,EAAC,6FAA6F,EACvG,OAAO,EAAE,OAAO,YAEhB,KAAC,CAAC,IAAC,SAAS,EAAC,SAAS,GAAG,GAClB,IACL,EACN,cAAK,SAAS,EAAC,+BAA+B,YAC5C,cAAI,SAAS,EAAC,qDAAqD,aACjE,aAAI,SAAS,EAAC,eAAe,yBAAc,EAC3C,aAAI,SAAS,EAAC,0BAA0B,YAAE,IAAI,CAAC,QAAQ,GAAM,EAC7D,aAAI,SAAS,EAAC,eAAe,yBAAc,EAC3C,aAAI,SAAS,EAAC,uCAAuC,YAClD,cAAc,CAAC,UAAU,CAAC,GACxB,EACL,aAAI,SAAS,EAAC,eAAe,uBAAY,EACzC,cAAI,SAAS,EAAC,uCAAuC,kBACjD,cAAc,CAAC,QAAQ,CAAC,IACvB,EACL,aAAI,SAAS,EAAC,eAAe,uBAAY,EACzC,aAAI,SAAS,EAAC,0BAA0B,YACrC,IAAI,CAAC,MAAM,CAAC,IAAI,KAAK,CAAC,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,IAAI,GACrC,IACF,GACD,IACA,CACT,CAAC;AACJ,CAAC","sourcesContent":["'use client';\n\nimport { X } from 'lucide-react';\nimport type { ReactNode } from 'react';\nimport type { Span } from '../trace-viewer/types';\nimport { formatDuration, getHighResInMs } from '../trace-viewer/util/timing';\nimport { getSpanDurationMs } from './utils';\n\ninterface DetailPanelProps {\n span: Span;\n rootStart: number;\n onClose: () => void;\n}\n\nexport function DetailPanel({\n span,\n rootStart,\n onClose,\n}: DetailPanelProps): ReactNode {\n const startMs = getHighResInMs(span.startTime);\n const durationMs = getSpanDurationMs(span);\n const offsetMs = startMs - rootStart;\n\n return (\n <aside className=\"grid h-full max-h-full grid-rows-[2.5rem_1fr] bg-background-200\">\n <div className=\"flex items-center justify-between px-3 border-b border-gray-alpha-400\">\n <span className=\"text-sm font-medium text-gray-1000 truncate\">\n {span.name}\n </span>\n <button\n type=\"button\"\n className=\"p-1 rounded-md text-gray-900 hover:text-gray-1000 hover:bg-gray-alpha-200 transition-colors\"\n onClick={onClose}\n >\n <X className=\"w-4 h-4\" />\n </button>\n </div>\n <div className=\"overflow-y-auto p-3 space-y-3\">\n <dl className=\"grid grid-cols-[auto_1fr] gap-x-3 gap-y-1.5 text-sm\">\n <dt className=\"text-gray-900\">Resource</dt>\n <dd className=\"text-gray-1000 font-mono\">{span.resource}</dd>\n <dt className=\"text-gray-900\">Duration</dt>\n <dd className=\"text-gray-1000 tabular-nums font-mono\">\n {formatDuration(durationMs)}\n </dd>\n <dt className=\"text-gray-900\">Offset</dt>\n <dd className=\"text-gray-1000 tabular-nums font-mono\">\n +{formatDuration(offsetMs)}\n </dd>\n <dt className=\"text-gray-900\">Status</dt>\n <dd className=\"text-gray-1000 font-mono\">\n {span.status.code === 2 ? 'Error' : 'OK'}\n </dd>\n </dl>\n </div>\n </aside>\n );\n}\n"]}

package/dist/components/new-trace-viewer/icons.d.ts ADDED Viewed

@@ -0,0 +1,6 @@
+declare const WorkflowIcon: () => import("react/jsx-runtime").JSX.Element;
+declare const WebhookIcon: () => import("react/jsx-runtime").JSX.Element;
+declare const SleepIcon: () => import("react/jsx-runtime").JSX.Element;
+declare const StepForwardIcon: () => import("react/jsx-runtime").JSX.Element;
+export { WorkflowIcon, WebhookIcon, SleepIcon, StepForwardIcon };
+//# sourceMappingURL=icons.d.ts.map

package/dist/components/new-trace-viewer/icons.d.ts.map ADDED Viewed

	@@ -0,0 +1 @@
1	+ {"version":3,"file":"icons.d.ts","sourceRoot":"","sources":["../../../src/components/new-trace-viewer/icons.tsx"],"names":[],"mappings":"AAAA,QAAA,MAAM,YAAY,+CAgBjB,CAAC;AAEF,QAAA,MAAM,WAAW,+CAkBhB,CAAC;AAEF,QAAA,MAAM,SAAS,+CAkBd,CAAC;AAEF,QAAA,MAAM,eAAe,+CAkBpB,CAAC;AAEF,OAAO,EAAE,YAAY,EAAE,WAAW,EAAE,SAAS,EAAE,eAAe,EAAE,CAAC"}

package/dist/components/new-trace-viewer/icons.js ADDED Viewed

@@ -0,0 +1,15 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+const WorkflowIcon = () => {
+    return (_jsx("svg", { "data-testid": "geist-icon", height: "16", "stroke-linejoin": "round", style: { color: 'currentColor' }, viewBox: "0 0 16 16", width: "16", children: _jsx("path", { d: "M5.75 7L6.4209 7.33594L4.85254 10.4717C5.38789 10.771 5.75 11.3431 5.75 12V14C5.75 14.9665 4.96648 15.75 4 15.75H2C1.03352 15.75 0.25 14.9665 0.25 14V12C0.25 11.0335 1.03352 10.25 2 10.25H3.28711L5.0791 6.66504L5.75 7ZM14 10.25C14.9665 10.25 15.75 11.0335 15.75 12V14C15.75 14.9665 14.9665 15.75 14 15.75H12C11.1185 15.75 10.3909 15.098 10.2695 14.25H7V12.75H10.25V12C10.25 11.0335 11.0335 10.25 12 10.25H14ZM2 11.75C1.86192 11.75 1.75 11.8619 1.75 12V14C1.75 14.1381 1.86192 14.25 2 14.25H4C4.13808 14.25 4.25 14.1381 4.25 14V12C4.25 11.8619 4.13808 11.75 4 11.75H2ZM12 11.75C11.8619 11.75 11.75 11.8619 11.75 12V14C11.75 14.1381 11.8619 14.25 12 14.25H14C14.1381 14.25 14.25 14.1381 14.25 14V12C14.25 11.8619 14.1381 11.75 14 11.75H12ZM9 0.25C9.96649 0.25 10.75 1.03351 10.75 2V4C10.75 4.44642 10.5808 4.85197 10.3057 5.16113L12.2041 8.6416L10.8877 9.36035L8.91895 5.75H7C6.03351 5.75 5.25 4.96649 5.25 4V2C5.25 1.03351 6.03351 0.25 7 0.25H9ZM7 1.75C6.86193 1.75 6.75 1.86193 6.75 2V4C6.75 4.13807 6.86193 4.25 7 4.25H9C9.13807 4.25 9.25 4.13807 9.25 4V2C9.25 1.86193 9.13807 1.75 9 1.75H7Z", fill: "currentColor" }) }));
+};
+const WebhookIcon = () => {
+    return (_jsx("svg", { "data-testid": "geist-icon", height: "16", "stroke-linejoin": "round", viewBox: "0 0 16 16", width: "16", style: { color: 'currentColor' }, children: _jsx("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M5.8349 3.24994C5.14454 4.44567 5.55423 5.97464 6.74996 6.665L7.39465 7.03721L7.02726 7.68466L5.14599 11C5.21289 11.1531 5.25 11.3222 5.25 11.5C5.25 12.1904 4.69036 12.75 4 12.75C3.30964 12.75 2.75 12.1904 2.75 11.5C2.75 10.8634 3.22584 10.338 3.84123 10.26L5.38944 7.5316C3.95909 6.30274 3.55857 4.19264 4.53586 2.49994C5.64043 0.586765 8.08679 -0.0687357 9.99996 1.03583C11.836 2.09584 12.5137 4.39156 11.5892 6.26591L10.4949 4.33754C10.4418 3.53274 10.0009 2.76843 9.24996 2.33487C8.05423 1.64452 6.52525 2.0542 5.8349 3.24994ZM9.146 4.99996C9.21289 4.84686 9.25 4.67776 9.25 4.5C9.25 3.80964 8.69036 3.25 8 3.25C7.30964 3.25 6.75 3.80964 6.75 4.5C6.75 5.13659 7.22586 5.66203 7.84127 5.74002L9.72266 9.05556L10.0956 9.71274L10.75 9.33493C11.9457 8.64458 13.4747 9.05427 14.165 10.25C14.8554 11.4457 14.4457 12.9747 13.25 13.6651C12.5047 14.0953 11.63 14.0983 10.9096 13.75H8.69252C9.85895 15.4685 12.1727 16.0191 14 14.9641C15.9131 13.8595 16.5686 11.4132 15.4641 9.5C14.4886 7.81038 12.4665 7.10169 10.6895 7.71998L9.146 4.99996ZM13.25 11.5C13.25 12.1904 12.6904 12.75 12 12.75C11.591 12.75 11.228 12.5536 10.9999 12.25H7.9298C7.57875 14.1006 5.95279 15.5 4 15.5C1.79086 15.5 0 13.7091 0 11.5C0 9.40018 1.61801 7.67826 3.67529 7.51299L2.58098 9.44147C1.92792 9.89251 1.5 10.6463 1.5 11.5C1.5 12.8807 2.61929 14 4 14C5.38071 14 6.5 12.8807 6.5 11.5V10.75H7.25H10.9999C11.228 10.4464 11.591 10.25 12 10.25C12.6904 10.25 13.25 10.8096 13.25 11.5Z", fill: "currentColor" }) }));
+};
+const SleepIcon = () => {
+    return (_jsx("svg", { "data-testid": "geist-icon", height: "16", strokeLinejoin: "round", viewBox: "0 0 16 16", width: "16", style: { color: 'currentColor' }, children: _jsx("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M7.25 1.25V2.03971C5.87928 2.18571 4.62678 2.72736 3.6089 3.54824L3.03033 2.96967L2.5 2.43934L1.43934 3.5L1.96967 4.03033L2.54824 4.6089C1.57979 5.80976 1 7.33717 1 9C1 12.866 4.13401 16 8 16C11.866 16 15 12.866 15 9C15 7.33717 14.4202 5.80976 13.4518 4.6089L14.0303 4.03033L14.5607 3.5L13.5 2.43934L12.9697 2.96967L12.3911 3.54824C11.3732 2.72736 10.1207 2.18571 8.75 2.03971V1.25H9.25H10V-0.25H9.25H8.75H7.25H6.75H6V1.25H6.75H7.25ZM2.5 9C2.5 5.96243 4.96243 3.5 8 3.5C11.0376 3.5 13.5 5.96243 13.5 9C13.5 12.0376 11.0376 14.5 8 14.5C4.96243 14.5 2.5 12.0376 2.5 9ZM8.75 6.75V6H7.25V6.75V9V9.75H8.75V9V6.75Z", fill: "currentColor" }) }));
+};
+const StepForwardIcon = () => {
+    return (_jsx("svg", { "data-testid": "geist-icon", height: "16", strokeLinejoin: "round", viewBox: "0 0 16 16", width: "16", style: { color: 'currentColor' }, children: _jsx("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M4.21969 12.5303L4.75002 13.0607L5.81068 12L5.28035 11.4697L1.81068 7.99999L5.28035 4.53032L5.81068 3.99999L4.75002 2.93933L4.21969 3.46966L0.39647 7.29289C0.00594562 7.68341 0.00594562 8.31658 0.39647 8.7071L4.21969 12.5303ZM11.7804 12.5303L11.25 13.0607L10.1894 12L10.7197 11.4697L14.1894 7.99999L10.7197 4.53032L10.1894 3.99999L11.25 2.93933L11.7804 3.46966L15.6036 7.29289C15.9941 7.68341 15.9941 8.31658 15.6036 8.7071L11.7804 12.5303Z", fill: "currentColor" }) }));
+};
+export { WorkflowIcon, WebhookIcon, SleepIcon, StepForwardIcon };
+//# sourceMappingURL=icons.js.map

package/dist/components/new-trace-viewer/icons.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"icons.js","sourceRoot":"","sources":["../../../src/components/new-trace-viewer/icons.tsx"],"names":[],"mappings":";AAAA,MAAM,YAAY,GAAG,GAAG,EAAE;IACxB,OAAO,CACL,6BACc,YAAY,EACxB,MAAM,EAAC,IAAI,qBACK,OAAO,EACvB,KAAK,EAAE,EAAE,KAAK,EAAE,cAAc,EAAE,EAChC,OAAO,EAAC,WAAW,EACnB,KAAK,EAAC,IAAI,YAEV,eACE,CAAC,EAAC,skCAAskC,EACxkC,IAAI,EAAC,cAAc,GACb,GACJ,CACP,CAAC;AACJ,CAAC,CAAC;AAEF,MAAM,WAAW,GAAG,GAAG,EAAE;IACvB,OAAO,CACL,6BACc,YAAY,EACxB,MAAM,EAAC,IAAI,qBACK,OAAO,EACvB,OAAO,EAAC,WAAW,EACnB,KAAK,EAAC,IAAI,EACV,KAAK,EAAE,EAAE,KAAK,EAAE,cAAc,EAAE,YAEhC,eACE,QAAQ,EAAC,SAAS,EAClB,QAAQ,EAAC,SAAS,EAClB,CAAC,EAAC,06CAA06C,EAC56C,IAAI,EAAC,cAAc,GACb,GACJ,CACP,CAAC;AACJ,CAAC,CAAC;AAEF,MAAM,SAAS,GAAG,GAAG,EAAE;IACrB,OAAO,CACL,6BACc,YAAY,EACxB,MAAM,EAAC,IAAI,EACX,cAAc,EAAC,OAAO,EACtB,OAAO,EAAC,WAAW,EACnB,KAAK,EAAC,IAAI,EACV,KAAK,EAAE,EAAE,KAAK,EAAE,cAAc,EAAE,YAEhC,eACE,QAAQ,EAAC,SAAS,EAClB,QAAQ,EAAC,SAAS,EAClB,CAAC,EAAC,kmBAAkmB,EACpmB,IAAI,EAAC,cAAc,GACb,GACJ,CACP,CAAC;AACJ,CAAC,CAAC;AAEF,MAAM,eAAe,GAAG,GAAG,EAAE;IAC3B,OAAO,CACL,6BACc,YAAY,EACxB,MAAM,EAAC,IAAI,EACX,cAAc,EAAC,OAAO,EACtB,OAAO,EAAC,WAAW,EACnB,KAAK,EAAC,IAAI,EACV,KAAK,EAAE,EAAE,KAAK,EAAE,cAAc,EAAE,YAEhC,eACE,QAAQ,EAAC,SAAS,EAClB,QAAQ,EAAC,SAAS,EAClB,CAAC,EAAC,0bAA0b,EAC5b,IAAI,EAAC,cAAc,GACb,GACJ,CACP,CAAC;AACJ,CAAC,CAAC;AAEF,OAAO,EAAE,YAAY,EAAE,WAAW,EAAE,SAAS,EAAE,eAAe,EAAE,CAAC","sourcesContent":["const WorkflowIcon = () => {\n return (\n <svg\n data-testid=\"geist-icon\"\n height=\"16\"\n stroke-linejoin=\"round\"\n style={{ color: 'currentColor' }}\n viewBox=\"0 0 16 16\"\n width=\"16\"\n >\n <path\n d=\"M5.75 7L6.4209 7.33594L4.85254 10.4717C5.38789 10.771 5.75 11.3431 5.75 12V14C5.75 14.9665 4.96648 15.75 4 15.75H2C1.03352 15.75 0.25 14.9665 0.25 14V12C0.25 11.0335 1.03352 10.25 2 10.25H3.28711L5.0791 6.66504L5.75 7ZM14 10.25C14.9665 10.25 15.75 11.0335 15.75 12V14C15.75 14.9665 14.9665 15.75 14 15.75H12C11.1185 15.75 10.3909 15.098 10.2695 14.25H7V12.75H10.25V12C10.25 11.0335 11.0335 10.25 12 10.25H14ZM2 11.75C1.86192 11.75 1.75 11.8619 1.75 12V14C1.75 14.1381 1.86192 14.25 2 14.25H4C4.13808 14.25 4.25 14.1381 4.25 14V12C4.25 11.8619 4.13808 11.75 4 11.75H2ZM12 11.75C11.8619 11.75 11.75 11.8619 11.75 12V14C11.75 14.1381 11.8619 14.25 12 14.25H14C14.1381 14.25 14.25 14.1381 14.25 14V12C14.25 11.8619 14.1381 11.75 14 11.75H12ZM9 0.25C9.96649 0.25 10.75 1.03351 10.75 2V4C10.75 4.44642 10.5808 4.85197 10.3057 5.16113L12.2041 8.6416L10.8877 9.36035L8.91895 5.75H7C6.03351 5.75 5.25 4.96649 5.25 4V2C5.25 1.03351 6.03351 0.25 7 0.25H9ZM7 1.75C6.86193 1.75 6.75 1.86193 6.75 2V4C6.75 4.13807 6.86193 4.25 7 4.25H9C9.13807 4.25 9.25 4.13807 9.25 4V2C9.25 1.86193 9.13807 1.75 9 1.75H7Z\"\n fill=\"currentColor\"\n ></path>\n </svg>\n );\n};\n\nconst WebhookIcon = () => {\n return (\n <svg\n data-testid=\"geist-icon\"\n height=\"16\"\n stroke-linejoin=\"round\"\n viewBox=\"0 0 16 16\"\n width=\"16\"\n style={{ color: 'currentColor' }}\n >\n <path\n fillRule=\"evenodd\"\n clipRule=\"evenodd\"\n d=\"M5.8349 3.24994C5.14454 4.44567 5.55423 5.97464 6.74996 6.665L7.39465 7.03721L7.02726 7.68466L5.14599 11C5.21289 11.1531 5.25 11.3222 5.25 11.5C5.25 12.1904 4.69036 12.75 4 12.75C3.30964 12.75 2.75 12.1904 2.75 11.5C2.75 10.8634 3.22584 10.338 3.84123 10.26L5.38944 7.5316C3.95909 6.30274 3.55857 4.19264 4.53586 2.49994C5.64043 0.586765 8.08679 -0.0687357 9.99996 1.03583C11.836 2.09584 12.5137 4.39156 11.5892 6.26591L10.4949 4.33754C10.4418 3.53274 10.0009 2.76843 9.24996 2.33487C8.05423 1.64452 6.52525 2.0542 5.8349 3.24994ZM9.146 4.99996C9.21289 4.84686 9.25 4.67776 9.25 4.5C9.25 3.80964 8.69036 3.25 8 3.25C7.30964 3.25 6.75 3.80964 6.75 4.5C6.75 5.13659 7.22586 5.66203 7.84127 5.74002L9.72266 9.05556L10.0956 9.71274L10.75 9.33493C11.9457 8.64458 13.4747 9.05427 14.165 10.25C14.8554 11.4457 14.4457 12.9747 13.25 13.6651C12.5047 14.0953 11.63 14.0983 10.9096 13.75H8.69252C9.85895 15.4685 12.1727 16.0191 14 14.9641C15.9131 13.8595 16.5686 11.4132 15.4641 9.5C14.4886 7.81038 12.4665 7.10169 10.6895 7.71998L9.146 4.99996ZM13.25 11.5C13.25 12.1904 12.6904 12.75 12 12.75C11.591 12.75 11.228 12.5536 10.9999 12.25H7.9298C7.57875 14.1006 5.95279 15.5 4 15.5C1.79086 15.5 0 13.7091 0 11.5C0 9.40018 1.61801 7.67826 3.67529 7.51299L2.58098 9.44147C1.92792 9.89251 1.5 10.6463 1.5 11.5C1.5 12.8807 2.61929 14 4 14C5.38071 14 6.5 12.8807 6.5 11.5V10.75H7.25H10.9999C11.228 10.4464 11.591 10.25 12 10.25C12.6904 10.25 13.25 10.8096 13.25 11.5Z\"\n fill=\"currentColor\"\n ></path>\n </svg>\n );\n};\n\nconst SleepIcon = () => {\n return (\n <svg\n data-testid=\"geist-icon\"\n height=\"16\"\n strokeLinejoin=\"round\"\n viewBox=\"0 0 16 16\"\n width=\"16\"\n style={{ color: 'currentColor' }}\n >\n <path\n fillRule=\"evenodd\"\n clipRule=\"evenodd\"\n d=\"M7.25 1.25V2.03971C5.87928 2.18571 4.62678 2.72736 3.6089 3.54824L3.03033 2.96967L2.5 2.43934L1.43934 3.5L1.96967 4.03033L2.54824 4.6089C1.57979 5.80976 1 7.33717 1 9C1 12.866 4.13401 16 8 16C11.866 16 15 12.866 15 9C15 7.33717 14.4202 5.80976 13.4518 4.6089L14.0303 4.03033L14.5607 3.5L13.5 2.43934L12.9697 2.96967L12.3911 3.54824C11.3732 2.72736 10.1207 2.18571 8.75 2.03971V1.25H9.25H10V-0.25H9.25H8.75H7.25H6.75H6V1.25H6.75H7.25ZM2.5 9C2.5 5.96243 4.96243 3.5 8 3.5C11.0376 3.5 13.5 5.96243 13.5 9C13.5 12.0376 11.0376 14.5 8 14.5C4.96243 14.5 2.5 12.0376 2.5 9ZM8.75 6.75V6H7.25V6.75V9V9.75H8.75V9V6.75Z\"\n fill=\"currentColor\"\n ></path>\n </svg>\n );\n};\n\nconst StepForwardIcon = () => {\n return (\n <svg\n data-testid=\"geist-icon\"\n height=\"16\"\n strokeLinejoin=\"round\"\n viewBox=\"0 0 16 16\"\n width=\"16\"\n style={{ color: 'currentColor' }}\n >\n <path\n fillRule=\"evenodd\"\n clipRule=\"evenodd\"\n d=\"M4.21969 12.5303L4.75002 13.0607L5.81068 12L5.28035 11.4697L1.81068 7.99999L5.28035 4.53032L5.81068 3.99999L4.75002 2.93933L4.21969 3.46966L0.39647 7.29289C0.00594562 7.68341 0.00594562 8.31658 0.39647 8.7071L4.21969 12.5303ZM11.7804 12.5303L11.25 13.0607L10.1894 12L10.7197 11.4697L14.1894 7.99999L10.7197 4.53032L10.1894 3.99999L11.25 2.93933L11.7804 3.46966L15.6036 7.29289C15.9941 7.68341 15.9941 8.31658 15.6036 8.7071L11.7804 12.5303Z\"\n fill=\"currentColor\"\n ></path>\n </svg>\n );\n};\n\nexport { WorkflowIcon, WebhookIcon, SleepIcon, StepForwardIcon };\n"]}

package/dist/components/new-trace-viewer/trace-viewer.d.ts ADDED Viewed

@@ -0,0 +1,8 @@
+import { type ReactNode } from 'react';
+import type { Trace } from '../trace-viewer/types';
+interface NewTraceViewerProps {
+    trace: Trace;
+}
+export declare function NewTraceViewer({ trace }: NewTraceViewerProps): ReactNode;
+export {};
+//# sourceMappingURL=trace-viewer.d.ts.map

package/dist/components/new-trace-viewer/trace-viewer.d.ts.map ADDED Viewed

	@@ -0,0 +1 @@
1	+ {"version":3,"file":"trace-viewer.d.ts","sourceRoot":"","sources":["../../../src/components/new-trace-viewer/trace-viewer.tsx"],"names":[],"mappings":"AAIA,OAAO,EACL,KAAK,SAAS,EAMf,MAAM,OAAO,CAAC;AAOf,OAAO,KAAK,EAAE,KAAK,EAAE,MAAM,uBAAuB,CAAC;AAcnD,UAAU,mBAAmB;IAC3B,KAAK,EAAE,KAAK,CAAC;CACd;AAqGD,wBAAgB,cAAc,CAAC,EAAE,KAAK,EAAE,EAAE,mBAAmB,GAAG,SAAS,CAMxE"}

package/dist/components/new-trace-viewer/trace-viewer.js ADDED Viewed

@@ -0,0 +1,349 @@
+'use client';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { parseStepName, parseWorkflowName } from '@workflow/utils/parse-name';
+import { RotateCcw, Search, X, ZoomIn, ZoomOut } from 'lucide-react';
+import { useCallback, useEffect, useMemo, useRef, useState, } from 'react';
+import { ErrorBoundary } from '../error-boundary';
+import { EntityDetailPanel, } from '../sidebar/entity-detail-panel';
+import { useSidebarDataOptional } from '../sidebar/sidebar-data-context';
+import { formatDuration, getHighResInMs } from '../trace-viewer/util/timing';
+import { CopyButton } from './components/copy-button';
+import EventList from './components/event-list';
+import { SplitPane } from './components/split-pane';
+import { Timeline, TimelineHeader, TIMELINE_PADDING_PX, } from './components/timeline';
+import { ActiveSpanProvider, useActiveSpan } from './context';
+import { DetailPanel } from './detail-panel';
+import { computeRootBounds, computeTimeMarkers } from './utils';
+const MIN_VIEWPORT_MS = 0.001;
+function useAnimatedViewport(initial) {
+    const [viewport, setViewportState] = useState(initial);
+    const animRef = useRef(null);
+    const currentRef = useRef(initial);
+    currentRef.current = viewport;
+    const cancel = useCallback(() => {
+        if (animRef.current) {
+            cancelAnimationFrame(animRef.current.raf);
+            animRef.current = null;
+        }
+    }, []);
+    const animateTo = useCallback((target) => {
+        cancel();
+        const from = currentRef.current;
+        const anim = { raf: 0, from, to: target, start: performance.now() };
+        const tick = () => {
+            const t = Math.min((performance.now() - anim.start) / 150, 1);
+            const e = 1 - (1 - t) * (1 - t);
+            setViewportState({
+                start: anim.from.start + (anim.to.start - anim.from.start) * e,
+                end: anim.from.end + (anim.to.end - anim.from.end) * e,
+            });
+            if (t < 1)
+                anim.raf = requestAnimationFrame(tick);
+            else
+                animRef.current = null;
+        };
+        animRef.current = anim;
+        anim.raf = requestAnimationFrame(tick);
+    }, [cancel]);
+    const setViewport = useCallback((update) => {
+        cancel();
+        if (typeof update === 'function') {
+            setViewportState((prev) => {
+                const next = update(prev);
+                currentRef.current = next;
+                return next;
+            });
+        }
+        else {
+            currentRef.current = update;
+            setViewportState(update);
+        }
+    }, [cancel]);
+    useEffect(() => cancel, [cancel]);
+    return { viewport, setViewport, animateTo };
+}
+// ---------------------------------------------------------------------------
+// Hook: bridge ActiveSpanContext + SidebarDataContext → SelectedSpanInfo
+// ---------------------------------------------------------------------------
+function useSelectedSpanInfo() {
+    const { activeSpan } = useActiveSpan();
+    const sidebar = useSidebarDataOptional();
+    return useMemo(() => {
+        if (!activeSpan || !sidebar)
+            return null;
+        const correlationId = activeSpan.spanId;
+        const rawEvents = correlationId
+            ? sidebar.events.filter((e) => e.correlationId === correlationId)
+            : [];
+        return {
+            data: activeSpan.attributes?.data,
+            resource: activeSpan.attributes?.resource,
+            spanId: activeSpan.spanId,
+            rawEvents,
+        };
+    }, [activeSpan, sidebar?.events]);
+}
+// ---------------------------------------------------------------------------
+// Root component
+// ---------------------------------------------------------------------------
+export function NewTraceViewer({ trace }) {
+    return (_jsx(ActiveSpanProvider, { spans: trace.spans, children: _jsx(NewTraceViewerContent, { trace: trace }) }));
+}
+function NewTraceViewerContent({ trace }) {
+    const { activeSpan, activeSpanId, setActiveSpan, clearActiveSpan } = useActiveSpan();
+    const sidebar = useSidebarDataOptional();
+    const selectedSpan = useSelectedSpanInfo();
+    const [searchQuery, setSearchQuery] = useState('');
+    const filteredSpans = useMemo(() => {
+        const q = searchQuery.trim().toLowerCase();
+        if (!q)
+            return trace.spans;
+        return trace.spans.filter((s) => s.name.toLowerCase().includes(q) || s.resource.toLowerCase().includes(q));
+    }, [trace.spans, searchQuery]);
+    const root = useMemo(() => computeRootBounds(trace.spans), [trace.spans]);
+    const { viewport, setViewport, animateTo } = useAnimatedViewport({
+        start: root.startTime,
+        end: root.startTime + root.duration,
+    });
+    const prevRootRef = useRef({
+        start: root.startTime,
+        end: root.startTime + root.duration,
+    });
+    useEffect(() => {
+        const prevRoot = prevRootRef.current;
+        const newStart = root.startTime;
+        const newEnd = root.startTime + root.duration;
+        setViewport((prev) => {
+            const wasAtFullExtent = Math.abs(prev.start - prevRoot.start) < 0.01 &&
+                Math.abs(prev.end - prevRoot.end) < 0.01;
+            if (wasAtFullExtent) {
+                return { start: newStart, end: newEnd };
+            }
+            return prev;
+        });
+        prevRootRef.current = { start: newStart, end: newEnd };
+    }, [root.startTime, root.duration]);
+    const viewDuration = viewport.end - viewport.start;
+    const timeMarkers = useMemo(() => computeTimeMarkers(viewDuration, viewport.start - root.startTime), [viewDuration, viewport.start, root.startTime]);
+    const resetZoom = useCallback(() => {
+        animateTo({ start: root.startTime, end: root.startTime + root.duration });
+    }, [animateTo, root.startTime, root.duration]);
+    const ZOOM_FACTOR = 0.5;
+    const zoomBy = useCallback((factor) => {
+        const rootS = root.startTime;
+        const rootE = root.startTime + root.duration;
+        const rootD = root.duration;
+        setViewport((prev) => {
+            const prevDuration = prev.end - prev.start;
+            const center = (prev.start + prev.end) / 2;
+            const newDuration = Math.max(MIN_VIEWPORT_MS, Math.min(rootD, prevDuration * factor));
+            let newStart = center - newDuration / 2;
+            let newEnd = center + newDuration / 2;
+            if (newStart < rootS) {
+                newStart = rootS;
+                newEnd = rootS + newDuration;
+            }
+            if (newEnd > rootE) {
+                newEnd = rootE;
+                newStart = Math.max(rootS, rootE - newDuration);
+            }
+            return { start: newStart, end: newEnd };
+        });
+    }, [setViewport, root.startTime, root.duration]);
+    const zoomIn = useCallback(() => zoomBy(ZOOM_FACTOR), [zoomBy]);
+    const zoomOut = useCallback(() => zoomBy(1 / ZOOM_FACTOR), [zoomBy]);
+    const handleSelectSpan = useCallback((spanId) => {
+        if (spanId === activeSpanId) {
+            clearActiveSpan();
+            return;
+        }
+        setActiveSpan(spanId);
+        const span = trace.spans.find((s) => s.spanId === spanId);
+        if (!span)
+            return;
+        const spanStart = getHighResInMs(span.startTime);
+        const spanEnd = getHighResInMs(span.endTime);
+        const spanDuration = spanEnd - spanStart;
+        const rootS = root.startTime;
+        const rootE = root.startTime + root.duration;
+        const rootD = root.duration;
+        if (spanDuration > rootD * 0.8) {
+            animateTo({ start: rootS, end: rootE });
+            return;
+        }
+        const padding = Math.max(spanDuration * 0.2, MIN_VIEWPORT_MS / 2);
+        let newStart = spanStart - padding;
+        let newEnd = spanEnd + padding;
+        if (newEnd - newStart < MIN_VIEWPORT_MS) {
+            const center = (spanStart + spanEnd) / 2;
+            newStart = center - MIN_VIEWPORT_MS / 2;
+            newEnd = center + MIN_VIEWPORT_MS / 2;
+        }
+        if (newStart < rootS) {
+            const duration = newEnd - newStart;
+            newStart = rootS;
+            newEnd = Math.min(rootE, rootS + duration);
+        }
+        if (newEnd > rootE) {
+            const duration = newEnd - newStart;
+            newEnd = rootE;
+            newStart = Math.max(rootS, rootE - duration);
+        }
+        animateTo({ start: newStart, end: newEnd });
+    }, [
+        animateTo,
+        setActiveSpan,
+        clearActiveSpan,
+        activeSpanId,
+        trace.spans,
+        root.startTime,
+        root.duration,
+    ]);
+    const [altHeld, setAltHeld] = useState(false);
+    useEffect(() => {
+        const onKeyDown = (e) => {
+            if (e.key === 'Escape') {
+                clearActiveSpan();
+            }
+            if (e.key === 'Alt') {
+                e.preventDefault();
+                setAltHeld(true);
+            }
+        };
+        const onKeyUp = (e) => {
+            if (e.key === 'Alt')
+                setAltHeld(false);
+        };
+        const onBlur = () => setAltHeld(false);
+        window.addEventListener('keydown', onKeyDown);
+        window.addEventListener('keyup', onKeyUp);
+        window.addEventListener('blur', onBlur);
+        return () => {
+            window.removeEventListener('keydown', onKeyDown);
+            window.removeEventListener('keyup', onKeyUp);
+            window.removeEventListener('blur', onBlur);
+        };
+    }, [clearActiveSpan]);
+    const timelineRef = useRef(null);
+    const [hoverFraction, setHoverFraction] = useState(null);
+    const hoverInfo = useMemo(() => {
+        if (hoverFraction == null)
+            return null;
+        const absTime = viewport.start + hoverFraction * viewDuration;
+        const offset = absTime - root.startTime;
+        return { fraction: hoverFraction, label: formatDuration(offset, true) };
+    }, [hoverFraction, viewport.start, viewDuration, root.startTime]);
+    const handleTimelineMouseMove = useCallback((e) => {
+        const el = timelineRef.current;
+        if (!el)
+            return;
+        const rect = el.getBoundingClientRect();
+        const contentWidth = rect.width - TIMELINE_PADDING_PX * 2;
+        if (contentWidth <= 0)
+            return;
+        const fraction = Math.max(0, Math.min(1, (e.clientX - rect.left - TIMELINE_PADDING_PX) / contentWidth));
+        setHoverFraction(fraction);
+    }, []);
+    const handleTimelineMouseLeave = useCallback(() => {
+        setHoverFraction(null);
+    }, []);
+    useEffect(() => {
+        const el = timelineRef.current;
+        if (!el)
+            return;
+        const rootS = root.startTime;
+        const rootE = root.startTime + root.duration;
+        const rootD = root.duration;
+        if (rootD <= 0)
+            return;
+        const onWheel = (e) => {
+            const isZoomGesture = e.ctrlKey || e.metaKey;
+            const hasDeltaX = Math.abs(e.deltaX) > Math.abs(e.deltaY);
+            if (!isZoomGesture && !hasDeltaX)
+                return;
+            e.preventDefault();
+            const rect = el.getBoundingClientRect();
+            const contentWidth = rect.width - TIMELINE_PADDING_PX * 2;
+            if (contentWidth <= 0)
+                return;
+            if (isZoomGesture) {
+                let dy = e.deltaY;
+                if (e.deltaMode === 1)
+                    dy *= 16;
+                const cursorFraction = Math.max(0, Math.min(1, (e.clientX - rect.left - TIMELINE_PADDING_PX) / contentWidth));
+                const scaleFactor = Math.pow(2, dy / 200);
+                setViewport((prev) => {
+                    const prevDuration = prev.end - prev.start;
+                    const cursorTime = prev.start + cursorFraction * prevDuration;
+                    const newDuration = Math.max(MIN_VIEWPORT_MS, Math.min(rootD, prevDuration * scaleFactor));
+                    let newStart = cursorTime - cursorFraction * newDuration;
+                    let newEnd = newStart + newDuration;
+                    if (newStart < rootS) {
+                        newStart = rootS;
+                        newEnd = rootS + newDuration;
+                    }
+                    if (newEnd > rootE) {
+                        newEnd = rootE;
+                        newStart = Math.max(rootS, rootE - newDuration);
+                    }
+                    return { start: newStart, end: newEnd };
+                });
+            }
+            else {
+                let dx = e.deltaX;
+                if (e.deltaMode === 1)
+                    dx *= 16;
+                setViewport((prev) => {
+                    const prevDuration = prev.end - prev.start;
+                    const panAmount = (dx / contentWidth) * prevDuration;
+                    let newStart = prev.start + panAmount;
+                    let newEnd = prev.end + panAmount;
+                    if (newStart < rootS) {
+                        newStart = rootS;
+                        newEnd = rootS + prevDuration;
+                    }
+                    if (newEnd > rootE) {
+                        newEnd = rootE;
+                        newStart = Math.max(rootS, rootE - prevDuration);
+                    }
+                    return { start: newStart, end: newEnd };
+                });
+            }
+        };
+        el.addEventListener('wheel', onWheel, { passive: false });
+        return () => el.removeEventListener('wheel', onWheel);
+    }, [root.startTime, root.duration]);
+    // Derive the selected span name and metadata for the panel header
+    const selectedSpanName = useMemo(() => {
+        if (!selectedSpan?.data)
+            return 'Details';
+        const data = selectedSpan.data;
+        const stepName = data.stepName;
+        const workflowName = data.workflowName;
+        return ((stepName ? parseStepName(stepName)?.shortName : undefined) ??
+            (workflowName ? parseWorkflowName(workflowName)?.shortName : undefined) ??
+            stepName ??
+            workflowName ??
+            data.hookId ??
+            'Details');
+    }, [selectedSpan?.data]);
+    const selectedResource = selectedSpan?.resource;
+    const selectedResourceId = useMemo(() => {
+        if (!selectedSpan?.data)
+            return undefined;
+        const data = selectedSpan.data;
+        return (data.stepId ??
+            data.runId ??
+            data.hookId ??
+            selectedSpan.spanId);
+    }, [selectedSpan?.data, selectedSpan?.spanId]);
+    return (_jsxs("div", { "data-pane": 'pane-root', "data-has-detail": activeSpan ? '' : undefined, className: 'grid w-full h-full max-h-full grid-cols-[minmax(100px,1fr)] data-[has-detail]:grid-cols-[minmax(100px,1fr)_clamp(280px,420px,100%)]', children: [_jsxs("div", { id: 'trace-parent', className: 'grid grid-rows-[1fr] h-full min-h-0 overflow-hidden relative bg-background-100', children: [_jsxs(SplitPane, { startHeader: _jsxs("div", { className: 'bg-background-100 border-b border-gray-alpha-400 h-10 min-h-10 flex items-center px-2 gap-1.5', children: [_jsx(Search, { className: 'w-3.5 h-3.5 shrink-0 text-gray-800' }), _jsx("input", { id: 'trace-viewer-search', name: 'trace-viewer-search', type: 'text', value: searchQuery, onChange: (e) => setSearchQuery(e.target.value), placeholder: 'Search spans...', "aria-label": 'Search spans', className: 'flex-1 min-w-0 bg-transparent text-sm text-gray-1000 placeholder:text-gray-800 outline-none' }), searchQuery && (_jsx("button", { type: 'button', onClick: () => setSearchQuery(''), className: 'shrink-0 p-0.5 rounded-sm text-gray-800 hover:text-gray-1000 hover:bg-gray-200 transition-colors', children: _jsx(X, { className: 'w-3 h-3' }) }))] }), endHeader: _jsx(TimelineHeader, { markers: timeMarkers, hoverInfo: hoverInfo }), children: [_jsx("div", { className: 'block overflow-visible', children: _jsx(EventList, { spans: filteredSpans, activeSpanId: activeSpanId, onSelectSpan: handleSelectSpan }) }), _jsx("div", { ref: timelineRef, className: 'block min-h-0 overflow-visible relative', onDoubleClick: resetZoom, onMouseMove: handleTimelineMouseMove, onMouseLeave: handleTimelineMouseLeave, children: _jsx(Timeline, { spans: filteredSpans, viewStart: viewport.start, viewEnd: viewport.end, markers: timeMarkers, selectedId: activeSpanId, onSelect: handleSelectSpan, hoverFraction: hoverFraction, altHeld: altHeld }) })] }), _jsxs("div", { className: 'absolute right-3 bottom-3 z-[5] flex items-center border border-gray-alpha-400 rounded-lg bg-background-100 shadow-sm overflow-hidden divide-x divide-gray-alpha-400', children: [_jsx("button", { type: 'button', className: 'flex items-center justify-center w-8 h-8 text-gray-900 cursor-pointer transition-colors duration-[120ms] ease-in-out hover:text-gray-1000 hover:bg-gray-alpha-100', onClick: zoomOut, "aria-label": 'Zoom out', children: _jsx(ZoomOut, { className: 'w-4 h-4' }) }), _jsx("button", { type: 'button', className: 'flex items-center justify-center w-8 h-8 text-gray-900 cursor-pointer transition-colors duration-[120ms] ease-in-out hover:text-gray-1000 hover:bg-gray-alpha-100', onClick: resetZoom, "aria-label": 'Reset zoom', children: _jsx(RotateCcw, { className: 'w-3.5 h-3.5' }) }), _jsx("button", { type: 'button', className: 'flex items-center justify-center w-8 h-8 text-gray-900 cursor-pointer transition-colors duration-[120ms] ease-in-out hover:text-gray-1000 hover:bg-gray-alpha-100', onClick: zoomIn, "aria-label": 'Zoom in', children: _jsx(ZoomIn, { className: 'w-4 h-4' }) })] })] }), activeSpan && sidebar ? (_jsxs("aside", { className: 'flex flex-col h-full max-h-full bg-background-100 border-l border-gray-alpha-400 overflow-auto', children: [_jsx("div", { className: 'flex-shrink-0 px-4 pt-4 pb-3', children: _jsxs("div", { className: 'flex items-start justify-between gap-2', children: [_jsxs("div", { className: 'min-w-0 flex-1', children: [_jsx("span", { className: 'text-[15px] font-semibold text-gray-1000 truncate block', children: selectedSpanName }), selectedResourceId && (_jsxs("div", { className: 'mt-1 flex items-center gap-2', children: [selectedResource && (_jsx("span", { className: `inline-flex items-center rounded-md px-1.5 py-0.5 text-[11px] font-medium leading-none shrink-0 ${selectedResource === 'step'
+                                                        ? 'bg-green-200 text-green-900'
+                                                        : selectedResource === 'run'
+                                                            ? 'bg-blue-200 text-blue-900'
+                                                            : selectedResource === 'hook'
+                                                                ? 'bg-yellow-200 text-yellow-900'
+                                                                : 'bg-gray-200 text-gray-900'}`, children: selectedResource.charAt(0).toUpperCase() +
+                                                        selectedResource.slice(1) })), _jsxs("div", { className: 'flex items-center gap-1 text-[13px] font-mono text-gray-700 min-w-0', title: selectedResourceId, children: [_jsx("span", { className: 'truncate', children: selectedResourceId }), _jsx(CopyButton, { copyText: selectedResourceId, ariaLabel: 'Copy ID', className: 'shrink-0' })] })] }))] }), _jsx("button", { type: 'button', className: 'p-1 rounded-md text-gray-900 hover:text-gray-1000 hover:bg-gray-alpha-200 transition-colors shrink-0', onClick: clearActiveSpan, children: _jsx(X, { className: 'w-4 h-4' }) })] }) }), _jsx("div", { className: 'flex-1 overflow-y-auto', children: _jsx(ErrorBoundary, { children: _jsx(EntityDetailPanel, { run: sidebar.run, onStreamClick: sidebar.onStreamClick, onRunClick: sidebar.onRunClick, spanDetailData: sidebar.spanDetailData, spanDetailError: sidebar.spanDetailError, spanDetailLoading: sidebar.spanDetailLoading, onSpanSelect: sidebar.onSpanSelect, onWakeUpSleep: sidebar.onWakeUpSleep, onLoadEventData: sidebar.onLoadEventData, onResolveHook: sidebar.onResolveHook, encryptionKey: sidebar.encryptionKey, onDecrypt: sidebar.onDecrypt, isDecrypting: sidebar.isDecrypting, selectedSpan: selectedSpan }) }) })] })) : activeSpan ? (_jsx(DetailPanel, { span: activeSpan, rootStart: root.startTime, onClose: clearActiveSpan })) : null] }));
+}
+//# sourceMappingURL=trace-viewer.js.map

package/dist/components/new-trace-viewer/trace-viewer.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"trace-viewer.js","sourceRoot":"","sources":["../../../src/components/new-trace-viewer/trace-viewer.tsx"],"names":[],"mappings":"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","sourcesContent":["'use client';\n\nimport { parseStepName, parseWorkflowName } from '@workflow/utils/parse-name';\nimport { RotateCcw, Search, X, ZoomIn, ZoomOut } from 'lucide-react';\nimport {\n type ReactNode,\n useCallback,\n useEffect,\n useMemo,\n useRef,\n useState,\n} from 'react';\nimport { ErrorBoundary } from '../error-boundary';\nimport {\n EntityDetailPanel,\n type SelectedSpanInfo,\n} from '../sidebar/entity-detail-panel';\nimport { useSidebarDataOptional } from '../sidebar/sidebar-data-context';\nimport type { Trace } from '../trace-viewer/types';\nimport { formatDuration, getHighResInMs } from '../trace-viewer/util/timing';\nimport { CopyButton } from './components/copy-button';\nimport EventList from './components/event-list';\nimport { SplitPane } from './components/split-pane';\nimport {\n Timeline,\n TimelineHeader,\n TIMELINE_PADDING_PX,\n} from './components/timeline';\nimport { ActiveSpanProvider, useActiveSpan } from './context';\nimport { DetailPanel } from './detail-panel';\nimport { computeRootBounds, computeTimeMarkers } from './utils';\n\ninterface NewTraceViewerProps {\n trace: Trace;\n}\n\nconst MIN_VIEWPORT_MS = 0.001;\n\ninterface Viewport {\n start: number;\n end: number;\n}\n\nfunction useAnimatedViewport(initial: Viewport) {\n const [viewport, setViewportState] = useState<Viewport>(initial);\n const animRef = useRef<{\n raf: number;\n from: Viewport;\n to: Viewport;\n start: number;\n } | null>(null);\n const currentRef = useRef(initial);\n currentRef.current = viewport;\n\n const cancel = useCallback(() => {\n if (animRef.current) {\n cancelAnimationFrame(animRef.current.raf);\n animRef.current = null;\n }\n }, []);\n\n const animateTo = useCallback(\n (target: Viewport) => {\n cancel();\n const from = currentRef.current;\n const anim = { raf: 0, from, to: target, start: performance.now() };\n\n const tick = () => {\n const t = Math.min((performance.now() - anim.start) / 150, 1);\n const e = 1 - (1 - t) * (1 - t);\n setViewportState({\n start: anim.from.start + (anim.to.start - anim.from.start) * e,\n end: anim.from.end + (anim.to.end - anim.from.end) * e,\n });\n if (t < 1) anim.raf = requestAnimationFrame(tick);\n else animRef.current = null;\n };\n\n animRef.current = anim;\n anim.raf = requestAnimationFrame(tick);\n },\n [cancel]\n );\n\n const setViewport = useCallback(\n (update: Viewport | ((prev: Viewport) => Viewport)) => {\n cancel();\n if (typeof update === 'function') {\n setViewportState((prev) => {\n const next = update(prev);\n currentRef.current = next;\n return next;\n });\n } else {\n currentRef.current = update;\n setViewportState(update);\n }\n },\n [cancel]\n );\n\n useEffect(() => cancel, [cancel]);\n\n return { viewport, setViewport, animateTo };\n}\n\n// ---------------------------------------------------------------------------\n// Hook: bridge ActiveSpanContext + SidebarDataContext → SelectedSpanInfo\n// ---------------------------------------------------------------------------\n\nfunction useSelectedSpanInfo(): SelectedSpanInfo | null {\n const { activeSpan } = useActiveSpan();\n const sidebar = useSidebarDataOptional();\n\n return useMemo(() => {\n if (!activeSpan || !sidebar) return null;\n\n const correlationId = activeSpan.spanId;\n const rawEvents = correlationId\n ? sidebar.events.filter((e) => e.correlationId === correlationId)\n : [];\n\n return {\n data: activeSpan.attributes?.data,\n resource: activeSpan.attributes?.resource as string | undefined,\n spanId: activeSpan.spanId,\n rawEvents,\n };\n }, [activeSpan, sidebar?.events]);\n}\n\n// ---------------------------------------------------------------------------\n// Root component\n// ---------------------------------------------------------------------------\n\nexport function NewTraceViewer({ trace }: NewTraceViewerProps): ReactNode {\n return (\n <ActiveSpanProvider spans={trace.spans}>\n <NewTraceViewerContent trace={trace} />\n </ActiveSpanProvider>\n );\n}\n\nfunction NewTraceViewerContent({ trace }: NewTraceViewerProps): ReactNode {\n const { activeSpan, activeSpanId, setActiveSpan, clearActiveSpan } =\n useActiveSpan();\n\n const sidebar = useSidebarDataOptional();\n const selectedSpan = useSelectedSpanInfo();\n\n const [searchQuery, setSearchQuery] = useState('');\n\n const filteredSpans = useMemo(() => {\n const q = searchQuery.trim().toLowerCase();\n if (!q) return trace.spans;\n return trace.spans.filter(\n (s) =>\n s.name.toLowerCase().includes(q) || s.resource.toLowerCase().includes(q)\n );\n }, [trace.spans, searchQuery]);\n\n const root = useMemo(() => computeRootBounds(trace.spans), [trace.spans]);\n\n const { viewport, setViewport, animateTo } = useAnimatedViewport({\n start: root.startTime,\n end: root.startTime + root.duration,\n });\n\n const prevRootRef = useRef<Viewport>({\n start: root.startTime,\n end: root.startTime + root.duration,\n });\n\n useEffect(() => {\n const prevRoot = prevRootRef.current;\n const newStart = root.startTime;\n const newEnd = root.startTime + root.duration;\n\n setViewport((prev) => {\n const wasAtFullExtent =\n Math.abs(prev.start - prevRoot.start) < 0.01 &&\n Math.abs(prev.end - prevRoot.end) < 0.01;\n\n if (wasAtFullExtent) {\n return { start: newStart, end: newEnd };\n }\n return prev;\n });\n\n prevRootRef.current = { start: newStart, end: newEnd };\n }, [root.startTime, root.duration]);\n\n const viewDuration = viewport.end - viewport.start;\n\n const timeMarkers = useMemo(\n () => computeTimeMarkers(viewDuration, viewport.start - root.startTime),\n [viewDuration, viewport.start, root.startTime]\n );\n\n const resetZoom = useCallback(() => {\n animateTo({ start: root.startTime, end: root.startTime + root.duration });\n }, [animateTo, root.startTime, root.duration]);\n\n const ZOOM_FACTOR = 0.5;\n\n const zoomBy = useCallback(\n (factor: number) => {\n const rootS = root.startTime;\n const rootE = root.startTime + root.duration;\n const rootD = root.duration;\n\n setViewport((prev) => {\n const prevDuration = prev.end - prev.start;\n const center = (prev.start + prev.end) / 2;\n const newDuration = Math.max(\n MIN_VIEWPORT_MS,\n Math.min(rootD, prevDuration * factor)\n );\n let newStart = center - newDuration / 2;\n let newEnd = center + newDuration / 2;\n\n if (newStart < rootS) {\n newStart = rootS;\n newEnd = rootS + newDuration;\n }\n if (newEnd > rootE) {\n newEnd = rootE;\n newStart = Math.max(rootS, rootE - newDuration);\n }\n\n return { start: newStart, end: newEnd };\n });\n },\n [setViewport, root.startTime, root.duration]\n );\n\n const zoomIn = useCallback(() => zoomBy(ZOOM_FACTOR), [zoomBy]);\n const zoomOut = useCallback(() => zoomBy(1 / ZOOM_FACTOR), [zoomBy]);\n\n const handleSelectSpan = useCallback(\n (spanId: string) => {\n if (spanId === activeSpanId) {\n clearActiveSpan();\n return;\n }\n setActiveSpan(spanId);\n\n const span = trace.spans.find((s) => s.spanId === spanId);\n if (!span) return;\n\n const spanStart = getHighResInMs(span.startTime);\n const spanEnd = getHighResInMs(span.endTime);\n const spanDuration = spanEnd - spanStart;\n\n const rootS = root.startTime;\n const rootE = root.startTime + root.duration;\n const rootD = root.duration;\n\n if (spanDuration > rootD * 0.8) {\n animateTo({ start: rootS, end: rootE });\n return;\n }\n\n const padding = Math.max(spanDuration * 0.2, MIN_VIEWPORT_MS / 2);\n let newStart = spanStart - padding;\n let newEnd = spanEnd + padding;\n\n if (newEnd - newStart < MIN_VIEWPORT_MS) {\n const center = (spanStart + spanEnd) / 2;\n newStart = center - MIN_VIEWPORT_MS / 2;\n newEnd = center + MIN_VIEWPORT_MS / 2;\n }\n\n if (newStart < rootS) {\n const duration = newEnd - newStart;\n newStart = rootS;\n newEnd = Math.min(rootE, rootS + duration);\n }\n if (newEnd > rootE) {\n const duration = newEnd - newStart;\n newEnd = rootE;\n newStart = Math.max(rootS, rootE - duration);\n }\n\n animateTo({ start: newStart, end: newEnd });\n },\n [\n animateTo,\n setActiveSpan,\n clearActiveSpan,\n activeSpanId,\n trace.spans,\n root.startTime,\n root.duration,\n ]\n );\n\n const [altHeld, setAltHeld] = useState(false);\n\n useEffect(() => {\n const onKeyDown = (e: KeyboardEvent): void => {\n if (e.key === 'Escape') {\n clearActiveSpan();\n }\n if (e.key === 'Alt') {\n e.preventDefault();\n setAltHeld(true);\n }\n };\n const onKeyUp = (e: KeyboardEvent): void => {\n if (e.key === 'Alt') setAltHeld(false);\n };\n const onBlur = (): void => setAltHeld(false);\n\n window.addEventListener('keydown', onKeyDown);\n window.addEventListener('keyup', onKeyUp);\n window.addEventListener('blur', onBlur);\n return () => {\n window.removeEventListener('keydown', onKeyDown);\n window.removeEventListener('keyup', onKeyUp);\n window.removeEventListener('blur', onBlur);\n };\n }, [clearActiveSpan]);\n\n const timelineRef = useRef<HTMLDivElement>(null);\n const [hoverFraction, setHoverFraction] = useState<number | null>(null);\n\n const hoverInfo = useMemo(() => {\n if (hoverFraction == null) return null;\n const absTime = viewport.start + hoverFraction * viewDuration;\n const offset = absTime - root.startTime;\n return { fraction: hoverFraction, label: formatDuration(offset, true) };\n }, [hoverFraction, viewport.start, viewDuration, root.startTime]);\n\n const handleTimelineMouseMove = useCallback(\n (e: React.MouseEvent<HTMLDivElement>) => {\n const el = timelineRef.current;\n if (!el) return;\n const rect = el.getBoundingClientRect();\n const contentWidth = rect.width - TIMELINE_PADDING_PX * 2;\n if (contentWidth <= 0) return;\n const fraction = Math.max(\n 0,\n Math.min(\n 1,\n (e.clientX - rect.left - TIMELINE_PADDING_PX) / contentWidth\n )\n );\n setHoverFraction(fraction);\n },\n []\n );\n\n const handleTimelineMouseLeave = useCallback(() => {\n setHoverFraction(null);\n }, []);\n\n useEffect(() => {\n const el = timelineRef.current;\n if (!el) return;\n\n const rootS = root.startTime;\n const rootE = root.startTime + root.duration;\n const rootD = root.duration;\n if (rootD <= 0) return;\n\n const onWheel = (e: WheelEvent): void => {\n const isZoomGesture = e.ctrlKey || e.metaKey;\n const hasDeltaX = Math.abs(e.deltaX) > Math.abs(e.deltaY);\n\n if (!isZoomGesture && !hasDeltaX) return;\n e.preventDefault();\n\n const rect = el.getBoundingClientRect();\n const contentWidth = rect.width - TIMELINE_PADDING_PX * 2;\n if (contentWidth <= 0) return;\n\n if (isZoomGesture) {\n let dy = e.deltaY;\n if (e.deltaMode === 1) dy *= 16;\n\n const cursorFraction = Math.max(\n 0,\n Math.min(\n 1,\n (e.clientX - rect.left - TIMELINE_PADDING_PX) / contentWidth\n )\n );\n const scaleFactor = Math.pow(2, dy / 200);\n\n setViewport((prev) => {\n const prevDuration = prev.end - prev.start;\n const cursorTime = prev.start + cursorFraction * prevDuration;\n const newDuration = Math.max(\n MIN_VIEWPORT_MS,\n Math.min(rootD, prevDuration * scaleFactor)\n );\n\n let newStart = cursorTime - cursorFraction * newDuration;\n let newEnd = newStart + newDuration;\n\n if (newStart < rootS) {\n newStart = rootS;\n newEnd = rootS + newDuration;\n }\n if (newEnd > rootE) {\n newEnd = rootE;\n newStart = Math.max(rootS, rootE - newDuration);\n }\n\n return { start: newStart, end: newEnd };\n });\n } else {\n let dx = e.deltaX;\n if (e.deltaMode === 1) dx *= 16;\n\n setViewport((prev) => {\n const prevDuration = prev.end - prev.start;\n const panAmount = (dx / contentWidth) * prevDuration;\n\n let newStart = prev.start + panAmount;\n let newEnd = prev.end + panAmount;\n\n if (newStart < rootS) {\n newStart = rootS;\n newEnd = rootS + prevDuration;\n }\n if (newEnd > rootE) {\n newEnd = rootE;\n newStart = Math.max(rootS, rootE - prevDuration);\n }\n\n return { start: newStart, end: newEnd };\n });\n }\n };\n\n el.addEventListener('wheel', onWheel, { passive: false });\n return () => el.removeEventListener('wheel', onWheel);\n }, [root.startTime, root.duration]);\n\n // Derive the selected span name and metadata for the panel header\n const selectedSpanName = useMemo(() => {\n if (!selectedSpan?.data) return 'Details';\n const data = selectedSpan.data as Record<string, unknown>;\n const stepName = data.stepName as string | undefined;\n const workflowName = data.workflowName as string | undefined;\n return (\n (stepName ? parseStepName(stepName)?.shortName : undefined) ??\n (workflowName ? parseWorkflowName(workflowName)?.shortName : undefined) ??\n stepName ??\n workflowName ??\n (data.hookId as string) ??\n 'Details'\n );\n }, [selectedSpan?.data]);\n\n const selectedResource = selectedSpan?.resource as string | undefined;\n const selectedResourceId = useMemo(() => {\n if (!selectedSpan?.data) return undefined;\n const data = selectedSpan.data as Record<string, unknown>;\n return (\n (data.stepId as string) ??\n (data.runId as string) ??\n (data.hookId as string) ??\n selectedSpan.spanId\n );\n }, [selectedSpan?.data, selectedSpan?.spanId]);\n\n return (\n <div\n data-pane='pane-root'\n data-has-detail={activeSpan ? '' : undefined}\n className='grid w-full h-full max-h-full grid-cols-[minmax(100px,1fr)] data-[has-detail]:grid-cols-[minmax(100px,1fr)_clamp(280px,420px,100%)]'\n >\n <div\n id='trace-parent'\n className='grid grid-rows-[1fr] h-full min-h-0 overflow-hidden relative bg-background-100'\n >\n <SplitPane\n startHeader={\n <div className='bg-background-100 border-b border-gray-alpha-400 h-10 min-h-10 flex items-center px-2 gap-1.5'>\n <Search className='w-3.5 h-3.5 shrink-0 text-gray-800' />\n <input\n id='trace-viewer-search'\n name='trace-viewer-search'\n type='text'\n value={searchQuery}\n onChange={(e) => setSearchQuery(e.target.value)}\n placeholder='Search spans...'\n aria-label='Search spans'\n className='flex-1 min-w-0 bg-transparent text-sm text-gray-1000 placeholder:text-gray-800 outline-none'\n />\n {searchQuery && (\n <button\n type='button'\n onClick={() => setSearchQuery('')}\n className='shrink-0 p-0.5 rounded-sm text-gray-800 hover:text-gray-1000 hover:bg-gray-200 transition-colors'\n >\n <X className='w-3 h-3' />\n </button>\n )}\n </div>\n }\n endHeader={\n <TimelineHeader markers={timeMarkers} hoverInfo={hoverInfo} />\n }\n >\n <div className='block overflow-visible'>\n <EventList\n spans={filteredSpans}\n activeSpanId={activeSpanId}\n onSelectSpan={handleSelectSpan}\n />\n </div>\n <div\n ref={timelineRef}\n className='block min-h-0 overflow-visible relative'\n onDoubleClick={resetZoom}\n onMouseMove={handleTimelineMouseMove}\n onMouseLeave={handleTimelineMouseLeave}\n >\n <Timeline\n spans={filteredSpans}\n viewStart={viewport.start}\n viewEnd={viewport.end}\n markers={timeMarkers}\n selectedId={activeSpanId}\n onSelect={handleSelectSpan}\n hoverFraction={hoverFraction}\n altHeld={altHeld}\n />\n </div>\n </SplitPane>\n <div className='absolute right-3 bottom-3 z-[5] flex items-center border border-gray-alpha-400 rounded-lg bg-background-100 shadow-sm overflow-hidden divide-x divide-gray-alpha-400'>\n <button\n type='button'\n className='flex items-center justify-center w-8 h-8 text-gray-900 cursor-pointer transition-colors duration-[120ms] ease-in-out hover:text-gray-1000 hover:bg-gray-alpha-100'\n onClick={zoomOut}\n aria-label='Zoom out'\n >\n <ZoomOut className='w-4 h-4' />\n </button>\n <button\n type='button'\n className='flex items-center justify-center w-8 h-8 text-gray-900 cursor-pointer transition-colors duration-[120ms] ease-in-out hover:text-gray-1000 hover:bg-gray-alpha-100'\n onClick={resetZoom}\n aria-label='Reset zoom'\n >\n <RotateCcw className='w-3.5 h-3.5' />\n </button>\n <button\n type='button'\n className='flex items-center justify-center w-8 h-8 text-gray-900 cursor-pointer transition-colors duration-[120ms] ease-in-out hover:text-gray-1000 hover:bg-gray-alpha-100'\n onClick={zoomIn}\n aria-label='Zoom in'\n >\n <ZoomIn className='w-4 h-4' />\n </button>\n </div>\n </div>\n\n {/* Detail panel */}\n {activeSpan && sidebar ? (\n <aside className='flex flex-col h-full max-h-full bg-background-100 border-l border-gray-alpha-400 overflow-auto'>\n {/* Panel header */}\n <div className='flex-shrink-0 px-4 pt-4 pb-3'>\n <div className='flex items-start justify-between gap-2'>\n <div className='min-w-0 flex-1'>\n <span className='text-[15px] font-semibold text-gray-1000 truncate block'>\n {selectedSpanName}\n </span>\n {selectedResourceId && (\n <div className='mt-1 flex items-center gap-2'>\n {selectedResource && (\n <span\n className={`inline-flex items-center rounded-md px-1.5 py-0.5 text-[11px] font-medium leading-none shrink-0 ${\n selectedResource === 'step'\n ? 'bg-green-200 text-green-900'\n : selectedResource === 'run'\n ? 'bg-blue-200 text-blue-900'\n : selectedResource === 'hook'\n ? 'bg-yellow-200 text-yellow-900'\n : 'bg-gray-200 text-gray-900'\n }`}\n >\n {selectedResource.charAt(0).toUpperCase() +\n selectedResource.slice(1)}\n </span>\n )}\n <div\n className='flex items-center gap-1 text-[13px] font-mono text-gray-700 min-w-0'\n title={selectedResourceId}\n >\n <span className='truncate'>{selectedResourceId}</span>\n <CopyButton\n copyText={selectedResourceId}\n ariaLabel='Copy ID'\n className='shrink-0'\n />\n </div>\n </div>\n )}\n </div>\n <button\n type='button'\n className='p-1 rounded-md text-gray-900 hover:text-gray-1000 hover:bg-gray-alpha-200 transition-colors shrink-0'\n onClick={clearActiveSpan}\n >\n <X className='w-4 h-4' />\n </button>\n </div>\n </div>\n {/* Panel body */}\n <div className='flex-1 overflow-y-auto'>\n <ErrorBoundary>\n <EntityDetailPanel\n run={sidebar.run}\n onStreamClick={sidebar.onStreamClick}\n onRunClick={sidebar.onRunClick}\n spanDetailData={sidebar.spanDetailData}\n spanDetailError={sidebar.spanDetailError}\n spanDetailLoading={sidebar.spanDetailLoading}\n onSpanSelect={sidebar.onSpanSelect}\n onWakeUpSleep={sidebar.onWakeUpSleep}\n onLoadEventData={sidebar.onLoadEventData}\n onResolveHook={sidebar.onResolveHook}\n encryptionKey={sidebar.encryptionKey}\n onDecrypt={sidebar.onDecrypt}\n isDecrypting={sidebar.isDecrypting}\n selectedSpan={selectedSpan}\n />\n </ErrorBoundary>\n </div>\n </aside>\n ) : activeSpan ? (\n <DetailPanel\n span={activeSpan}\n rootStart={root.startTime}\n onClose={clearActiveSpan}\n />\n ) : null}\n </div>\n );\n}\n"]}

package/dist/components/new-trace-viewer/types.d.ts ADDED Viewed

	@@ -0,0 +1 @@
1	+ //# sourceMappingURL=types.d.ts.map

package/dist/components/new-trace-viewer/types.d.ts.map ADDED Viewed

	@@ -0,0 +1 @@
1	+ {"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/components/new-trace-viewer/types.ts"],"names":[],"mappings":""}

package/dist/components/new-trace-viewer/types.js ADDED Viewed

	@@ -0,0 +1,2 @@
1	+ "use strict";
2	+ //# sourceMappingURL=types.js.map

package/dist/components/new-trace-viewer/types.js.map ADDED Viewed

	@@ -0,0 +1 @@
1	+ {"version":3,"file":"types.js","sourceRoot":"","sources":["../../../src/components/new-trace-viewer/types.ts"],"names":[],"mappings":"","sourcesContent":[""]}

package/dist/components/new-trace-viewer/util/constants.d.ts ADDED Viewed

	@@ -0,0 +1 @@
1	+ //# sourceMappingURL=constants.d.ts.map

package/dist/components/new-trace-viewer/util/constants.d.ts.map ADDED Viewed

	@@ -0,0 +1 @@
1	+ {"version":3,"file":"constants.d.ts","sourceRoot":"","sources":["../../../../src/components/new-trace-viewer/util/constants.ts"],"names":[],"mappings":""}

package/dist/components/new-trace-viewer/util/constants.js ADDED Viewed

	@@ -0,0 +1,2 @@
1	+ "use strict";
2	+ //# sourceMappingURL=constants.js.map

package/dist/components/new-trace-viewer/util/constants.js.map ADDED Viewed

	@@ -0,0 +1 @@
1	+ {"version":3,"file":"constants.js","sourceRoot":"","sources":["../../../../src/components/new-trace-viewer/util/constants.ts"],"names":[],"mappings":"","sourcesContent":[""]}

package/dist/components/new-trace-viewer/utils.d.ts ADDED Viewed

@@ -0,0 +1,42 @@
+import type { Span } from '../trace-viewer/types';
+export interface RootBounds {
+    startTime: number;
+    endTime: number;
+    duration: number;
+}
+export declare function computeRootBounds(spans: Span[]): RootBounds;
+export declare function getSpanDurationMs(span: Span): number;
+export interface TimeMarker {
+    position: number;
+    label: string;
+    value: number;
+}
+export declare function computeTimeMarkers(viewDuration: number, offset: number): TimeMarker[];
+export interface SpanGap {
+    gapMs: number;
+    leftFrac: number;
+    rightFrac: number;
+    rowIndex: number;
+}
+export declare function computeSpanGaps(spans: Span[], viewStart: number, viewEnd: number): SpanGap[];
+export declare const RESOURCE_COLORS: Record<string, {
+    bar: string;
+    errorBar?: string;
+}>;
+export declare function getResourceColor(resource: string): {
+    bar: string;
+    errorBar?: string;
+};
+export type SegmentStatus = 'queued' | 'running' | 'failed' | 'retrying' | 'succeeded' | 'waiting' | 'sleeping' | 'received';
+export interface Segment {
+    startFraction: number;
+    endFraction: number;
+    status: SegmentStatus;
+}
+/**
+ * Compute event-based segments for a span. Dispatches on `span.resource`
+ * to the appropriate resource-type-specific segment builder.
+ * Returns an empty array for generic (non-workflow) spans.
+ */
+export declare function computeSpanSegments(span: Span): Segment[];
+//# sourceMappingURL=utils.d.ts.map

package/dist/components/new-trace-viewer/utils.d.ts.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"utils.d.ts","sourceRoot":"","sources":["../../../src/components/new-trace-viewer/utils.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,IAAI,EAAa,MAAM,uBAAuB,CAAC;AAO7D,MAAM,WAAW,UAAU;IACzB,SAAS,EAAE,MAAM,CAAC;IAClB,OAAO,EAAE,MAAM,CAAC;IAChB,QAAQ,EAAE,MAAM,CAAC;CAClB;AAED,wBAAgB,iBAAiB,CAAC,KAAK,EAAE,IAAI,EAAE,GAAG,UAAU,CAiB3D;AAED,wBAAgB,iBAAiB,CAAC,IAAI,EAAE,IAAI,GAAG,MAAM,CAKpD;AAMD,MAAM,WAAW,UAAU;IACzB,QAAQ,EAAE,MAAM,CAAC;IACjB,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,MAAM,CAAC;CACf;AAkBD,wBAAgB,kBAAkB,CAChC,YAAY,EAAE,MAAM,EACpB,MAAM,EAAE,MAAM,GACb,UAAU,EAAE,CAqBd;AAMD,MAAM,WAAW,OAAO;IACtB,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,EAAE,MAAM,CAAC;IACjB,SAAS,EAAE,MAAM,CAAC;IAClB,QAAQ,EAAE,MAAM,CAAC;CAClB;AAED,wBAAgB,eAAe,CAC7B,KAAK,EAAE,IAAI,EAAE,EACb,SAAS,EAAE,MAAM,EACjB,OAAO,EAAE,MAAM,GACd,OAAO,EAAE,CAkBX;AAMD,eAAO,MAAM,eAAe,EAAE,MAAM,CAClC,MAAM,EACN;IAAE,GAAG,EAAE,MAAM,CAAC;IAAC,QAAQ,CAAC,EAAE,MAAM,CAAA;CAAE,CAOnC,CAAC;AAEF,wBAAgB,gBAAgB,CAAC,QAAQ,EAAE,MAAM,GAAG;IAClD,GAAG,EAAE,MAAM,CAAC;IACZ,QAAQ,CAAC,EAAE,MAAM,CAAC;CACnB,CAEA;AAMD,MAAM,MAAM,aAAa,GACrB,QAAQ,GACR,SAAS,GACT,QAAQ,GACR,UAAU,GACV,WAAW,GACX,SAAS,GACT,UAAU,GACV,UAAU,CAAC;AAEf,MAAM,WAAW,OAAO;IACtB,aAAa,EAAE,MAAM,CAAC;IACtB,WAAW,EAAE,MAAM,CAAC;IACpB,MAAM,EAAE,aAAa,CAAC;CACvB;AA6PD;;;;GAIG;AACH,wBAAgB,mBAAmB,CAAC,IAAI,EAAE,IAAI,GAAG,OAAO,EAAE,CAyBzD"}