feat(MediaQuery): support setQuery

DOC.md

@@ -1734,6 +1734,7 @@ CSS media query listener.
 <pre>
 <code class="language-typescript">class MediaQuery extends Emitter {
     constructor(query: string);
+    setQuery(query: string): void;
     isMatch(): boolean;
 }</code>
 </pre>
@@ -1747,6 +1748,10 @@ Extend from Emitter.
 |-----|-----------|
 |query|Media query|
 
+### setQuery
+
+Update query.
+
 ### isMatch
 
 Return true if given media query matches.
@@ -7123,7 +7128,7 @@ Check if value is classified as an arguments object.
 <details>
 <summary>Type Definition</summary>
 <pre>
-<code class="language-typescript">function isArgs(val: any): boolean;</code>
+<code class="language-typescript">function isArgs(val: any): val is IArguments;</code>
 </pre>
 </details>
 
@@ -7147,7 +7152,7 @@ Check if value is an `Array` object.
 <details>
 <summary>Type Definition</summary>
 <pre>
-<code class="language-typescript">function isArr(val: any): boolean;</code>
+<code class="language-typescript">function isArr(val: any): val is any[];</code>
 </pre>
 </details>
 
@@ -7168,7 +7173,7 @@ Check if value is an ArrayBuffer.
 <details>
 <summary>Type Definition</summary>
 <pre>
-<code class="language-typescript">function isArrBuffer(val: any): boolean;</code>
+<code class="language-typescript">function isArrBuffer(val: any): val is ArrayBuffer;</code>
 </pre>
 </details>
 
@@ -7255,7 +7260,7 @@ Check if value is a boolean primitive.
 <details>
 <summary>Type Definition</summary>
 <pre>
-<code class="language-typescript">function isBool(val: any): boolean;</code>
+<code class="language-typescript">function isBool(val: any): val is boolean;</code>
 </pre>
 </details>
 
@@ -7459,7 +7464,7 @@ Check if value is a DOM element.
 <details>
 <summary>Type Definition</summary>
 <pre>
-<code class="language-typescript">function isEl(val: any): boolean;</code>
+<code class="language-typescript">function isEl(val: any): val is Element;</code>
 </pre>
 </details>
 
@@ -7542,7 +7547,7 @@ Check if value is an error.
 <details>
 <summary>Type Definition</summary>
 <pre>
-<code class="language-typescript">function isErr(val: any): boolean;</code>
+<code class="language-typescript">function isErr(val: any): val is Error;</code>
 </pre>
 </details>
 
@@ -7625,7 +7630,7 @@ Check if value is a function.
 <details>
 <summary>Type Definition</summary>
 <pre>
-<code class="language-typescript">function isFn(val: any): boolean;</code>
+<code class="language-typescript">function isFn(val: any): val is Function;</code>
 </pre>
 </details>
 
@@ -7998,7 +8003,7 @@ Check if value is an Null.
 <details>
 <summary>Type Definition</summary>
 <pre>
-<code class="language-typescript">function isNull(val: any): boolean;</code>
+<code class="language-typescript">function isNull(val: any): val is null;</code>
 </pre>
 </details>
 
@@ -8018,7 +8023,7 @@ Check if value is classified as a Number primitive or object.
 <details>
 <summary>Type Definition</summary>
 <pre>
-<code class="language-typescript">function isNum(val: any): boolean;</code>
+<code class="language-typescript">function isNum(val: any): val is number;</code>
 </pre>
 </details>
 
@@ -8223,7 +8228,7 @@ Check if value is a regular expression.
 <details>
 <summary>Type Definition</summary>
 <pre>
-<code class="language-typescript">function isRegExp(val: any): boolean;</code>
+<code class="language-typescript">function isRegExp(val: any): val is RegExp;</code>
 </pre>
 </details>
 
@@ -8341,7 +8346,7 @@ Check if value is a string primitive.
 <details>
 <summary>Type Definition</summary>
 <pre>
-<code class="language-typescript">function isStr(val: any): boolean;</code>
+<code class="language-typescript">function isStr(val: any): val is string;</code>
 </pre>
 </details>
 
@@ -8383,7 +8388,7 @@ Check if value is a symbol.
 <details>
 <summary>Type Definition</summary>
 <pre>
-<code class="language-typescript">function isSymbol(val: any): boolean;</code>
+<code class="language-typescript">function isSymbol(val: any): val is symbol;</code>
 </pre>
 </details>
 
@@ -8424,7 +8429,7 @@ Check if value is undefined.
 <details>
 <summary>Type Definition</summary>
 <pre>
-<code class="language-typescript">function isUndef(val: any): boolean;</code>
+<code class="language-typescript">function isUndef(val: any): val is undefined;</code>
 </pre>
 </details>
 
@@ -12544,7 +12549,11 @@ Trigger browser events.
 <details>
 <summary>Type Definition</summary>
 <pre>
-<code class="language-typescript">function trigger(el: Element | Document, type: string, options?: any): void;
+<code class="language-typescript">function trigger(
+    el: Element | Document,
+    type: string,
+    options?: any
+): void;
 function trigger(type: string, options?: any): void;</code>
 </pre>
 </details>

DOC_CN.md

@@ -1726,6 +1726,7 @@ CSS 媒体查询监听器。
 <pre>
 <code class="language-typescript">class MediaQuery extends Emitter {
     constructor(query: string);
+    setQuery(query: string): void;
     isMatch(): boolean;
 }</code>
 </pre>
@@ -1739,6 +1740,10 @@ CSS 媒体查询监听器。
 |-----|---|
 |query|媒体查询字符串|
 
+### setQuery
+
+更新查询字符串。
+
 ### isMatch
 
 如果媒体查询匹配，返回真。
@@ -7116,7 +7121,7 @@ isAbsoluteUrl('surunzi.com'); // -> false
 <details>
 <summary>类型定义</summary>
 <pre>
-<code class="language-typescript">function isArgs(val: any): boolean;</code>
+<code class="language-typescript">function isArgs(val: any): val is IArguments;</code>
 </pre>
 </details>
 
@@ -7140,7 +7145,7 @@ isArgs(
 <details>
 <summary>类型定义</summary>
 <pre>
-<code class="language-typescript">function isArr(val: any): boolean;</code>
+<code class="language-typescript">function isArr(val: any): val is any[];</code>
 </pre>
 </details>
 
@@ -7161,7 +7166,7 @@ isArr({}); // -> false
 <details>
 <summary>类型定义</summary>
 <pre>
-<code class="language-typescript">function isArrBuffer(val: any): boolean;</code>
+<code class="language-typescript">function isArrBuffer(val: any): val is ArrayBuffer;</code>
 </pre>
 </details>
 
@@ -7248,7 +7253,7 @@ isBlob([]); // -> false
 <details>
 <summary>类型定义</summary>
 <pre>
-<code class="language-typescript">function isBool(val: any): boolean;</code>
+<code class="language-typescript">function isBool(val: any): val is boolean;</code>
 </pre>
 </details>
 
@@ -7452,7 +7457,7 @@ console.log(isDocker()); // -> true if running inside a docker container.
 <details>
 <summary>类型定义</summary>
 <pre>
-<code class="language-typescript">function isEl(val: any): boolean;</code>
+<code class="language-typescript">function isEl(val: any): val is Element;</code>
 </pre>
 </details>
 
@@ -7535,7 +7540,7 @@ isEqual([1, 2, 3], [1, 2, 3]); // -> true
 <details>
 <summary>类型定义</summary>
 <pre>
-<code class="language-typescript">function isErr(val: any): boolean;</code>
+<code class="language-typescript">function isErr(val: any): val is Error;</code>
 </pre>
 </details>
 
@@ -7618,7 +7623,7 @@ isFinite(Infinity); // -> false
 <details>
 <summary>类型定义</summary>
 <pre>
-<code class="language-typescript">function isFn(val: any): boolean;</code>
+<code class="language-typescript">function isFn(val: any): val is Function;</code>
 </pre>
 </details>
 
@@ -7991,7 +7996,7 @@ console.log(isNode); // -> true if running in node
 <details>
 <summary>类型定义</summary>
 <pre>
-<code class="language-typescript">function isNull(val: any): boolean;</code>
+<code class="language-typescript">function isNull(val: any): val is null;</code>
 </pre>
 </details>
 
@@ -8011,7 +8016,7 @@ isNull(null); // -> true
 <details>
 <summary>类型定义</summary>
 <pre>
-<code class="language-typescript">function isNum(val: any): boolean;</code>
+<code class="language-typescript">function isNum(val: any): val is number;</code>
 </pre>
 </details>
 
@@ -8216,7 +8221,7 @@ isPromise({}); // -> false
 <details>
 <summary>类型定义</summary>
 <pre>
-<code class="language-typescript">function isRegExp(val: any): boolean;</code>
+<code class="language-typescript">function isRegExp(val: any): val is RegExp;</code>
 </pre>
 </details>
 
@@ -8334,7 +8339,7 @@ isSorted([3, 2, 1]); // -> false
 <details>
 <summary>类型定义</summary>
 <pre>
-<code class="language-typescript">function isStr(val: any): boolean;</code>
+<code class="language-typescript">function isStr(val: any): val is string;</code>
 </pre>
 </details>
 
@@ -8376,7 +8381,7 @@ isStream(new stream.Stream()); // -> true
 <details>
 <summary>类型定义</summary>
 <pre>
-<code class="language-typescript">function isSymbol(val: any): boolean;</code>
+<code class="language-typescript">function isSymbol(val: any): val is symbol;</code>
 </pre>
 </details>
 
@@ -8417,7 +8422,7 @@ isTypedArr(new Uint8Array(8)); // -> true
 <details>
 <summary>类型定义</summary>
 <pre>
-<code class="language-typescript">function isUndef(val: any): boolean;</code>
+<code class="language-typescript">function isUndef(val: any): val is undefined;</code>
 </pre>
 </details>
 
@@ -12535,7 +12540,11 @@ topoSort([
 <details>
 <summary>类型定义</summary>
 <pre>
-<code class="language-typescript">function trigger(el: Element | Document, type: string, options?: any): void;
+<code class="language-typescript">function trigger(
+    el: Element | Document,
+    type: string,
+    options?: any
+): void;
 function trigger(type: string, options?: any): void;</code>
 </pre>
 </details>

demo/MediaQuery.demo.html

@@ -2,6 +2,7 @@
 
 <script>
     const mediaQuery = new MediaQuery('screen and (max-width: 1000px)');
+    mediaQuery.setQuery('screen and (max-width: 500px)');
     mediaQuery.on('match', () => console.log('match'));
     mediaQuery.on('unmatch', () => console.log('unmatch'));
 </script>

i18n/MediaQuery.md

@@ -10,6 +10,10 @@ CSS 媒体查询监听器。
 |-----|---|
 |query|媒体查询字符串|
 
+### setQuery
+
+更新查询字符串。
+
 ### isMatch
 
 如果媒体查询匹配，返回真。

lib/format.js

@@ -1,7 +1,7 @@
 const prettier = require('prettier');
 const { fs, defaults, keys } = require('licia');
 const { runScript, extractComment, replaceComment } = require('./util');
-const prettierCfg = require('../prettier.config');
+const prettierCfg = require('../.prettierrc.json');
 
 const modData = require('../index.json');
 

src/MediaQuery.js

@@ -8,6 +8,10 @@
  * |-----|-----------|
  * |query|Media query|
  *
+ * ### setQuery
+ *
+ * Update query.
+ *
  * ### isMatch
  *
  * Return true if given media query matches.
@@ -39,6 +43,7 @@
 /* typescript
  * export declare class MediaQuery extends Emitter {
  *     constructor(query: string);
+ *     setQuery(query: string): void;
  *     isMatch(): boolean;
  * }
  */
@@ -50,11 +55,18 @@ exports = Emitter.extend({
     initialize(query) {
         this.callSuper(Emitter, 'initialize');
 
+        this._listener = () => {
+            this.emit(this.isMatch() ? 'match' : 'unmatch');
+        };
+        this.setQuery(query);
+    },
+    setQuery(query) {
+        if (this._mql) {
+            this._mql.removeListener(this._listener);
+        }
         this._mql = window.matchMedia(query);
 
-        this._mql.addListener(() => {
-            this.emit(this.isMatch() ? 'match' : 'unmatch');
-        });
+        this._mql.addListener(this._listener);
     },
     isMatch() {
         return this._mql.matches;

test/MediaQuery.js

@@ -1,2 +1,4 @@
 const mediaQuery = new MediaQuery('screen and (max-width:1000px)');
 expect(mediaQuery.isMatch()).to.be.a('boolean');
+mediaQuery.setQuery('screen and (max-width:500px)');
+expect(mediaQuery.isMatch()).to.be.a('boolean');