@tamagui/react-native-media-driver 1.74.3 → 1.74.4
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/esm/createMedia.native.js +9 -0
- package/dist/esm/createMedia.native.js.map +6 -0
- package/dist/esm/index.native.js +3 -0
- package/dist/esm/index.native.js.map +6 -0
- package/dist/esm/matchMedia.native.js +6 -0
- package/dist/esm/matchMedia.native.js.map +6 -0
- package/dist/esm/matchQuery.native.js +113 -0
- package/dist/esm/matchQuery.native.js.map +6 -0
- package/dist/esm/mediaQueryList.native.js +49 -0
- package/dist/esm/mediaQueryList.native.js.map +6 -0
- package/package.json +3 -3
|
@@ -0,0 +1,113 @@
|
|
|
1
|
+
const RE_MEDIA_QUERY = /(?:(only|not)?\s*([^\s\(\)]+)(?:\s*and)?\s*)?(.+)?/i, RE_MQ_EXPRESSION = /\(\s*([^\s\:\)]+)\s*(?:\:\s*([^\s\)]+))?\s*\)/, RE_MQ_FEATURE = /^(?:(min|max)-)?(.+)/, RE_LENGTH_UNIT = /(em|rem|px|cm|mm|in|pt|pc)?$/, RE_RESOLUTION_UNIT = /(dpi|dpcm|dppx)?$/;
|
|
2
|
+
function matchQuery(mediaQuery, values) {
|
|
3
|
+
return parseQuery(mediaQuery).some((query) => {
|
|
4
|
+
if (!query)
|
|
5
|
+
return;
|
|
6
|
+
const inverse = query.inverse, typeMatch = query.type === "all" || values.type === query.type;
|
|
7
|
+
if (typeMatch && inverse || !(typeMatch || inverse))
|
|
8
|
+
return !1;
|
|
9
|
+
const expressionsMatch = query.expressions.every((expression) => {
|
|
10
|
+
const feature = expression.feature, modifier = expression.modifier;
|
|
11
|
+
let expValue = expression.value, value = values[feature];
|
|
12
|
+
if (!value)
|
|
13
|
+
return !1;
|
|
14
|
+
switch (feature) {
|
|
15
|
+
case "orientation":
|
|
16
|
+
case "scan":
|
|
17
|
+
return value.toLowerCase() === expValue.toLowerCase();
|
|
18
|
+
case "width":
|
|
19
|
+
case "height":
|
|
20
|
+
case "device-width":
|
|
21
|
+
case "device-height":
|
|
22
|
+
expValue = toPx(expValue), value = toPx(value);
|
|
23
|
+
break;
|
|
24
|
+
case "resolution":
|
|
25
|
+
expValue = toDpi(expValue), value = toDpi(value);
|
|
26
|
+
break;
|
|
27
|
+
case "aspect-ratio":
|
|
28
|
+
case "device-aspect-ratio":
|
|
29
|
+
case /* Deprecated */
|
|
30
|
+
"device-pixel-ratio":
|
|
31
|
+
expValue = toDecimal(expValue), value = toDecimal(value);
|
|
32
|
+
break;
|
|
33
|
+
case "grid":
|
|
34
|
+
case "color":
|
|
35
|
+
case "color-index":
|
|
36
|
+
case "monochrome":
|
|
37
|
+
expValue = parseInt(expValue, 10) || 1, value = parseInt(value, 10) || 0;
|
|
38
|
+
break;
|
|
39
|
+
}
|
|
40
|
+
switch (modifier) {
|
|
41
|
+
case "min":
|
|
42
|
+
return value >= expValue;
|
|
43
|
+
case "max":
|
|
44
|
+
return value <= expValue;
|
|
45
|
+
default:
|
|
46
|
+
return value === expValue;
|
|
47
|
+
}
|
|
48
|
+
});
|
|
49
|
+
return expressionsMatch && !inverse || !expressionsMatch && inverse;
|
|
50
|
+
});
|
|
51
|
+
}
|
|
52
|
+
function parseQuery(mediaQuery) {
|
|
53
|
+
return mediaQuery.split(",").map(function(query) {
|
|
54
|
+
query = query.trim();
|
|
55
|
+
const captures = query.match(RE_MEDIA_QUERY);
|
|
56
|
+
if (!captures)
|
|
57
|
+
return null;
|
|
58
|
+
const modifier = captures[1], type = captures[2], expressions = (captures[3] || "").match(/\([^\)]+\)/g) || [];
|
|
59
|
+
return {
|
|
60
|
+
inverse: !!modifier && modifier.toLowerCase() === "not",
|
|
61
|
+
type: type ? type.toLowerCase() : "all",
|
|
62
|
+
expressions: expressions.map(function(expression) {
|
|
63
|
+
var captures2 = expression.match(RE_MQ_EXPRESSION), feature = captures2[1].toLowerCase().match(RE_MQ_FEATURE);
|
|
64
|
+
return {
|
|
65
|
+
modifier: feature[1],
|
|
66
|
+
feature: feature[2],
|
|
67
|
+
value: captures2[2]
|
|
68
|
+
};
|
|
69
|
+
})
|
|
70
|
+
};
|
|
71
|
+
});
|
|
72
|
+
}
|
|
73
|
+
function toDecimal(ratio) {
|
|
74
|
+
var decimal = Number(ratio), numbers;
|
|
75
|
+
return decimal || (numbers = ratio.match(/^(\d+)\s*\/\s*(\d+)$/), decimal = numbers[1] / numbers[2]), decimal;
|
|
76
|
+
}
|
|
77
|
+
function toDpi(resolution) {
|
|
78
|
+
const value = parseFloat(resolution);
|
|
79
|
+
switch (String(resolution).match(RE_RESOLUTION_UNIT)?.[1]) {
|
|
80
|
+
case "dpcm":
|
|
81
|
+
return value / 2.54;
|
|
82
|
+
case "dppx":
|
|
83
|
+
return value * 96;
|
|
84
|
+
default:
|
|
85
|
+
return value;
|
|
86
|
+
}
|
|
87
|
+
}
|
|
88
|
+
function toPx(length) {
|
|
89
|
+
const value = parseFloat(length);
|
|
90
|
+
switch (String(length).match(RE_LENGTH_UNIT)?.[1]) {
|
|
91
|
+
case "em":
|
|
92
|
+
return value * 16;
|
|
93
|
+
case "rem":
|
|
94
|
+
return value * 16;
|
|
95
|
+
case "cm":
|
|
96
|
+
return value * 96 / 2.54;
|
|
97
|
+
case "mm":
|
|
98
|
+
return value * 96 / 2.54 / 10;
|
|
99
|
+
case "in":
|
|
100
|
+
return value * 96;
|
|
101
|
+
case "pt":
|
|
102
|
+
return value * 72;
|
|
103
|
+
case "pc":
|
|
104
|
+
return value * 72 / 12;
|
|
105
|
+
default:
|
|
106
|
+
return value;
|
|
107
|
+
}
|
|
108
|
+
}
|
|
109
|
+
export {
|
|
110
|
+
matchQuery,
|
|
111
|
+
parseQuery
|
|
112
|
+
};
|
|
113
|
+
//# sourceMappingURL=matchQuery.js.map
|
|
@@ -0,0 +1,6 @@
|
|
|
1
|
+
{
|
|
2
|
+
"version": 3,
|
|
3
|
+
"sources": ["../../src/matchQuery.ts"],
|
|
4
|
+
"mappings": "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",
|
|
5
|
+
"names": ["captures"]
|
|
6
|
+
}
|
|
@@ -0,0 +1,49 @@
|
|
|
1
|
+
import { Dimensions } from "react-native";
|
|
2
|
+
import { matchQuery } from "./matchQuery";
|
|
3
|
+
class NativeMediaQueryList {
|
|
4
|
+
constructor(query) {
|
|
5
|
+
this.query = query;
|
|
6
|
+
this.listeners = [];
|
|
7
|
+
this.notify(), Dimensions.addEventListener("change", () => {
|
|
8
|
+
this.notify();
|
|
9
|
+
});
|
|
10
|
+
}
|
|
11
|
+
get orientation() {
|
|
12
|
+
const windowDimensions = Dimensions.get("window");
|
|
13
|
+
return windowDimensions.height > windowDimensions.width ? "portrait" : "landscape";
|
|
14
|
+
}
|
|
15
|
+
notify() {
|
|
16
|
+
this.listeners.forEach((listener) => {
|
|
17
|
+
listener(this.orientation);
|
|
18
|
+
});
|
|
19
|
+
}
|
|
20
|
+
addListener(listener) {
|
|
21
|
+
this.listeners.push(listener);
|
|
22
|
+
}
|
|
23
|
+
removeListener(listener) {
|
|
24
|
+
const index = this.listeners.indexOf(listener);
|
|
25
|
+
index !== -1 && this.listeners.splice(index, 1);
|
|
26
|
+
}
|
|
27
|
+
match(query, { width, height }) {
|
|
28
|
+
return matchQuery(query, {
|
|
29
|
+
type: "screen",
|
|
30
|
+
orientation: height > width ? "portrait" : "landscape",
|
|
31
|
+
"device-width": width,
|
|
32
|
+
"device-height": height
|
|
33
|
+
});
|
|
34
|
+
}
|
|
35
|
+
get matches() {
|
|
36
|
+
const windowDimensions = Dimensions.get("window");
|
|
37
|
+
return matchQuery(this.query, {
|
|
38
|
+
type: "screen",
|
|
39
|
+
orientation: this.orientation,
|
|
40
|
+
...windowDimensions,
|
|
41
|
+
"device-width": windowDimensions.width,
|
|
42
|
+
"device-height": windowDimensions.height
|
|
43
|
+
});
|
|
44
|
+
}
|
|
45
|
+
}
|
|
46
|
+
export {
|
|
47
|
+
NativeMediaQueryList
|
|
48
|
+
};
|
|
49
|
+
//# sourceMappingURL=mediaQueryList.js.map
|
|
@@ -0,0 +1,6 @@
|
|
|
1
|
+
{
|
|
2
|
+
"version": 3,
|
|
3
|
+
"sources": ["../../src/mediaQueryList.ts"],
|
|
4
|
+
"mappings": "AACA,SAAS,kBAAkB;AAE3B,SAAS,kBAAkB;AAMpB,MAAM,qBAA+C;AAAA,EAQ1D,YAAoB,OAAe;AAAf;AAPpB,SAAQ,YAAwB,CAAC;AAQ/B,SAAK,OAAO,GACZ,WAAW,iBAAiB,UAAU,MAAM;AAC1C,WAAK,OAAO;AAAA,IACd,CAAC;AAAA,EACH;AAAA,EAVA,IAAY,cAA2B;AACrC,UAAM,mBAAmB,WAAW,IAAI,QAAQ;AAChD,WAAO,iBAAiB,SAAS,iBAAiB,QAAQ,aAAa;AAAA,EACzE;AAAA,EASQ,SAAS;AACf,SAAK,UAAU,QAAQ,CAAC,aAAa;AACnC,eAAS,KAAK,WAAW;AAAA,IAC3B,CAAC;AAAA,EACH;AAAA,EAEA,YAAY,UAAoB;AAC9B,SAAK,UAAU,KAAK,QAAQ;AAAA,EAC9B;AAAA,EAEA,eAAe,UAAoB;AACjC,UAAM,QAAQ,KAAK,UAAU,QAAQ,QAAQ;AAC7C,IAAI,UAAU,MAAI,KAAK,UAAU,OAAO,OAAO,CAAC;AAAA,EAClD;AAAA,EAEA,MAAM,OAAe,EAAE,OAAO,OAAO,GAAsC;AACzE,WAAO,WAAW,OAAO;AAAA,MACvB,MAAM;AAAA,MACN,aAAa,SAAS,QAAQ,aAAa;AAAA,MAC3C,gBAAgB;AAAA,MAChB,iBAAiB;AAAA,IACnB,CAAC;AAAA,EACH;AAAA,EAEA,IAAI,UAAmB;AACrB,UAAM,mBAAmB,WAAW,IAAI,QAAQ;AAQhD,WAPgB,WAAW,KAAK,OAAO;AAAA,MACrC,MAAM;AAAA,MACN,aAAa,KAAK;AAAA,MAClB,GAAG;AAAA,MACH,gBAAgB,iBAAiB;AAAA,MACjC,iBAAiB,iBAAiB;AAAA,IACpC,CAAC;AAAA,EAEH;AACF;",
|
|
5
|
+
"names": []
|
|
6
|
+
}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@tamagui/react-native-media-driver",
|
|
3
|
-
"version": "1.74.
|
|
3
|
+
"version": "1.74.4",
|
|
4
4
|
"source": "src/index.ts",
|
|
5
5
|
"main": "dist/cjs",
|
|
6
6
|
"module": "dist/esm",
|
|
@@ -13,10 +13,10 @@
|
|
|
13
13
|
],
|
|
14
14
|
"sideEffects": true,
|
|
15
15
|
"dependencies": {
|
|
16
|
-
"@tamagui/web": "1.74.
|
|
16
|
+
"@tamagui/web": "1.74.4"
|
|
17
17
|
},
|
|
18
18
|
"devDependencies": {
|
|
19
|
-
"@tamagui/build": "1.74.
|
|
19
|
+
"@tamagui/build": "1.74.4",
|
|
20
20
|
"react-native": "^0.72.1"
|
|
21
21
|
},
|
|
22
22
|
"peerDependencies": {
|