migrate code base to media-query-list-parser

.github/workflows/test.yml

@@ -0,0 +1,40 @@
+name: test
+on:
+  push:
+    branches:
+    - 'main'
+    - 'master'
+  pull_request:
+
+concurrency:
+  group: branch-node-${{ github.ref }}
+  cancel-in-progress: true
+
+defaults:
+  run:
+    shell: bash
+
+jobs:
+  test:
+    runs-on: ubuntu-latest
+    strategy:
+      matrix:
+        os: [ubuntu-latest]
+        node: [14, 16, 18]
+    steps:
+      - uses: actions/checkout@v3
+        with:
+          fetch-depth: 1
+      - uses: actions/setup-node@v3
+        with:
+          node-version: ${{ matrix.node }}
+
+      - name: install
+        run: |
+          yarn install
+
+      - name: build
+        run: yarn build
+
+      - name: test
+        run: yarn test

dist/index.cjs

@@ -0,0 +1 @@
+"use strict";var e=require("@csstools/css-parser-algorithms"),i=require("@csstools/css-tokenizer"),n=require("@csstools/media-query-list-parser"),t=require("@csstools/css-calc");const a=/[A-Z]/g;const r={width:"px",height:"px","device-width":"px","device-height":"px","aspect-ratio":"","device-aspect-ratio":"",color:"","color-index":"",monochrome:"",resolution:"dpi"},o={width:!1,height:!1,"device-width":!1,"device-height":!1,"aspect-ratio":!1,"device-aspect-ratio":!1,color:!0,"color-index":!0,monochrome:!0,resolution:"dpi"};function s(e){return e===n.MediaFeatureLT.LT||e===n.MediaFeatureLT.LT_OR_EQ?"max-":e===n.MediaFeatureGT.GT||e===n.MediaFeatureGT.GT_OR_EQ?"min-":""}const u={">":1,"<":-1},d=.001,p=.02;function l(a,l,c,T){let v=c.before,m=c.after;if(T||(v=c.after,m=c.before),!T){const e=n.invertComparison(l);if(!1===e)return;l=e}if(l===n.MediaFeatureEQ.EQ||l===n.MediaFeatureLT.LT_OR_EQ||l===n.MediaFeatureGT.GT_OR_EQ)return Array.isArray(c.value)?n.newMediaFeaturePlain(s(l)+a,...v,...c.value.flatMap((e=>e.tokens())),...m):n.newMediaFeaturePlain(s(l)+a,...v,...c.value.tokens(),...m);let f,y,h=!1;if(Array.isArray(c.value)){if(!n.matchesRatioExactly(c.value))return;if("aspect-ratio"!==a&&"device-aspect-ratio"!==a)return;const e=n.matchesRatio(c.value);if(-1===e)return;h=!0,f=c.value[e[0]],y=[...c.value.slice(e[0]+1).flatMap((e=>e.tokens()))]}else f=c.value,y=[];const k=r[a.toLowerCase()];if(e.isFunctionNode(f)&&"calc"===f.getName().toLowerCase()){const[[r]]=t.calcFromComponentValues([[f]],{precision:5,toCanonicalUnits:!0});if(!r||!e.isTokenNode(r)||r.value[0]!==i.TokenType.Number&&r.value[0]!==i.TokenType.Percentage&&r.value[0]!==i.TokenType.Dimension||!Number.isInteger(r.value[4].value)){let e;if(void 0!==k){const n=u[l]*("px"===k?p:d);e=[i.TokenType.Dimension,`${n.toString()}${k}`,-1,-1,{value:n,unit:k,type:i.NumberType.Integer}]}else if(!0===o[a]){const n=u[l];e=[i.TokenType.Number,n.toString(),-1,-1,{value:n,type:i.NumberType.Integer}]}else if(h){const n=u[l]*d;e=[i.TokenType.Number,n.toString(),-1,-1,{value:n,type:i.NumberType.Integer}]}else{const n=u[l];e=[i.TokenType.Number,n.toString(),-1,-1,{value:n,type:i.NumberType.Integer}]}return n.newMediaFeaturePlain(s(l)+a,...v,[i.TokenType.Function,"calc(",-1,-1,{value:"calc("}],[i.TokenType.OpenParen,"(",-1,-1,void 0],...f.tokens().slice(1),[i.TokenType.Whitespace," ",-1,-1,void 0],[i.TokenType.Delim,"+",-1,-1,{value:"+"}],[i.TokenType.Whitespace," ",-1,-1,void 0],e,[i.TokenType.CloseParen,")",-1,-1,void 0],...y,...m)}f=r}if(!e.isTokenNode(f))return;let M,g=f.value,w="";if(void 0!==k&&g[0]===i.TokenType.Number&&0===g[4].value)M=u[l],w=k;else if(g[0]===i.TokenType.Number&&0===g[4].value)M=u[l],w="";else if(g[0]===i.TokenType.Dimension&&0===g[4].value)M=u[l],w=g[4].unit;else if(g[0]===i.TokenType.Number&&!0===o[a])M=g[4].value+u[l];else if(g[0]===i.TokenType.Dimension&&"px"===g[4].unit&&g[4].type===i.NumberType.Integer)M=Number(Math.round(Number(g[4].value+p*u[l]+"e6"))+"e-6");else{if(g[0]!==i.TokenType.Dimension&&g[0]!==i.TokenType.Number)return;M=Number(Math.round(Number(g[4].value+d*u[l]+"e6"))+"e-6")}return w&&(g=[i.TokenType.Dimension,g[1],g[2],g[3],{value:g[4].value,unit:w,type:g[4].type}]),g[4].value=M,g[0]===i.TokenType.Dimension?g[1]=g[4].value.toString()+g[4].unit:g[1]=g[4].value.toString(),n.newMediaFeaturePlain(s(l)+a,...v,g,...y,...m)}const c=new Set(["aspect-ratio","color","color-index","device-aspect-ratio","device-height","device-width","height","horizontal-viewport-segments","monochrome","resolution","vertical-viewport-segments","width"]);function T(t){return t.map(((t,r)=>{const o=e.gatherNodeAncestry(t);t.walk((e=>{const r=e.node;if(!n.isMediaFeatureRange(r))return;const s=e.parent;if(!n.isMediaFeature(s))return;const u=r.name.getName().replace(a,(e=>String.fromCharCode(e.charCodeAt(0)+32)));if(!c.has(u))return;if(n.isMediaFeatureRangeNameValue(r)||n.isMediaFeatureRangeValueName(r)){const e=r.operatorKind();if(!1===e)return;const i=l(u,e,r.value,n.isMediaFeatureRangeNameValue(r));return void(i&&(s.feature=i.feature))}const d=o.get(s);if(!n.isMediaInParens(d))return;let p=null,T=null;{const e=r.valueOneOperatorKind();if(!1===e)return;const i=l(u,e,r.valueOne,!1);if(!i)return;e===n.MediaFeatureLT.LT||e===n.MediaFeatureLT.LT_OR_EQ?(p=i,p.before=s.before):(T=i,T.after=s.after)}{const e=r.valueTwoOperatorKind();if(!1===e)return;const i=l(u,e,r.valueTwo,!0);if(!i)return;e===n.MediaFeatureLT.LT||e===n.MediaFeatureLT.LT_OR_EQ?(T=i,T.before=s.before):(p=i,p.after=s.after)}if(!p||!T)return;const v=new n.MediaInParens(p),m=new n.MediaInParens(T),f=function(e,i){let t=e;if(!t)return;if(t=i.get(t),n.isMediaConditionListWithAnd(t))return t;if(!n.isMediaAnd(t))return;if(t=i.get(t),n.isMediaConditionListWithAnd(t))return t;return}(d,o);if(f)return f.leading===d?(f.leading=v,void(f.list=[new n.MediaAnd([[i.TokenType.Whitespace," ",-1,-1,void 0],[i.TokenType.Ident,"and",-1,-1,{value:"and"}],[i.TokenType.Whitespace," ",-1,-1,void 0]],m),...f.list])):void f.list.splice(f.indexOf(o.get(d)),1,new n.MediaAnd([[i.TokenType.Whitespace," ",-1,-1,void 0],[i.TokenType.Ident,"and",-1,-1,{value:"and"}],[i.TokenType.Whitespace," ",-1,-1,void 0]],v),new n.MediaAnd([[i.TokenType.Whitespace," ",-1,-1,void 0],[i.TokenType.Ident,"and",-1,-1,{value:"and"}],[i.TokenType.Whitespace," ",-1,-1,void 0]],m));const y=new n.MediaConditionListWithAnd(v,[new n.MediaAnd([[i.TokenType.Whitespace," ",-1,-1,void 0],[i.TokenType.Ident,"and",-1,-1,{value:"and"}],[i.TokenType.Whitespace," ",-1,-1,void 0]],m)],[[i.TokenType.Whitespace," ",-1,-1,void 0]]),h=function(e,i,t){let a=e;if(!a)return;if(a=t.get(a),!n.isMediaCondition(a))return;const r=a;if(a=t.get(a),!n.isMediaQuery(a))return;if(a!==i)return;return r}(d,t,o);h?h.media=y:d.media=new n.MediaCondition(new n.MediaInParens(new n.MediaCondition(y),[[i.TokenType.Whitespace," ",-1,-1,void 0],[i.TokenType.OpenParen,"(",-1,-1,void 0]],[[i.TokenType.CloseParen,")",-1,-1,void 0]]))}));const s=t.tokens();return i.stringify(...s.filter(((e,n)=>(0!==n||0!==r||e[0]!==i.TokenType.Whitespace)&&(e[0]!==i.TokenType.Whitespace||!s[n+1]||s[n+1][0]!==i.TokenType.Whitespace))))})).join(",")}const v=()=>({postcssPlugin:"postcss-media-minmax",AtRule:{media:e=>{if(!(e.params.includes("<")||e.params.includes(">")||e.params.includes("=")))return;const i=T(n.parse(e.params,{preserveInvalidMediaQueries:!0,onParseError:()=>{throw e.error(`Unable to parse media query "${e.params}"`)}}));e.params!==i&&(e.params=i)},"custom-media":e=>{if(!(e.params.includes("<")||e.params.includes(">")||e.params.includes("=")))return;const i=n.parseCustomMedia(e.params,{preserveInvalidMediaQueries:!0,onParseError:()=>{throw e.error(`Unable to parse media query "${e.params}"`)}});if(!i)return;if(!i.hasMediaQueryList())return;const t=i.mediaQueryList.map((e=>e.toString())).join(","),a=T(i.mediaQueryList);t!==a&&(e.params=e.params.replace(t," "+a))}}});v.postcss=!0,module.exports=v;

dist/index.d.ts

@@ -0,0 +1,3 @@
+import type { PluginCreator } from 'postcss';
+declare const creator: PluginCreator<never>;
+export default creator;

dist/index.mjs

@@ -0,0 +1 @@
+import{isFunctionNode as e,isTokenNode as t,gatherNodeAncestry as r}from"@csstools/css-parser-algorithms";import{TokenType as i,NumberType as n,stringify as a}from"@csstools/css-tokenizer";import{invertComparison as o,MediaFeatureEQ as s,MediaFeatureLT as u,MediaFeatureGT as c,newMediaFeaturePlain as l,matchesRatioExactly as d,matchesRatio as p,isMediaFeatureRange as v,isMediaFeature as m,isMediaFeatureRangeNameValue as f,isMediaFeatureRangeValueName as h,isMediaInParens as g,MediaInParens as w,MediaAnd as b,MediaConditionListWithAnd as y,MediaCondition as N,isMediaConditionListWithAnd as W,isMediaAnd as x,isMediaCondition as O,isMediaQuery as I,parse as L,parseCustomMedia as Q}from"@csstools/media-query-list-parser";import{calcFromComponentValues as T}from"@csstools/css-calc";const _=/[A-Z]/g;const E={width:"px",height:"px","device-width":"px","device-height":"px","aspect-ratio":"","device-aspect-ratio":"",color:"","color-index":"",monochrome:"",resolution:"dpi"},S={width:!1,height:!1,"device-width":!1,"device-height":!1,"aspect-ratio":!1,"device-aspect-ratio":!1,color:!0,"color-index":!0,monochrome:!0,resolution:"dpi"};function C(e){return e===u.LT||e===u.LT_OR_EQ?"max-":e===c.GT||e===c.GT_OR_EQ?"min-":""}const D={">":1,"<":-1},P=.001,k=.02;function A(r,a,v,m){let f=v.before,h=v.after;if(m||(f=v.after,h=v.before),!m){const e=o(a);if(!1===e)return;a=e}if(a===s.EQ||a===u.LT_OR_EQ||a===c.GT_OR_EQ)return Array.isArray(v.value)?l(C(a)+r,...f,...v.value.flatMap((e=>e.tokens())),...h):l(C(a)+r,...f,...v.value.tokens(),...h);let g,w,b=!1;if(Array.isArray(v.value)){if(!d(v.value))return;if("aspect-ratio"!==r&&"device-aspect-ratio"!==r)return;const e=p(v.value);if(-1===e)return;b=!0,g=v.value[e[0]],w=[...v.value.slice(e[0]+1).flatMap((e=>e.tokens()))]}else g=v.value,w=[];const y=E[r.toLowerCase()];if(e(g)&&"calc"===g.getName().toLowerCase()){const[[e]]=T([[g]],{precision:5,toCanonicalUnits:!0});if(!e||!t(e)||e.value[0]!==i.Number&&e.value[0]!==i.Percentage&&e.value[0]!==i.Dimension||!Number.isInteger(e.value[4].value)){let e;if(void 0!==y){const t=D[a]*("px"===y?k:P);e=[i.Dimension,`${t.toString()}${y}`,-1,-1,{value:t,unit:y,type:n.Integer}]}else if(!0===S[r]){const t=D[a];e=[i.Number,t.toString(),-1,-1,{value:t,type:n.Integer}]}else if(b){const t=D[a]*P;e=[i.Number,t.toString(),-1,-1,{value:t,type:n.Integer}]}else{const t=D[a];e=[i.Number,t.toString(),-1,-1,{value:t,type:n.Integer}]}return l(C(a)+r,...f,[i.Function,"calc(",-1,-1,{value:"calc("}],[i.OpenParen,"(",-1,-1,void 0],...g.tokens().slice(1),[i.Whitespace," ",-1,-1,void 0],[i.Delim,"+",-1,-1,{value:"+"}],[i.Whitespace," ",-1,-1,void 0],e,[i.CloseParen,")",-1,-1,void 0],...w,...h)}g=e}if(!t(g))return;let N,W=g.value,x="";if(void 0!==y&&W[0]===i.Number&&0===W[4].value)N=D[a],x=y;else if(W[0]===i.Number&&0===W[4].value)N=D[a],x="";else if(W[0]===i.Dimension&&0===W[4].value)N=D[a],x=W[4].unit;else if(W[0]===i.Number&&!0===S[r])N=W[4].value+D[a];else if(W[0]===i.Dimension&&"px"===W[4].unit&&W[4].type===n.Integer)N=Number(Math.round(Number(W[4].value+k*D[a]+"e6"))+"e-6");else{if(W[0]!==i.Dimension&&W[0]!==i.Number)return;N=Number(Math.round(Number(W[4].value+P*D[a]+"e6"))+"e-6")}return x&&(W=[i.Dimension,W[1],W[2],W[3],{value:W[4].value,unit:x,type:W[4].type}]),W[4].value=N,W[0]===i.Dimension?W[1]=W[4].value.toString()+W[4].unit:W[1]=W[4].value.toString(),l(C(a)+r,...f,W,...w,...h)}const M=new Set(["aspect-ratio","color","color-index","device-aspect-ratio","device-height","device-width","height","horizontal-viewport-segments","monochrome","resolution","vertical-viewport-segments","width"]);function R(e){return e.map(((e,t)=>{const n=r(e);e.walk((t=>{const r=t.node;if(!v(r))return;const a=t.parent;if(!m(a))return;const o=r.name.getName().replace(_,(e=>String.fromCharCode(e.charCodeAt(0)+32)));if(!M.has(o))return;if(f(r)||h(r)){const e=r.operatorKind();if(!1===e)return;const t=A(o,e,r.value,f(r));return void(t&&(a.feature=t.feature))}const s=n.get(a);if(!g(s))return;let c=null,l=null;{const e=r.valueOneOperatorKind();if(!1===e)return;const t=A(o,e,r.valueOne,!1);if(!t)return;e===u.LT||e===u.LT_OR_EQ?(c=t,c.before=a.before):(l=t,l.after=a.after)}{const e=r.valueTwoOperatorKind();if(!1===e)return;const t=A(o,e,r.valueTwo,!0);if(!t)return;e===u.LT||e===u.LT_OR_EQ?(l=t,l.before=a.before):(c=t,c.after=a.after)}if(!c||!l)return;const d=new w(c),p=new w(l),L=function(e,t){let r=e;if(!r)return;if(r=t.get(r),W(r))return r;if(!x(r))return;if(r=t.get(r),W(r))return r;return}(s,n);if(L)return L.leading===s?(L.leading=d,void(L.list=[new b([[i.Whitespace," ",-1,-1,void 0],[i.Ident,"and",-1,-1,{value:"and"}],[i.Whitespace," ",-1,-1,void 0]],p),...L.list])):void L.list.splice(L.indexOf(n.get(s)),1,new b([[i.Whitespace," ",-1,-1,void 0],[i.Ident,"and",-1,-1,{value:"and"}],[i.Whitespace," ",-1,-1,void 0]],d),new b([[i.Whitespace," ",-1,-1,void 0],[i.Ident,"and",-1,-1,{value:"and"}],[i.Whitespace," ",-1,-1,void 0]],p));const Q=new y(d,[new b([[i.Whitespace," ",-1,-1,void 0],[i.Ident,"and",-1,-1,{value:"and"}],[i.Whitespace," ",-1,-1,void 0]],p)],[[i.Whitespace," ",-1,-1,void 0]]),T=function(e,t,r){let i=e;if(!i)return;if(i=r.get(i),!O(i))return;const n=i;if(i=r.get(i),!I(i))return;if(i!==t)return;return n}(s,e,n);T?T.media=Q:s.media=new N(new w(new N(Q),[[i.Whitespace," ",-1,-1,void 0],[i.OpenParen,"(",-1,-1,void 0]],[[i.CloseParen,")",-1,-1,void 0]]))}));const o=e.tokens();return a(...o.filter(((e,r)=>(0!==r||0!==t||e[0]!==i.Whitespace)&&(e[0]!==i.Whitespace||!o[r+1]||o[r+1][0]!==i.Whitespace))))})).join(",")}const $=()=>({postcssPlugin:"postcss-media-minmax",AtRule:{media:e=>{if(!(e.params.includes("<")||e.params.includes(">")||e.params.includes("=")))return;const t=R(L(e.params,{preserveInvalidMediaQueries:!0,onParseError:()=>{throw e.error(`Unable to parse media query "${e.params}"`)}}));e.params!==t&&(e.params=t)},"custom-media":e=>{if(!(e.params.includes("<")||e.params.includes(">")||e.params.includes("=")))return;const t=Q(e.params,{preserveInvalidMediaQueries:!0,onParseError:()=>{throw e.error(`Unable to parse media query "${e.params}"`)}});if(!t)return;if(!t.hasMediaQueryList())return;const r=t.mediaQueryList.map((e=>e.toString())).join(","),i=R(t.mediaQueryList);r!==i&&(e.params=e.params.replace(r," "+i))}}});$.postcss=!0;export{$ as default};

dist/to-lower-case-a-z.d.ts

@@ -0,0 +1 @@
+export declare function toLowerCaseAZ(x: string): string;

dist/transform-single-pair.d.ts

@@ -0,0 +1,2 @@
+import { MediaFeature, MediaFeatureComparison, MediaFeatureValue } from '@csstools/media-query-list-parser';
+export declare function transformSingleNameValuePair(name: string, operator: MediaFeatureComparison, value: MediaFeatureValue, nameBeforeValue: boolean): MediaFeature | undefined;

dist/transform.d.ts

@@ -0,0 +1,2 @@
+import { MediaQuery } from '@csstools/media-query-list-parser';
+export declare function transform(mediaQueries: Array<MediaQuery>): string;

package.json

@@ -3,6 +3,7 @@
   "version": "5.0.0",
   "description": "Using more intuitive `>=`, `<=`, `>`, `<` instead of media queries min/max prefix.",
   "scripts": {
+    "build": "rollup -c ./rollup/default.mjs",
     "test": "tape test"
   },
   "repository": "https://github.com/postcss/postcss-media-minmax.git",
@@ -11,26 +12,54 @@
     "css3",
     "postcss",
     "postcss-plugin",
-    "media querie",
+    "media query",
     "media queries"
   ],
   "author": "yisi",
   "license": "MIT",
+  "main": "dist/index.cjs",
+  "module": "dist/index.mjs",
+  "types": "dist/index.d.ts",
+  "exports": {
+    ".": {
+      "import": "./dist/index.mjs",
+      "require": "./dist/index.cjs",
+      "default": "./dist/index.mjs"
+    }
+  },
   "files": [
     "CHANGELOG.md",
     "README.md",
     "README-zh.md",
     "LICENSE",
-    "index.js"
+    "dist"
   ],
   "engines": {
-    "node": ">=10.0.0"
+    "node": ">=14.0.0"
+  },
+  "dependencies": {
+    "@csstools/css-calc": "^1.0.1",
+    "@csstools/css-parser-algorithms": "^2.1.0",
+    "@csstools/css-tokenizer": "^2.1.0",
+    "@csstools/media-query-list-parser": "^2.0.2"
   },
   "peerDependencies": {
     "postcss": "8.4.5"
   },
   "devDependencies": {
+    "@babel/core": "^7.19.3",
+    "@babel/preset-env": "^7.19.3",
+    "@rollup/plugin-babel": "^6.0.0",
+    "@rollup/plugin-commonjs": "^23.0.0",
+    "@rollup/plugin-node-resolve": "^15.0.0",
+    "@rollup/plugin-terser": "^0.1.0",
+    "@rollup/plugin-typescript": "^9.0.0",
+    "@types/node": "^18.11.9",
+    "eslint": "^8.25.0",
     "postcss": "8.4.5",
-    "tape": "^5.3.1"
+    "rollup": "^3.0.0",
+    "tape": "^5.3.1",
+    "tslib": "^2.4.1",
+    "typescript": "^4.8.4"
   }
 }

rollup/configs/babel-presets.mjs

@@ -0,0 +1,8 @@
+export const packageBabelPreset = [
+  ['@babel/preset-env', {
+    loose: true,
+    modules: false,
+    targets: { node: 14 },
+    useBuiltIns: false,
+  }],
+];