@onereach/ui-components 5.5.2-beta.3210.0 → 5.6.0

package/dist/bundled/v2/components/OrCode/OrCode.js

@@ -1,5 +1,5 @@
-import { E as EditorView, a as EditorState, k as keymap } from '../../index-51f352b6.js';
-import { b as basicSetup, i as indentWithTab } from '../../index-00991c6e.js';
+import { E as EditorView, a as EditorState, k as keymap } from '../../index-6617e2a7.js';
+import { b as basicSetup, i as indentWithTab } from '../../index-02646e58.js';
 import { u as useElementHover } from '../../index-509d77a1.js';
 import { defineComponent, ref } from 'vue-demi';
 import __vue_component__$3 from '../OrTeleport/OrTeleport.js';
@@ -231,7 +231,7 @@ var script = defineComponent({
   }
 });
 
-var css_248z = "@keyframes spinAround-data-v-3ea817b2{from{transform:rotate(0)}to{transform:rotate(359deg)}}@keyframes fade-data-v-3ea817b2{from{opacity:1}to{opacity:0}}.or-code .fullscreen-button[data-v-3ea817b2]{width:2.25rem;height:2.25rem}.or-code .fullscreen-button>.or-icon[data-v-3ea817b2]{font-size:1.5rem}.or-code .footer .or-code-error[data-v-3ea817b2],.or-code .footer .or-code-hint[data-v-3ea817b2]{flex-shrink:1;transition-timing-function:var(--t-func);transition-duration:var(--t-duration);transition-property:height,opacity}.header[data-v-3ea817b2]{display:flex;flex-direction:row;align-items:center;height:36px}.header .actions[data-v-3ea817b2]{margin-left:auto}.header .actions[data-v-3ea817b2]:not(.is-visible){display:none}.or-code-editor[data-v-3ea817b2]{min-height:calc(1.4em + 8px);overflow:auto;font-size:var(--fs-0);border:1px solid var(--c-neutral-2);border-radius:var(--s-2)}.or-code-editor.is-invalid[data-v-3ea817b2]{border-color:var(--c-error)}.or-code-editor[data-v-3ea817b2]> *{width:100%;height:100%}.or-code[data-v-3ea817b2],.or-modal[data-v-3ea817b2]  .content{display:flex;flex-direction:column}.or-code .or-code-editor[data-v-3ea817b2],.or-modal[data-v-3ea817b2]  .content .or-code-editor{text-align:left!important}.or-code .or-code-editor[data-v-3ea817b2],.or-modal[data-v-3ea817b2]  .content .or-code-editor{flex-grow:1}";
+var css_248z = "@keyframes spinAround-data-v-193dc43c{from{transform:rotate(0)}to{transform:rotate(359deg)}}@keyframes fade-data-v-193dc43c{from{opacity:1}to{opacity:0}}.or-code .fullscreen-button[data-v-193dc43c]{width:2.25rem;height:2.25rem}.or-code .fullscreen-button>.or-icon[data-v-193dc43c]{font-size:1.5rem}.or-code .footer .or-code-error[data-v-193dc43c],.or-code .footer .or-code-hint[data-v-193dc43c]{flex-shrink:1;transition-timing-function:var(--t-func);transition-duration:var(--t-duration);transition-property:height,opacity}.header[data-v-193dc43c]{display:flex;flex-direction:row;align-items:center;height:36px}.header .actions[data-v-193dc43c]{margin-left:auto}.header .actions[data-v-193dc43c]:not(.is-visible){display:none}.or-code-editor[data-v-193dc43c]{min-height:calc(1.4em + 8px);overflow:auto;font-size:var(--fs-0);border:1px solid var(--c-neutral-2);border-radius:var(--s-2)}.or-code-editor.is-invalid[data-v-193dc43c]{border-color:var(--c-error)}.or-code-editor[data-v-193dc43c]> *{width:100%;height:100%}.or-code[data-v-193dc43c],.or-modal[data-v-193dc43c]  .content{display:flex;flex-direction:column}.or-code .or-code-editor[data-v-193dc43c],.or-modal[data-v-193dc43c]  .content .or-code-editor{text-align:left!important}.or-code .or-code-editor[data-v-193dc43c],.or-modal[data-v-193dc43c]  .content .or-code-editor{flex-grow:1}";
 styleInject(css_248z);
 
 /* script */
@@ -335,7 +335,7 @@ var __vue_staticRenderFns__ = [];
 /* style */
 const __vue_inject_styles__ = undefined;
 /* scoped */
-const __vue_scope_id__ = "data-v-3ea817b2";
+const __vue_scope_id__ = "data-v-193dc43c";
 /* module identifier */
 const __vue_module_identifier__ = undefined;
 /* functional template */

package/dist/bundled/v2/components/OrCode/index.d.ts

@@ -1,2 +1,3 @@
 export { default as OrCode } from './OrCode.vue';
 export * from './constants';
+export * from './libs';

package/dist/bundled/v2/components/OrCode/index.js

@@ -1,2 +1,4 @@
 export { default as OrCode } from './OrCode.js';
 export { OrCodeLanguages } from './constants.js';
+export { b as basicSetup, a as lintGutter, l as linter } from '../../index-02646e58.js';
+export { h as html, j as javascript, a as json, b as jsonParseLinter } from '../../index-5915e78f.js';

package/dist/bundled/v2/components/OrCode/lang.js

@@ -1,4 +1,5 @@
-import { a as javascript, c as css, h as html, j as json, m as markdown } from '../../index-40a6d6e0.js';
+import { j as javascript, c as css, h as html, a as json } from '../../index-5915e78f.js';
+import { m as markdown } from '../../index-3d38888c.js';
 import { OrCodeLanguages } from './constants.js';
 
 const JS = javascript({

package/dist/bundled/v2/components/OrCode/libs.d.ts

@@ -0,0 +1,5 @@
+export { basicSetup } from 'codemirror';
+export { linter, lintGutter } from '@codemirror/lint';
+export { javascript } from '@codemirror/lang-javascript';
+export { json, jsonParseLinter } from '@codemirror/lang-json';
+export { html } from '@codemirror/lang-html';

package/dist/bundled/v2/components/OrCode/libs.js

@@ -0,0 +1,2 @@
+export { b as basicSetup, a as lintGutter, l as linter } from '../../index-02646e58.js';
+export { h as html, j as javascript, a as json, b as jsonParseLinter } from '../../index-5915e78f.js';

package/dist/bundled/v2/components/OrCode/theme.js

@@ -1,4 +1,4 @@
-import { E as EditorView, Z as HighlightStyle, _ as tags, L as syntaxHighlighting } from '../../index-51f352b6.js';
+import { E as EditorView, aq as HighlightStyle, ac as tags, X as syntaxHighlighting } from '../../index-6617e2a7.js';
 
 // Using https://github.com/one-dark/vscode-one-dark-theme/ as reference for the colors
 const chalky = 'var(--c-warning-darken-20)',

package/dist/bundled/v2/components/OrCodeV3/OrCode.js

@@ -1,6 +1,7 @@
-import { b as basicSetup, i as indentWithTab } from '../../index-00991c6e.js';
-import { m as markdown, j as json, a as javascript, c as css, h as html } from '../../index-40a6d6e0.js';
-import { E as EditorView, k as keymap, a as EditorState } from '../../index-51f352b6.js';
+import { b as basicSetup, i as indentWithTab } from '../../index-02646e58.js';
+import { a as json, j as javascript, c as css, h as html } from '../../index-5915e78f.js';
+import { m as markdown } from '../../index-3d38888c.js';
+import { E as EditorView, k as keymap, a as EditorState } from '../../index-6617e2a7.js';
 import { defineComponent, ref, computed, reactive, toRef, watch, onMounted, onUnmounted } from 'vue-demi';
 import { CodeLanguage } from './props.js';
 import { Code, CodeControl } from './styles.js';

package/dist/bundled/v2/components/OrTagsV3/OrTags.js

@@ -1,6 +1,5 @@
 import { defineComponent, ref, computed } from 'vue-demi';
-import { TagsOverflow } from './props.js';
-import { Tags, TagsContainer, TagsContainerOverflows, TagsOverflowButton, TagsOverflowPopover } from './styles.js';
+import { Tags, TagsContainer, TagsOverflowButton, TagsOverflowPopover } from './styles.js';
 import __vue_component__$1 from '../OrButtonV3/OrButton.js';
 import __vue_component__$2 from '../OrPopoverV3/OrPopover.js';
 import __vue_component__$3 from '../OrTagV3/OrTag.js';
@@ -19,10 +18,6 @@ var script = defineComponent({
       type: Array,
       default: () => []
     },
-    overflow: {
-      type: String,
-      default: TagsOverflow.Default
-    },
     tagProps: {
       type: Object,
       default: undefined
@@ -46,7 +41,7 @@ var script = defineComponent({
     });
     // Styles
     const rootStyles = computed(() => ['or-tags-v3', ...Tags]);
-    const containerStyles = computed(() => [...TagsContainer, ...TagsContainerOverflows[props.overflow]]);
+    const containerStyles = computed(() => [...TagsContainer]);
     const overflowButtonStyles = computed(() => [...TagsOverflowButton]);
     const overflowPopoverStyles = computed(() => [...TagsOverflowPopover]);
     // State

package/dist/bundled/v2/components/OrTagsV3/OrTags.vue.d.ts

@@ -1,5 +1,4 @@
 import { PropType } from 'vue-demi';
-import { TagsOverflow } from './props';
 declare const _default: import("vue").ComponentOptions<import("vue").default, import("@vue/composition-api").ShallowUnwrapRef<{
     root: import("@vue/composition-api").Ref<HTMLElement | undefined>;
     container: import("@vue/composition-api").Ref<HTMLElement | undefined>;
@@ -25,10 +24,6 @@ declare const _default: import("vue").ComponentOptions<import("vue").default, im
         type: PropType<string[]>;
         default: () => never[];
     };
-    overflow: {
-        type: PropType<"default" | "wrap">;
-        default: TagsOverflow;
-    };
     tagProps: {
         type: PropType<Readonly<Partial<{
             [x: number]: string;
@@ -40,10 +35,6 @@ declare const _default: import("vue").ComponentOptions<import("vue").default, im
         type: PropType<string[]>;
         default: () => never[];
     };
-    overflow: {
-        type: PropType<"default" | "wrap">;
-        default: TagsOverflow;
-    };
     tagProps: {
         type: PropType<Readonly<Partial<{
             [x: number]: string;
@@ -52,7 +43,6 @@ declare const _default: import("vue").ComponentOptions<import("vue").default, im
     };
 }>> & Omit<import("vue").VueConstructor<import("vue").default>, never> & (new (...args: any[]) => import("@vue/composition-api").ComponentRenderProxy<{
     items: string[];
-    overflow: "default" | "wrap";
     tagProps: Readonly<Partial<{
         [x: number]: string;
     } | {}> & Omit<{} & {}, never>>;
@@ -80,7 +70,6 @@ declare const _default: import("vue").ComponentOptions<import("vue").default, im
     overflowItems: import("@vue/composition-api").ComputedRef<string[]>;
 }>, import("@vue/composition-api").Data, {}, {}, {}, {}, string[], {
     items: string[];
-    overflow: "default" | "wrap";
     tagProps: Readonly<Partial<{
         [x: number]: string;
     } | {}> & Omit<{} & {}, never>>;
@@ -88,7 +77,6 @@ declare const _default: import("vue").ComponentOptions<import("vue").default, im
     [x: `on${Capitalize<string>}`]: ((...args: any[]) => any) | undefined;
 }, {
     items: string[];
-    overflow: "default" | "wrap";
     tagProps: Readonly<Partial<{
         [x: number]: string;
     } | {}> & Omit<{} & {}, never>>;

package/dist/bundled/v2/components/OrTagsV3/index.d.ts

@@ -1,2 +1 @@
 export { default as OrTagsV3 } from './OrTags.vue';
-export * from './props';

package/dist/bundled/v2/components/OrTagsV3/index.js

@@ -1,2 +1 @@
 export { default as OrTagsV3 } from './OrTags.js';
-export { TagsOverflow } from './props.js';

package/dist/bundled/v2/components/OrTagsV3/styles.d.ts

@@ -1,6 +1,4 @@
-import { TagsOverflow } from './props';
 export declare const Tags: string[];
 export declare const TagsContainer: string[];
-export declare const TagsContainerOverflows: Record<TagsOverflow, string[]>;
 export declare const TagsOverflowButton: string[];
 export declare const TagsOverflowPopover: string[];

package/dist/bundled/v2/components/OrTagsV3/styles.js

@@ -1,8 +1,8 @@
-import { TagsOverflow } from './props.js';
-
 const Tags = [
 // Layout
 'layout-row',
+// Overflow
+'overflow-hidden',
 // Spacing
 'gap-sm',
 // Theme
@@ -10,16 +10,10 @@ const Tags = [
 const TagsContainer = [
 // Layout
 'layout-row',
+// Overflow
+'overflow-hidden',
 // Spacing
 'gap-sm'];
-const TagsContainerOverflows = {
-  [TagsOverflow.Default]: [
-  // Overflow
-  'overflow-hidden'],
-  [TagsOverflow.Wrap]: [
-  // Layout
-  '!flex-wrap']
-};
 const TagsOverflowButton = [
 // Typography
 'typography-caption-regular'];
@@ -31,4 +25,4 @@ const TagsOverflowPopover = [
 // Spacing
 'px-md', 'py-md', 'gap-sm'];
 
-export { Tags, TagsContainer, TagsContainerOverflows, TagsOverflowButton, TagsOverflowPopover };
+export { Tags, TagsContainer, TagsOverflowButton, TagsOverflowPopover };

package/dist/bundled/v2/components/index.js

@@ -25,6 +25,8 @@ export { default as OrChip } from './OrChip/OrChip.js';
 export { default as OrChips } from './OrChips/OrChips.js';
 export { default as OrCode } from './OrCode/OrCode.js';
 export { OrCodeLanguages } from './OrCode/constants.js';
+export { b as basicSetup, a as lintGutter, l as linter } from '../index-02646e58.js';
+export { h as html, j as javascript, a as json, b as jsonParseLinter } from '../index-5915e78f.js';
 export { default as OrCodeV3 } from './OrCodeV3/OrCode.js';
 export { CodeLanguage } from './OrCodeV3/props.js';
 export { default as OrCollapse } from './OrCollapse/OrCollapse.js';
@@ -142,7 +144,6 @@ export { default as OrTagInputV3 } from './OrTagInputV3/OrTagInput.js';
 export { default as OrTagV3 } from './OrTagV3/OrTag.js';
 export { TagColor, TagVariant } from './OrTagV3/props.js';
 export { default as OrTagsV3 } from './OrTagsV3/OrTags.js';
-export { TagsOverflow } from './OrTagsV3/props.js';
 export { default as OrTeleport } from './OrTeleport/OrTeleport.js';
 export { default as OrTeleportV3 } from './OrTeleportV3/OrTeleport.js';
 export { default as OrTextV3 } from './OrTextV3/OrText.js';

package/dist/bundled/{v3/index-00991c6e.js → v2/index-02646e58.js}

@@ -1,5 +1,5 @@
-import { E as EditorView, F as Facet, c as combineConfig, S as StateField, b as EditorSelection, T as Transaction, C as ChangeSet, d as ChangeDesc, I as IndentContext, g as getIndentation, i as indentString, e as Text, f as indentUnit, h as countColumn, j as getIndentUnit, A as Annotation, l as StateEffect, m as matchBrackets, s as syntaxTree, N as NodeProp, D as Direction, n as findClusterBreak, V as ViewPlugin, o as Decoration, p as codePointAt, q as codePointSize, r as getPanel, t as CharCategory, P as Prec, u as fromCodePoint, v as showPanel, R as RangeSetBuilder, a as EditorState, w as runScopeHandlers, x as hoverTooltip, W as WidgetType, y as lineNumbers, z as highlightActiveLineGutter, B as highlightSpecialChars, G as foldGutter, H as drawSelection, J as dropCursor, K as indentOnInput, L as syntaxHighlighting, M as defaultHighlightStyle, O as bracketMatching, Q as rectangularSelection, U as crosshairCursor, X as highlightActiveLine, k as keymap, Y as foldKeymap } from './index-51f352b6.js';
-import { b as closeBrackets, d as autocompletion, e as closeBracketsKeymap, f as completionKeymap } from './index-40a6d6e0.js';
+import { E as EditorView, F as Facet, c as combineConfig, S as StateField, b as EditorSelection, T as Transaction, C as ChangeSet, d as ChangeDesc, I as IndentContext, g as getIndentation, i as indentString, e as Text, f as indentUnit, h as countColumn, j as getIndentUnit, A as Annotation, l as StateEffect, m as matchBrackets, s as syntaxTree, N as NodeProp, D as Direction, n as findClusterBreak, V as ViewPlugin, o as Decoration, p as codePointAt, q as codePointSize, r as getPanel, t as CharCategory, P as Prec, u as fromCodePoint, v as showPanel, R as RangeSetBuilder, a as EditorState, w as runScopeHandlers, x as hoverTooltip, y as logException, z as gutter, B as RangeSet, G as showTooltip, W as WidgetType, H as GutterMarker, J as lineNumbers, K as highlightActiveLineGutter, L as highlightSpecialChars, M as foldGutter, O as drawSelection, Q as dropCursor, U as indentOnInput, X as syntaxHighlighting, Y as defaultHighlightStyle, Z as bracketMatching, _ as rectangularSelection, $ as crosshairCursor, a0 as highlightActiveLine, k as keymap, a1 as foldKeymap } from './index-6617e2a7.js';
+import { d as closeBrackets, e as autocompletion, f as closeBracketsKeymap, g as completionKeymap } from './index-5915e78f.js';
 
 /**
 Comment or uncomment the current selection. Will use line comments
@@ -3179,6 +3179,16 @@ function maybeEnableLint(state, effects) {
   return state.field(lintState, false) ? effects : effects.concat(StateEffect.appendConfig.of(lintExtensions));
 }
 /**
+Returns a transaction spec which updates the current set of
+diagnostics, and enables the lint extension if if wasn't already
+active.
+*/
+function setDiagnostics(state, diagnostics) {
+  return {
+    effects: maybeEnableLint(state, [setDiagnosticsEffect.of(diagnostics)])
+  };
+}
+/**
 The state effect that updates the set of active diagnostics. Can
 be useful when writing an extension that needs to track these.
 */
@@ -3309,6 +3319,58 @@ const lintKeymap = [{
   key: "F8",
   run: nextDiagnostic
 }];
+const lintPlugin = /*@__PURE__*/ViewPlugin.fromClass(class {
+  constructor(view) {
+    this.view = view;
+    this.timeout = -1;
+    this.set = true;
+    let {
+      delay
+    } = view.state.facet(lintConfig);
+    this.lintTime = Date.now() + delay;
+    this.run = this.run.bind(this);
+    this.timeout = setTimeout(this.run, delay);
+  }
+  run() {
+    let now = Date.now();
+    if (now < this.lintTime - 10) {
+      setTimeout(this.run, this.lintTime - now);
+    } else {
+      this.set = false;
+      let {
+          state
+        } = this.view,
+        {
+          sources
+        } = state.facet(lintConfig);
+      Promise.all(sources.map(source => Promise.resolve(source(this.view)))).then(annotations => {
+        let all = annotations.reduce((a, b) => a.concat(b));
+        if (this.view.state.doc == state.doc) this.view.dispatch(setDiagnostics(this.view.state, all));
+      }, error => {
+        logException(this.view.state, error);
+      });
+    }
+  }
+  update(update) {
+    let config = update.state.facet(lintConfig);
+    if (update.docChanged || config != update.startState.facet(lintConfig) || config.needsRefresh && config.needsRefresh(update)) {
+      this.lintTime = Date.now() + config.delay;
+      if (!this.set) {
+        this.set = true;
+        this.timeout = setTimeout(this.run, config.delay);
+      }
+    }
+  }
+  force() {
+    if (this.set) {
+      this.lintTime = Date.now();
+      this.run();
+    }
+  }
+  destroy() {
+    clearTimeout(this.timeout);
+  }
+});
 const lintConfig = /*@__PURE__*/Facet.define({
   combine(input) {
     return Object.assign({
@@ -3323,6 +3385,18 @@ const lintConfig = /*@__PURE__*/Facet.define({
     }));
   }
 });
+/**
+Given a diagnostic source, this function returns an extension that
+enables linting with that source. It will be called whenever the
+editor is idle (after its content changed).
+*/
+function linter(source) {
+  let config = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
+  return [lintConfig.of({
+    source,
+    config
+  }), lintPlugin, lintExtensions];
+}
 function assignKeys(actions) {
   let assigned = [];
   if (actions) actions: for (let {
@@ -3684,6 +3758,140 @@ const baseTheme = /*@__PURE__*/EditorView.baseTheme({
     }
   }
 });
+class LintGutterMarker extends GutterMarker {
+  constructor(diagnostics) {
+    super();
+    this.diagnostics = diagnostics;
+    this.severity = diagnostics.reduce((max, d) => {
+      let s = d.severity;
+      return s == "error" || s == "warning" && max == "info" ? s : max;
+    }, "info");
+  }
+  toDOM(view) {
+    let elt = document.createElement("div");
+    elt.className = "cm-lint-marker cm-lint-marker-" + this.severity;
+    let diagnostics = this.diagnostics;
+    let diagnosticsFilter = view.state.facet(lintGutterConfig).tooltipFilter;
+    if (diagnosticsFilter) diagnostics = diagnosticsFilter(diagnostics);
+    if (diagnostics.length) elt.onmouseover = () => gutterMarkerMouseOver(view, elt, diagnostics);
+    return elt;
+  }
+}
+function trackHoverOn(view, marker) {
+  let mousemove = event => {
+    let rect = marker.getBoundingClientRect();
+    if (event.clientX > rect.left - 10 /* Hover.Margin */ && event.clientX < rect.right + 10 /* Hover.Margin */ && event.clientY > rect.top - 10 /* Hover.Margin */ && event.clientY < rect.bottom + 10 /* Hover.Margin */) return;
+    for (let target = event.target; target; target = target.parentNode) {
+      if (target.nodeType == 1 && target.classList.contains("cm-tooltip-lint")) return;
+    }
+    window.removeEventListener("mousemove", mousemove);
+    if (view.state.field(lintGutterTooltip)) view.dispatch({
+      effects: setLintGutterTooltip.of(null)
+    });
+  };
+  window.addEventListener("mousemove", mousemove);
+}
+function gutterMarkerMouseOver(view, marker, diagnostics) {
+  function hovered() {
+    let line = view.elementAtHeight(marker.getBoundingClientRect().top + 5 - view.documentTop);
+    const linePos = view.coordsAtPos(line.from);
+    if (linePos) {
+      view.dispatch({
+        effects: setLintGutterTooltip.of({
+          pos: line.from,
+          above: false,
+          create() {
+            return {
+              dom: diagnosticsTooltip(view, diagnostics),
+              getCoords: () => marker.getBoundingClientRect()
+            };
+          }
+        })
+      });
+    }
+    marker.onmouseout = marker.onmousemove = null;
+    trackHoverOn(view, marker);
+  }
+  let {
+    hoverTime
+  } = view.state.facet(lintGutterConfig);
+  let hoverTimeout = setTimeout(hovered, hoverTime);
+  marker.onmouseout = () => {
+    clearTimeout(hoverTimeout);
+    marker.onmouseout = marker.onmousemove = null;
+  };
+  marker.onmousemove = () => {
+    clearTimeout(hoverTimeout);
+    hoverTimeout = setTimeout(hovered, hoverTime);
+  };
+}
+function markersForDiagnostics(doc, diagnostics) {
+  let byLine = Object.create(null);
+  for (let diagnostic of diagnostics) {
+    let line = doc.lineAt(diagnostic.from);
+    (byLine[line.from] || (byLine[line.from] = [])).push(diagnostic);
+  }
+  let markers = [];
+  for (let line in byLine) {
+    markers.push(new LintGutterMarker(byLine[line]).range(+line));
+  }
+  return RangeSet.of(markers, true);
+}
+const lintGutterExtension = /*@__PURE__*/gutter({
+  class: "cm-gutter-lint",
+  markers: view => view.state.field(lintGutterMarkers)
+});
+const lintGutterMarkers = /*@__PURE__*/StateField.define({
+  create() {
+    return RangeSet.empty;
+  },
+  update(markers, tr) {
+    markers = markers.map(tr.changes);
+    let diagnosticFilter = tr.state.facet(lintGutterConfig).markerFilter;
+    for (let effect of tr.effects) {
+      if (effect.is(setDiagnosticsEffect)) {
+        let diagnostics = effect.value;
+        if (diagnosticFilter) diagnostics = diagnosticFilter(diagnostics || []);
+        markers = markersForDiagnostics(tr.state.doc, diagnostics.slice(0));
+      }
+    }
+    return markers;
+  }
+});
+const setLintGutterTooltip = /*@__PURE__*/StateEffect.define();
+const lintGutterTooltip = /*@__PURE__*/StateField.define({
+  create() {
+    return null;
+  },
+  update(tooltip, tr) {
+    if (tooltip && tr.docChanged) tooltip = hideTooltip(tr, tooltip) ? null : Object.assign(Object.assign({}, tooltip), {
+      pos: tr.changes.mapPos(tooltip.pos)
+    });
+    return tr.effects.reduce((t, e) => e.is(setLintGutterTooltip) ? e.value : t, tooltip);
+  },
+  provide: field => showTooltip.from(field)
+});
+const lintGutterTheme = /*@__PURE__*/EditorView.baseTheme({
+  ".cm-gutter-lint": {
+    width: "1.4em",
+    "& .cm-gutterElement": {
+      padding: ".2em"
+    }
+  },
+  ".cm-lint-marker": {
+    width: "1em",
+    height: "1em"
+  },
+  ".cm-lint-marker-info": {
+    content: /*@__PURE__*/svg(`<path fill="#aaf" stroke="#77e" stroke-width="6" stroke-linejoin="round" d="M5 5L35 5L35 35L5 35Z"/>`)
+  },
+  ".cm-lint-marker-warning": {
+    content: /*@__PURE__*/svg(`<path fill="#fe8" stroke="#fd7" stroke-width="6" stroke-linejoin="round" d="M20 6L37 35L3 35Z"/>`)
+  },
+  ".cm-lint-marker-error": {
+    content: /*@__PURE__*/svg(`<circle cx="20" cy="20" r="15" fill="#f87" stroke="#f43" stroke-width="6"/>`)
+  }
+});
 const lintExtensions = [lintState, /*@__PURE__*/EditorView.decorations.compute([lintState], state => {
   let {
     selected,
@@ -3693,6 +3901,24 @@ const lintExtensions = [lintState, /*@__PURE__*/EditorView.decorations.compute([
 }), /*@__PURE__*/hoverTooltip(lintTooltip, {
   hideOn: hideTooltip
 }), baseTheme];
+const lintGutterConfig = /*@__PURE__*/Facet.define({
+  combine(configs) {
+    return combineConfig(configs, {
+      hoverTime: 300 /* Hover.Time */,
+      markerFilter: null,
+      tooltipFilter: null
+    });
+  }
+});
+/**
+Returns an extension that installs a gutter showing markers for
+each line that has diagnostics, which can be hovered over to see
+the diagnostics.
+*/
+function lintGutter() {
+  let config = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
+  return [lintGutterConfig.of(config), lintGutterMarkers, lintGutterExtension, lintGutterTheme, lintGutterTooltip];
+}
 
 // (The superfluous function calls around the list of extensions work
 // around current limitations in tree-shaking software.)
@@ -3737,4 +3963,4 @@ const basicSetup = /*@__PURE__*/(() => [lineNumbers(), highlightActiveLineGutter
   fallback: true
 }), bracketMatching(), closeBrackets(), autocompletion(), rectangularSelection(), crosshairCursor(), highlightActiveLine(), highlightSelectionMatches(), keymap.of([...closeBracketsKeymap, ...defaultKeymap, ...searchKeymap, ...historyKeymap, ...foldKeymap, ...completionKeymap, ...lintKeymap])])();
 
-export { basicSetup as b, indentWithTab as i };
+export { lintGutter as a, basicSetup as b, indentWithTab as i, linter as l };