@perses-dev/logs-table-plugin 0.1.0

package/lib/cjs/components/VirtualizedLogsList.js

@@ -0,0 +1,64 @@
+// Copyright 2025 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.
+// You may obtain a copy of the License at
+//
+// http://www.apache.org/licenses/LICENSE-2.0
+//
+// Unless required by applicable law or agreed to in writing, software
+// distributed under the License is distributed on an "AS IS" BASIS,
+// 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.
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+Object.defineProperty(exports, "VirtualizedLogsList", {
+    enumerable: true,
+    get: function() {
+        return VirtualizedLogsList;
+    }
+});
+const _jsxruntime = require("react/jsx-runtime");
+const _react = /*#__PURE__*/ _interop_require_default(require("react"));
+const _material = require("@mui/material");
+const _reactvirtuoso = require("react-virtuoso");
+const _LogRow = require("./LogRow/LogRow");
+function _interop_require_default(obj) {
+    return obj && obj.__esModule ? obj : {
+        default: obj
+    };
+}
+const VirtualizedLogsList = ({ logs, spec, expandedRows, onToggleExpand })=>{
+    const theme = (0, _material.useTheme)();
+    const renderLogRow = (index)=>{
+        const log = logs[index];
+        if (!log) return null;
+        return /*#__PURE__*/ (0, _jsxruntime.jsx)(_LogRow.LogRow, {
+            isExpandable: spec.enableDetails,
+            log: log,
+            index: index,
+            isExpanded: expandedRows.has(index),
+            onToggle: onToggleExpand,
+            allowWrap: spec.allowWrap,
+            showTime: spec.showTime
+        });
+    };
+    return /*#__PURE__*/ (0, _jsxruntime.jsx)(_material.Box, {
+        sx: {
+            height: '100%',
+            backgroundColor: theme.palette.background.default,
+            overflow: 'hidden',
+            boxShadow: theme.shadows[1]
+        },
+        children: /*#__PURE__*/ (0, _jsxruntime.jsx)(_reactvirtuoso.Virtuoso, {
+            style: {
+                height: '100%'
+            },
+            initialItemCount: spec.showAll ? logs.length : undefined,
+            totalCount: logs.length,
+            itemContent: renderLogRow
+        })
+    });
+};

package/lib/cjs/components/hooks/useExpandedRows.js

@@ -0,0 +1,45 @@
+// Copyright 2025 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.
+// You may obtain a copy of the License at
+//
+// http://www.apache.org/licenses/LICENSE-2.0
+//
+// Unless required by applicable law or agreed to in writing, software
+// distributed under the License is distributed on an "AS IS" BASIS,
+// 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.
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+Object.defineProperty(exports, "useExpandedRows", {
+    enumerable: true,
+    get: function() {
+        return useExpandedRows;
+    }
+});
+const _react = require("react");
+const useExpandedRows = ()=>{
+    const [expandedRows, setExpandedRows] = (0, _react.useState)(new Set());
+    const toggleExpand = (0, _react.useCallback)((index)=>{
+        setExpandedRows((prev)=>{
+            const newSet = new Set(prev);
+            if (newSet.has(index)) {
+                newSet.delete(index);
+            } else {
+                newSet.add(index);
+            }
+            return newSet;
+        });
+    }, []);
+    const clearExpanded = (0, _react.useCallback)(()=>{
+        setExpandedRows(new Set());
+    }, []);
+    return {
+        expandedRows,
+        toggleExpand,
+        clearExpanded
+    };
+};

package/lib/cjs/env.d.js

@@ -0,0 +1,14 @@
+// Copyright 2025 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.
+// You may obtain a copy of the License at
+//
+// http://www.apache.org/licenses/LICENSE-2.0
+//
+// Unless required by applicable law or agreed to in writing, software
+// distributed under the License is distributed on an "AS IS" BASIS,
+// 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.
+/// <reference types="@rsbuild/core/types" />
+"use strict";

package/lib/cjs/getPluginModule.js

@@ -0,0 +1,27 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+Object.defineProperty(exports, "getPluginModule", {
+    enumerable: true,
+    get: function() {
+        return getPluginModule;
+    }
+});
+const _packagejson = /*#__PURE__*/ _interop_require_default(require("../package.json"));
+function _interop_require_default(obj) {
+    return obj && obj.__esModule ? obj : {
+        default: obj
+    };
+}
+function getPluginModule() {
+    const { name, version, perses } = _packagejson.default;
+    return {
+        kind: 'PluginModule',
+        metadata: {
+            name,
+            version
+        },
+        spec: perses
+    };
+}

package/lib/cjs/index-federation.js

@@ -0,0 +1,55 @@
+// Copyright 2025 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.
+// You may obtain a copy of the License at
+//
+// http://www.apache.org/licenses/LICENSE-2.0
+//
+// Unless required by applicable law or agreed to in writing, software
+// distributed under the License is distributed on an "AS IS" BASIS,
+// 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.
+"use strict";
+function _getRequireWildcardCache(nodeInterop) {
+    if (typeof WeakMap !== "function") return null;
+    var cacheBabelInterop = new WeakMap();
+    var cacheNodeInterop = new WeakMap();
+    return (_getRequireWildcardCache = function(nodeInterop) {
+        return nodeInterop ? cacheNodeInterop : cacheBabelInterop;
+    })(nodeInterop);
+}
+function _interop_require_wildcard(obj, nodeInterop) {
+    if (!nodeInterop && obj && obj.__esModule) {
+        return obj;
+    }
+    if (obj === null || typeof obj !== "object" && typeof obj !== "function") {
+        return {
+            default: obj
+        };
+    }
+    var cache = _getRequireWildcardCache(nodeInterop);
+    if (cache && cache.has(obj)) {
+        return cache.get(obj);
+    }
+    var newObj = {
+        __proto__: null
+    };
+    var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor;
+    for(var key in obj){
+        if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) {
+            var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null;
+            if (desc && (desc.get || desc.set)) {
+                Object.defineProperty(newObj, key, desc);
+            } else {
+                newObj[key] = obj[key];
+            }
+        }
+    }
+    newObj.default = obj;
+    if (cache) {
+        cache.set(obj, newObj);
+    }
+    return newObj;
+}
+Promise.resolve().then(()=>/*#__PURE__*/ _interop_require_wildcard(require("./bootstrap")));

package/lib/cjs/index.js

@@ -0,0 +1,26 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+Object.defineProperty(exports, "getPluginModule", {
+    enumerable: true,
+    get: function() {
+        return _getPluginModule.getPluginModule;
+    }
+});
+const _getPluginModule = require("./getPluginModule");
+_export_star(require("./model"), exports);
+_export_star(require("./LogsTable"), exports);
+function _export_star(from, to) {
+    Object.keys(from).forEach(function(k) {
+        if (k !== "default" && !Object.prototype.hasOwnProperty.call(to, k)) {
+            Object.defineProperty(to, k, {
+                enumerable: true,
+                get: function() {
+                    return from[k];
+                }
+            });
+        }
+    });
+    return from;
+}

package/lib/cjs/model.js

@@ -0,0 +1,16 @@
+// Copyright 2025 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.
+// You may obtain a copy of the License at
+//
+// http://www.apache.org/licenses/LICENSE-2.0
+//
+// Unless required by applicable law or agreed to in writing, software
+// distributed under the License is distributed on an "AS IS" BASIS,
+// 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.
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});

package/lib/cjs/setup-tests.js

@@ -0,0 +1,19 @@
+// Copyright 2025 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.
+// You may obtain a copy of the License at
+//
+// http://www.apache.org/licenses/LICENSE-2.0
+//
+// Unless required by applicable law or agreed to in writing, software
+// distributed under the License is distributed on an "AS IS" BASIS,
+// 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.
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+require("@testing-library/jest-dom");
+// Always mock e-charts during tests since we don't have a proper canvas in jsdom
+jest.mock('echarts/core');

package/lib/cjs/test/mock-query-results.js

@@ -0,0 +1,76 @@
+// Copyright 2025 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.
+// You may obtain a copy of the License at
+//
+// http://www.apache.org/licenses/LICENSE-2.0
+//
+// Unless required by applicable law or agreed to in writing, software
+// distributed under the License is distributed on an "AS IS" BASIS,
+// 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.
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+function _export(target, all) {
+    for(var name in all)Object.defineProperty(target, name, {
+        enumerable: true,
+        get: all[name]
+    });
+}
+_export(exports, {
+    MOCK_LOGS_QUERY_DEFINITION: function() {
+        return MOCK_LOGS_QUERY_DEFINITION;
+    },
+    MOCK_LOGS_QUERY_RESULT: function() {
+        return MOCK_LOGS_QUERY_RESULT;
+    }
+});
+const MOCK_LOGS_QUERY_RESULT = {
+    logs: {
+        hasMore: false,
+        timeRange: {
+            start: new Date(1666625490),
+            end: new Date(1666625535)
+        },
+        entries: [
+            {
+                timestamp: 1666625490,
+                line: 'foo',
+                labels: {
+                    device: '/dev/vda1',
+                    env: 'demo',
+                    fstype: 'ext4',
+                    instance: 'demo.do.prometheus.io:9100',
+                    job: 'node',
+                    mountpoint: '/'
+                }
+            },
+            {
+                timestamp: 1666625491,
+                line: 'bar',
+                labels: {
+                    device: '/dev/vda15',
+                    env: 'demo',
+                    fstype: 'vfat',
+                    instance: 'demo.do.prometheus.io:9100',
+                    job: 'node',
+                    mountpoint: '/boot/efi'
+                }
+            }
+        ]
+    }
+};
+const MOCK_LOGS_QUERY_DEFINITION = {
+    kind: 'LogsQuery',
+    spec: {
+        plugin: {
+            kind: 'LokiLogsQuery',
+            spec: {
+                query: ''
+            }
+        }
+    }
+};

package/lib/components/EmptyLogsState.d.ts

@@ -0,0 +1,7 @@
+import React from 'react';
+interface EmptyLogsStateProps {
+    message?: string;
+}
+export declare const EmptyLogsState: React.FC<EmptyLogsStateProps>;
+export {};
+//# sourceMappingURL=EmptyLogsState.d.ts.map

package/lib/components/EmptyLogsState.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"EmptyLogsState.d.ts","sourceRoot":"","sources":["../../../src/components/EmptyLogsState.tsx"],"names":[],"mappings":"AAaA,OAAO,KAAK,MAAM,OAAO,CAAC;AAG1B,UAAU,mBAAmB;IAC3B,OAAO,CAAC,EAAE,MAAM,CAAC;CAClB;AAED,eAAO,MAAM,cAAc,EAAE,KAAK,CAAC,EAAE,CAAC,mBAAmB,CAuBxD,CAAC"}

package/lib/components/EmptyLogsState.js

@@ -0,0 +1,36 @@
+// Copyright 2025 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.
+// You may obtain a copy of the License at
+//
+// http://www.apache.org/licenses/LICENSE-2.0
+//
+// Unless required by applicable law or agreed to in writing, software
+// distributed under the License is distributed on an "AS IS" BASIS,
+// 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 { jsx as _jsx } from "react/jsx-runtime";
+import React from 'react';
+import { Box, Typography, useTheme } from '@mui/material';
+export const EmptyLogsState = ({ message = 'No logs to display' })=>{
+    const theme = useTheme();
+    return /*#__PURE__*/ _jsx(Box, {
+        sx: {
+            display: 'flex',
+            alignItems: 'center',
+            justifyContent: 'center',
+            height: '200px'
+        },
+        children: /*#__PURE__*/ _jsx(Typography, {
+            variant: "body2",
+            sx: {
+                color: theme.palette.text.secondary,
+                fontSize: '14px'
+            },
+            children: message
+        })
+    });
+};
+
+//# sourceMappingURL=EmptyLogsState.js.map

package/lib/components/EmptyLogsState.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/components/EmptyLogsState.tsx"],"sourcesContent":["// Copyright 2025 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 React from 'react';\nimport { Box, Typography, useTheme } from '@mui/material';\n\ninterface EmptyLogsStateProps {\n  message?: string;\n}\n\nexport const EmptyLogsState: React.FC<EmptyLogsStateProps> = ({ message = 'No logs to display' }) => {\n  const theme = useTheme();\n\n  return (\n    <Box\n      sx={{\n        display: 'flex',\n        alignItems: 'center',\n        justifyContent: 'center',\n        height: '200px',\n      }}\n    >\n      <Typography\n        variant=\"body2\"\n        sx={{\n          color: theme.palette.text.secondary,\n          fontSize: '14px',\n        }}\n      >\n        {message}\n      </Typography>\n    </Box>\n  );\n};\n"],"names":["React","Box","Typography","useTheme","EmptyLogsState","message","theme","sx","display","alignItems","justifyContent","height","variant","color","palette","text","secondary","fontSize"],"mappings":"AAAA,oCAAoC;AACpC,kEAAkE;AAClE,mEAAmE;AACnE,0CAA0C;AAC1C,EAAE;AACF,6CAA6C;AAC7C,EAAE;AACF,sEAAsE;AACtE,oEAAoE;AACpE,2EAA2E;AAC3E,sEAAsE;AACtE,iCAAiC;;AAEjC,OAAOA,WAAW,QAAQ;AAC1B,SAASC,GAAG,EAAEC,UAAU,EAAEC,QAAQ,QAAQ,gBAAgB;AAM1D,OAAO,MAAMC,iBAAgD,CAAC,EAAEC,UAAU,oBAAoB,EAAE;IAC9F,MAAMC,QAAQH;IAEd,qBACE,KAACF;QACCM,IAAI;YACFC,SAAS;YACTC,YAAY;YACZC,gBAAgB;YAChBC,QAAQ;QACV;kBAEA,cAAA,KAACT;YACCU,SAAQ;YACRL,IAAI;gBACFM,OAAOP,MAAMQ,OAAO,CAACC,IAAI,CAACC,SAAS;gBACnCC,UAAU;YACZ;sBAECZ;;;AAIT,EAAE"}

package/lib/components/LogRow/LogDetailsTable.d.ts

@@ -0,0 +1,8 @@
+import React from 'react';
+import { Labels } from '@perses-dev/core';
+interface LogDetailsTableProps {
+    log: Labels;
+}
+export declare const LogDetailsTable: React.FC<LogDetailsTableProps>;
+export {};
+//# sourceMappingURL=LogDetailsTable.d.ts.map

package/lib/components/LogRow/LogDetailsTable.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"LogDetailsTable.d.ts","sourceRoot":"","sources":["../../../../src/components/LogRow/LogDetailsTable.tsx"],"names":[],"mappings":"AAaA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAE,MAAM,EAAE,MAAM,kBAAkB,CAAC;AAE1C,UAAU,oBAAoB;IAC5B,GAAG,EAAE,MAAM,CAAC;CACb;AAED,eAAO,MAAM,eAAe,EAAE,KAAK,CAAC,EAAE,CAAC,oBAAoB,CAgD1D,CAAC"}

package/lib/components/LogRow/LogDetailsTable.js

@@ -0,0 +1,58 @@
+// Copyright 2025 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.
+// You may obtain a copy of the License at
+//
+// http://www.apache.org/licenses/LICENSE-2.0
+//
+// Unless required by applicable law or agreed to in writing, software
+// distributed under the License is distributed on an "AS IS" BASIS,
+// 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 { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import React from 'react';
+import { Table, TableBody, TableRow, TableCell, useTheme, alpha } from '@mui/material';
+export const LogDetailsTable = ({ log })=>{
+    const theme = useTheme();
+    return /*#__PURE__*/ _jsx(Table, {
+        size: "small",
+        sx: {
+            border: `1px solid ${theme.palette.divider}`,
+            '& .MuiTableCell-root': {
+                border: 'none',
+                padding: '6px 8px',
+                fontSize: '12px'
+            }
+        },
+        children: /*#__PURE__*/ _jsx(TableBody, {
+            children: Object.entries(log).map(([key, value])=>/*#__PURE__*/ _jsxs(TableRow, {
+                    sx: {
+                        '&:hover': {
+                            backgroundColor: alpha(theme.palette.action.hover, 0.04)
+                        }
+                    },
+                    children: [
+                        /*#__PURE__*/ _jsx(TableCell, {
+                            sx: {
+                                color: theme.palette.text.secondary,
+                                fontWeight: 500,
+                                width: '33%'
+                            },
+                            children: key
+                        }),
+                        /*#__PURE__*/ _jsx(TableCell, {
+                            sx: {
+                                color: theme.palette.text.primary,
+                                wordBreak: 'break-word',
+                                width: '67%'
+                            },
+                            children: value !== undefined && value !== null && value !== '' ? value : '--'
+                        })
+                    ]
+                }, key))
+        })
+    });
+};
+
+//# sourceMappingURL=LogDetailsTable.js.map

package/lib/components/LogRow/LogDetailsTable.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../src/components/LogRow/LogDetailsTable.tsx"],"sourcesContent":["// Copyright 2025 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 React from 'react';\nimport { Table, TableBody, TableRow, TableCell, useTheme, alpha } from '@mui/material';\nimport { Labels } from '@perses-dev/core';\n\ninterface LogDetailsTableProps {\n  log: Labels;\n}\n\nexport const LogDetailsTable: React.FC<LogDetailsTableProps> = ({ log }) => {\n  const theme = useTheme();\n\n  return (\n    <Table\n      size=\"small\"\n      sx={{\n        border: `1px solid ${theme.palette.divider}`,\n        '& .MuiTableCell-root': {\n          border: 'none',\n          padding: '6px 8px',\n          fontSize: '12px',\n        },\n      }}\n    >\n      <TableBody>\n        {Object.entries(log).map(([key, value]) => (\n          <TableRow\n            key={key}\n            sx={{\n              '&:hover': {\n                backgroundColor: alpha(theme.palette.action.hover, 0.04),\n              },\n            }}\n          >\n            <TableCell\n              sx={{\n                color: theme.palette.text.secondary,\n                fontWeight: 500,\n                width: '33%',\n              }}\n            >\n              {key}\n            </TableCell>\n            <TableCell\n              sx={{\n                color: theme.palette.text.primary,\n                wordBreak: 'break-word',\n                width: '67%',\n              }}\n            >\n              {value !== undefined && value !== null && value !== '' ? value : '--'}\n            </TableCell>\n          </TableRow>\n        ))}\n      </TableBody>\n    </Table>\n  );\n};\n"],"names":["React","Table","TableBody","TableRow","TableCell","useTheme","alpha","LogDetailsTable","log","theme","size","sx","border","palette","divider","padding","fontSize","Object","entries","map","key","value","backgroundColor","action","hover","color","text","secondary","fontWeight","width","primary","wordBreak","undefined"],"mappings":"AAAA,oCAAoC;AACpC,kEAAkE;AAClE,mEAAmE;AACnE,0CAA0C;AAC1C,EAAE;AACF,6CAA6C;AAC7C,EAAE;AACF,sEAAsE;AACtE,oEAAoE;AACpE,2EAA2E;AAC3E,sEAAsE;AACtE,iCAAiC;;AAEjC,OAAOA,WAAW,QAAQ;AAC1B,SAASC,KAAK,EAAEC,SAAS,EAAEC,QAAQ,EAAEC,SAAS,EAAEC,QAAQ,EAAEC,KAAK,QAAQ,gBAAgB;AAOvF,OAAO,MAAMC,kBAAkD,CAAC,EAAEC,GAAG,EAAE;IACrE,MAAMC,QAAQJ;IAEd,qBACE,KAACJ;QACCS,MAAK;QACLC,IAAI;YACFC,QAAQ,CAAC,UAAU,EAAEH,MAAMI,OAAO,CAACC,OAAO,EAAE;YAC5C,wBAAwB;gBACtBF,QAAQ;gBACRG,SAAS;gBACTC,UAAU;YACZ;QACF;kBAEA,cAAA,KAACd;sBACEe,OAAOC,OAAO,CAACV,KAAKW,GAAG,CAAC,CAAC,CAACC,KAAKC,MAAM,iBACpC,MAAClB;oBAECQ,IAAI;wBACF,WAAW;4BACTW,iBAAiBhB,MAAMG,MAAMI,OAAO,CAACU,MAAM,CAACC,KAAK,EAAE;wBACrD;oBACF;;sCAEA,KAACpB;4BACCO,IAAI;gCACFc,OAAOhB,MAAMI,OAAO,CAACa,IAAI,CAACC,SAAS;gCACnCC,YAAY;gCACZC,OAAO;4BACT;sCAECT;;sCAEH,KAAChB;4BACCO,IAAI;gCACFc,OAAOhB,MAAMI,OAAO,CAACa,IAAI,CAACI,OAAO;gCACjCC,WAAW;gCACXF,OAAO;4BACT;sCAECR,UAAUW,aAAaX,UAAU,QAAQA,UAAU,KAAKA,QAAQ;;;mBAvB9DD;;;AA8BjB,EAAE"}

package/lib/components/LogRow/LogRow.d.ts

@@ -0,0 +1,14 @@
+import React from 'react';
+import { LogEntry } from '@perses-dev/core';
+interface LogRowProps {
+    log?: LogEntry;
+    index: number;
+    isExpanded: boolean;
+    onToggle: (index: number) => void;
+    isExpandable?: boolean;
+    showTime?: boolean;
+    allowWrap?: boolean;
+}
+export declare const LogRow: React.NamedExoticComponent<LogRowProps>;
+export {};
+//# sourceMappingURL=LogRow.d.ts.map

package/lib/components/LogRow/LogRow.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"LogRow.d.ts","sourceRoot":"","sources":["../../../../src/components/LogRow/LogRow.tsx"],"names":[],"mappings":"AAaA,OAAO,KAA4B,MAAM,OAAO,CAAC;AAGjD,OAAO,EAAE,QAAQ,EAAE,MAAM,kBAAkB,CAAC;AAK5C,UAAU,WAAW;IACnB,GAAG,CAAC,EAAE,QAAQ,CAAC;IACf,KAAK,EAAE,MAAM,CAAC;IACd,UAAU,EAAE,OAAO,CAAC;IACpB,QAAQ,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAClC,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,SAAS,CAAC,EAAE,OAAO,CAAC;CACrB;AAgFD,eAAO,MAAM,MAAM,yCAAsB,CAAC"}

package/lib/components/LogRow/LogRow.js

@@ -0,0 +1,109 @@
+// Copyright 2025 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.
+// You may obtain a copy of the License at
+//
+// http://www.apache.org/licenses/LICENSE-2.0
+//
+// Unless required by applicable law or agreed to in writing, software
+// distributed under the License is distributed on an "AS IS" BASIS,
+// 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 { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import React, { memo, useCallback } from 'react';
+import { Box, Collapse, useTheme } from '@mui/material';
+import ChevronRight from 'mdi-material-ui/ChevronRight';
+import { LogTimestamp } from './LogTimestamp';
+import { LogRowContainer, LogRowContent, ExpandButton, LogText } from './LogsStyles';
+import { LogDetailsTable } from './LogDetailsTable';
+const DefaultLogRow = ({ log, isExpanded, index, onToggle, isExpandable = true, showTime = false, allowWrap = false })=>{
+    const theme = useTheme();
+    const severityColor = theme.palette.text.secondary;
+    const handleToggle = useCallback(()=>{
+        if (isExpandable) {
+            onToggle(index);
+        }
+    }, [
+        isExpandable,
+        onToggle,
+        index
+    ]);
+    if (!log) return null;
+    return /*#__PURE__*/ _jsxs(LogRowContainer, {
+        severityColor: severityColor,
+        children: [
+            /*#__PURE__*/ _jsxs(LogRowContent, {
+                onClick: handleToggle,
+                isExpandable: isExpandable,
+                children: [
+                    isExpandable && /*#__PURE__*/ _jsx(Box, {
+                        sx: {
+                            display: 'flex',
+                            alignItems: 'center',
+                            width: '16px',
+                            justifyContent: 'center'
+                        },
+                        children: /*#__PURE__*/ _jsx(ExpandButton, {
+                            size: "small",
+                            isExpanded: isExpanded,
+                            children: /*#__PURE__*/ _jsx(ChevronRight, {
+                                sx: {
+                                    fontSize: '12px'
+                                }
+                            })
+                        })
+                    }),
+                    /*#__PURE__*/ _jsx(LogTimestamp, {
+                        timestamp: log.timestamp
+                    }),
+                    /*#__PURE__*/ _jsx(Box, {
+                        sx: {
+                            display: 'flex',
+                            gap: '10px',
+                            marginLeft: '36px'
+                        },
+                        children: /*#__PURE__*/ _jsx(LogText, {
+                            variant: "body2",
+                            allowWrap: allowWrap,
+                            children: log.line
+                        })
+                    })
+                ]
+            }),
+            /*#__PURE__*/ _jsx(Collapse, {
+                in: isExpanded,
+                timeout: 200,
+                children: /*#__PURE__*/ _jsx(Box, {
+                    sx: {
+                        padding: '8px'
+                    },
+                    children: /*#__PURE__*/ _jsxs(Box, {
+                        sx: {
+                            display: 'grid',
+                            gridTemplateColumns: !showTime ? '1fr' : '8px minmax(160px, max-content) 1fr',
+                            gap: '12px'
+                        },
+                        children: [
+                            showTime && /*#__PURE__*/ _jsxs(_Fragment, {
+                                children: [
+                                    /*#__PURE__*/ _jsx(Box, {}),
+                                    /*#__PURE__*/ _jsx(Box, {})
+                                ]
+                            }),
+                            /*#__PURE__*/ _jsx(Box, {
+                                children: /*#__PURE__*/ _jsx(LogDetailsTable, {
+                                    log: log.labels
+                                })
+                            })
+                        ]
+                    })
+                })
+            })
+        ]
+    });
+};
+export const LogRow = /*#__PURE__*/ memo(DefaultLogRow);
+LogRow.displayName = 'LogRow';
+
+//# sourceMappingURL=LogRow.js.map

package/lib/components/LogRow/LogRow.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../src/components/LogRow/LogRow.tsx"],"sourcesContent":["// Copyright 2025 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 React, { memo, useCallback } from 'react';\nimport { Box, Collapse, useTheme } from '@mui/material';\nimport ChevronRight from 'mdi-material-ui/ChevronRight';\nimport { LogEntry } from '@perses-dev/core';\nimport { LogTimestamp } from './LogTimestamp';\nimport { LogRowContainer, LogRowContent, ExpandButton, LogText } from './LogsStyles';\nimport { LogDetailsTable } from './LogDetailsTable';\n\ninterface LogRowProps {\n  log?: LogEntry;\n  index: number;\n  isExpanded: boolean;\n  onToggle: (index: number) => void;\n  isExpandable?: boolean;\n  showTime?: boolean;\n  allowWrap?: boolean;\n}\n\nconst DefaultLogRow: React.FC<LogRowProps> = ({\n  log,\n  isExpanded,\n  index,\n  onToggle,\n  isExpandable = true,\n  showTime = false,\n  allowWrap = false,\n}) => {\n  const theme = useTheme();\n  const severityColor = theme.palette.text.secondary;\n\n  const handleToggle = useCallback(() => {\n    if (isExpandable) {\n      onToggle(index);\n    }\n  }, [isExpandable, onToggle, index]);\n\n  if (!log) return null;\n\n  return (\n    <LogRowContainer severityColor={severityColor}>\n      <LogRowContent onClick={handleToggle} isExpandable={isExpandable}>\n        {isExpandable && (\n          <Box\n            sx={{\n              display: 'flex',\n              alignItems: 'center',\n              width: '16px',\n              justifyContent: 'center',\n            }}\n          >\n            <ExpandButton size=\"small\" isExpanded={isExpanded}>\n              <ChevronRight sx={{ fontSize: '12px' }} />\n            </ExpandButton>\n          </Box>\n        )}\n\n        <LogTimestamp timestamp={log.timestamp} />\n\n        <Box\n          sx={{\n            display: 'flex',\n            gap: '10px',\n            marginLeft: '36px',\n          }}\n        >\n          <LogText variant=\"body2\" allowWrap={allowWrap}>\n            {log.line}\n          </LogText>\n        </Box>\n      </LogRowContent>\n\n      <Collapse in={isExpanded} timeout={200}>\n        <Box sx={{ padding: '8px' }}>\n          <Box\n            sx={{\n              display: 'grid',\n              gridTemplateColumns: !showTime ? '1fr' : '8px minmax(160px, max-content) 1fr',\n              gap: '12px',\n            }}\n          >\n            {showTime && (\n              <>\n                <Box />\n                <Box />\n              </>\n            )}\n            <Box>\n              <LogDetailsTable log={log.labels} />\n            </Box>\n          </Box>\n        </Box>\n      </Collapse>\n    </LogRowContainer>\n  );\n};\n\nexport const LogRow = memo(DefaultLogRow);\nLogRow.displayName = 'LogRow';\n"],"names":["React","memo","useCallback","Box","Collapse","useTheme","ChevronRight","LogTimestamp","LogRowContainer","LogRowContent","ExpandButton","LogText","LogDetailsTable","DefaultLogRow","log","isExpanded","index","onToggle","isExpandable","showTime","allowWrap","theme","severityColor","palette","text","secondary","handleToggle","onClick","sx","display","alignItems","width","justifyContent","size","fontSize","timestamp","gap","marginLeft","variant","line","in","timeout","padding","gridTemplateColumns","labels","LogRow","displayName"],"mappings":"AAAA,oCAAoC;AACpC,kEAAkE;AAClE,mEAAmE;AACnE,0CAA0C;AAC1C,EAAE;AACF,6CAA6C;AAC7C,EAAE;AACF,sEAAsE;AACtE,oEAAoE;AACpE,2EAA2E;AAC3E,sEAAsE;AACtE,iCAAiC;;AAEjC,OAAOA,SAASC,IAAI,EAAEC,WAAW,QAAQ,QAAQ;AACjD,SAASC,GAAG,EAAEC,QAAQ,EAAEC,QAAQ,QAAQ,gBAAgB;AACxD,OAAOC,kBAAkB,+BAA+B;AAExD,SAASC,YAAY,QAAQ,iBAAiB;AAC9C,SAASC,eAAe,EAAEC,aAAa,EAAEC,YAAY,EAAEC,OAAO,QAAQ,eAAe;AACrF,SAASC,eAAe,QAAQ,oBAAoB;AAYpD,MAAMC,gBAAuC,CAAC,EAC5CC,GAAG,EACHC,UAAU,EACVC,KAAK,EACLC,QAAQ,EACRC,eAAe,IAAI,EACnBC,WAAW,KAAK,EAChBC,YAAY,KAAK,EAClB;IACC,MAAMC,QAAQhB;IACd,MAAMiB,gBAAgBD,MAAME,OAAO,CAACC,IAAI,CAACC,SAAS;IAElD,MAAMC,eAAexB,YAAY;QAC/B,IAAIgB,cAAc;YAChBD,SAASD;QACX;IACF,GAAG;QAACE;QAAcD;QAAUD;KAAM;IAElC,IAAI,CAACF,KAAK,OAAO;IAEjB,qBACE,MAACN;QAAgBc,eAAeA;;0BAC9B,MAACb;gBAAckB,SAASD;gBAAcR,cAAcA;;oBACjDA,8BACC,KAACf;wBACCyB,IAAI;4BACFC,SAAS;4BACTC,YAAY;4BACZC,OAAO;4BACPC,gBAAgB;wBAClB;kCAEA,cAAA,KAACtB;4BAAauB,MAAK;4BAAQlB,YAAYA;sCACrC,cAAA,KAACT;gCAAasB,IAAI;oCAAEM,UAAU;gCAAO;;;;kCAK3C,KAAC3B;wBAAa4B,WAAWrB,IAAIqB,SAAS;;kCAEtC,KAAChC;wBACCyB,IAAI;4BACFC,SAAS;4BACTO,KAAK;4BACLC,YAAY;wBACd;kCAEA,cAAA,KAAC1B;4BAAQ2B,SAAQ;4BAAQlB,WAAWA;sCACjCN,IAAIyB,IAAI;;;;;0BAKf,KAACnC;gBAASoC,IAAIzB;gBAAY0B,SAAS;0BACjC,cAAA,KAACtC;oBAAIyB,IAAI;wBAAEc,SAAS;oBAAM;8BACxB,cAAA,MAACvC;wBACCyB,IAAI;4BACFC,SAAS;4BACTc,qBAAqB,CAACxB,WAAW,QAAQ;4BACzCiB,KAAK;wBACP;;4BAECjB,0BACC;;kDACE,KAAChB;kDACD,KAACA;;;0CAGL,KAACA;0CACC,cAAA,KAACS;oCAAgBE,KAAKA,IAAI8B,MAAM;;;;;;;;;AAO9C;AAEA,OAAO,MAAMC,uBAAS5C,KAAKY,eAAe;AAC1CgC,OAAOC,WAAW,GAAG"}

package/lib/components/LogRow/LogTimestamp.d.ts

@@ -0,0 +1,7 @@
+import React from 'react';
+interface LogTimestampProps {
+    timestamp: number | string;
+}
+export declare const LogTimestamp: React.FC<LogTimestampProps>;
+export {};
+//# sourceMappingURL=LogTimestamp.d.ts.map

package/lib/components/LogRow/LogTimestamp.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"LogTimestamp.d.ts","sourceRoot":"","sources":["../../../../src/components/LogRow/LogTimestamp.tsx"],"names":[],"mappings":"AAaA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,UAAU,iBAAiB;IACzB,SAAS,EAAE,MAAM,GAAG,MAAM,CAAC;CAC5B;AAMD,eAAO,MAAM,YAAY,EAAE,KAAK,CAAC,EAAE,CAAC,iBAAiB,CAcpD,CAAC"}