@mantine/hooks
Version:
A collection of 50+ hooks for state and UI management
34 lines (33 loc) • 1.39 kB
JavaScript
"use client";
const require_use_isomorphic_effect = require("../use-isomorphic-effect/use-isomorphic-effect.cjs");
let react = require("react");
//#region packages/@mantine/hooks/src/use-orientation/use-orientation.ts
function getInitialValue(initialValue, getInitialValueInEffect) {
if (getInitialValueInEffect) return initialValue;
if (typeof window !== "undefined" && "screen" in window) return {
angle: window.screen.orientation?.angle ?? initialValue.angle,
type: window.screen.orientation?.type ?? initialValue.type
};
return initialValue;
}
function useOrientation({ defaultAngle = 0, defaultType = "landscape-primary", getInitialValueInEffect = true } = {}) {
const [orientation, setOrientation] = (0, react.useState)(getInitialValue({
angle: defaultAngle,
type: defaultType
}, getInitialValueInEffect));
const handleOrientationChange = (event) => {
const target = event.currentTarget;
setOrientation({
angle: target?.angle || 0,
type: target?.type || "landscape-primary"
});
};
require_use_isomorphic_effect.useIsomorphicEffect(() => {
window.screen.orientation?.addEventListener("change", handleOrientationChange);
return () => window.screen.orientation?.removeEventListener("change", handleOrientationChange);
}, []);
return orientation;
}
//#endregion
exports.useOrientation = useOrientation;
//# sourceMappingURL=use-orientation.cjs.map