@kiwicom/smart-faq/lib/SmartFAQ/common/Input.js

Smart FAQ

"use strict";

var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard");

var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.default = void 0;

var _style = _interopRequireDefault(require("styled-jsx/style"));

var React = _interopRequireWildcard(require("react"));

var _CloseCircle = _interopRequireDefault(require("@kiwicom/orbit-components/lib/icons/CloseCircle"));

// @flow
var InputText = function InputText(props
/*: Props*/
) {
  return React.createElement("div", {
    className: _style.default.dynamic([["1962172684", [props.error ? '#d02228' : '#bac7d5', props.icon ? 44 : 16, props.icon ? 54 : 16]]]) + " " + "wrapper"
  }, React.createElement("input", {
    type: props.type,
    name: props.name,
    value: props.value,
    placeholder: props.placeholder,
    onChange: props.onChange,
    onFocus: props.onFocus,
    required: props.required,
    "data-cy": props.dataCy,
    autoFocus: props.autoFocus,
    className: _style.default.dynamic([["1962172684", [props.error ? '#d02228' : '#bac7d5', props.icon ? 44 : 16, props.icon ? 54 : 16]]])
  }), props.icon && React.createElement("div", {
    className: _style.default.dynamic([["1962172684", [props.error ? '#d02228' : '#bac7d5', props.icon ? 44 : 16, props.icon ? 54 : 16]]]) + " " + "inputIcon"
  }, props.icon), props.onReset && React.createElement("button", {
    onClick: props.onReset,
    "data-cy": "btn-reset-input",
    className: _style.default.dynamic([["1962172684", [props.error ? '#d02228' : '#bac7d5', props.icon ? 44 : 16, props.icon ? 54 : 16]]])
  }, React.createElement(_CloseCircle.default, {
    size: "small",
    customColor: "#bac7d5"
  })), React.createElement(_style.default, {
    styleId: "1962172684",
    css: ".wrapper.__jsx-style-dynamic-selector{position:relative;}.inputIcon.__jsx-style-dynamic-selector{position:absolute;top:10px;left:12px;}button.__jsx-style-dynamic-selector{border:none;position:absolute;background-color:white;top:14px;right:16px;cursor:pointer;}input.__jsx-style-dynamic-selector{box-sizing:border-box;width:100%;height:44px;border-radius:3px;color:#46515e;background-color:white;border:solid 1px ".concat(props.error ? '#d02228' : '#bac7d5', ";font-size:16px;line-height:1.25;padding:12px 16px;padding-left:").concat(props.icon ? 44 : 16, "px;}input.__jsx-style-dynamic-selector::-webkit-input-placeholder{color:#bac7d5;}input.__jsx-style-dynamic-selector::-moz-placeholder{color:#bac7d5;}input.__jsx-style-dynamic-selector:-ms-input-placeholder{color:#bac7d5;}input.__jsx-style-dynamic-selector::placeholder{color:#bac7d5;}[dir='rtl'] input.__jsx-style-dynamic-selector{padding-left:0;padding-right:").concat(props.icon ? 54 : 16, "px;}"),
    dynamic: [props.error ? '#d02228' : '#bac7d5', props.icon ? 44 : 16, props.icon ? 54 : 16]
  }));
};

var _default = InputText;
exports.default = _default;