@grafana/ui
Version:
Grafana Components Library
1 lines • 5.86 kB
Source Map (JSON)
{"version":3,"file":"Input.mjs","sources":["../../../../../../src/components/Forms/Legacy/Input/Input.tsx"],"sourcesContent":["import classNames from 'classnames';\nimport { PureComponent, ChangeEvent } from 'react';\nimport * as React from 'react';\n\nimport { ValidationEvents, ValidationRule } from '../../../../types/input';\nimport { validate, EventsWithValidation, hasValidationEvent } from '../../../../utils/validate';\n\n/** @deprecated Please use the `Input` component, which does not require this enum. */\nexport enum LegacyInputStatus {\n Invalid = 'invalid',\n Valid = 'valid',\n}\n\nexport interface Props extends React.HTMLProps<HTMLInputElement> {\n validationEvents?: ValidationEvents;\n hideErrorMessage?: boolean;\n inputRef?: React.LegacyRef<HTMLInputElement>;\n\n // Override event props and append status as argument\n onBlur?: (event: React.FocusEvent<HTMLInputElement>, status?: LegacyInputStatus) => void;\n onFocus?: (event: React.FocusEvent<HTMLInputElement>, status?: LegacyInputStatus) => void;\n onChange?: (event: React.ChangeEvent<HTMLInputElement>, status?: LegacyInputStatus) => void;\n}\n\ninterface State {\n error: string | null;\n}\n\n/** @deprecated Please use the `Input` component. {@link https://developers.grafana.com/ui/latest/index.html?path=/story/forms-input--simple See Storybook for example.} */\nexport class Input extends PureComponent<Props, State> {\n static defaultProps = {\n className: '',\n };\n\n state: State = {\n error: null,\n };\n\n get status() {\n return this.state.error ? LegacyInputStatus.Invalid : LegacyInputStatus.Valid;\n }\n\n get isInvalid() {\n return this.status === LegacyInputStatus.Invalid;\n }\n\n validatorAsync = (validationRules: ValidationRule[]) => {\n return (evt: ChangeEvent<HTMLInputElement>) => {\n const errors = validate(evt.target.value, validationRules);\n this.setState((prevState) => {\n return { ...prevState, error: errors ? errors[0] : null };\n });\n };\n };\n\n populateEventPropsWithStatus = (restProps: any, validationEvents: ValidationEvents | undefined) => {\n const inputElementProps = { ...restProps };\n if (!validationEvents) {\n return inputElementProps;\n }\n Object.keys(EventsWithValidation).forEach((eventName) => {\n if (hasValidationEvent(eventName as EventsWithValidation, validationEvents) || restProps[eventName]) {\n inputElementProps[eventName] = async (evt: ChangeEvent<HTMLInputElement>) => {\n evt.persist(); // Needed for async. https://reactjs.org/docs/events.html#event-pooling\n if (hasValidationEvent(eventName as EventsWithValidation, validationEvents)) {\n await this.validatorAsync(validationEvents[eventName]).apply(this, [evt]);\n }\n if (restProps[eventName]) {\n restProps[eventName].apply(null, [evt, this.status]);\n }\n };\n }\n });\n return inputElementProps;\n };\n\n render() {\n const { validationEvents, className, hideErrorMessage, inputRef, ...restProps } = this.props;\n const { error } = this.state;\n const inputClassName = classNames('gf-form-input', { invalid: this.isInvalid }, className);\n const inputElementProps = this.populateEventPropsWithStatus(restProps, validationEvents);\n\n return (\n <div style={{ flexGrow: 1 }}>\n <input {...inputElementProps} ref={inputRef} className={inputClassName} />\n {error && !hideErrorMessage && <span>{error}</span>}\n </div>\n );\n }\n}\n"],"names":["LegacyInputStatus"],"mappings":"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"}