sass-mq 6.0.0 → 7.0.0-beta.1

package/CHANGELOG.md

@@ -7,6 +7,24 @@ and this project adheres to [Semantic Versioning](http://semver.org/).
 
 <!-- ## Unreleased -->
 
+## v7.0.0 - 2024-10-24
+
+This is a major version bump that contains no breaking changes but may require a newer version of Sass. It ensures compatibility with the latest version of dart-sass and removes support for `@import`, as [`@import` is officially deprecated as of sass-dart 1.80.0](https://sass-lang.com/blog/import-is-deprecated/).
+
+### Added
+
+- Support for dart-sass >= 1.80.0 (without deprecation warnings)
+
+### Changed
+
+- BREAKING CHANGE: Dropped support for `@import` (use [sass-mq v6.0.0](https://github.com/sass-mq/sass-mq/tree/v6.0.0) if you need backward compatibility with `@import`)
+- Updated all global Sass functions to use their module equivalents (for example: `type-of` ➡️ `meta.type-of`, `slice` ➡️ `string.slice`), silencing deprecation warnings introduced in dart-sass 1.80.0
+
+### Chores
+
+- Upgraded Jest and Sass True dependencies to unlock testing with the latest versions of `sass-dart`
+- Fixed a test where a space was missing between `and` and `(` in the generated CSS (caused by the latest version of Sass)
+
 ## v6.0.0 - 2022-01-10
 
 This is a major version bump that contains breaking changes. It adds support for the [new Sass module system](https://sass-lang.com/blog/the-module-system-is-launched), drops support for Eyeglass, and drops support for deprecated versions of Sass. No new features were added.
@@ -38,8 +56,6 @@ See the updated [README](https://github.com/sass-mq/sass-mq/blob/main/README.md)
 - Removed usage of `unit()` in favor of [`math.compatible()`](https://sass-lang.com/documentation/modules/math#compatible), as the `unit()` function is intended for debugging, and its output format is not guaranteed to be consistent across Sass versions or implementations.
 - Updated all other global Sass functions to use their module equivalents (for example: `map-merge` ➡️ `map.merge`, `append` ➡️ `list.append`)
 
-### Fixed
-
 ## Changes prior to v6.0.0
 
 Changes prior to v6.0.0 were logged in https://github.com/sass-mq/sass-mq/releases

package/README.md

@@ -316,10 +316,9 @@ Please see the `examples` folder which contains a variety of examples on how to
 
 ### Backward compatibility with `@import`
 
-Just in case you need to have backward compatibility and want to use`@import` instead of `@use`,
-you can do so by importing `_mq.import.scss` instead of `_mq.scss`.
+As of sass-dart 1.80.0, `@import` is officially deprecated, and sass-mq v7.0.0 removes support for it.
 
-Please see `legacy.scss` on `examples` folder.
+[sass-mq v6.0.0](https://github.com/sass-mq/sass-mq/tree/v6.0.0) is the last version that supports `@import`.
 
 ## Running tests
 

package/_mq.scss

@@ -1,3 +1,5 @@
+@use "sass:meta";
+@use "sass:string";
 @use 'sass:math';
 @use 'sass:map';
 @use 'sass:list';
@@ -142,7 +144,7 @@ $media-type: all !default;
 
   // From: this breakpoint (inclusive)
   @if $from {
-    @if type-of($from) == number {
+    @if meta.type-of($from) == number {
       $min-width: px2em($from);
     } @else {
       $min-width: px2em(get-breakpoint-width($from, $breakpoints));
@@ -151,7 +153,7 @@ $media-type: all !default;
 
   // Until: that breakpoint (exclusive)
   @if $until {
-    @if type-of($until) == number {
+    @if meta.type-of($until) == number {
       $max-width: px2em($until);
     } @else {
       $max-width: px2em(get-breakpoint-width($until, $breakpoints)) - 0.01em;
@@ -171,7 +173,7 @@ $media-type: all !default;
   // Remove unnecessary media query prefix 'all and '
   @if ($media-type == 'all' and $media-query != '') {
     $media-type: '';
-    $media-query: str-slice(unquote($media-query), 6);
+    $media-query: string.slice(string.unquote($media-query), 6);
   }
 
   @media #{$media-type + $media-query} {
@@ -190,8 +192,8 @@ $media-type: all !default;
   $equal: ();
   $large: ();
 
-  @if length($list) > 1 {
-    $seed: list.nth($list, math.ceil(math.div(length($list), 2)));
+  @if list.length($list) > 1 {
+    $seed: list.nth($list, math.ceil(math.div(list.length($list), 2)));
 
     @each $item in $list {
       @if ($item == $seed) {
@@ -203,7 +205,7 @@ $media-type: all !default;
       }
     }
 
-    @return join(join(_quick-sort($less), $equal), _quick-sort($large));
+    @return list.join(list.join(_quick-sort($less), $equal), _quick-sort($large));
   }
 
   @return $list;
@@ -222,7 +224,7 @@ $media-type: all !default;
 
   // Reorder key/value pairs based on key values
   @each $value in $map-values-sorted {
-    $index: index($map-values, $value);
+    $index: list.index($map-values, $value);
     $key: list.nth($map-keys, $index);
     $map-sorted: map.merge(
       $map-sorted,

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "sass-mq",
   "description": "mq() is a Sass mixin that helps manipulating media queries in an elegant way.",
-  "version": "6.0.0",
+  "version": "7.0.0-beta.1",
   "keywords": [
     "responsive",
     "sass",
@@ -21,7 +21,6 @@
   ],
   "files": [
     "_mq.scss",
-    "_mq.import.scss",
     "CHANGELOG.md",
     "LICENSE.md",
     "README.md",
@@ -51,9 +50,9 @@
   "homepage": "https://sass-mq.github.io/sass-mq/",
   "devDependencies": {
     "glob": "^7.1.7",
-    "jest": "^27.0.4",
-    "sass": "^1.35.1",
-    "sass-true": "^6.0.1",
+    "jest": "^29.7.0",
+    "sass": "^1.80.4",
+    "sass-true": "^8.1.0",
     "sassdoc": "^2.7.3"
   }
 }

package/_mq.import.scss

@@ -1,2 +0,0 @@
-@forward 'mq' as mq-*;
-@forward 'mq' hide show-breakpoints, add-breakpoint, get-breakpoint-width, px2em, $media-type, $show-breakpoints, $breakpoints;