1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51

diff --git a/src/lsp/providers/codeActionProvider.ts b/src/lsp/providers/codeActionProvider.ts
new file mode 100644
index 0000000000000000000000000000000000000000..9900319bdd7e5a5b9142d736f4835530eb2b707c
--- /dev/null
+++ b/src/lsp/providers/codeActionProvider.ts
@@ -0,0 +1,45 @@
+import {
+  CodeAction,
+  CodeActionParams,
+  CodeActionKind,
+} from 'vscode-languageserver'
+import { State } from '../util/state'
+import { findLast } from '../util/find'
+
+export function provideCodeActions(
+  _state: State,
+  params: CodeActionParams
+): CodeAction[] {
+  if (params.context.diagnostics.length === 0) {
+    return null
+  }
+
+  return params.context.diagnostics
+    .map((diagnostic) => {
+      let match = findLast(
+        / Did you mean (?:something like )?'(?<replacement>[^']+)'\?$/g,
+        diagnostic.message
+      )
+
+      if (!match) {
+        return null
+      }
+
+      return {
+        title: `Replace with '${match.groups.replacement}'`,
+        kind: CodeActionKind.QuickFix,
+        diagnostics: [diagnostic],
+        edit: {
+          changes: {
+            [params.textDocument.uri]: [
+              {
+                range: diagnostic.range,
+                newText: match.groups.replacement,
+              },
+            ],
+          },
+        },
+      }
+    })
+    .filter(Boolean)
+}

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40

diff --git a/src/lsp/server.ts b/src/lsp/server.ts
index 3d3753228e38f037757b3918bba07360142791b1..dce9672bc69e26dced8f4bb8442b05e371fefdac 100644
--- a/src/lsp/server.ts
+++ b/src/lsp/server.ts
@@ -16,6 +16,8 @@   CompletionList,
   Hover,
   TextDocumentPositionParams,
   DidChangeConfigurationNotification,
+  CodeActionParams,
+  CodeAction,
 } from 'vscode-languageserver'
 import getTailwindState from '../class-names/index'
 import { State, Settings, EditorState } from './util/state'
@@ -32,6 +34,7 @@   updateAllDiagnostics,
   clearAllDiagnostics,
 } from './providers/diagnosticsProvider'
 import { createEmitter } from '../lib/emitter'
+import { provideCodeActions } from './providers/codeActionProvider'
 
 let connection = createConnection(ProposedFeatures.all)
 let state: State = { enabled: false, emitter: createEmitter(connection) }
@@ -171,6 +174,7 @@             typeof state.separator === 'undefined' ? ':' : state.separator,
           ],
         },
         hoverProvider: true,
+        codeActionProvider: true,
       },
     }
   }
@@ -225,5 +229,10 @@     if (!state.enabled) return null
     return provideHover(state, params)
   }
 )
+
+connection.onCodeAction((params: CodeActionParams): CodeAction[] => {
+  if (!state.enabled) return null
+  return provideCodeActions(state, params)
+})
 
 connection.listen()