@codemirror/tooltip - npm Package Compare versions

Comparing version 0.19.0 to 0.19.1

CHANGELOG.md

@@ -0,1 +1,7 @@
+## 0.19.1 (2021-08-30)
+
+### New features
+
+The new `tooltips` function can be used to configure tooltip behavior. For now, the only option is `position`, which allows you to choose between fixed and absolute positioning.
+
 ## 0.19.0 (2021-08-11)
@@ -2,0 +8,0 @@

dist/index.d.ts

 import { EditorView, ViewUpdate } from '@codemirror/view';
-import { Facet, Extension } from '@codemirror/state';
+import { Extension, Facet } from '@codemirror/state';
 
 /**
+Return an extension that configures tooltip behavior.
+*/
+declare function tooltips(config?: {
+    /**
+    By default, tooltips use `"fixed"`
+    [positioning](https://developer.mozilla.org/en-US/docs/Web/CSS/position),
+    which has the advantage that tooltips don't get cut off by
+    scrollable parent elements. However, CSS rules like `contain:
+    layout` can break fixed positioning in child nodes, which can be
+    worked about by using `"absolute"` here.
+    
+    On iOS, which at the time of writing still doesn't properly
+    support fixed positioning, the library always uses absolute
+    positioning.
+    */
+    position?: "fixed" | "absolute";
+}): Extension;
+/**
 Describes a tooltip. Values of this type, when provided through
@@ -80,2 +98,2 @@ the [`showTooltip`](https://codemirror.net/6/docs/ref/#tooltip.showTooltip) facet, control the
 
-export { Tooltip, TooltipView, hoverTooltip, showTooltip };
+export { Tooltip, TooltipView, hoverTooltip, showTooltip, tooltips };

dist/index.js

@@ -53,2 +53,11 @@ import { ViewPlugin, Direction, EditorView, logException } from '@codemirror/view';
 }
+/**
+Return an extension that configures tooltip behavior.
+*/
+function tooltips(config = {}) {
+    return config.position ? tooltipPositioning.of(config.position) : [];
+}
+const tooltipPositioning = /*@__PURE__*/Facet.define({
+    combine: values => ios ? "absolute" : values.length ? values[0] : "fixed"
+});
 const tooltipPlugin = /*@__PURE__*/ViewPlugin.fromClass(class {
@@ -58,2 +67,3 @@ constructor(view) {
         this.inView = true;
+        this.position = view.state.facet(tooltipPositioning);
         this.measureReq = { read: this.readMeasure.bind(this), write: this.writeMeasure.bind(this), key: this };
@@ -64,2 +74,9 @@ this.manager = new TooltipViewManager(view, showTooltip, t => this.createTooltip(t));
         const { shouldMeasure } = this.manager.update(update);
+        let newPosition = update.state.facet(tooltipPositioning);
+        if (newPosition != this.position) {
+            this.position = newPosition;
+            for (let t of this.manager.tooltipViews)
+                t.dom.style.position = newPosition;
+            shouldMeasure = true;
+        }
         if (shouldMeasure)
@@ -71,2 +88,3 @@ this.maybeMeasure();
         tooltipView.dom.classList.add("cm-tooltip");
+        tooltipView.dom.style.position = this.position;
         tooltipView.dom.style.top = Outside;
@@ -113,6 +131,5 @@ this.view.dom.appendChild(tooltipView.dom);
                     top = above ? r.top - height : r.bottom;
-            if (ios) {
+            if (this.position == "absolute") {
                 dom.style.top = (top - editor.top) + "px";
                 dom.style.left = (left - editor.left) + "px";
-                dom.style.position = "absolute";
             }
@@ -149,3 +166,2 @@ else {
     ".cm-tooltip": {
-        position: "fixed",
         zIndex: 100
@@ -381,2 +397,2 @@ },
 
-export { hoverTooltip, showTooltip };
+export { hoverTooltip, showTooltip, tooltips };

package.json

 {
   "name": "@codemirror/tooltip",
-  "version": "0.19.0",
+  "version": "0.19.1",
   "description": "Tooltip support for the CodeMirror code editor",
@@ -5,0 +5,0 @@ "scripts": {

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

39633

increased by6.12%

Lines of code

874

increased by6.07%

No dependency changes