var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9, _templateObject10, _templateObject11, _templateObject12, _templateObject13, _templateObject14;
function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
import { FV, PC } from '@filerobot/common';
import { Button } from '@scaleflex/ui/core';
import styled, { css } from 'styled-components';
var UploadBarWrapper = styled.div(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  position: relative;\n  transform: ", ";\n  transition: transform 150ms ease-out;\n"])), function (_ref) {
  var isHidden = _ref.isHidden;
  return isHidden && 'translateY(100px)';
});
var UploadBar = styled.div(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n  display: flex;\n  justify-content: space-between;\n  flex-direction: row-reverse;\n  align-items: center;\n  position: relative;\n  z-index: 5;\n  width: 100%;\n  padding: 0 24px;\n  border-top: 1px solid ", ";\n  background-color: ", ";\n  height: 96px;\n\n  ", "\n"])), function (_ref2) {
  var theme = _ref2.theme;
  return theme.palette[PC.BordersSecondary];
}, function (_ref3) {
  var theme = _ref3.theme;
  return theme.palette[PC.BackgroundSecondary];
}, function (_ref4) {
  var breakpoints = _ref4.theme.breakpoints;
  return css(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n    ", " {\n      height: 72px;\n    }\n\n    ", " & {\n      height: 72px;\n    }\n\n    ", " & {\n      height: 72px;\n    }\n\n    ", " & {\n      height: 72px;\n    }\n\n    ", " & {\n      height: 72px;\n    }\n  "])), breakpoints.between('xs', 'lg'), breakpoints.classes.lg, breakpoints.classes.md, breakpoints.classes.sm, breakpoints.classes.xs);
});
var SecondaryButtonsWrapper = styled.div(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n  display: flex;\n  align-items: center;\n  column-gap: 12px;\n"])));
var ActionWrapper = styled.div(_templateObject5 || (_templateObject5 = _taggedTemplateLiteral(["\n  display: flex;\n  align-items: center;\n  column-gap: 12px;\n"])));
var ActionButton = styled(Button)(_templateObject6 || (_templateObject6 = _taggedTemplateLiteral(["\n  min-width:  ", ";\n  height: 48px;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n\n  .SfxButton-Label {\n    ", "\n  }\n\n  svg {\n    width: 18px;\n    height: 18px;\n\n    ", "\n\n    ", ";\n  }\n\n  ", "\n"])), function (_ref5) {
  var $backBtn = _ref5.$backBtn;
  return !$backBtn ? '120px' : 'auto';
}, function (_ref6) {
  var typography = _ref6.theme.typography;
  return typography.font[FV.ButtonLgEmphasis];
}, function (_ref7) {
  var palette = _ref7.theme.palette,
    $backBtn = _ref7.$backBtn;
  return !$backBtn && css(_templateObject7 || (_templateObject7 = _taggedTemplateLiteral(["\n      color: ", ";\n    "])), palette[PC.IconsInvert]);
}, function (_ref8) {
  var disabled = _ref8.disabled;
  return disabled && css(_templateObject8 || (_templateObject8 = _taggedTemplateLiteral(["\n      color: ", ";\n    "])), function (_ref9) {
    var palette = _ref9.theme.palette;
    return palette[PC.BordersDisabled];
  });
}, function (_ref10) {
  var _ref10$theme = _ref10.theme,
    breakpoints = _ref10$theme.breakpoints,
    typography = _ref10$theme.typography;
  return css(_templateObject9 || (_templateObject9 = _taggedTemplateLiteral(["\n    ", " {\n      height: 40px;\n\n      svg {\n        width: 16px;\n        height: 16px;\n\n        ", ";\n      }\n\n      .SfxButton-Label {\n        ", ";\n      }\n    }\n\n    ", " & {\n      height: 40px;\n\n\n      svg {\n        width: 16px;\n        height: 16px;\n\n        ", ";\n      }\n\n      .SfxButton-Label {\n        ", ";\n      }\n    }\n\n    ", " & {\n      height: 40px;\n\n      svg {\n        width: 16px;\n        height: 16px;\n\n        ", ";\n      }\n\n      .SfxButton-Label {\n        ", ";\n      }\n    }\n\n    ", " & {\n      height: 40px;\n\n      svg {\n        width: 16px;\n        height: 16px;\n\n        ", ";\n      }\n\n      .SfxButton-Label {\n        ", ";\n      }\n    }\n\n    ", " & {\n      height: 40px;\n\n      svg {\n        width: 16px;\n        height: 16px;\n\n        ", ";\n      }\n\n      .SfxButton-Label {\n        ", ";\n      };\n    }\n  "])), breakpoints.between('xs', 'lg'), function (_ref11) {
    var disabled = _ref11.disabled;
    return disabled && css(_templateObject10 || (_templateObject10 = _taggedTemplateLiteral(["\n          color: ", ";\n        "])), function (_ref12) {
      var palette = _ref12.theme.palette;
      return palette[PC.BordersDisabled];
    });
  }, typography.font[FV.ButtonMdEmphasis], breakpoints.classes.lg, function (_ref13) {
    var disabled = _ref13.disabled;
    return disabled && css(_templateObject11 || (_templateObject11 = _taggedTemplateLiteral(["\n          color: ", ";\n        "])), function (_ref14) {
      var palette = _ref14.theme.palette;
      return palette[PC.BordersDisabled];
    });
  }, typography.font[FV.ButtonMdEmphasis], breakpoints.classes.md, function (_ref15) {
    var disabled = _ref15.disabled;
    return disabled && css(_templateObject12 || (_templateObject12 = _taggedTemplateLiteral(["\n          color: ", ";\n        "])), function (_ref16) {
      var palette = _ref16.theme.palette;
      return palette[PC.BordersDisabled];
    });
  }, typography.font[FV.ButtonMdEmphasis], breakpoints.classes.sm, function (_ref17) {
    var disabled = _ref17.disabled;
    return disabled && css(_templateObject13 || (_templateObject13 = _taggedTemplateLiteral(["\n          color: ", ";\n        "])), function (_ref18) {
      var palette = _ref18.theme.palette;
      return palette[PC.BordersDisabled];
    });
  }, typography.font[FV.ButtonMdEmphasis], breakpoints.classes.xs, function (_ref19) {
    var disabled = _ref19.disabled;
    return disabled && css(_templateObject14 || (_templateObject14 = _taggedTemplateLiteral(["\n          color: ", ";\n        "])), function (_ref20) {
      var palette = _ref20.theme.palette;
      return palette[PC.BordersDisabled];
    });
  }, typography.font[FV.ButtonMdEmphasis]);
});
var Styled = {
  UploadBarWrapper: UploadBarWrapper,
  SecondaryButtonsWrapper: SecondaryButtonsWrapper,
  UploadBar: UploadBar,
  ActionWrapper: ActionWrapper,
  ActionButton: ActionButton
};
export default Styled;