Colour previews squares give inconsistent behaviour and are buggy.

[JamesDelph]

If you have aligned lines like this;

<div class="text-white">foo</div>
<div class="text-white">foo</div>
<div class="text-white">foo</div>
<div class="text-white">foo</div>

the cursor alternates between sitting on the left and the right of the colour preview square. When multi-line editing, each cursor will alternate, which is rather misleading.

When word wrap causes a break between the colour preview and the class name, cursor movement breaks. Trying to use Shift+arrow keys over a line like this will cause the cursor to skip a massive chunk of code (I think it goes down to the closing tag of the parent element).

In the interim if these things annoy you you can turn them off by adding;

  "settings": {
    "tailwindCSS.colorDecorators": false
  }

to your LSP-tailwindcss.sublime-settings

[rchl]

Color boxes are handled by the base LSP package but the issue has more to do with how ST handles "phantoms" than with anything being wrong in LSP code. You can see various related issues in sublimelsp/LSP#2007 (the Issues with phantoms used for Inlay Hints section).

[predragnikolic]

I just attached a video to better showcase what is happening:
Screencast from 2023-08-18 12-57-03.webm

[predragnikolic]

Hello @JamesDelph,

I hoped that once sublimehq/sublime_text#6098 is fixed,
that it also resolves this issue that you were experiencing.

Unfortunately, the 6098 fix still hasn't fixed this issue.

I would suggest you to open a dedicated issue at the sublime text repo https://github.com/sublimehq/sublime_text/issues
and track it there, because there is nothing that can be done in this repo.

[predragnikolic]

Closing this, the reason is specified in my last comment.