// Copyright 1999-2023. Plesk International GmbH. All rights reserved.

import classNames from 'classnames';
import { CLS_PREFIX } from '../../constants';
import { jsx as _jsx } from "react/jsx-runtime";
import { jsxs as _jsxs } from "react/jsx-runtime";
/**
 * `Input` component is used for entering short text (like user name or email address).
 * @since 0.0.57
 */
const Input = _ref => {
  let {
    baseClassName = `${CLS_PREFIX}input`,
    className,
    size = 'md',
    type = 'text',
    textAlign,
    prefix,
    suffix,
    innerRef,
    rootProps,
    ...props
  } = _ref;
  const useSizeModifier = typeof size === 'string' && ['sm', 'md', 'lg', 'xl', 'fill'].indexOf(size) !== -1;
  return /*#__PURE__*/_jsxs("span", {
    className: classNames(baseClassName, {
      [`${baseClassName}--size-${size}`]: useSizeModifier,
      [`${baseClassName}--text-${textAlign}`]: textAlign,
      [`${baseClassName}--affix`]: prefix || suffix
    }, className),
    ...rootProps,
    children: [prefix && /*#__PURE__*/_jsx("span", {
      className: `${baseClassName}__prefix`,
      children: prefix
    }), /*#__PURE__*/_jsx("input", {
      ref: innerRef,
      type: type,
      size: typeof size === 'number' ? size : undefined,
      className: `${baseClassName}__input`,
      ...props
    }), suffix && /*#__PURE__*/_jsx("span", {
      className: `${baseClassName}__suffix`,
      children: suffix
    })]
  });
};
export default Input;