@ultraviolet/ui 3.21.1 → 3.22.0

package/dist/components/KeyValueInput/index.js

@@ -0,0 +1,146 @@
+'use client';
+import { __esmMin, __name } from "../../_virtual/_rolldown/runtime.js";
+import _objectSpread2, { init_objectSpread2 } from "../../_virtual/_@oxc-project_runtime@0.142.0/helpers/esm/objectSpread2.js";
+import { Stack, init_Stack } from "../Stack/index.js";
+import { Button, init_Button } from "../Button/index.js";
+import { hasHelperText, init_hasHelperText } from "../../helpers/hasHelperText.js";
+import { Description, init_Description } from "../Description/index.js";
+import { TextInput, init_TextInput } from "../TextInput/index.js";
+import { Row, init_Row } from "../Row/index.js";
+import { init_styles_css, keyValueInputStyle } from "./styles.css.js";
+import { SelectInput, init_SelectInput } from "../SelectInput/index.js";
+import { useId } from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { DeleteIcon, PlusIcon } from "@ultraviolet/icons";
+
+//#region src/components/KeyValueInput/index.tsx
+var KeyValueInput;
+function init_KeyValueInput() {
+	return (init_KeyValueInput = __esmMin(() => {
+		init_hasHelperText();
+		init_Button();
+		init_Description();
+		init_Row();
+		init_SelectInput();
+		init_Stack();
+		init_TextInput();
+		init_styles_css();
+		init_objectSpread2();
+		KeyValueInput = ({ style, className, size = "large", disabled, required, error, onChange, onFocus, onBlur, name, "aria-describedby": ariaDescribedBy, inputKey, inputValue, addButton, readOnly, keyvalues = [], maxSize = 100, fieldErrors }) => {
+			var _addButton$maxSizeRea;
+			const errorId = useId();
+			const handleChange = (index, operationType, key, value) => {
+				const newKeyValues = [...keyvalues];
+				newKeyValues[index] = {
+					key: key !== null && key !== void 0 ? key : newKeyValues[index].key,
+					value: value !== null && value !== void 0 ? value : newKeyValues[index].value
+				};
+				onChange === null || onChange === void 0 || onChange(newKeyValues, index, operationType);
+			};
+			const canAdd = keyvalues && keyvalues.length !== void 0 && keyvalues.length < maxSize || !keyvalues;
+			const editable = !(disabled || readOnly);
+			const maxSizeReachedTooltip = (_addButton$maxSizeRea = addButton.maxSizeReachedTooltip) !== null && _addButton$maxSizeRea !== void 0 ? _addButton$maxSizeRea : `Cannot add more than ${maxSize} elements`;
+			const commonProps = (index, type, inputError) => {
+				const input = type === "key" ? inputKey : inputValue;
+				return {
+					label: input.label,
+					readOnly,
+					disabled,
+					required: input.required || required,
+					size,
+					"aria-describedby": inputError ? `error-${type}-${index}` : ariaDescribedBy || (hasHelperText(void 0, error) ? errorId : void 0),
+					error: !!(inputError || error),
+					name: `${name}.${index}.${type}`,
+					onFocus: () => onFocus === null || onFocus === void 0 ? void 0 : onFocus(keyvalues, index),
+					onBlur: () => onBlur === null || onBlur === void 0 ? void 0 : onBlur(keyvalues, index),
+					value: keyvalues[index][type],
+					placeholder: input.placeholder
+				};
+			};
+			return /* @__PURE__ */ jsxs(Stack, {
+				gap: 3,
+				style,
+				className,
+				children: [
+					keyvalues && (keyvalues === null || keyvalues === void 0 ? void 0 : keyvalues.length) > 0 ? /* @__PURE__ */ jsx(Stack, {
+						gap: 3,
+						children: keyvalues.map((_, index) => {
+							var _fieldErrors$index;
+							var _fieldErrors$index2;
+							const errorKey = fieldErrors === null || fieldErrors === void 0 || (_fieldErrors$index = fieldErrors[index]) === null || _fieldErrors$index === void 0 ? void 0 : _fieldErrors$index.key;
+							const errorValue = fieldErrors === null || fieldErrors === void 0 || (_fieldErrors$index2 = fieldErrors[index]) === null || _fieldErrors$index2 === void 0 ? void 0 : _fieldErrors$index2.value;
+							return /* @__PURE__ */ jsxs(Row, {
+								alignItems: "flex-end",
+								templateColumns: "1fr 1fr auto",
+								className: keyValueInputStyle.row,
+								children: [
+									inputKey.inputType === "select" ? /* @__PURE__ */ jsx(SelectInput, _objectSpread2({
+										options: inputKey.options,
+										onChange: (key) => handleChange(index, "change", key)
+									}, commonProps(index, "key", errorKey))) : /* @__PURE__ */ jsx(TextInput, _objectSpread2({ onChangeValue: (key) => handleChange(index, "change", key) }, commonProps(index, "key", errorKey))),
+									inputValue.inputType === "select" ? /* @__PURE__ */ jsx(SelectInput, _objectSpread2({
+										options: inputValue.options,
+										onChange: (value) => handleChange(index, "change", void 0, value)
+									}, commonProps(index, "value", errorValue))) : /* @__PURE__ */ jsx(TextInput, _objectSpread2({
+										autoComplete: "off",
+										type: inputValue.type,
+										onChangeValue: (value) => handleChange(index, "change", void 0, value)
+									}, commonProps(index, "value", errorValue))),
+									/* @__PURE__ */ jsx(Button, {
+										"data-testid": `remove-button-${index}`,
+										disabled: !editable,
+										onClick: () => {
+											const newKeyValues = keyvalues.filter((_, i) => index !== i);
+											onChange === null || onChange === void 0 || onChange(newKeyValues, index, "remove");
+										},
+										sentiment: "danger",
+										size,
+										variant: "outlined",
+										children: /* @__PURE__ */ jsx(DeleteIcon, { disabled: !editable })
+									}),
+									errorKey ? /* @__PURE__ */ jsx(Description, {
+										error: errorKey,
+										id: `error-key-${index}`,
+										className: keyValueInputStyle.errorDescription.key
+									}) : null,
+									errorValue ? /* @__PURE__ */ jsx(Description, {
+										error: errorValue,
+										id: `error-value-${index}`,
+										className: keyValueInputStyle.errorDescription.value
+									}) : null
+								]
+							}, index);
+						})
+					}) : null,
+					/* @__PURE__ */ jsx(Stack, {
+						direction: "row",
+						justifyContent: "flex-start",
+						children: /* @__PURE__ */ jsxs(Button, {
+							"data-testid": "add-button",
+							disabled: !(canAdd && editable),
+							fullWidth: addButton.fullWidth,
+							onClick: () => {
+								const index = keyvalues ? keyvalues.length : 0;
+								handleChange(index, "add", "", "");
+							},
+							sentiment: "primary",
+							tooltip: canAdd ? addButton.tooltip : maxSizeReachedTooltip,
+							variant: "outlined",
+							size,
+							children: [/* @__PURE__ */ jsx(PlusIcon, { disabled: !editable }), addButton.name]
+						})
+					}),
+					/* @__PURE__ */ jsx(Description, {
+						error,
+						id: ariaDescribedBy !== null && ariaDescribedBy !== void 0 ? ariaDescribedBy : errorId
+					})
+				]
+			});
+		};
+		KeyValueInput.displayName = "KeyValueInput";
+	}))();
+}
+
+//#endregion
+init_KeyValueInput();
+export { KeyValueInput, init_KeyValueInput };

package/dist/components/KeyValueInput/styles.css.d.ts

@@ -0,0 +1,5 @@
+export declare const keyValueInputStyle: {
+    errorDescription: Record<"key" | "value", string>;
+    row: string;
+};
+//# sourceMappingURL=styles.css.d.ts.map

package/dist/components/KeyValueInput/styles.css.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"styles.css.d.ts","sourceRoot":"","sources":["../../../src/components/KeyValueInput/styles.css.ts"],"names":[],"mappings":"AAaA,eAAO,MAAM,kBAAkB;;;CAA4B,CAAA"}

package/dist/components/KeyValueInput/styles.css.js

@@ -0,0 +1,21 @@
+import { __esmMin } from "../../_virtual/_rolldown/runtime.js";
+import { init_styles_css_ts_vanilla } from "./styles.css.ts.vanilla.js";
+
+//#region src/components/KeyValueInput/styles.css.ts
+var keyValueInputStyle;
+function init_styles_css() {
+	return (init_styles_css = __esmMin(() => {
+		/* @__PURE__ */ init_styles_css_ts_vanilla();
+		keyValueInputStyle = {
+			errorDescription: {
+				key: "uv_5jnvwo0",
+				value: "uv_5jnvwo1"
+			},
+			row: "uv_5jnvwo2"
+		};
+	}))();
+}
+
+//#endregion
+init_styles_css();
+export { init_styles_css, keyValueInputStyle };

package/dist/components/KeyValueInput/styles.css.ts.vanilla.js

@@ -0,0 +1,10 @@
+import { __esmMin } from "../../_virtual/_rolldown/runtime.js";
+
+//#region src/components/KeyValueInput/styles.css.ts.vanilla.css
+function init_styles_css_ts_vanilla() {
+	return (init_styles_css_ts_vanilla = __esmMin(() => {}))();
+}
+
+//#endregion
+init_styles_css_ts_vanilla();
+export { init_styles_css_ts_vanilla };

package/dist/components/KeyValueInput/types.d.ts

@@ -0,0 +1,59 @@
+import type { ComponentProps, CSSProperties } from 'react';
+import type { Button } from '../Button';
+import type { SelectInput } from '../SelectInput';
+import type { TextInput } from '../TextInput';
+type TextInputProps = {
+    inputType?: 'text';
+    regex?: (RegExp | RegExp[])[];
+};
+type SelectInputProps = {
+    inputType: 'select';
+    options: ComponentProps<typeof SelectInput>['options'];
+};
+type InputProps = XOR<[TextInputProps, SelectInputProps]>;
+type InputKeyProps = {
+    label: ComponentProps<typeof TextInput>['label'];
+    required?: ComponentProps<typeof TextInput>['required'];
+    placeholder?: ComponentProps<typeof TextInput>['placeholder'];
+} & InputProps;
+type InputValueProps = {
+    type?: ComponentProps<typeof TextInput>['type'];
+} & InputKeyProps;
+type AddButtonProps = {
+    name: ComponentProps<typeof Button>['children'];
+    fullWidth?: ComponentProps<typeof Button>['fullWidth'];
+    tooltip?: string;
+    maxSizeReachedTooltip?: string;
+};
+export type KeyValuePair = {
+    key: string;
+    value: string;
+};
+export type KeyValueInputProps = {
+    name?: string;
+    keyvalues?: KeyValuePair[];
+    size?: 'small' | 'medium' | 'large';
+    /**
+     * When set to true, both the key & value inputs are required
+     */
+    required?: boolean;
+    maxSize?: number;
+    inputKey: InputKeyProps;
+    inputValue: InputValueProps;
+    addButton: AddButtonProps;
+    disabled?: boolean;
+    readOnly?: boolean;
+    error?: boolean | string;
+    fieldErrors?: ({
+        key?: string;
+        value?: string;
+    } | null)[];
+    onChange?: (keyValues: KeyValuePair[], index?: number, operationType?: 'change' | 'add' | 'remove') => void;
+    onBlur?: (keyValues: KeyValuePair[], index?: number) => void;
+    onFocus?: (keyValues: KeyValuePair[], index?: number) => void;
+    style?: CSSProperties;
+    className?: string;
+    'aria-describedby'?: string;
+};
+export {};
+//# sourceMappingURL=types.d.ts.map

package/dist/components/KeyValueInput/types.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/components/KeyValueInput/types.ts"],"names":[],"mappings":"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"}

package/dist/components/Label/LabelContent.js

@@ -8,53 +8,55 @@ import { jsx, jsxs } from "react/jsx-runtime";
 
 //#region src/components/Label/LabelContent.tsx
 var LabelRequiredOrNot;
-var init_LabelContent = __esmMin(() => {
-	init_Stack();
-	init_Text();
-	init_styles_css();
-	LabelRequiredOrNot = ({ children, required, id, size, htmlFor, as, sentiment, disabled, style, className }) => {
-		const textPointerValue = useMemo(() => {
-			if (disabled) return "disabled";
-			if (htmlFor) return "htmlFor";
-			return "default";
-		}, [disabled, htmlFor]);
-		if (required) return /* @__PURE__ */ jsxs(Stack, {
-			alignItems: "flex-start",
-			className,
-			direction: "row",
-			gap: "0.5",
-			style,
-			children: [/* @__PURE__ */ jsx(Text, {
+function init_LabelContent() {
+	return (init_LabelContent = __esmMin(() => {
+		init_Stack();
+		init_Text();
+		init_styles_css();
+		LabelRequiredOrNot = ({ children, required, id, size, htmlFor, as, sentiment, disabled, style, className }) => {
+			const textPointerValue = useMemo(() => {
+				if (disabled) return "disabled";
+				if (htmlFor) return "htmlFor";
+				return "default";
+			}, [disabled, htmlFor]);
+			if (required) return /* @__PURE__ */ jsxs(Stack, {
+				alignItems: "flex-start",
+				className,
+				direction: "row",
+				gap: "0.5",
+				style,
+				children: [/* @__PURE__ */ jsx(Text, {
+					as: as === "label" ? "label" : "legend",
+					className: labelStyle.textPointer[textPointerValue],
+					disabled,
+					htmlFor,
+					id,
+					sentiment,
+					variant: size === "large" ? "bodyStrong" : "bodySmallStrong",
+					children
+				}), /* @__PURE__ */ jsx(Text, {
+					"aria-label": "required",
+					as: "span",
+					disabled,
+					sentiment: "danger",
+					variant: size === "large" ? "bodyStrong" : "bodySmallStrong",
+					children: "*"
+				})]
+			});
+			return /* @__PURE__ */ jsx(Text, {
 				as: as === "label" ? "label" : "legend",
-				className: labelStyle.textPointer[textPointerValue],
+				className: cn(labelStyle.textPointer[textPointerValue], className),
 				disabled,
 				htmlFor,
 				id,
 				sentiment,
+				style,
 				variant: size === "large" ? "bodyStrong" : "bodySmallStrong",
 				children
-			}), /* @__PURE__ */ jsx(Text, {
-				"aria-label": "required",
-				as: "span",
-				disabled,
-				sentiment: "danger",
-				variant: size === "large" ? "bodyStrong" : "bodySmallStrong",
-				children: "*"
-			})]
-		});
-		return /* @__PURE__ */ jsx(Text, {
-			as: as === "label" ? "label" : "legend",
-			className: cn(labelStyle.textPointer[textPointerValue], className),
-			disabled,
-			htmlFor,
-			id,
-			sentiment,
-			style,
-			variant: size === "large" ? "bodyStrong" : "bodySmallStrong",
-			children
-		});
-	};
-});
+			});
+		};
+	}))();
+}
 
 //#endregion
 init_LabelContent();

package/dist/components/Label/index.js

@@ -7,17 +7,34 @@ import { jsx, jsxs } from "react/jsx-runtime";
 
 //#region src/components/Label/index.tsx
 var Label;
-var init_Label = __esmMin(() => {
-	init_Stack();
-	init_Text();
-	init_LabelContent();
-	Label = ({ as = "label", children, labelDescription, required, size = "large", htmlFor, id, sentiment = "neutral", disabled, style, className }) => labelDescription ? /* @__PURE__ */ jsxs(Stack, {
-		alignItems: "center",
-		className,
-		direction: "row",
-		gap: "1",
-		children: [/* @__PURE__ */ jsx(LabelRequiredOrNot, {
+function init_Label() {
+	return (init_Label = __esmMin(() => {
+		init_Stack();
+		init_Text();
+		init_LabelContent();
+		Label = ({ as = "label", children, labelDescription, required, size = "large", htmlFor, id, sentiment = "neutral", disabled, style, className }) => labelDescription ? /* @__PURE__ */ jsxs(Stack, {
+			alignItems: "center",
+			className,
+			direction: "row",
+			gap: "1",
+			children: [/* @__PURE__ */ jsx(LabelRequiredOrNot, {
+				as,
+				disabled,
+				htmlFor,
+				id,
+				required,
+				sentiment,
+				size,
+				style,
+				children
+			}), typeof labelDescription === "string" ? /* @__PURE__ */ jsx(Text, {
+				as: "span",
+				variant: "bodySmall",
+				children: labelDescription
+			}) : labelDescription]
+		}) : /* @__PURE__ */ jsx(LabelRequiredOrNot, {
 			as,
+			className,
 			disabled,
 			htmlFor,
 			id,
@@ -26,25 +43,10 @@ var init_Label = __esmMin(() => {
 			size,
 			style,
 			children
-		}), typeof labelDescription === "string" ? /* @__PURE__ */ jsx(Text, {
-			as: "span",
-			variant: "bodySmall",
-			children: labelDescription
-		}) : labelDescription]
-	}) : /* @__PURE__ */ jsx(LabelRequiredOrNot, {
-		as,
-		className,
-		disabled,
-		htmlFor,
-		id,
-		required,
-		sentiment,
-		size,
-		style,
-		children
-	});
-	Label.displayName = "Label";
-});
+		});
+		Label.displayName = "Label";
+	}))();
+}
 
 //#endregion
 init_Label();

package/dist/components/Label/styles.css.js

@@ -3,14 +3,16 @@ import { init_styles_css_ts_vanilla } from "./styles.css.ts.vanilla.js";
 
 //#region src/components/Label/styles.css.ts
 var labelStyle;
-var init_styles_css = __esmMin(() => {
-	init_styles_css_ts_vanilla();
-	labelStyle = { textPointer: {
-		"default": "uv_17td3g90",
-		disabled: "uv_17td3g91",
-		htmlFor: "uv_17td3g92"
-	} };
-});
+function init_styles_css() {
+	return (init_styles_css = __esmMin(() => {
+		/* @__PURE__ */ init_styles_css_ts_vanilla();
+		labelStyle = { textPointer: {
+			"default": "uv_17td3g90",
+			disabled: "uv_17td3g91",
+			htmlFor: "uv_17td3g92"
+		} };
+	}))();
+}
 
 //#endregion
 init_styles_css();

package/dist/components/Label/styles.css.ts.vanilla.js

@@ -1,7 +1,9 @@
 import { __esmMin } from "../../_virtual/_rolldown/runtime.js";
 
 //#region src/components/Label/styles.css.ts.vanilla.css
-var init_styles_css_ts_vanilla = __esmMin(() => {});
+function init_styles_css_ts_vanilla() {
+	return (init_styles_css_ts_vanilla = __esmMin(() => {}))();
+}
 
 //#endregion
 init_styles_css_ts_vanilla();

package/dist/components/LineChart/CustomLegend.js

@@ -13,93 +13,95 @@ import { jsx, jsxs } from "react/jsx-runtime";
 
 //#region src/components/LineChart/CustomLegend.tsx
 var noop, CustomLegend;
-var init_CustomLegend = __esmMin(() => {
-	init_legend();
-	init_Checkbox();
-	init_Text();
-	init_helpers();
-	init_LegendCell();
-	init_styles_css();
-	noop = (value) => value.toString();
-	CustomLegend = ({ axisTransformer = noop, data, selected, setSelected, className, "data-testid": dataTestId }) => /* @__PURE__ */ jsxs("div", {
-		className: cn(className, lineChartStyle.container),
-		"data-testid": dataTestId,
-		children: [/* @__PURE__ */ jsxs("div", {
-			className: lineChartStyle.head,
-			children: [
-				/* @__PURE__ */ jsx("div", {
-					className: cn(lineChartStyle.longContainer, lineChartStyle.headTitle),
-					children: "Legend"
-				}),
-				/* @__PURE__ */ jsx(Cell, {
-					value: "Minimum",
-					variant: "body"
-				}),
-				/* @__PURE__ */ jsx(Cell, {
-					value: "Maximum",
-					variant: "body"
-				}),
-				/* @__PURE__ */ jsx(Cell, {
-					value: "Average",
-					variant: "body"
-				}),
-				/* @__PURE__ */ jsx(Cell, {
-					value: "Current",
-					variant: "body"
-				})
-			]
-		}), /* @__PURE__ */ jsx("div", {
-			className: lineChartStyle.body,
-			children: data === null || data === void 0 ? void 0 : data.map((row, index) => {
-				const values = row.data.map((val) => val.y).filter((val) => typeof val === "number");
-				const labelIndexed = `${row.id}${index}`;
-				const id = row.id.toString();
-				return /* @__PURE__ */ jsxs("div", {
-					className: lineChartStyle.row,
-					children: [
-						/* @__PURE__ */ jsx("div", {
-							className: cn(lineChartStyle.longContainer, lineChartStyle.content),
-							children: /* @__PURE__ */ jsx(Checkbox, {
-								checked: selected.includes(labelIndexed),
-								name: id,
-								onChange: () => setSelected([...getSelected(id, index, selected)]),
-								children: /* @__PURE__ */ jsxs("div", {
-									className: lineChartStyle.cellValueContainer,
-									children: [/* @__PURE__ */ jsx(Text, {
-										as: "span",
-										sentiment: "neutral",
-										variant: "bodySmall",
-										children: row === null || row === void 0 ? void 0 : row["label"]
-									}), /* @__PURE__ */ jsx("div", {
-										className: lineChartStyle.legend,
-										"data-testid": `label-${id}`,
-										style: assignInlineVars({ [backgroundColorLegend]: getLegendColor(theme)[index] })
-									})]
+function init_CustomLegend() {
+	return (init_CustomLegend = __esmMin(() => {
+		init_legend();
+		init_Checkbox();
+		init_Text();
+		init_helpers();
+		init_LegendCell();
+		init_styles_css();
+		noop = (value) => value.toString();
+		CustomLegend = ({ axisTransformer = noop, data, selected, setSelected, className, "data-testid": dataTestId }) => /* @__PURE__ */ jsxs("div", {
+			className: cn(className, lineChartStyle.container),
+			"data-testid": dataTestId,
+			children: [/* @__PURE__ */ jsxs("div", {
+				className: lineChartStyle.head,
+				children: [
+					/* @__PURE__ */ jsx("div", {
+						className: cn(lineChartStyle.longContainer, lineChartStyle.headTitle),
+						children: "Legend"
+					}),
+					/* @__PURE__ */ jsx(Cell, {
+						value: "Minimum",
+						variant: "body"
+					}),
+					/* @__PURE__ */ jsx(Cell, {
+						value: "Maximum",
+						variant: "body"
+					}),
+					/* @__PURE__ */ jsx(Cell, {
+						value: "Average",
+						variant: "body"
+					}),
+					/* @__PURE__ */ jsx(Cell, {
+						value: "Current",
+						variant: "body"
+					})
+				]
+			}), /* @__PURE__ */ jsx("div", {
+				className: lineChartStyle.body,
+				children: data === null || data === void 0 ? void 0 : data.map((row, index) => {
+					const values = row.data.map((val) => val.y).filter((val) => typeof val === "number");
+					const labelIndexed = `${row.id}${index}`;
+					const id = row.id.toString();
+					return /* @__PURE__ */ jsxs("div", {
+						className: lineChartStyle.row,
+						children: [
+							/* @__PURE__ */ jsx("div", {
+								className: cn(lineChartStyle.longContainer, lineChartStyle.content),
+								children: /* @__PURE__ */ jsx(Checkbox, {
+									checked: selected.includes(labelIndexed),
+									name: id,
+									onChange: () => setSelected([...getSelected(id, index, selected)]),
+									children: /* @__PURE__ */ jsxs("div", {
+										className: lineChartStyle.cellValueContainer,
+										children: [/* @__PURE__ */ jsx(Text, {
+											as: "span",
+											sentiment: "neutral",
+											variant: "bodySmall",
+											children: row === null || row === void 0 ? void 0 : row["label"]
+										}), /* @__PURE__ */ jsx("div", {
+											className: lineChartStyle.legend,
+											"data-testid": `label-${id}`,
+											style: assignInlineVars({ [backgroundColorLegend]: getLegendColor(theme)[index] })
+										})]
+									})
 								})
+							}),
+							/* @__PURE__ */ jsx(Cell, {
+								value: axisTransformer(getMin(values)),
+								variant: "bodySmall"
+							}),
+							/* @__PURE__ */ jsx(Cell, {
+								value: axisTransformer(getMax(values)),
+								variant: "bodySmall"
+							}),
+							/* @__PURE__ */ jsx(Cell, {
+								value: axisTransformer(getAverage(values)),
+								variant: "bodySmall"
+							}),
+							/* @__PURE__ */ jsx(Cell, {
+								value: axisTransformer(getCurrent(values)),
+								variant: "bodySmall"
 							})
-						}),
-						/* @__PURE__ */ jsx(Cell, {
-							value: axisTransformer(getMin(values)),
-							variant: "bodySmall"
-						}),
-						/* @__PURE__ */ jsx(Cell, {
-							value: axisTransformer(getMax(values)),
-							variant: "bodySmall"
-						}),
-						/* @__PURE__ */ jsx(Cell, {
-							value: axisTransformer(getAverage(values)),
-							variant: "bodySmall"
-						}),
-						/* @__PURE__ */ jsx(Cell, {
-							value: axisTransformer(getCurrent(values)),
-							variant: "bodySmall"
-						})
-					]
-				}, labelIndexed);
-			})
-		})]
-	});
-});
+						]
+					}, labelIndexed);
+				})
+			})]
+		});
+	}))();
+}
 
 //#endregion
 init_CustomLegend();