Trying to import FieldValidationMessage from "@grafana/ui"

Grafana Plugin Development
1

Hi
In my custom plugin I’m trying to import the FieldValidationMessage for displaying validation errors on inputs.
this method doesn’t work for me:
import { FieldValidationMessage } from “@grafana/ui”
this one does work:
import { FieldValidationMessage } from ‘…/…/…/…/…/…/…/…/…/packages/grafana-ui/src/components/Forms/FieldValidationMessage’

I don’t like calling a file outside of my plugin.
How can I import FieldValidationMessage from “@grafana/ui” ?

2

Hi, looks like FieldValidationMessage isn’t exported from @grafana/ui yet, so using import { FieldValidationMessage } from “@grafana/ui” isn’t possible.

I’m wondering what use case do you have for it, since FieldValidationMessage is mean to be used with the Field component to show form errors?

3

@alexkhomenko
Thanks for your replay,
yes I’m using it as a form input validation field.

4

So is using the Field component with error props doesn’t cover your use case?

5

I’m not using the Field component.
Does it include the validation label ?

6

It has an error prop for the error message and invalid prop to indicate if the error should be shown: https://developers.grafana.com/ui/latest/index.html?path=/docs/forms-field--simple

1 Like
7

Thanks @alexkhomenko
I was using the input field.
Will try out, instead.
:grinning:

8

@alexkhomenko - I’m getting the error, Field is not an export member of grafana-ui.
my package.json is using:
“@grafana/ui”: “next”

what is wrong here ?

9

Which grafana version are you running this in? Try deleting node_modules and yarn.lock in your plugin and running yarn install.