UNPKG

@threlte/xr

Version:

Tools to more easily create VR and AR experiences with Threlte

47 lines (46 loc) 1.63 kB
import type { HTMLButtonAttributes } from 'svelte/elements'; import type { Snippet } from 'svelte'; /** * `<XRButton />` is an HTML `<button />` that can be used to init and * display info about your WebXR session. This is aliased by `ARButton` and * `VRButton` with sensible session defaults. * * ```svelte * <XRButton * mode={'immersive-ar' | 'immersive-vr' | 'inline'} * sessionInit={{ * optionalFeatures: ['local-floor', 'bounded-floor', 'hand-tracking', 'layers'] * }} * force={'enter' | 'exit' | undefined} * styled={'true' | 'false'} * onerror={(event) => {}} * onclick={(event) => {}} * /> * ``` */ declare const XrButton: import("svelte").Component<HTMLButtonAttributes & { /** The type of `XRSession` to create */ mode: XRSessionMode; /** * `XRSession` configuration options * @see https://immersive-web.github.io/webxr/#feature-dependencies */ sessionInit?: XRSessionInit & { domOverlay?: { root: HTMLElement; } | undefined; }; /** Whether this button should only enter / exit an `XRSession`. Default is to toggle both ways */ force?: "enter" | "exit"; /** Whether to apply automatic styling to the button. Set false to apply custom styles. Default is true. */ styled?: boolean; children?: Snippet<[{ state: "blocked" | "unsupported" | "insecure" | "supported"; }]>; onclick?: (event: { state: "blocked" | "unsupported" | "insecure" | "supported"; nativeEvent: MouseEvent; }) => void; onerror?: (error: Error) => void; }, {}, "">; export default XrButton;