Skip to main content

Device

Device

Get device information, battery status, and language

Tags: info battery platform model language

View Demo

The useDevice composable provides comprehensive device information including model, platform, OS version, manufacturer, and unique device ID. It also provides battery status with level and charging state, as well as language/locale information.

Import​

<script>
  import { useDevice } from '@classic-homes/native/svelte';
</script>
// React
import { useDevice } from '@classic-homes/native/react';

Basic Usage​

<script lang="ts">
  import { useDevice } from '@classic-homes/native/svelte';

  const device = useDevice();

  $effect(() => {
    device.getBatteryInfo();
    device.getLanguageCode();
  });
</script>

{#if device.info}
  <p>{device.info.model} - {device.info.platform} {device.info.osVersion}</p>
{/if}
{#if device.battery}
  <p>Battery: {Math.round(device.battery.batteryLevel * 100)}%</p>
{/if}

API Reference​

Property Type Description
info DeviceInfo | null Device info (model, platform, OS version, etc.)
battery BatteryInfo | null Battery info (level, isCharging)
language LanguageInfo | null Language/locale information
deviceId string | null Unique device identifier
isLoading boolean Whether an operation is in progress
error Error | null Current error if any
getInfo () => Promise<DeviceInfo> Fetch device information
getBatteryInfo () => Promise<BatteryInfo> Fetch battery status
getLanguageCode () => Promise<LanguageInfo> Fetch language/locale
getId () => Promise<string> Get unique device ID

Accessibility​

  • Works with screen readers and assistive technologies
  • Provides loading and error states for accessible status updates
  • Keyboard accessible controls
  • Network - Monitor network connectivity status in real-time
  • App Lifecycle - Handle app state changes, deep links, and back button
On this page