Merge branch 'main' of github.com:sass/sass-site into playground-copy

.gitignore

@@ -22,6 +22,9 @@ Thumbs.db
 /_site/
 /source/assets/dist/
 
+# Generated file
+/source/assets/js/playground/module-metadata.ts
+
 # NPM/Yarn
 node_modules/
 yarn-debug.log*

.prettierignore

@@ -6,6 +6,7 @@
 /_site/
 /source/_data/versionCache.json
 /source/assets/dist/
+/source/assets/js/playground/module-metadata.ts
 /source/assets/js/vendor/**
 /source/assets/sass/vendor/
 /source/documentation/js-api

package.json

@@ -20,16 +20,20 @@
     "clean-version-cache": "rm -f source/_data/versionCache.json",
     "build:sass": "sass --style=compressed ./source/assets/sass/sass.scss:./source/assets/dist/css/sass.css ./source/assets/sass/noscript.scss:./source/assets/dist/css/noscript.css",
     "watch:sass": "sass --watch ./source/assets/sass/sass.scss:./source/assets/dist/css/sass.css ./source/assets/sass/noscript.scss:./source/assets/dist/css/noscript.css",
-    "build-dev:scripts": "rollup -c",
-    "build-prod:scripts": "NODE_ENV=production BABEL_ENV=production rollup -c",
-    "watch:scripts": "npm run build-dev:scripts -- -w",
+    "build-module-metadata": "ts-node tool/generate-module-metadata.ts",
+    "build-rollup": "rollup -c",
+    "watch-rollup": "rollup -c -w",
+    "build-dev:scripts": "run-s build-module-metadata build-rollup",
+    "build-prod:scripts": "NODE_ENV=production BABEL_ENV=production npm run build-dev:scripts",
+    "watch:scripts": "run-s build-module-metadata watch-rollup",
     "build:typedoc": "./tool/typedoc-build.sh",
     "build:11ty": "NODE_OPTIONS='-r ts-node/register' eleventy",
     "watch:11ty": "npm run build:11ty -- --serve --incremental",
     "check": "run-s check:gts check:tsc check:stylelint",
     "check:gts": "gts check",
     "check:stylelint": "stylelint 'source/assets/sass/*.{css,scss}'",
-    "check:tsc": "tsc --noEmit",
+    "tsc:no-emit": "tsc --noEmit",
+    "check:tsc": "run-s build-module-metadata tsc:no-emit",
     "fix": "run-s fix:gts fix:stylelint",
     "fix:gts": "gts fix",
     "fix:stylelint": "stylelint 'source/assets/sass/*.{css,scss}' --fix",
@@ -98,7 +102,7 @@
     "prettier": "^3.3.3",
     "prismjs": "^1.29.0",
     "rollup": "^4.21.3",
-    "sass": "^1.78.0",
+    "sass": "^1.79.2",
     "semver": "^7.6.3",
     "stylelint": "^15.11.0",
     "stylelint-config-standard-scss": "^11.1.0",

source/_data/documentation.yml

@@ -76,6 +76,8 @@ toc:
       - Functions and Mixins Beginning with <code>--</code>: /documentation/breaking-changes/css-function-mixin/
       - Mixed Declarations: /documentation/breaking-changes/mixed-decls/
       - <code>meta.feature-exists</code>: /documentation/breaking-changes/feature-exists/
+      - Color Functions: /documentation/breaking-changes/color-functions/
+      - Legacy JS API: /documentation/breaking-changes/legacy-js-api/
   - Command Line: /documentation/cli/
     :children:
       - Dart Sass: /documentation/cli/dart-sass/

source/_includes/silencing_deprecations.liquid

@@ -55,9 +55,3 @@ option] in the JavaScript API.
 
 [`--silence-deprecation` flag]: /documentation/cli/dart-sass/#silence-deprecation
 [`silenceDeprecations` option]: /documentation/js-api/interfaces/Options/#silenceDeprecations
-
-{% headsUp %}
-  This option is only available in the [modern JS API].
-
-  [modern JS API]: /documentation/js-api/#md:usage
-{% endheadsUp %}

source/assets/js/playground.ts

@@ -14,6 +14,7 @@ import {
 } from './playground/editor-setup.js';
 import {
   ParseResult,
+  PlaygroundSelection,
   PlaygroundState,
   customLoader,
   deserializeState,
@@ -111,9 +112,7 @@ function setupPlayground(): void {
    * Returns a playground state selection for the current single non-empty
    * selection, or `null` otherwise.
    */
-  function editorSelectionToStateSelection():
-    | PlaygroundState['selection']
-    | null {
+  function editorSelectionToStateSelection(): PlaygroundSelection {
     const sel = editor.state.selection;
     if (sel.ranges.length !== 1) return null;
 
@@ -130,7 +129,7 @@ function setupPlayground(): void {
     ];
   }
 
-  /** Updates the editor's selection based on `playgroundState.selection`. */
+  /** Updates the {@link editor}'s selection based on `{@link playgroundState.selection}`. */
   function updateSelection(): void {
     if (playgroundState.selection === null) {
       const sel = editor.state.selection;
@@ -162,6 +161,13 @@ function setupPlayground(): void {
     }
   }
 
+  /** Highlights {@link selection} and focuses on the {@link editor}. */
+  function goToSelection(selection: PlaygroundSelection): void {
+    playgroundState.selection = selection;
+    updateSelection();
+    editor.focus();
+  }
+
   // Apply initial state to dom
   function applyInitialState(): void {
     updateButtonState();
@@ -301,8 +307,22 @@ function setupPlayground(): void {
       '.sl-c-playground__console'
     ) as HTMLDivElement;
     console.innerHTML = playgroundState.debugOutput
-      .map(displayForConsoleLog)
+      .map(item => displayForConsoleLog(item, playgroundState))
       .join('\n');
+    console.querySelectorAll('a.console-location').forEach(link => {
+      (link as HTMLAnchorElement).addEventListener('click', event => {
+        if (!(event.metaKey || event.altKey || event.shiftKey)) {
+          event.preventDefault();
+        }
+        const range = (event.currentTarget as HTMLAnchorElement).dataset.range
+          ?.split(',')
+          .map(n => parseInt(n));
+        if (range && range.length === 4) {
+          const [fromL, fromC, toL, toC] = range;
+          goToSelection([fromL, fromC, toL, toC]);
+        }
+      });
+    });
   }
 
   function updateDiagnostics(): void {