some-sass

What's Changed

• Added color decorators where variables are used by @wkillerud in https://github.com/wkillerud/vscode-scss/pull/59

Full Changelog: https://github.com/wkillerud/vscode-scss/compare/2.13.1...2.14.0

Fix a needless limitation in completion suggestions, where they would not show the same rich information as on hover. https://github.com/wkillerud/vscode-scss/pull/58

There's a known limitation for color suggestions. VS Code does not support markdown documentation for color suggestions (yet), so they may look a bit different from on hover.

Full Changelog: https://github.com/wkillerud/vscode-scss/compare/2.13.0...2.13.1

New setting: Suggestion Style

Mixins with @content SassDoc annotations and %placeholders get two suggestions by default:

• One without { }.
• One with { }. This one creates a new block, and moves the cursor inside the block.

If you find this noisy, you can control which suggestions you would like to see:

• All suggestions (default).
• No brackets.
• Only brackets. This still includes other suggestions, where there are no brackets to begin with.

Bugfix for placeholder suggestions

Fixed an issue of missing suggestions when hitting Cmd/Ctrl+Space, when there was text after %.

%chat|  /* Should see for instance %chatSearch when hitting ctrl+space */

Full Changelog: https://github.com/wkillerud/vscode-scss/compare/2.12.0...2.13.0

What's Changed

Add code suggestions when implementing placeholder selectors, based on tracked usages (#54).

https://user-images.githubusercontent.com/1223410/235316476-635b727c-a838-45ff-b282-76f821e8fb1d.mp4

The video and fixtures demo with @use, but this setup with @import works as well:

main.scss
_discord.scss
_theme.scss

/* main */
@import "./theme";
@import "./discord";

/* discord */
.app-asdfqwer1234 {
  @extend %app !optional;
}

.chat-qwerasdf1234 {
  @extend %chat !optional;
}

/* theme */
%| /* suggests %app and %chat */

• Improvements to placeholder selectors by @wkillerud in https://github.com/wkillerud/vscode-scss/pull/54

Full Changelog: https://github.com/wkillerud/vscode-scss/compare/2.11.2...2.12.0

What's Changed

• Fix a crash in workspaces with multiple folders by @wkillerud in https://github.com/wkillerud/vscode-scss/pull/53 (fixes #52)

Full Changelog: https://github.com/wkillerud/vscode-scss/compare/2.11.1...2.11.2

• Add % as a completion trigger character by @wkillerud in https://github.com/wkillerud/vscode-scss/pull/50

Full Changelog: https://github.com/wkillerud/vscode-scss/compare/2.11.0...2.11.1

This release brings all the bells and whistles to placeholder selectors:

• Completions
• Hover info, with Sassdoc
• Go to definition
• Find all references
• Rename symbol

What's Changed

• Add support for placeholder selectors in https://github.com/wkillerud/vscode-scss/pull/45
• Add documentation for string.split() in https://github.com/wkillerud/vscode-scss/pull/46

Full Changelog: https://github.com/wkillerud/vscode-scss/compare/2.10.0...2.11.0

What's Changed

https://user-images.githubusercontent.com/1223410/224561851-e76400ba-fd1b-46f2-a0bd-549117a120c2.mp4

• feat: completion suggestions when importing modules by @wkillerud in https://github.com/wkillerud/vscode-scss/pull/40
• chore: upgrade dependencies by @wkillerud in https://github.com/wkillerud/vscode-scss/pull/39

Full Changelog: https://github.com/wkillerud/vscode-scss/compare/2.9.0...2.10.0

What's Changed

• fix: read modern color formats in completions by @wkillerud in https://github.com/wkillerud/vscode-scss/pull/29
• feat: resolve the base value behind variables by @wkillerud in https://github.com/wkillerud/vscode-scss/pull/30

Some housekeeping

• chore: simplify launch configuration by @wkillerud in https://github.com/wkillerud/vscode-scss/pull/31
• chore: remove redundant custom settings by @wkillerud in https://github.com/wkillerud/vscode-scss/pull/32
• chore: upgrade dependencies by @wkillerud in https://github.com/wkillerud/vscode-scss/pull/33
• chore: split client and server in separate packages by @wkillerud in https://github.com/wkillerud/vscode-scss/pull/34

Full Changelog: https://github.com/wkillerud/vscode-scss/compare/2.8.0...2.9.0

What's Changed

Rename symbol

• feat: rename symbol across workspace by @wkillerud in https://github.com/wkillerud/vscode-scss/pull/28

The headline feature is the implementation of Rename symbol support for variables, functions and mixins.

If you use @forward prefixes, only the base un-prefixed part of the symbol name will be renamed.

https://user-images.githubusercontent.com/1223410/209580840-eb059379-8c4a-4b5b-b0df-eb241110b783.mp4

Bugfixes

• fix: don't include all parameters of mixin/function in references, only the one we're after by @wkillerud in https://github.com/wkillerud/vscode-scss/pull/28
• fix: include forward visibility references (hide) for mixins and functions by @wkillerud in https://github.com/wkillerud/vscode-scss/pull/28
• fix: go to definition works for mixins and functions when used in forward visibility (hide) by @wkillerud in https://github.com/wkillerud/vscode-scss/pull/28

Full Changelog: https://github.com/wkillerud/vscode-scss/compare/2.7.1...2.8.0

What's Changed

• fix: completions don't crash if SassDoc type is undefined by @wkillerud in https://github.com/wkillerud/vscode-scss/pull/26

Full Changelog: https://github.com/wkillerud/vscode-scss/compare/2.7.0...2.7.1

What's Changed

• feat: extract code actions by @wkillerud in https://github.com/wkillerud/vscode-scss/pull/25

Available when you have an active selection. Pick between extracting to a variable, function or mixin.

See the Refactoring chapter of the VS Code documentation to see how to use this feature.

Full Changelog: https://github.com/wkillerud/vscode-scss/compare/2.6.4...2.7.0

What's Changed

• Fix color previews in code suggestions (#24)
• Dependency updates (#23, #24)

Full Changelog: https://github.com/wkillerud/vscode-scss/compare/2.6.3...2.6.4

What's Changed

• fix: update files on branch change by @wkillerud in https://github.com/wkillerud/vscode-scss/pull/21
• fix: resolve the real path to links in the parser for immediate updates in monorepos by @wkillerud in https://github.com/wkillerud/vscode-scss/pull/22

Full Changelog: https://github.com/wkillerud/vscode-scss/compare/2.6.2...2.6.3

What's Changed

• fix: avoid call stack overflow if the current file links to itself
• fix: code completion in string interpolations with preceding non-space characters (--negative-font-size: -#{ns.$font-size-1})
• fix: code completion in @return statements with expressions (@return $var * math.$pi)
• fix: code completion on the right side of a multiplication
• fix: include any parameter SassDoc in function/mixin signature helper popup

Full Changelog: https://github.com/wkillerud/vscode-scss/compare/2.6.1...2.6.2

What's Changed

• fix: root imports for scoped npm packages by @wkillerud in https://github.com/wkillerud/vscode-scss/pull/17, reported by @GrimLink in #16

Full Changelog: https://github.com/wkillerud/vscode-scss/compare/2.6.0...2.6.1

What's Changed

• feat: web extension support
• fix: display bug for SassDoc @see

Web Extension

Big changes under the hood made it possible to have Some Sass run as a web extension. In short, you can now use Some Sass on vscode.dev, github.dev, or anywhere else you might find Visual Studio Code in the browser.

Here we can see a familiar SassDoc preview while browsing through code over at github.dev/fylgja/fylgja.

https://user-images.githubusercontent.com/1223410/183478220-13741900-1d65-4eb3-a398-fb3f4f06cb09.mp4

What's shipping

Almost everything should work as you expect from the desktop version:

• Full support for @use and @forward.
• Smart module-based code completion.
• SassDoc previews and authoring tools (generate SassDoc blocks, annotation completions and hover info).
• Go to Definition.
• Documentation and completions for Sass built-in modules.
• And probably more that I'm forgetting.

One known limitation is that since node_modules is not available in the browser, these features will only work on code in the project.

How to get it

Depending on your setup (whether you are logged in with Setting Sync or not), you may need to go to the Extension Marketplace and install Some Sass manually. Once installed, you may need to:

• Close and reopen an SCSS-file (or a Vue, Svelte, or Astro file)
• Reload the browser window

Depending on the workspace size as well, Some Sass may need a few seconds to initialize.

Other changes

This release doesn't have that much new for users of the regular desktop version.

If you use the @see annotation in SassDoc, this release fixes a bug where it would show as [object Object] on hover. (https://github.com/wkillerud/vscode-scss/pull/15/commits/21b359a1a943cdff9710673cd6829cd618f4170d)

Full Changelog: https://github.com/wkillerud/vscode-scss/compare/2.5.0...2.6.0

What's Changed

Here's a quick summary of the changes in this version:

• feat: add support for SCSS in Astro
• feat: suggest choices for parameters documented with SassDoc where the parameter type is a TypeScript-like string literal union type
• fix: code suggestions no longer include optional parameters by default
• fix: code suggestions now work inside #{interpolation} when using namespaces
• fix: code suggestions inside Vue and Svelte (and now Astro) no longer add a duplicate $ for variables, or . when using namespaces
• docs: add tip about configuring Emmet when using Vue, Svelte or Astro

Add support for Astro

Now you can get all the niceties of Some Sass when you write your styles in Astro.

Along with support for this somewhat familiar component syntax, this version ships bugfixes for some pretty annoying details in code completion when inside a Vue or Svelte file. The number of extra $ and . signs should now be greatly reduced.

https://user-images.githubusercontent.com/1223410/181904945-3b7b4c8b-c951-4ae9-b377-e3c92ff482f0.mp4

Use SassDoc to suggest choices

If you use SassDoc (which I wholeheartedly recommend), this version adds a new feature to code suggestions.

Let's say you have a function or mixin that expects only a set of string values. You might document it this way with a string literal union type.

/// Get a timing value for use in animations.
/// @param {"sonic" | "link" | "homer" | "snorlax"} $mode - The timing you want
/// @return {String} - the timing value in ms
@function timing($mode) {
    @if map.has-key($_timings, $mode) {
        @return map.get($_timings, $mode);
    } @else {
        @error 'Unable to find a mode for #{$mode}';
    }
}

Now Some Sass understands that type annotation and uses it to give the user of the function or mixin a list of choices from that type.

https://user-images.githubusercontent.com/1223410/181905146-fc369b7d-5de7-45b3-a4f4-7b80bd92dde5.mp4

Other changes

When a function or mixin has optional parameters Some Sass now suggests two variations in code completion:

1. Higher ranked: the function or mixin without optional parameters.
2. Lower ranked: the function or mixin with all parameters.

If you want the full parameter list, hit Arrow key down.

Finally, this version fixes a bug in #{interpolation}. Now namespaces work as you would expect, so you can finally get suggestions when you make CSS variables from SCSS constants.

Full Changelog: https://github.com/wkillerud/vscode-scss/compare/2.4.0...2.5.0

New features

• Find all references to variables, mixins and functions. (in https://github.com/wkillerud/vscode-scss/pull/11)
• Find all references to Sass built-in functions and variables. (in https://github.com/wkillerud/vscode-scss/pull/11)

https://user-images.githubusercontent.com/1223410/180661742-53a18669-d90a-4e03-a727-18a1390dac1e.mp4

• For mixins with @content SassDoc annotation, add and prefer a suggestion without brackets. The one with brackets now needs an Arrow Down keypress to use. (in https://github.com/wkillerud/vscode-scss/pull/11)

https://user-images.githubusercontent.com/1223410/180661751-461e85e9-e3e6-4e68-a8d2-f8f87aa57411.mp4

Bugfixes

• Don't give signature help for CSS functions with the same name, for instance scale(). (in https://github.com/wkillerud/vscode-scss/pull/11)
• Don't give hover information for CSS functions with the same name, for instance scale(). (in https://github.com/wkillerud/vscode-scss/pull/11)
• Fix default exclude patterns so they work as expected when used with micromatch. (in https://github.com/wkillerud/vscode-scss/pull/11)

Housekeeping

• Update dependencies (in https://github.com/wkillerud/vscode-scss/pull/10)

Full Changelog: https://github.com/wkillerud/vscode-scss/compare/2.3.0...2.4.0

What's Changed

• Completions, hover info and signature suggestions for Sass built-in modules in @use by @wkillerud in https://github.com/wkillerud/vscode-scss/pull/7

https://user-images.githubusercontent.com/1223410/173416411-930c310e-b0cb-4d85-8dab-761eb39fdd36.mp4

Full Changelog: https://github.com/wkillerud/vscode-scss/compare/2.2.0...2.3.0