var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9, _templateObject10;
function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
import styled, { css } from 'styled-components';
import { IconButton as SfxIconButton, CrossButton as SfxCrossButton } from '@scaleflex/ui/core';
import { PC } from '@filerobot/common';
var Search = styled.div(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  min-width: ", ";\n  max-width: 550px;\n  flex-grow: 1;\n\n  ", "\n\n  ", "\n\n  ", "\n\n", "\n"])), function (_ref) {
  var fullWidth = _ref.fullWidth;
  return fullWidth ? 'auto' : 'fit-content';
}, function (_ref2) {
  var isSearchActive = _ref2.isSearchActive,
    searchInputFocused = _ref2.searchInputFocused,
    isDisabled = _ref2.isDisabled,
    palette = _ref2.theme.palette;
  return (isSearchActive || searchInputFocused) && !isDisabled && "\n    border: 1px solid ".concat(palette[PC.AccentStateless], ";\n  ");
}, function (_ref3) {
  var isDisabled = _ref3.isDisabled,
    palette = _ref3.theme.palette;
  return isDisabled && css(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n    border: 1px solid ", ";\n  "])), palette[PC.BordersSecondary]);
}, function (_ref4) {
  var breakpoints = _ref4.theme.breakpoints,
    floaty = _ref4.floaty;
  return css(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n      width: ", ";\n\n    ", " {\n      max-width: 520px;\n    }\n\n    ", " & {\n      max-width: 520px;\n    }\n\n    ", " & {\n      max-width: 520px;\n    }\n\n    ", " & {\n      max-width: 520px;\n    }\n"])), !floaty && '100%', breakpoints.down('lg'), breakpoints.classes.md, breakpoints.classes.sm, breakpoints.classes.xs);
}, function (_ref5) {
  var isSearchActive = _ref5.isSearchActive,
    floaty = _ref5.floaty,
    searchInputFocused = _ref5.searchInputFocused;
  if ((isSearchActive || searchInputFocused) && floaty) {
    return 'min-width: calc(100% - 62px)';
  }
  if (isSearchActive && !floaty || searchInputFocused) {
    return {
      'min-width': 'calc(100% - 104px)'
    };
  }
});
var SearchInputWrapper = styled.div(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n  padding: 0 24px 0 3px;\n"])));
var SearchInput = styled.input(_templateObject5 || (_templateObject5 = _taggedTemplateLiteral(["\n  border: none;\n  min-width: ", ";\n\n  ", ";\n"])), function (_ref6) {
  var isFilterQueryState = _ref6.isFilterQueryState;
  return isFilterQueryState ? '24px' : 'max-content';
}, function (_ref7) {
  var isDisabled = _ref7.isDisabled;
  return isDisabled && css(_templateObject6 || (_templateObject6 = _taggedTemplateLiteral(["\n      color: ", ";\n      pointer-events: none;\n  "])), function (_ref8) {
    var palette = _ref8.theme.palette;
    return palette[PC.BordersDisabled];
  });
});
var SearchIconButton = styled(SfxIconButton)(_templateObject7 || (_templateObject7 = _taggedTemplateLiteral(["\n  border-top-left-radius: 0px;\n  border-bottom-left-radius: 0px;\n  background-color: ", ";\n\n  & svg {\n    animation: ", " ;\n  }\n\n  &:hover {\n    background-color: ", ";\n  }\n  cursor: ", " ;\n"])), function (_ref9) {
  var isLoading = _ref9.isLoading,
    palette = _ref9.theme.palette;
  return isLoading && palette[PC.AccentPrimaryActive];
}, function (_ref10) {
  var isLoading = _ref10.isLoading;
  return isLoading ? 'rotating-spinner 2s linear infinite' : '';
}, function (_ref11) {
  var isLoading = _ref11.isLoading,
    palette = _ref11.theme.palette;
  return isLoading && palette[PC.AccentPrimaryActive];
}, function (_ref12) {
  var isLoading = _ref12.isLoading;
  return isLoading ? 'auto' : 'pointer';
});
var CrossButton = styled(SfxCrossButton)(_templateObject8 || (_templateObject8 = _taggedTemplateLiteral(["\n  margin-right: 4px;\n  position: relative;\n  z-index: 1000;\n\n  ", ";\n"])), function (_ref13) {
  var isDisabled = _ref13.isDisabled;
  return isDisabled && css(_templateObject9 || (_templateObject9 = _taggedTemplateLiteral(["\n      color: ", ";\n      pointer-events: none;\n  "])), function (_ref14) {
    var palette = _ref14.theme.palette;
    return palette[PC.BordersDisabled];
  });
});
var Separator = styled.span(_templateObject10 || (_templateObject10 = _taggedTemplateLiteral(["\n  display: inline-block;\n  width: 1px;\n  height: calc(100% - 16px);\n  margin: ", ";\n  background: ", ";\n"])), function (_ref15) {
  var _ref15$mr = _ref15.mr,
    mr = _ref15$mr === void 0 ? 6 : _ref15$mr,
    _ref15$ml = _ref15.ml,
    ml = _ref15$ml === void 0 ? 6 : _ref15$ml;
  return "0 ".concat(mr, "px 0 ").concat(ml, "px");
}, function (_ref16) {
  var theme = _ref16.theme;
  return theme.palette[PC.BorderPrimaryStateless];
});
var Styled = {
  Search: Search,
  SearchInput: SearchInput,
  SearchIconButton: SearchIconButton,
  CrossButton: CrossButton,
  Separator: Separator,
  SearchInputWrapper: SearchInputWrapper
};
export default Styled;