diff --git a/packages/@mantine/hooks/src/use-os/use-os.test.ts b/packages/@mantine/hooks/src/use-os/use-os.test.ts index bf6ffdc5fe1..5a43c1a38cd 100644 --- a/packages/@mantine/hooks/src/use-os/use-os.test.ts +++ b/packages/@mantine/hooks/src/use-os/use-os.test.ts @@ -13,6 +13,9 @@ const platforms = { android: [ 'Mozilla/5.0 (Linux; Android 10; K) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/114.0.0.0 Mobile Safari/537.36', ], + chromeos: [ + 'Mozilla/5.0 (X11; CrOS x86_64 13310.93.0) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/85.0.4183.133 Safari/537.36', + ], undetermined: ['UNKNOWN'], } as const; diff --git a/packages/@mantine/hooks/src/use-os/use-os.ts b/packages/@mantine/hooks/src/use-os/use-os.ts index f520c9608cf..9b67a60287a 100644 --- a/packages/@mantine/hooks/src/use-os/use-os.ts +++ b/packages/@mantine/hooks/src/use-os/use-os.ts @@ -1,7 +1,7 @@ import { useState } from 'react'; import { useIsomorphicEffect } from '../use-isomorphic-effect/use-isomorphic-effect'; -export type OS = 'undetermined' | 'macos' | 'ios' | 'windows' | 'android' | 'linux'; +export type OS = 'undetermined' | 'macos' | 'ios' | 'windows' | 'android' | 'linux' | 'chromeos'; function isMacOS(userAgent: string): boolean { const macosPattern = /(Macintosh)|(MacIntel)|(MacPPC)|(Mac68K)/i; @@ -33,6 +33,11 @@ function isLinux(userAgent: string): boolean { return linuxPattern.test(userAgent); } +function isChromeOS(userAgent: string): boolean { + const chromePattern = /CrOS/i; + return chromePattern.test(userAgent); +} + function getOS(): OS { if (typeof window === 'undefined') { return 'undetermined'; @@ -55,6 +60,9 @@ function getOS(): OS { if (isLinux(userAgent)) { return 'linux'; } + if (isChromeOS(userAgent)) { + return 'chromeos'; + } return 'undetermined'; }