From 2062112414135e3d528d3a81e0cc9368b1a13444 Mon Sep 17 00:00:00 2001
From: Renildo Pereira <rrenildopereiraa@gmail.com>
Date: Mon, 4 Nov 2024 00:20:12 +0000
Subject: [PATCH] add hover providers support for color hover variants

---
 CHANGELOG.md                   |  4 ++--
 src/providers/hoverProvider.ts | 34 ++++++++++++++++++++++++++++++++--
 2 files changed, 34 insertions(+), 4 deletions(-)

diff --git a/CHANGELOG.md b/CHANGELOG.md
index e3dcbb5..6918ed9 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -6,11 +6,11 @@ All notable changes to the Yumma CSS Intellisense will be documented in this fil
 
 ### Added
 
-- Add breakpoints, modifiers completions and hovers
+- Add support for `sm:*`, `md:*`, `lg:*`, `xxl:*` and `h:*` variants for hover providers.
 
 ### Changed
 
-- Rename `yumma.ts` to `index.ts`
+- Rename `yumma.ts` to `index.ts`.
 
 ### Removed
 
diff --git a/src/providers/hoverProvider.ts b/src/providers/hoverProvider.ts
index f4fbb25..8e68ac7 100644
--- a/src/providers/hoverProvider.ts
+++ b/src/providers/hoverProvider.ts
@@ -35,6 +35,36 @@ export const hoverProvider = vscode.languages.registerHoverProvider(
       const range = new vscode.Range(start, end);
       const word = document.getText(range);
       const escapedWord = word.replace(/:/g, "\\:");
+      
+      if (word.startsWith("h:")) {
+        const baseClass = word.slice(2);
+        const colorUtil = colorUtils.find((colorUtil) =>
+          baseClass.startsWith(colorUtil.classPrefix)
+        );
+
+        if (colorUtil) {
+          const color = baseColors.find(
+            (color) =>
+              `${colorUtil.classPrefix}${color.className}` === baseClass
+          );
+
+          if (color) {
+            const markdownString = new vscode.MarkdownString();
+
+            markdownString.appendCodeblock(
+              `.${escapedWord}:hover {\n  ${colorUtil.classValue}: ${color.classValue};\n}`,
+              "css"
+            );
+
+            markdownString.appendMarkdown(
+              `\n\nThe [${word}](${baseUrl}${colorUtil.classLink}) color utility only applies when the element is hovered.`
+            );
+
+            markdownString.isTrusted = true;
+            return new vscode.Hover(markdownString, range);
+          }
+        }
+      }
 
       const colorUtil = colorUtils.find((colorUtil) =>
         word.startsWith(colorUtil.classPrefix)
@@ -121,7 +151,7 @@ export const hoverProvider = vscode.languages.registerHoverProvider(
                   "css"
                 );
                 markdownString.appendMarkdown(
-                  `\n\nThe [${word}](${baseUrl}${utilClass.classLink}) utility only acts when you are hovering.`
+                  `\n\nThe [${word}](${baseUrl}${utilClass.classLink}) utility only applies when the element is hovered.`
                 );
                 markdownString.isTrusted = true;
 
@@ -160,7 +190,7 @@ export const hoverProvider = vscode.languages.registerHoverProvider(
                   "css"
                 );
                 markdownString.appendMarkdown(
-                  `\n\nThe [${word}](${baseUrl}${utilClass.classLink}) utility will only apply when the specified viewport is reached.`
+                  `\n\nThe [${word}](${baseUrl}${utilClass.classLink}) utility only applies when the specified viewport is reached.`
                 );
                 markdownString.isTrusted = true;