Home

tailwind-ctp-intellisense @master - refs - log -
-
https://git.jolheiser.com/tailwind-ctp-intellisense.git
Tailwind intellisense + Catppuccin
tree log patch
Fix CSS conflict diagnostic false negatives (#761)
Signature
-----BEGIN PGP SIGNATURE----- wsBcBAABCAAQBQJkPkymCRBK7hj4Ov3rIwAAvTMIAHnRYKF68Deq7jJ0h3af/Mv4 0472/MJMPnl3QQtG1PzbuZi59VBmxjklO3YlmXFELW4rjd1Vp1ptmqjP7r0IQ1eq YJQPvo4+ARSXMK/1FEnPzNR70WQoym4Q2taMiJT2OHAFG+wBV2e8HfmEyWqFUYz6 n+ayz8gLi5yyHUknocidl/w4v/+gggqfbduGpiYsO5hc+lwrD2xKlHLGEnx2KIy9 QD8O1KeG/9TV9YwpiMRaqJ/qEKqtTwGsnL+mho+KjFfMxcos7SCTvCPlqE77djLn SEKAyn9OuVfT2PKj1uwNUysDSTKlcUu+sXMTjCuweImE/cuq/k2T2p+m71TD75U= =CVRf -----END PGP SIGNATURE-----
Brad Cornes <hello@bradley.dev>
2 years ago
2 changed files, 60 additions(+), 19 deletions(-)
M packages/tailwindcss-language-service/src/diagnostics/getCssConflictDiagnostics.ts -> packages/tailwindcss-language-service/src/diagnostics/getCssConflictDiagnostics.ts
diff --git a/packages/tailwindcss-language-service/src/diagnostics/getCssConflictDiagnostics.ts b/packages/tailwindcss-language-service/src/diagnostics/getCssConflictDiagnostics.ts
index a762871f945f61defab690807ffbae8eda49dbd6..7ee3f84371f9b69fd05a59e002290fde6668f6d8 100644
--- a/packages/tailwindcss-language-service/src/diagnostics/getCssConflictDiagnostics.ts
+++ b/packages/tailwindcss-language-service/src/diagnostics/getCssConflictDiagnostics.ts
@@ -1,12 +1,43 @@
 import { joinWithAnd } from '../util/joinWithAnd'
 import { State, Settings } from '../util/state'
-import type { TextDocument, DiagnosticSeverity } from 'vscode-languageserver'
+import type { TextDocument } from 'vscode-languageserver'
 import { CssConflictDiagnostic, DiagnosticKind } from './types'
 import { findClassListsInDocument, getClassNamesInClassList } from '../util/find'
 import { getClassNameDecls } from '../util/getClassNameDecls'
 import { getClassNameMeta } from '../util/getClassNameMeta'
 import { equal } from '../util/array'
 import * as jit from '../util/jit'
+import type { AtRule, Node, Rule } from 'postcss'
+
+function isCustomProperty(property: string): boolean {
+  return property.startsWith('--')
+}
+
+function isAtRule(node: Node): node is AtRule {
+  return node.type === 'atrule'
+}
+
+function isKeyframes(rule: Rule): boolean {
+  let parent = rule.parent
+  if (!parent) {
+    return false
+  }
+  if (isAtRule(parent) && parent.name === 'keyframes') {
+    return true
+  }
+  return false
+}
+
+function getRuleProperties(rule: Rule): string[] {
+  let properties: string[] = []
+  rule.walkDecls(({ prop }) => {
+    properties.push(prop)
+  })
+  if (properties.findIndex((p) => !isCustomProperty(p)) > -1) {
+    properties = properties.filter((p) => !isCustomProperty(p))
+  }
+  return properties
+}
 
 export async function getCssConflictDiagnostics(
   state: State,
@@ -24,16 +55,17 @@     const classNames = getClassNamesInClassList(classList, state.blocklist)
 
     classNames.forEach((className, index) => {
       if (state.jit) {
-        let { rules } = jit.generateRules(state, [className.className])
+        let { rules } = jit.generateRules(
+          state,
+          [className.className],
+          (rule) => !isKeyframes(rule)
+        )
         if (rules.length === 0) {
           return
         }
 
         let info: Array<{ context: string[]; properties: string[] }> = rules.map((rule) => {
-          let properties: string[] = []
-          rule.walkDecls(({ prop }) => {
-            properties.push(prop)
-          })
+          let properties = getRuleProperties(rule)
           let context = jit.getRuleContext(state, rule, className.className)
           return { context, properties }
         })
@@ -41,21 +73,22 @@
         let otherClassNames = classNames.filter((_className, i) => i !== index)
 
         let conflictingClassNames = otherClassNames.filter((otherClassName) => {
-          let { rules: otherRules } = jit.generateRules(state, [otherClassName.className])
+          let { rules: otherRules } = jit.generateRules(
+            state,
+            [otherClassName.className],
+            (rule) => !isKeyframes(rule)
+          )
           if (otherRules.length !== rules.length) {
             return false
           }
 
           for (let i = 0; i < otherRules.length; i++) {
-            let rule = otherRules[i]
-            let properties: string[] = []
-            rule.walkDecls(({ prop }) => {
-              properties.push(prop)
-            })
+            let otherRule = otherRules[i]
+            let properties = getRuleProperties(otherRule)
             if (!equal(info[i].properties, properties)) {
               return false
             }
-            let context = jit.getRuleContext(state, rule, otherClassName.className)
+            let context = jit.getRuleContext(state, otherRule, otherClassName.className)
             if (!equal(info[i].context, context)) {
               return false
             }
M packages/tailwindcss-language-service/src/util/jit.ts -> packages/tailwindcss-language-service/src/util/jit.ts
diff --git a/packages/tailwindcss-language-service/src/util/jit.ts b/packages/tailwindcss-language-service/src/util/jit.ts
index d308960b288fb9af3fb053feb1fa5adbc1dcbe7f..40250d19b2bcc41c1a8fff0e5d2ae202c6620fc9 100644
--- a/packages/tailwindcss-language-service/src/util/jit.ts
+++ b/packages/tailwindcss-language-service/src/util/jit.ts
@@ -1,6 +1,5 @@
 import { State } from './state'
-import type { Container, Document, Root, Rule } from 'postcss'
-import dlv from 'dlv'
+import type { Container, Document, Root, Rule, Node, AtRule } from 'postcss'
 import { remToPx } from './remToPx'
 
 export function bigSign(bigIntValue) {
@@ -8,7 +7,11 @@   // @ts-ignore
   return (bigIntValue > 0n) - (bigIntValue < 0n)
 }
 
-export function generateRules(state: State, classNames: string[]): { root: Root; rules: Rule[] } {
+export function generateRules(
+  state: State,
+  classNames: string[],
+  filter: (rule: Rule) => boolean = () => true
+): { root: Root; rules: Rule[] } {
   let rules: [bigint, Rule][] = state.modules.jit.generateRules
     .module(new Set(classNames), state.jitContext)
     .sort(([a], [z]) => bigSign(a - z))
@@ -18,7 +21,9 @@   state.modules.jit.expandApplyAtRules.module(state.jitContext)(root)
 
   let actualRules: Rule[] = []
   root.walkRules((subRule) => {
-    actualRules.push(subRule)
+    if (filter(subRule)) {
+      actualRules.push(subRule)
+    }
   })
 
   return {
@@ -84,14 +89,17 @@
   return state.modules.postcssSelectorParser.module(transform).processSync(selector)
 }
 
+function isAtRule(node: Node): node is AtRule {
+  return node.type === 'atrule'
+}
+
 export function getRuleContext(state: State, rule: Rule, className: string): string[] {
   let context: string[] = [replaceClassName(state, rule.selector, className, '__placeholder__')]
 
   let p: Container | Document = rule
   while (p.parent && p.parent.type !== 'root') {
     p = p.parent
-    if (p.type === 'atrule') {
-      // @ts-ignore
+    if (isAtRule(p)) {
       context.unshift(`@${p.name} ${p.params}`)
     }
   }