refactor: moved to utils (#5218)

Author: mfranzke

packages/components/src/components/input/input.lite.tsx

@@ -36,6 +36,7 @@ import {
 	getNumber,
 	hasVoiceOver,
 	isArrayOfStrings,
+	isIOSSafari,
 	stringPropVisible,
 	uuid
 } from '../../utils';
@@ -159,22 +160,6 @@ export default function DBInput(props: DBInputProps) {
 						}))
 					: _list) || []
 			);
-		},
-		// iOS Safari VoiceOver input:is([type="date"], [type="datetime-local"], [type="time"], [type="week"], [type="month"], [type="color"]) hack
-		// TODO: We could remove this one again, after https://bugs.webkit.org/show_bug.cgi?id=294649 (mentioned in https://github.com/facebook/react/issues/33541) has been resolved.
-		isIOSSafari: (): boolean => {
-			if (
-				typeof window === 'undefined' ||
-				typeof navigator === 'undefined'
-			)
-				return false;
-			const ua = navigator.userAgent;
-			// iOS detection
-			const isIOS = /iP(ad|hone|od)/.test(ua);
-			// Safari detection (not Chrome or Firefox on iOS)
-			const isSafari =
-				!!ua.match(/Safari/) && !ua.match(/CriOS|FxiOS|OPiOS|EdgiOS/);
-			return isIOS && isSafari;
 		}
 	});
 
@@ -279,9 +264,14 @@ export default function DBInput(props: DBInputProps) {
 				// iOS Safari VoiceOver input:is([type="date"], [type="datetime-local"], [type="time"], [type="week"], [type="month"], [type="color"]) hack
 				// TODO: We could remove this one again, after https://bugs.webkit.org/show_bug.cgi?id=294649 (mentioned in https://github.com/facebook/react/issues/33541) has been resolved.
 				role={
-					['datetime-local', 'date', 'time', 'week', 'month', 'color'].includes(
-						props.type ?? ''
-					) && state.isIOSSafari()
+					[
+						'datetime-local',
+						'date',
+						'time',
+						'week',
+						'month',
+						'color'
+					].includes(props.type ?? '') && isIOSSafari()
 						? 'textbox'
 						: undefined
 				}

packages/components/src/components/input/model.ts

@@ -133,7 +133,6 @@ export type DBInputProps = DBInputDefaultProps &
 export type DBInputDefaultState = {
 	_dataListId?: string;
 	getDataList: () => ValueLabelType[];
-	isIOSSafari: () => boolean;
 };
 
 export type DBInputState = DBInputDefaultState &

packages/components/src/utils/index.ts

@@ -57,6 +57,27 @@ export const hasVoiceOver = (): boolean =>
 	typeof window !== 'undefined' &&
 	appleOs.some((os) => window.navigator.userAgent.includes(os));
 
+/**
+ * Determines if the current browser is Safari running on an iOS device.
+ *
+ * This function checks the user agent string to verify both iOS platform
+ * (iPad, iPhone, or iPod) and Safari browser, excluding other browsers
+ * such as Chrome, Firefox, Opera, and Edge on iOS.
+ *
+ * @returns {boolean} `true` if the browser is Safari on iOS, otherwise `false`.
+ */
+export const isIOSSafari = (): boolean => {
+	if (typeof window === 'undefined' || typeof navigator === 'undefined')
+		return false;
+	const ua = navigator.userAgent;
+	// iOS detection
+	const isIOS = /iP(ad|hone|od)/.test(ua);
+	// Safari detection (not Chrome or Firefox on iOS)
+	const isSafari =
+		!!ua.match(/Safari/) && !ua.match(/CriOS|FxiOS|OPiOS|EdgiOS/);
+	return isIOS && isSafari;
+};
+
 export const delay = (fn: () => void, ms: number) =>
 	new Promise(() => setTimeout(fn, ms));