"use strict";

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

exports.__esModule = true;
exports.BrandListSearch = void 0;

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

var _react = _interopRequireDefault(require("react"));

var _styledComponents = _interopRequireDefault(require("styled-components"));

var _Common = require("../../../Common");

var _templateObject, _templateObject2, _templateObject3, _templateObject4;

var BrandListSearch = function BrandListSearch(_ref) {
  var query = _ref.query,
      setQuery = _ref.setQuery,
      title = _ref.title;
  return /*#__PURE__*/_react["default"].createElement(Label, null, /*#__PURE__*/_react["default"].createElement(Title, null, title), /*#__PURE__*/_react["default"].createElement(InputWrapper, null, /*#__PURE__*/_react["default"].createElement(Input, {
    value: query,
    onChange: function onChange(e) {
      return setQuery(e.target.value);
    }
  }), /*#__PURE__*/_react["default"].createElement(_Common.Search, null)));
};

exports.BrandListSearch = BrandListSearch;

var Input = _styledComponents["default"].input.attrs({
  className: 'py-1'
})(_templateObject || (_templateObject = (0, _taggedTemplateLiteralLoose2["default"])(["\n  padding-left: 1rem;\n  padding-right: 4rem;\n  min-height: 4rem;\n\n  width: 100%;\n\n  border: 0.1rem solid ", ";\n"])), function (_ref2) {
  var theme = _ref2.theme;
  return theme.palette.light;
});

var InputWrapper = _styledComponents["default"].div.attrs({
  className: 'mb-4'
})(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteralLoose2["default"])(["\n  position: relative;\n\n  max-width: 40rem;\n\n  & > svg {\n    position: absolute;\n    opacity: 0.6;\n    right: 1.3rem;\n    top: 0.8rem;\n    width: 1.6rem;\n    pointer-events: none;\n  }\n"])));

var Label = _styledComponents["default"].label.attrs({
  className: 'd-block pb-2 mt-4 mt-lg-0'
})(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteralLoose2["default"])([""])));

var Title = (0, _styledComponents["default"])(_Common.Typography).attrs({
  as: 'h3',
  variant: '4',
  className: 'mb-2'
})(_templateObject4 || (_templateObject4 = (0, _taggedTemplateLiteralLoose2["default"])(["\n  font-size: 2.4rem;\n  line-height: 1.6667;\n"])));
//# sourceMappingURL=index.js.map