@perses-dev/tracing-gantt-chart-plugin 0.13.0 → 0.14.0-beta.2

package/lib/PanelActions.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/PanelActions.tsx"],"sourcesContent":["// Copyright The Perses Authors\n// Licensed under the Apache License, Version 2.0 (the \"License\");\n// you may not use this file except in compliance with the License.\n// You may obtain a copy of the License at\n//\n// http://www.apache.org/licenses/LICENSE-2.0\n//\n// Unless required by applicable law or agreed to in writing, software\n// distributed under the License is distributed on an \"AS IS\" BASIS,\n// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n// See the License for the specific language governing permissions and\n// limitations under the License.\n\nimport { InfoTooltip } from '@perses-dev/components';\n\nimport DownloadIcon from 'mdi-material-ui/DownloadOutline';\nimport { ReactElement, useCallback } from 'react';\nimport { HeaderIconButton } from '@perses-dev/dashboards';\nimport * as otlptracev1 from '@perses-dev/spec/dist/dashboard/query-type/otlp/trace/v1/trace';\nimport { TracingGanttChartPanelProps } from './TracingGanttChartPanel';\n\nexport function DownloadTraceAction(props: TracingGanttChartPanelProps): ReactElement | null {\n  const { queryResults } = props;\n  const trace = queryResults[0]?.data?.trace;\n\n  const handleClick = useCallback(() => {\n    if (!trace) return;\n\n    const data = JSON.stringify(trace, null, 2);\n    const filename = getFilename(trace);\n    downloadFile(filename, 'application/json', data);\n  }, [trace]);\n\n  if (!trace) {\n    return null;\n  }\n\n  return (\n    <InfoTooltip description=\"download OTLP/JSON trace\">\n      <HeaderIconButton aria-label=\"download OTLP/JSON trace\" size=\"small\" onClick={handleClick}>\n        <DownloadIcon fontSize=\"inherit\" />\n      </HeaderIconButton>\n    </InfoTooltip>\n  );\n}\n\n/**\n * A trace can only contain spans with the same trace id. Therefore, let's return the trace id of the first span.\n * Exported for tests only.\n */\nexport function getFilename(trace: otlptracev1.TracesData): string {\n  for (const resourceSpan of trace.resourceSpans) {\n    for (const scopeSpan of resourceSpan.scopeSpans) {\n      for (const span of scopeSpan.spans) {\n        return `${span.traceId}.json`;\n      }\n    }\n  }\n\n  return 'trace.json';\n}\n\nfunction downloadFile(filename: string, type: string, data: string): void {\n  const url = URL.createObjectURL(new Blob([data], { type }));\n\n  const link = document.createElement('a');\n  link.download = filename;\n  link.href = url;\n  link.click();\n\n  URL.revokeObjectURL(url);\n}\n"],"names":["InfoTooltip","DownloadIcon","useCallback","HeaderIconButton","DownloadTraceAction","props","queryResults","trace","data","handleClick","JSON","stringify","filename","getFilename","downloadFile","description","aria-label","size","onClick","fontSize","resourceSpan","resourceSpans","scopeSpan","scopeSpans","span","spans","traceId","type","url","URL","createObjectURL","Blob","link","document","createElement","download","href","click","revokeObjectURL"],"mappings":";AAAA,+BAA+B;AAC/B,kEAAkE;AAClE,mEAAmE;AACnE,0CAA0C;AAC1C,EAAE;AACF,6CAA6C;AAC7C,EAAE;AACF,sEAAsE;AACtE,oEAAoE;AACpE,2EAA2E;AAC3E,sEAAsE;AACtE,iCAAiC;AAEjC,SAASA,WAAW,QAAQ,yBAAyB;AAErD,OAAOC,kBAAkB,kCAAkC;AAC3D,SAAuBC,WAAW,QAAQ,QAAQ;AAClD,SAASC,gBAAgB,QAAQ,yBAAyB;AAI1D,OAAO,SAASC,oBAAoBC,KAAkC;IACpE,MAAM,EAAEC,YAAY,EAAE,GAAGD;IACzB,MAAME,QAAQD,YAAY,CAAC,EAAE,EAAEE,MAAMD;IAErC,MAAME,cAAcP,YAAY;QAC9B,IAAI,CAACK,OAAO;QAEZ,MAAMC,OAAOE,KAAKC,SAAS,CAACJ,OAAO,MAAM;QACzC,MAAMK,WAAWC,YAAYN;QAC7BO,aAAaF,UAAU,oBAAoBJ;IAC7C,GAAG;QAACD;KAAM;IAEV,IAAI,CAACA,OAAO;QACV,OAAO;IACT;IAEA,qBACE,KAACP;QAAYe,aAAY;kBACvB,cAAA,KAACZ;YAAiBa,cAAW;YAA2BC,MAAK;YAAQC,SAAST;sBAC5E,cAAA,KAACR;gBAAakB,UAAS;;;;AAI/B;AAEA;;;CAGC,GACD,OAAO,SAASN,YAAYN,KAA6B;IACvD,KAAK,MAAMa,gBAAgBb,MAAMc,aAAa,CAAE;QAC9C,KAAK,MAAMC,aAAaF,aAAaG,UAAU,CAAE;YAC/C,KAAK,MAAMC,QAAQF,UAAUG,KAAK,CAAE;gBAClC,OAAO,GAAGD,KAAKE,OAAO,CAAC,KAAK,CAAC;YAC/B;QACF;IACF;IAEA,OAAO;AACT;AAEA,SAASZ,aAAaF,QAAgB,EAAEe,IAAY,EAAEnB,IAAY;IAChE,MAAMoB,MAAMC,IAAIC,eAAe,CAAC,IAAIC,KAAK;QAACvB;KAAK,EAAE;QAAEmB;IAAK;IAExD,MAAMK,OAAOC,SAASC,aAAa,CAAC;IACpCF,KAAKG,QAAQ,GAAGvB;IAChBoB,KAAKI,IAAI,GAAGR;IACZI,KAAKK,KAAK;IAEVR,IAAIS,eAAe,CAACV;AACtB"}
+{"version":3,"sources":["../../src/PanelActions.tsx"],"sourcesContent":["// Copyright The Perses Authors\n// Licensed under the Apache License, Version 2.0 (the \"License\");\n// you may not use this file except in compliance with the License.\n// You may obtain a copy of the License at\n//\n// http://www.apache.org/licenses/LICENSE-2.0\n//\n// Unless required by applicable law or agreed to in writing, software\n// distributed under the License is distributed on an \"AS IS\" BASIS,\n// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n// See the License for the specific language governing permissions and\n// limitations under the License.\n\nimport { InfoTooltip } from '@perses-dev/components';\nimport { HeaderIconButton } from '@perses-dev/dashboards';\nimport type * as otlptracev1 from '@perses-dev/spec/dist/dashboard/query-type/otlp/trace/v1/trace';\nimport DownloadIcon from 'mdi-material-ui/DownloadOutline';\nimport type { ReactElement } from 'react';\nimport { useCallback } from 'react';\n\nimport type { TracingGanttChartPanelProps } from './TracingGanttChartPanel';\n\nexport function DownloadTraceAction(props: TracingGanttChartPanelProps): ReactElement | null {\n  const { queryResults } = props;\n  const trace = queryResults[0]?.data?.trace;\n\n  const handleClick = useCallback(() => {\n    if (!trace) return;\n\n    const data = JSON.stringify(trace, null, 2);\n    const filename = getFilename(trace);\n    downloadFile(filename, 'application/json', data);\n  }, [trace]);\n\n  if (!trace) {\n    return null;\n  }\n\n  return (\n    <InfoTooltip description=\"download OTLP/JSON trace\">\n      <HeaderIconButton aria-label=\"download OTLP/JSON trace\" size=\"small\" onClick={handleClick}>\n        <DownloadIcon fontSize=\"inherit\" />\n      </HeaderIconButton>\n    </InfoTooltip>\n  );\n}\n\n/**\n * A trace can only contain spans with the same trace id. Therefore, let's return the trace id of the first span.\n * Exported for tests only.\n */\nexport function getFilename(trace: otlptracev1.TracesData): string {\n  for (const resourceSpan of trace.resourceSpans) {\n    for (const scopeSpan of resourceSpan.scopeSpans) {\n      for (const span of scopeSpan.spans) {\n        return `${span.traceId}.json`;\n      }\n    }\n  }\n\n  return 'trace.json';\n}\n\nfunction downloadFile(filename: string, type: string, data: string): void {\n  const url = URL.createObjectURL(new Blob([data], { type }));\n\n  const link = document.createElement('a');\n  link.download = filename;\n  link.href = url;\n  link.click();\n\n  URL.revokeObjectURL(url);\n}\n"],"names":["InfoTooltip","HeaderIconButton","DownloadIcon","useCallback","DownloadTraceAction","props","queryResults","trace","data","handleClick","JSON","stringify","filename","getFilename","downloadFile","description","aria-label","size","onClick","fontSize","resourceSpan","resourceSpans","scopeSpan","scopeSpans","span","spans","traceId","type","url","URL","createObjectURL","Blob","link","document","createElement","download","href","click","revokeObjectURL"],"mappings":";AAAA,+BAA+B;AAC/B,kEAAkE;AAClE,mEAAmE;AACnE,0CAA0C;AAC1C,EAAE;AACF,6CAA6C;AAC7C,EAAE;AACF,sEAAsE;AACtE,oEAAoE;AACpE,2EAA2E;AAC3E,sEAAsE;AACtE,iCAAiC;AAEjC,SAASA,WAAW,QAAQ,yBAAyB;AACrD,SAASC,gBAAgB,QAAQ,yBAAyB;AAE1D,OAAOC,kBAAkB,kCAAkC;AAE3D,SAASC,WAAW,QAAQ,QAAQ;AAIpC,OAAO,SAASC,oBAAoBC,KAAkC;IACpE,MAAM,EAAEC,YAAY,EAAE,GAAGD;IACzB,MAAME,QAAQD,YAAY,CAAC,EAAE,EAAEE,MAAMD;IAErC,MAAME,cAAcN,YAAY;QAC9B,IAAI,CAACI,OAAO;QAEZ,MAAMC,OAAOE,KAAKC,SAAS,CAACJ,OAAO,MAAM;QACzC,MAAMK,WAAWC,YAAYN;QAC7BO,aAAaF,UAAU,oBAAoBJ;IAC7C,GAAG;QAACD;KAAM;IAEV,IAAI,CAACA,OAAO;QACV,OAAO;IACT;IAEA,qBACE,KAACP;QAAYe,aAAY;kBACvB,cAAA,KAACd;YAAiBe,cAAW;YAA2BC,MAAK;YAAQC,SAAST;sBAC5E,cAAA,KAACP;gBAAaiB,UAAS;;;;AAI/B;AAEA;;;CAGC,GACD,OAAO,SAASN,YAAYN,KAA6B;IACvD,KAAK,MAAMa,gBAAgBb,MAAMc,aAAa,CAAE;QAC9C,KAAK,MAAMC,aAAaF,aAAaG,UAAU,CAAE;YAC/C,KAAK,MAAMC,QAAQF,UAAUG,KAAK,CAAE;gBAClC,OAAO,GAAGD,KAAKE,OAAO,CAAC,KAAK,CAAC;YAC/B;QACF;IACF;IAEA,OAAO;AACT;AAEA,SAASZ,aAAaF,QAAgB,EAAEe,IAAY,EAAEnB,IAAY;IAChE,MAAMoB,MAAMC,IAAIC,eAAe,CAAC,IAAIC,KAAK;QAACvB;KAAK,EAAE;QAAEmB;IAAK;IAExD,MAAMK,OAAOC,SAASC,aAAa,CAAC;IACpCF,KAAKG,QAAQ,GAAGvB;IAChBoB,KAAKI,IAAI,GAAGR;IACZI,KAAKK,KAAK;IAEVR,IAAIS,eAAe,CAACV;AACtB"}

package/lib/TracingGanttChart/DetailPane/Attributes.d.ts

@@ -1,7 +1,7 @@
-import { ReactElement } from 'react';
-import * as oltpcommonv1 from '@perses-dev/spec/dist/dashboard/query-type/otlp/common/v1/common';
-import { Span, Trace } from '../trace';
-import { CustomLinks } from '../../gantt-chart-model';
+import type * as oltpcommonv1 from '@perses-dev/spec/dist/dashboard/query-type/otlp/common/v1/common';
+import type { ReactElement } from 'react';
+import type { CustomLinks } from '../../gantt-chart-model';
+import type { Span, Trace } from '../trace';
 export interface TraceAttributesProps {
     customLinks?: CustomLinks;
     trace: Trace;

package/lib/TracingGanttChart/DetailPane/Attributes.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Attributes.d.ts","sourceRoot":"","sources":["../../../../src/TracingGanttChart/DetailPane/Attributes.tsx"],"names":[],"mappings":"AAaA,OAAO,EAAE,YAAY,EAAW,MAAM,OAAO,CAAC;AAG9C,OAAO,KAAK,YAAY,MAAM,kEAAkE,CAAC;AACjG,OAAO,EAAE,IAAI,EAAE,KAAK,EAAE,MAAM,UAAU,CAAC;AAEvC,OAAO,EAAE,WAAW,EAAE,MAAM,yBAAyB,CAAC;AAEtD,MAAM,WAAW,oBAAoB;IACnC,WAAW,CAAC,EAAE,WAAW,CAAC;IAC1B,KAAK,EAAE,KAAK,CAAC;IACb,IAAI,EAAE,IAAI,CAAC;CACZ;AAED,wBAAgB,eAAe,CAAC,KAAK,EAAE,oBAAoB,GAAG,YAAY,CAiDzE;AAED,MAAM,WAAW,kBAAkB;IACjC,WAAW,CAAC,EAAE,WAAW,CAAC;IAC1B,UAAU,EAAE,YAAY,CAAC,QAAQ,EAAE,CAAC;CACrC;AAED,wBAAgB,aAAa,CAAC,KAAK,EAAE,kBAAkB,GAAG,YAAY,CAQrE;AAED,UAAU,mBAAmB;IAC3B,WAAW,CAAC,EAAE,WAAW,CAAC;IAC1B,UAAU,EAAE,YAAY,CAAC,QAAQ,EAAE,CAAC;CACrC;AAED,wBAAgB,cAAc,CAAC,KAAK,EAAE,mBAAmB,GAAG,YAAY,CAqCvE;AAED,UAAU,kBAAkB;IAC1B,IAAI,EAAE,MAAM,CAAC;IACb,KAAK,EAAE,MAAM,CAAC;IACd,IAAI,CAAC,EAAE,MAAM,CAAC;CACf;AAED,wBAAgB,aAAa,CAAC,KAAK,EAAE,kBAAkB,GAAG,YAAY,CAyBrE;AAED,wBAAgB,oBAAoB,CAAC,KAAK,EAAE,YAAY,CAAC,QAAQ,GAAG,MAAM,CAUzE"}
+{"version":3,"file":"Attributes.d.ts","sourceRoot":"","sources":["../../../../src/TracingGanttChart/DetailPane/Attributes.tsx"],"names":[],"mappings":"AAeA,OAAO,KAAK,KAAK,YAAY,MAAM,kEAAkE,CAAC;AACtG,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,OAAO,CAAC;AAG1C,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,yBAAyB,CAAC;AAC3D,OAAO,KAAK,EAAE,IAAI,EAAE,KAAK,EAAE,MAAM,UAAU,CAAC;AAG5C,MAAM,WAAW,oBAAoB;IACnC,WAAW,CAAC,EAAE,WAAW,CAAC;IAC1B,KAAK,EAAE,KAAK,CAAC;IACb,IAAI,EAAE,IAAI,CAAC;CACZ;AAED,wBAAgB,eAAe,CAAC,KAAK,EAAE,oBAAoB,GAAG,YAAY,CAiDzE;AAED,MAAM,WAAW,kBAAkB;IACjC,WAAW,CAAC,EAAE,WAAW,CAAC;IAC1B,UAAU,EAAE,YAAY,CAAC,QAAQ,EAAE,CAAC;CACrC;AAED,wBAAgB,aAAa,CAAC,KAAK,EAAE,kBAAkB,GAAG,YAAY,CAQrE;AAED,UAAU,mBAAmB;IAC3B,WAAW,CAAC,EAAE,WAAW,CAAC;IAC1B,UAAU,EAAE,YAAY,CAAC,QAAQ,EAAE,CAAC;CACrC;AAED,wBAAgB,cAAc,CAAC,KAAK,EAAE,mBAAmB,GAAG,YAAY,CAqCvE;AAED,UAAU,kBAAkB;IAC1B,IAAI,EAAE,MAAM,CAAC;IACb,KAAK,EAAE,MAAM,CAAC;IACd,IAAI,CAAC,EAAE,MAAM,CAAC;CACf;AAED,wBAAgB,aAAa,CAAC,KAAK,EAAE,kBAAkB,GAAG,YAAY,CAyBrE;AAED,wBAAgB,oBAAoB,CAAC,KAAK,EAAE,YAAY,CAAC,QAAQ,GAAG,MAAM,CAUzE"}

package/lib/TracingGanttChart/DetailPane/Attributes.js

@@ -11,10 +11,10 @@ import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-run
 // WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 // See the License for the specific language governing permissions and
 // limitations under the License.
-import { useMemo } from 'react';
-import { Divider, Link, List, ListItem, ListItemText } from '@mui/material';
-import { replaceVariablesInString, useAllVariableValues, useRouterContext } from '@perses-dev/plugin-system';
-import { formatDuration } from '../utils';
+import { Divider, Link, List, ListItem, ListItemText } from "@mui/material";
+import { replaceVariablesInString, useAllVariableValues, useRouterContext } from "@perses-dev/plugin-system";
+import { useMemo } from "react";
+import { formatDuration } from "../utils.js";
 export function TraceAttributes(props) {
     const { customLinks, trace, span } = props;
     return /*#__PURE__*/ _jsxs(_Fragment, {

package/lib/TracingGanttChart/DetailPane/Attributes.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/TracingGanttChart/DetailPane/Attributes.tsx"],"sourcesContent":["// Copyright The Perses Authors\n// Licensed under the Apache License, Version 2.0 (the \"License\");\n// you may not use this file except in compliance with the License.\n// You may obtain a copy of the License at\n//\n// http://www.apache.org/licenses/LICENSE-2.0\n//\n// Unless required by applicable law or agreed to in writing, software\n// distributed under the License is distributed on an \"AS IS\" BASIS,\n// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n// See the License for the specific language governing permissions and\n// limitations under the License.\n\nimport { ReactElement, useMemo } from 'react';\nimport { Divider, Link, List, ListItem, ListItemText } from '@mui/material';\nimport { replaceVariablesInString, useAllVariableValues, useRouterContext } from '@perses-dev/plugin-system';\nimport * as oltpcommonv1 from '@perses-dev/spec/dist/dashboard/query-type/otlp/common/v1/common';\nimport { Span, Trace } from '../trace';\nimport { formatDuration } from '../utils';\nimport { CustomLinks } from '../../gantt-chart-model';\n\nexport interface TraceAttributesProps {\n  customLinks?: CustomLinks;\n  trace: Trace;\n  span: Span;\n}\n\nexport function TraceAttributes(props: TraceAttributesProps): ReactElement {\n  const { customLinks, trace, span } = props;\n\n  return (\n    <>\n      <List>\n        <AttributeItem name=\"span ID\" value={span.spanId} />\n        <AttributeItem name=\"start\" value={formatDuration(span.startTimeUnixMs - trace.startTimeUnixMs)} />\n        <AttributeItem name=\"duration\" value={formatDuration(span.endTimeUnixMs - span.startTimeUnixMs)} />\n        {span.kind && <AttributeItem name=\"kind\" value={span.kind} />}\n        {span.status.code && <AttributeItem name=\"status code\" value={span.status.code} />}\n        {span.status.message && <AttributeItem name=\"status message\" value={span.status.message} />}\n      </List>\n\n      {span.attributes.length > 0 && (\n        <>\n          <Divider />\n          <AttributeList\n            customLinks={customLinks}\n            attributes={span.attributes.toSorted((a, b) => a.key.localeCompare(b.key))}\n          />\n        </>\n      )}\n\n      {span.resource.attributes.length > 0 && (\n        <>\n          <Divider />\n          <AttributeList\n            customLinks={customLinks}\n            attributes={span.resource.attributes.toSorted((a, b) => a.key.localeCompare(b.key))}\n          />\n        </>\n      )}\n\n      {(span.scope.name || span.scope.version || (span.scope.attributes && span.scope.attributes.length > 0)) && (\n        <>\n          <Divider />\n          <List>\n            {span.scope.name && <AttributeItem name=\"scope name\" value={span.scope.name} />}\n            {span.scope.version && <AttributeItem name=\"scope version\" value={span.scope.version} />}\n            <AttributeItems\n              customLinks={customLinks}\n              attributes={(span.scope.attributes ?? []).toSorted((a, b) => a.key.localeCompare(b.key))}\n            />\n          </List>\n        </>\n      )}\n    </>\n  );\n}\n\nexport interface AttributeListProps {\n  customLinks?: CustomLinks;\n  attributes: oltpcommonv1.KeyValue[];\n}\n\nexport function AttributeList(props: AttributeListProps): ReactElement {\n  const { customLinks, attributes } = props;\n\n  return (\n    <List>\n      <AttributeItems customLinks={customLinks} attributes={attributes} />\n    </List>\n  );\n}\n\ninterface AttributeItemsProps {\n  customLinks?: CustomLinks;\n  attributes: oltpcommonv1.KeyValue[];\n}\n\nexport function AttributeItems(props: AttributeItemsProps): ReactElement {\n  const { customLinks, attributes } = props;\n  const variableValues = useAllVariableValues();\n\n  // turn array into map for fast access\n  const attributeLinks = useMemo(() => {\n    const attrs = (customLinks?.links.attributes ?? []).map((a) => [a.name, a.link]);\n    return Object.fromEntries(attrs);\n  }, [customLinks]);\n\n  // some links require access to other attributes, for example a pod link \"/namespace/${k8s_namespace_name}/pod/${k8s_pod_name}\"\n  const extraVariables = useMemo(() => {\n    // replace dot with underscore in attribute name, because dot is not allowed in variable names\n    const stringAttrs = attributes.map((attr) => [attr.key.replaceAll('.', '_'), renderAttributeValue(attr.value)]);\n\n    return {\n      ...customLinks?.variables,\n      ...Object.fromEntries(stringAttrs),\n    };\n  }, [customLinks, attributes]);\n\n  return (\n    <>\n      {attributes.map((attribute, i) => (\n        <AttributeItem\n          key={i}\n          name={attribute.key}\n          value={renderAttributeValue(attribute.value)}\n          link={\n            attributeLinks[attribute.key]\n              ? replaceVariablesInString(attributeLinks[attribute.key], variableValues, extraVariables)\n              : undefined\n          }\n        />\n      ))}\n    </>\n  );\n}\n\ninterface AttributeItemProps {\n  name: string;\n  value: string;\n  link?: string;\n}\n\nexport function AttributeItem(props: AttributeItemProps): ReactElement {\n  const { name, value, link } = props;\n  const { RouterComponent } = useRouterContext();\n\n  const valueComponent =\n    RouterComponent && link ? (\n      <Link component={RouterComponent} to={link}>\n        {value}\n      </Link>\n    ) : (\n      value\n    );\n\n  return (\n    <ListItem sx={{ px: 1, py: 0 }}>\n      <ListItemText\n        primary={name}\n        secondary={valueComponent}\n        slotProps={{\n          primary: { variant: 'h5' },\n          secondary: { variant: 'body1', sx: { wordBreak: 'break-word' } },\n        }}\n      />\n    </ListItem>\n  );\n}\n\nexport function renderAttributeValue(value: oltpcommonv1.AnyValue): string {\n  if ('stringValue' in value) return value.stringValue || '<empty string>';\n  if ('intValue' in value) return value.intValue;\n  if ('doubleValue' in value) return String(value.doubleValue);\n  if ('boolValue' in value) return String(value.boolValue);\n  if ('arrayValue' in value) {\n    const values = value.arrayValue.values;\n    return values && values.length > 0 ? values.map(renderAttributeValue).join(', ') : '<empty array>';\n  }\n  return '<unknown type>';\n}\n"],"names":["useMemo","Divider","Link","List","ListItem","ListItemText","replaceVariablesInString","useAllVariableValues","useRouterContext","formatDuration","TraceAttributes","props","customLinks","trace","span","AttributeItem","name","value","spanId","startTimeUnixMs","endTimeUnixMs","kind","status","code","message","attributes","length","AttributeList","toSorted","a","b","key","localeCompare","resource","scope","version","AttributeItems","variableValues","attributeLinks","attrs","links","map","link","Object","fromEntries","extraVariables","stringAttrs","attr","replaceAll","renderAttributeValue","variables","attribute","i","undefined","RouterComponent","valueComponent","component","to","sx","px","py","primary","secondary","slotProps","variant","wordBreak","stringValue","intValue","String","doubleValue","boolValue","values","arrayValue","join"],"mappings":"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"}
+{"version":3,"sources":["../../../../src/TracingGanttChart/DetailPane/Attributes.tsx"],"sourcesContent":["// Copyright The Perses Authors\n// Licensed under the Apache License, Version 2.0 (the \"License\");\n// you may not use this file except in compliance with the License.\n// You may obtain a copy of the License at\n//\n// http://www.apache.org/licenses/LICENSE-2.0\n//\n// Unless required by applicable law or agreed to in writing, software\n// distributed under the License is distributed on an \"AS IS\" BASIS,\n// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n// See the License for the specific language governing permissions and\n// limitations under the License.\n\nimport { Divider, Link, List, ListItem, ListItemText } from '@mui/material';\nimport { replaceVariablesInString, useAllVariableValues, useRouterContext } from '@perses-dev/plugin-system';\nimport type * as oltpcommonv1 from '@perses-dev/spec/dist/dashboard/query-type/otlp/common/v1/common';\nimport type { ReactElement } from 'react';\nimport { useMemo } from 'react';\n\nimport type { CustomLinks } from '../../gantt-chart-model';\nimport type { Span, Trace } from '../trace';\nimport { formatDuration } from '../utils';\n\nexport interface TraceAttributesProps {\n  customLinks?: CustomLinks;\n  trace: Trace;\n  span: Span;\n}\n\nexport function TraceAttributes(props: TraceAttributesProps): ReactElement {\n  const { customLinks, trace, span } = props;\n\n  return (\n    <>\n      <List>\n        <AttributeItem name=\"span ID\" value={span.spanId} />\n        <AttributeItem name=\"start\" value={formatDuration(span.startTimeUnixMs - trace.startTimeUnixMs)} />\n        <AttributeItem name=\"duration\" value={formatDuration(span.endTimeUnixMs - span.startTimeUnixMs)} />\n        {span.kind && <AttributeItem name=\"kind\" value={span.kind} />}\n        {span.status.code && <AttributeItem name=\"status code\" value={span.status.code} />}\n        {span.status.message && <AttributeItem name=\"status message\" value={span.status.message} />}\n      </List>\n\n      {span.attributes.length > 0 && (\n        <>\n          <Divider />\n          <AttributeList\n            customLinks={customLinks}\n            attributes={span.attributes.toSorted((a, b) => a.key.localeCompare(b.key))}\n          />\n        </>\n      )}\n\n      {span.resource.attributes.length > 0 && (\n        <>\n          <Divider />\n          <AttributeList\n            customLinks={customLinks}\n            attributes={span.resource.attributes.toSorted((a, b) => a.key.localeCompare(b.key))}\n          />\n        </>\n      )}\n\n      {(span.scope.name || span.scope.version || (span.scope.attributes && span.scope.attributes.length > 0)) && (\n        <>\n          <Divider />\n          <List>\n            {span.scope.name && <AttributeItem name=\"scope name\" value={span.scope.name} />}\n            {span.scope.version && <AttributeItem name=\"scope version\" value={span.scope.version} />}\n            <AttributeItems\n              customLinks={customLinks}\n              attributes={(span.scope.attributes ?? []).toSorted((a, b) => a.key.localeCompare(b.key))}\n            />\n          </List>\n        </>\n      )}\n    </>\n  );\n}\n\nexport interface AttributeListProps {\n  customLinks?: CustomLinks;\n  attributes: oltpcommonv1.KeyValue[];\n}\n\nexport function AttributeList(props: AttributeListProps): ReactElement {\n  const { customLinks, attributes } = props;\n\n  return (\n    <List>\n      <AttributeItems customLinks={customLinks} attributes={attributes} />\n    </List>\n  );\n}\n\ninterface AttributeItemsProps {\n  customLinks?: CustomLinks;\n  attributes: oltpcommonv1.KeyValue[];\n}\n\nexport function AttributeItems(props: AttributeItemsProps): ReactElement {\n  const { customLinks, attributes } = props;\n  const variableValues = useAllVariableValues();\n\n  // turn array into map for fast access\n  const attributeLinks = useMemo(() => {\n    const attrs = (customLinks?.links.attributes ?? []).map((a) => [a.name, a.link]);\n    return Object.fromEntries(attrs);\n  }, [customLinks]);\n\n  // some links require access to other attributes, for example a pod link \"/namespace/${k8s_namespace_name}/pod/${k8s_pod_name}\"\n  const extraVariables = useMemo(() => {\n    // replace dot with underscore in attribute name, because dot is not allowed in variable names\n    const stringAttrs = attributes.map((attr) => [attr.key.replaceAll('.', '_'), renderAttributeValue(attr.value)]);\n\n    return {\n      ...customLinks?.variables,\n      ...Object.fromEntries(stringAttrs),\n    };\n  }, [customLinks, attributes]);\n\n  return (\n    <>\n      {attributes.map((attribute, i) => (\n        <AttributeItem\n          key={i}\n          name={attribute.key}\n          value={renderAttributeValue(attribute.value)}\n          link={\n            attributeLinks[attribute.key]\n              ? replaceVariablesInString(attributeLinks[attribute.key], variableValues, extraVariables)\n              : undefined\n          }\n        />\n      ))}\n    </>\n  );\n}\n\ninterface AttributeItemProps {\n  name: string;\n  value: string;\n  link?: string;\n}\n\nexport function AttributeItem(props: AttributeItemProps): ReactElement {\n  const { name, value, link } = props;\n  const { RouterComponent } = useRouterContext();\n\n  const valueComponent =\n    RouterComponent && link ? (\n      <Link component={RouterComponent} to={link}>\n        {value}\n      </Link>\n    ) : (\n      value\n    );\n\n  return (\n    <ListItem sx={{ px: 1, py: 0 }}>\n      <ListItemText\n        primary={name}\n        secondary={valueComponent}\n        slotProps={{\n          primary: { variant: 'h5' },\n          secondary: { variant: 'body1', sx: { wordBreak: 'break-word' } },\n        }}\n      />\n    </ListItem>\n  );\n}\n\nexport function renderAttributeValue(value: oltpcommonv1.AnyValue): string {\n  if ('stringValue' in value) return value.stringValue || '<empty string>';\n  if ('intValue' in value) return value.intValue;\n  if ('doubleValue' in value) return String(value.doubleValue);\n  if ('boolValue' in value) return String(value.boolValue);\n  if ('arrayValue' in value) {\n    const values = value.arrayValue.values;\n    return values && values.length > 0 ? values.map(renderAttributeValue).join(', ') : '<empty array>';\n  }\n  return '<unknown type>';\n}\n"],"names":["Divider","Link","List","ListItem","ListItemText","replaceVariablesInString","useAllVariableValues","useRouterContext","useMemo","formatDuration","TraceAttributes","props","customLinks","trace","span","AttributeItem","name","value","spanId","startTimeUnixMs","endTimeUnixMs","kind","status","code","message","attributes","length","AttributeList","toSorted","a","b","key","localeCompare","resource","scope","version","AttributeItems","variableValues","attributeLinks","attrs","links","map","link","Object","fromEntries","extraVariables","stringAttrs","attr","replaceAll","renderAttributeValue","variables","attribute","i","undefined","RouterComponent","valueComponent","component","to","sx","px","py","primary","secondary","slotProps","variant","wordBreak","stringValue","intValue","String","doubleValue","boolValue","values","arrayValue","join"],"mappings":"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"}

package/lib/TracingGanttChart/DetailPane/DetailPane.d.ts

@@ -1,6 +1,6 @@
-import { ReactElement } from 'react';
-import { Span, Trace } from '../trace';
-import { CustomLinks } from '../../gantt-chart-model';
+import type { ReactElement } from 'react';
+import type { CustomLinks } from '../../gantt-chart-model';
+import type { Span, Trace } from '../trace';
 export interface DetailPaneProps {
     customLinks?: CustomLinks;
     trace: Trace;

package/lib/TracingGanttChart/DetailPane/DetailPane.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"DetailPane.d.ts","sourceRoot":"","sources":["../../../../src/TracingGanttChart/DetailPane/DetailPane.tsx"],"names":[],"mappings":"AAcA,OAAO,EAAE,YAAY,EAAY,MAAM,OAAO,CAAC;AAE/C,OAAO,EAAE,IAAI,EAAE,KAAK,EAAE,MAAM,UAAU,CAAC;AACvC,OAAO,EAAE,WAAW,EAAE,MAAM,yBAAyB,CAAC;AAKtD,MAAM,WAAW,eAAe;IAC9B,WAAW,CAAC,EAAE,WAAW,CAAC;IAC1B,KAAK,EAAE,KAAK,CAAC;IACb,IAAI,EAAE,IAAI,CAAC;IACX,eAAe,EAAE,MAAM,IAAI,CAAC;CAC7B;AAED;;GAEG;AACH,wBAAgB,UAAU,CAAC,KAAK,EAAE,eAAe,GAAG,YAAY,CAmD/D"}
+{"version":3,"file":"DetailPane.d.ts","sourceRoot":"","sources":["../../../../src/TracingGanttChart/DetailPane/DetailPane.tsx"],"names":[],"mappings":"AAeA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,OAAO,CAAC;AAG1C,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,yBAAyB,CAAC;AAC3D,OAAO,KAAK,EAAE,IAAI,EAAE,KAAK,EAAE,MAAM,UAAU,CAAC;AAK5C,MAAM,WAAW,eAAe;IAC9B,WAAW,CAAC,EAAE,WAAW,CAAC;IAC1B,KAAK,EAAE,KAAK,CAAC;IACb,IAAI,EAAE,IAAI,CAAC;IACX,eAAe,EAAE,MAAM,IAAI,CAAC;CAC7B;AAED;;GAEG;AACH,wBAAgB,UAAU,CAAC,KAAK,EAAE,eAAe,GAAG,YAAY,CAmD/D"}

package/lib/TracingGanttChart/DetailPane/DetailPane.js

@@ -11,12 +11,12 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 // WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 // See the License for the specific language governing permissions and
 // limitations under the License.
-import { Box, Chip, IconButton, Tab, Tabs, Typography } from '@mui/material';
-import { useState } from 'react';
-import CloseIcon from 'mdi-material-ui/Close';
-import { TraceAttributes } from './Attributes';
-import { SpanEventList } from './SpanEvents';
-import { SpanLinkList } from './SpanLinks';
+import { Box, Chip, IconButton, Tab, Tabs, Typography } from "@mui/material";
+import CloseIcon from "mdi-material-ui/Close";
+import { useState } from "react";
+import { TraceAttributes } from "./Attributes.js";
+import { SpanEventList } from "./SpanEvents.js";
+import { SpanLinkList } from "./SpanLinks.js";
 /**
  * DetailPane renders a sidebar showing the span attributes etc.
  */ export function DetailPane(props) {

package/lib/TracingGanttChart/DetailPane/DetailPane.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/TracingGanttChart/DetailPane/DetailPane.tsx"],"sourcesContent":["// Copyright The Perses Authors\n// Licensed under the Apache License, Version 2.0 (the \"License\");\n// you may not use this file except in compliance with the License.\n// You may obtain a copy of the License at\n//\n// http://www.apache.org/licenses/LICENSE-2.0\n//\n// Unless required by applicable law or agreed to in writing, software\n// distributed under the License is distributed on an \"AS IS\" BASIS,\n// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n// See the License for the specific language governing permissions and\n// limitations under the License.\n\nimport { Box, Chip, IconButton, Tab, Tabs, Typography } from '@mui/material';\nimport { ReactElement, useState } from 'react';\nimport CloseIcon from 'mdi-material-ui/Close';\nimport { Span, Trace } from '../trace';\nimport { CustomLinks } from '../../gantt-chart-model';\nimport { TraceAttributes } from './Attributes';\nimport { SpanEventList } from './SpanEvents';\nimport { SpanLinkList } from './SpanLinks';\n\nexport interface DetailPaneProps {\n  customLinks?: CustomLinks;\n  trace: Trace;\n  span: Span;\n  onCloseBtnClick: () => void;\n}\n\n/**\n * DetailPane renders a sidebar showing the span attributes etc.\n */\nexport function DetailPane(props: DetailPaneProps): ReactElement {\n  const { customLinks, trace, span, onCloseBtnClick } = props;\n  const [tab, setTab] = useState<'attributes' | 'events' | 'links'>('attributes');\n\n  // if the events tab is selected, and then a span without events is clicked,\n  // we need to switch the current selected tab back to the attributes tab.\n  if (tab === 'events' && span.events.length === 0) {\n    setTab('attributes');\n  }\n  // same as above, but for span links\n  if (tab === 'links' && span.links.length === 0) {\n    setTab('attributes');\n  }\n\n  return (\n    <Box>\n      <IconButton sx={{ float: 'right' }} onClick={onCloseBtnClick}>\n        <CloseIcon />\n      </IconButton>\n      <Typography sx={{ wordBreak: 'break-word' }}>{span.resource.serviceName}</Typography>\n      <Typography variant=\"h2\" sx={{ wordBreak: 'break-word' }}>\n        {span.name}\n      </Typography>\n      <Box sx={{ borderBottom: 1, borderColor: 'divider' }}>\n        <Tabs value={tab} onChange={(_, tab) => setTab(tab)} variant=\"scrollable\">\n          <Tab sx={{ p: 0 }} value=\"attributes\" label=\"Attributes\" />\n          {span.events.length > 0 && (\n            <Tab\n              value=\"events\"\n              label=\"Events\"\n              icon={<Chip label={span.events.length} />}\n              iconPosition=\"end\"\n              sx={{ minHeight: 48, height: 48 }} // MUI Tabs with icon are bigger than those without by default\n            />\n          )}\n          {span.links.length > 0 && (\n            <Tab\n              value=\"links\"\n              label=\"Links\"\n              icon={<Chip label={span.links.length} />}\n              iconPosition=\"end\"\n              sx={{ minHeight: 48, height: 48 }} // MUI Tabs with icon are bigger than those without by default\n            />\n          )}\n        </Tabs>\n      </Box>\n      {tab === 'attributes' && <TraceAttributes customLinks={customLinks} trace={trace} span={span} />}\n      {tab === 'events' && <SpanEventList customLinks={customLinks} trace={trace} span={span} />}\n      {tab === 'links' && <SpanLinkList customLinks={customLinks} span={span} />}\n    </Box>\n  );\n}\n"],"names":["Box","Chip","IconButton","Tab","Tabs","Typography","useState","CloseIcon","TraceAttributes","SpanEventList","SpanLinkList","DetailPane","props","customLinks","trace","span","onCloseBtnClick","tab","setTab","events","length","links","sx","float","onClick","wordBreak","resource","serviceName","variant","name","borderBottom","borderColor","value","onChange","_","p","label","icon","iconPosition","minHeight","height"],"mappings":";AAAA,+BAA+B;AAC/B,kEAAkE;AAClE,mEAAmE;AACnE,0CAA0C;AAC1C,EAAE;AACF,6CAA6C;AAC7C,EAAE;AACF,sEAAsE;AACtE,oEAAoE;AACpE,2EAA2E;AAC3E,sEAAsE;AACtE,iCAAiC;AAEjC,SAASA,GAAG,EAAEC,IAAI,EAAEC,UAAU,EAAEC,GAAG,EAAEC,IAAI,EAAEC,UAAU,QAAQ,gBAAgB;AAC7E,SAAuBC,QAAQ,QAAQ,QAAQ;AAC/C,OAAOC,eAAe,wBAAwB;AAG9C,SAASC,eAAe,QAAQ,eAAe;AAC/C,SAASC,aAAa,QAAQ,eAAe;AAC7C,SAASC,YAAY,QAAQ,cAAc;AAS3C;;CAEC,GACD,OAAO,SAASC,WAAWC,KAAsB;IAC/C,MAAM,EAAEC,WAAW,EAAEC,KAAK,EAAEC,IAAI,EAAEC,eAAe,EAAE,GAAGJ;IACtD,MAAM,CAACK,KAAKC,OAAO,GAAGZ,SAA4C;IAElE,4EAA4E;IAC5E,yEAAyE;IACzE,IAAIW,QAAQ,YAAYF,KAAKI,MAAM,CAACC,MAAM,KAAK,GAAG;QAChDF,OAAO;IACT;IACA,oCAAoC;IACpC,IAAID,QAAQ,WAAWF,KAAKM,KAAK,CAACD,MAAM,KAAK,GAAG;QAC9CF,OAAO;IACT;IAEA,qBACE,MAAClB;;0BACC,KAACE;gBAAWoB,IAAI;oBAAEC,OAAO;gBAAQ;gBAAGC,SAASR;0BAC3C,cAAA,KAACT;;0BAEH,KAACF;gBAAWiB,IAAI;oBAAEG,WAAW;gBAAa;0BAAIV,KAAKW,QAAQ,CAACC,WAAW;;0BACvE,KAACtB;gBAAWuB,SAAQ;gBAAKN,IAAI;oBAAEG,WAAW;gBAAa;0BACpDV,KAAKc,IAAI;;0BAEZ,KAAC7B;gBAAIsB,IAAI;oBAAEQ,cAAc;oBAAGC,aAAa;gBAAU;0BACjD,cAAA,MAAC3B;oBAAK4B,OAAOf;oBAAKgB,UAAU,CAACC,GAAGjB,MAAQC,OAAOD;oBAAMW,SAAQ;;sCAC3D,KAACzB;4BAAImB,IAAI;gCAAEa,GAAG;4BAAE;4BAAGH,OAAM;4BAAaI,OAAM;;wBAC3CrB,KAAKI,MAAM,CAACC,MAAM,GAAG,mBACpB,KAACjB;4BACC6B,OAAM;4BACNI,OAAM;4BACNC,oBAAM,KAACpC;gCAAKmC,OAAOrB,KAAKI,MAAM,CAACC,MAAM;;4BACrCkB,cAAa;4BACbhB,IAAI;gCAAEiB,WAAW;gCAAIC,QAAQ;4BAAG;;wBAGnCzB,KAAKM,KAAK,CAACD,MAAM,GAAG,mBACnB,KAACjB;4BACC6B,OAAM;4BACNI,OAAM;4BACNC,oBAAM,KAACpC;gCAAKmC,OAAOrB,KAAKM,KAAK,CAACD,MAAM;;4BACpCkB,cAAa;4BACbhB,IAAI;gCAAEiB,WAAW;gCAAIC,QAAQ;4BAAG;;;;;YAKvCvB,QAAQ,8BAAgB,KAACT;gBAAgBK,aAAaA;gBAAaC,OAAOA;gBAAOC,MAAMA;;YACvFE,QAAQ,0BAAY,KAACR;gBAAcI,aAAaA;gBAAaC,OAAOA;gBAAOC,MAAMA;;YACjFE,QAAQ,yBAAW,KAACP;gBAAaG,aAAaA;gBAAaE,MAAMA;;;;AAGxE"}
+{"version":3,"sources":["../../../../src/TracingGanttChart/DetailPane/DetailPane.tsx"],"sourcesContent":["// Copyright The Perses Authors\n// Licensed under the Apache License, Version 2.0 (the \"License\");\n// you may not use this file except in compliance with the License.\n// You may obtain a copy of the License at\n//\n// http://www.apache.org/licenses/LICENSE-2.0\n//\n// Unless required by applicable law or agreed to in writing, software\n// distributed under the License is distributed on an \"AS IS\" BASIS,\n// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n// See the License for the specific language governing permissions and\n// limitations under the License.\n\nimport { Box, Chip, IconButton, Tab, Tabs, Typography } from '@mui/material';\nimport CloseIcon from 'mdi-material-ui/Close';\nimport type { ReactElement } from 'react';\nimport { useState } from 'react';\n\nimport type { CustomLinks } from '../../gantt-chart-model';\nimport type { Span, Trace } from '../trace';\nimport { TraceAttributes } from './Attributes';\nimport { SpanEventList } from './SpanEvents';\nimport { SpanLinkList } from './SpanLinks';\n\nexport interface DetailPaneProps {\n  customLinks?: CustomLinks;\n  trace: Trace;\n  span: Span;\n  onCloseBtnClick: () => void;\n}\n\n/**\n * DetailPane renders a sidebar showing the span attributes etc.\n */\nexport function DetailPane(props: DetailPaneProps): ReactElement {\n  const { customLinks, trace, span, onCloseBtnClick } = props;\n  const [tab, setTab] = useState<'attributes' | 'events' | 'links'>('attributes');\n\n  // if the events tab is selected, and then a span without events is clicked,\n  // we need to switch the current selected tab back to the attributes tab.\n  if (tab === 'events' && span.events.length === 0) {\n    setTab('attributes');\n  }\n  // same as above, but for span links\n  if (tab === 'links' && span.links.length === 0) {\n    setTab('attributes');\n  }\n\n  return (\n    <Box>\n      <IconButton sx={{ float: 'right' }} onClick={onCloseBtnClick}>\n        <CloseIcon />\n      </IconButton>\n      <Typography sx={{ wordBreak: 'break-word' }}>{span.resource.serviceName}</Typography>\n      <Typography variant=\"h2\" sx={{ wordBreak: 'break-word' }}>\n        {span.name}\n      </Typography>\n      <Box sx={{ borderBottom: 1, borderColor: 'divider' }}>\n        <Tabs value={tab} onChange={(_, tab) => setTab(tab)} variant=\"scrollable\">\n          <Tab sx={{ p: 0 }} value=\"attributes\" label=\"Attributes\" />\n          {span.events.length > 0 && (\n            <Tab\n              value=\"events\"\n              label=\"Events\"\n              icon={<Chip label={span.events.length} />}\n              iconPosition=\"end\"\n              sx={{ minHeight: 48, height: 48 }} // MUI Tabs with icon are bigger than those without by default\n            />\n          )}\n          {span.links.length > 0 && (\n            <Tab\n              value=\"links\"\n              label=\"Links\"\n              icon={<Chip label={span.links.length} />}\n              iconPosition=\"end\"\n              sx={{ minHeight: 48, height: 48 }} // MUI Tabs with icon are bigger than those without by default\n            />\n          )}\n        </Tabs>\n      </Box>\n      {tab === 'attributes' && <TraceAttributes customLinks={customLinks} trace={trace} span={span} />}\n      {tab === 'events' && <SpanEventList customLinks={customLinks} trace={trace} span={span} />}\n      {tab === 'links' && <SpanLinkList customLinks={customLinks} span={span} />}\n    </Box>\n  );\n}\n"],"names":["Box","Chip","IconButton","Tab","Tabs","Typography","CloseIcon","useState","TraceAttributes","SpanEventList","SpanLinkList","DetailPane","props","customLinks","trace","span","onCloseBtnClick","tab","setTab","events","length","links","sx","float","onClick","wordBreak","resource","serviceName","variant","name","borderBottom","borderColor","value","onChange","_","p","label","icon","iconPosition","minHeight","height"],"mappings":";AAAA,+BAA+B;AAC/B,kEAAkE;AAClE,mEAAmE;AACnE,0CAA0C;AAC1C,EAAE;AACF,6CAA6C;AAC7C,EAAE;AACF,sEAAsE;AACtE,oEAAoE;AACpE,2EAA2E;AAC3E,sEAAsE;AACtE,iCAAiC;AAEjC,SAASA,GAAG,EAAEC,IAAI,EAAEC,UAAU,EAAEC,GAAG,EAAEC,IAAI,EAAEC,UAAU,QAAQ,gBAAgB;AAC7E,OAAOC,eAAe,wBAAwB;AAE9C,SAASC,QAAQ,QAAQ,QAAQ;AAIjC,SAASC,eAAe,QAAQ,kBAAe;AAC/C,SAASC,aAAa,QAAQ,kBAAe;AAC7C,SAASC,YAAY,QAAQ,iBAAc;AAS3C;;CAEC,GACD,OAAO,SAASC,WAAWC,KAAsB;IAC/C,MAAM,EAAEC,WAAW,EAAEC,KAAK,EAAEC,IAAI,EAAEC,eAAe,EAAE,GAAGJ;IACtD,MAAM,CAACK,KAAKC,OAAO,GAAGX,SAA4C;IAElE,4EAA4E;IAC5E,yEAAyE;IACzE,IAAIU,QAAQ,YAAYF,KAAKI,MAAM,CAACC,MAAM,KAAK,GAAG;QAChDF,OAAO;IACT;IACA,oCAAoC;IACpC,IAAID,QAAQ,WAAWF,KAAKM,KAAK,CAACD,MAAM,KAAK,GAAG;QAC9CF,OAAO;IACT;IAEA,qBACE,MAAClB;;0BACC,KAACE;gBAAWoB,IAAI;oBAAEC,OAAO;gBAAQ;gBAAGC,SAASR;0BAC3C,cAAA,KAACV;;0BAEH,KAACD;gBAAWiB,IAAI;oBAAEG,WAAW;gBAAa;0BAAIV,KAAKW,QAAQ,CAACC,WAAW;;0BACvE,KAACtB;gBAAWuB,SAAQ;gBAAKN,IAAI;oBAAEG,WAAW;gBAAa;0BACpDV,KAAKc,IAAI;;0BAEZ,KAAC7B;gBAAIsB,IAAI;oBAAEQ,cAAc;oBAAGC,aAAa;gBAAU;0BACjD,cAAA,MAAC3B;oBAAK4B,OAAOf;oBAAKgB,UAAU,CAACC,GAAGjB,MAAQC,OAAOD;oBAAMW,SAAQ;;sCAC3D,KAACzB;4BAAImB,IAAI;gCAAEa,GAAG;4BAAE;4BAAGH,OAAM;4BAAaI,OAAM;;wBAC3CrB,KAAKI,MAAM,CAACC,MAAM,GAAG,mBACpB,KAACjB;4BACC6B,OAAM;4BACNI,OAAM;4BACNC,oBAAM,KAACpC;gCAAKmC,OAAOrB,KAAKI,MAAM,CAACC,MAAM;;4BACrCkB,cAAa;4BACbhB,IAAI;gCAAEiB,WAAW;gCAAIC,QAAQ;4BAAG;;wBAGnCzB,KAAKM,KAAK,CAACD,MAAM,GAAG,mBACnB,KAACjB;4BACC6B,OAAM;4BACNI,OAAM;4BACNC,oBAAM,KAACpC;gCAAKmC,OAAOrB,KAAKM,KAAK,CAACD,MAAM;;4BACpCkB,cAAa;4BACbhB,IAAI;gCAAEiB,WAAW;gCAAIC,QAAQ;4BAAG;;;;;YAKvCvB,QAAQ,8BAAgB,KAACT;gBAAgBK,aAAaA;gBAAaC,OAAOA;gBAAOC,MAAMA;;YACvFE,QAAQ,0BAAY,KAACR;gBAAcI,aAAaA;gBAAaC,OAAOA;gBAAOC,MAAMA;;YACjFE,QAAQ,yBAAW,KAACP;gBAAaG,aAAaA;gBAAaE,MAAMA;;;;AAGxE"}

package/lib/TracingGanttChart/DetailPane/SpanEvents.d.ts

@@ -1,6 +1,6 @@
-import { ReactElement } from 'react';
-import { Trace, Span } from '../trace';
-import { CustomLinks } from '../../gantt-chart-model';
+import type { ReactElement } from 'react';
+import type { CustomLinks } from '../../gantt-chart-model';
+import type { Trace, Span } from '../trace';
 export interface SpanEventListProps {
     customLinks?: CustomLinks;
     trace: Trace;

package/lib/TracingGanttChart/DetailPane/SpanEvents.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"SpanEvents.d.ts","sourceRoot":"","sources":["../../../../src/TracingGanttChart/DetailPane/SpanEvents.tsx"],"names":[],"mappings":"AAcA,OAAO,EAAY,YAAY,EAAY,MAAM,OAAO,CAAC;AAIzD,OAAO,EAAE,KAAK,EAAE,IAAI,EAAS,MAAM,UAAU,CAAC;AAC9C,OAAO,EAAE,WAAW,EAAE,MAAM,yBAAyB,CAAC;AAGtD,MAAM,WAAW,kBAAkB;IACjC,WAAW,CAAC,EAAE,WAAW,CAAC;IAC1B,KAAK,EAAE,KAAK,CAAC;IACb,IAAI,EAAE,IAAI,CAAC;CACZ;AAED,wBAAgB,aAAa,CAAC,KAAK,EAAE,kBAAkB,GAAG,YAAY,CAerE"}
+{"version":3,"file":"SpanEvents.d.ts","sourceRoot":"","sources":["../../../../src/TracingGanttChart/DetailPane/SpanEvents.tsx"],"names":[],"mappings":"AAgBA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,OAAO,CAAC;AAG1C,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,yBAAyB,CAAC;AAC3D,OAAO,KAAK,EAAE,KAAK,EAAE,IAAI,EAAS,MAAM,UAAU,CAAC;AAInD,MAAM,WAAW,kBAAkB;IACjC,WAAW,CAAC,EAAE,WAAW,CAAC;IAC1B,KAAK,EAAE,KAAK,CAAC;IACb,IAAI,EAAE,IAAI,CAAC;CACZ;AAED,wBAAgB,aAAa,CAAC,KAAK,EAAE,kBAAkB,GAAG,YAAY,CAerE"}

package/lib/TracingGanttChart/DetailPane/SpanEvents.js

@@ -11,16 +11,16 @@ import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-run
 // WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 // See the License for the specific language governing permissions and
 // limitations under the License.
-import { Collapse, Divider, List, ListItemButton, ListItemText } from '@mui/material';
-import { Fragment, useState } from 'react';
-import ChevronUp from 'mdi-material-ui/ChevronUp';
-import ChevronDown from 'mdi-material-ui/ChevronDown';
-import { formatDuration } from '../utils';
-import { AttributeItems, AttributeItem } from './Attributes';
+import { Collapse, Divider, List, ListItemButton, ListItemText } from "@mui/material";
+import ChevronDown from "mdi-material-ui/ChevronDown";
+import ChevronUp from "mdi-material-ui/ChevronUp";
+import { Fragment, useState } from "react";
+import { formatDuration } from "../utils.js";
+import { AttributeItems, AttributeItem } from "./Attributes.js";
 export function SpanEventList(props) {
     const { customLinks, trace, span } = props;
     return /*#__PURE__*/ _jsx(_Fragment, {
-        children: span.events.sort((a, b)=>a.timeUnixMs - b.timeUnixMs).map((event, i)=>/*#__PURE__*/ _jsxs(Fragment, {
+        children: span.events.toSorted((a, b)=>a.timeUnixMs - b.timeUnixMs).map((event, i)=>/*#__PURE__*/ _jsxs(Fragment, {
                 children: [
                     i > 0 && /*#__PURE__*/ _jsx(Divider, {}),
                     /*#__PURE__*/ _jsx(SpanEventItem, {

package/lib/TracingGanttChart/DetailPane/SpanEvents.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/TracingGanttChart/DetailPane/SpanEvents.tsx"],"sourcesContent":["// Copyright The Perses Authors\n// Licensed under the Apache License, Version 2.0 (the \"License\");\n// you may not use this file except in compliance with the License.\n// You may obtain a copy of the License at\n//\n// http://www.apache.org/licenses/LICENSE-2.0\n//\n// Unless required by applicable law or agreed to in writing, software\n// distributed under the License is distributed on an \"AS IS\" BASIS,\n// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n// See the License for the specific language governing permissions and\n// limitations under the License.\n\nimport { Collapse, Divider, List, ListItemButton, ListItemText } from '@mui/material';\nimport { Fragment, ReactElement, useState } from 'react';\nimport ChevronUp from 'mdi-material-ui/ChevronUp';\nimport ChevronDown from 'mdi-material-ui/ChevronDown';\nimport { formatDuration } from '../utils';\nimport { Trace, Span, Event } from '../trace';\nimport { CustomLinks } from '../../gantt-chart-model';\nimport { AttributeItems, AttributeItem } from './Attributes';\n\nexport interface SpanEventListProps {\n  customLinks?: CustomLinks;\n  trace: Trace;\n  span: Span;\n}\n\nexport function SpanEventList(props: SpanEventListProps): ReactElement {\n  const { customLinks, trace, span } = props;\n\n  return (\n    <>\n      {span.events\n        .sort((a, b) => a.timeUnixMs - b.timeUnixMs)\n        .map((event, i) => (\n          <Fragment key={i}>\n            {i > 0 && <Divider />}\n            <SpanEventItem customLinks={customLinks} trace={trace} event={event} />\n          </Fragment>\n        ))}\n    </>\n  );\n}\n\ninterface SpanEventItemProps {\n  customLinks?: CustomLinks;\n  trace: Trace;\n  event: Event;\n}\n\nfunction SpanEventItem(props: SpanEventItemProps): ReactElement {\n  const { customLinks, trace, event } = props;\n  const relativeTime = event.timeUnixMs - trace.startTimeUnixMs;\n\n  const [open, setOpen] = useState(false);\n  const handleClick = (): void => {\n    setOpen(!open);\n  };\n\n  return (\n    <List>\n      <ListItemButton onClick={handleClick} sx={{ px: 1 }}>\n        <ListItemText\n          primary={\n            <>\n              <strong>{formatDuration(relativeTime)}:</strong> {event.name}\n            </>\n          }\n          slotProps={{ primary: { noWrap: true } }}\n        />\n        {open ? <ChevronUp /> : <ChevronDown />}\n      </ListItemButton>\n      <Collapse in={open} timeout=\"auto\" unmountOnExit>\n        <List sx={{ px: 1 }}>\n          <AttributeItem name=\"name\" value={event.name} />\n          <AttributeItem name=\"time\" value={formatDuration(relativeTime)} />\n          <AttributeItems customLinks={customLinks} attributes={event.attributes} />\n        </List>\n      </Collapse>\n    </List>\n  );\n}\n"],"names":["Collapse","Divider","List","ListItemButton","ListItemText","Fragment","useState","ChevronUp","ChevronDown","formatDuration","AttributeItems","AttributeItem","SpanEventList","props","customLinks","trace","span","events","sort","a","b","timeUnixMs","map","event","i","SpanEventItem","relativeTime","startTimeUnixMs","open","setOpen","handleClick","onClick","sx","px","primary","strong","name","slotProps","noWrap","in","timeout","unmountOnExit","value","attributes"],"mappings":";AAAA,+BAA+B;AAC/B,kEAAkE;AAClE,mEAAmE;AACnE,0CAA0C;AAC1C,EAAE;AACF,6CAA6C;AAC7C,EAAE;AACF,sEAAsE;AACtE,oEAAoE;AACpE,2EAA2E;AAC3E,sEAAsE;AACtE,iCAAiC;AAEjC,SAASA,QAAQ,EAAEC,OAAO,EAAEC,IAAI,EAAEC,cAAc,EAAEC,YAAY,QAAQ,gBAAgB;AACtF,SAASC,QAAQ,EAAgBC,QAAQ,QAAQ,QAAQ;AACzD,OAAOC,eAAe,4BAA4B;AAClD,OAAOC,iBAAiB,8BAA8B;AACtD,SAASC,cAAc,QAAQ,WAAW;AAG1C,SAASC,cAAc,EAAEC,aAAa,QAAQ,eAAe;AAQ7D,OAAO,SAASC,cAAcC,KAAyB;IACrD,MAAM,EAAEC,WAAW,EAAEC,KAAK,EAAEC,IAAI,EAAE,GAAGH;IAErC,qBACE;kBACGG,KAAKC,MAAM,CACTC,IAAI,CAAC,CAACC,GAAGC,IAAMD,EAAEE,UAAU,GAAGD,EAAEC,UAAU,EAC1CC,GAAG,CAAC,CAACC,OAAOC,kBACX,MAACnB;;oBACEmB,IAAI,mBAAK,KAACvB;kCACX,KAACwB;wBAAcX,aAAaA;wBAAaC,OAAOA;wBAAOQ,OAAOA;;;eAFjDC;;AAOzB;AAQA,SAASC,cAAcZ,KAAyB;IAC9C,MAAM,EAAEC,WAAW,EAAEC,KAAK,EAAEQ,KAAK,EAAE,GAAGV;IACtC,MAAMa,eAAeH,MAAMF,UAAU,GAAGN,MAAMY,eAAe;IAE7D,MAAM,CAACC,MAAMC,QAAQ,GAAGvB,SAAS;IACjC,MAAMwB,cAAc;QAClBD,QAAQ,CAACD;IACX;IAEA,qBACE,MAAC1B;;0BACC,MAACC;gBAAe4B,SAASD;gBAAaE,IAAI;oBAAEC,IAAI;gBAAE;;kCAChD,KAAC7B;wBACC8B,uBACE;;8CACE,MAACC;;wCAAQ1B,eAAeiB;wCAAc;;;gCAAU;gCAAEH,MAAMa,IAAI;;;wBAGhEC,WAAW;4BAAEH,SAAS;gCAAEI,QAAQ;4BAAK;wBAAE;;oBAExCV,qBAAO,KAACrB,+BAAe,KAACC;;;0BAE3B,KAACR;gBAASuC,IAAIX;gBAAMY,SAAQ;gBAAOC,aAAa;0BAC9C,cAAA,MAACvC;oBAAK8B,IAAI;wBAAEC,IAAI;oBAAE;;sCAChB,KAACtB;4BAAcyB,MAAK;4BAAOM,OAAOnB,MAAMa,IAAI;;sCAC5C,KAACzB;4BAAcyB,MAAK;4BAAOM,OAAOjC,eAAeiB;;sCACjD,KAAChB;4BAAeI,aAAaA;4BAAa6B,YAAYpB,MAAMoB,UAAU;;;;;;;AAKhF"}
+{"version":3,"sources":["../../../../src/TracingGanttChart/DetailPane/SpanEvents.tsx"],"sourcesContent":["// Copyright The Perses Authors\n// Licensed under the Apache License, Version 2.0 (the \"License\");\n// you may not use this file except in compliance with the License.\n// You may obtain a copy of the License at\n//\n// http://www.apache.org/licenses/LICENSE-2.0\n//\n// Unless required by applicable law or agreed to in writing, software\n// distributed under the License is distributed on an \"AS IS\" BASIS,\n// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n// See the License for the specific language governing permissions and\n// limitations under the License.\n\nimport { Collapse, Divider, List, ListItemButton, ListItemText } from '@mui/material';\nimport ChevronDown from 'mdi-material-ui/ChevronDown';\nimport ChevronUp from 'mdi-material-ui/ChevronUp';\nimport type { ReactElement } from 'react';\nimport { Fragment, useState } from 'react';\n\nimport type { CustomLinks } from '../../gantt-chart-model';\nimport type { Trace, Span, Event } from '../trace';\nimport { formatDuration } from '../utils';\nimport { AttributeItems, AttributeItem } from './Attributes';\n\nexport interface SpanEventListProps {\n  customLinks?: CustomLinks;\n  trace: Trace;\n  span: Span;\n}\n\nexport function SpanEventList(props: SpanEventListProps): ReactElement {\n  const { customLinks, trace, span } = props;\n\n  return (\n    <>\n      {span.events\n        .toSorted((a, b) => a.timeUnixMs - b.timeUnixMs)\n        .map((event, i) => (\n          <Fragment key={i}>\n            {i > 0 && <Divider />}\n            <SpanEventItem customLinks={customLinks} trace={trace} event={event} />\n          </Fragment>\n        ))}\n    </>\n  );\n}\n\ninterface SpanEventItemProps {\n  customLinks?: CustomLinks;\n  trace: Trace;\n  event: Event;\n}\n\nfunction SpanEventItem(props: SpanEventItemProps): ReactElement {\n  const { customLinks, trace, event } = props;\n  const relativeTime = event.timeUnixMs - trace.startTimeUnixMs;\n\n  const [open, setOpen] = useState(false);\n  const handleClick = (): void => {\n    setOpen(!open);\n  };\n\n  return (\n    <List>\n      <ListItemButton onClick={handleClick} sx={{ px: 1 }}>\n        <ListItemText\n          primary={\n            <>\n              <strong>{formatDuration(relativeTime)}:</strong> {event.name}\n            </>\n          }\n          slotProps={{ primary: { noWrap: true } }}\n        />\n        {open ? <ChevronUp /> : <ChevronDown />}\n      </ListItemButton>\n      <Collapse in={open} timeout=\"auto\" unmountOnExit>\n        <List sx={{ px: 1 }}>\n          <AttributeItem name=\"name\" value={event.name} />\n          <AttributeItem name=\"time\" value={formatDuration(relativeTime)} />\n          <AttributeItems customLinks={customLinks} attributes={event.attributes} />\n        </List>\n      </Collapse>\n    </List>\n  );\n}\n"],"names":["Collapse","Divider","List","ListItemButton","ListItemText","ChevronDown","ChevronUp","Fragment","useState","formatDuration","AttributeItems","AttributeItem","SpanEventList","props","customLinks","trace","span","events","toSorted","a","b","timeUnixMs","map","event","i","SpanEventItem","relativeTime","startTimeUnixMs","open","setOpen","handleClick","onClick","sx","px","primary","strong","name","slotProps","noWrap","in","timeout","unmountOnExit","value","attributes"],"mappings":";AAAA,+BAA+B;AAC/B,kEAAkE;AAClE,mEAAmE;AACnE,0CAA0C;AAC1C,EAAE;AACF,6CAA6C;AAC7C,EAAE;AACF,sEAAsE;AACtE,oEAAoE;AACpE,2EAA2E;AAC3E,sEAAsE;AACtE,iCAAiC;AAEjC,SAASA,QAAQ,EAAEC,OAAO,EAAEC,IAAI,EAAEC,cAAc,EAAEC,YAAY,QAAQ,gBAAgB;AACtF,OAAOC,iBAAiB,8BAA8B;AACtD,OAAOC,eAAe,4BAA4B;AAElD,SAASC,QAAQ,EAAEC,QAAQ,QAAQ,QAAQ;AAI3C,SAASC,cAAc,QAAQ,cAAW;AAC1C,SAASC,cAAc,EAAEC,aAAa,QAAQ,kBAAe;AAQ7D,OAAO,SAASC,cAAcC,KAAyB;IACrD,MAAM,EAAEC,WAAW,EAAEC,KAAK,EAAEC,IAAI,EAAE,GAAGH;IAErC,qBACE;kBACGG,KAAKC,MAAM,CACTC,QAAQ,CAAC,CAACC,GAAGC,IAAMD,EAAEE,UAAU,GAAGD,EAAEC,UAAU,EAC9CC,GAAG,CAAC,CAACC,OAAOC,kBACX,MAACjB;;oBACEiB,IAAI,mBAAK,KAACvB;kCACX,KAACwB;wBAAcX,aAAaA;wBAAaC,OAAOA;wBAAOQ,OAAOA;;;eAFjDC;;AAOzB;AAQA,SAASC,cAAcZ,KAAyB;IAC9C,MAAM,EAAEC,WAAW,EAAEC,KAAK,EAAEQ,KAAK,EAAE,GAAGV;IACtC,MAAMa,eAAeH,MAAMF,UAAU,GAAGN,MAAMY,eAAe;IAE7D,MAAM,CAACC,MAAMC,QAAQ,GAAGrB,SAAS;IACjC,MAAMsB,cAAc;QAClBD,QAAQ,CAACD;IACX;IAEA,qBACE,MAAC1B;;0BACC,MAACC;gBAAe4B,SAASD;gBAAaE,IAAI;oBAAEC,IAAI;gBAAE;;kCAChD,KAAC7B;wBACC8B,uBACE;;8CACE,MAACC;;wCAAQ1B,eAAeiB;wCAAc;;;gCAAU;gCAAEH,MAAMa,IAAI;;;wBAGhEC,WAAW;4BAAEH,SAAS;gCAAEI,QAAQ;4BAAK;wBAAE;;oBAExCV,qBAAO,KAACtB,+BAAe,KAACD;;;0BAE3B,KAACL;gBAASuC,IAAIX;gBAAMY,SAAQ;gBAAOC,aAAa;0BAC9C,cAAA,MAACvC;oBAAK8B,IAAI;wBAAEC,IAAI;oBAAE;;sCAChB,KAACtB;4BAAcyB,MAAK;4BAAOM,OAAOnB,MAAMa,IAAI;;sCAC5C,KAACzB;4BAAcyB,MAAK;4BAAOM,OAAOjC,eAAeiB;;sCACjD,KAAChB;4BAAeI,aAAaA;4BAAa6B,YAAYpB,MAAMoB,UAAU;;;;;;;AAKhF"}

package/lib/TracingGanttChart/DetailPane/SpanLinks.d.ts

@@ -1,6 +1,6 @@
-import { ReactElement } from 'react';
-import { Span } from '../trace';
-import { CustomLinks } from '../../gantt-chart-model';
+import type { ReactElement } from 'react';
+import type { CustomLinks } from '../../gantt-chart-model';
+import type { Span } from '../trace';
 export interface SpanLinkListProps {
     customLinks?: CustomLinks;
     span: Span;

package/lib/TracingGanttChart/DetailPane/SpanLinks.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"SpanLinks.d.ts","sourceRoot":"","sources":["../../../../src/TracingGanttChart/DetailPane/SpanLinks.tsx"],"names":[],"mappings":"AAcA,OAAO,EAAY,YAAY,EAAE,MAAM,OAAO,CAAC;AAE/C,OAAO,EAAE,IAAI,EAAQ,MAAM,UAAU,CAAC;AACtC,OAAO,EAAE,WAAW,EAAE,MAAM,yBAAyB,CAAC;AAGtD,MAAM,WAAW,iBAAiB;IAChC,WAAW,CAAC,EAAE,WAAW,CAAC;IAC1B,IAAI,EAAE,IAAI,CAAC;CACZ;AAED,wBAAgB,YAAY,CAAC,KAAK,EAAE,iBAAiB,GAAG,YAAY,CAanE"}
+{"version":3,"file":"SpanLinks.d.ts","sourceRoot":"","sources":["../../../../src/TracingGanttChart/DetailPane/SpanLinks.tsx"],"names":[],"mappings":"AAeA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,OAAO,CAAC;AAG1C,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,yBAAyB,CAAC;AAC3D,OAAO,KAAK,EAAE,IAAI,EAAQ,MAAM,UAAU,CAAC;AAG3C,MAAM,WAAW,iBAAiB;IAChC,WAAW,CAAC,EAAE,WAAW,CAAC;IAC1B,IAAI,EAAE,IAAI,CAAC;CACZ;AAED,wBAAgB,YAAY,CAAC,KAAK,EAAE,iBAAiB,GAAG,YAAY,CAanE"}

package/lib/TracingGanttChart/DetailPane/SpanLinks.js

@@ -11,10 +11,10 @@ import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-run
 // WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 // See the License for the specific language governing permissions and
 // limitations under the License.
-import { Divider, List } from '@mui/material';
-import { Fragment } from 'react';
-import { replaceVariablesInString, useAllVariableValues } from '@perses-dev/plugin-system';
-import { AttributeItem, AttributeItems } from './Attributes';
+import { Divider, List } from "@mui/material";
+import { replaceVariablesInString, useAllVariableValues } from "@perses-dev/plugin-system";
+import { Fragment } from "react";
+import { AttributeItem, AttributeItems } from "./Attributes.js";
 export function SpanLinkList(props) {
     const { customLinks, span } = props;
     return /*#__PURE__*/ _jsx(_Fragment, {

package/lib/TracingGanttChart/DetailPane/SpanLinks.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/TracingGanttChart/DetailPane/SpanLinks.tsx"],"sourcesContent":["// Copyright The Perses Authors\n// Licensed under the Apache License, Version 2.0 (the \"License\");\n// you may not use this file except in compliance with the License.\n// You may obtain a copy of the License at\n//\n// http://www.apache.org/licenses/LICENSE-2.0\n//\n// Unless required by applicable law or agreed to in writing, software\n// distributed under the License is distributed on an \"AS IS\" BASIS,\n// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n// See the License for the specific language governing permissions and\n// limitations under the License.\n\nimport { Divider, List } from '@mui/material';\nimport { Fragment, ReactElement } from 'react';\nimport { replaceVariablesInString, useAllVariableValues } from '@perses-dev/plugin-system';\nimport { Span, Link } from '../trace';\nimport { CustomLinks } from '../../gantt-chart-model';\nimport { AttributeItem, AttributeItems } from './Attributes';\n\nexport interface SpanLinkListProps {\n  customLinks?: CustomLinks;\n  span: Span;\n}\n\nexport function SpanLinkList(props: SpanLinkListProps): ReactElement {\n  const { customLinks, span } = props;\n\n  return (\n    <>\n      {span.links.map((link, i) => (\n        <Fragment key={i}>\n          {i > 0 && <Divider />}\n          <SpanLinkItem link={link} customLinks={customLinks} />\n        </Fragment>\n      ))}\n    </>\n  );\n}\n\ninterface SpanLinkItemProps {\n  customLinks?: CustomLinks;\n  link: Link;\n}\n\nfunction SpanLinkItem(props: SpanLinkItemProps): ReactElement {\n  const { customLinks, link } = props;\n  const variableValues = useAllVariableValues();\n  const traceLink = customLinks?.links.trace\n    ? replaceVariablesInString(customLinks.links.trace, variableValues, {\n        ...customLinks?.variables,\n        traceId: link.traceId,\n      })\n    : undefined;\n  const spanLink = customLinks?.links.span\n    ? replaceVariablesInString(customLinks.links.span, variableValues, {\n        ...customLinks?.variables,\n        traceId: link.traceId,\n        spanId: link.spanId,\n      })\n    : undefined;\n\n  return (\n    <List>\n      <AttributeItem name=\"trace ID\" value={link.traceId} link={traceLink} />\n      <AttributeItem name=\"span ID\" value={link.spanId} link={spanLink} />\n      <AttributeItems customLinks={customLinks} attributes={link.attributes} />\n    </List>\n  );\n}\n"],"names":["Divider","List","Fragment","replaceVariablesInString","useAllVariableValues","AttributeItem","AttributeItems","SpanLinkList","props","customLinks","span","links","map","link","i","SpanLinkItem","variableValues","traceLink","trace","variables","traceId","undefined","spanLink","spanId","name","value","attributes"],"mappings":";AAAA,+BAA+B;AAC/B,kEAAkE;AAClE,mEAAmE;AACnE,0CAA0C;AAC1C,EAAE;AACF,6CAA6C;AAC7C,EAAE;AACF,sEAAsE;AACtE,oEAAoE;AACpE,2EAA2E;AAC3E,sEAAsE;AACtE,iCAAiC;AAEjC,SAASA,OAAO,EAAEC,IAAI,QAAQ,gBAAgB;AAC9C,SAASC,QAAQ,QAAsB,QAAQ;AAC/C,SAASC,wBAAwB,EAAEC,oBAAoB,QAAQ,4BAA4B;AAG3F,SAASC,aAAa,EAAEC,cAAc,QAAQ,eAAe;AAO7D,OAAO,SAASC,aAAaC,KAAwB;IACnD,MAAM,EAAEC,WAAW,EAAEC,IAAI,EAAE,GAAGF;IAE9B,qBACE;kBACGE,KAAKC,KAAK,CAACC,GAAG,CAAC,CAACC,MAAMC,kBACrB,MAACZ;;oBACEY,IAAI,mBAAK,KAACd;kCACX,KAACe;wBAAaF,MAAMA;wBAAMJ,aAAaA;;;eAF1BK;;AAOvB;AAOA,SAASC,aAAaP,KAAwB;IAC5C,MAAM,EAAEC,WAAW,EAAEI,IAAI,EAAE,GAAGL;IAC9B,MAAMQ,iBAAiBZ;IACvB,MAAMa,YAAYR,aAAaE,MAAMO,QACjCf,yBAAyBM,YAAYE,KAAK,CAACO,KAAK,EAAEF,gBAAgB;QAChE,GAAGP,aAAaU,SAAS;QACzBC,SAASP,KAAKO,OAAO;IACvB,KACAC;IACJ,MAAMC,WAAWb,aAAaE,MAAMD,OAChCP,yBAAyBM,YAAYE,KAAK,CAACD,IAAI,EAAEM,gBAAgB;QAC/D,GAAGP,aAAaU,SAAS;QACzBC,SAASP,KAAKO,OAAO;QACrBG,QAAQV,KAAKU,MAAM;IACrB,KACAF;IAEJ,qBACE,MAACpB;;0BACC,KAACI;gBAAcmB,MAAK;gBAAWC,OAAOZ,KAAKO,OAAO;gBAAEP,MAAMI;;0BAC1D,KAACZ;gBAAcmB,MAAK;gBAAUC,OAAOZ,KAAKU,MAAM;gBAAEV,MAAMS;;0BACxD,KAAChB;gBAAeG,aAAaA;gBAAaiB,YAAYb,KAAKa,UAAU;;;;AAG3E"}
+{"version":3,"sources":["../../../../src/TracingGanttChart/DetailPane/SpanLinks.tsx"],"sourcesContent":["// Copyright The Perses Authors\n// Licensed under the Apache License, Version 2.0 (the \"License\");\n// you may not use this file except in compliance with the License.\n// You may obtain a copy of the License at\n//\n// http://www.apache.org/licenses/LICENSE-2.0\n//\n// Unless required by applicable law or agreed to in writing, software\n// distributed under the License is distributed on an \"AS IS\" BASIS,\n// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n// See the License for the specific language governing permissions and\n// limitations under the License.\n\nimport { Divider, List } from '@mui/material';\nimport { replaceVariablesInString, useAllVariableValues } from '@perses-dev/plugin-system';\nimport type { ReactElement } from 'react';\nimport { Fragment } from 'react';\n\nimport type { CustomLinks } from '../../gantt-chart-model';\nimport type { Span, Link } from '../trace';\nimport { AttributeItem, AttributeItems } from './Attributes';\n\nexport interface SpanLinkListProps {\n  customLinks?: CustomLinks;\n  span: Span;\n}\n\nexport function SpanLinkList(props: SpanLinkListProps): ReactElement {\n  const { customLinks, span } = props;\n\n  return (\n    <>\n      {span.links.map((link, i) => (\n        <Fragment key={i}>\n          {i > 0 && <Divider />}\n          <SpanLinkItem link={link} customLinks={customLinks} />\n        </Fragment>\n      ))}\n    </>\n  );\n}\n\ninterface SpanLinkItemProps {\n  customLinks?: CustomLinks;\n  link: Link;\n}\n\nfunction SpanLinkItem(props: SpanLinkItemProps): ReactElement {\n  const { customLinks, link } = props;\n  const variableValues = useAllVariableValues();\n  const traceLink = customLinks?.links.trace\n    ? replaceVariablesInString(customLinks.links.trace, variableValues, {\n        ...customLinks?.variables,\n        traceId: link.traceId,\n      })\n    : undefined;\n  const spanLink = customLinks?.links.span\n    ? replaceVariablesInString(customLinks.links.span, variableValues, {\n        ...customLinks?.variables,\n        traceId: link.traceId,\n        spanId: link.spanId,\n      })\n    : undefined;\n\n  return (\n    <List>\n      <AttributeItem name=\"trace ID\" value={link.traceId} link={traceLink} />\n      <AttributeItem name=\"span ID\" value={link.spanId} link={spanLink} />\n      <AttributeItems customLinks={customLinks} attributes={link.attributes} />\n    </List>\n  );\n}\n"],"names":["Divider","List","replaceVariablesInString","useAllVariableValues","Fragment","AttributeItem","AttributeItems","SpanLinkList","props","customLinks","span","links","map","link","i","SpanLinkItem","variableValues","traceLink","trace","variables","traceId","undefined","spanLink","spanId","name","value","attributes"],"mappings":";AAAA,+BAA+B;AAC/B,kEAAkE;AAClE,mEAAmE;AACnE,0CAA0C;AAC1C,EAAE;AACF,6CAA6C;AAC7C,EAAE;AACF,sEAAsE;AACtE,oEAAoE;AACpE,2EAA2E;AAC3E,sEAAsE;AACtE,iCAAiC;AAEjC,SAASA,OAAO,EAAEC,IAAI,QAAQ,gBAAgB;AAC9C,SAASC,wBAAwB,EAAEC,oBAAoB,QAAQ,4BAA4B;AAE3F,SAASC,QAAQ,QAAQ,QAAQ;AAIjC,SAASC,aAAa,EAAEC,cAAc,QAAQ,kBAAe;AAO7D,OAAO,SAASC,aAAaC,KAAwB;IACnD,MAAM,EAAEC,WAAW,EAAEC,IAAI,EAAE,GAAGF;IAE9B,qBACE;kBACGE,KAAKC,KAAK,CAACC,GAAG,CAAC,CAACC,MAAMC,kBACrB,MAACV;;oBACEU,IAAI,mBAAK,KAACd;kCACX,KAACe;wBAAaF,MAAMA;wBAAMJ,aAAaA;;;eAF1BK;;AAOvB;AAOA,SAASC,aAAaP,KAAwB;IAC5C,MAAM,EAAEC,WAAW,EAAEI,IAAI,EAAE,GAAGL;IAC9B,MAAMQ,iBAAiBb;IACvB,MAAMc,YAAYR,aAAaE,MAAMO,QACjChB,yBAAyBO,YAAYE,KAAK,CAACO,KAAK,EAAEF,gBAAgB;QAChE,GAAGP,aAAaU,SAAS;QACzBC,SAASP,KAAKO,OAAO;IACvB,KACAC;IACJ,MAAMC,WAAWb,aAAaE,MAAMD,OAChCR,yBAAyBO,YAAYE,KAAK,CAACD,IAAI,EAAEM,gBAAgB;QAC/D,GAAGP,aAAaU,SAAS;QACzBC,SAASP,KAAKO,OAAO;QACrBG,QAAQV,KAAKU,MAAM;IACrB,KACAF;IAEJ,qBACE,MAACpB;;0BACC,KAACI;gBAAcmB,MAAK;gBAAWC,OAAOZ,KAAKO,OAAO;gBAAEP,MAAMI;;0BAC1D,KAACZ;gBAAcmB,MAAK;gBAAUC,OAAOZ,KAAKU,MAAM;gBAAEV,MAAMS;;0BACxD,KAAChB;gBAAeG,aAAaA;gBAAaiB,YAAYb,KAAKa,UAAU;;;;AAG3E"}

package/lib/TracingGanttChart/GanttTable/GanttTable.d.ts

@@ -1,7 +1,7 @@
-import { ReactElement } from 'react';
-import { Viewport } from '../utils';
-import { CustomLinks, TracingGanttChartOptions } from '../../gantt-chart-model';
-import { Span, Trace } from '../trace';
+import type { ReactElement } from 'react';
+import type { CustomLinks, TracingGanttChartOptions } from '../../gantt-chart-model';
+import type { Span, Trace } from '../trace';
+import type { Viewport } from '../utils';
 export interface GanttTableProps {
     options: TracingGanttChartOptions;
     customLinks?: CustomLinks;

package/lib/TracingGanttChart/GanttTable/GanttTable.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"GanttTable.d.ts","sourceRoot":"","sources":["../../../../src/TracingGanttChart/GanttTable/GanttTable.tsx"],"names":[],"mappings":"AAcA,OAAO,EAAE,YAAY,EAAwC,MAAM,OAAO,CAAC;AAE3E,OAAO,EAAE,QAAQ,EAAE,MAAM,UAAU,CAAC;AACpC,OAAO,EAAE,WAAW,EAAE,wBAAwB,EAAE,MAAM,yBAAyB,CAAC;AAChF,OAAO,EAAE,IAAI,EAAE,KAAK,EAAe,MAAM,UAAU,CAAC;AAMpD,MAAM,WAAW,eAAe;IAC9B,OAAO,EAAE,wBAAwB,CAAC;IAClC,WAAW,CAAC,EAAE,WAAW,CAAC;IAC1B,KAAK,EAAE,KAAK,CAAC;IACb,QAAQ,EAAE,QAAQ,CAAC;IACnB,YAAY,CAAC,EAAE,IAAI,CAAC;IACpB,WAAW,EAAE,CAAC,IAAI,EAAE,IAAI,KAAK,IAAI,CAAC;IAClC,eAAe,CAAC,EAAE,MAAM,EAAE,CAAC;IAC3B,aAAa,CAAC,EAAE,MAAM,CAAC;CACxB;AAED,wBAAgB,UAAU,CAAC,KAAK,EAAE,eAAe,GAAG,YAAY,CA6G/D"}
+{"version":3,"file":"GanttTable.d.ts","sourceRoot":"","sources":["../../../../src/TracingGanttChart/GanttTable/GanttTable.tsx"],"names":[],"mappings":"AAcA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,OAAO,CAAC;AAK1C,OAAO,KAAK,EAAE,WAAW,EAAE,wBAAwB,EAAE,MAAM,yBAAyB,CAAC;AACrF,OAAO,KAAK,EAAE,IAAI,EAAE,KAAK,EAAE,MAAM,UAAU,CAAC;AAE5C,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,UAAU,CAAC;AAMzC,MAAM,WAAW,eAAe;IAC9B,OAAO,EAAE,wBAAwB,CAAC;IAClC,WAAW,CAAC,EAAE,WAAW,CAAC;IAC1B,KAAK,EAAE,KAAK,CAAC;IACb,QAAQ,EAAE,QAAQ,CAAC;IACnB,YAAY,CAAC,EAAE,IAAI,CAAC;IACpB,WAAW,EAAE,CAAC,IAAI,EAAE,IAAI,KAAK,IAAI,CAAC;IAClC,eAAe,CAAC,EAAE,MAAM,EAAE,CAAC;IAC3B,aAAa,CAAC,EAAE,MAAM,CAAC;CACxB;AAED,wBAAgB,UAAU,CAAC,KAAK,EAAE,eAAe,GAAG,YAAY,CA6G/D"}

package/lib/TracingGanttChart/GanttTable/GanttTable.js

@@ -11,14 +11,14 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 // WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 // See the License for the specific language governing permissions and
 // limitations under the License.
-import { Virtuoso } from 'react-virtuoso';
-import { useEffect, useMemo, useRef, useState } from 'react';
-import { Box, useTheme } from '@mui/material';
-import { forEachSpan } from '../trace';
-import { useGanttTableContext } from './GanttTableProvider';
-import { GanttTableRow } from './GanttTableRow';
-import { GanttTableHeader } from './GanttTableHeader';
-import { ResizableDivider } from './ResizableDivider';
+import { Box, useTheme } from "@mui/material";
+import { useEffect, useMemo, useRef, useState } from "react";
+import { Virtuoso } from "react-virtuoso";
+import { forEachSpan } from "../trace.js";
+import { GanttTableHeader } from "./GanttTableHeader.js";
+import { useGanttTableContext } from "./GanttTableProvider.js";
+import { GanttTableRow } from "./GanttTableRow.js";
+import { ResizableDivider } from "./ResizableDivider.js";
 export function GanttTable(props) {
     const { options, customLinks, trace, viewport, selectedSpan, onSpanClick, matchingSpanIds, focusedSpanId } = props;
     const { collapsedSpans, setCollapsedSpans, setVisibleSpans } = useGanttTableContext();

package/lib/TracingGanttChart/GanttTable/GanttTable.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/TracingGanttChart/GanttTable/GanttTable.tsx"],"sourcesContent":["// Copyright The Perses Authors\n// Licensed under the Apache License, Version 2.0 (the \"License\");\n// you may not use this file except in compliance with the License.\n// You may obtain a copy of the License at\n//\n// http://www.apache.org/licenses/LICENSE-2.0\n//\n// Unless required by applicable law or agreed to in writing, software\n// distributed under the License is distributed on an \"AS IS\" BASIS,\n// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n// See the License for the specific language governing permissions and\n// limitations under the License.\n\nimport { Virtuoso, VirtuosoHandle, ListRange } from 'react-virtuoso';\nimport { ReactElement, useEffect, useMemo, useRef, useState } from 'react';\nimport { Box, useTheme } from '@mui/material';\nimport { Viewport } from '../utils';\nimport { CustomLinks, TracingGanttChartOptions } from '../../gantt-chart-model';\nimport { Span, Trace, forEachSpan } from '../trace';\nimport { useGanttTableContext } from './GanttTableProvider';\nimport { GanttTableRow } from './GanttTableRow';\nimport { GanttTableHeader } from './GanttTableHeader';\nimport { ResizableDivider } from './ResizableDivider';\n\nexport interface GanttTableProps {\n  options: TracingGanttChartOptions;\n  customLinks?: CustomLinks;\n  trace: Trace;\n  viewport: Viewport;\n  selectedSpan?: Span;\n  onSpanClick: (span: Span) => void;\n  matchingSpanIds?: string[];\n  focusedSpanId?: string;\n}\n\nexport function GanttTable(props: GanttTableProps): ReactElement {\n  const { options, customLinks, trace, viewport, selectedSpan, onSpanClick, matchingSpanIds, focusedSpanId } = props;\n  const { collapsedSpans, setCollapsedSpans, setVisibleSpans } = useGanttTableContext();\n  const [nameColumnWidth, setNameColumnWidth] = useState<number>(0.25);\n  const tableRef = useRef<HTMLDivElement>(null);\n  const virtuosoRef = useRef<VirtuosoHandle>(null);\n  const theme = useTheme();\n\n  // Recursively flatten the span tree to a list of rows, hiding collapsed child spans.\n  const rows = useMemo(() => {\n    const rows: Span[] = [];\n    forEachSpan(trace.rootSpans, (span) => {\n      rows.push(span);\n      if (collapsedSpans.has(span.spanId)) {\n        return false;\n      }\n    });\n    return rows;\n  }, [trace.rootSpans, collapsedSpans]);\n  const matchingSpanIdSet = useMemo(() => new Set(matchingSpanIds ?? []), [matchingSpanIds]);\n\n  // Auto-expand collapsed ancestors when focusing a search match\n  useEffect(() => {\n    if (!focusedSpanId) return;\n\n    const span = trace.spanById.get(focusedSpanId);\n    if (!span) return;\n\n    const ancestorIds = new Set<string>();\n    let parent = span.parentSpan;\n    while (parent) {\n      ancestorIds.add(parent.spanId);\n      parent = parent.parentSpan;\n    }\n    if (ancestorIds.size > 0) {\n      setCollapsedSpans((prev) => {\n        const next = new Set(prev);\n        let changed = false;\n        for (const id of ancestorIds) {\n          if (next.delete(id)) changed = true;\n        }\n        return changed ? next : prev;\n      });\n    }\n  }, [focusedSpanId, trace.spanById, setCollapsedSpans]);\n\n  // Scroll to focused span when using prev/next buttons in search bar.\n  useEffect(() => {\n    if (!focusedSpanId || !virtuosoRef.current) return;\n\n    const index = rows.findIndex((r) => r.spanId === focusedSpanId);\n    if (index >= 0) {\n      virtuosoRef.current.scrollToIndex({ index, align: 'center' });\n    }\n  }, [focusedSpanId, rows]);\n\n  // Set the top most index in the Virtuoso table to the selected span\n  // Required e.g. when navigating from another page.\n  const initialTopMostSpanIndex = useMemo(() => {\n    if (!selectedSpan) return 0;\n    const index = rows.findIndex((r) => r.spanId === selectedSpan.spanId);\n    return index >= 0 ? index : 0;\n  }, [rows, selectedSpan]);\n\n  const divider = <ResizableDivider parentRef={tableRef} onMove={setNameColumnWidth} />;\n\n  // update currently visible spans\n  function handleRangeChange({ startIndex, endIndex }: ListRange): void {\n    const visibleSpans: string[] = [];\n    for (let i = startIndex; i <= endIndex; i++) {\n      visibleSpans.push(rows[i]!.spanId);\n    }\n    setVisibleSpans(visibleSpans);\n  }\n\n  return (\n    <Box\n      ref={tableRef}\n      sx={{\n        display: 'flex',\n        flexDirection: 'column',\n        flexGrow: 1,\n        border: `1px solid ${theme.palette.divider}`,\n        borderRadius: `${theme.shape.borderRadius}px`,\n      }}\n    >\n      <GanttTableHeader trace={trace} viewport={viewport} nameColumnWidth={nameColumnWidth} divider={divider} />\n      <Virtuoso\n        ref={virtuosoRef}\n        data={rows}\n        initialTopMostItemIndex={initialTopMostSpanIndex}\n        itemContent={(_, span) => (\n          <GanttTableRow\n            options={options}\n            customLinks={customLinks}\n            span={span}\n            viewport={viewport}\n            selected={span === selectedSpan}\n            matched={matchingSpanIdSet.has(span.spanId)}\n            focused={span.spanId === focusedSpanId}\n            nameColumnWidth={nameColumnWidth}\n            divider={divider}\n            onClick={onSpanClick}\n          />\n        )}\n        rangeChanged={handleRangeChange}\n      />\n    </Box>\n  );\n}\n"],"names":["Virtuoso","useEffect","useMemo","useRef","useState","Box","useTheme","forEachSpan","useGanttTableContext","GanttTableRow","GanttTableHeader","ResizableDivider","GanttTable","props","options","customLinks","trace","viewport","selectedSpan","onSpanClick","matchingSpanIds","focusedSpanId","collapsedSpans","setCollapsedSpans","setVisibleSpans","nameColumnWidth","setNameColumnWidth","tableRef","virtuosoRef","theme","rows","rootSpans","span","push","has","spanId","matchingSpanIdSet","Set","spanById","get","ancestorIds","parent","parentSpan","add","size","prev","next","changed","id","delete","current","index","findIndex","r","scrollToIndex","align","initialTopMostSpanIndex","divider","parentRef","onMove","handleRangeChange","startIndex","endIndex","visibleSpans","i","ref","sx","display","flexDirection","flexGrow","border","palette","borderRadius","shape","data","initialTopMostItemIndex","itemContent","_","selected","matched","focused","onClick","rangeChanged"],"mappings":"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"}
+{"version":3,"sources":["../../../../src/TracingGanttChart/GanttTable/GanttTable.tsx"],"sourcesContent":["// Copyright The Perses Authors\n// Licensed under the Apache License, Version 2.0 (the \"License\");\n// you may not use this file except in compliance with the License.\n// You may obtain a copy of the License at\n//\n// http://www.apache.org/licenses/LICENSE-2.0\n//\n// Unless required by applicable law or agreed to in writing, software\n// distributed under the License is distributed on an \"AS IS\" BASIS,\n// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n// See the License for the specific language governing permissions and\n// limitations under the License.\n\nimport { Box, useTheme } from '@mui/material';\nimport type { ReactElement } from 'react';\nimport { useEffect, useMemo, useRef, useState } from 'react';\nimport type { VirtuosoHandle, ListRange } from 'react-virtuoso';\nimport { Virtuoso } from 'react-virtuoso';\n\nimport type { CustomLinks, TracingGanttChartOptions } from '../../gantt-chart-model';\nimport type { Span, Trace } from '../trace';\nimport { forEachSpan } from '../trace';\nimport type { Viewport } from '../utils';\nimport { GanttTableHeader } from './GanttTableHeader';\nimport { useGanttTableContext } from './GanttTableProvider';\nimport { GanttTableRow } from './GanttTableRow';\nimport { ResizableDivider } from './ResizableDivider';\n\nexport interface GanttTableProps {\n  options: TracingGanttChartOptions;\n  customLinks?: CustomLinks;\n  trace: Trace;\n  viewport: Viewport;\n  selectedSpan?: Span;\n  onSpanClick: (span: Span) => void;\n  matchingSpanIds?: string[];\n  focusedSpanId?: string;\n}\n\nexport function GanttTable(props: GanttTableProps): ReactElement {\n  const { options, customLinks, trace, viewport, selectedSpan, onSpanClick, matchingSpanIds, focusedSpanId } = props;\n  const { collapsedSpans, setCollapsedSpans, setVisibleSpans } = useGanttTableContext();\n  const [nameColumnWidth, setNameColumnWidth] = useState<number>(0.25);\n  const tableRef = useRef<HTMLDivElement>(null);\n  const virtuosoRef = useRef<VirtuosoHandle>(null);\n  const theme = useTheme();\n\n  // Recursively flatten the span tree to a list of rows, hiding collapsed child spans.\n  const rows = useMemo(() => {\n    const rows: Span[] = [];\n    forEachSpan(trace.rootSpans, (span) => {\n      rows.push(span);\n      if (collapsedSpans.has(span.spanId)) {\n        return false;\n      }\n    });\n    return rows;\n  }, [trace.rootSpans, collapsedSpans]);\n  const matchingSpanIdSet = useMemo(() => new Set(matchingSpanIds ?? []), [matchingSpanIds]);\n\n  // Auto-expand collapsed ancestors when focusing a search match\n  useEffect(() => {\n    if (!focusedSpanId) return;\n\n    const span = trace.spanById.get(focusedSpanId);\n    if (!span) return;\n\n    const ancestorIds = new Set<string>();\n    let parent = span.parentSpan;\n    while (parent) {\n      ancestorIds.add(parent.spanId);\n      parent = parent.parentSpan;\n    }\n    if (ancestorIds.size > 0) {\n      setCollapsedSpans((prev) => {\n        const next = new Set(prev);\n        let changed = false;\n        for (const id of ancestorIds) {\n          if (next.delete(id)) changed = true;\n        }\n        return changed ? next : prev;\n      });\n    }\n  }, [focusedSpanId, trace.spanById, setCollapsedSpans]);\n\n  // Scroll to focused span when using prev/next buttons in search bar.\n  useEffect(() => {\n    if (!focusedSpanId || !virtuosoRef.current) return;\n\n    const index = rows.findIndex((r) => r.spanId === focusedSpanId);\n    if (index >= 0) {\n      virtuosoRef.current.scrollToIndex({ index, align: 'center' });\n    }\n  }, [focusedSpanId, rows]);\n\n  // Set the top most index in the Virtuoso table to the selected span\n  // Required e.g. when navigating from another page.\n  const initialTopMostSpanIndex = useMemo(() => {\n    if (!selectedSpan) return 0;\n    const index = rows.findIndex((r) => r.spanId === selectedSpan.spanId);\n    return index >= 0 ? index : 0;\n  }, [rows, selectedSpan]);\n\n  const divider = <ResizableDivider parentRef={tableRef} onMove={setNameColumnWidth} />;\n\n  // update currently visible spans\n  function handleRangeChange({ startIndex, endIndex }: ListRange): void {\n    const visibleSpans: string[] = [];\n    for (let i = startIndex; i <= endIndex; i++) {\n      visibleSpans.push(rows[i]!.spanId);\n    }\n    setVisibleSpans(visibleSpans);\n  }\n\n  return (\n    <Box\n      ref={tableRef}\n      sx={{\n        display: 'flex',\n        flexDirection: 'column',\n        flexGrow: 1,\n        border: `1px solid ${theme.palette.divider}`,\n        borderRadius: `${theme.shape.borderRadius}px`,\n      }}\n    >\n      <GanttTableHeader trace={trace} viewport={viewport} nameColumnWidth={nameColumnWidth} divider={divider} />\n      <Virtuoso\n        ref={virtuosoRef}\n        data={rows}\n        initialTopMostItemIndex={initialTopMostSpanIndex}\n        itemContent={(_, span) => (\n          <GanttTableRow\n            options={options}\n            customLinks={customLinks}\n            span={span}\n            viewport={viewport}\n            selected={span === selectedSpan}\n            matched={matchingSpanIdSet.has(span.spanId)}\n            focused={span.spanId === focusedSpanId}\n            nameColumnWidth={nameColumnWidth}\n            divider={divider}\n            onClick={onSpanClick}\n          />\n        )}\n        rangeChanged={handleRangeChange}\n      />\n    </Box>\n  );\n}\n"],"names":["Box","useTheme","useEffect","useMemo","useRef","useState","Virtuoso","forEachSpan","GanttTableHeader","useGanttTableContext","GanttTableRow","ResizableDivider","GanttTable","props","options","customLinks","trace","viewport","selectedSpan","onSpanClick","matchingSpanIds","focusedSpanId","collapsedSpans","setCollapsedSpans","setVisibleSpans","nameColumnWidth","setNameColumnWidth","tableRef","virtuosoRef","theme","rows","rootSpans","span","push","has","spanId","matchingSpanIdSet","Set","spanById","get","ancestorIds","parent","parentSpan","add","size","prev","next","changed","id","delete","current","index","findIndex","r","scrollToIndex","align","initialTopMostSpanIndex","divider","parentRef","onMove","handleRangeChange","startIndex","endIndex","visibleSpans","i","ref","sx","display","flexDirection","flexGrow","border","palette","borderRadius","shape","data","initialTopMostItemIndex","itemContent","_","selected","matched","focused","onClick","rangeChanged"],"mappings":"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"}

package/lib/TracingGanttChart/GanttTable/GanttTableHeader.d.ts

@@ -1,6 +1,6 @@
-import { ReactElement } from 'react';
-import { Viewport } from '../utils';
-import { Trace } from '../trace';
+import type { ReactElement } from 'react';
+import type { Trace } from '../trace';
+import type { Viewport } from '../utils';
 interface GanttTableHeaderProps {
     trace: Trace;
     viewport: Viewport;

package/lib/TracingGanttChart/GanttTable/GanttTableHeader.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"GanttTableHeader.d.ts","sourceRoot":"","sources":["../../../../src/TracingGanttChart/GanttTable/GanttTableHeader.tsx"],"names":[],"mappings":"AAcA,OAAO,EAAE,YAAY,EAAE,MAAM,OAAO,CAAC;AACrC,OAAO,EAAE,QAAQ,EAAa,MAAM,UAAU,CAAC;AAE/C,OAAO,EAAE,KAAK,EAAE,MAAM,UAAU,CAAC;AAEjC,UAAU,qBAAqB;IAC7B,KAAK,EAAE,KAAK,CAAC;IACb,QAAQ,EAAE,QAAQ,CAAC;IACnB,eAAe,EAAE,MAAM,CAAC;IACxB,OAAO,EAAE,KAAK,CAAC,SAAS,CAAC;CAC1B;AAED,wBAAgB,gBAAgB,CAAC,KAAK,EAAE,qBAAqB,GAAG,YAAY,CAuB3E"}
+{"version":3,"file":"GanttTableHeader.d.ts","sourceRoot":"","sources":["../../../../src/TracingGanttChart/GanttTable/GanttTableHeader.tsx"],"names":[],"mappings":"AAcA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,OAAO,CAAC;AAG1C,OAAO,KAAK,EAAE,KAAK,EAAE,MAAM,UAAU,CAAC;AACtC,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,UAAU,CAAC;AAGzC,UAAU,qBAAqB;IAC7B,KAAK,EAAE,KAAK,CAAC;IACb,QAAQ,EAAE,QAAQ,CAAC;IACnB,eAAe,EAAE,MAAM,CAAC;IACxB,OAAO,EAAE,KAAK,CAAC,SAAS,CAAC;CAC1B;AAED,wBAAgB,gBAAgB,CAAC,KAAK,EAAE,qBAAqB,GAAG,YAAY,CAuB3E"}

package/lib/TracingGanttChart/GanttTable/GanttTableHeader.js

@@ -11,9 +11,9 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 // WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 // See the License for the specific language governing permissions and
 // limitations under the License.
-import { Box, Stack, useTheme } from '@mui/material';
-import { rowHeight } from '../utils';
-import { TicksHeader } from '../Ticks';
+import { Box, Stack, useTheme } from "@mui/material";
+import { TicksHeader } from "../Ticks.js";
+import { rowHeight } from "../utils.js";
 export function GanttTableHeader(props) {
     const { trace, viewport, nameColumnWidth, divider } = props;
     const theme = useTheme();

package/lib/TracingGanttChart/GanttTable/GanttTableHeader.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/TracingGanttChart/GanttTable/GanttTableHeader.tsx"],"sourcesContent":["// Copyright The Perses Authors\n// Licensed under the Apache License, Version 2.0 (the \"License\");\n// you may not use this file except in compliance with the License.\n// You may obtain a copy of the License at\n//\n// http://www.apache.org/licenses/LICENSE-2.0\n//\n// Unless required by applicable law or agreed to in writing, software\n// distributed under the License is distributed on an \"AS IS\" BASIS,\n// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n// See the License for the specific language governing permissions and\n// limitations under the License.\n\nimport { Box, Stack, useTheme } from '@mui/material';\nimport { ReactElement } from 'react';\nimport { Viewport, rowHeight } from '../utils';\nimport { TicksHeader } from '../Ticks';\nimport { Trace } from '../trace';\n\ninterface GanttTableHeaderProps {\n  trace: Trace;\n  viewport: Viewport;\n  nameColumnWidth: number;\n  divider: React.ReactNode;\n}\n\nexport function GanttTableHeader(props: GanttTableHeaderProps): ReactElement {\n  const { trace, viewport, nameColumnWidth, divider } = props;\n  const theme = useTheme();\n\n  return (\n    <Stack\n      direction=\"row\"\n      alignItems=\"center\"\n      sx={{\n        height: rowHeight,\n        fontSize: '0.9rem',\n        borderBottom: `1px solid ${theme.palette.divider}`,\n      }}\n    >\n      <Box style={{ width: `${nameColumnWidth * 100}%` }}>\n        <span style={{ padding: '.25rem' }}>Service & Operation</span>\n      </Box>\n      {divider}\n      <Box sx={{ position: 'relative', height: '100%', flexGrow: 1 }}>\n        <TicksHeader trace={trace} viewport={viewport} />\n      </Box>\n    </Stack>\n  );\n}\n"],"names":["Box","Stack","useTheme","rowHeight","TicksHeader","GanttTableHeader","props","trace","viewport","nameColumnWidth","divider","theme","direction","alignItems","sx","height","fontSize","borderBottom","palette","style","width","span","padding","position","flexGrow"],"mappings":";AAAA,+BAA+B;AAC/B,kEAAkE;AAClE,mEAAmE;AACnE,0CAA0C;AAC1C,EAAE;AACF,6CAA6C;AAC7C,EAAE;AACF,sEAAsE;AACtE,oEAAoE;AACpE,2EAA2E;AAC3E,sEAAsE;AACtE,iCAAiC;AAEjC,SAASA,GAAG,EAAEC,KAAK,EAAEC,QAAQ,QAAQ,gBAAgB;AAErD,SAAmBC,SAAS,QAAQ,WAAW;AAC/C,SAASC,WAAW,QAAQ,WAAW;AAUvC,OAAO,SAASC,iBAAiBC,KAA4B;IAC3D,MAAM,EAAEC,KAAK,EAAEC,QAAQ,EAAEC,eAAe,EAAEC,OAAO,EAAE,GAAGJ;IACtD,MAAMK,QAAQT;IAEd,qBACE,MAACD;QACCW,WAAU;QACVC,YAAW;QACXC,IAAI;YACFC,QAAQZ;YACRa,UAAU;YACVC,cAAc,CAAC,UAAU,EAAEN,MAAMO,OAAO,CAACR,OAAO,EAAE;QACpD;;0BAEA,KAACV;gBAAImB,OAAO;oBAAEC,OAAO,GAAGX,kBAAkB,IAAI,CAAC,CAAC;gBAAC;0BAC/C,cAAA,KAACY;oBAAKF,OAAO;wBAAEG,SAAS;oBAAS;8BAAG;;;YAErCZ;0BACD,KAACV;gBAAIc,IAAI;oBAAES,UAAU;oBAAYR,QAAQ;oBAAQS,UAAU;gBAAE;0BAC3D,cAAA,KAACpB;oBAAYG,OAAOA;oBAAOC,UAAUA;;;;;AAI7C"}
+{"version":3,"sources":["../../../../src/TracingGanttChart/GanttTable/GanttTableHeader.tsx"],"sourcesContent":["// Copyright The Perses Authors\n// Licensed under the Apache License, Version 2.0 (the \"License\");\n// you may not use this file except in compliance with the License.\n// You may obtain a copy of the License at\n//\n// http://www.apache.org/licenses/LICENSE-2.0\n//\n// Unless required by applicable law or agreed to in writing, software\n// distributed under the License is distributed on an \"AS IS\" BASIS,\n// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n// See the License for the specific language governing permissions and\n// limitations under the License.\n\nimport { Box, Stack, useTheme } from '@mui/material';\nimport type { ReactElement } from 'react';\n\nimport { TicksHeader } from '../Ticks';\nimport type { Trace } from '../trace';\nimport type { Viewport } from '../utils';\nimport { rowHeight } from '../utils';\n\ninterface GanttTableHeaderProps {\n  trace: Trace;\n  viewport: Viewport;\n  nameColumnWidth: number;\n  divider: React.ReactNode;\n}\n\nexport function GanttTableHeader(props: GanttTableHeaderProps): ReactElement {\n  const { trace, viewport, nameColumnWidth, divider } = props;\n  const theme = useTheme();\n\n  return (\n    <Stack\n      direction=\"row\"\n      alignItems=\"center\"\n      sx={{\n        height: rowHeight,\n        fontSize: '0.9rem',\n        borderBottom: `1px solid ${theme.palette.divider}`,\n      }}\n    >\n      <Box style={{ width: `${nameColumnWidth * 100}%` }}>\n        <span style={{ padding: '.25rem' }}>Service & Operation</span>\n      </Box>\n      {divider}\n      <Box sx={{ position: 'relative', height: '100%', flexGrow: 1 }}>\n        <TicksHeader trace={trace} viewport={viewport} />\n      </Box>\n    </Stack>\n  );\n}\n"],"names":["Box","Stack","useTheme","TicksHeader","rowHeight","GanttTableHeader","props","trace","viewport","nameColumnWidth","divider","theme","direction","alignItems","sx","height","fontSize","borderBottom","palette","style","width","span","padding","position","flexGrow"],"mappings":";AAAA,+BAA+B;AAC/B,kEAAkE;AAClE,mEAAmE;AACnE,0CAA0C;AAC1C,EAAE;AACF,6CAA6C;AAC7C,EAAE;AACF,sEAAsE;AACtE,oEAAoE;AACpE,2EAA2E;AAC3E,sEAAsE;AACtE,iCAAiC;AAEjC,SAASA,GAAG,EAAEC,KAAK,EAAEC,QAAQ,QAAQ,gBAAgB;AAGrD,SAASC,WAAW,QAAQ,cAAW;AAGvC,SAASC,SAAS,QAAQ,cAAW;AASrC,OAAO,SAASC,iBAAiBC,KAA4B;IAC3D,MAAM,EAAEC,KAAK,EAAEC,QAAQ,EAAEC,eAAe,EAAEC,OAAO,EAAE,GAAGJ;IACtD,MAAMK,QAAQT;IAEd,qBACE,MAACD;QACCW,WAAU;QACVC,YAAW;QACXC,IAAI;YACFC,QAAQX;YACRY,UAAU;YACVC,cAAc,CAAC,UAAU,EAAEN,MAAMO,OAAO,CAACR,OAAO,EAAE;QACpD;;0BAEA,KAACV;gBAAImB,OAAO;oBAAEC,OAAO,GAAGX,kBAAkB,IAAI,CAAC,CAAC;gBAAC;0BAC/C,cAAA,KAACY;oBAAKF,OAAO;wBAAEG,SAAS;oBAAS;8BAAG;;;YAErCZ;0BACD,KAACV;gBAAIc,IAAI;oBAAES,UAAU;oBAAYR,QAAQ;oBAAQS,UAAU;gBAAE;0BAC3D,cAAA,KAACrB;oBAAYI,OAAOA;oBAAOC,UAAUA;;;;;AAI7C"}

package/lib/TracingGanttChart/GanttTable/GanttTableProvider.d.ts

@@ -1,4 +1,4 @@
-import { ReactElement } from 'react';
+import type { ReactElement } from 'react';
 interface GanttTableContextType {
     collapsedSpans: Set<string>;
     setCollapsedSpans: React.Dispatch<React.SetStateAction<Set<string>>>;

package/lib/TracingGanttChart/GanttTable/GanttTableProvider.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"GanttTableProvider.d.ts","sourceRoot":"","sources":["../../../../src/TracingGanttChart/GanttTable/GanttTableProvider.tsx"],"names":[],"mappings":"AAaA,OAAO,EAAiB,YAAY,EAAwB,MAAM,OAAO,CAAC;AAE1E,UAAU,qBAAqB;IAC7B,cAAc,EAAE,GAAG,CAAC,MAAM,CAAC,CAAC;IAC5B,iBAAiB,EAAE,KAAK,CAAC,QAAQ,CAAC,KAAK,CAAC,cAAc,CAAC,GAAG,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC;IACrE,YAAY,EAAE,MAAM,EAAE,CAAC;IACvB,eAAe,EAAE,CAAC,CAAC,EAAE,MAAM,EAAE,KAAK,IAAI,CAAC;IACvC,mFAAmF;IACnF,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,gBAAgB,EAAE,CAAC,CAAC,CAAC,EAAE,MAAM,KAAK,IAAI,CAAC;CACxC;AAED;;;;GAIG;AACH,eAAO,MAAM,iBAAiB,4DAA8D,CAAC;AAE7F,UAAU,uBAAuB;IAC/B,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CAC5B;AAED,wBAAgB,kBAAkB,CAAC,KAAK,EAAE,uBAAuB,GAAG,YAAY,CAa/E;AAED,wBAAgB,oBAAoB,IAAI,qBAAqB,CAM5D"}
+{"version":3,"file":"GanttTableProvider.d.ts","sourceRoot":"","sources":["../../../../src/TracingGanttChart/GanttTable/GanttTableProvider.tsx"],"names":[],"mappings":"AAaA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,OAAO,CAAC;AAG1C,UAAU,qBAAqB;IAC7B,cAAc,EAAE,GAAG,CAAC,MAAM,CAAC,CAAC;IAC5B,iBAAiB,EAAE,KAAK,CAAC,QAAQ,CAAC,KAAK,CAAC,cAAc,CAAC,GAAG,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC;IACrE,YAAY,EAAE,MAAM,EAAE,CAAC;IACvB,eAAe,EAAE,CAAC,CAAC,EAAE,MAAM,EAAE,KAAK,IAAI,CAAC;IACvC,mFAAmF;IACnF,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,gBAAgB,EAAE,CAAC,CAAC,CAAC,EAAE,MAAM,KAAK,IAAI,CAAC;CACxC;AAED;;;;GAIG;AACH,eAAO,MAAM,iBAAiB,4DAA8D,CAAC;AAE7F,UAAU,uBAAuB;IAC/B,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CAC5B;AAED,wBAAgB,kBAAkB,CAAC,KAAK,EAAE,uBAAuB,GAAG,YAAY,CAa/E;AAED,wBAAgB,oBAAoB,IAAI,qBAAqB,CAM5D"}

package/lib/TracingGanttChart/GanttTable/GanttTableProvider.js

@@ -1,4 +1,3 @@
-import { jsx as _jsx } from "react/jsx-runtime";
 // Copyright The Perses Authors
 // Licensed under the Apache License, Version 2.0 (the "License");
 // you may not use this file except in compliance with the License.
@@ -11,7 +10,8 @@ import { jsx as _jsx } from "react/jsx-runtime";
 // WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 // See the License for the specific language governing permissions and
 // limitations under the License.
-import { createContext, useContext, useState } from 'react';
+import { jsx as _jsx } from "react/jsx-runtime";
+import { createContext, useContext, useState } from "react";
 /**
  * GanttTableContext stores UI state of the rows.
  * Required for passing down state to deeply nested <SpanIndents>,

package/lib/TracingGanttChart/GanttTable/GanttTableProvider.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/TracingGanttChart/GanttTable/GanttTableProvider.tsx"],"sourcesContent":["// Copyright The Perses Authors\n// Licensed under the Apache License, Version 2.0 (the \"License\");\n// you may not use this file except in compliance with the License.\n// You may obtain a copy of the License at\n//\n// http://www.apache.org/licenses/LICENSE-2.0\n//\n// Unless required by applicable law or agreed to in writing, software\n// distributed under the License is distributed on an \"AS IS\" BASIS,\n// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n// See the License for the specific language governing permissions and\n// limitations under the License.\n\nimport { createContext, ReactElement, useContext, useState } from 'react';\n\ninterface GanttTableContextType {\n  collapsedSpans: Set<string>;\n  setCollapsedSpans: React.Dispatch<React.SetStateAction<Set<string>>>;\n  visibleSpans: string[];\n  setVisibleSpans: (s: string[]) => void;\n  /** can be a spanId, an empty string for the root span or undefined for no hover */\n  hoveredParent?: string;\n  setHoveredParent: (s?: string) => void;\n}\n\n/**\n * GanttTableContext stores UI state of the rows.\n * Required for passing down state to deeply nested <SpanIndents>,\n * without re-rendering intermediate components.\n */\nexport const GanttTableContext = createContext<GanttTableContextType | undefined>(undefined);\n\ninterface GanttTableProviderProps {\n  children?: React.ReactNode;\n}\n\nexport function GanttTableProvider(props: GanttTableProviderProps): ReactElement {\n  const { children } = props;\n  const [collapsedSpans, setCollapsedSpans] = useState<Set<string>>(new Set());\n  const [visibleSpans, setVisibleSpans] = useState<string[]>([]);\n  const [hoveredParent, setHoveredParent] = useState<string | undefined>(undefined);\n\n  return (\n    <GanttTableContext.Provider\n      value={{ collapsedSpans, setCollapsedSpans, visibleSpans, setVisibleSpans, hoveredParent, setHoveredParent }}\n    >\n      {children}\n    </GanttTableContext.Provider>\n  );\n}\n\nexport function useGanttTableContext(): GanttTableContextType {\n  const ctx = useContext(GanttTableContext);\n  if (ctx === undefined) {\n    throw new Error('No GanttTableContext found. Did you forget a Provider?');\n  }\n  return ctx;\n}\n"],"names":["createContext","useContext","useState","GanttTableContext","undefined","GanttTableProvider","props","children","collapsedSpans","setCollapsedSpans","Set","visibleSpans","setVisibleSpans","hoveredParent","setHoveredParent","Provider","value","useGanttTableContext","ctx","Error"],"mappings":";AAAA,+BAA+B;AAC/B,kEAAkE;AAClE,mEAAmE;AACnE,0CAA0C;AAC1C,EAAE;AACF,6CAA6C;AAC7C,EAAE;AACF,sEAAsE;AACtE,oEAAoE;AACpE,2EAA2E;AAC3E,sEAAsE;AACtE,iCAAiC;AAEjC,SAASA,aAAa,EAAgBC,UAAU,EAAEC,QAAQ,QAAQ,QAAQ;AAY1E;;;;CAIC,GACD,OAAO,MAAMC,kCAAoBH,cAAiDI,WAAW;AAM7F,OAAO,SAASC,mBAAmBC,KAA8B;IAC/D,MAAM,EAAEC,QAAQ,EAAE,GAAGD;IACrB,MAAM,CAACE,gBAAgBC,kBAAkB,GAAGP,SAAsB,IAAIQ;IACtE,MAAM,CAACC,cAAcC,gBAAgB,GAAGV,SAAmB,EAAE;IAC7D,MAAM,CAACW,eAAeC,iBAAiB,GAAGZ,SAA6BE;IAEvE,qBACE,KAACD,kBAAkBY,QAAQ;QACzBC,OAAO;YAAER;YAAgBC;YAAmBE;YAAcC;YAAiBC;YAAeC;QAAiB;kBAE1GP;;AAGP;AAEA,OAAO,SAASU;IACd,MAAMC,MAAMjB,WAAWE;IACvB,IAAIe,QAAQd,WAAW;QACrB,MAAM,IAAIe,MAAM;IAClB;IACA,OAAOD;AACT"}
+{"version":3,"sources":["../../../../src/TracingGanttChart/GanttTable/GanttTableProvider.tsx"],"sourcesContent":["// Copyright The Perses Authors\n// Licensed under the Apache License, Version 2.0 (the \"License\");\n// you may not use this file except in compliance with the License.\n// You may obtain a copy of the License at\n//\n// http://www.apache.org/licenses/LICENSE-2.0\n//\n// Unless required by applicable law or agreed to in writing, software\n// distributed under the License is distributed on an \"AS IS\" BASIS,\n// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n// See the License for the specific language governing permissions and\n// limitations under the License.\n\nimport type { ReactElement } from 'react';\nimport { createContext, useContext, useState } from 'react';\n\ninterface GanttTableContextType {\n  collapsedSpans: Set<string>;\n  setCollapsedSpans: React.Dispatch<React.SetStateAction<Set<string>>>;\n  visibleSpans: string[];\n  setVisibleSpans: (s: string[]) => void;\n  /** can be a spanId, an empty string for the root span or undefined for no hover */\n  hoveredParent?: string;\n  setHoveredParent: (s?: string) => void;\n}\n\n/**\n * GanttTableContext stores UI state of the rows.\n * Required for passing down state to deeply nested <SpanIndents>,\n * without re-rendering intermediate components.\n */\nexport const GanttTableContext = createContext<GanttTableContextType | undefined>(undefined);\n\ninterface GanttTableProviderProps {\n  children?: React.ReactNode;\n}\n\nexport function GanttTableProvider(props: GanttTableProviderProps): ReactElement {\n  const { children } = props;\n  const [collapsedSpans, setCollapsedSpans] = useState<Set<string>>(new Set());\n  const [visibleSpans, setVisibleSpans] = useState<string[]>([]);\n  const [hoveredParent, setHoveredParent] = useState<string | undefined>(undefined);\n\n  return (\n    <GanttTableContext.Provider\n      value={{ collapsedSpans, setCollapsedSpans, visibleSpans, setVisibleSpans, hoveredParent, setHoveredParent }}\n    >\n      {children}\n    </GanttTableContext.Provider>\n  );\n}\n\nexport function useGanttTableContext(): GanttTableContextType {\n  const ctx = useContext(GanttTableContext);\n  if (ctx === undefined) {\n    throw new Error('No GanttTableContext found. Did you forget a Provider?');\n  }\n  return ctx;\n}\n"],"names":["createContext","useContext","useState","GanttTableContext","undefined","GanttTableProvider","props","children","collapsedSpans","setCollapsedSpans","Set","visibleSpans","setVisibleSpans","hoveredParent","setHoveredParent","Provider","value","useGanttTableContext","ctx","Error"],"mappings":"AAAA,+BAA+B;AAC/B,kEAAkE;AAClE,mEAAmE;AACnE,0CAA0C;AAC1C,EAAE;AACF,6CAA6C;AAC7C,EAAE;AACF,sEAAsE;AACtE,oEAAoE;AACpE,2EAA2E;AAC3E,sEAAsE;AACtE,iCAAiC;;AAGjC,SAASA,aAAa,EAAEC,UAAU,EAAEC,QAAQ,QAAQ,QAAQ;AAY5D;;;;CAIC,GACD,OAAO,MAAMC,kCAAoBH,cAAiDI,WAAW;AAM7F,OAAO,SAASC,mBAAmBC,KAA8B;IAC/D,MAAM,EAAEC,QAAQ,EAAE,GAAGD;IACrB,MAAM,CAACE,gBAAgBC,kBAAkB,GAAGP,SAAsB,IAAIQ;IACtE,MAAM,CAACC,cAAcC,gBAAgB,GAAGV,SAAmB,EAAE;IAC7D,MAAM,CAACW,eAAeC,iBAAiB,GAAGZ,SAA6BE;IAEvE,qBACE,KAACD,kBAAkBY,QAAQ;QACzBC,OAAO;YAAER;YAAgBC;YAAmBE;YAAcC;YAAiBC;YAAeC;QAAiB;kBAE1GP;;AAGP;AAEA,OAAO,SAASU;IACd,MAAMC,MAAMjB,WAAWE;IACvB,IAAIe,QAAQd,WAAW;QACrB,MAAM,IAAIe,MAAM;IAClB;IACA,OAAOD;AACT"}

package/lib/TracingGanttChart/GanttTable/GanttTableRow.d.ts

@@ -1,6 +1,6 @@
-import { Viewport } from '../utils';
-import { CustomLinks, TracingGanttChartOptions } from '../../gantt-chart-model';
-import { Span } from '../trace';
+import type { CustomLinks, TracingGanttChartOptions } from '../../gantt-chart-model';
+import type { Span } from '../trace';
+import type { Viewport } from '../utils';
 interface GanttTableRowProps {
     options: TracingGanttChartOptions;
     customLinks?: CustomLinks;

package/lib/TracingGanttChart/GanttTable/GanttTableRow.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"GanttTableRow.d.ts","sourceRoot":"","sources":["../../../../src/TracingGanttChart/GanttTable/GanttTableRow.tsx"],"names":[],"mappings":"AAeA,OAAO,EAAE,QAAQ,EAAa,MAAM,UAAU,CAAC;AAC/C,OAAO,EAAE,WAAW,EAAE,wBAAwB,EAAE,MAAM,yBAAyB,CAAC;AAChF,OAAO,EAAE,IAAI,EAAE,MAAM,UAAU,CAAC;AAIhC,UAAU,kBAAkB;IAC1B,OAAO,EAAE,wBAAwB,CAAC;IAClC,WAAW,CAAC,EAAE,WAAW,CAAC;IAC1B,IAAI,EAAE,IAAI,CAAC;IACX,QAAQ,EAAE,QAAQ,CAAC;IACnB,gDAAgD;IAChD,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,iDAAiD;IACjD,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,mEAAmE;IACnE,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,eAAe,EAAE,MAAM,CAAC;IACxB,OAAO,EAAE,KAAK,CAAC,SAAS,CAAC;IACzB,OAAO,EAAE,CAAC,IAAI,EAAE,IAAI,KAAK,IAAI,CAAC;CAC/B;AAED,eAAO,MAAM,aAAa,0DAmCxB,CAAC"}
+{"version":3,"file":"GanttTableRow.d.ts","sourceRoot":"","sources":["../../../../src/TracingGanttChart/GanttTable/GanttTableRow.tsx"],"names":[],"mappings":"AAgBA,OAAO,KAAK,EAAE,WAAW,EAAE,wBAAwB,EAAE,MAAM,yBAAyB,CAAC;AACrF,OAAO,KAAK,EAAE,IAAI,EAAE,MAAM,UAAU,CAAC;AACrC,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,UAAU,CAAC;AAKzC,UAAU,kBAAkB;IAC1B,OAAO,EAAE,wBAAwB,CAAC;IAClC,WAAW,CAAC,EAAE,WAAW,CAAC;IAC1B,IAAI,EAAE,IAAI,CAAC;IACX,QAAQ,EAAE,QAAQ,CAAC;IACnB,gDAAgD;IAChD,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,iDAAiD;IACjD,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,mEAAmE;IACnE,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,eAAe,EAAE,MAAM,CAAC;IACxB,OAAO,EAAE,KAAK,CAAC,SAAS,CAAC;IACzB,OAAO,EAAE,CAAC,IAAI,EAAE,IAAI,KAAK,IAAI,CAAC;CAC/B;AAED,eAAO,MAAM,aAAa,0DAmCxB,CAAC"}