@codemirror/view 6.43.9 → 6.43.10

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/CHANGELOG.md CHANGED
@@ -1,3 +1,11 @@
1
+ ## 6.43.10 (2026-08-31)
2
+
3
+ ### Bug fixes
4
+
5
+ Make sure highlighted spaces don't look odd when the browser merges them during composition.
6
+
7
+ Avoid scroll position jumping during editor scaling by properly taking scale into account when stabilizing the vertical position.
8
+
1
9
  ## 6.43.9 (2026-08-16)
2
10
 
3
11
  ### Bug fixes
package/dist/index.cjs CHANGED
@@ -6645,9 +6645,8 @@ class ViewState {
6645
6645
  scaleBlock(this.heightMap.lineAt(this.scaler.fromDOM(height), QueryType.ByHeight, this.heightOracle, 0, 0), this.scaler);
6646
6646
  }
6647
6647
  getScrollOffset() {
6648
- let base = this.scrollParent == this.view.scrollDOM ? this.scrollParent.scrollTop
6648
+ return this.scrollParent == this.view.scrollDOM ? this.scrollParent.scrollTop * this.scaleY
6649
6649
  : (this.scrollParent ? this.scrollParent.getBoundingClientRect().top : 0) - this.view.contentDOM.getBoundingClientRect().top;
6650
- return base * this.scaleY;
6651
6650
  }
6652
6651
  scrollAnchorAt(scrollOffset) {
6653
6652
  let block = this.lineBlockAtHeight(scrollOffset + 8);
@@ -7039,8 +7038,9 @@ const baseTheme$1 = buildTheme("." + baseThemeID, {
7039
7038
  userSelect: "none"
7040
7039
  },
7041
7040
  ".cm-highlightSpace": {
7042
- backgroundImage: "radial-gradient(circle at 50% 55%, #aaa 20%, transparent 5%)",
7043
- backgroundPosition: "center",
7041
+ background: "radial-gradient(circle at 50% 55%, #aaa 20%, transparent 0) no-repeat",
7042
+ backgroundSize: ".4em",
7043
+ backgroundPosition: "calc(min(50%, 0px)) center"
7044
7044
  },
7045
7045
  ".cm-highlightTab": {
7046
7046
  backgroundImage: `url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="200" height="20"><path stroke="%23888" stroke-width="1" fill="none" d="M1 10H196L190 5M190 15L196 10M197 4L197 16"/></svg>')`,
@@ -8151,7 +8151,7 @@ class EditorView {
8151
8151
  this.observer.forceFlush();
8152
8152
  let updated = null;
8153
8153
  let scroll = this.viewState.scrollParent, scrollOffset = this.viewState.getScrollOffset();
8154
- let { scrollAnchorPos, scrollAnchorHeight } = this.viewState;
8154
+ let { scrollAnchorPos, scrollAnchorHeight, scaleY: scrollScale } = this.viewState;
8155
8155
  if (Math.abs(scrollOffset - this.viewState.scrollOffset) > 1)
8156
8156
  scrollAnchorHeight = -1;
8157
8157
  this.viewState.scrollAnchorHeight = -1;
@@ -8160,13 +8160,14 @@ class EditorView {
8160
8160
  if (scrollAnchorHeight < 0) {
8161
8161
  if (isScrolledToBottom(scroll || this.win)) {
8162
8162
  scrollAnchorPos = -1;
8163
- scrollAnchorHeight = this.viewState.heightMap.height;
8163
+ scrollAnchorHeight = this.viewState.heightMap.height / this.viewState.scaleY;
8164
8164
  }
8165
8165
  else {
8166
8166
  let block = this.viewState.scrollAnchorAt(scrollOffset);
8167
8167
  scrollAnchorPos = block.from;
8168
8168
  scrollAnchorHeight = block.top;
8169
8169
  }
8170
+ scrollScale = this.viewState.scaleY;
8170
8171
  }
8171
8172
  this.updateState = 1 /* UpdateState.Measuring */;
8172
8173
  let changed = this.viewState.measure();
@@ -8230,7 +8231,7 @@ class EditorView {
8230
8231
  else {
8231
8232
  let newAnchorHeight = scrollAnchorPos < 0 ? this.viewState.heightMap.height :
8232
8233
  this.viewState.lineBlockAt(scrollAnchorPos).top;
8233
- let diff = (newAnchorHeight - scrollAnchorHeight) / this.scaleY;
8234
+ let diff = (newAnchorHeight / this.viewState.scaleY) - (scrollAnchorHeight / scrollScale);
8234
8235
  if ((diff > 1 || diff < -1) &&
8235
8236
  !(browser.ios && this.inputState.lastIOSMomentumScroll > Date.now() - 100) &&
8236
8237
  (scroll == this.scrollDOM || this.hasFocus ||
package/dist/index.js CHANGED
@@ -6640,9 +6640,8 @@ class ViewState {
6640
6640
  scaleBlock(this.heightMap.lineAt(this.scaler.fromDOM(height), QueryType.ByHeight, this.heightOracle, 0, 0), this.scaler);
6641
6641
  }
6642
6642
  getScrollOffset() {
6643
- let base = this.scrollParent == this.view.scrollDOM ? this.scrollParent.scrollTop
6643
+ return this.scrollParent == this.view.scrollDOM ? this.scrollParent.scrollTop * this.scaleY
6644
6644
  : (this.scrollParent ? this.scrollParent.getBoundingClientRect().top : 0) - this.view.contentDOM.getBoundingClientRect().top;
6645
- return base * this.scaleY;
6646
6645
  }
6647
6646
  scrollAnchorAt(scrollOffset) {
6648
6647
  let block = this.lineBlockAtHeight(scrollOffset + 8);
@@ -7034,8 +7033,9 @@ const baseTheme$1 = /*@__PURE__*/buildTheme("." + baseThemeID, {
7034
7033
  userSelect: "none"
7035
7034
  },
7036
7035
  ".cm-highlightSpace": {
7037
- backgroundImage: "radial-gradient(circle at 50% 55%, #aaa 20%, transparent 5%)",
7038
- backgroundPosition: "center",
7036
+ background: "radial-gradient(circle at 50% 55%, #aaa 20%, transparent 0) no-repeat",
7037
+ backgroundSize: ".4em",
7038
+ backgroundPosition: "calc(min(50%, 0px)) center"
7039
7039
  },
7040
7040
  ".cm-highlightTab": {
7041
7041
  backgroundImage: `url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="200" height="20"><path stroke="%23888" stroke-width="1" fill="none" d="M1 10H196L190 5M190 15L196 10M197 4L197 16"/></svg>')`,
@@ -8146,7 +8146,7 @@ class EditorView {
8146
8146
  this.observer.forceFlush();
8147
8147
  let updated = null;
8148
8148
  let scroll = this.viewState.scrollParent, scrollOffset = this.viewState.getScrollOffset();
8149
- let { scrollAnchorPos, scrollAnchorHeight } = this.viewState;
8149
+ let { scrollAnchorPos, scrollAnchorHeight, scaleY: scrollScale } = this.viewState;
8150
8150
  if (Math.abs(scrollOffset - this.viewState.scrollOffset) > 1)
8151
8151
  scrollAnchorHeight = -1;
8152
8152
  this.viewState.scrollAnchorHeight = -1;
@@ -8155,13 +8155,14 @@ class EditorView {
8155
8155
  if (scrollAnchorHeight < 0) {
8156
8156
  if (isScrolledToBottom(scroll || this.win)) {
8157
8157
  scrollAnchorPos = -1;
8158
- scrollAnchorHeight = this.viewState.heightMap.height;
8158
+ scrollAnchorHeight = this.viewState.heightMap.height / this.viewState.scaleY;
8159
8159
  }
8160
8160
  else {
8161
8161
  let block = this.viewState.scrollAnchorAt(scrollOffset);
8162
8162
  scrollAnchorPos = block.from;
8163
8163
  scrollAnchorHeight = block.top;
8164
8164
  }
8165
+ scrollScale = this.viewState.scaleY;
8165
8166
  }
8166
8167
  this.updateState = 1 /* UpdateState.Measuring */;
8167
8168
  let changed = this.viewState.measure();
@@ -8225,7 +8226,7 @@ class EditorView {
8225
8226
  else {
8226
8227
  let newAnchorHeight = scrollAnchorPos < 0 ? this.viewState.heightMap.height :
8227
8228
  this.viewState.lineBlockAt(scrollAnchorPos).top;
8228
- let diff = (newAnchorHeight - scrollAnchorHeight) / this.scaleY;
8229
+ let diff = (newAnchorHeight / this.viewState.scaleY) - (scrollAnchorHeight / scrollScale);
8229
8230
  if ((diff > 1 || diff < -1) &&
8230
8231
  !(browser.ios && this.inputState.lastIOSMomentumScroll > Date.now() - 100) &&
8231
8232
  (scroll == this.scrollDOM || this.hasFocus ||
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@codemirror/view",
3
- "version": "6.43.9",
3
+ "version": "6.43.10",
4
4
  "description": "DOM view component for the CodeMirror code editor",
5
5
  "scripts": {
6
6
  "test": "cm-runtests",