@perses-dev/heatmap-chart-plugin 0.4.0-rc.0 → 0.4.0

package/lib/cjs/components/HeatMapChart.js

@@ -1,4 +1,4 @@
-// Copyright 2025 The Perses Authors
+// 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.
 // You may obtain a copy of the License at
@@ -22,14 +22,15 @@ Object.defineProperty(exports, "HeatMapChart", {
 });
 const _jsxruntime = require("react/jsx-runtime");
 const _react = require("react");
+const _core = require("@perses-dev/core");
 const _components = require("@perses-dev/components");
-const _core = require("echarts/core");
+const _core1 = require("echarts/core");
 const _charts = require("echarts/charts");
 const _material = require("@mui/material");
 const _utils = require("../utils");
 const _HeatMapTooltip = require("./HeatMapTooltip");
-(0, _core.use)([
-    _charts.HeatmapChart
+(0, _core1.use)([
+    _charts.CustomChart
 ]);
 // The default coloring is a blue->yellow->red gradient
 const DEFAULT_VISUAL_MAP_COLORS = [
@@ -45,7 +46,7 @@ const DEFAULT_VISUAL_MAP_COLORS = [
     '#d73027',
     '#a50026'
 ];
-function HeatMapChart({ width, height, data, xAxisCategories, yAxisCategories, yAxisFormat, countFormat, countMin, countMax, timeScale, showVisualMap }) {
+function HeatMapChart({ width, height, data, xAxisCategories, yAxisFormat, countFormat, countMin, countMax, timeScale, showVisualMap, min, max, logBase }) {
     const chartsTheme = (0, _components.useChartsTheme)();
     const theme = (0, _material.useTheme)();
     const { timeZone } = (0, _components.useTimeZone)();
@@ -59,7 +60,6 @@ function HeatMapChart({ width, height, data, xAxisCategories, yAxisCategories, y
                         label: params.data.label,
                         marker: params.marker,
                         xAxisCategories,
-                        yAxisCategories,
                         theme,
                         yAxisFormat: yAxisFormat,
                         countFormat: countFormat
@@ -74,10 +74,27 @@ function HeatMapChart({ width, height, data, xAxisCategories, yAxisCategories, y
                     formatter: (0, _utils.getFormattedHeatmapAxisLabel)(timeScale?.rangeMs ?? 0, timeZone)
                 }
             },
-            yAxis: (0, _components.getFormattedAxis)({
-                type: 'category',
-                data: yAxisCategories
-            }, yAxisFormat),
+            yAxis: {
+                type: logBase !== undefined ? 'log' : 'value',
+                logBase: logBase,
+                boundaryGap: [
+                    0,
+                    '10%'
+                ],
+                min: min,
+                max: max,
+                axisLabel: {
+                    hideOverlap: true,
+                    formatter: (value)=>{
+                        // On log scales, ECharts may generate a tick at 0 which is mathematically
+                        // invalid (log(0) is undefined). Return empty string to hide such labels.
+                        if (logBase !== undefined && value === 0) {
+                            return '';
+                        }
+                        return (0, _core.formatValue)(value, yAxisFormat);
+                    }
+                }
+            },
             visualMap: {
                 show: showVisualMap ?? false,
                 type: 'continuous',
@@ -96,19 +113,77 @@ function HeatMapChart({ width, height, data, xAxisCategories, yAxisCategories, y
                     color: theme.palette.text.primary,
                     textBorderColor: theme.palette.background.default,
                     textBorderWidth: 5
-                }
+                },
+                // Color by the count dimension (index 3)
+                dimension: 3
             },
             series: [
                 {
-                    name: 'Gaussian',
-                    type: 'heatmap',
-                    data: data,
-                    emphasis: {
-                        itemStyle: {
-                            borderColor: '#333',
-                            borderWidth: 1
+                    name: 'HeatMap',
+                    type: 'custom',
+                    renderItem: function(params, api) {
+                        const xIndex = api.value(0);
+                        const yLower = api.value(1);
+                        const yUpper = api.value(2);
+                        // Pixel coordinates
+                        const upperStart = api.coord([
+                            xIndex,
+                            yUpper
+                        ]);
+                        const lowerStart = api.coord([
+                            xIndex,
+                            yLower
+                        ]);
+                        const upperNext = api.coord([
+                            xIndex + 1,
+                            yUpper
+                        ]);
+                        const startX = upperStart?.[0];
+                        const upperY = upperStart?.[1];
+                        const lowerY = lowerStart?.[1];
+                        const nextX = upperNext?.[0];
+                        if (startX === undefined || upperY === undefined || lowerY === undefined || nextX === undefined) {
+                            return null;
                         }
+                        const topY = Math.min(upperY, lowerY);
+                        const bottomY = Math.max(upperY, lowerY);
+                        const width = nextX - startX;
+                        const height = bottomY - topY;
+                        return {
+                            type: 'rect',
+                            shape: {
+                                x: startX,
+                                y: topY,
+                                width,
+                                height
+                            },
+                            style: {
+                                fill: api.visual('color')
+                            }
+                        };
                     },
+                    label: {
+                        show: false
+                    },
+                    dimensions: [
+                        'xIndex',
+                        'yLower',
+                        'yUpper',
+                        'count'
+                    ],
+                    encode: {
+                        x: 0,
+                        y: [
+                            1,
+                            2
+                        ],
+                        tooltip: [
+                            1,
+                            2,
+                            3
+                        ]
+                    },
+                    data: data,
                     progressive: 1000,
                     animation: false
                 }
@@ -118,7 +193,6 @@ function HeatMapChart({ width, height, data, xAxisCategories, yAxisCategories, y
         xAxisCategories,
         timeScale?.rangeMs,
         timeZone,
-        yAxisCategories,
         yAxisFormat,
         showVisualMap,
         countMin,
@@ -126,7 +200,10 @@ function HeatMapChart({ width, height, data, xAxisCategories, yAxisCategories, y
         height,
         theme,
         data,
-        countFormat
+        countFormat,
+        min,
+        max,
+        logBase
     ]);
     const chart = (0, _react.useMemo)(()=>/*#__PURE__*/ (0, _jsxruntime.jsx)(_components.EChart, {
             style: {

package/lib/cjs/components/HeatMapChartOptionsEditorSettings.js

@@ -1,4 +1,4 @@
-// Copyright 2025 The Perses Authors
+// 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.
 // You may obtain a copy of the License at
@@ -51,6 +51,9 @@ function HeatMapChartOptionsEditorSettings(props) {
     // ensures decimalPlaces defaults to correct value
     const yAxisFormat = (0, _merge.default)({}, _heatmapchartmodel.DEFAULT_FORMAT, value.yAxisFormat);
     const countFormat = (0, _merge.default)({}, _heatmapchartmodel.DEFAULT_FORMAT, value.countFormat);
+    // Get the current log base configuration, defaulting to 'none' if not set
+    const logBaseKey = value.logBase ? String(value.logBase) : 'none';
+    const logBase = _heatmapchartmodel.LOG_BASE_CONFIG[logBaseKey] ?? _heatmapchartmodel.LOG_BASE_CONFIG['none'];
     return /*#__PURE__*/ (0, _jsxruntime.jsxs)(_components.OptionsEditorGrid, {
         children: [
             /*#__PURE__*/ (0, _jsxruntime.jsx)(_components.OptionsEditorColumn, {
@@ -72,12 +75,64 @@ function HeatMapChartOptionsEditorSettings(props) {
                 })
             }),
             /*#__PURE__*/ (0, _jsxruntime.jsx)(_components.OptionsEditorColumn, {
-                children: /*#__PURE__*/ (0, _jsxruntime.jsx)(_components.OptionsEditorGroup, {
+                children: /*#__PURE__*/ (0, _jsxruntime.jsxs)(_components.OptionsEditorGroup, {
                     title: "Y Axis",
-                    children: /*#__PURE__*/ (0, _jsxruntime.jsx)(_components.FormatControls, {
-                        value: yAxisFormat,
-                        onChange: handleYAxisFormatChange
-                    })
+                    children: [
+                        /*#__PURE__*/ (0, _jsxruntime.jsx)(_components.FormatControls, {
+                            value: yAxisFormat,
+                            onChange: handleYAxisFormatChange
+                        }),
+                        /*#__PURE__*/ (0, _jsxruntime.jsx)(_components.OptionsEditorControl, {
+                            label: "Min",
+                            control: /*#__PURE__*/ (0, _jsxruntime.jsx)(_material.TextField, {
+                                type: "number",
+                                value: value.min ?? '',
+                                onChange: (e)=>{
+                                    const newValue = e.target.value ? Number(e.target.value) : undefined;
+                                    onChange((0, _immer.produce)(value, (draft)=>{
+                                        draft.min = newValue;
+                                    }));
+                                },
+                                placeholder: "Auto",
+                                sx: {
+                                    width: '100%'
+                                }
+                            })
+                        }),
+                        /*#__PURE__*/ (0, _jsxruntime.jsx)(_components.OptionsEditorControl, {
+                            label: "Max",
+                            control: /*#__PURE__*/ (0, _jsxruntime.jsx)(_material.TextField, {
+                                type: "number",
+                                value: value.max ?? '',
+                                onChange: (e)=>{
+                                    const newValue = e.target.value ? Number(e.target.value) : undefined;
+                                    onChange((0, _immer.produce)(value, (draft)=>{
+                                        draft.max = newValue;
+                                    }));
+                                },
+                                placeholder: "Auto",
+                                sx: {
+                                    width: '100%'
+                                }
+                            })
+                        }),
+                        /*#__PURE__*/ (0, _jsxruntime.jsx)(_components.OptionsEditorControl, {
+                            label: "Log Base",
+                            control: /*#__PURE__*/ (0, _jsxruntime.jsx)(_components.SettingsAutocomplete, {
+                                value: {
+                                    ...logBase,
+                                    id: logBase?.label ?? 'None'
+                                },
+                                options: _heatmapchartmodel.LOG_BASE_OPTIONS,
+                                onChange: (__, newValue)=>{
+                                    onChange((0, _immer.produce)(value, (draft)=>{
+                                        draft.logBase = newValue.log;
+                                    }));
+                                },
+                                disableClearable: true
+                            })
+                        })
+                    ]
                 })
             })
         ]

package/lib/cjs/components/HeatMapChartPanel.js

@@ -1,4 +1,4 @@
-// Copyright 2025 The Perses Authors
+// 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.
 // You may obtain a copy of the License at
@@ -32,19 +32,29 @@ function _interop_require_default(obj) {
         default: obj
     };
 }
-const HEATMAP_MIN_HEIGHT = 200;
-const HEATMAP_ITEM_MIN_HEIGHT = 2;
+/**
+ * Helper function to get the effective lower bound for log scale.
+ * For values <= 0, we use a small fraction of the upper bound.
+ */ const getEffectiveLowerBound = (lowerBound, upperBound, logBase)=>{
+    if (logBase === undefined || lowerBound > 0) {
+        return lowerBound;
+    }
+    // For log scales with non-positive lower bounds, use a small fraction of upper bound
+    // This ensures the bucket is still visible on the log scale
+    return upperBound * 0.001;
+};
 function HeatMapChartPanel(props) {
     const { spec: pluginSpec, contentDimensions, queryResults } = props;
     // ensures all default format properties set if undef
     const yAxisFormat = (0, _merge.default)({}, _heatmapchartmodel.DEFAULT_FORMAT, pluginSpec.yAxisFormat);
     const countFormat = (0, _merge.default)({}, _heatmapchartmodel.DEFAULT_FORMAT, pluginSpec.countFormat);
-    const { data, xAxisCategories, yAxisCategories, countMin, countMax, timeScale } = (0, _react.useMemo)(()=>{
+    const { data, xAxisCategories, min, max, countMin, countMax, timeScale } = (0, _react.useMemo)(()=>{
         if (!queryResults || queryResults.length === 0) {
             return {
                 data: [],
                 xAxisCategories: [],
-                yAxisCategories: [],
+                min: 0,
+                max: 0,
                 countMin: 0,
                 countMax: 0,
                 timeScale: undefined
@@ -54,7 +64,8 @@ function HeatMapChartPanel(props) {
             return {
                 data: [],
                 xAxisCategories: [],
-                yAxisCategories: [],
+                min: 0,
+                max: 0,
                 countMin: 0,
                 countMax: 0,
                 timeScale: undefined
@@ -63,19 +74,26 @@ function HeatMapChartPanel(props) {
         const series = queryResults[0].data.series[0];
         const timeScale = (0, _utils.getCommonTimeScaleForQueries)(queryResults);
         const xAxisCategories = (0, _utils.generateCompleteTimestamps)(timeScale);
+        const logBase = pluginSpec.logBase;
         // Dummy value that will be replaced at the first iteration
         let lowestBound = Infinity;
         let highestBound = -Infinity;
         let countMin = Infinity;
         let countMax = -Infinity;
-        // eslint-disable-next-line @typescript-eslint/no-unused-vars
-        for (const [_, histogram] of series?.histograms ?? []){
+        for (const [, histogram] of series?.histograms ?? []){
             for (const bucket of histogram?.buckets ?? []){
-                // eslint-disable-next-line @typescript-eslint/no-unused-vars
-                const [_, lowerBound, upperBound, count] = bucket;
-                const lowerBoundFloat = parseFloat(lowerBound);
+                const [, lowerBound, upperBound, count] = bucket;
+                let lowerBoundFloat = parseFloat(lowerBound);
                 const upperBoundFloat = parseFloat(upperBound);
                 const countFloat = parseFloat(count);
+                // For logarithmic scales, skip buckets that would be entirely non-positive
+                if (logBase !== undefined && upperBoundFloat <= 0) {
+                    continue;
+                }
+                // For log scales, adjust non-positive lower bounds
+                if (logBase !== undefined) {
+                    lowerBoundFloat = getEffectiveLowerBound(lowerBoundFloat, upperBoundFloat, logBase);
+                }
                 if (lowerBoundFloat < lowestBound) {
                     lowestBound = lowerBoundFloat;
                 }
@@ -90,48 +108,77 @@ function HeatMapChartPanel(props) {
                 }
             }
         }
-        const height = contentDimensions?.height ?? HEATMAP_MIN_HEIGHT;
-        const totalRange = highestBound - lowestBound;
-        const rangePerItem = totalRange * HEATMAP_ITEM_MIN_HEIGHT / height;
-        const totalItems = Math.ceil(height / HEATMAP_ITEM_MIN_HEIGHT);
-        // Generating value of the Y axis based on the height divided by the size of a cell (item)
-        const yAxisCategories = Array.from({
-            length: totalItems
-        }, (_, index)=>(lowestBound + index * rangePerItem).toFixed(3));
         const data = [];
-        // Logic for filling all cells where a bucket is present
+        // Each bucket becomes a rectangle spanning [lowerBound, upperBound] at the given x index
         for (const [time, histogram] of series?.histograms ?? []){
             const itemIndexOnXaxis = xAxisCategories.findIndex((v)=>v === time * 1000);
             for (const bucket of histogram?.buckets ?? []){
-                // eslint-disable-next-line @typescript-eslint/no-unused-vars
-                const [_, lowerBound, upperBound, count] = bucket;
-                const yLowerBoundItem = Math.floor((parseFloat(lowerBound) - lowestBound) / rangePerItem);
-                const yUpperBoundItem = Math.ceil((parseFloat(upperBound) - lowestBound) / rangePerItem);
-                for(let i = 0; i < yUpperBoundItem - yLowerBoundItem; i++){
-                    // TODO: some bucket may have overlapping cells, we could use avg value. Probably will need to move to a matrix data structure for performance reasons
-                    data.push({
-                        value: [
-                            itemIndexOnXaxis,
-                            yLowerBoundItem + i,
-                            parseFloat(count)
-                        ],
-                        label: count
-                    });
+                const [, lowerBound, upperBound, count] = bucket;
+                let lowerBoundFloat = parseFloat(lowerBound);
+                const upperBoundFloat = parseFloat(upperBound);
+                // For logarithmic scales, skip buckets that would be entirely non-positive
+                if (logBase !== undefined && upperBoundFloat <= 0) {
+                    continue;
                 }
+                // For log scales, adjust non-positive lower bounds
+                if (logBase !== undefined) {
+                    lowerBoundFloat = getEffectiveLowerBound(lowerBoundFloat, upperBoundFloat, logBase);
+                }
+                data.push({
+                    value: [
+                        itemIndexOnXaxis,
+                        lowerBoundFloat,
+                        upperBoundFloat,
+                        parseFloat(count)
+                    ],
+                    label: count
+                });
             }
         }
         return {
             data,
             xAxisCategories,
-            yAxisCategories,
+            min: lowestBound === Infinity ? undefined : lowestBound,
+            max: highestBound === -Infinity ? undefined : highestBound,
             countMin,
             countMax,
             timeScale
         };
     }, [
-        contentDimensions?.height,
+        pluginSpec.logBase,
         queryResults
     ]);
+    // Use configured min/max if provided, otherwise use calculated values
+    // For logarithmic scales, ignore user-provided min if it's <= 0 (log of non-positive is undefined)
+    // and let ECharts auto-calculate the range to avoid rendering issues
+    const finalMin = (0, _react.useMemo)(()=>{
+        if (pluginSpec.logBase !== undefined) {
+            // For log scale, ignore min if it's <= 0 or let ECharts auto-calculate
+            if (pluginSpec.min !== undefined && pluginSpec.min <= 0) {
+                return undefined; // Let ECharts auto-calculate
+            }
+            return pluginSpec.min ?? min;
+        }
+        return pluginSpec.min ?? min;
+    }, [
+        pluginSpec.logBase,
+        pluginSpec.min,
+        min
+    ]);
+    const finalMax = (0, _react.useMemo)(()=>{
+        if (pluginSpec.logBase !== undefined) {
+            // For log scale, ignore max if it's <= 0
+            if (pluginSpec.max !== undefined && pluginSpec.max <= 0) {
+                return undefined; // Let ECharts auto-calculate
+            }
+            return pluginSpec.max ?? max;
+        }
+        return pluginSpec.max ?? max;
+    }, [
+        pluginSpec.logBase,
+        pluginSpec.max,
+        max
+    ]);
     // TODO: add support for multiple queries
     if (queryResults.length > 1) {
         return /*#__PURE__*/ (0, _jsxruntime.jsx)(_material.Stack, {
@@ -166,13 +213,15 @@ function HeatMapChartPanel(props) {
             height: contentDimensions.height,
             data: data,
             xAxisCategories: xAxisCategories,
-            yAxisCategories: yAxisCategories,
             yAxisFormat: yAxisFormat,
             countFormat: countFormat,
             countMin: countMin,
             countMax: countMax,
             timeScale: timeScale,
-            showVisualMap: pluginSpec.showVisualMap
+            showVisualMap: pluginSpec.showVisualMap,
+            min: finalMin,
+            max: finalMax,
+            logBase: pluginSpec.logBase
         })
     });
 }

package/lib/cjs/components/HeatMapTooltip.js

@@ -1,4 +1,4 @@
-// Copyright 2024 The Perses Authors
+// 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.
 // You may obtain a copy of the License at
@@ -23,9 +23,9 @@ Object.defineProperty(exports, "generateTooltipHTML", {
 const _material = require("@mui/material");
 const _components = require("@perses-dev/components");
 const _core = require("@perses-dev/core");
-function generateTooltipHTML({ data, label, marker, xAxisCategories, yAxisCategories, theme, yAxisFormat, countFormat }) {
-    const [x, y] = data;
-    const xAxisLabel = xAxisCategories[x];
+function generateTooltipHTML({ data, label, marker, xAxisCategories, theme, yAxisFormat, countFormat }) {
+    const [xIndex, yLower, yUpper] = data;
+    const xAxisLabel = xAxisCategories[xIndex];
     const { formattedDate, formattedTime } = (0, _components.getDateAndTime)(xAxisLabel);
     const tooltipHeader = (0, _material.css)`
     border-bottom: 1px solid ${theme.palette.grey[500]};
@@ -39,8 +39,8 @@ function generateTooltipHTML({ data, label, marker, xAxisCategories, yAxisCatego
     const labelStyles = (0, _material.css)`
     margin-right: 16px;
   `;
-    const lowerBound = parseFloat(yAxisCategories[y]);
-    const upperBound = yAxisCategories[y + 1] ? parseFloat(yAxisCategories[y + 1]) : parseFloat(yAxisCategories[y]) + parseFloat(yAxisCategories[y]) - parseFloat(yAxisCategories[y - 1]); // Top cell, upper bound need to be calculated from previous cell
+    const lowerBound = yLower;
+    const upperBound = yUpper;
     return `
     <div>
       <div style="${tooltipHeader.styles}">${formattedDate} ${formattedTime}</div>

package/lib/cjs/components/index.js

@@ -1,4 +1,4 @@
-// Copyright 2025 The Perses Authors
+// 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.
 // You may obtain a copy of the License at

package/lib/cjs/env.d.js

@@ -1,4 +1,4 @@
-// Copyright 2025 The Perses Authors
+// 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.
 // You may obtain a copy of the License at

package/lib/cjs/getPluginModule.js

@@ -1,3 +1,15 @@
+// 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.
+// 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/heat-map-chart-model.js

@@ -1,4 +1,4 @@
-// Copyright 2025 The Perses Authors
+// 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.
 // You may obtain a copy of the License at
@@ -36,6 +36,12 @@ _export(exports, {
     get DEFAULT_MIN_PERCENT_DECIMAL () {
         return DEFAULT_MIN_PERCENT_DECIMAL;
     },
+    get LOG_BASE_CONFIG () {
+        return LOG_BASE_CONFIG;
+    },
+    get LOG_BASE_OPTIONS () {
+        return LOG_BASE_OPTIONS;
+    },
     get createInitialHeatMapChartOptions () {
         return createInitialHeatMapChartOptions;
     }
@@ -47,6 +53,24 @@ const DEFAULT_MIN_PERCENT = 0;
 const DEFAULT_MAX_PERCENT = 100;
 const DEFAULT_MIN_PERCENT_DECIMAL = 0;
 const DEFAULT_MAX_PERCENT_DECIMAL = 1;
+const LOG_BASE_CONFIG = {
+    none: {
+        label: 'None',
+        log: undefined
+    },
+    '2': {
+        label: '2',
+        log: 2
+    },
+    '10': {
+        label: '10',
+        log: 10
+    }
+};
+const LOG_BASE_OPTIONS = Object.entries(LOG_BASE_CONFIG).map(([id, config])=>({
+        id: id,
+        ...config
+    }));
 function createInitialHeatMapChartOptions() {
     return {
         yAxisFormat: DEFAULT_FORMAT,

package/lib/cjs/index-federation.js

@@ -40,7 +40,7 @@ function _interop_require_wildcard(obj, nodeInterop) {
     }
     return newObj;
 }
-// Copyright 2025 The Perses Authors
+// 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.
 // You may obtain a copy of the License at

package/lib/cjs/index.js

@@ -1,4 +1,4 @@
-// Copyright 2025 The Perses Authors
+// 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.
 // You may obtain a copy of the License at

package/lib/cjs/setup-tests.js

@@ -1,4 +1,4 @@
-// Copyright 2025 The Perses Authors
+// 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.
 // You may obtain a copy of the License at

package/lib/cjs/utils/data-transform.js

@@ -1,3 +1,15 @@
+// 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.
+// 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/utils/get-formatted-axis-label.js

@@ -1,4 +1,4 @@
-// Copyright 2024 The Perses Authors
+// 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.
 // You may obtain a copy of the License at

package/lib/cjs/utils/index.js

@@ -1,4 +1,4 @@
-// Copyright 2025 The Perses Authors
+// 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.
 // You may obtain a copy of the License at

package/lib/cjs/utils/thresholds.js

@@ -1,3 +1,15 @@
+// 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.
+// 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