"use strict";

var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.mediaAnnotationStyles = exports.blockAnnotationPrefix = exports.annotationSharedStyles = exports.annotationPrefix = exports.BlockAnnotationSharedClassNames = exports.AnnotationSharedClassNames = exports.AnnotationSharedCSSByState = void 0;
var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
var _react = require("@emotion/react");
var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
var _colors = require("@atlaskit/theme/colors");
var _styles = require("../../media/styles");
var _templateObject;
var annotationPrefix = exports.annotationPrefix = 'ak-editor-annotation';
var AnnotationSharedClassNames = exports.AnnotationSharedClassNames = {
  focus: "".concat(annotationPrefix, "-focus"),
  blur: "".concat(annotationPrefix, "-blur"),
  draft: "".concat(annotationPrefix, "-draft")
};
var blockAnnotationPrefix = exports.blockAnnotationPrefix = 'ak-editor-block-annotation';
var BlockAnnotationSharedClassNames = exports.BlockAnnotationSharedClassNames = {
  focus: "".concat(blockAnnotationPrefix, "-focus"),
  blur: "".concat(blockAnnotationPrefix, "-blur"),
  draft: "".concat(blockAnnotationPrefix, "-draft")
};
var mediaNodeDomRef = 'mediaView-content-wrap';
var Y75a = 'rgba(255, 240, 179, 0.5)';
var Y200a = 'rgba(255, 196, 0, 0.82)';
var AnnotationSharedCSSByState = exports.AnnotationSharedCSSByState = function AnnotationSharedCSSByState() {
  return (0, _platformFeatureFlags.getBooleanFF)('platform.editor.allow-inline-comments-for-inline-nodes') ? {
    focus: (0, _react.css)({
      background: "var(--ds-background-accent-yellow-subtler, ".concat(_colors.Y75, ")"),
      borderBottom: "2px solid ".concat("var(--ds-border-accent-yellow, ".concat(_colors.Y300, ")")),
      boxShadow: "var(--ds-shadow-overlay, ".concat("1px 2px 3px ".concat(_colors.N60A, ", -1px 2px 3px ").concat(_colors.N60A), ")"),
      cursor: 'pointer',
      '&:has(.card)': {
        fontSize: '1.5rem',
        lineHeight: '1.2rem',
        '& > *': {
          fontSize: '16px'
        }
      }
    }),
    blur: (0, _react.css)({
      background: "var(--ds-background-accent-yellow-subtlest, ".concat(Y75a, ")"),
      borderBottom: "2px solid ".concat("var(--ds-border-accent-yellow, ".concat(Y200a, ")")),
      cursor: 'pointer',
      '&:has(.card)': {
        fontSize: '1.5rem',
        lineHeight: '1.2rem',
        '& > *': {
          fontSize: '16px'
        }
      }
    })
  } : {
    focus: (0, _react.css)({
      // Background is not coming through in confluence, suspecting to be caused by some specific combination of
      // emotion and token look up
      background: "var(--ds-background-accent-yellow-subtler, ".concat(_colors.Y75, ")"),
      borderBottom: "2px solid ".concat("var(--ds-border-accent-yellow, ".concat(_colors.Y300, ")")),
      // TODO: https://product-fabric.atlassian.net/browse/DSP-4147
      boxShadow: "var(--ds-shadow-overlay, ".concat("1px 2px 3px ".concat(_colors.N60A, ", -1px 2px 3px ").concat(_colors.N60A), ")"),
      cursor: 'pointer'
    }),
    blur: (0, _react.css)({
      background: "var(--ds-background-accent-yellow-subtlest, ".concat(Y75a, ")"),
      borderBottom: "2px solid ".concat("var(--ds-border-accent-yellow, ".concat(Y200a, ")")),
      cursor: 'pointer'
    })
  };
};

// eslint-disable-next-line @atlaskit/design-system/no-css-tagged-template-expression -- `AnnotationSharedCSSByState()` is not safe in object syntax
var annotationSharedStyles = exports.annotationSharedStyles = function annotationSharedStyles() {
  return (0, _react.css)(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  .ProseMirror {\n    .", " {\n      ", ";\n    }\n\n    .", " {\n      ", ";\n      cursor: initial;\n    }\n\n    .", " {\n      ", ";\n    }\n\n    // Styling for comments on media node\n    .", "[class*=ak-editor-block-annotation-] {\n      border-radius: 3px;\n    }\n\n    .", ".", " {\n      box-shadow: ", ";\n    }\n\n    .", ".", " {\n      box-shadow: ", ";\n    }\n\n    .", ".", " {\n      box-shadow: ", ";\n    }\n  }\n"])), AnnotationSharedClassNames.focus, AnnotationSharedCSSByState().focus, AnnotationSharedClassNames.draft, AnnotationSharedCSSByState().focus, AnnotationSharedClassNames.blur, AnnotationSharedCSSByState().blur, mediaNodeDomRef, mediaNodeDomRef, BlockAnnotationSharedClassNames.draft, (0, _styles.commentStatusStyleMap)('draft'), mediaNodeDomRef, BlockAnnotationSharedClassNames.focus, (0, _styles.commentStatusStyleMap)('focus'), mediaNodeDomRef, BlockAnnotationSharedClassNames.blur, (0, _styles.commentStatusStyleMap)('blur'));
};
var mediaAnnotationStyles = exports.mediaAnnotationStyles = (0, _react.css)({
  boxShadow: "5px 5px ".concat("var(--ds-background-accent-yellow-subtler, ".concat(Y75a, ")")),
  borderRadius: '3px'
});