react-native-screen-transitions 3.4.0-beta.0 → 3.4.0-beta.2

package/src/shared/stores/bounds/internals/clear.ts

@@ -1,18 +1,13 @@
 import { matchesNavigatorKey, matchesScreenKey } from "../helpers/matching";
 import type {
 	NavigatorKey,
+	PresenceEntry,
 	PresenceState,
 	ScreenKey,
 	SnapshotEntry,
 	TagLink,
 } from "../types";
-import {
-	debugClearLog,
-	debugStoreSizeLog,
-	presence,
-	type RegistryState,
-	registry,
-} from "./state";
+import { presence, type RegistryState, registry } from "./state";
 
 const hasAnyKeys = (record: Record<string, unknown>) => {
 	"worklet";
@@ -22,128 +17,23 @@ const hasAnyKeys = (record: Record<string, unknown>) => {
 	return false;
 };
 
-const countRegistryMatches = (
+type SnapshotPredicate = (
 	screenKey: ScreenKey,
-	matchByAncestor: boolean,
-): { snapshots: number; links: number } => {
-	"worklet";
-	const currentRegistry = registry.value;
-	let snapshots = 0;
-	let links = 0;
-
-	for (const tag in currentRegistry) {
-		const tagState = currentRegistry[tag];
-
-		for (const snapshotKey in tagState.snapshots) {
-			const snapshot = tagState.snapshots[snapshotKey];
-			const matched = matchByAncestor
-				? snapshotKey === screenKey ||
-					(snapshot.ancestorKeys?.includes(screenKey) ?? false)
-				: snapshotKey === screenKey;
-			if (matched) snapshots++;
-		}
-
-		for (let i = 0; i < tagState.linkStack.length; i++) {
-			const link = tagState.linkStack[i];
-			if (
-				matchesScreenKey(link.source, screenKey) ||
-				matchesScreenKey(link.destination, screenKey)
-			) {
-				links++;
-			}
-		}
-	}
-
-	return { snapshots, links };
-};
-
-const countRegistryMatchesByBranch = (
-	branchNavigatorKey: NavigatorKey,
-): { snapshots: number; links: number } => {
-	"worklet";
-	const currentRegistry = registry.value;
-	let snapshots = 0;
-	let links = 0;
-
-	for (const tag in currentRegistry) {
-		const tagState = currentRegistry[tag];
-
-		for (const snapshotKey in tagState.snapshots) {
-			const snapshot = tagState.snapshots[snapshotKey];
-			const matched =
-				snapshot.navigatorKey === branchNavigatorKey ||
-				(snapshot.ancestorNavigatorKeys?.includes(branchNavigatorKey) ?? false);
-			if (matched) snapshots++;
-		}
-
-		for (let i = 0; i < tagState.linkStack.length; i++) {
-			const link = tagState.linkStack[i];
-			if (
-				matchesNavigatorKey(link.source, branchNavigatorKey) ||
-				matchesNavigatorKey(link.destination, branchNavigatorKey)
-			) {
-				links++;
-			}
-		}
-	}
+	snapshot: SnapshotEntry,
+) => boolean;
 
-	return { snapshots, links };
-};
+type LinkPredicate = (link: TagLink) => boolean;
 
-const countPresenceMatches = (
+type PresencePredicate = (
 	screenKey: ScreenKey,
-	matchByAncestor: boolean,
-): number => {
-	"worklet";
-	const currentPresence = presence.value;
-	let matches = 0;
-
-	for (const tag in currentPresence) {
-		const tagEntries = currentPresence[tag];
-		for (const entryScreenKey in tagEntries) {
-			const entry = tagEntries[entryScreenKey];
-			const matched = matchByAncestor
-				? entryScreenKey === screenKey ||
-					(entry.ancestorKeys?.includes(screenKey) ?? false)
-				: entryScreenKey === screenKey;
-			if (matched) matches++;
-		}
-	}
-
-	return matches;
-};
-
-const countPresenceMatchesByBranch = (
-	branchNavigatorKey: NavigatorKey,
-): number => {
-	"worklet";
-	const currentPresence = presence.value;
-	let matches = 0;
-
-	for (const tag in currentPresence) {
-		const tagEntries = currentPresence[tag];
-		for (const entryScreenKey in tagEntries) {
-			const entry = tagEntries[entryScreenKey];
-			const matched =
-				entry.navigatorKey === branchNavigatorKey ||
-				(entry.ancestorNavigatorKeys?.includes(branchNavigatorKey) ?? false);
-			if (matched) matches++;
-		}
-	}
-
-	return matches;
-};
+	entry: PresenceEntry,
+) => boolean;
 
-const clearRegistry = (params: {
-	shouldRemoveSnapshot: (
-		screenKey: ScreenKey,
-		snapshot: SnapshotEntry,
-	) => boolean;
-	shouldRemoveLink: (link: TagLink) => boolean;
-}) => {
+const clearRegistry = (
+	shouldClearSnapshot: SnapshotPredicate,
+	shouldClearLink: LinkPredicate,
+) => {
 	"worklet";
-	const { shouldRemoveSnapshot, shouldRemoveLink } = params;
-
 	registry.modify(<T extends RegistryState>(state: T): T => {
 		"worklet";
 		for (const tag in state) {
@@ -151,14 +41,14 @@ const clearRegistry = (params: {
 
 			for (const snapshotKey in tagState.snapshots) {
 				const snapshot = tagState.snapshots[snapshotKey];
-				if (shouldRemoveSnapshot(snapshotKey, snapshot)) {
+				if (shouldClearSnapshot(snapshotKey, snapshot)) {
 					delete tagState.snapshots[snapshotKey];
 				}
 			}
 
 			for (let i = tagState.linkStack.length - 1; i >= 0; i--) {
 				const link = tagState.linkStack[i];
-				if (shouldRemoveLink(link)) {
+				if (shouldClearLink(link)) {
 					tagState.linkStack.splice(i, 1);
 				}
 			}
@@ -172,25 +62,7 @@ const clearRegistry = (params: {
 	});
 };
 
-const clearPresenceDirect = (screenKey: ScreenKey) => {
-	"worklet";
-	presence.modify(<T extends PresenceState>(state: T): T => {
-		"worklet";
-		for (const tag in state) {
-			const tagEntries = state[tag];
-			if (!tagEntries[screenKey]) continue;
-
-			delete tagEntries[screenKey];
-
-			if (!hasAnyKeys(tagEntries)) {
-				delete state[tag];
-			}
-		}
-		return state;
-	});
-};
-
-const clearPresenceByAncestor = (ancestorKey: ScreenKey) => {
+const clearPresence = (shouldClearPresence: PresencePredicate) => {
 	"worklet";
 	presence.modify(<T extends PresenceState>(state: T): T => {
 		"worklet";
@@ -199,10 +71,7 @@ const clearPresenceByAncestor = (ancestorKey: ScreenKey) => {
 
 			for (const entryScreenKey in tagEntries) {
 				const entry = tagEntries[entryScreenKey];
-				const shouldRemove =
-					entryScreenKey === ancestorKey ||
-					(entry.ancestorKeys?.includes(ancestorKey) ?? false);
-				if (shouldRemove) {
+				if (shouldClearPresence(entryScreenKey, entry)) {
 					delete tagEntries[entryScreenKey];
 				}
 			}
@@ -211,125 +80,83 @@ const clearPresenceByAncestor = (ancestorKey: ScreenKey) => {
 				delete state[tag];
 			}
 		}
+
 		return state;
 	});
 };
 
-const clearPresenceByBranch = (branchNavigatorKey: NavigatorKey) => {
+const performClear = (
+	shouldClearSnapshot: SnapshotPredicate,
+	shouldClearLink: LinkPredicate,
+	shouldClearPresence: PresencePredicate,
+) => {
 	"worklet";
-	presence.modify(<T extends PresenceState>(state: T): T => {
-		"worklet";
-		for (const tag in state) {
-			const tagEntries = state[tag];
-
-			for (const entryScreenKey in tagEntries) {
-				const entry = tagEntries[entryScreenKey];
-				const shouldRemove =
-					entry.navigatorKey === branchNavigatorKey ||
-					(entry.ancestorNavigatorKeys?.includes(branchNavigatorKey) ?? false);
-
-				if (shouldRemove) {
-					delete tagEntries[entryScreenKey];
-				}
-			}
-
-			if (!hasAnyKeys(tagEntries)) {
-				delete state[tag];
-			}
-		}
-		return state;
-	});
+	clearRegistry(shouldClearSnapshot, shouldClearLink);
+	clearPresence(shouldClearPresence);
 };
 
 function clear(screenKey: ScreenKey) {
 	"worklet";
-	const beforeMatches = countRegistryMatches(screenKey, false);
-	const beforePresenceMatches = countPresenceMatches(screenKey, false);
-
-	clearRegistry({
-		shouldRemoveSnapshot: (snapshotKey) => snapshotKey === screenKey,
-		shouldRemoveLink: (link) => {
+	performClear(
+		(snapshotKey) => snapshotKey === screenKey,
+		(link) => {
 			return (
 				matchesScreenKey(link.source, screenKey) ||
 				matchesScreenKey(link.destination, screenKey)
 			);
 		},
-	});
-
-	clearPresenceDirect(screenKey);
-
-	const afterMatches = countRegistryMatches(screenKey, false);
-	const afterPresenceMatches = countPresenceMatches(screenKey, false);
-
-	debugClearLog(
-		`clear(${screenKey}) snapshots=${beforeMatches.snapshots}->${afterMatches.snapshots} links=${beforeMatches.links}->${afterMatches.links} presence=${beforePresenceMatches}->${afterPresenceMatches}`,
+		(entryScreenKey) => entryScreenKey === screenKey,
 	);
-	debugStoreSizeLog(`clear(${screenKey})`);
 }
 
 function clearByAncestor(ancestorKey: ScreenKey) {
 	"worklet";
-	const beforeMatches = countRegistryMatches(ancestorKey, true);
-	const beforePresenceMatches = countPresenceMatches(ancestorKey, true);
-
-	clearRegistry({
-		shouldRemoveSnapshot: (snapshotKey, snapshot) => {
+	performClear(
+		(snapshotKey, snapshot) => {
 			return (
 				snapshotKey === ancestorKey ||
 				(snapshot.ancestorKeys?.includes(ancestorKey) ?? false)
 			);
 		},
-		shouldRemoveLink: (link) => {
+		(link) => {
 			return (
 				matchesScreenKey(link.source, ancestorKey) ||
 				matchesScreenKey(link.destination, ancestorKey)
 			);
 		},
-	});
-
-	clearPresenceByAncestor(ancestorKey);
-
-	const afterMatches = countRegistryMatches(ancestorKey, true);
-	const afterPresenceMatches = countPresenceMatches(ancestorKey, true);
-
-	debugClearLog(
-		`clearByAncestor(${ancestorKey}) snapshots=${beforeMatches.snapshots}->${afterMatches.snapshots} links=${beforeMatches.links}->${afterMatches.links} presence=${beforePresenceMatches}->${afterPresenceMatches}`,
+		(entryScreenKey, entry) => {
+			return (
+				entryScreenKey === ancestorKey ||
+				(entry.ancestorKeys?.includes(ancestorKey) ?? false)
+			);
+		},
 	);
-	debugStoreSizeLog(`clearByAncestor(${ancestorKey})`);
 }
 
 function clearByBranch(branchNavigatorKey: NavigatorKey) {
 	"worklet";
 	if (!branchNavigatorKey) return;
 
-	const beforeMatches = countRegistryMatchesByBranch(branchNavigatorKey);
-	const beforePresenceMatches =
-		countPresenceMatchesByBranch(branchNavigatorKey);
-
-	clearRegistry({
-		shouldRemoveSnapshot: (_snapshotKey, snapshot) => {
+	performClear(
+		(_snapshotKey, snapshot) => {
 			return (
 				snapshot.navigatorKey === branchNavigatorKey ||
 				(snapshot.ancestorNavigatorKeys?.includes(branchNavigatorKey) ?? false)
 			);
 		},
-		shouldRemoveLink: (link) => {
+		(link) => {
 			return (
 				matchesNavigatorKey(link.source, branchNavigatorKey) ||
 				matchesNavigatorKey(link.destination, branchNavigatorKey)
 			);
 		},
-	});
-
-	clearPresenceByBranch(branchNavigatorKey);
-
-	const afterMatches = countRegistryMatchesByBranch(branchNavigatorKey);
-	const afterPresenceMatches = countPresenceMatchesByBranch(branchNavigatorKey);
-
-	debugClearLog(
-		`clearByBranch(${branchNavigatorKey}) snapshots=${beforeMatches.snapshots}->${afterMatches.snapshots} links=${beforeMatches.links}->${afterMatches.links} presence=${beforePresenceMatches}->${afterPresenceMatches}`,
+		(_entryScreenKey, entry) => {
+			return (
+				entry.navigatorKey === branchNavigatorKey ||
+				(entry.ancestorNavigatorKeys?.includes(branchNavigatorKey) ?? false)
+			);
+		},
 	);
-	debugStoreSizeLog(`clearByBranch(${branchNavigatorKey})`);
 }
 
 export { clear, clearByAncestor, clearByBranch };

package/src/shared/stores/bounds/internals/presence.ts

@@ -1,5 +1,5 @@
 import type { BoundaryConfig, PresenceState, ScreenKey, TagID } from "../types";
-import { debugStoreSizeLog, type GroupsState, groups, presence } from "./state";
+import { type GroupsState, groups, presence } from "./state";
 
 function registerBoundaryPresence(
 	tag: TagID,
@@ -31,7 +31,6 @@ function registerBoundaryPresence(
 
 		return state;
 	});
-	debugStoreSizeLog(`registerBoundaryPresence(${tag},${screenKey})`);
 }
 
 function unregisterBoundaryPresence(tag: TagID, screenKey: ScreenKey) {
@@ -63,7 +62,6 @@ function unregisterBoundaryPresence(tag: TagID, screenKey: ScreenKey) {
 		delete state[tag];
 		return state;
 	});
-	debugStoreSizeLog(`unregisterBoundaryPresence(${tag},${screenKey})`);
 }
 
 function hasBoundaryPresence(tag: TagID, screenKey: ScreenKey): boolean {
@@ -123,7 +121,6 @@ function setGroupActiveId(group: string, id: string) {
 		};
 		return state;
 	});
-	debugStoreSizeLog(`setGroupActiveId(${group},${id})`);
 }
 
 function getGroupActiveId(group: string): string | null {

package/src/shared/stores/bounds/internals/registry.ts

@@ -8,12 +8,7 @@ import type {
 	TagLink,
 	TagState,
 } from "../types";
-import {
-	createEmptyTagState,
-	debugStoreSizeLog,
-	type RegistryState,
-	registry,
-} from "./state";
+import { createEmptyTagState, type RegistryState, registry } from "./state";
 
 const LINK_HISTORY_LIMIT = 3;
 
@@ -86,7 +81,6 @@ function registerSnapshot(
 		};
 		return state;
 	});
-	debugStoreSizeLog(`registerSnapshot(${tag},${screenKey})`);
 }
 
 function setLinkSource(
@@ -129,7 +123,6 @@ function setLinkSource(
 
 		return state;
 	});
-	debugStoreSizeLog(`setLinkSource(${tag},${screenKey})`);
 }
 
 function updateLinkSource(
@@ -182,7 +175,6 @@ function updateLinkSource(
 
 		return state;
 	});
-	debugStoreSizeLog(`updateLinkSource(${tag},${screenKey})`);
 }
 
 const findLatestPendingIndex = (
@@ -255,7 +247,6 @@ function setLinkDestination(
 
 		return state;
 	});
-	debugStoreSizeLog(`setLinkDestination(${tag},${screenKey})`);
 }
 
 function updateLinkDestination(
@@ -308,7 +299,6 @@ function updateLinkDestination(
 
 		return state;
 	});
-	debugStoreSizeLog(`updateLinkDestination(${tag},${screenKey})`);
 }
 
 function getActiveLink(tag: TagID, screenKey?: ScreenKey): TagLink | null {

package/src/shared/stores/bounds/internals/resolver.ts

@@ -7,7 +7,7 @@ import type {
 	TagLink,
 	TagState,
 } from "../types";
-import { debugResolverLog, registry } from "./state";
+import { registry } from "./state";
 
 const findLatestLink = (
 	tagState: TagState,
@@ -134,14 +134,6 @@ function resolveTransitionPair(
 	const sourceScreenKey = matchedLink?.source?.screenKey ?? null;
 	const destinationScreenKey = matchedLink?.destination?.screenKey ?? null;
 
-	if (!sourceBounds || !destinationBounds) {
-		debugResolverLog(
-			`unresolved tag=${tag} entering=${context.entering ? 1 : 0} source=${
-				sourceBounds ? 1 : 0
-			} destination=${destinationBounds ? 1 : 0} pending=${usedPending ? 1 : 0}`,
-		);
-	}
-
 	return {
 		sourceBounds,
 		destinationBounds,

package/src/shared/stores/bounds/internals/state.ts

@@ -15,101 +15,3 @@ export type GroupsState = Record<string, GroupState>;
 export const registry = makeMutable<RegistryState>({});
 export const presence = makeMutable<PresenceState>({});
 export const groups = makeMutable<GroupsState>({});
-
-const RESOLVER_LOG_PREFIX = "[bounds:resolver]";
-const ENABLE_RESOLVER_DEBUG_LOGS = false;
-const CLEAR_LOG_PREFIX = "[bounds:clear]";
-const ENABLE_CLEAR_DEBUG_LOGS = false;
-const SIZE_LOG_PREFIX = "[bounds:size]";
-const ENABLE_SIZE_DEBUG_LOGS = false;
-
-type BoundStoreSize = {
-	tags: number;
-	snapshots: number;
-	links: number;
-	pendingLinks: number;
-	completedLinks: number;
-	presenceTags: number;
-	presenceEntries: number;
-	presenceCount: number;
-	groups: number;
-};
-
-export function debugResolverLog(message: string) {
-	"worklet";
-	if (!ENABLE_RESOLVER_DEBUG_LOGS) return;
-	console.warn(`${RESOLVER_LOG_PREFIX} ${message}`);
-}
-
-export function debugClearLog(message: string) {
-	"worklet";
-	if (!ENABLE_CLEAR_DEBUG_LOGS) return;
-	console.warn(`${CLEAR_LOG_PREFIX} ${message}`);
-}
-
-const collectBoundStoreSize = (): BoundStoreSize => {
-	"worklet";
-	const currentRegistry = registry.value;
-	const currentPresence = presence.value;
-	const currentGroups = groups.value;
-
-	let tags = 0;
-	let snapshots = 0;
-	let links = 0;
-	let pendingLinks = 0;
-	let completedLinks = 0;
-
-	for (const tag in currentRegistry) {
-		tags++;
-		const tagState = currentRegistry[tag];
-		for (const _snapshotKey in tagState.snapshots) {
-			snapshots++;
-		}
-		for (let i = 0; i < tagState.linkStack.length; i++) {
-			links++;
-			if (tagState.linkStack[i].destination === null) {
-				pendingLinks++;
-			} else {
-				completedLinks++;
-			}
-		}
-	}
-
-	let presenceTags = 0;
-	let presenceEntries = 0;
-	let presenceCount = 0;
-	for (const tag in currentPresence) {
-		presenceTags++;
-		const entries = currentPresence[tag];
-		for (const screenKey in entries) {
-			presenceEntries++;
-			presenceCount += entries[screenKey].count ?? 0;
-		}
-	}
-
-	let groupsCount = 0;
-	for (const _group in currentGroups) {
-		groupsCount++;
-	}
-
-	return {
-		tags,
-		snapshots,
-		links,
-		pendingLinks,
-		completedLinks,
-		presenceTags,
-		presenceEntries,
-		presenceCount,
-		groups: groupsCount,
-	};
-};
-
-export function debugStoreSizeLog(action: string) {
-	"worklet";
-	if (!ENABLE_SIZE_DEBUG_LOGS) return;
-	const size = collectBoundStoreSize();
-	console.warn(
-		`${SIZE_LOG_PREFIX} ${action} tags=${size.tags} snapshots=${size.snapshots} links=${size.links} pending=${size.pendingLinks} completed=${size.completedLinks} presenceTags=${size.presenceTags} presenceEntries=${size.presenceEntries} presenceCount=${size.presenceCount} groups=${size.groups}`,
-	);
-}

package/src/shared/types/bounds.types.ts

@@ -38,6 +38,32 @@ export type BoundsNavigationZoomOptions = {
 	target?: "bound" | "fullscreen" | MeasuredDimensions;
 	debug?: boolean;
 	borderRadius?: number;
+	/**
+	 * Focused-screen element opacity curve.
+	 *
+	 * `open` is used while presenting the destination screen.
+	 * `close` is used while returning to the source screen.
+	 *
+	 * Tuple order:
+	 * - `inputStart`: transition progress start
+	 * - `inputEnd`: transition progress end
+	 * - `outputStart`: opacity at `inputStart` (defaults to built-in preset)
+	 * - `outputEnd`: opacity at `inputEnd` (defaults to built-in preset)
+	 */
+	focusedElementOpacity?: BoundsNavigationZoomOpacityRanges;
+	/**
+	 * Unfocused-screen matched element opacity curve.
+	 *
+	 * `open` is used while the previous screen animates out during present.
+	 * `close` is used while the previous screen animates back in during dismiss.
+	 *
+	 * Tuple order:
+	 * - `inputStart`: transition progress start
+	 * - `inputEnd`: transition progress end
+	 * - `outputStart`: opacity at `inputStart` (defaults to built-in preset)
+	 * - `outputEnd`: opacity at `inputEnd` (defaults to built-in preset)
+	 */
+	unfocusedElementOpacity?: BoundsNavigationZoomOpacityRanges;
 	/**
 	 * Scale applied to the unfocused background content while the focused bound
 	 * animates above it.
@@ -71,6 +97,54 @@ export type BoundsNavigationZoomOptions = {
 		growMax: number,
 		exponent?: number,
 	];
+	/**
+	 * Horizontal gesture drag translation curve.
+	 *
+	 * Tuple order:
+	 * - `negativeMax`: multiplier when dragging left / negative
+	 * - `positiveMax`: multiplier when dragging right / positive
+	 * - `exponent`: curve exponent controlling how quickly translation ramps
+	 *
+	 * Examples:
+	 * - `[0, 0]` disables horizontal drag translation
+	 * - `[0.5, 0.5]` halves horizontal drag travel
+	 * - `[1.2, 1.2]` amplifies horizontal drag travel
+	 */
+	horizontalDragTranslation?: readonly [
+		negativeMax: number,
+		positiveMax: number,
+		exponent?: number,
+	];
+	/**
+	 * Vertical gesture drag translation curve.
+	 *
+	 * Tuple order:
+	 * - `negativeMax`: multiplier when dragging up / negative
+	 * - `positiveMax`: multiplier when dragging down / positive
+	 * - `exponent`: curve exponent controlling how quickly translation ramps
+	 *
+	 * Examples:
+	 * - `[0, 0]` disables vertical drag translation
+	 * - `[0.5, 0.5]` halves vertical drag travel
+	 * - `[1.2, 1.2]` amplifies vertical drag travel
+	 */
+	verticalDragTranslation?: readonly [
+		negativeMax: number,
+		positiveMax: number,
+		exponent?: number,
+	];
+};
+
+export type BoundsNavigationZoomOpacityRange = readonly [
+	inputStart: number,
+	inputEnd: number,
+	outputStart?: number,
+	outputEnd?: number,
+];
+
+export type BoundsNavigationZoomOpacityRanges = {
+	open?: BoundsNavigationZoomOpacityRange;
+	close?: BoundsNavigationZoomOpacityRange;
 };
 
 export type BoundsNavigationZoomStyle = TransitionInterpolatedStyle & {

package/src/shared/types/index.ts

@@ -13,6 +13,8 @@ export type {
 	BoundsAccessor,
 	BoundsMethod,
 	BoundsNavigationAccessor,
+	BoundsNavigationZoomOpacityRange,
+	BoundsNavigationZoomOpacityRanges,
 	BoundsNavigationZoomOptions,
 	BoundsNavigationZoomStyle,
 } from "./bounds.types";

package/src/shared/utils/bounds/{helpers/constants.ts → constants.ts}

@@ -1,4 +1,4 @@
-import type { BoundsOptions } from "../types/options";
+import type { BoundsOptions } from "./types/options";
 
 export const DEFAULT_BOUNDS_OPTIONS = {
 	target: "bound",

package/src/shared/utils/bounds/helpers/{resolve-bound-tag.ts → create-bound-tag.ts}

@@ -5,13 +5,13 @@ export type ResolveBoundTagParams = {
 	group?: string;
 };
 
-export const resolveBoundTag = ({
+export const createBoundTag = ({
 	id,
 	group,
 }: ResolveBoundTagParams): string | undefined => {
 	"worklet";
 
-	if (id === undefined || id === null || id === "") return undefined;
+	if (id == null || id === "") return undefined;
 
 	const normalizedId = String(id);