import { extends as _extends } from '../../../../../_virtual/_rollupPluginBabelHelpers.js';
import { jsx } from '@emotion/core';
import { forwardRef } from 'react';
import { baseInputCss } from '../../styles/index.esm.js';

var StyledInput = forwardRef(function InputFieldControl(props, ref) {
  var placeholder = props.placeholder && props.disabled ? "The field is disabled" : props.placeholder;

  var baseCss = function baseCss(theme) {
    return [baseInputCss(theme), {
      width: "auto"
    }];
  };

  return jsx("input", _extends({
    ref: ref,
    css: baseCss
  }, props, {
    placeholder: placeholder
  }));
});
StyledInput.__docgenInfo = {
  "description": "",
  "methods": [],
  "displayName": "StyledInput"
};

if (typeof STORYBOOK_REACT_CLASSES !== "undefined") {
  STORYBOOK_REACT_CLASSES["src/components/form/components/styled-primitives/StyledInput.tsx"] = {
    name: "StyledInput",
    docgenInfo: StyledInput.__docgenInfo,
    path: "src/components/form/components/styled-primitives/StyledInput.tsx"
  };
}

export { StyledInput };
//# sourceMappingURL=StyledInput.esm.js.map
