@atlaskit/editor-common
Version:
A package that contains common classes and components for editor and renderer
20 lines (19 loc) • 5.78 kB
JavaScript
import _taggedTemplateLiteral from "@babel/runtime/helpers/taggedTemplateLiteral";
var _templateObject;
// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
import { css, keyframes } from '@emotion/react';
var gapCursorBlink = keyframes({
'from, to': {
opacity: 0
},
'50%': {
opacity: 1
}
});
export var hideCaretModifier = 'ProseMirror-hide-gapcursor';
var gapCursor = '.ProseMirror-gapcursor';
var prosemirrorwidgetNotBlock = '.ProseMirror-widget:not([data-blocks-decoration-container="true"]):not([data-blocks-drag-handle-container="true"])';
var wrapLeft = '[layout="wrap-left"]';
var wrapRight = '[layout="wrap-right"]';
// eslint-disable-next-line @atlaskit/design-system/no-css-tagged-template-expression, @atlaskit/ui-styling-standard/no-exported-styles -- Ignored via go/DSP-18766, This needs manual remediation, it autofixes seemingly safely, but the code style and readability is destroyed.
export var gapCursorStyles = css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n\t/* =============== GAP CURSOR ================== */\n\t.ProseMirror {\n\t\t&.", " {\n\t\t\tcaret-color: transparent;\n\t\t}\n\n\t\t", " {\n\t\t\tdisplay: none;\n\t\t\tpointer-events: none;\n\t\t\tposition: relative;\n\n\t\t\t& span {\n\t\t\t\tcaret-color: transparent;\n\t\t\t\tposition: absolute;\n\t\t\t\theight: 100%;\n\t\t\t\twidth: 100%;\n\t\t\t\tdisplay: block;\n\t\t\t}\n\n\t\t\t& span::after {\n\t\t\t\tanimation: 1s ", " step-end infinite;\n\t\t\t\tborder-left: 1px solid;\n\t\t\t\tcontent: '';\n\t\t\t\tdisplay: block;\n\t\t\t\tposition: absolute;\n\t\t\t\ttop: 0;\n\t\t\t\theight: 100%;\n\t\t\t}\n\t\t\t&.-left span::after {\n\t\t\t\tleft: ", ";\n\t\t\t}\n\t\t\t&.-right span::after {\n\t\t\t\tright: ", ";\n\t\t\t}\n\t\t\t& span[layout='full-width'],\n\t\t\t& span[layout='wide'],\n\t\t\t& span[layout='fixed-width'] {\n\t\t\t\tmargin-left: 50%;\n\t\t\t\ttransform: translateX(-50%);\n\t\t\t}\n\t\t\t&", " {\n\t\t\t\tfloat: right;\n\t\t\t}\n\n\t\t\t/* fix vertical alignment of gap cursor */\n\t\t\t&:first-of-type + ul,\n\t\t\t&:first-of-type + span + ul,\n\t\t\t&:first-of-type + ol,\n\t\t\t&:first-of-type + span + ol,\n\t\t\t&:first-of-type + pre,\n\t\t\t&:first-of-type + span + pre,\n\t\t\t&:first-of-type + blockquote,\n\t\t\t&:first-of-type + span + blockquote {\n\t\t\t\tmargin-top: 0;\n\t\t\t}\n\t\t}\n\t\t&.ProseMirror-focused ", " {\n\t\t\tdisplay: block;\n\t\t\tborder-color: transparent;\n\t\t}\n\t}\n\n\t/* This hack below is for two images aligned side by side */\n\t", "", " + span + ", ",\n ", "", " + span + ", ",\n ", " + ", " + ", ",\n ", " + ", " + span + ", ",\n ", " + ", " + ", ",\n ", " + ", " + span + ", ",\n ", " + ", " + ", ",\n ", " + ", " + span ", ",\n ", " + ", " + ", ",\n ", " + ", " + span + ", ",\n ", " + ", " {\n\t\tclear: none;\n\t}\n\n\t", " + ", " + ", " > div,\n ", " + ", " + span + ", " > div,\n ", " + ", " + ", " > div,\n ", " + ", " + span + ", " > div,\n ", " + ", " + ", " > div,\n ", " + ", " + span + ", " > div,\n ", " + ", " + ", " > div,\n ", " + ", " + span + ", " > div {\n\t\tmargin-right: 0;\n\t\tmargin-left: 0;\n\t\tmargin-bottom: 0;\n\t}\n\n\t", " + ", ",\n ", " + ", " {\n\t\tfloat: left;\n\t}\n\n\t", " + ", " + span + ", "::after,\n ", " + ", " + span + ", "::after,\n ", " + ", " + ", "::after,\n ", " + ", " + span + ", "::after,\n ", " + ", " + ", "::after,\n ", " + ", " + span + ", "::after {\n\t\tvisibility: hidden;\n\t\tdisplay: block;\n\t\tfont-size: 0;\n\t\tcontent: ' ';\n\t\tclear: both;\n\t\theight: 0;\n\t}\n\n\t", " + ", " + ", " + *,\n ", " + ", " + ", " + span + *,\n ", " + ", " + ", " + *,\n ", " + ", " + ", " + span + *,\n ", " + ", " + span + ", " + *,\n ", " + ", " + span + ", " + *,\n ", " + ", " + span + ", " + *,\n ", " + ", " + span + ", " + *,\n ", " + ", " + ", " + * > *,\n ", " + ", " + ", " + span + * > *,\n ", " + ", " + ", " + * > *,\n ", " + ", " + ", " + span + * > *,\n ", " + ", " + span + ", " + * > *,\n ", " + ", " + span + ", " + * > *,\n ", " + ", " + span + ", " + * > *,\n ", " + ", " + span + ", " + * > *,\n ", " + ", " + *,\n ", " + ", " + span + * {\n\t\tmargin-top: 0;\n\t}\n"])), hideCaretModifier, gapCursor, gapCursorBlink, "var(--ds-space-negative-050, -4px)", "var(--ds-space-negative-050, -4px)", wrapRight, gapCursor, gapCursor, wrapLeft, wrapLeft, gapCursor, wrapRight, wrapRight, gapCursor, wrapLeft, wrapRight, gapCursor, wrapLeft, wrapRight, gapCursor, wrapRight, wrapLeft, gapCursor, wrapRight, wrapLeft, wrapLeft, gapCursor, wrapRight, wrapLeft, gapCursor, wrapRight, wrapRight, gapCursor, wrapLeft, wrapRight, gapCursor, wrapLeft, wrapLeft, gapCursor, wrapLeft, gapCursor, wrapRight, wrapLeft, gapCursor, wrapRight, wrapRight, gapCursor, wrapLeft, wrapRight, gapCursor, wrapLeft, gapCursor, wrapRight, wrapLeft, gapCursor, wrapRight, wrapLeft, gapCursor, wrapLeft, wrapRight, gapCursor, wrapLeft, wrapRight, wrapLeft, gapCursor, wrapRight, gapCursor, gapCursor, wrapLeft, wrapRight, gapCursor, wrapRight, wrapLeft, wrapLeft, gapCursor, wrapRight, wrapLeft, gapCursor, wrapRight, wrapRight, gapCursor, wrapLeft, wrapRight, gapCursor, wrapLeft, wrapLeft, gapCursor, wrapRight, wrapLeft, gapCursor, wrapRight, wrapRight, gapCursor, wrapLeft, wrapRight, gapCursor, wrapLeft, wrapLeft, gapCursor, wrapRight, wrapRight, gapCursor, wrapLeft, gapCursor, wrapLeft, wrapRight, gapCursor, wrapRight, wrapLeft, wrapLeft, gapCursor, wrapRight, wrapLeft, gapCursor, wrapRight, wrapRight, gapCursor, wrapLeft, wrapRight, gapCursor, wrapLeft, wrapLeft, gapCursor, wrapRight, wrapRight, gapCursor, wrapLeft, gapCursor, wrapLeft, wrapRight, gapCursor, wrapRight, wrapLeft, prosemirrorwidgetNotBlock, gapCursor, prosemirrorwidgetNotBlock, gapCursor);