2024-06-25 19:43:47 +08:00
|
|
|
import { useCallback } from 'react';
|
2022-04-22 21:33:13 +08:00
|
|
|
|
2023-12-07 19:03:18 +08:00
|
|
|
import { StandardEditorProps, NumberFieldConfigSettings } from '@grafana/data';
|
2022-06-15 04:42:26 +08:00
|
|
|
|
|
|
|
import { NumberInput } from './NumberInput';
|
2020-03-27 04:48:46 +08:00
|
|
|
|
2023-12-07 19:03:18 +08:00
|
|
|
type Props = StandardEditorProps<number, NumberFieldConfigSettings>;
|
2023-03-15 22:56:09 +08:00
|
|
|
|
2025-08-15 02:01:25 +08:00
|
|
|
export const NumberValueEditor = ({ value, onChange, item, id }: Props) => {
|
2020-03-27 04:48:46 +08:00
|
|
|
const { settings } = item;
|
2020-05-07 22:07:49 +08:00
|
|
|
|
|
|
|
const onValueChange = useCallback(
|
2022-06-15 04:42:26 +08:00
|
|
|
(value: number | undefined) => {
|
|
|
|
onChange(settings?.integer && value !== undefined ? Math.floor(value) : value);
|
2020-05-07 22:07:49 +08:00
|
|
|
},
|
2020-10-21 15:06:41 +08:00
|
|
|
[onChange, settings?.integer]
|
2020-05-07 22:07:49 +08:00
|
|
|
);
|
|
|
|
|
2020-03-27 04:48:46 +08:00
|
|
|
return (
|
2022-06-15 04:42:26 +08:00
|
|
|
<NumberInput
|
2025-08-15 02:01:25 +08:00
|
|
|
id={id}
|
2022-06-15 04:42:26 +08:00
|
|
|
value={value}
|
2020-03-27 19:38:46 +08:00
|
|
|
min={settings?.min}
|
|
|
|
max={settings?.max}
|
|
|
|
step={settings?.step}
|
|
|
|
placeholder={settings?.placeholder}
|
2022-06-15 04:42:26 +08:00
|
|
|
onChange={onValueChange}
|
2020-03-27 04:48:46 +08:00
|
|
|
/>
|
|
|
|
);
|
|
|
|
};
|