Repository: exadel-inc/esl
Pull request #2452 (2024-06-07 08:59:55)

feat(esl-media-query): ingore tuple values if query syntax passed
Closes: #2377 

codeclimate[bot]: Code Climate has analyzed commit cb0adc93 and detected **0 issues** on this pull request.

The test coverage on the diff in this pull request is **100.0%** (**50%** is the threshold).

This pull request will bring the total coverage in the repository to **65.3%** (**0.0%** change).

View more on [Code Climate](https://codeclimate.com/github/exadel-inc/esl/pull/2452).

codeclimate[bot]: Code Climate has analyzed commit fb87e98c and detected **0 issues** on this pull request.

The test coverage on the diff in this pull request is **100.0%** (**50%** is the threshold).

This pull request will bring the total coverage in the repository to **65.4%** (**0.1%** change).

View more on [Code Climate](https://codeclimate.com/github/exadel-inc/esl/pull/2452).

ala-n: The only open questions (for voting I guess) is the new method name and signature.

For the context:
The new method is used to parse query according to its syntax and based on user input so both
 `parse ('1 | 2 | 3', TUPPLE_MEDIA)` and `parse('@XS => 1 | @SM => 2 | @MD => 3', TUPPLE_MEDIA)` (TUPPLE_MEDIA provided but not used in that case) will be handled correctly.
 
 The purpose of creating this method appeared 
   - from the real project (where tupple with global media preset is used with potential usage of extended arrow syntax) 
   - and in purpose to extend carousel API 
     ```
       <esl-carousel media="@XS | @SM | @MD" count="1 | 2 | 3" ...>
       vs
       <esl-carousel count="1 | @SM => 2 | @MD => 3" ...>
     ```
     
Three is an existing method `parse` presented in ESLMediaRuleList but it can not be used to parse query in the mentioned way due to arguments order (array syntax and tupple media are the first arguments so it is mixed and depends on argument count)

1) So first of all we need a clear name for new method:
   a. `parseAddaptive` (currently in PR)
   b. `parseAuto`
   c. `autoparse`
   d. `autoParse`
   e. `parseAny`
   f. Your suggestion
   
2) The signature of the method is also a little bit questionable.
 I'd suggest to restrict it to 
 ```
 parseAdaptive(value: string, mask: string): ESLMediaRuleList;  
 parseAdaptive<U>(value: string, mask: string, parser: RulePayloadParser<U>): ESLMediaRuleList<U>;  
 ```
 
 We have a "low level" `parse` which accepts any argument count depending on what we are going to parse.
 The new method's purpose is always to parse uncertain user input, so providing media tuple is mandatory in that case.
 
 Please make me know if there is a concern with that point
 
 FYI: @exadel-inc/esl-all-contributors 

codeclimate[bot]: Code Climate has analyzed commit 438c1a9f and detected **4 issues** on this pull request.

Here's the issue category breakdown:

| Category | Count |
|:---:|:---:|
| Complexity | 2 |
| Duplication | 2 |


The test coverage on the diff in this pull request is **61.1%** (**50%** is the threshold).

This pull request will bring the total coverage in the repository to **64.7%** (**-0.5%** change).

View more on [Code Climate](https://codeclimate.com/github/exadel-inc/esl/pull/2452).


Patch:
diff --git a/.eslintrc.yml b/.eslintrc.yml
index eaf170754..0ed717b16 100644
--- a/.eslintrc.yml
+++ b/.eslintrc.yml
@@ -51,3 +51,6 @@ rules:
   'editorconfig/eol-last': warn
   # Require no trailing spaces
   'editorconfig/no-trailing-spaces': warn
+
+  # Exclude migration rules for 5.0.0-beta.24 revision
+  '@exadel/esl/deprecated-4/media-rule-list-parse': off
diff --git a/eslint/package.json b/eslint/package.json
index dcbac22b0..b54719889 100644
--- a/eslint/package.json
+++ b/eslint/package.json
@@ -20,7 +20,7 @@
     "build": "npm run clean && tsc --project tsconfig.build.json"
   },
   "dependencies": {
-    "semver": "^7.6.3"
+    "semver": "^7.6.2"
   },
   "peerDependencies": {
     "@exadel/esl": "*",
diff --git a/package-lock.json b/package-lock.json
index 3c843ce14..bfc396152 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -28,8 +28,8 @@
         "@semantic-release/npm": "^12.0.1",
         "@semantic-release/release-notes-generator": "^14.0.1",
         "@types/jest": "^29.5.12",
-        "@typescript-eslint/eslint-plugin": "^7.16.1",
-        "@typescript-eslint/parser": "^7.16.1",
+        "@typescript-eslint/eslint-plugin": "^7.16.0",
+        "@typescript-eslint/parser": "^7.16.0",
         "chokidar-cli": "^3.0.0",
         "concurrently": "^8.2.2",
         "copyfiles": "^2.4.1",
@@ -53,7 +53,7 @@
         "semantic-release": "^24.0.0",
         "smoothscroll-polyfill": "^0.4.4",
         "stylelint": "^16.7.0",
-        "stylelint-prettier": "^5.0.2",
+        "stylelint-prettier": "^5.0.1",
         "ts-jest": "^29.2.2",
         "typescript": "5.5.3"
       }
@@ -68,7 +68,7 @@
         "@types/puppeteer": "^7.0.4",
         "jest-image-snapshot": "^6.4.0",
         "jest-puppeteer": "^10.0.1",
-        "puppeteer": "^22.13.1",
+        "puppeteer": "^22.13.0",
         "stucumber": "^0.19.0"
       }
     },
@@ -77,7 +77,7 @@
       "version": "5.0.0-beta.24",
       "license": "MIT",
       "dependencies": {
-        "semver": "^7.6.3"
+        "semver": "^7.6.2"
       },
       "peerDependencies": {
         "@exadel/esl": "*",
@@ -174,6 +174,22 @@
         "url": "https://opencollective.com/11ty"
       }
     },
+    "node_modules/@11ty/eleventy-dev-server/node_modules/debug": {
+      "version": "4.3.5",
+      "resolved": "https://registry.npmjs.org/debug/-/debug-4.3.5.tgz",
+      "integrity": "sha512-pt0bNEmneDIvdL1Xsd9oDQ/wrQRkXDT4AUWlNZNPKvW5x/jyO9VFXkJUP07vQ2upmw5PlaITaPKc31jK13V+jg==",
+      "dependencies": {
+        "ms": "2.1.2"
+      },
+      "engines": {
+        "node": ">=6.0"
+      },
+      "peerDependenciesMeta": {
+        "supports-color": {
+          "optional": true
+        }
+      }
+    },
     "node_modules/@11ty/eleventy-dev-server/node_modules/mime": {
       "version": "3.0.0",
       "resolved": "https://registry.npmjs.org/mime/-/mime-3.0.0.tgz",
@@ -2671,18 +2687,18 @@
       "integrity": "sha512-j7P6Rgr3mmtdkeDGTe0E/aYyWEWVtc5yFXtHCRHs28/jptDEWfaVOc5T7cblqy1XKPPfCxJc/8DwQ5YgLOZOVQ=="
     },
     "node_modules/@puppeteer/browsers": {
-      "version": "2.2.4",
-      "resolved": "https://registry.npmjs.org/@puppeteer/browsers/-/browsers-2.2.4.tgz",
-      "integrity": "sha512-BdG2qiI1dn89OTUUsx2GZSpUzW+DRffR1wlMJyKxVHYrhnKoELSDxDd+2XImUkuWPEKk76H5FcM/gPFrEK1Tfw==",
-      "dependencies": {
-        "debug": "^4.3.5",
-        "extract-zip": "^2.0.1",
-        "progress": "^2.0.3",
-        "proxy-agent": "^6.4.0",
-        "semver": "^7.6.2",
-        "tar-fs": "^3.0.6",
-        "unbzip2-stream": "^1.4.3",
-        "yargs": "^17.7.2"
+      "version": "2.2.3",
+      "resolved": "https://registry.npmjs.org/@puppeteer/browsers/-/browsers-2.2.3.tgz",
+      "integrity": "sha512-bJ0UBsk0ESOs6RFcLXOt99a3yTDcOKlzfjad+rhFwdaG1Lu/Wzq58GHYCDTlZ9z6mldf4g+NTb+TXEfe0PpnsQ==",
+      "dependencies": {
+        "debug": "4.3.4",
+        "extract-zip": "2.0.1",
+        "progress": "2.0.3",
+        "proxy-agent": "6.4.0",
+        "semver": "7.6.0",
+        "tar-fs": "3.0.5",
+        "unbzip2-stream": "1.4.3",
+        "yargs": "17.7.2"
       },
       "bin": {
         "browsers": "lib/cjs/main-cli.js"
@@ -2691,6 +2707,36 @@
         "node": ">=18"
       }
     },
+    "node_modules/@puppeteer/browsers/node_modules/lru-cache": {
+      "version": "6.0.0",
+      "resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-6.0.0.tgz",
+      "integrity": "sha512-Jo6dJ04CmSjuznwJSS3pUeWmd/H0ffTlkXXgwZi+eq1UCmqQwCh+eLsYOYCwY991i2Fah4h1BEMCx4qThGbsiA==",
+      "dependencies": {
+        "yallist": "^4.0.0"
+      },
+      "engines": {
+        "node": ">=10"
+      }
+    },
+    "node_modules/@puppeteer/browsers/node_modules/semver": {
+      "version": "7.6.0",
+      "resolved": "https://registry.npmjs.org/semver/-/semver-7.6.0.tgz",
+      "integrity": "sha512-EnwXhrlwXMk9gKu5/flx5sv/an57AkRplG3hTK68W7FRDN+k+OWBj65M7719OkA82XLBxrcX0KSHj+X5COhOVg==",
+      "dependencies": {
+        "lru-cache": "^6.0.0"
+      },
+      "bin": {
+        "semver": "bin/semver.js"
+      },
+      "engines": {
+        "node": ">=10"
+      }
+    },
+    "node_modules/@puppeteer/browsers/node_modules/yallist": {
+      "version": "4.0.0",
+      "resolved": "https://registry.npmjs.org/yallist/-/yallist-4.0.0.tgz",
+      "integrity": "sha512-3wdGidZyq5PB084XLES5TpOSRA3wjXAlIWMhum2kRcv/41Sn2emQ0dycQW4uZXLejwKvg6EsvbdlVL+FYEct7A=="
+    },
     "node_modules/@sec-ant/readable-stream": {
       "version": "0.4.1",
       "resolved": "https://registry.npmjs.org/@sec-ant/readable-stream/-/readable-stream-0.4.1.tgz",
@@ -3880,16 +3926,16 @@
       "integrity": "sha512-d4GpH4uPYp9W07kc487tiq6V/EUHl18vZWFMbQoe4Sk9LXEWzFi/BMf9x7TI4m7/j7gU3KeX8H6M8aPBgykeLw=="
     },
     "node_modules/@typescript-eslint/eslint-plugin": {
-      "version": "7.16.1",
-      "resolved": "https://registry.npmjs.org/@typescript-eslint/eslint-plugin/-/eslint-plugin-7.16.1.tgz",
-      "integrity": "sha512-SxdPak/5bO0EnGktV05+Hq8oatjAYVY3Zh2bye9pGZy6+jwyR3LG3YKkV4YatlsgqXP28BTeVm9pqwJM96vf2A==",
+      "version": "7.16.0",
+      "resolved": "https://registry.npmjs.org/@typescript-eslint/eslint-plugin/-/eslint-plugin-7.16.0.tgz",
+      "integrity": "sha512-py1miT6iQpJcs1BiJjm54AMzeuMPBSPuKPlnT8HlfudbcS5rYeX5jajpLf3mrdRh9dA/Ec2FVUY0ifeVNDIhZw==",
       "dev": true,
       "dependencies": {
         "@eslint-community/regexpp": "^4.10.0",
-        "@typescript-eslint/scope-manager": "7.16.1",
-        "@typescript-eslint/type-utils": "7.16.1",
-        "@typescript-eslint/utils": "7.16.1",
-        "@typescript-eslint/visitor-keys": "7.16.1",
+        "@typescript-eslint/scope-manager": "7.16.0",
+        "@typescript-eslint/type-utils": "7.16.0",
+        "@typescript-eslint/utils": "7.16.0",
+        "@typescript-eslint/visitor-keys": "7.16.0",
         "graphemer": "^1.4.0",
         "ignore": "^5.3.1",
         "natural-compare": "^1.4.0",
@@ -3913,15 +3959,15 @@
       }
     },
     "node_modules/@typescript-eslint/parser": {
-      "version": "7.16.1",
-      "resolved": "https://registry.npmjs.org/@typescript-eslint/parser/-/parser-7.16.1.tgz",
-      "integrity": "sha512-u+1Qx86jfGQ5i4JjK33/FnawZRpsLxRnKzGE6EABZ40KxVT/vWsiZFEBBHjFOljmmV3MBYOHEKi0Jm9hbAOClA==",
+      "version": "7.16.0",
+      "resolved": "https://registry.npmjs.org/@typescript-eslint/parser/-/parser-7.16.0.tgz",
+      "integrity": "sha512-ar9E+k7CU8rWi2e5ErzQiC93KKEFAXA2Kky0scAlPcxYblLt8+XZuHUZwlyfXILyQa95P6lQg+eZgh/dDs3+Vw==",
       "dev": true,
       "dependencies": {
-        "@typescript-eslint/scope-manager": "7.16.1",
-        "@typescript-eslint/types": "7.16.1",
-        "@typescript-eslint/typescript-estree": "7.16.1",
-        "@typescript-eslint/visitor-keys": "7.16.1",
+        "@typescript-eslint/scope-manager": "7.16.0",
+        "@typescript-eslint/types": "7.16.0",
+        "@typescript-eslint/typescript-estree": "7.16.0",
+        "@typescript-eslint/visitor-keys": "7.16.0",
         "debug": "^4.3.4"
       },
       "engines": {
@@ -3941,13 +3987,13 @@
       }
     },
     "node_modules/@typescript-eslint/scope-manager": {
-      "version": "7.16.1",
-      "resolved": "https://registry.npmjs.org/@typescript-eslint/scope-manager/-/scope-manager-7.16.1.tgz",
-      "integrity": "sha512-nYpyv6ALte18gbMz323RM+vpFpTjfNdyakbf3nsLvF43uF9KeNC289SUEW3QLZ1xPtyINJ1dIsZOuWuSRIWygw==",
+      "version": "7.16.0",
+      "resolved": "https://registry.npmjs.org/@typescript-eslint/scope-manager/-/scope-manager-7.16.0.tgz",
+      "integrity": "sha512-8gVv3kW6n01Q6TrI1cmTZ9YMFi3ucDT7i7aI5lEikk2ebk1AEjrwX8MDTdaX5D7fPXMBLvnsaa0IFTAu+jcfOw==",
       "dev": true,
       "dependencies": {
-        "@typescript-eslint/types": "7.16.1",
-        "@typescript-eslint/visitor-keys": "7.16.1"
+        "@typescript-eslint/types": "7.16.0",
+        "@typescript-eslint/visitor-keys": "7.16.0"
       },
       "engines": {
         "node": "^18.18.0 || >=20.0.0"
@@ -3958,13 +4004,13 @@
       }
     },
     "node_modules/@typescript-eslint/type-utils": {
-      "version": "7.16.1",
-      "resolved": "https://registry.npmjs.org/@typescript-eslint/type-utils/-/type-utils-7.16.1.tgz",
-      "integrity": "sha512-rbu/H2MWXN4SkjIIyWcmYBjlp55VT+1G3duFOIukTNFxr9PI35pLc2ydwAfejCEitCv4uztA07q0QWanOHC7dA==",
+      "version": "7.16.0",
+      "resolved": "https://registry.npmjs.org/@typescript-eslint/type-utils/-/type-utils-7.16.0.tgz",
+      "integrity": "sha512-j0fuUswUjDHfqV/UdW6mLtOQQseORqfdmoBNDFOqs9rvNVR2e+cmu6zJu/Ku4SDuqiJko6YnhwcL8x45r8Oqxg==",
       "dev": true,
       "dependencies": {
-        "@typescript-eslint/typescript-estree": "7.16.1",
-        "@typescript-eslint/utils": "7.16.1",
+        "@typescript-eslint/typescript-estree": "7.16.0",
+        "@typescript-eslint/utils": "7.16.0",
         "debug": "^4.3.4",
         "ts-api-utils": "^1.3.0"
       },
@@ -3985,9 +4031,9 @@
       }
     },
     "node_modules/@typescript-eslint/types": {
-      "version": "7.16.1",
-      "resolved": "https://registry.npmjs.org/@typescript-eslint/types/-/types-7.16.1.tgz",
-      "integrity": "sha512-AQn9XqCzUXd4bAVEsAXM/Izk11Wx2u4H3BAfQVhSfzfDOm/wAON9nP7J5rpkCxts7E5TELmN845xTUCQrD1xIQ==",
+      "version": "7.16.0",
+      "resolved": "https://registry.npmjs.org/@typescript-eslint/types/-/types-7.16.0.tgz",
+      "integrity": "sha512-fecuH15Y+TzlUutvUl9Cc2XJxqdLr7+93SQIbcZfd4XRGGKoxyljK27b+kxKamjRkU7FYC6RrbSCg0ALcZn/xw==",
       "dev": true,
       "engines": {
         "node": "^18.18.0 || >=20.0.0"
@@ -3998,13 +4044,13 @@
       }
     },
     "node_modules/@typescript-eslint/typescript-estree": {
-      "version": "7.16.1",
-      "resolved": "https://registry.npmjs.org/@typescript-eslint/typescript-estree/-/typescript-estree-7.16.1.tgz",
-      "integrity": "sha512-0vFPk8tMjj6apaAZ1HlwM8w7jbghC8jc1aRNJG5vN8Ym5miyhTQGMqU++kuBFDNKe9NcPeZ6x0zfSzV8xC1UlQ==",
+      "version": "7.16.0",
+      "resolved": "https://registry.npmjs.org/@typescript-eslint/typescript-estree/-/typescript-estree-7.16.0.tgz",
+      "integrity": "sha512-a5NTvk51ZndFuOLCh5OaJBELYc2O3Zqxfl3Js78VFE1zE46J2AaVuW+rEbVkQznjkmlzWsUI15BG5tQMixzZLw==",
       "dev": true,
       "dependencies": {
-        "@typescript-eslint/types": "7.16.1",
-        "@typescript-eslint/visitor-keys": "7.16.1",
+        "@typescript-eslint/types": "7.16.0",
+        "@typescript-eslint/visitor-keys": "7.16.0",
         "debug": "^4.3.4",
         "globby": "^11.1.0",
         "is-glob": "^4.0.3",
@@ -4055,15 +4101,15 @@
       }
     },
     "node_modules/@typescript-eslint/utils": {
-      "version": "7.16.1",
-      "resolved": "https://registry.npmjs.org/@typescript-eslint/utils/-/utils-7.16.1.tgz",
-      "integrity": "sha512-WrFM8nzCowV0he0RlkotGDujx78xudsxnGMBHI88l5J8wEhED6yBwaSLP99ygfrzAjsQvcYQ94quDwI0d7E1fA==",
+      "version": "7.16.0",
+      "resolved": "https://registry.npmjs.org/@typescript-eslint/utils/-/utils-7.16.0.tgz",
+      "integrity": "sha512-PqP4kP3hb4r7Jav+NiRCntlVzhxBNWq6ZQ+zQwII1y/G/1gdIPeYDCKr2+dH6049yJQsWZiHU6RlwvIFBXXGNA==",
       "dev": true,
       "dependencies": {
         "@eslint-community/eslint-utils": "^4.4.0",
-        "@typescript-eslint/scope-manager": "7.16.1",
-        "@typescript-eslint/types": "7.16.1",
-        "@typescript-eslint/typescript-estree": "7.16.1"
+        "@typescript-eslint/scope-manager": "7.16.0",
+        "@typescript-eslint/types": "7.16.0",
+        "@typescript-eslint/typescript-estree": "7.16.0"
       },
       "engines": {
         "node": "^18.18.0 || >=20.0.0"
@@ -4077,12 +4123,12 @@
       }
     },
     "node_modules/@typescript-eslint/visitor-keys": {
-      "version": "7.16.1",
-      "resolved": "https://registry.npmjs.org/@typescript-eslint/visitor-keys/-/visitor-keys-7.16.1.tgz",
-      "integrity": "sha512-Qlzzx4sE4u3FsHTPQAAQFJFNOuqtuY0LFrZHwQ8IHK705XxBiWOFkfKRWu6niB7hwfgnwIpO4jTC75ozW1PHWg==",
+      "version": "7.16.0",
+      "resolved": "https://registry.npmjs.org/@typescript-eslint/visitor-keys/-/visitor-keys-7.16.0.tgz",
+      "integrity": "sha512-rMo01uPy9C7XxG7AFsxa8zLnWXTF8N3PYclekWSrurvhwiw1eW88mrKiAYe6s53AUY57nTRz8dJsuuXdkAhzCg==",
       "dev": true,
       "dependencies": {
-        "@typescript-eslint/types": "7.16.1",
+        "@typescript-eslint/types": "7.16.0",
         "eslint-visitor-keys": "^3.4.3"
       },
       "engines": {
@@ -5439,9 +5485,9 @@
       }
     },
     "node_modules/chromium-bidi": {
-      "version": "0.6.1",
-      "resolved": "https://registry.npmjs.org/chromium-bidi/-/chromium-bidi-0.6.1.tgz",
-      "integrity": "sha512-kSxJRj0VgtUKz6nmzc2JPfyfJGzwzt65u7PqhPHtgGQUZLF5oG+ST6l6e5ONfStUMAlhSutFCjaGKllXZa16jA==",
+      "version": "0.6.0",
+      "resolved": "https://registry.npmjs.org/chromium-bidi/-/chromium-bidi-0.6.0.tgz",
+      "integrity": "sha512-VnxVrpGojAjkiGFN2I+KtsDILFAjiGWVEDizOEnKzEDkT93eQT1cqTfUkqmOyLq33i1q4a1KDYbH+52CUe4Ufw==",
       "dependencies": {
         "mitt": "3.0.1",
         "urlpattern-polyfill": "10.0.0",
@@ -6765,9 +6811,9 @@
       "integrity": "sha512-XRRe6Glud4rd/ZGQfiV1ruXSfbvfJedlV9Y6zOlP+2K04vBYiJEte6stfFkCP03aMnY5tsipamumUjL14fofug=="
     },
     "node_modules/debug": {
-      "version": "4.3.5",
-      "resolved": "https://registry.npmjs.org/debug/-/debug-4.3.5.tgz",
-      "integrity": "sha512-pt0bNEmneDIvdL1Xsd9oDQ/wrQRkXDT4AUWlNZNPKvW5x/jyO9VFXkJUP07vQ2upmw5PlaITaPKc31jK13V+jg==",
+      "version": "4.3.4",
+      "resolved": "https://registry.npmjs.org/debug/-/debug-4.3.4.tgz",
+      "integrity": "sha512-PRWFHuSU3eDtQJPvnNY7Jcket1j0t5OuOsFzPPzsekD52Zl8qUfFIPEiswXqIvHWGVHOgX+7G/vCNNhehwxfkQ==",
       "dependencies": {
         "ms": "2.1.2"
       },
@@ -17848,15 +17894,15 @@
       }
     },
     "node_modules/puppeteer": {
-      "version": "22.13.1",
-      "resolved": "https://registry.npmjs.org/puppeteer/-/puppeteer-22.13.1.tgz",
-      "integrity": "sha512-PwXLDQK5u83Fm5A7TGMq+9BR7iHDJ8a3h21PSsh/E6VfhxiKYkU7+tvGZNSCap6k3pCNDd9oNteVBEctcBalmQ==",
+      "version": "22.13.0",
+      "resolved": "https://registry.npmjs.org/puppeteer/-/puppeteer-22.13.0.tgz",
+      "integrity": "sha512-nmICzeHTBtZiu+y4vs0fboe/NKIFwH5W8RZuxmEVAKNfBQg/8u5FEQAvPlWmyVpJoAVM5kXD5PEl3GlK3F9pPA==",
       "hasInstallScript": true,
       "dependencies": {
-        "@puppeteer/browsers": "2.2.4",
+        "@puppeteer/browsers": "2.2.3",
         "cosmiconfig": "^9.0.0",
         "devtools-protocol": "0.0.1299070",
-        "puppeteer-core": "22.13.1"
+        "puppeteer-core": "22.13.0"
       },
       "bin": {
         "puppeteer": "lib/esm/puppeteer/node/cli.js"
@@ -17866,12 +17912,12 @@
       }
     },
     "node_modules/puppeteer-core": {
-      "version": "22.13.1",
-      "resolved": "https://registry.npmjs.org/puppeteer-core/-/puppeteer-core-22.13.1.tgz",
-      "integrity": "sha512-NmhnASYp51QPRCAf9n0OPxuPMmzkKd8+2sB9Q+BjwwCG25gz6iuNc3LQDWa+cH2tyivmJppLhNNFt6Q3HmoOpw==",
+      "version": "22.13.0",
+      "resolved": "https://registry.npmjs.org/puppeteer-core/-/puppeteer-core-22.13.0.tgz",
+      "integrity": "sha512-ZkpRX8nm/S39BnpcCverMzIc6oGWBPOUeOeaWRLKHqiKVCZ1l28HxPTYLitJlDiB16xZATSKpjul+sl+ZEm0HQ==",
       "dependencies": {
-        "@puppeteer/browsers": "2.2.4",
-        "chromium-bidi": "0.6.1",
+        "@puppeteer/browsers": "2.2.3",
+        "chromium-bidi": "0.6.0",
         "debug": "^4.3.5",
         "devtools-protocol": "0.0.1299070",
         "ws": "^8.18.0"
@@ -17880,6 +17926,22 @@
         "node": ">=18"
       }
     },
+    "node_modules/puppeteer-core/node_modules/debug": {
+      "version": "4.3.5",
+      "resolved": "https://registry.npmjs.org/debug/-/debug-4.3.5.tgz",
+      "integrity": "sha512-pt0bNEmneDIvdL1Xsd9oDQ/wrQRkXDT4AUWlNZNPKvW5x/jyO9VFXkJUP07vQ2upmw5PlaITaPKc31jK13V+jg==",
+      "dependencies": {
+        "ms": "2.1.2"
+      },
+      "engines": {
+        "node": ">=6.0"
+      },
+      "peerDependenciesMeta": {
+        "supports-color": {
+          "optional": true
+        }
+      }
+    },
     "node_modules/pure-rand": {
       "version": "6.1.0",
       "resolved": "https://registry.npmjs.org/pure-rand/-/pure-rand-6.1.0.tgz",
@@ -18810,9 +18872,9 @@
       }
     },
     "node_modules/semver": {
-      "version": "7.6.3",
-      "resolved": "https://registry.npmjs.org/semver/-/semver-7.6.3.tgz",
-      "integrity": "sha512-oVekP1cKtI+CTDvHWYFUcMtsK/00wmAEfyqKfNdARm8u1wNVhSgaX7A8d4UuIlUI5e84iEwOhs7ZPYRmzU9U6A==",
+      "version": "7.6.2",
+      "resolved": "https://registry.npmjs.org/semver/-/semver-7.6.2.tgz",
+      "integrity": "sha512-FNAIBWCx9qcRhoHcgcJ0gvU7SN1lYU2ZXuSfl04bSC5OpvDHFyJCjdNHomPXxjQlCBU67YW64PzY7/VIEH7F2w==",
       "bin": {
         "semver": "bin/semver.js"
       },
@@ -19670,9 +19732,9 @@
       }
     },
     "node_modules/stylelint-prettier": {
-      "version": "5.0.2",
-      "resolved": "https://registry.npmjs.org/stylelint-prettier/-/stylelint-prettier-5.0.2.tgz",
-      "integrity": "sha512-qJ+BN+1T2ZcKz9WIrv0x+eFGHzSUnXfXd5gL///T6XoJvr3D8/ztzz2fhtmXef7Vb8P33zBXmLTTveByr0nwBw==",
+      "version": "5.0.1",
+      "resolved": "https://registry.npmjs.org/stylelint-prettier/-/stylelint-prettier-5.0.1.tgz",
+      "integrity": "sha512-blsBcSiCv7ZNmUadZPo9tv/ZHxTDRUbByn/NUp3irH5AozPFnAE7SHM/md/2DMdQizUwfuD9/3kOKB5+4a1/4Q==",
       "dev": true,
       "dependencies": {
         "prettier-linter-helpers": "^1.0.0"
@@ -19691,6 +19753,23 @@
       "integrity": "sha512-1ugUSr8BHXRnK23KfuYS+gVMC3LB8QGH9W1iGtDPsNWoQbgtXSExkBu2aDR4epiGWZOjZsj6lDl/N/AqqTC3UA==",
       "dev": true
     },
+    "node_modules/stylelint/node_modules/debug": {
+      "version": "4.3.5",
+      "resolved": "https://registry.npmjs.org/debug/-/debug-4.3.5.tgz",
+      "integrity": "sha512-pt0bNEmneDIvdL1Xsd9oDQ/wrQRkXDT4AUWlNZNPKvW5x/jyO9VFXkJUP07vQ2upmw5PlaITaPKc31jK13V+jg==",
+      "dev": true,
+      "dependencies": {
+        "ms": "2.1.2"
+      },
+      "engines": {
+        "node": ">=6.0"
+      },
+      "peerDependenciesMeta": {
+        "supports-color": {
+          "optional": true
+        }
+      }
+    },
     "node_modules/stylelint/node_modules/emoji-regex": {
       "version": "8.0.0",
       "resolved": "https://registry.npmjs.org/emoji-regex/-/emoji-regex-8.0.0.tgz",
@@ -20020,9 +20099,9 @@
       }
     },
     "node_modules/tar-fs": {
-      "version": "3.0.6",
-      "resolved": "https://registry.npmjs.org/tar-fs/-/tar-fs-3.0.6.tgz",
-      "integrity": "sha512-iokBDQQkUyeXhgPYaZxmczGPhnhXZ0CmrqI+MOb/WFGS9DW5wnfrLgtjUJBvz50vQ3qfRwJ62QVoCFu8mPVu5w==",
+      "version": "3.0.5",
+      "resolved": "https://registry.npmjs.org/tar-fs/-/tar-fs-3.0.5.tgz",
+      "integrity": "sha512-JOgGAmZyMgbqpLwct7ZV8VzkEB6pxXFBVErLtb+XCOqzc6w1xiWKI9GVd6bwk68EX7eJ4DWmfXVmq8K2ziZTGg==",
       "dependencies": {
         "pump": "^3.0.0",
         "tar-stream": "^3.1.5"
diff --git a/package.json b/package.json
index c2c3fd23a..8d99dd43f 100644
--- a/package.json
+++ b/package.json
@@ -104,8 +104,8 @@
     "@semantic-release/npm": "^12.0.1",
     "@semantic-release/release-notes-generator": "^14.0.1",
     "@types/jest": "^29.5.12",
-    "@typescript-eslint/eslint-plugin": "^7.16.1",
-    "@typescript-eslint/parser": "^7.16.1",
+    "@typescript-eslint/eslint-plugin": "^7.16.0",
+    "@typescript-eslint/parser": "^7.16.0",
     "chokidar-cli": "^3.0.0",
     "concurrently": "^8.2.2",
     "copyfiles": "^2.4.1",
@@ -129,7 +129,7 @@
     "semantic-release": "^24.0.0",
     "smoothscroll-polyfill": "^0.4.4",
     "stylelint": "^16.7.0",
-    "stylelint-prettier": "^5.0.2",
+    "stylelint-prettier": "^5.0.1",
     "ts-jest": "^29.2.2",
     "typescript": "5.5.3"
   },
diff --git a/src/modules/esl-media-query/README.md b/src/modules/esl-media-query/README.md
index 1f990f131..e8390f0ef 100644
--- a/src/modules/esl-media-query/README.md
+++ b/src/modules/esl-media-query/README.md
@@ -204,20 +204,21 @@ ESLMediaRuleList.parse('1 | @XS => 2', String); // the same as sample above
 ESLMediaRuleList.parse('1 | @XS => 2', Number); // first query from the sample above that store numeric values
 ESLMediaRuleList.parse('@XS => {option: 1} | @+SM => {option: 2}', ESLMediaRuleList.OBJECT_PARSER); // second query from the sample above with an object payloads
 ESLMediaRuleList.parse('@XS => {option: 1} | @+SM => {option: 2}', evaluate); // the same as the sample above 
+ESLMediaRuleList.parse('1|2|3|4|5', '@xs|@sm|@md|@lg|@xl') // parses tuple payloads
+ESLMediaRuleList.parse('@mqAlt1 => value1| @mqAlt2 => value2', '@mq1|@mq2'); // parses first argument as an arrow syntax without default tuple consideration.
 
 // Tupple parsing
 ESLMediaRuleList.parseTuple('@xs|@sm|@md|@lg|@xl', '1|2|3|4|5') // String payload example
 ESLMediaRuleList.parseTuple('@xs|@sm|@md|@lg|@xl', '1|2|3|4|5',  Number) // Numeric payload sample
 ```
-**Note**: Method `ESLMediaRuleList.parse` is deprecated, and will be reintroduced in ESL v5.0.0 with a different signature. For now use `ESLMediaRuleList.parseTuple` or `ESLMediaRuleList.parseQuery` instead.
 
 #### ESLMediaRuleList API
 
-- `ESLMediaRuleList.parse(ruleset: string)` - parse media ruleset defined with classic syntax mentioned in section above.
-Rules separated by `|` symbol, query and value separated by `=>` for each rule, query is optional.
+- `ESLMediaRuleList.parseTuple(queries: string, values: string)` - parse media ruleset from tuple of queries and values, all separated via `|` symbol.
 
-- `ESLMediaRuleList.parseTuple(queries: string, values: string)` - parse media ruleset from tuple of
-queries and values, all separated via `|` symbol
+- `ESLMediaRuleList.parseQuery(ruleset: string)` - parse media ruleset defined with syntax, where query and value are a single argument separated by `=>` for each rule.
+
+- `ESLMediaRuleList.parse(values: string, queries: string)` - parse media ruleset adaptively. Method can support both notations with a ruleset from tuple of queries and values, all separated via `|` symbol, and can parse cases where query syntax with rules separated by `=>` is being used as a value for a tuple.
 
 - `ESLMediaRuleList.prototype.rules` - array of rules that defines `ESLMediaRuleList` object
 - `ESLMediaRuleList.prototype.active` - array of active (matched) rules 
diff --git a/src/modules/esl-media-query/core/esl-media-rule-list.ts b/src/modules/esl-media-query/core/esl-media-rule-list.ts
index 1831102f1..0b8bd7b29 100644
--- a/src/modules/esl-media-query/core/esl-media-rule-list.ts
+++ b/src/modules/esl-media-query/core/esl-media-rule-list.ts
@@ -35,9 +35,7 @@ export class ESLMediaRuleList<T = any> extends SyntheticEventTarget {
   public static OBJECT_PARSER = <U = any>(val: string): U | undefined => evaluate(val);
 
   /**
-   * @deprecated Method will be reintroduced in v5.0.0 with a different signature. For now use ESLMediaRuleList.parseQuery instead
-   *
-   * Creates `ESLMediaRuleList` from string query representation
+   * Creates {@link ESLMediaRuleList} from string query representation
    * Expect serialized {@link ESLMediaRule}s separated by '|'
    * Uses exact strings as rule list values
    *
@@ -45,9 +43,7 @@ export class ESLMediaRuleList<T = any> extends SyntheticEventTarget {
    */
   public static parse(query: string): ESLMediaRuleList<string>;
   /**
-   * @deprecated Method will be reintroduced in v5.0.0 with a different signature. For now use ESLMediaRuleList.parseQuery instead
-   *
-   * Creates `ESLMediaRuleList` from string query representation.
+   * Creates {@link ESLMediaRuleList} from string query representation.
    * Expect serialized {@link ESLMediaRule}s separated by '|'
    *
    * @param query - query string
@@ -55,26 +51,22 @@ export class ESLMediaRuleList<T = any> extends SyntheticEventTarget {
    */
   public static parse<U>(query: string, parser: RulePayloadParser<U>): ESLMediaRuleList<U>;
   /**
-   * @deprecated Method will be reintroduced in v5.0.0 with a different signature. For now use ESLMediaRuleList.parseTuple instead
-
-   * Creates `ESLMediaRuleList` from two strings with conditions and values sequences
+   * Creates {@link ESLMediaRuleList} from two strings with conditions and values sequences
    *
-   * @param mask - media conditions tuple string (uses '|' as separator)
    * @param values - values tuple string (uses '|' as separator)
+   * @param mask - media conditions tuple string (uses '|' as separator)
    *
    * @example
    * ```ts
    * ESLMediaRuleList.parse('@XS|@SM|@MD|@LG|@XL', '1|2|3|4|5')
    * ```
    */
-  public static parse(mask: string, values: string): ESLMediaRuleList<string>;
+  public static parse(values: string, mask: string): ESLMediaRuleList<string>;
   /**
-   * @deprecated Method will be reintroduced in v5.0.0 with a different signature. For now use ESLMediaRuleList.parseTuple instead
-   *
-   * Creates `ESLMediaRuleList` from two strings with conditions and values sequences
+   * Creates {@link ESLMediaRuleList} from two strings with conditions and values sequences
    *
-   * @param mask - media conditions tuple string (uses '|' as separator)
    * @param values - values tuple string (uses '|' as separator)
+   * @param mask - media conditions tuple string (uses '|' as separator)
    * @param parser - value parser function
    *
    * @example
@@ -82,17 +74,16 @@ export class ESLMediaRuleList<T = any> extends SyntheticEventTarget {
    * ESLMediaRuleList.parseTuple('@XS|@SM|@MD|@LG|@XL', '1|2|3|4|5', Number)
    * ```
    */
-  public static parse<U>(mask: string, values: string, parser: RulePayloadParser<U>): ESLMediaRuleList<U>;
+  public static parse<U>(values: string, mask: string, parser: RulePayloadParser<U>): ESLMediaRuleList<U>;
   public static parse(query: string, ...common: (string | RulePayloadParser<any>)[]): ESLMediaRuleList {
     const parser: RulePayloadParser<any> = typeof common[common.length - 1] === 'function' ? common.pop() as any : String;
-    const value = common.pop();
-    return typeof value === 'string' ?
-      ESLMediaRuleList.parseTuple(query, value, parser) :
-      ESLMediaRuleList.parseQuery(query, parser);
+    const mask = common.pop();
+    if (query.includes('=>') || typeof mask !== 'string') return ESLMediaRuleList.parseQuery(query, parser);
+    return ESLMediaRuleList.parseTuple(mask, query, parser);
   }
 
   /**
-   * Creates `ESLMediaRuleList` from string query representation
+   * Creates {@link ESLMediaRuleList} from string query representation
    * Uses exact strings as rule list values
    * @param query - query string
    */
@@ -111,7 +102,7 @@ export class ESLMediaRuleList<T = any> extends SyntheticEventTarget {
   }
 
   /**
-   * Creates `ESLMediaRuleList` from two strings with conditions and values sequences
+   * Creates {@link ESLMediaRuleList} from two strings with conditions and values sequences
    *
    * @param mask - media conditions tuple string (uses '|' as separator)
    * @param values - values tuple string (uses '|' as separator)
@@ -123,7 +114,7 @@ export class ESLMediaRuleList<T = any> extends SyntheticEventTarget {
    */
   public static parseTuple(mask: string, values: string): ESLMediaRuleList<string>;
   /**
-   * Creates `ESLMediaRuleList` from two strings with conditions and values sequences
+   * Creates {@link ESLMediaRuleList} from two strings with conditions and values sequences
    *
    * @param mask - media conditions tuple string (uses '|' as separator)
    * @param values - values tuple string (uses '|' as separator)
@@ -216,7 +207,7 @@ export class ESLMediaRuleList<T = any> extends SyntheticEventTarget {
 
   /** @returns serialized {@link ESLMediaRuleList} object representation*/
   public override toString(): string {
-    return this.rules.join('|');
+    return this.rules.join(' | ');
   }
 }
 


Test patch:
diff --git a/e2e/package.json b/e2e/package.json
index 253bd4fce..37940374a 100644
--- a/e2e/package.json
+++ b/e2e/package.json
@@ -19,7 +19,7 @@
     "@types/puppeteer": "^7.0.4",
     "jest-image-snapshot": "^6.4.0",
     "jest-puppeteer": "^10.0.1",
-    "puppeteer": "^22.13.1",
+    "puppeteer": "^22.13.0",
     "stucumber": "^0.19.0"
   }
 }
diff --git a/src/modules/esl-media-query/test/esl-media-rule-list.test.ts b/src/modules/esl-media-query/test/esl-media-rule-list.test.ts
index cce13af4d..192ad729b 100644
--- a/src/modules/esl-media-query/test/esl-media-rule-list.test.ts
+++ b/src/modules/esl-media-query/test/esl-media-rule-list.test.ts
@@ -178,4 +178,29 @@ describe('ESLMediaRuleList', () => {
       expect(() => ESLMediaRuleList.parseTuple('@xs', '1|2|3')).toThrowError();
     });
   });
+
+  describe('Adaptive cases parsing', () => {
+    test.each([
+      // [ [.. Call Args], 'Canonical form']
+      [['1'], 'all => 1'],
+
+      // Tuples
+      [['1', '@-sm'], '(max-width: 991px) => 1'],
+      [['1', '@+sm'], '(min-width: 768px) => 1'],
+      [['1', '@sm'], '(min-width: 768px) and (max-width: 991px) => 1'],
+      [['0 | 1', '@+xs | @+sm'], '(min-width: 1px) => 0 | (min-width: 768px) => 1'],
+      [['1|2|3', 'all|@sm|@md'], 'all => 1 | (min-width: 768px) and (max-width: 991px) => 2 | (min-width: 992px) and (max-width: 1199px) => 3'],
+      [['f=|s>|t<', 'all | @-xs | @-sm',], 'all => f= | (max-width: 767px) => s> | (max-width: 991px) => t<'],
+
+      // Arrow syntax
+      [['0 | (min-width: 100px) => 1 |  (min-width: 200px) => 2'], 'all => 0 | (min-width: 100px) => 1 | (min-width: 200px) => 2'],
+      [['1 | @+sm => 2 | @+md => 3'], 'all => 1 | (min-width: 768px) => 2 | (min-width: 992px) => 3'],
+      [['1 | @+sm => 2', '@sm'], 'all => 1 | (min-width: 768px) => 2'],
+      [['1 | screen and @sm => 2'], 'all => 1 | screen and (min-width: 768px) and (max-width: 991px) => 2'],
+      [['1 | @-xs or @+md => 2'], 'all => 1 | (max-width: 767px), (min-width: 992px) => 2'],
+      [['@-xs => hello | @+sm => world'], '(max-width: 767px) => hello | (min-width: 768px) => world'],
+    ])('Should correctly parse "%s" with media condition "%s"', (params: any[], canonical: string) => {
+      expect(ESLMediaRuleList.parse.apply(null, params).toString()).toBe(canonical);
+    });
+  });
 });