import _defineProperty from "@babel/runtime/helpers/defineProperty";

function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }

function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }

import makeStyles from "../../../ui/styles/makeStyles";
var getClasses = makeStyles(function (_ref) {
  var _ref$cleverUI = _ref.cleverUI,
      spaces = _ref$cleverUI.spaces,
      colors = _ref$cleverUI.colors,
      shadows = _ref$cleverUI.shadows,
      typography = _ref$cleverUI.typography;
  return {
    divider: {
      margin: "".concat(spaces.md, " 0"),
      backgroundColor: colors.neutral[200]
    },
    tab: {
      paddingTop: "24px"
    },
    syncContainer: {
      position: "absolute",
      top: "170px",
      left: "50%",
      transform: "translateX(-50%)",
      zIndex: "1",
      borderRadius: spaces.lg,
      padding: "".concat(spaces.sm, " ").concat(spaces.md),
      backgroundColor: colors.neutral[100],
      border: "1px solid ".concat(colors.neutral[300]),
      boxShadow: shadows.normal,
      width: "max-content",
      maxWidth: "100%",
      "& > #ai-generated-add-assets-button": _objectSpread(_objectSpread({}, typography.variants.small), {}, {
        fontWeight: 600,
        textDecoration: "underline",
        textAlign: "center"
      }),
      "& > :not(p)": {
        flexShrink: 0
      }
    },
    select: {
      width: "100%"
    },
    squareImageContainer: {
      padding: 0,
      border: 0,
      lineHeight: 0,
      height: "fit-content",
      borderRadius: "6px",
      flexShrink: 0,
      "&[data-selected=true]": {
        outline: "3px solid ".concat(colors.blue[500])
      }
    },
    landscapeImageContainer: {
      padding: 0,
      border: 0,
      lineHeight: 0,
      height: "fit-content",
      borderRadius: "6px",
      flexShrink: 0,
      "&[data-selected=true]": {
        outline: "3px solid ".concat(colors.blue[500])
      }
    },
    squareImage: {
      aspectRatio: "1 / 1",
      maxHeight: "48px",
      boxSizing: "content-box",
      objectFit: "cover",
      borderRadius: "6px",
      "&[data-selected=true]": {
        outline: "3px solid ".concat(colors.blue[500]),
        opacity: "0.4"
      }
    },
    landscapeImage: {
      aspectRatio: "16 / 9",
      maxHeight: "48px",
      boxSizing: "content-box",
      objectFit: "cover",
      borderRadius: "6px",
      "&[data-selected=true]": {
        outline: "3px solid ".concat(colors.blue[500]),
        opacity: "0.4"
      }
    }
  };
});
export default getClasses;