@atlaskit/editor-core/dist/cjs/ui/EditorContentContainer/styles/selectionStyles.js

A package contains Atlassian editor core functionality

"use strict";

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.selectedNodeStyles = exports.hideSelectionStyles = exports.hideNativeBrowserTextSelectionStyles = exports.hideCursorWhenHideSelectionStyles = exports.dangerBorderStyles = exports.dangerBackgroundStyles = exports.boxShadowSelectionStyles = exports.borderSelectionStyles = exports.blanketSelectionStyles = exports.backgroundSelectionStyles = void 0;
var _react = require("@emotion/react");
/* eslint-disable @atlaskit/ui-styling-standard/use-compiled */

// TODO: ED-28075 - refactor selection styles to unblock Compiled CSS migration
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-exported-styles
var hideNativeBrowserTextSelectionStyles = exports.hideNativeBrowserTextSelectionStyles = (0, _react.css)({
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
  '&::selection,*::selection': {
    backgroundColor: 'transparent'
  },
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors,@atlaskit/ui-styling-standard/no-unsafe-selectors
  '&::-moz-selection,*::-moz-selection': {
    backgroundColor: 'transparent'
  }
});

// TODO: ED-28075 - refactor selection styles to unblock Compiled CSS migration
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-exported-styles
var borderSelectionStyles = exports.borderSelectionStyles = (0, _react.css)({
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values,@atlaskit/ui-styling-standard/no-unsafe-values
  border: "1px solid ".concat("var(--ds-border-selected, #1868DB)"),
  // Fixes ED-15246: Trello card is visible through a border of a table border
  '&::after': {
    height: '100%',
    content: "'\\00a0'",
    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values,@atlaskit/ui-styling-standard/no-unsafe-values
    background: "var(--ds-border-selected, #1868DB)",
    position: 'absolute',
    right: -1,
    top: 0,
    bottom: 0,
    width: 1,
    border: 'none',
    display: 'inline-block'
  }
});

// TODO: ED-28075 - refactor selection styles to unblock Compiled CSS migration
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-exported-styles
var boxShadowSelectionStyles = exports.boxShadowSelectionStyles = (0, _react.css)({
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values,@atlaskit/ui-styling-standard/no-unsafe-values
  boxShadow: "0 0 0 1px ".concat("var(--ds-border-selected, #1868DB)"),
  borderColor: 'transparent'
});

// TODO: ED-28075 - refactor selection styles to unblock Compiled CSS migration
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-exported-styles
var backgroundSelectionStyles = exports.backgroundSelectionStyles = (0, _react.css)({
  backgroundColor: "var(--ds-background-selected, #E9F2FE)"
});

// TODO: ED-28075 - refactor selection styles to unblock Compiled CSS migration
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-exported-styles
var blanketSelectionStyles = exports.blanketSelectionStyles = (0, _react.css)({
  position: 'relative',
  // Fixes ED-9263, where emoji or inline card in panel makes selection go outside the panel
  // in Safari. Looks like it's caused by user-select: all in the emoji element
  WebkitUserSelect: 'text',
  '&::before': {
    position: 'absolute',
    content: "''",
    left: 0,
    right: 0,
    top: 0,
    bottom: 0,
    width: '100%',
    pointerEvents: 'none',
    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values,@atlaskit/ui-styling-standard/no-unsafe-values
    zIndex: 12,
    backgroundColor: "var(--ds-blanket-selected, #388BFF14)"
  }
});

// eslint-disable-next-line @atlaskit/ui-styling-standard/no-exported-styles
var hideSelectionStyles = exports.hideSelectionStyles = (0, _react.css)({
  // Hide selection styles for ProseMirror editor
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
  '.ProseMirror-hideselection': {
    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
    '*::selection': {
      background: 'transparent'
    },
    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors, @atlaskit/ui-styling-standard/no-unsafe-selectors
    '*::-moz-selection': {
      background: 'transparent'
    }
  }
});

/**
 * This prosemirror css style: https://github.com/ProseMirror/prosemirror-view/blob/f37ebb29befdbde3cd194fe13fe17b78e743d2f2/style/prosemirror.css#L24
 */
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-exported-styles
var hideCursorWhenHideSelectionStyles = exports.hideCursorWhenHideSelectionStyles = (0, _react.css)({
  // Hide cursor when hide selection styles are applied
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
  '.ProseMirror-hideselection': {
    caretColor: 'transparent'
  }
});

// eslint-disable-next-line @atlaskit/ui-styling-standard/no-exported-styles
var selectedNodeStyles = exports.selectedNodeStyles = (0, _react.css)({
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
  '.ProseMirror-selectednode': {
    outline: 'none'
  },
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
  '.ProseMirror-selectednode:empty': {
    outline: "2px solid ".concat("var(--ds-border-focused, #4688EC)")
  }
});

// eslint-disable-next-line @atlaskit/ui-styling-standard/no-exported-styles
var dangerBorderStyles = exports.dangerBorderStyles = (0, _react.css)({
  boxShadow: "0 0 0 1px ".concat("var(--ds-border-danger, #E2483D)")
});

// eslint-disable-next-line @atlaskit/ui-styling-standard/no-exported-styles
var dangerBackgroundStyles = exports.dangerBackgroundStyles = (0, _react.css)({
  backgroundColor: "var(--ds-background-danger, #FFECEB)"
});