@exmg/exm-markdown-editor 1.0.0

package/src/exm-markdown-editor-toolbar-base.d.ts

@@ -0,0 +1,12 @@
+import { ToolbarIcons, ToolbarItem } from './types.js';
+import { ExmgElement } from '@exmg/lit-base/index.js';
+import '@material/web/iconbutton/icon-button.js';
+import '@material/web/icon/icon.js';
+export declare class MarkdownEditorToolbarBase extends ExmgElement {
+    upload: boolean;
+    actions: ToolbarItem[];
+    icons: ToolbarIcons;
+    renderActionButtons(): import("lit-html").TemplateResult<1>[];
+    action(action: string): void;
+    protected render(): import("lit-html").TemplateResult<1>;
+}

package/src/exm-markdown-editor-toolbar-base.js

@@ -0,0 +1,52 @@
+import { __decorate } from "tslib";
+import { html } from 'lit';
+import { toolbarActions } from './actions.js';
+import { toolbarIcons } from './icons.js';
+import { ExmgElement } from '@exmg/lit-base/index.js';
+import { property } from 'lit/decorators.js';
+import '@material/web/iconbutton/icon-button.js';
+import '@material/web/icon/icon.js';
+export class MarkdownEditorToolbarBase extends ExmgElement {
+    constructor() {
+        super(...arguments);
+        this.upload = false;
+        this.actions = toolbarActions;
+        this.icons = toolbarIcons;
+    }
+    renderActionButtons() {
+        const buttons = this.actions.map((button) => {
+            const displayedName = button.name.replace('_', '').toLocaleUpperCase();
+            return html ` <md-icon-button
+        aria-label=${displayedName}
+        title=${displayedName}
+        @click=${(e) => {
+                e.preventDefault();
+                this.action(button.name);
+            }}
+      >
+        <md-icon> ${this.icons[button.icon] ? this.icons[button.icon] : button.icon} </md-icon>
+      </md-icon-button>`;
+        });
+        return buttons;
+    }
+    action(action) {
+        if (action === 'image' && this.upload) {
+            this.fire('insert-image', undefined, true);
+            return;
+        }
+        this.fire('action', action, true);
+    }
+    render() {
+        return html ` <div class="toolbar-container">${this.renderActionButtons()}</div> `;
+    }
+}
+__decorate([
+    property({ type: Boolean })
+], MarkdownEditorToolbarBase.prototype, "upload", void 0);
+__decorate([
+    property({ type: Array })
+], MarkdownEditorToolbarBase.prototype, "actions", void 0);
+__decorate([
+    property({ type: Object })
+], MarkdownEditorToolbarBase.prototype, "icons", void 0);
+//# sourceMappingURL=exm-markdown-editor-toolbar-base.js.map

package/src/exm-markdown-editor-toolbar.d.ts

@@ -0,0 +1,9 @@
+import { MarkdownEditorToolbarBase } from './exm-markdown-editor-toolbar-base.js';
+export declare class MarkdownEditorToolbar extends MarkdownEditorToolbarBase {
+    static styles: import("lit").CSSResult[];
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        'exm-markdown-editor-toolbar': MarkdownEditorToolbar;
+    }
+}

package/src/exm-markdown-editor-toolbar.js

@@ -0,0 +1,12 @@
+import { __decorate } from "tslib";
+import { customElement } from 'lit/decorators.js';
+import { MarkdownEditorToolbarBase } from './exm-markdown-editor-toolbar-base.js';
+import { style as toolbarStyles } from './styles/exm-markdown-editor-toolbar-css.js';
+let MarkdownEditorToolbar = class MarkdownEditorToolbar extends MarkdownEditorToolbarBase {
+};
+MarkdownEditorToolbar.styles = [toolbarStyles];
+MarkdownEditorToolbar = __decorate([
+    customElement('exm-markdown-editor-toolbar')
+], MarkdownEditorToolbar);
+export { MarkdownEditorToolbar };
+//# sourceMappingURL=exm-markdown-editor-toolbar.js.map

package/src/exm-markdown-editor.d.ts

@@ -0,0 +1,76 @@
+import { MarkdownEditorElementBase } from './exm-markdown-editor-base.js';
+/**
+ * Markdown WYSIWYG editor element.
+ * This editor element is a wrapper element for the markdown-element which will enable editing
+ * the markdown data. See [marked-element](https://www.webcomponents.org/element/PolymerElements/marked-element/)
+ * for more details on how to use this element.
+ *
+ * ```
+ * <exm-markdown-editor markdown="# Header 1"></exm-markdown-editor>
+ * ```
+ *
+ * ## Custom Toolbar
+ * Add attribute toolbar-buttons to adjust the toolbar buttons. The array values should match
+ * the _toolbarButtons item name values.
+ *
+ * ```html
+ * <exm-markdown-editor toolbar-buttons='["strong","italic","strikethrough","|","quote","hr","table"]'></exm-markdown-editor>
+ * ```
+ *
+ * ### Styling
+ *
+ * The preview panel markdown output can be styled from outside th element. See the demo/styling.html example
+ * on how to do this. In this demo the github-markdown-css project is used for styling the html output.
+ *
+ * The HTML output will we inserted into the element slot and will have a container div arround it
+ * with the class preview-html:
+ *
+ * ```
+ * <exm-markdown-editor markdown="# Header 1">
+ *  <div class="preview-body"><h1>Header 1</h1></div>
+ * </exm-markdown-editor>
+ * ```
+ *
+ * `<exm-markdown-editor>` provides the following custom properties and mixins
+ *  for styling:
+ *
+ *  Custom property | Description | Default
+ *  ----------------|-------------|----------
+ *  `--exm-markdown-editor-border` | Border Color | `#ddd`
+ *  `--exm-markdown-editor-background-color` | Editor Background Color | `white`
+ *  `--exm-markdown-editor-fullscreen-top-offset` | Top offset in fullscreen mode | `0px`
+ *  `--exm-markdown-editor-toolbar-background` | Toolbar background color | `#fafafa`
+ *  `--exm-markdown-editor-toolbar-label-background` | Toolbar label background color | `#fafafa`
+ *  `--exm-markdown-editor-label-color` | Toolbar text color | `54% black`
+ *  `--exm-markdown-editor-toolbar-color` | Toolbar text color | `87% black`
+ *  `--exm-markdown-editor-toolbar-color-disabled` | Toolbar text color disabled | `54% black`
+ *  `--exm-markdown-editor-preview-background` | Preview background color | `white`
+ *  `--exm-markdown-editor-toolbar-button-background-hover` | Toolbar icon border color | `#fafafa`
+ *  `--exm-markdown-editor-toolbar-seperator-color` | Toolbar seperator color | `#ddd`
+ *  `--exm-markdown-editor-code-hover` | Editor code part hover background color | `white`
+ *  `--exm-markdown-editor-code-color` | Editor code color | `black`
+ *  `--exm-markdown-editor-code-background` | Editor code background | `white`
+ *
+ *  # Events:
+ *  - value-change - where detail is current markdown value
+ *  - exm-markdown-editor-fullscreen where detail is boolean with current fullscreen state
+ *  - exm-markdown-editor-paste-table thrown when app should display a dialog to paste Excel Table
+ *  - exm-markdown-editor-image-open when image-ext button is clicked. Can be used to insert external images
+ *
+ * @customElement
+ * @group Exmg Core Elements
+ * @element exm-markdown-editor
+ * @demo demo/index.html
+ * @memberof Exmg
+ * @extends ExmgElement
+ * @summary Markdown editor element
+ */
+export declare class MarkdownEditorElement extends MarkdownEditorElementBase {
+    static styles: import("lit").CSSResult[];
+    getPreviewElement(): Element | null;
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        'exm-markdown-editor': MarkdownEditorElement;
+    }
+}

package/src/exm-markdown-editor.js

@@ -0,0 +1,83 @@
+import { __decorate } from "tslib";
+import { customElement } from 'lit/decorators.js';
+import { MarkdownEditorElementBase } from './exm-markdown-editor-base.js';
+import { style as codeMirrorStyles } from './styles/exm-markdown-codemirror-css.js';
+import { style as markdownEditorStyles } from './styles/exm-markdown-editor-css.js';
+/**
+ * Markdown WYSIWYG editor element.
+ * This editor element is a wrapper element for the markdown-element which will enable editing
+ * the markdown data. See [marked-element](https://www.webcomponents.org/element/PolymerElements/marked-element/)
+ * for more details on how to use this element.
+ *
+ * ```
+ * <exm-markdown-editor markdown="# Header 1"></exm-markdown-editor>
+ * ```
+ *
+ * ## Custom Toolbar
+ * Add attribute toolbar-buttons to adjust the toolbar buttons. The array values should match
+ * the _toolbarButtons item name values.
+ *
+ * ```html
+ * <exm-markdown-editor toolbar-buttons='["strong","italic","strikethrough","|","quote","hr","table"]'></exm-markdown-editor>
+ * ```
+ *
+ * ### Styling
+ *
+ * The preview panel markdown output can be styled from outside th element. See the demo/styling.html example
+ * on how to do this. In this demo the github-markdown-css project is used for styling the html output.
+ *
+ * The HTML output will we inserted into the element slot and will have a container div arround it
+ * with the class preview-html:
+ *
+ * ```
+ * <exm-markdown-editor markdown="# Header 1">
+ *  <div class="preview-body"><h1>Header 1</h1></div>
+ * </exm-markdown-editor>
+ * ```
+ *
+ * `<exm-markdown-editor>` provides the following custom properties and mixins
+ *  for styling:
+ *
+ *  Custom property | Description | Default
+ *  ----------------|-------------|----------
+ *  `--exm-markdown-editor-border` | Border Color | `#ddd`
+ *  `--exm-markdown-editor-background-color` | Editor Background Color | `white`
+ *  `--exm-markdown-editor-fullscreen-top-offset` | Top offset in fullscreen mode | `0px`
+ *  `--exm-markdown-editor-toolbar-background` | Toolbar background color | `#fafafa`
+ *  `--exm-markdown-editor-toolbar-label-background` | Toolbar label background color | `#fafafa`
+ *  `--exm-markdown-editor-label-color` | Toolbar text color | `54% black`
+ *  `--exm-markdown-editor-toolbar-color` | Toolbar text color | `87% black`
+ *  `--exm-markdown-editor-toolbar-color-disabled` | Toolbar text color disabled | `54% black`
+ *  `--exm-markdown-editor-preview-background` | Preview background color | `white`
+ *  `--exm-markdown-editor-toolbar-button-background-hover` | Toolbar icon border color | `#fafafa`
+ *  `--exm-markdown-editor-toolbar-seperator-color` | Toolbar seperator color | `#ddd`
+ *  `--exm-markdown-editor-code-hover` | Editor code part hover background color | `white`
+ *  `--exm-markdown-editor-code-color` | Editor code color | `black`
+ *  `--exm-markdown-editor-code-background` | Editor code background | `white`
+ *
+ *  # Events:
+ *  - value-change - where detail is current markdown value
+ *  - exm-markdown-editor-fullscreen where detail is boolean with current fullscreen state
+ *  - exm-markdown-editor-paste-table thrown when app should display a dialog to paste Excel Table
+ *  - exm-markdown-editor-image-open when image-ext button is clicked. Can be used to insert external images
+ *
+ * @customElement
+ * @group Exmg Core Elements
+ * @element exm-markdown-editor
+ * @demo demo/index.html
+ * @memberof Exmg
+ * @extends ExmgElement
+ * @summary Markdown editor element
+ */
+let MarkdownEditorElement = class MarkdownEditorElement extends MarkdownEditorElementBase {
+    getPreviewElement() {
+        const slot = this.querySelector('*[slot=preview]');
+        return slot ? slot : this.shadowRoot.querySelector('#preview');
+    }
+};
+MarkdownEditorElement.styles = [markdownEditorStyles, codeMirrorStyles];
+MarkdownEditorElement = __decorate([
+    customElement('exm-markdown-editor')
+], MarkdownEditorElement);
+export { MarkdownEditorElement };
+//# sourceMappingURL=exm-markdown-editor.js.map

package/src/icons.d.ts

@@ -0,0 +1,6 @@
+export declare const toolbarIcons: {
+    headerone: import("lit-html").TemplateResult<1>;
+    headertwo: import("lit-html").TemplateResult<1>;
+    headerthree: import("lit-html").TemplateResult<1>;
+    hr: import("lit-html").TemplateResult<1>;
+};

package/src/icons.js

@@ -0,0 +1,28 @@
+import { html } from 'lit';
+export const toolbarIcons = {
+    headerone: html `<svg>
+    <g id="header-one">
+      <path
+        d="M11.5 13H5v5a1.5 1.5 0 0 1-3 0V5a1.5 1.5 0 0 1 3 0v5h6.5V5a1.5 1.5 0 0 1 3 0v13a1.5 1.5 0 0 1-3 0v-5zm8.5 6h-1.2v-6.535l-1.8.627v-1.046L19.82 11H20v8z"
+      />
+    </g>
+  </svg>`,
+    headertwo: html `<svg>
+    <g id="header-two">
+      <path
+        d="M11.5 13H5v5a1.5 1.5 0 0 1-3 0V5a1.5 1.5 0 0 1 3 0v5h6.5V5a1.5 1.5 0 0 1 3 0v13a1.5 1.5 0 0 1-3 0v-5zm7.142 4.948H22V19h-4.87v-.917l2.353-2.8c.203-.234.367-.45.497-.634a3.77 3.77 0 0 0 .316-.51c.079-.154.13-.296.163-.431a1.762 1.762 0 0 0-.028-.898 1.244 1.244 0 0 0-.209-.4.967.967 0 0 0-.333-.265 1.057 1.057 0 0 0-.457-.093c-.203 0-.39.037-.541.111a1.074 1.074 0 0 0-.384.302c-.096.129-.175.283-.226.461a2.298 2.298 0 0 0-.073.536H17c.006-.327.056-.634.158-.924.107-.307.265-.572.474-.8a2.14 2.14 0 0 1 .768-.541A2.66 2.66 0 0 1 19.444 11c.36 0 .682.05.97.148.277.104.52.246.711.437.192.184.339.412.44.683.102.27.153.572.153.898 0 .24-.034.486-.107.726-.074.24-.175.48-.305.72s-.282.48-.463.72c-.18.24-.372.486-.587.726l-1.614 1.89z"
+      />
+    </g>
+  </svg>`,
+    headerthree: html `<svg>
+    <g id="header-three">
+      <path
+        d="M11.5 13H5v5a1.5 1.5 0 0 1-3 0V5a1.5 1.5 0 0 1 3 0v5h6.5V5a1.5 1.5 0 0 1 3 0v13a1.5 1.5 0 0 1-3 0v-5zm9.815 2.217c.165.125.292.269.393.427.102.164.171.335.222.499.045.184.07.374.07.565 0 .361-.063.69-.19.972a1.997 1.997 0 0 1-.533.722 2.185 2.185 0 0 1-.8.447c-.31.098-.64.151-1.002.151-.33 0-.641-.046-.94-.138a2.334 2.334 0 0 1-.786-.414 1.982 1.982 0 0 1-.546-.69 2.158 2.158 0 0 1-.203-.952h1.263c0 .171.031.329.089.473.057.145.14.263.247.368.108.105.235.184.387.236a1.4 1.4 0 0 0 .508.086c.387 0 .698-.105.92-.322.222-.217.336-.525.336-.933a1.55 1.55 0 0 0-.102-.571 1 1 0 0 0-.279-.4 1.174 1.174 0 0 0-.438-.23 2.212 2.212 0 0 0-.577-.073h-.749V14.41h.743c.215 0 .406-.026.564-.086.16-.059.292-.137.4-.243a.966.966 0 0 0 .241-.374c.051-.144.076-.309.076-.486 0-.374-.088-.663-.279-.867-.19-.204-.476-.309-.863-.309-.171 0-.323.027-.463.08-.14.052-.26.124-.368.216a.998.998 0 0 0-.241.341 1.127 1.127 0 0 0-.089.454H17.07c0-.302.057-.591.184-.848.114-.262.285-.486.495-.676.21-.19.463-.342.761-.453.292-.105.616-.158.965-.158.355 0 .685.046.97.131.299.092.552.237.762.42.216.191.38.421.495.697.12.276.177.598.177.959 0 .158-.019.322-.07.48-.044.164-.12.315-.215.466a2.005 2.005 0 0 1-.87.748c.235.086.432.191.59.316z"
+      />
+    </g>
+  </svg>`,
+    hr: html `<svg>
+    <g id="trending-flat"><path d="M22 14h18v-2H3v2z"></path></g>
+  </svg>`,
+};
+//# sourceMappingURL=icons.js.map

package/src/styles/exm-markdown-codemirror-css.d.ts

@@ -0,0 +1,2 @@
+export declare const style: import("lit").CSSResult;
+export default style;

package/src/styles/exm-markdown-codemirror-css.js

@@ -0,0 +1,4 @@
+import { css } from 'lit';
+export const style = css `.CodeMirror{--editor-code-color: var(--exm-markdown-editor-code-color, var(--md-sys-color-on-surface));--editor-code-cursor-color: var(--exm-markdown-editor-code-cursor-color, var(--md-sys-color-on-surface));--editor-code-header-color: var(--exm-markdown-editor-code-header-color, #4a8fc0);--editor-code-inline-code-color: var(--exm-markdown-editor-code-inline-code-color, #ea881f);--editor-code-list-color: var(--exm-markdown-editor-code-list-color, rgb(25, 165, 28));--editor-selected-code-color: var(--exm-markdown-editor-selected-code-color, rgb(140, 140, 140));color:var(--editor-code-color, var(--md-sys-color-on-surface, black));direction:ltr}.CodeMirror-lines{padding:0}.CodeMirror pre{padding:0 1rem}.CodeMirror-scrollbar-filler,.CodeMirror-gutter-filler{background-color:#fff}.CodeMirror-gutters{border-right:1px solid #ddd;background-color:#f7f7f7;white-space:nowrap}.CodeMirror-linenumber{padding:0 3px 0 5px;min-width:20px;text-align:right;color:#999;white-space:nowrap}.CodeMirror-guttermarker{color:#000}.CodeMirror-guttermarker-subtle{color:#999}.CodeMirror-cursor{border-left:1px solid var(--editor-code-cursor-color, var(--md-sys-color-on-surface, black))}.CodeMirror div.CodeMirror-secondarycursor{border-left:1px solid silver}.cm-fat-cursor .CodeMirror-cursor{width:auto;border:0 !important;background:#7e7}.cm-fat-cursor div.CodeMirror-cursors{z-index:1}.cm-fat-cursor-mark{background-color:rgba(20,255,20,.5);-webkit-animation:blink 1.06s steps(1) infinite;-moz-animation:blink 1.06s steps(1) infinite;animation:blink 1.06s steps(1) infinite}.cm-animate-fat-cursor{width:auto;border:0;-webkit-animation:blink 1.06s steps(1) infinite;-moz-animation:blink 1.06s steps(1) infinite;animation:blink 1.06s steps(1) infinite;background-color:#7e7}@-moz-keyframes blink{50%{background-color:rgba(0,0,0,0)}}@-webkit-keyframes blink{50%{background-color:rgba(0,0,0,0)}}@keyframes blink{50%{background-color:rgba(0,0,0,0)}}.cm-tab{display:inline-block;text-decoration:inherit}.CodeMirror-rulers{position:absolute;left:0;right:0;top:-50px;bottom:-20px;overflow:hidden}.CodeMirror-ruler{border-left:1px solid #ccc;top:0;bottom:0;position:absolute}.cm-s-default .cm-header{color:var(--editor-code-header-color)}.cm-s-default .cm-quote{color:var(--editor-code-quote-color)}.cm-negative{color:#d44}.cm-positive{color:#292}.cm-header,.cm-strong{font-weight:bold}.cm-em{font-style:italic}.cm-link{text-decoration:underline}.cm-strikethrough{text-decoration:line-through}.cm-s-default .cm-keyword{color:#708}.cm-s-default .cm-atom{color:#219}.cm-s-default .cm-number{color:var(--editor-code-list-color)}.cm-s-default .cm-def{color:blue}.cm-s-default .cm-variable-2{color:var(--editor-code-list-color)}.cm-s-default .cm-variable-3,.cm-s-default .cm-type{color:var(--editor-code-list-color)}.cm-s-default .cm-comment{color:#a50}.cm-s-default .cm-string{color:#a11}.cm-s-default .cm-string-2{color:var(--editor-code-inline-code-color, #f50)}.cm-s-default .cm-meta{color:#555}.cm-s-default .cm-qualifier{color:#555}.cm-s-default .cm-builtin{color:#30a}.cm-s-default .cm-bracket{color:#997}.cm-s-default .cm-tag{color:#170}.cm-s-default .cm-attribute{color:#00c}.cm-s-default .cm-hr{color:#999}.cm-s-default .cm-link{color:#00c}.cm-s-default .cm-error{color:red}.cm-invalidchar{color:red}.CodeMirror-composing{border-bottom:2px solid}div.CodeMirror span.CodeMirror-matchingbracket{color:#0b0}div.CodeMirror span.CodeMirror-nonmatchingbracket{color:#a22}.CodeMirror-matchingtag{background:rgba(255,150,0,.3)}.CodeMirror-activeline-background{background:#e8f2ff}.CodeMirror{position:relative;overflow:hidden}.CodeMirror-scroll{overflow:scroll !important;margin-bottom:-30px;margin-right:-30px;padding-bottom:30px;height:100%;outline:none;position:relative;box-sizing:border-box}.CodeMirror-sizer{position:relative;border-right:30px solid rgba(0,0,0,0)}.CodeMirror-vscrollbar,.CodeMirror-hscrollbar,.CodeMirror-scrollbar-filler,.CodeMirror-gutter-filler{position:absolute;z-index:6;display:none}.CodeMirror-vscrollbar{right:0;top:0;overflow-x:hidden;overflow-y:scroll}.CodeMirror-hscrollbar{bottom:0;left:0;overflow-y:hidden;overflow-x:scroll}.CodeMirror-scrollbar-filler{right:0;bottom:0}.CodeMirror-gutter-filler{left:0;bottom:0}.CodeMirror-gutters{position:absolute;left:0;top:0;min-height:100%;z-index:3}.CodeMirror-gutter{white-space:normal;height:100%;display:inline-block;vertical-align:top;margin-bottom:-30px}.CodeMirror-gutter-wrapper{position:absolute;z-index:4;background:none !important;border:none !important}.CodeMirror-gutter-background{position:absolute;top:0;bottom:0;z-index:4}.CodeMirror-gutter-elt{position:absolute;cursor:default;z-index:4}.CodeMirror-gutter-wrapper ::selection{background-color:rgba(0,0,0,0)}.CodeMirror-gutter-wrapper ::-moz-selection{background-color:rgba(0,0,0,0)}.CodeMirror-lines{cursor:text;min-height:1px}.CodeMirror pre{-moz-border-radius:0;-webkit-border-radius:0;border-radius:0;border-width:0;background:rgba(0,0,0,0);font-family:inherit;font-size:inherit;margin:0;white-space:pre;word-wrap:normal;line-height:inherit;color:inherit;z-index:2;position:relative;overflow:visible;-webkit-tap-highlight-color:rgba(0,0,0,0);-webkit-font-variant-ligatures:contextual;font-variant-ligatures:contextual}.CodeMirror-wrap pre{word-wrap:break-word;white-space:pre-wrap;word-break:normal}.CodeMirror-linebackground{position:absolute;left:0;right:0;top:0;bottom:0;z-index:0}.CodeMirror-linewidget{position:relative;z-index:2;padding:.1px}.CodeMirror-rtl pre{direction:rtl}.CodeMirror-code{outline:none}.CodeMirror-sizer,.CodeMirror-gutter,.CodeMirror-gutters,.CodeMirror-linenumber{-moz-box-sizing:content-box;box-sizing:content-box}.CodeMirror-measure{position:absolute;width:100%;height:0;overflow:hidden;visibility:hidden}.CodeMirror-cursor{position:absolute;pointer-events:none}.CodeMirror-measure pre{position:static}div.CodeMirror-cursors{visibility:hidden;position:relative;z-index:3}div.CodeMirror-dragcursors{visibility:visible}.CodeMirror-focused div.CodeMirror-cursors{visibility:visible}.CodeMirror-selected{background:#d9d9d9}.CodeMirror-focused .CodeMirror-selected{background:var(--editor-selected-code-color)}.CodeMirror-crosshair{cursor:crosshair}.CodeMirror-line::selection,.CodeMirror-line>span::selection,.CodeMirror-line>span>span::selection{background:#d7d4f0}.CodeMirror-line::-moz-selection,.CodeMirror-line>span::-moz-selection,.CodeMirror-line>span>span::-moz-selection{background:#d7d4f0}.cm-searching{background-color:#ffa;background-color:rgba(255,255,0,.4)}.cm-force-border{padding-right:.1px}@media print{.CodeMirror div.CodeMirror-cursors{visibility:hidden}}.cm-tab-wrap-hack:after{content:""}span.CodeMirror-selectedtext{background:none}`;
+export default style;
+//# sourceMappingURL=exm-markdown-codemirror-css.js.map