Fix duplicate color decorators (tailwindlabs#652)

Author: bradlc

packages/tailwindcss-language-service/src/documentColorProvider.ts

@@ -8,6 +8,7 @@ import { getColor, getColorFromValue, culoriColorToVscodeColor } from './util/co
 import { stringToPath } from './util/stringToPath'
 import type { TextDocument, ColorInformation } from 'vscode-languageserver'
 import dlv from 'dlv'
+import { dedupeByRange } from './util/array'
 
 export async function getDocumentColors(
   state: State,
@@ -45,5 +46,5 @@ export async function getDocumentColors(
     }
   })
 
-  return colors
+  return dedupeByRange(colors)
 }

packages/tailwindcss-language-service/src/util/array.ts

@@ -1,3 +1,6 @@
+import type { Range } from 'vscode-languageserver'
+import { rangesEqual } from './rangesEqual'
+
 export function dedupe<T>(arr: Array<T>): Array<T> {
   return arr.filter((value, index, self) => self.indexOf(value) === index)
 }
@@ -6,6 +9,13 @@ export function dedupeBy<T>(arr: Array<T>, transform: (item: T) => any): Array<T
   return arr.filter((value, index, self) => self.map(transform).indexOf(transform(value)) === index)
 }
 
+export function dedupeByRange<T extends { range: Range }>(arr: Array<T>): Array<T> {
+  return arr.filter(
+    (classList, classListIndex) =>
+      classListIndex === arr.findIndex((c) => rangesEqual(c.range, classList.range))
+  )
+}
+
 export function ensureArray<T>(value: T | T[]): T[] {
   return Array.isArray(value) ? value : [value]
 }

packages/tailwindcss-language-service/src/util/find.ts

@@ -5,12 +5,10 @@ import { isCssContext, isCssDoc } from './css'
 import { isHtmlContext } from './html'
 import { isWithinRange } from './isWithinRange'
 import { isJsxContext } from './js'
-import { flatten } from './array'
+import { dedupeByRange, flatten } from './array'
 import { getClassAttributeLexer, getComputedClassAttributeLexer } from './lexers'
 import { getLanguageBoundaries } from './getLanguageBoundaries'
 import { resolveRange } from './resolveRange'
-import dlv from 'dlv'
-import { rangesEqual } from './rangesEqual'
 import Regex from 'becke-ch--regex--s0-0-v1--base--pl--lib'
 import { getTextWithoutComments } from './doc'
 
@@ -282,13 +280,6 @@ export async function findClassListsInHtmlRange(
   return result
 }
 
-function dedupeClassLists(classLists: DocumentClassList[]): DocumentClassList[] {
-  return classLists.filter(
-    (classList, classListIndex) =>
-      classListIndex === classLists.findIndex((c) => rangesEqual(c.range, classList.range))
-  )
-}
-
 export async function findClassListsInRange(
   state: State,
   doc: TextDocument,
@@ -302,7 +293,7 @@ export async function findClassListsInRange(
   } else {
     classLists = await findClassListsInHtmlRange(state, doc, mode, range)
   }
-  return dedupeClassLists([
+  return dedupeByRange([
     ...classLists,
     ...(includeCustom ? await findCustomClassLists(state, doc, range) : []),
   ])
@@ -319,7 +310,7 @@ export async function findClassListsInDocument(
   let boundaries = getLanguageBoundaries(state, doc)
   if (!boundaries) return []
 
-  return dedupeClassLists(
+  return dedupeByRange(
     flatten([
       ...(await Promise.all(
         boundaries