react-simplikit 0.0.53 → 0.2.0

package/dist/mobile/hooks/useAvoidKeyboard/useAvoidKeyboard.d.cts

@@ -0,0 +1,89 @@
+
+import { CSSProperties } from "react";
+//#region src/mobile/hooks/useAvoidKeyboard/useAvoidKeyboard.d.ts
+type UseAvoidKeyboardOptions = {
+  /**
+   * Base bottom offset in pixels when keyboard is hidden.
+   * @default 0
+   */
+  safeAreaBottom?: number;
+  /**
+   * Transition duration in milliseconds for smooth animation.
+   * @default 200
+   */
+  transitionDuration?: number;
+  /**
+   * Transition timing function for the animation.
+   * @default 'ease-out'
+   */
+  transitionTimingFunction?: CSSProperties['transitionTimingFunction'];
+  /**
+   * If true, the hook will get the initial keyboard height on mount.
+   * @default true
+   */
+  immediate?: boolean;
+};
+type UseAvoidKeyboardResult = {
+  /**
+   * CSS style object to apply to the fixed bottom element.
+   * Contains transform and transition properties.
+   */
+  style: CSSProperties;
+};
+/**
+ * @description
+ * `useAvoidKeyboard` is a React hook that helps fixed-bottom elements avoid the on-screen keyboard.
+ * It returns a CSS style that can be applied to `position: fixed` elements
+ * to smoothly move them above the keyboard when it appears.
+ *
+ * @param {UseAvoidKeyboardOptions} [options] - Configuration options.
+ * @param {number} [options.safeAreaBottom=0] - Base bottom offset in pixels when the keyboard is hidden. Useful for accounting for the iPhone home indicator area.
+ * @param {number} [options.transitionDuration=200] - Transition duration in milliseconds for smooth animation.
+ * @param {CSSProperties['transitionTimingFunction']} [options.transitionTimingFunction='ease-out'] - Transition timing function for the animation.
+ * @param {boolean} [options.immediate=true] - If true, gets the initial keyboard height on mount.
+ *
+ * @returns {UseAvoidKeyboardResult} An object containing the CSS style for keyboard avoidance.
+ * - style `CSSProperties` - CSS style object to apply to the fixed bottom element. Contains `transform` and `transition` properties;
+ *
+ * @example
+ * function FixedBottomCTA() {
+ *   const { style } = useAvoidKeyboard();
+ *
+ *   return (
+ *     <div
+ *       style={{
+ *         position: 'fixed',
+ *         bottom: 0,
+ *         left: 0,
+ *         right: 0,
+ *         ...style,
+ *       }}
+ *     >
+ *       <button>Submit</button>
+ *     </div>
+ *   );
+ * }
+ *
+ * @example
+ * // With safe area bottom offset (e.g., for iPhone home indicator)
+ * function FixedBottomCTA() {
+ *   const { style } = useAvoidKeyboard({ safeAreaBottom: 34 });
+ *
+ *   return (
+ *     <div
+ *       style={{
+ *         position: 'fixed',
+ *         bottom: 0,
+ *         left: 0,
+ *         right: 0,
+ *         ...style,
+ *       }}
+ *     >
+ *       <button>Submit</button>
+ *     </div>
+ *   );
+ * }
+ */
+declare function useAvoidKeyboard(options?: UseAvoidKeyboardOptions): UseAvoidKeyboardResult;
+//#endregion
+export { useAvoidKeyboard };

package/dist/mobile/hooks/useAvoidKeyboard/useAvoidKeyboard.d.mts

@@ -0,0 +1,89 @@
+
+import { CSSProperties } from "react";
+//#region src/mobile/hooks/useAvoidKeyboard/useAvoidKeyboard.d.ts
+type UseAvoidKeyboardOptions = {
+  /**
+   * Base bottom offset in pixels when keyboard is hidden.
+   * @default 0
+   */
+  safeAreaBottom?: number;
+  /**
+   * Transition duration in milliseconds for smooth animation.
+   * @default 200
+   */
+  transitionDuration?: number;
+  /**
+   * Transition timing function for the animation.
+   * @default 'ease-out'
+   */
+  transitionTimingFunction?: CSSProperties['transitionTimingFunction'];
+  /**
+   * If true, the hook will get the initial keyboard height on mount.
+   * @default true
+   */
+  immediate?: boolean;
+};
+type UseAvoidKeyboardResult = {
+  /**
+   * CSS style object to apply to the fixed bottom element.
+   * Contains transform and transition properties.
+   */
+  style: CSSProperties;
+};
+/**
+ * @description
+ * `useAvoidKeyboard` is a React hook that helps fixed-bottom elements avoid the on-screen keyboard.
+ * It returns a CSS style that can be applied to `position: fixed` elements
+ * to smoothly move them above the keyboard when it appears.
+ *
+ * @param {UseAvoidKeyboardOptions} [options] - Configuration options.
+ * @param {number} [options.safeAreaBottom=0] - Base bottom offset in pixels when the keyboard is hidden. Useful for accounting for the iPhone home indicator area.
+ * @param {number} [options.transitionDuration=200] - Transition duration in milliseconds for smooth animation.
+ * @param {CSSProperties['transitionTimingFunction']} [options.transitionTimingFunction='ease-out'] - Transition timing function for the animation.
+ * @param {boolean} [options.immediate=true] - If true, gets the initial keyboard height on mount.
+ *
+ * @returns {UseAvoidKeyboardResult} An object containing the CSS style for keyboard avoidance.
+ * - style `CSSProperties` - CSS style object to apply to the fixed bottom element. Contains `transform` and `transition` properties;
+ *
+ * @example
+ * function FixedBottomCTA() {
+ *   const { style } = useAvoidKeyboard();
+ *
+ *   return (
+ *     <div
+ *       style={{
+ *         position: 'fixed',
+ *         bottom: 0,
+ *         left: 0,
+ *         right: 0,
+ *         ...style,
+ *       }}
+ *     >
+ *       <button>Submit</button>
+ *     </div>
+ *   );
+ * }
+ *
+ * @example
+ * // With safe area bottom offset (e.g., for iPhone home indicator)
+ * function FixedBottomCTA() {
+ *   const { style } = useAvoidKeyboard({ safeAreaBottom: 34 });
+ *
+ *   return (
+ *     <div
+ *       style={{
+ *         position: 'fixed',
+ *         bottom: 0,
+ *         left: 0,
+ *         right: 0,
+ *         ...style,
+ *       }}
+ *     >
+ *       <button>Submit</button>
+ *     </div>
+ *   );
+ * }
+ */
+declare function useAvoidKeyboard(options?: UseAvoidKeyboardOptions): UseAvoidKeyboardResult;
+//#endregion
+export { useAvoidKeyboard };

package/dist/mobile/hooks/useAvoidKeyboard/useAvoidKeyboard.mjs

@@ -0,0 +1,75 @@
+"use client";
+import { useKeyboardHeight } from "../useKeyboardHeight/useKeyboardHeight.mjs";
+import { useMemo } from "react";
+//#region src/mobile/hooks/useAvoidKeyboard/useAvoidKeyboard.ts
+/**
+* @description
+* `useAvoidKeyboard` is a React hook that helps fixed-bottom elements avoid the on-screen keyboard.
+* It returns a CSS style that can be applied to `position: fixed` elements
+* to smoothly move them above the keyboard when it appears.
+*
+* @param {UseAvoidKeyboardOptions} [options] - Configuration options.
+* @param {number} [options.safeAreaBottom=0] - Base bottom offset in pixels when the keyboard is hidden. Useful for accounting for the iPhone home indicator area.
+* @param {number} [options.transitionDuration=200] - Transition duration in milliseconds for smooth animation.
+* @param {CSSProperties['transitionTimingFunction']} [options.transitionTimingFunction='ease-out'] - Transition timing function for the animation.
+* @param {boolean} [options.immediate=true] - If true, gets the initial keyboard height on mount.
+*
+* @returns {UseAvoidKeyboardResult} An object containing the CSS style for keyboard avoidance.
+* - style `CSSProperties` - CSS style object to apply to the fixed bottom element. Contains `transform` and `transition` properties;
+*
+* @example
+* function FixedBottomCTA() {
+*   const { style } = useAvoidKeyboard();
+*
+*   return (
+*     <div
+*       style={{
+*         position: 'fixed',
+*         bottom: 0,
+*         left: 0,
+*         right: 0,
+*         ...style,
+*       }}
+*     >
+*       <button>Submit</button>
+*     </div>
+*   );
+* }
+*
+* @example
+* // With safe area bottom offset (e.g., for iPhone home indicator)
+* function FixedBottomCTA() {
+*   const { style } = useAvoidKeyboard({ safeAreaBottom: 34 });
+*
+*   return (
+*     <div
+*       style={{
+*         position: 'fixed',
+*         bottom: 0,
+*         left: 0,
+*         right: 0,
+*         ...style,
+*       }}
+*     >
+*       <button>Submit</button>
+*     </div>
+*   );
+* }
+*/
+function useAvoidKeyboard(options = {}) {
+	const { safeAreaBottom = 0, transitionDuration = 200, transitionTimingFunction = "ease-out", immediate = true } = options;
+	const { keyboardHeight } = useKeyboardHeight({ immediate });
+	return { style: useMemo(() => {
+		return {
+			transform: `translateY(${keyboardHeight > 0 ? -(keyboardHeight + safeAreaBottom) : 0}px)`,
+			transition: `transform ${transitionDuration}ms ${transitionTimingFunction}`
+		};
+	}, [
+		keyboardHeight,
+		safeAreaBottom,
+		transitionDuration,
+		transitionTimingFunction
+	]) };
+}
+//#endregion
+export { useAvoidKeyboard };

package/dist/mobile/hooks/useBodyScrollLock/useBodyScrollLock.cjs

@@ -0,0 +1,47 @@
+"use client";
+const require_disableBodyScrollLock = require("../../utils/disableBodyScrollLock/disableBodyScrollLock.cjs");
+const require_enableBodyScrollLock = require("../../utils/enableBodyScrollLock/enableBodyScrollLock.cjs");
+let react = require("react");
+//#region src/mobile/hooks/useBodyScrollLock/useBodyScrollLock.ts
+/**
+* @description
+* `useBodyScrollLock` is a React hook that locks body scroll while the component is mounted.
+* It automatically locks on mount and unlocks on unmount.
+*
+* **Note:** For multiple overlapping modals, use a single lock at the parent level.
+*
+* @example
+* function Modal() {
+*   useBodyScrollLock();
+*   return <div className="modal">Modal content</div>;
+* }
+*
+* @example
+* // Multiple modals - single lock pattern
+* function BodyScrollLock() {
+*   useBodyScrollLock();
+*   return null;
+* }
+*
+* function App() {
+*   const hasModal = showModal1 || showModal2;
+*
+*   return (
+*     <>
+*       {hasModal && <BodyScrollLock />}
+*       {showModal1 && <Modal1 />}
+*       {showModal2 && <Modal2 />}
+*     </>
+*   );
+* }
+*/
+function useBodyScrollLock() {
+	(0, react.useEffect)(() => {
+		require_enableBodyScrollLock.enableBodyScrollLock();
+		return () => {
+			require_disableBodyScrollLock.disableBodyScrollLock();
+		};
+	}, []);
+}
+//#endregion
+exports.useBodyScrollLock = useBodyScrollLock;

package/dist/mobile/hooks/useBodyScrollLock/useBodyScrollLock.d.cts

@@ -0,0 +1,37 @@
+
+//#region src/mobile/hooks/useBodyScrollLock/useBodyScrollLock.d.ts
+/**
+ * @description
+ * `useBodyScrollLock` is a React hook that locks body scroll while the component is mounted.
+ * It automatically locks on mount and unlocks on unmount.
+ *
+ * **Note:** For multiple overlapping modals, use a single lock at the parent level.
+ *
+ * @example
+ * function Modal() {
+ *   useBodyScrollLock();
+ *   return <div className="modal">Modal content</div>;
+ * }
+ *
+ * @example
+ * // Multiple modals - single lock pattern
+ * function BodyScrollLock() {
+ *   useBodyScrollLock();
+ *   return null;
+ * }
+ *
+ * function App() {
+ *   const hasModal = showModal1 || showModal2;
+ *
+ *   return (
+ *     <>
+ *       {hasModal && <BodyScrollLock />}
+ *       {showModal1 && <Modal1 />}
+ *       {showModal2 && <Modal2 />}
+ *     </>
+ *   );
+ * }
+ */
+declare function useBodyScrollLock(): void;
+//#endregion
+export { useBodyScrollLock };

package/dist/mobile/hooks/useBodyScrollLock/useBodyScrollLock.d.mts

@@ -0,0 +1,37 @@
+
+//#region src/mobile/hooks/useBodyScrollLock/useBodyScrollLock.d.ts
+/**
+ * @description
+ * `useBodyScrollLock` is a React hook that locks body scroll while the component is mounted.
+ * It automatically locks on mount and unlocks on unmount.
+ *
+ * **Note:** For multiple overlapping modals, use a single lock at the parent level.
+ *
+ * @example
+ * function Modal() {
+ *   useBodyScrollLock();
+ *   return <div className="modal">Modal content</div>;
+ * }
+ *
+ * @example
+ * // Multiple modals - single lock pattern
+ * function BodyScrollLock() {
+ *   useBodyScrollLock();
+ *   return null;
+ * }
+ *
+ * function App() {
+ *   const hasModal = showModal1 || showModal2;
+ *
+ *   return (
+ *     <>
+ *       {hasModal && <BodyScrollLock />}
+ *       {showModal1 && <Modal1 />}
+ *       {showModal2 && <Modal2 />}
+ *     </>
+ *   );
+ * }
+ */
+declare function useBodyScrollLock(): void;
+//#endregion
+export { useBodyScrollLock };

package/dist/mobile/hooks/useBodyScrollLock/useBodyScrollLock.mjs

@@ -0,0 +1,47 @@
+"use client";
+import { disableBodyScrollLock } from "../../utils/disableBodyScrollLock/disableBodyScrollLock.mjs";
+import { enableBodyScrollLock } from "../../utils/enableBodyScrollLock/enableBodyScrollLock.mjs";
+import { useEffect } from "react";
+//#region src/mobile/hooks/useBodyScrollLock/useBodyScrollLock.ts
+/**
+* @description
+* `useBodyScrollLock` is a React hook that locks body scroll while the component is mounted.
+* It automatically locks on mount and unlocks on unmount.
+*
+* **Note:** For multiple overlapping modals, use a single lock at the parent level.
+*
+* @example
+* function Modal() {
+*   useBodyScrollLock();
+*   return <div className="modal">Modal content</div>;
+* }
+*
+* @example
+* // Multiple modals - single lock pattern
+* function BodyScrollLock() {
+*   useBodyScrollLock();
+*   return null;
+* }
+*
+* function App() {
+*   const hasModal = showModal1 || showModal2;
+*
+*   return (
+*     <>
+*       {hasModal && <BodyScrollLock />}
+*       {showModal1 && <Modal1 />}
+*       {showModal2 && <Modal2 />}
+*     </>
+*   );
+* }
+*/
+function useBodyScrollLock() {
+	useEffect(() => {
+		enableBodyScrollLock();
+		return () => {
+			disableBodyScrollLock();
+		};
+	}, []);
+}
+//#endregion
+export { useBodyScrollLock };

package/dist/mobile/hooks/useKeyboardHeight/useKeyboardHeight.cjs

@@ -0,0 +1,41 @@
+"use client";
+const require_subscribeKeyboardHeight = require("../../utils/subscribeKeyboardHeight/subscribeKeyboardHeight.cjs");
+let react = require("react");
+//#region src/mobile/hooks/useKeyboardHeight/useKeyboardHeight.ts
+/**
+* @description
+* `useKeyboardHeight` is a React hook that tracks the on-screen keyboard height.
+* It returns the current keyboard height in pixels, which updates automatically
+* when the keyboard appears, disappears, or changes size.
+*
+* @param {UseKeyboardHeightOptions} [options] - Configuration options.
+* @param {boolean} [options.immediate=true] - If true, gets the initial keyboard height on mount.
+*
+* @returns {UseKeyboardHeightResult} An object containing the current keyboard height.
+* - keyboardHeight `number` - The current keyboard height in pixels. 0 when the keyboard is hidden;
+*
+* @example
+* function ChatInput() {
+*   const { keyboardHeight } = useKeyboardHeight();
+*
+*   return (
+*     <div style={{ paddingBottom: `${keyboardHeight}px` }}>
+*       <input type="text" placeholder="Type a message..." />
+*     </div>
+*   );
+* }
+*/
+function useKeyboardHeight(options = {}) {
+	const { immediate = true } = options;
+	const [keyboardHeight, setKeyboardHeight] = (0, react.useState)(0);
+	(0, react.useEffect)(function subscribeToKeyboardHeight() {
+		const { unsubscribe } = require_subscribeKeyboardHeight.subscribeKeyboardHeight({
+			callback: setKeyboardHeight,
+			immediate
+		});
+		return unsubscribe;
+	}, [immediate]);
+	return { keyboardHeight };
+}
+//#endregion
+exports.useKeyboardHeight = useKeyboardHeight;

package/dist/mobile/hooks/useKeyboardHeight/useKeyboardHeight.d.cts

@@ -0,0 +1,41 @@
+
+//#region src/mobile/hooks/useKeyboardHeight/useKeyboardHeight.d.ts
+type UseKeyboardHeightOptions = {
+  /**
+   * If true, the hook will get the initial keyboard height on mount.
+   * @default true
+   */
+  immediate?: boolean;
+};
+type UseKeyboardHeightResult = {
+  /**
+   * The current keyboard height in pixels.
+   */
+  keyboardHeight: number;
+};
+/**
+ * @description
+ * `useKeyboardHeight` is a React hook that tracks the on-screen keyboard height.
+ * It returns the current keyboard height in pixels, which updates automatically
+ * when the keyboard appears, disappears, or changes size.
+ *
+ * @param {UseKeyboardHeightOptions} [options] - Configuration options.
+ * @param {boolean} [options.immediate=true] - If true, gets the initial keyboard height on mount.
+ *
+ * @returns {UseKeyboardHeightResult} An object containing the current keyboard height.
+ * - keyboardHeight `number` - The current keyboard height in pixels. 0 when the keyboard is hidden;
+ *
+ * @example
+ * function ChatInput() {
+ *   const { keyboardHeight } = useKeyboardHeight();
+ *
+ *   return (
+ *     <div style={{ paddingBottom: `${keyboardHeight}px` }}>
+ *       <input type="text" placeholder="Type a message..." />
+ *     </div>
+ *   );
+ * }
+ */
+declare function useKeyboardHeight(options?: UseKeyboardHeightOptions): UseKeyboardHeightResult;
+//#endregion
+export { useKeyboardHeight };

package/dist/mobile/hooks/useKeyboardHeight/useKeyboardHeight.d.mts

@@ -0,0 +1,41 @@
+
+//#region src/mobile/hooks/useKeyboardHeight/useKeyboardHeight.d.ts
+type UseKeyboardHeightOptions = {
+  /**
+   * If true, the hook will get the initial keyboard height on mount.
+   * @default true
+   */
+  immediate?: boolean;
+};
+type UseKeyboardHeightResult = {
+  /**
+   * The current keyboard height in pixels.
+   */
+  keyboardHeight: number;
+};
+/**
+ * @description
+ * `useKeyboardHeight` is a React hook that tracks the on-screen keyboard height.
+ * It returns the current keyboard height in pixels, which updates automatically
+ * when the keyboard appears, disappears, or changes size.
+ *
+ * @param {UseKeyboardHeightOptions} [options] - Configuration options.
+ * @param {boolean} [options.immediate=true] - If true, gets the initial keyboard height on mount.
+ *
+ * @returns {UseKeyboardHeightResult} An object containing the current keyboard height.
+ * - keyboardHeight `number` - The current keyboard height in pixels. 0 when the keyboard is hidden;
+ *
+ * @example
+ * function ChatInput() {
+ *   const { keyboardHeight } = useKeyboardHeight();
+ *
+ *   return (
+ *     <div style={{ paddingBottom: `${keyboardHeight}px` }}>
+ *       <input type="text" placeholder="Type a message..." />
+ *     </div>
+ *   );
+ * }
+ */
+declare function useKeyboardHeight(options?: UseKeyboardHeightOptions): UseKeyboardHeightResult;
+//#endregion
+export { useKeyboardHeight };

package/dist/mobile/hooks/useKeyboardHeight/useKeyboardHeight.mjs

@@ -0,0 +1,41 @@
+"use client";
+import { subscribeKeyboardHeight } from "../../utils/subscribeKeyboardHeight/subscribeKeyboardHeight.mjs";
+import { useEffect, useState } from "react";
+//#region src/mobile/hooks/useKeyboardHeight/useKeyboardHeight.ts
+/**
+* @description
+* `useKeyboardHeight` is a React hook that tracks the on-screen keyboard height.
+* It returns the current keyboard height in pixels, which updates automatically
+* when the keyboard appears, disappears, or changes size.
+*
+* @param {UseKeyboardHeightOptions} [options] - Configuration options.
+* @param {boolean} [options.immediate=true] - If true, gets the initial keyboard height on mount.
+*
+* @returns {UseKeyboardHeightResult} An object containing the current keyboard height.
+* - keyboardHeight `number` - The current keyboard height in pixels. 0 when the keyboard is hidden;
+*
+* @example
+* function ChatInput() {
+*   const { keyboardHeight } = useKeyboardHeight();
+*
+*   return (
+*     <div style={{ paddingBottom: `${keyboardHeight}px` }}>
+*       <input type="text" placeholder="Type a message..." />
+*     </div>
+*   );
+* }
+*/
+function useKeyboardHeight(options = {}) {
+	const { immediate = true } = options;
+	const [keyboardHeight, setKeyboardHeight] = useState(0);
+	useEffect(function subscribeToKeyboardHeight() {
+		const { unsubscribe } = subscribeKeyboardHeight({
+			callback: setKeyboardHeight,
+			immediate
+		});
+		return unsubscribe;
+	}, [immediate]);
+	return { keyboardHeight };
+}
+//#endregion
+export { useKeyboardHeight };

package/dist/mobile/hooks/useNetworkStatus/useNetworkStatus.cjs

@@ -0,0 +1,88 @@
+"use client";
+const require_isServer = require("../../utils/isServer/isServer.cjs");
+let react = require("react");
+//#region src/mobile/hooks/useNetworkStatus/useNetworkStatus.ts
+/**
+* @description
+* `useNetworkStatus` is a React hook that provides access to the Network Information API.
+* It provides raw network connection data. Returns undefined for all properties
+* if the API is not supported (e.g., Safari, Firefox).
+*
+* **Browser Support**:
+* - Chrome/Edge (Android): Full support
+* - Chrome/Edge (Desktop): Partial support (effectiveType, downlink, rtt, saveData)
+* - Firefox: Not supported
+* - Safari: Not supported
+*
+* @returns {NetworkStatus} Network status information
+* - `effectiveType` - Connection quality: 'slow-2g' | '2g' | '3g' | '4g'
+* - `type` - Physical connection: 'wifi' | 'cellular' | 'ethernet' | etc.
+* - `downlink` - Downlink speed in Mbps
+* - `rtt` - Round-trip time in milliseconds
+* - `saveData` - User's data saver preference
+*
+* @example
+* function AdaptiveImage() {
+*   const { effectiveType, saveData } = useNetworkStatus();
+*
+*   // Determine quality based on your app's needs
+*   const useHighQuality = effectiveType === '4g' && !saveData;
+*
+*   return (
+*     <img
+*       src={useHighQuality ? 'high-res.jpg' : 'low-res.jpg'}
+*       alt="Content"
+*     />
+*   );
+* }
+*
+* @example
+* function VideoPlayer() {
+*   const { type, downlink } = useNetworkStatus();
+*
+*   // Custom logic: only autoplay on wifi with good bandwidth
+*   const shouldAutoplay = type === 'wifi' && (downlink ?? 0) > 5;
+*
+*   return <video src="video.mp4" autoPlay={shouldAutoplay} />;
+* }
+*
+* @see https://wicg.github.io/netinfo/
+* @see https://developer.mozilla.org/en-US/docs/Web/API/Network_Information_API
+*/
+function useNetworkStatus() {
+	const [networkStatus, setNetworkStatus] = (0, react.useState)(getNetworkStatus);
+	(0, react.useEffect)(function subscribeToNetworkChanges() {
+		if (require_isServer.isServer()) return;
+		const connection = getNavigatorConnection();
+		if (connection == null) return;
+		function updateNetworkStatus() {
+			setNetworkStatus(getNetworkStatus());
+		}
+		connection.addEventListener("change", updateNetworkStatus);
+		return function cleanup() {
+			connection.removeEventListener("change", updateNetworkStatus);
+		};
+	}, []);
+	return networkStatus;
+}
+function getNavigatorConnection() {
+	if (require_isServer.isServer() || !("connection" in navigator)) return null;
+	try {
+		return navigator.connection ?? null;
+	} catch {
+		return null;
+	}
+}
+function getNetworkStatus() {
+	const connection = getNavigatorConnection();
+	if (connection == null) return {};
+	return {
+		effectiveType: connection.effectiveType,
+		type: connection.type,
+		downlink: connection.downlink,
+		rtt: connection.rtt,
+		saveData: connection.saveData
+	};
+}
+//#endregion
+exports.useNetworkStatus = useNetworkStatus;