@pinnacle0/web-ui 0.6.28 → 0.6.29
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/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@pinnacle0/web-ui",
|
|
3
|
-
"version": "0.6.
|
|
3
|
+
"version": "0.6.29",
|
|
4
4
|
"author": "Pinnacle",
|
|
5
5
|
"license": "MIT",
|
|
6
6
|
"sideEffects": [
|
|
@@ -47,7 +47,7 @@
|
|
|
47
47
|
"react-dom": "19.2.0",
|
|
48
48
|
"react-router-dom": "5.3.0",
|
|
49
49
|
"@pinnacle0/devtool-util": "1.3.6",
|
|
50
|
-
"@pinnacle0/webpack-util": "0.8.
|
|
50
|
+
"@pinnacle0/webpack-util": "0.8.18"
|
|
51
51
|
},
|
|
52
52
|
"exports": {
|
|
53
53
|
"./core/*": {
|
|
@@ -1,12 +1,11 @@
|
|
|
1
1
|
/**
|
|
2
|
-
*
|
|
3
|
-
* This util only works on mobile devices.
|
|
4
|
-
* 2)
|
|
5
|
-
* For Safari Mobile & Iphone Mobile,
|
|
6
|
-
* ScreenOrientation API is not supported, and screen.availHeight & screen.availWidth will not produce a good result.
|
|
7
|
-
* So use old APIs: window.eventListener, 'orientationchange'.
|
|
2
|
+
* Orientation detection utility for mobile and desktop devices.
|
|
8
3
|
*
|
|
9
|
-
*
|
|
4
|
+
* Uses the matchMedia API with orientation media queries, which provides
|
|
5
|
+
* reliable cross-platform support including iOS 26+ where the legacy
|
|
6
|
+
* window.orientation API has been removed.
|
|
7
|
+
*
|
|
8
|
+
* @see https://developer.mozilla.org/en-US/docs/Web/CSS/Media_Queries/Using_media_queries
|
|
10
9
|
*/
|
|
11
10
|
export type OrientationType = "portrait" | "landscape";
|
|
12
11
|
export type Subscriber = (orientation: OrientationType) => void;
|
|
@@ -1,36 +1,37 @@
|
|
|
1
1
|
/**
|
|
2
|
-
*
|
|
3
|
-
* This util only works on mobile devices.
|
|
4
|
-
* 2)
|
|
5
|
-
* For Safari Mobile & Iphone Mobile,
|
|
6
|
-
* ScreenOrientation API is not supported, and screen.availHeight & screen.availWidth will not produce a good result.
|
|
7
|
-
* So use old APIs: window.eventListener, 'orientationchange'.
|
|
2
|
+
* Orientation detection utility for mobile and desktop devices.
|
|
8
3
|
*
|
|
9
|
-
*
|
|
4
|
+
* Uses the matchMedia API with orientation media queries, which provides
|
|
5
|
+
* reliable cross-platform support including iOS 26+ where the legacy
|
|
6
|
+
* window.orientation API has been removed.
|
|
7
|
+
*
|
|
8
|
+
* @see https://developer.mozilla.org/en-US/docs/Web/CSS/Media_Queries/Using_media_queries
|
|
10
9
|
*/
|
|
11
|
-
const supportScreenOrientationAPI = typeof window.screen.orientation !== "undefined";
|
|
12
10
|
function subscribe(subscriber) {
|
|
13
11
|
const handler = () => subscriber(current());
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
12
|
+
// Use matchMedia for iOS 26+ and other browsers
|
|
13
|
+
const portraitQuery = window.matchMedia("(orientation: portrait)");
|
|
14
|
+
const mediaHandler = () => handler();
|
|
15
|
+
// Use addEventListener for modern browsers, addListener for older ones
|
|
16
|
+
if (portraitQuery.addEventListener) {
|
|
17
|
+
portraitQuery.addEventListener("change", mediaHandler);
|
|
18
|
+
return () => portraitQuery.removeEventListener("change", mediaHandler);
|
|
17
19
|
}
|
|
18
20
|
else {
|
|
19
|
-
|
|
20
|
-
|
|
21
|
+
// Fallback for very old browsers
|
|
22
|
+
portraitQuery.addListener(mediaHandler);
|
|
23
|
+
return () => portraitQuery.removeListener(mediaHandler);
|
|
21
24
|
}
|
|
22
25
|
}
|
|
23
26
|
function current() {
|
|
24
27
|
try {
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
else {
|
|
29
|
-
return window.orientation === 0 ? "portrait" : "landscape";
|
|
30
|
-
}
|
|
28
|
+
// Use matchMedia API for iOS 26+ and other browsers
|
|
29
|
+
const isPortrait = window.matchMedia("(orientation: portrait)").matches;
|
|
30
|
+
return isPortrait ? "portrait" : "landscape";
|
|
31
31
|
}
|
|
32
32
|
catch {
|
|
33
|
-
|
|
33
|
+
// Final fallback: compare dimensions
|
|
34
|
+
return window.innerHeight >= window.innerWidth ? "portrait" : "landscape";
|
|
34
35
|
}
|
|
35
36
|
}
|
|
36
37
|
export const OrientationUtil = Object.freeze({
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/util/OrientationUtil/index.tsx"],"names":[],"mappings":"AAAA
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/util/OrientationUtil/index.tsx"],"names":[],"mappings":"AAAA;;;;;;;;GAQG;AAMH,SAAS,SAAS,CAAC,UAAsB;IACrC,MAAM,OAAO,GAAG,GAAG,EAAE,CAAC,UAAU,CAAC,OAAO,EAAE,CAAC,CAAC;IAC5C,gDAAgD;IAChD,MAAM,aAAa,GAAG,MAAM,CAAC,UAAU,CAAC,yBAAyB,CAAC,CAAC;IACnE,MAAM,YAAY,GAAG,GAAG,EAAE,CAAC,OAAO,EAAE,CAAC;IAErC,uEAAuE;IACvE,IAAI,aAAa,CAAC,gBAAgB,EAAE,CAAC;QACjC,aAAa,CAAC,gBAAgB,CAAC,QAAQ,EAAE,YAAY,CAAC,CAAC;QACvD,OAAO,GAAG,EAAE,CAAC,aAAa,CAAC,mBAAmB,CAAC,QAAQ,EAAE,YAAY,CAAC,CAAC;IAC3E,CAAC;SAAM,CAAC;QACJ,iCAAiC;QACjC,aAAa,CAAC,WAAW,CAAC,YAAY,CAAC,CAAC;QACxC,OAAO,GAAG,EAAE,CAAC,aAAa,CAAC,cAAc,CAAC,YAAY,CAAC,CAAC;IAC5D,CAAC;AACL,CAAC;AAED,SAAS,OAAO;IACZ,IAAI,CAAC;QACD,oDAAoD;QACpD,MAAM,UAAU,GAAG,MAAM,CAAC,UAAU,CAAC,yBAAyB,CAAC,CAAC,OAAO,CAAC;QACxE,OAAO,UAAU,CAAC,CAAC,CAAC,UAAU,CAAC,CAAC,CAAC,WAAW,CAAC;IACjD,CAAC;IAAC,MAAM,CAAC;QACL,qCAAqC;QACrC,OAAO,MAAM,CAAC,WAAW,IAAI,MAAM,CAAC,UAAU,CAAC,CAAC,CAAC,UAAU,CAAC,CAAC,CAAC,WAAW,CAAC;IAC9E,CAAC;AACL,CAAC;AAED,MAAM,CAAC,MAAM,eAAe,GAAG,MAAM,CAAC,MAAM,CAAC;IACzC,SAAS;IACT,OAAO;CACV,CAAC,CAAC"}
|