fix: exclude sass globals if suggestFromUseOnly (#211)

With the limitation that VSCode will still suggest them (at time of
writing) because of the built-in SCSS language feature.

packages/language-services/src/features/__tests__/do-complete-modules.test.ts

@@ -1155,3 +1155,28 @@ test("should suggest symbol from a different document via @use with wildcard ali
 		},
 	);
 });
+
+test("does not suggest sass globals if suggestFromUseOnly is true", async () => {
+	ls.configure({
+		completionSettings: {
+			suggestFromUseOnly: true,
+		},
+	});
+
+	const document = fileSystemProvider.createDocument("@debug co");
+	const { items } = await ls.doComplete(document, Position.create(0, 9));
+	assert.isUndefined(items.find((item) => item.label === "comparable"));
+});
+
+// We don't call the upstream for suggestions here since we got complaints about duplicates
+test.skip("does suggest sass globals if suggestFromUseOnly is false", async () => {
+	ls.configure({
+		completionSettings: {
+			suggestFromUseOnly: false,
+		},
+	});
+
+	const document = fileSystemProvider.createDocument("@debug co");
+	const { items } = await ls.doComplete(document, Position.create(0, 9));
+	assert.isOk(items.find((item) => item.label === "comparable"));
+});

packages/language-services/src/features/do-complete.ts

@@ -320,21 +320,6 @@ export class DoComplete extends LanguageFeature {
 			}
 
 			return result;
-
-			// // If we don't have any suggestions, maybe upstream does
-			// const upstreamResult = await upstreamLs.doComplete2(
-			// 	document,
-			// 	position,
-			// 	stylesheet,
-			// 	this.getDocumentContext(),
-			// 	{
-			// 		...this.configuration.completionSettings,
-			// 		triggerPropertyValueCompletion:
-			// 			this.configuration.completionSettings
-			// 				?.triggerPropertyValueCompletion || false,
-			// 	},
-			// );
-			// return upstreamResult;
 		}
 
 		const upstreamResult = await upstreamLs.doComplete2(

packages/vscode-css-languageservice/src/cssLanguageTypes.ts

@@ -91,6 +91,7 @@ export type LintSettings = { [key: string]: any };
 export interface CompletionSettings {
 	triggerPropertyValueCompletion: boolean;
 	completePropertyWithSemicolon?: boolean;
+	suggestFromUseOnly?: boolean;
 }
 
 export interface LanguageSettings {

packages/vscode-css-languageservice/src/services/scssCompletion.ts

@@ -24,6 +24,8 @@ interface IFunctionInfo {
 	func: string;
 	desc?: string;
 	type?: string;
+	/** If true, doesn't have an equivalent in the module system and should be suggested regardless of suggestFromUseOnly */
+	noModule?: boolean;
 }
 
 const sassDocumentationName = l10n.t("Sass documentation");
@@ -55,21 +57,21 @@ export class SCSSCompletion extends CSSCompletion {
 		{ func: "hue($color)", desc: l10n.t("Gets the hue component of a color.") },
 		{ func: "saturation($color)", desc: l10n.t("Gets the saturation component of a color.") },
 		{ func: "lightness($color)", desc: l10n.t("Gets the lightness component of a color.") },
-		{ func: "adjust-hue($color, $degrees)", desc: l10n.t("Changes the hue of a color.") },
-		{ func: "lighten($color, $amount)", desc: l10n.t("Makes a color lighter.") },
-		{ func: "darken($color, $amount)", desc: l10n.t("Makes a color darker.") },
+		{ func: "adjust-hue($color, $degrees)", desc: l10n.t("Changes the hue of a color."), noModule: true },
+		{ func: "lighten($color, $amount)", desc: l10n.t("Makes a color lighter."), noModule: true },
+		{ func: "darken($color, $amount)", desc: l10n.t("Makes a color darker."), noModule: true },
 		{ func: "saturate($color, $amount)", desc: l10n.t("Makes a color more saturated.") },
-		{ func: "desaturate($color, $amount)", desc: l10n.t("Makes a color less saturated.") },
+		{ func: "desaturate($color, $amount)", desc: l10n.t("Makes a color less saturated."), noModule: true },
 		{ func: "grayscale($color)", desc: l10n.t("Converts a color to grayscale.") },
 		{ func: "complement($color)", desc: l10n.t("Returns the complement of a color.") },
 		{ func: "invert($color)", desc: l10n.t("Returns the inverse of a color.") },
 		{ func: "alpha($color)", desc: l10n.t("Gets the opacity component of a color.") },
 		{ func: "opacity($color)", desc: "Gets the alpha component (opacity) of a color." },
 		{ func: "rgba($color, $alpha)", desc: l10n.t("Changes the alpha component for a color.") },
-		{ func: "opacify($color, $amount)", desc: l10n.t("Makes a color more opaque.") },
-		{ func: "fade-in($color, $amount)", desc: l10n.t("Makes a color more opaque.") },
-		{ func: "transparentize($color, $amount)", desc: l10n.t("Makes a color more transparent.") },
-		{ func: "fade-out($color, $amount)", desc: l10n.t("Makes a color more transparent.") },
+		{ func: "opacify($color, $amount)", desc: l10n.t("Makes a color more opaque."), noModule: true },
+		{ func: "fade-in($color, $amount)", desc: l10n.t("Makes a color more opaque."), noModule: true },
+		{ func: "transparentize($color, $amount)", desc: l10n.t("Makes a color more transparent."), noModule: true },
+		{ func: "fade-out($color, $amount)", desc: l10n.t("Makes a color more transparent."), noModule: true },
 		{
 			func: "adjust-color($color, [$red], [$green], [$blue], [$hue], [$saturation], [$lightness], [$alpha])",
 			desc: l10n.t("Increases or decreases one or more components of a color."),
@@ -369,6 +371,16 @@ export class SCSSCompletion extends CSSCompletion {
 		result: CompletionList,
 	): CompletionList {
 		for (const p of proposals) {
+			if (this.documentSettings?.suggestFromUseOnly) {
+				// If the user has a preference to avoid globals, exclude
+				// the proposal unless it has no equivalent in the module
+				// system. This affects older color functions like
+				// adjust-hue https://sass-lang.com/documentation/modules/color/#adjust-hue
+				if (!p.noModule) {
+					continue;
+				}
+			}
+
 			const insertText = p.func.replace(/\[?(\$\w+)\]?/g, this.createReplaceFunction());
 			const label = p.func.substr(0, p.func.indexOf("("));
 			const item: CompletionItem = {