@zohodesk/components/es/shared/InputFieldLine/InputFieldLine.js

Dot UI is a customizable React component library built to deliver a clean, accessible, and developer-friendly UI experience. It offers a growing set of reusable components designed to align with modern design systems and streamline application development

function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }

import React from 'react';
import propTypes from "./props/propTypes";
import defaultProps from "./props/defaultProps";
import Container from "../../Layout/Container";
import style from "./InputFieldLine.module.css";

function InputFieldLine(props) {
  const {
    isDisabled,
    isReadOnly,
    hasPadding,
    hasEffect,
    title,
    isActive,
    size,
    border,
    borderColor,
    dataId,
    onClick,
    customProps,
    customClass,
    children,
    onKeyDown,
    a11yAttributes,
    tagAttributes
  } = props;
  const borderClass = style[`border_${border}`] || '';
  const borderColorClass = style[`borderColor_${borderColor}`] || '';
  return /*#__PURE__*/React.createElement(Container, _extends({
    alignBox: "row",
    isCover: false
  }, tagAttributes, a11yAttributes, customProps, {
    "data-title": title,
    dataId: dataId,
    onClick: onClick,
    onKeyDown: onKeyDown,
    scroll: size != 'auto' ? 'vertical' : undefined,
    className: `${style.varClass} ${style.customContainer} ${size != 'auto' ? style[size] : ''} ${hasPadding && size != 'auto' ? style[`padding_${size}`] : ''} ${borderClass} ${isDisabled ? style.disabled : isReadOnly ? hasEffect ? style.effect : style.readonly : style.effect} ${border !== 'none' ? `${borderColorClass} ${style.hasBorder}` : ''} ${isActive && !(isDisabled || isReadOnly) ? style.active : ''}  ${customClass}`
  }), children);
}

InputFieldLine.propTypes = propTypes;
InputFieldLine.defaultProps = defaultProps;
export default InputFieldLine;