UNPKG

@grafana/ui

Version:
1 lines 6.55 kB
{"version":3,"file":"FieldValueMatcher.mjs","sources":["../../../../src/components/MatchersUI/FieldValueMatcher.tsx"],"sourcesContent":["import { css } from '@emotion/css';\nimport { useMemo, useCallback } from 'react';\nimport * as React from 'react';\n\nimport {\n FieldMatcherID,\n fieldMatchers,\n FieldValueMatcherConfig,\n fieldReducers,\n ReducerID,\n SelectableValue,\n GrafanaTheme2,\n} from '@grafana/data';\nimport { ComparisonOperation } from '@grafana/schema';\n\nimport { useStyles2 } from '../../themes';\nimport { t } from '../../utils/i18n';\nimport { Input } from '../Input/Input';\nimport { Select } from '../Select/Select';\n\nimport { MatcherUIProps, FieldMatcherUIRegistryItem } from './types';\n\ntype Props = MatcherUIProps<FieldValueMatcherConfig>;\n\nexport const comparisonOperationOptions = [\n { label: '==', value: ComparisonOperation.EQ },\n { label: '!=', value: ComparisonOperation.NEQ },\n { label: '>', value: ComparisonOperation.GT },\n { label: '>=', value: ComparisonOperation.GTE },\n { label: '<', value: ComparisonOperation.LT },\n { label: '<=', value: ComparisonOperation.LTE },\n];\n\n// This should move to a utility function on the reducer registry\nfunction isBooleanReducer(r: ReducerID) {\n return r === ReducerID.allIsNull || r === ReducerID.allIsZero;\n}\n\nexport const FieldValueMatcherEditor = ({ options, onChange }: Props) => {\n const styles = useStyles2(getStyles);\n const reducer = useMemo(() => fieldReducers.selectOptions([options?.reducer]), [options?.reducer]);\n\n const onSetReducer = useCallback(\n (selection: SelectableValue<string>) => {\n return onChange({ ...options, reducer: selection.value! as ReducerID });\n },\n [options, onChange]\n );\n\n const onChangeOp = useCallback(\n (v: SelectableValue<ComparisonOperation>) => {\n return onChange({ ...options, op: v.value! });\n },\n [options, onChange]\n );\n\n const onChangeValue = useCallback(\n (e: React.FormEvent<HTMLInputElement>) => {\n const value = e.currentTarget.valueAsNumber;\n return onChange({ ...options, value });\n },\n [options, onChange]\n );\n\n const opts = options ?? {};\n const isBool = isBooleanReducer(opts.reducer);\n\n return (\n <div className={styles.spot}>\n <Select\n value={reducer.current}\n options={reducer.options}\n onChange={onSetReducer}\n placeholder={t('grafana-ui.field-value-matcher.select-field-placeholder', 'Select field reducer')}\n />\n {opts.reducer && !isBool && (\n <>\n <Select\n value={comparisonOperationOptions.find((v) => v.value === opts.op)}\n options={comparisonOperationOptions}\n onChange={onChangeOp}\n aria-label={t('grafana-ui.field-value-matcher.operator-label', 'Comparison operator')}\n width={19}\n />\n\n <Input type=\"number\" value={opts.value} onChange={onChangeValue} />\n </>\n )}\n </div>\n );\n};\n\nconst getStyles = (theme: GrafanaTheme2) => {\n return {\n spot: css({\n display: 'flex',\n flexDirection: 'row',\n alignItems: 'center',\n alignContent: 'flex-end',\n gap: '4px',\n }),\n };\n};\n\nexport const fieldValueMatcherItem: FieldMatcherUIRegistryItem<FieldValueMatcherConfig> = {\n id: FieldMatcherID.byValue,\n component: FieldValueMatcherEditor,\n matcher: fieldMatchers.get(FieldMatcherID.byValue),\n name: 'Fields with values',\n description: 'Set properties for fields with reducer condition',\n optionsToLabel: (options) => `${options?.reducer} ${options?.op} ${options?.value}`,\n};\n"],"names":[],"mappings":"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"}