diff --git a/package.json b/package.json
index 343b338a..807809a6 100644
--- a/package.json
+++ b/package.json
@@ -1,7 +1,7 @@
{
"name": "@diamondlightsource/cs-web-lib",
"type": "module",
- "version": "0.10.19",
+ "version": "0.10.20",
"description": "Control system web library",
"main": "./dist/index.cjs",
"scripts": {
diff --git a/src/ui/widgets/Meter/meter.test.tsx b/src/ui/widgets/Meter/meter.test.tsx
index 67d3d117..7e1b0334 100644
--- a/src/ui/widgets/Meter/meter.test.tsx
+++ b/src/ui/widgets/Meter/meter.test.tsx
@@ -159,6 +159,7 @@ describe("MeterComponent", () => {
render();
expect(meterUtilities.buildSubArcs).toHaveBeenCalledWith(
+ true,
"rgba(0,0,0,1)",
0,
100,
diff --git a/src/ui/widgets/Meter/meter.tsx b/src/ui/widgets/Meter/meter.tsx
index 126b6275..13af3e8b 100644
--- a/src/ui/widgets/Meter/meter.tsx
+++ b/src/ui/widgets/Meter/meter.tsx
@@ -39,7 +39,8 @@ export const MeterProps = {
font: FontPropOpt,
transparent: BoolPropOpt,
showUnits: BoolPropOpt,
- showValue: BoolPropOpt
+ showValue: BoolPropOpt,
+ showLimits: BoolPropOpt
};
export type MeterComponentProps = InferWidgetProps &
@@ -60,7 +61,8 @@ export const MeterComponent = (props: MeterComponentProps): JSX.Element => {
limitsFromPv = true,
precision = undefined,
showUnits = true,
- showValue = true
+ showValue = true,
+ showLimits = true
} = newProps as MeterComponentProps;
const { value } = getPvValueAndName(pvData);
@@ -150,6 +152,7 @@ export const MeterComponent = (props: MeterComponentProps): JSX.Element => {
padding: 0,
cornerRadius: 0,
subArcs: buildSubArcs(
+ showLimits,
style?.colors?.color as string,
minimum,
maximum,
diff --git a/src/ui/widgets/Meter/meterUtilities.test.ts b/src/ui/widgets/Meter/meterUtilities.test.ts
index 0f9d04d3..f328a710 100644
--- a/src/ui/widgets/Meter/meterUtilities.test.ts
+++ b/src/ui/widgets/Meter/meterUtilities.test.ts
@@ -167,7 +167,7 @@ describe("formatValue", () => {
describe("buildSubArcs", () => {
it("should build sub arcs with all ranges defined", () => {
- const subArcs = buildSubArcs("blue", 0, 100, 10, 20, 80, 90);
+ const subArcs = buildSubArcs(true, "blue", 0, 100, 10, 20, 80, 90);
expect(subArcs).toHaveLength(5);
expect(subArcs[0].limit).toBe(10);
@@ -187,7 +187,16 @@ describe("buildSubArcs", () => {
});
it("should build sub arcs with only warning ranges", () => {
- const subArcs = buildSubArcs("green", 0, 100, undefined, 20, 80, undefined);
+ const subArcs = buildSubArcs(
+ true,
+ "green",
+ 0,
+ 100,
+ undefined,
+ 20,
+ 80,
+ undefined
+ );
expect(subArcs).toHaveLength(3);
expect(subArcs[0].limit).toBe(20);
@@ -201,7 +210,16 @@ describe("buildSubArcs", () => {
});
it("should build sub arcs with only alarm ranges", () => {
- const subArcs = buildSubArcs("red", 0, 100, 10, undefined, undefined, 90);
+ const subArcs = buildSubArcs(
+ true,
+ "red",
+ 0,
+ 100,
+ 10,
+ undefined,
+ undefined,
+ 90
+ );
expect(subArcs).toHaveLength(3);
expect(subArcs[0].limit).toBe(10);
@@ -215,7 +233,7 @@ describe("buildSubArcs", () => {
});
it("should build sub arcs when low value alarm range greater then low value warning range", () => {
- const subArcs = buildSubArcs("green", 0, 100, 20, 10, 80, 90);
+ const subArcs = buildSubArcs(true, "green", 0, 100, 20, 10, 80, 90);
expect(subArcs).toHaveLength(4);
expect(subArcs[0].limit).toBe(20);
@@ -232,7 +250,7 @@ describe("buildSubArcs", () => {
});
it("should build sub arcs when high value alarm range lower than high value warning range", () => {
- const subArcs = buildSubArcs("green", 0, 100, 10, 20, 80, 70);
+ const subArcs = buildSubArcs(true, "green", 0, 100, 10, 20, 80, 70);
expect(subArcs).toHaveLength(4);
expect(subArcs[0].limit).toBe(10);
@@ -250,6 +268,7 @@ describe("buildSubArcs", () => {
it("should build sub arcs with no ranges", () => {
const subArcs = buildSubArcs(
+ true,
"purple",
0,
100,
@@ -265,11 +284,19 @@ describe("buildSubArcs", () => {
});
it("should clamp values to min/max bounds", () => {
- const subArcs = buildSubArcs("blue", 50, 150, 0, 60, 160, 200);
+ const subArcs = buildSubArcs(true, "blue", 50, 150, 0, 60, 160, 200);
expect(subArcs[0].limit).toBe(60); // upper limit of low value alarm range
expect(subArcs[2].limit).toBe(150); // Maximum value
});
+
+ it("should not build sub arcs when showLimits is false", () => {
+ const subArcs = buildSubArcs(false, "blue", 0, 100, 10, 20, 80, 90);
+
+ expect(subArcs).toHaveLength(1);
+ expect(subArcs[0].limit).toBe(100);
+ expect(subArcs[0].color).toBe("blue");
+ });
});
describe("createIntervals", () => {
diff --git a/src/ui/widgets/Meter/meterUtilities.ts b/src/ui/widgets/Meter/meterUtilities.ts
index aabe6097..f9075fc7 100644
--- a/src/ui/widgets/Meter/meterUtilities.ts
+++ b/src/ui/widgets/Meter/meterUtilities.ts
@@ -98,6 +98,7 @@ export const formatValue =
* @returns An array of sub arc for the meter
*/
export const buildSubArcs = (
+ showLimits: boolean,
foregroundColor: string,
minimum: number,
maximum: number,
@@ -111,7 +112,7 @@ export const buildSubArcs = (
const withinBounds = (value: number) =>
Math.min(maximum, Math.max(minimum, value));
- if (alarmRangeMin && alarmRangeMin > minimum) {
+ if (alarmRangeMin && alarmRangeMin > minimum && showLimits) {
subArcs.push({
limit: withinBounds(alarmRangeMin),
width: 0.04,
@@ -120,7 +121,11 @@ export const buildSubArcs = (
});
}
- if (warningRangeMin && warningRangeMin > (alarmRangeMin ?? minimum)) {
+ if (
+ warningRangeMin &&
+ warningRangeMin > (alarmRangeMin ?? minimum) &&
+ showLimits
+ ) {
subArcs.push({
limit: withinBounds(warningRangeMin),
width: 0.04,
@@ -131,14 +136,20 @@ export const buildSubArcs = (
subArcs.push({
limit: withinBounds(
- Math.min(warningRangeMax ?? maximum, alarmRangeMax ?? maximum)
+ !showLimits
+ ? maximum
+ : Math.min(warningRangeMax ?? maximum, alarmRangeMax ?? maximum)
),
width: 0.02,
showTick: false,
color: foregroundColor
});
- if (warningRangeMax && warningRangeMax < (alarmRangeMax ?? maximum)) {
+ if (
+ warningRangeMax &&
+ warningRangeMax < (alarmRangeMax ?? maximum) &&
+ showLimits
+ ) {
subArcs.push({
limit: withinBounds(alarmRangeMax ?? maximum),
width: 0.04,
@@ -147,7 +158,7 @@ export const buildSubArcs = (
});
}
- if (alarmRangeMax && alarmRangeMax < maximum) {
+ if (alarmRangeMax && alarmRangeMax < maximum && showLimits) {
subArcs.push({
limit: withinBounds(maximum),
width: 0.04,