Devices

Reactive primitives for enumerating and filtering media input/output devices (microphones, speakers, cameras).

npm i @solid-primitives/devices@next

Reactive primitives for enumerating and filtering media input/output devices (microphones, speakers, cameras).

Looking for accelerometer or gyroscope? Motion and orientation sensor primitives have moved to @solid-primitives/sensors.

How to use it

createDevices

Returns a reactive accessor for the full list of MediaDeviceInfo objects available to the browser. The list updates automatically whenever devices are added or removed.

import { createDevices } from "@solid-primitives/devices";

const devices = createDevices();
// => Accessor<MediaDeviceInfo[]>

createEffect(() => console.log(devices()));

createMicrophones / createSpeakers / createCameras

Filtered convenience primitives that each return an accessor for a specific device kind. Each one only re-runs downstream computations when a device of its own kind changes — devices of other kinds changing do not trigger updates.

import { createMicrophones, createSpeakers, createCameras } from "@solid-primitives/devices";

const microphones = createMicrophones();
// => Accessor<MediaDeviceInfo[]>  (kind === "audioinput")

const speakers = createSpeakers();
// => Accessor<MediaDeviceInfo[]>  (kind === "audiooutput")

const cameras = createCameras();
// => Accessor<MediaDeviceInfo[]>  (kind === "videoinput")

API

function createDevices(): Accessor<MediaDeviceInfo[]>;

function createMicrophones(): Accessor<MediaDeviceInfo[]>;
function createSpeakers(): Accessor<MediaDeviceInfo[]>;
function createCameras(): Accessor<MediaDeviceInfo[]>;

All four primitives:

• Are SSR-safe — return an empty array on the server.
• Require no arguments.
• Subscribe to devicechange events and clean up automatically via onCleanup.

Changelog

See CHANGELOG.md