@zohodesk/dot/es/form/fields/ValidationMessage/ValidationMessage.js

In this Library, we Provide Some Basic Components to Build Your Application

import React from 'react';
import { defaultProps } from "./props/defaultProps";
import { propTypes } from "./props/propTypes";
import Label from '@zohodesk/components/lib/Label/Label';
import colors from '@zohodesk/components/lib/Label/LabelColors.module.css';
import style from "./ValidationMessage.module.css";
import { Icon } from '@zohodesk/icons';
export default class ValidationMessage extends React.Component {
  render() {
    let {
      palette,
      text,
      htmlFor,
      onClick,
      type,
      size,
      dataId,
      clipped,
      a11y,
      tooltip,
      dataSelectorId
    } = this.props;
    let {
      role = 'alert'
    } = a11y;
    return /*#__PURE__*/React.createElement("div", {
      role: role,
      onClick: onClick,
      className: `${type === 'primary' ? style.primary : style.secondary}`,
      "data-id": "errorMsgContainer",
      "data-test-id": "errorMsgContainer",
      "data-selector-id": dataSelectorId
    }, /*#__PURE__*/React.createElement(Label, {
      text: text,
      htmlFor: htmlFor,
      palette: palette,
      size: size,
      dataId: dataId,
      clipped: clipped,
      title: clipped ? text : '',
      customClass: style.lable
    }), tooltip ? /*#__PURE__*/React.createElement("span", {
      className: `${style.icon} ${colors[palette]}`,
      "data-title": tooltip
    }, /*#__PURE__*/React.createElement(Icon, {
      name: "ZD-information57",
      size: "14"
    })) : null);
  }

}
ValidationMessage.propTypes = propTypes;
ValidationMessage.defaultProps = defaultProps; // if (__DOCS__) {
//   ValidationMessage.docs = {
//     componentGroup: 'Form Fields',
//     folderName: 'Style Guide'
//   };
// }