vscode-scss
vscode-scss copied to clipboard
How to hint possible values for a function parameter from an existing map?
- VS Code Version: 1.67
- SCSS IntelliSense Version: 0.10.0
- Operating System: Windows 10
Reproducible Case:
$brand-colors: (
dark-blue: #374c63,
blue: #0055a0,
// ...
);
@function brand-color($name) {
@if map-has-key($brand-colors, $name) {
@return map-get($brand-colors, $name);
}
@else {
@warn 'Brand color ' $name ' not found';
@return 'unset';
}
}
$color: brand-color(); // <-- Which $name are allowed?..
Steps to Reproduce:
- Use the code above
- Try intellisense on the function parameter
- Observe how it doesn't (and currently, cannot) know which values are permitted.
I would like to be able to hint to SCSS Intellisense what sort of values are permitted to pass into brand-color in the $name parameter. I want to populate that list of hints with the keys from an exisiting map, which is $brand-colors in the above example.
I was thinking JSdoc-style hints:
/// Description of brand-colors and whatall.
/// @param {keyof $brand-colors} $name The name of a color.
/// @returns {string} A color.
@function brand-color($name) {
// ...
}
This could be enough information to provide such hints. I know Typescript (and Javascript to an extend) can do this, so I don't know why any other language couldn't do the same.
Sound good?