refactor(histogram): move Histogram code to in-repo plugin package
This commit is contained in:
@@ -0,0 +1,11 @@
|
||||
# Changelog
|
||||
|
||||
All notable changes to this project will be documented in this file.
|
||||
|
||||
## [12.2.0-pre] - 2024-12-XX
|
||||
|
||||
### Added
|
||||
|
||||
- Initial release of @grafana/histogram package
|
||||
- Extracted histogram panel logic from main Grafana codebase
|
||||
- Supports all existing histogram functionality
|
||||
@@ -0,0 +1,202 @@
|
||||
|
||||
Apache License
|
||||
Version 2.0, January 2004
|
||||
http://www.apache.org/licenses/
|
||||
|
||||
TERMS AND CONDITIONS FOR USE, REPRODUCTION, AND DISTRIBUTION
|
||||
|
||||
1. Definitions.
|
||||
|
||||
"License" shall mean the terms and conditions for use, reproduction,
|
||||
and distribution as defined by Sections 1 through 9 of this document.
|
||||
|
||||
"Licensor" shall mean the copyright owner or entity authorized by
|
||||
the copyright owner that is granting the License.
|
||||
|
||||
"Legal Entity" shall mean the union of the acting entity and all
|
||||
other entities that control, are controlled by, or are under common
|
||||
control with that entity. For the purposes of this definition,
|
||||
"control" means (i) the power, direct or indirect, to cause the
|
||||
direction or management of such entity, whether by contract or
|
||||
otherwise, or (ii) ownership of fifty percent (50%) or more of the
|
||||
outstanding shares, or (iii) beneficial ownership of such entity.
|
||||
|
||||
"You" (or "Your") shall mean an individual or Legal Entity
|
||||
exercising permissions granted by this License.
|
||||
|
||||
"Source" form shall mean the preferred form for making modifications,
|
||||
including but not limited to software source code, documentation
|
||||
source, and configuration files.
|
||||
|
||||
"Object" form shall mean any form resulting from mechanical
|
||||
transformation or translation of a Source form, including but
|
||||
not limited to compiled object code, generated documentation,
|
||||
and conversions to other media types.
|
||||
|
||||
"Work" shall mean the work of authorship, whether in Source or
|
||||
Object form, made available under the License, as indicated by a
|
||||
copyright notice that is included in or attached to the work
|
||||
(an example is provided in the Appendix below).
|
||||
|
||||
"Derivative Works" shall mean any work, whether in Source or Object
|
||||
form, that is based on (or derived from) the Work and for which the
|
||||
editorial revisions, annotations, elaborations, or other modifications
|
||||
represent, as a whole, an original work of authorship. For the purposes
|
||||
of this License, Derivative Works shall not include works that remain
|
||||
separable from, or merely link (or bind by name) to the interfaces of,
|
||||
the Work and Derivative Works thereof.
|
||||
|
||||
"Contribution" shall mean any work of authorship, including
|
||||
the original version of the Work and any modifications or additions
|
||||
to that Work or Derivative Works thereof, that is intentionally
|
||||
submitted to Licensor for inclusion in the Work by the copyright owner
|
||||
or by an individual or Legal Entity authorized to submit on behalf of
|
||||
the copyright owner. For the purposes of this definition, "submitted"
|
||||
means any form of electronic, verbal, or written communication sent
|
||||
to the Licensor or its representatives, including but not limited to
|
||||
communication on electronic mailing lists, source code control systems,
|
||||
and issue tracking systems that are managed by, or on behalf of, the
|
||||
Licensor for the purpose of discussing and improving the Work, but
|
||||
excluding communication that is conspicuously marked or otherwise
|
||||
designated in writing by the copyright owner as "Not a Contribution."
|
||||
|
||||
"Contributor" shall mean Licensor and any individual or Legal Entity
|
||||
on behalf of whom a Contribution has been received by Licensor and
|
||||
subsequently incorporated within the Work.
|
||||
|
||||
2. Grant of Copyright License. Subject to the terms and conditions of
|
||||
this License, each Contributor hereby grants to You a perpetual,
|
||||
worldwide, non-exclusive, no-charge, royalty-free, irrevocable
|
||||
copyright license to reproduce, prepare Derivative Works of,
|
||||
publicly display, publicly perform, sublicense, and distribute the
|
||||
Work and such Derivative Works in Source or Object form.
|
||||
|
||||
3. Grant of Patent License. Subject to the terms and conditions of
|
||||
this License, each Contributor hereby grants to You a perpetual,
|
||||
worldwide, non-exclusive, no-charge, royalty-free, irrevocable
|
||||
(except as stated in this section) patent license to make, have made,
|
||||
use, offer to sell, sell, import, and otherwise transfer the Work,
|
||||
where such license applies only to those patent claims licensable
|
||||
by such Contributor that are necessarily infringed by their
|
||||
Contribution(s) alone or by combination of their Contribution(s)
|
||||
with the Work to which such Contribution(s) was submitted. If You
|
||||
institute patent litigation against any entity (including a
|
||||
cross-claim or counterclaim in a lawsuit) alleging that the Work
|
||||
or a Contribution incorporated within the Work constitutes direct
|
||||
or contributory patent infringement, then any patent licenses
|
||||
granted to You under this License for that Work shall terminate
|
||||
as of the date such litigation is filed.
|
||||
|
||||
4. Redistribution. You may reproduce and distribute copies of the
|
||||
Work or Derivative Works thereof in any medium, with or without
|
||||
modifications, and in Source or Object form, provided that You
|
||||
meet the following conditions:
|
||||
|
||||
(a) You must give any other recipients of the Work or
|
||||
Derivative Works a copy of this License; and
|
||||
|
||||
(b) You must cause any modified files to carry prominent notices
|
||||
stating that You changed the files; and
|
||||
|
||||
(c) You must retain, in the Source form of any Derivative Works
|
||||
that You distribute, all copyright, patent, trademark, and
|
||||
attribution notices from the Source form of the Work,
|
||||
excluding those notices that do not pertain to any part of
|
||||
the Derivative Works; and
|
||||
|
||||
(d) If the Work includes a "NOTICE" text file as part of its
|
||||
distribution, then any Derivative Works that You distribute must
|
||||
include a readable copy of the attribution notices contained
|
||||
within such NOTICE file, excluding those notices that do not
|
||||
pertain to any part of the Derivative Works, in at least one
|
||||
of the following places: within a NOTICE text file distributed
|
||||
as part of the Derivative Works; within the Source form or
|
||||
documentation, if provided along with the Derivative Works; or,
|
||||
within a display generated by the Derivative Works, if and
|
||||
wherever such third-party notices normally appear. The contents
|
||||
of the NOTICE file are for informational purposes only and
|
||||
do not modify the License. You may add Your own attribution
|
||||
notices within Derivative Works that You distribute, alongside
|
||||
or as an addendum to the NOTICE text from the Work, provided
|
||||
that such additional attribution notices cannot be construed
|
||||
as modifying the License.
|
||||
|
||||
You may add Your own copyright statement to Your modifications and
|
||||
may provide additional or different license terms and conditions
|
||||
for use, reproduction, or distribution of Your modifications, or
|
||||
for any such Derivative Works as a whole, provided Your use,
|
||||
reproduction, and distribution of the Work otherwise complies with
|
||||
the conditions stated in this License.
|
||||
|
||||
5. Submission of Contributions. Unless You explicitly state otherwise,
|
||||
any Contribution intentionally submitted for inclusion in the Work
|
||||
by You to the Licensor shall be under the terms and conditions of
|
||||
this License, without any additional terms or conditions.
|
||||
Notwithstanding the above, nothing herein shall supersede or modify
|
||||
the terms of any separate license agreement you may have executed
|
||||
with Licensor regarding such Contributions.
|
||||
|
||||
6. Trademarks. This License does not grant permission to use the trade
|
||||
names, trademarks, service marks, or product names of the Licensor,
|
||||
except as required for reasonable and customary use in describing the
|
||||
origin of the Work and reproducing the content of the NOTICE file.
|
||||
|
||||
7. Disclaimer of Warranty. Unless required by applicable law or
|
||||
agreed to in writing, Licensor provides the Work (and each
|
||||
Contributor provides its Contributions) on an "AS IS" BASIS,
|
||||
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or
|
||||
implied, including, without limitation, any warranties or conditions
|
||||
of TITLE, NON-INFRINGEMENT, MERCHANTABILITY, or FITNESS FOR A
|
||||
PARTICULAR PURPOSE. You are solely responsible for determining the
|
||||
appropriateness of using or redistributing the Work and assume any
|
||||
risks associated with Your exercise of permissions under this License.
|
||||
|
||||
8. Limitation of Liability. In no event and under no legal theory,
|
||||
whether in tort (including negligence), contract, or otherwise,
|
||||
unless required by applicable law (such as deliberate and grossly
|
||||
negligent acts) or agreed to in writing, shall any Contributor be
|
||||
liable to You for damages, including any direct, indirect, special,
|
||||
incidental, or consequential damages of any character arising as a
|
||||
result of this License or out of the use or inability to use the
|
||||
Work (including but not limited to damages for loss of goodwill,
|
||||
work stoppage, computer failure or malfunction, or any and all
|
||||
other commercial damages or losses), even if such Contributor
|
||||
has been advised of the possibility of such damages.
|
||||
|
||||
9. Accepting Warranty or Additional Liability. While redistributing
|
||||
the Work or Derivative Works thereof, You may choose to offer,
|
||||
and charge a fee for, acceptance of support, warranty, indemnity,
|
||||
or other liability obligations and/or rights consistent with this
|
||||
License. However, in accepting such obligations, You may act only
|
||||
on Your own behalf and on Your sole responsibility, not on behalf
|
||||
of any other Contributor, and only if You agree to indemnify,
|
||||
defend, and hold each Contributor harmless for any liability
|
||||
incurred by, or claims asserted against, such Contributor by reason
|
||||
of your accepting any such warranty or additional liability.
|
||||
|
||||
END OF TERMS AND CONDITIONS
|
||||
|
||||
APPENDIX: How to apply the Apache License to your work.
|
||||
|
||||
To apply the Apache License to your work, attach the following
|
||||
boilerplate notice, with the fields enclosed by brackets "[]"
|
||||
replaced with your own identifying information. (Don't include
|
||||
the brackets!) The text should be enclosed in the appropriate
|
||||
comment syntax for the file format. We also recommend that a
|
||||
file or class name and description of purpose be included on the
|
||||
same "printed page" as the copyright notice for easier
|
||||
identification within third-party archives.
|
||||
|
||||
Copyright 2015 Grafana Labs
|
||||
|
||||
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.
|
||||
@@ -0,0 +1,24 @@
|
||||
# Grafana Histogram component
|
||||
|
||||
> **@grafana/histogram is currently in BETA**.
|
||||
|
||||
This is a Histogram component that is used in Grafana to display histogram visualizations.
|
||||
|
||||
## Usage
|
||||
|
||||
Currently this library exposes histogram panel components and utilities for rendering histogram visualizations.
|
||||
|
||||
```tsx
|
||||
import { HistogramPanel } from '@grafana/histogram';
|
||||
|
||||
<HistogramPanel data={dataFrame} options={options} width={width} height={height} />;
|
||||
```
|
||||
|
||||
#### Props
|
||||
|
||||
| Name | Type | Description |
|
||||
| ------- | --------- | ----------------------------------------------------------------------------------------------------- |
|
||||
| data | PanelData | Panel data containing the histogram data. Optional, if missing or empty the histogram is not rendered |
|
||||
| options | Options | Histogram panel options for configuration |
|
||||
| width | number | Width of the visualization |
|
||||
| height | number | Height of the visualization |
|
||||
@@ -0,0 +1,82 @@
|
||||
{
|
||||
"author": "Grafana Labs",
|
||||
"license": "Apache-2.0",
|
||||
"name": "@grafana/histogram",
|
||||
"version": "12.2.0-pre",
|
||||
"description": "Grafana histogram visualization component",
|
||||
"keywords": [
|
||||
"grafana",
|
||||
"histogram",
|
||||
"visualization",
|
||||
"chart"
|
||||
],
|
||||
"sideEffects": false,
|
||||
"repository": {
|
||||
"type": "git",
|
||||
"url": "http://github.com/grafana/grafana.git",
|
||||
"directory": "packages/grafana-histogram"
|
||||
},
|
||||
"main": "src/index.ts",
|
||||
"types": "src/index.ts",
|
||||
"publishConfig": {
|
||||
"main": "./dist/cjs/index.cjs",
|
||||
"module": "./dist/esm/index.mjs",
|
||||
"types": "./dist/types/index.d.ts",
|
||||
"access": "public"
|
||||
},
|
||||
"files": [
|
||||
"./dist",
|
||||
"./README.md",
|
||||
"./CHANGELOG.md",
|
||||
"./LICENSE_APACHE2"
|
||||
],
|
||||
"scripts": {
|
||||
"build": "tsc -p ./tsconfig.build.json && rollup -c rollup.config.ts --configPlugin esbuild",
|
||||
"bundle": "rollup -c rollup.config.ts --configPlugin esbuild",
|
||||
"clean": "rimraf ./dist ./compiled ./package.tgz",
|
||||
"typecheck": "tsc --emitDeclarationOnly false --noEmit",
|
||||
"prepack": "cp package.json package.json.bak && node ../../scripts/prepare-npm-package.js",
|
||||
"postpack": "mv package.json.bak package.json"
|
||||
},
|
||||
"browserslist": [
|
||||
"defaults",
|
||||
"not IE 11"
|
||||
],
|
||||
"dependencies": {
|
||||
"@emotion/css": "11.13.5",
|
||||
"@grafana/data": "12.2.0-pre",
|
||||
"@grafana/i18n": "12.2.0-pre",
|
||||
"@grafana/schema": "12.2.0-pre",
|
||||
"@grafana/ui": "12.2.0-pre",
|
||||
"lodash": "4.17.21",
|
||||
"react": "18.3.1",
|
||||
"tslib": "2.8.1"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@babel/core": "7.28.0",
|
||||
"@babel/preset-env": "7.28.0",
|
||||
"@babel/preset-react": "7.27.1",
|
||||
"@rollup/plugin-node-resolve": "16.0.1",
|
||||
"@testing-library/dom": "10.4.1",
|
||||
"@testing-library/jest-dom": "^6.1.2",
|
||||
"@testing-library/react": "16.3.0",
|
||||
"@testing-library/user-event": "14.6.1",
|
||||
"@types/jest": "^29.5.4",
|
||||
"@types/lodash": "4.17.20",
|
||||
"@types/node": "22.17.0",
|
||||
"@types/react": "18.3.18",
|
||||
"babel-jest": "29.7.0",
|
||||
"esbuild": "0.25.8",
|
||||
"jest": "^29.6.4",
|
||||
"rollup": "^4.22.4",
|
||||
"rollup-plugin-esbuild": "6.2.1",
|
||||
"rollup-plugin-node-externals": "^8.0.0",
|
||||
"ts-jest": "29.4.0",
|
||||
"ts-node": "10.9.2",
|
||||
"typescript": "5.9.2"
|
||||
},
|
||||
"peerDependencies": {
|
||||
"react": "^18.0.0",
|
||||
"react-dom": "^18.0.0"
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,8 @@
|
||||
{
|
||||
"$schema": "../../node_modules/nx/schemas/project-schema.json",
|
||||
"projectType": "library",
|
||||
"tags": ["scope:package", "type:ui"],
|
||||
"targets": {
|
||||
"build": {}
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,15 @@
|
||||
import { createRequire } from 'node:module';
|
||||
|
||||
import { cjsOutput, entryPoint, esmOutput, plugins } from '../rollup.config.parts';
|
||||
|
||||
const rq = createRequire(import.meta.url);
|
||||
const pkg = rq('./package.json');
|
||||
|
||||
export default [
|
||||
{
|
||||
input: entryPoint,
|
||||
plugins,
|
||||
output: [cjsOutput(pkg), esmOutput(pkg, 'grafana-histogram')],
|
||||
treeshake: false,
|
||||
},
|
||||
];
|
||||
+2
-1
@@ -21,8 +21,9 @@ import {
|
||||
PlotLegend,
|
||||
measureText,
|
||||
UPLOT_AXIS_FONT_SIZE,
|
||||
getStackingGroups,
|
||||
preparePlotData2,
|
||||
} from '@grafana/ui';
|
||||
import { getStackingGroups, preparePlotData2 } from '@grafana/ui/internal';
|
||||
|
||||
import { defaultFieldConfig, FieldConfig, Options } from './panelcfg.gen';
|
||||
|
||||
@@ -0,0 +1,122 @@
|
||||
import { useMemo } from 'react';
|
||||
|
||||
import {
|
||||
histogramFieldsToFrame,
|
||||
joinHistograms,
|
||||
DataFrameType,
|
||||
PanelProps,
|
||||
buildHistogram,
|
||||
cacheFieldDisplayNames,
|
||||
getHistogramFields,
|
||||
} from '@grafana/data';
|
||||
import { Trans } from '@grafana/i18n';
|
||||
import { TooltipDisplayMode, TooltipPlugin2, useTheme2, TooltipHoverMode } from '@grafana/ui';
|
||||
|
||||
import { Histogram, getBucketSize } from './Histogram';
|
||||
import { HistogramTooltip } from './HistogramTooltip';
|
||||
import { Options } from './panelcfg.gen';
|
||||
|
||||
type Props = PanelProps<Options>;
|
||||
|
||||
export const HistogramPanel = ({ data, options, width, height }: Props) => {
|
||||
const theme = useTheme2();
|
||||
|
||||
const histogram = useMemo(() => {
|
||||
if (!data.series.length) {
|
||||
return undefined;
|
||||
}
|
||||
|
||||
// stamp origins for legend's calcs (from raw values)
|
||||
data.series.forEach((frame, frameIndex) => {
|
||||
frame.fields.forEach((field, fieldIndex) => {
|
||||
field.state = {
|
||||
...field.state,
|
||||
origin: {
|
||||
frameIndex,
|
||||
fieldIndex,
|
||||
},
|
||||
};
|
||||
});
|
||||
});
|
||||
|
||||
cacheFieldDisplayNames(data.series);
|
||||
|
||||
if (
|
||||
data.series.length === 1 ||
|
||||
data.series.every(
|
||||
(frame) => frame.meta?.type === DataFrameType.HeatmapCells || frame.meta?.type === DataFrameType.HeatmapRows
|
||||
)
|
||||
) {
|
||||
const histograms = data.series.map((frame) => getHistogramFields(frame)).filter((hist) => hist != null);
|
||||
|
||||
if (histograms.length) {
|
||||
return histogramFieldsToFrame(joinHistograms(histograms), theme);
|
||||
}
|
||||
}
|
||||
const hist = buildHistogram(data.series, options, theme);
|
||||
if (!hist) {
|
||||
return undefined;
|
||||
}
|
||||
|
||||
return histogramFieldsToFrame(hist, theme);
|
||||
}, [data.series, options, theme]);
|
||||
|
||||
if (!histogram || !histogram.fields.length) {
|
||||
return (
|
||||
<div className="panel-empty">
|
||||
<p>
|
||||
<Trans i18nKey="histogram.histogram-panel.no-histogram-found-in-response">
|
||||
No histogram found in response
|
||||
</Trans>
|
||||
</p>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
const bucketSize = getBucketSize(histogram);
|
||||
|
||||
return (
|
||||
<Histogram
|
||||
options={options}
|
||||
theme={theme}
|
||||
legend={options.legend}
|
||||
rawSeries={data.series}
|
||||
structureRev={data.structureRev}
|
||||
width={width}
|
||||
height={height}
|
||||
alignedFrame={histogram}
|
||||
bucketSize={bucketSize}
|
||||
bucketCount={options.bucketCount}
|
||||
>
|
||||
{(builder, alignedFrame, xMinOnlyFrame) => {
|
||||
return (
|
||||
<>
|
||||
{options.tooltip.mode !== TooltipDisplayMode.None && (
|
||||
<TooltipPlugin2
|
||||
config={builder}
|
||||
hoverMode={
|
||||
options.tooltip.mode === TooltipDisplayMode.Single ? TooltipHoverMode.xOne : TooltipHoverMode.xAll
|
||||
}
|
||||
render={(u, dataIdxs, seriesIdx, isPinned = false) => {
|
||||
return (
|
||||
<HistogramTooltip
|
||||
series={histogram}
|
||||
xMinOnlyFrame={xMinOnlyFrame}
|
||||
dataIdxs={dataIdxs}
|
||||
seriesIdx={seriesIdx}
|
||||
mode={options.tooltip.mode}
|
||||
sortOrder={options.tooltip.sort}
|
||||
isPinned={isPinned}
|
||||
maxHeight={options.tooltip.maxHeight}
|
||||
/>
|
||||
);
|
||||
}}
|
||||
maxWidth={options.tooltip.maxWidth}
|
||||
/>
|
||||
)}
|
||||
</>
|
||||
);
|
||||
}}
|
||||
</Histogram>
|
||||
);
|
||||
};
|
||||
+3
-4
@@ -1,7 +1,7 @@
|
||||
import { ReactNode, useMemo } from 'react';
|
||||
|
||||
import { DataFrame, formattedValueToString } from '@grafana/data';
|
||||
import { SortOrder, TooltipDisplayMode } from '@grafana/schema/dist/esm/common/common.gen';
|
||||
import { SortOrder, TooltipDisplayMode } from '@grafana/schema';
|
||||
import {
|
||||
VizTooltipContent,
|
||||
VizTooltipFooter,
|
||||
@@ -9,10 +9,9 @@ import {
|
||||
VizTooltipWrapper,
|
||||
getContentItems,
|
||||
VizTooltipItem,
|
||||
} from '@grafana/ui/internal';
|
||||
} from '@grafana/ui';
|
||||
|
||||
import { getDataLinks } from '../status-history/utils';
|
||||
import { isTooltipScrollable } from '../timeseries/utils';
|
||||
import { getDataLinks, isTooltipScrollable } from './utils/duplicated';
|
||||
|
||||
export interface HistogramTooltipProps {
|
||||
// aligned series frame
|
||||
@@ -0,0 +1,7 @@
|
||||
export { HistogramPanel } from './HistogramPanel';
|
||||
export { Histogram, getBucketSize } from './Histogram';
|
||||
export { HistogramTooltip, type HistogramTooltipProps } from './HistogramTooltip';
|
||||
export { changeToHistogramPanelMigrationHandler } from './migrations';
|
||||
export { defaultHistogramConfig } from './config';
|
||||
export { originalDataHasHistogram } from './utils';
|
||||
export { type Options, type FieldConfig, defaultOptions, defaultFieldConfig } from './panelcfg.gen';
|
||||
+1
-6
@@ -1,12 +1,7 @@
|
||||
import { isNil, omitBy } from 'lodash';
|
||||
|
||||
import { FieldConfigSource, PanelTypeChangedHandler } from '@grafana/data';
|
||||
import {
|
||||
LegendDisplayMode,
|
||||
SortOrder,
|
||||
StackingMode,
|
||||
TooltipDisplayMode,
|
||||
} from '@grafana/schema/dist/esm/common/common.gen';
|
||||
import { LegendDisplayMode, SortOrder, StackingMode, TooltipDisplayMode } from '@grafana/schema';
|
||||
|
||||
import { defaultHistogramConfig } from './config';
|
||||
import { FieldConfig as HistogramFieldConfig, Options } from './panelcfg.gen';
|
||||
@@ -0,0 +1,57 @@
|
||||
// Code generated - EDITING IS FUTILE. DO NOT EDIT.
|
||||
//
|
||||
// Generated by:
|
||||
// public/app/plugins/gen.go
|
||||
// Using jennies:
|
||||
// TSTypesJenny
|
||||
// PluginTsTypesJenny
|
||||
//
|
||||
// Run 'make gen-cue' from repository root to regenerate.
|
||||
|
||||
import * as common from '@grafana/schema';
|
||||
|
||||
export interface Options extends common.OptionsWithLegend, common.OptionsWithTooltip {
|
||||
/**
|
||||
* Bucket count (approx)
|
||||
*/
|
||||
bucketCount?: number;
|
||||
/**
|
||||
* Offset buckets by this amount
|
||||
*/
|
||||
bucketOffset?: number;
|
||||
/**
|
||||
* Size of each bucket
|
||||
*/
|
||||
bucketSize?: number;
|
||||
/**
|
||||
* Combines multiple series into a single histogram
|
||||
*/
|
||||
combine?: boolean;
|
||||
}
|
||||
|
||||
export const defaultOptions: Partial<Options> = {
|
||||
bucketCount: 30,
|
||||
bucketOffset: 0,
|
||||
};
|
||||
|
||||
export interface FieldConfig extends common.AxisConfig, common.HideableFieldConfig, common.StackableFieldConfig {
|
||||
/**
|
||||
* Controls the fill opacity of the bars.
|
||||
*/
|
||||
fillOpacity?: number;
|
||||
/**
|
||||
* Set the mode of the gradient fill. Fill gradient is based on the line color. To change the color, use the standard color scheme field option.
|
||||
* Gradient appearance is influenced by the Fill opacity setting.
|
||||
*/
|
||||
gradientMode?: common.GraphGradientMode;
|
||||
/**
|
||||
* Controls line width of the bars.
|
||||
*/
|
||||
lineWidth?: number;
|
||||
}
|
||||
|
||||
export const defaultFieldConfig: Partial<FieldConfig> = {
|
||||
fillOpacity: 80,
|
||||
gradientMode: common.GraphGradientMode.None,
|
||||
lineWidth: 1,
|
||||
};
|
||||
@@ -0,0 +1,55 @@
|
||||
/**
|
||||
* TODO: REMOVE THIS FILE - ARCHITECTURAL DEBT
|
||||
*
|
||||
* This file contains utility functions duplicated from other panel implementations
|
||||
* to enable the Histogram panel to be extracted as a separate package.
|
||||
*
|
||||
* This is a temporary solution. The proper fix is to move these utilities to a
|
||||
* shared location (e.g., @grafana/ui or @grafana/data) so all panels can import
|
||||
* them without cross-panel dependencies.
|
||||
*
|
||||
* DO NOT ADD MORE FUNCTIONS TO THIS FILE.
|
||||
*/
|
||||
|
||||
import { Field, LinkModel } from '@grafana/data';
|
||||
import { TooltipDisplayMode } from '@grafana/schema';
|
||||
|
||||
/**
|
||||
* Duplicated from: public/app/plugins/panel/status-history/utils.ts
|
||||
* Original: https://github.com/grafana/grafana/blob/main/public/app/plugins/panel/status-history/utils.ts#L4-L23
|
||||
* TODO: Move to shared location and remove this duplication
|
||||
*/
|
||||
export const getDataLinks = (field: Field, rowIdx: number) => {
|
||||
const links: Array<LinkModel<Field>> = [];
|
||||
|
||||
if ((field.config.links?.length ?? 0) > 0 && field.getLinks != null) {
|
||||
const v = field.values[rowIdx];
|
||||
const disp = field.display ? field.display(v) : { text: `${v}`, numeric: +v };
|
||||
|
||||
const linkLookup = new Set<string>();
|
||||
|
||||
field.getLinks({ calculatedValue: disp, valueRowIndex: rowIdx }).forEach((link) => {
|
||||
const key = `${link.title}/${link.href}`;
|
||||
if (!linkLookup.has(key)) {
|
||||
links.push(link);
|
||||
linkLookup.add(key);
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
return links;
|
||||
};
|
||||
|
||||
export interface VizTooltipOptions {
|
||||
mode?: TooltipDisplayMode;
|
||||
maxHeight?: number;
|
||||
}
|
||||
|
||||
/**
|
||||
* Duplicated from: public/app/plugins/panel/timeseries/utils.ts
|
||||
* Original: https://github.com/grafana/grafana/blob/main/public/app/plugins/panel/timeseries/utils.ts#L268-L270
|
||||
* TODO: Move to shared location and remove this duplication
|
||||
*/
|
||||
export const isTooltipScrollable = (tooltipOptions: VizTooltipOptions) => {
|
||||
return tooltipOptions.mode === TooltipDisplayMode.Multi && tooltipOptions.maxHeight != null;
|
||||
};
|
||||
@@ -0,0 +1,8 @@
|
||||
{
|
||||
"extends": "./tsconfig.json",
|
||||
"compilerOptions": {
|
||||
"outDir": "./dist/cjs",
|
||||
"module": "commonjs",
|
||||
"emitDeclarationOnly": false
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,14 @@
|
||||
{
|
||||
"extends": "../../scripts/tsconfig.base.json",
|
||||
"compilerOptions": {
|
||||
"declaration": true,
|
||||
"jsx": "react-jsx",
|
||||
"baseUrl": "./",
|
||||
"declarationDir": "./dist/types",
|
||||
"emitDeclarationOnly": true,
|
||||
"isolatedModules": true,
|
||||
"rootDirs": ["."]
|
||||
},
|
||||
"exclude": ["dist/**/*"],
|
||||
"include": ["src/**/*.ts*", "../../public/app/types/*.d.ts", "../grafana-ui/src/types/*.d.ts"]
|
||||
}
|
||||
@@ -507,3 +507,15 @@ export {
|
||||
type VizTooltipOptions,
|
||||
type OptionsWithTooltip,
|
||||
} from '@grafana/schema';
|
||||
|
||||
// NOTE: Exports needed for @grafana/histogram in-repo plugin package
|
||||
export { getStackingGroups, preparePlotData2 } from './components/uPlot/utils';
|
||||
export { TooltipHoverMode } from './components/uPlot/plugins/TooltipPlugin2';
|
||||
export {
|
||||
VizTooltipContent,
|
||||
VizTooltipFooter,
|
||||
VizTooltipHeader,
|
||||
VizTooltipWrapper,
|
||||
getContentItems,
|
||||
type VizTooltipItem,
|
||||
} from './internal';
|
||||
|
||||
Reference in New Issue
Block a user