aura-glass
Version:
A comprehensive glassmorphism design system for React applications with 142+ production-ready components
78 lines • 2.37 kB
TypeScript
/**
* AuraGlass Device Orientation Effects
* Glass effects that respond to device orientation and motion
*/
import React from "react";
interface OrientationData {
alpha: number;
beta: number;
gamma: number;
absolute: boolean;
}
interface MotionData {
acceleration: {
x: number;
y: number;
z: number;
} | null;
accelerationIncludingGravity: {
x: number;
y: number;
z: number;
} | null;
rotationRate: {
alpha: number;
beta: number;
gamma: number;
} | null;
interval: number;
}
interface GlassOrientationEffectsProps {
children: React.ReactNode;
className?: string;
sensitivity?: number;
smoothing?: number;
effectTypes?: Array<"tilt" | "parallax" | "refraction" | "liquid" | "shimmer">;
gyroscopeEnabled?: boolean;
accelerometerEnabled?: boolean;
compassEnabled?: boolean;
onOrientationChange?: (orientation: OrientationData) => void;
onMotionChange?: (motion: MotionData) => void;
}
export declare function GlassOrientationEffects({ children, className, sensitivity, smoothing, effectTypes, gyroscopeEnabled, accelerometerEnabled, compassEnabled, onOrientationChange, onMotionChange, }: GlassOrientationEffectsProps): import("react/jsx-runtime").JSX.Element;
export declare function useDeviceOrientation(): {
orientation: OrientationData;
motion: MotionData;
isSupported: boolean;
setOrientation: React.Dispatch<React.SetStateAction<OrientationData>>;
setMotion: React.Dispatch<React.SetStateAction<MotionData>>;
};
export declare const orientationPresets: {
subtle: {
sensitivity: number;
smoothing: number;
effectTypes: readonly ["tilt", "parallax"];
};
immersive: {
sensitivity: number;
smoothing: number;
effectTypes: readonly ["tilt", "parallax", "refraction", "shimmer"];
};
gaming: {
sensitivity: number;
smoothing: number;
effectTypes: readonly ["tilt", "parallax", "liquid"];
};
reading: {
sensitivity: number;
smoothing: number;
effectTypes: readonly ["shimmer"];
};
presentation: {
sensitivity: number;
smoothing: number;
effectTypes: readonly ["tilt"];
};
};
export {};
//# sourceMappingURL=GlassOrientationEffects.d.ts.map