@empathyco/x-components
Version:
Empathy X Components
35 lines (19 loc) • 1.59 kB
Markdown
<!-- Do not edit this file. It is automatically generated by API Documenter. -->
[Home](./index.md) > [@empathyco/x-components](./x-components.md) > [createUseDevice](./x-components.createusedevice.md)
## createUseDevice() function
Factory function that creates a composable for device detection using the devices parameter to configure breakpoints.
**Signature:**
```typescript
export declare function createUseDevice<Device extends string>(devices: Record<Device, number>): () => UseDeviceReturn<Device>;
```
## Parameters
| Parameter | Type | Description |
| --- | --- | --- |
| devices | Record<Device, number> | An object containing the breakpoints, where the key is the name of the device and the value is the screen width. |
**Returns:**
() => [UseDeviceReturn](./x-components.usedevicereturn.md)<!-- --><Device>
A composable which provides multiple reactive flags and values for detecting the current device. The flags names depends on the names passed in the `devices` parameter.
## Remarks
The `orientation` only works for orientation-sensor devices (mobile, tablet, etc). If in a desktop, the height of the window is larger than the width, the orientation will be `landscape`<!-- -->.
## Example
´´´typescript const useDevice = createUseDevice(<!-- -->{ mobile: 0, tablet: 744, desktop: 1024 }<!-- -->); const { isMobile, isMobileOrLess, isMobileOrGreater, isTablet, isTabletOrLess, isTabletOrGreater, isDesktop, isDesktopOrLess, isDesktopOrGreater, deviceName, orientation, istTouchable } = useDevice();