@tamagui/web 2.7.7 → 3.0.0-beta.1093.1

package/dist/esm/hooks/useThemeState.mjs

@@ -1,377 +1,289 @@
 import { useIsomorphicLayoutEffect } from "@tamagui/constants";
 import { createContext, useContext, useEffect, useId, useReducer, useRef } from "react";
+import { getThemeScheme } from "@tamagui/helpers";
 import { getConfig } from "../config.mjs";
 import { MISSING_THEME_MESSAGE } from "../constants/constants.mjs";
+
 const ThemeStateContext = createContext("");
-const allListeners = /* @__PURE__ */new Map();
+const allListeners = /* @__PURE__ */ new Map();
 const listenersByParent = {};
-const HasRenderedOnce = /* @__PURE__ */new WeakMap();
-const HadTheme = /* @__PURE__ */new WeakMap();
-const PendingUpdate = /* @__PURE__ */new Map();
-const states = /* @__PURE__ */new Map();
-const localStates = /* @__PURE__ */new Map();
+const HasRenderedOnce = /* @__PURE__ */ new WeakMap();
+const HadTheme = /* @__PURE__ */ new WeakMap();
+const PendingUpdate = /* @__PURE__ */ new Map();
+const states = /* @__PURE__ */ new Map();
+const localStates = /* @__PURE__ */ new Map();
 let shouldForce = false;
 const forceUpdateThemes = () => {
-  cacheVersion++;
-  shouldForce = true;
-  allListeners.forEach(cb => cb());
-  shouldForce = false;
+	cacheVersion++;
+	shouldForce = true;
+	allListeners.forEach((cb) => cb());
+	shouldForce = false;
+};
+const getThemeState = (id) => states.get(id);
+const themeUpdateLayers = /* @__PURE__ */ new Map();
+const themeProviderParents = /* @__PURE__ */ new Map();
+const getThemeUpdateLayer = (id) => themeUpdateLayers.get(id);
+const getThemeProviderParent = (id) => themeProviderParents.get(id);
+const getThemeProviderChainSizes = () => ({
+	layers: themeUpdateLayers.size,
+	parents: themeProviderParents.size
+});
+const registerThemeProviderChain = (id, parentId, props) => {
+	themeProviderParents.set(id, parentId);
+	if (props._themeUpdate) themeUpdateLayers.set(id, props._themeUpdate);
+	else themeUpdateLayers.delete(id);
 };
-const getThemeState = id => states.get(id);
 let cacheVersion = 0;
-const themeNameCache = /* @__PURE__ */new Map();
+const themeNameCache = /* @__PURE__ */ new Map();
 let themeNameCacheVer = -1;
 let themes = null;
 let rootThemeState = null;
 const getRootThemeState = () => rootThemeState;
-const incReducer = c => c + 1;
-const useThemeState = (props, isRoot = false, keys, schemeKeys, cascadeOnChange = false) => {
-  "use no memo";
+const incReducer = (c) => c + 1;
+const useThemeState = (props, isRoot = false, keys, schemeKeys, cascadeOnChange = false, optimizeForFirstRender = false) => {
+	"use no memo";
+	const { disable } = props;
+	const parentId = useContext(ThemeStateContext);
+	if (!parentId && !isRoot) throw new Error(process.env.NODE_ENV === "development" ? `${MISSING_THEME_MESSAGE}
 
-  const {
-    disable
-  } = props;
-  const parentId = useContext(ThemeStateContext);
-  if (!parentId && !isRoot) throw new Error(process.env.NODE_ENV === "development" ? `${MISSING_THEME_MESSAGE}
-
-Looked for theme${props.name ? ` "${props.name}"` : ""}${props.componentName ? ` (component: ${props.componentName})` : ""}, but no parent theme context was found (parentId: ${parentId}).` : MISSING_THEME_MESSAGE);
-  if (disable) return states.get(parentId) || {
-    id: "",
-    name: "light",
-    theme: getConfig().themes.light
-  };
-  const id = useId();
-  const propsKey = getPropsKey(props);
-  const ref = useRef(null);
-  if (!ref.current) ref.current = {
-    id,
-    parentId,
-    props,
-    propsKey,
-    isRoot,
-    keys,
-    schemeKeys,
-    renderVersion: 0
-  };else {
-    ref.current.props = props;
-    ref.current.propsKey = propsKey;
-    ref.current.isRoot = isRoot;
-    ref.current.keys = keys;
-    ref.current.schemeKeys = schemeKeys;
-    ref.current.parentId = parentId;
-  }
-  ref.current.renderVersion++;
-  if (process.env.NODE_ENV === "development" && globalThis.time) globalThis.time`theme-prep-uses`;
-  const [, forceUpdate] = useReducer(incReducer, 0);
-  const state = getSnapshotImpl(ref.current);
-  ref.current.lastSnap = state;
-  useEffect(() => {
-    const r = ref.current;
-    const renderVersion = r.renderVersion;
-    if (r.lastSnap && !states.has(r.id)) {
-      states.set(r.id, r.lastSnap);
-      localStates.set(r.id, r.lastSnap);
-    }
-    if (r.unsubscribe && r.subscribedParentId !== r.parentId) cleanupThemeSubscription(r);
-    if (shouldSubscribeToTheme(r, cascadeOnChange)) {
-      if (!r.unsubscribe) {
-        const pid = r.parentId;
-        const sid = r.id;
-        const cb = () => {
-          const next = getSnapshotImpl(r);
-          if (next !== r.lastSnap) {
-            r.lastSnap = next;
-            forceUpdate();
-          }
-        };
-        listenersByParent[pid] = listenersByParent[pid] || /* @__PURE__ */new Set();
-        listenersByParent[pid].add(sid);
-        allListeners.set(sid, () => {
-          PendingUpdate.set(sid, shouldForce ? "force" : true);
-          cb();
-        });
-        r.subscribedParentId = pid;
-        r.unsubscribe = () => {
-          allListeners.delete(sid);
-          listenersByParent[pid]?.delete(sid);
-          localStates.delete(sid);
-          states.delete(sid);
-          PendingUpdate.delete(sid);
-          r.unsubscribe = void 0;
-          r.subscribedParentId = void 0;
-        };
-      }
-    } else if (r.unsubscribe) cleanupThemeSubscription(r);
-    return () => {
-      if (r.renderVersion === renderVersion) cleanupThemeState(r);
-    };
-  });
-  if (cascadeOnChange) useIsomorphicLayoutEffect(() => {
-    if (!HasRenderedOnce.get(keys)) {
-      HasRenderedOnce.set(keys, true);
-      return;
-    }
-    if (!propsKey) {
-      if (HadTheme.get(keys)) scheduleUpdate(id);
-      HadTheme.set(keys, false);
-      return;
-    }
-    if (process.env.NODE_ENV === "development" && props.debug === "verbose") console.warn(` \xB7 useTheme(${id}) scheduleUpdate`, propsKey, states.get(id)?.name);
-    scheduleUpdate(id);
-    HadTheme.set(keys, true);
-  }, [keys, propsKey]);
-  return state;
+Looked for theme${props.name ? ` "${props.name}"` : ""}, but no parent theme context was found (parentId: ${parentId}).` : MISSING_THEME_MESSAGE);
+	if (disable) return states.get(parentId) || {
+		id: "",
+		name: "light",
+		theme: getConfig().themes.light
+	};
+	const id = useId();
+	const propsKey = getPropsKey(props);
+	if (cascadeOnChange) registerThemeProviderChain(id, parentId, props);
+	const ref = useRef(null);
+	const r = ref.current ||= {
+		id,
+		parentId,
+		props,
+		propsKey,
+		isRoot,
+		keys,
+		schemeKeys,
+		optimizeForFirstRender,
+		renderVersion: 0
+	};
+	r.props = props;
+	r.propsKey = propsKey;
+	r.isRoot = isRoot;
+	r.keys = keys;
+	r.schemeKeys = schemeKeys;
+	r.parentId = parentId;
+	r.renderVersion++;
+	const [, forceUpdate] = useReducer(incReducer, 0);
+	const state = getSnapshotImpl(r);
+	r.lastSnap = state;
+	useEffect(() => {
+		const renderVersion = r.renderVersion;
+		if (r.lastSnap && !states.has(r.id)) {
+			states.set(r.id, r.lastSnap);
+			localStates.set(r.id, r.lastSnap);
+		}
+		if (cascadeOnChange && !themeProviderParents.has(r.id)) registerThemeProviderChain(r.id, r.parentId, r.props);
+		if (r.unsubscribe && r.subscribedParentId !== r.parentId) cleanupThemeSubscription(r);
+		if (shouldSubscribeToTheme(r, cascadeOnChange)) {
+			if (!r.unsubscribe) {
+				const pid = r.parentId;
+				const sid = r.id;
+				const cb = (forced) => {
+					const next = getSnapshotImpl(r);
+					if (next !== r.lastSnap) {
+						r.lastSnap = next;
+						if (!forced && r.props.nativeUpdate?.(next)) return;
+						forceUpdate();
+					}
+				};
+				(listenersByParent[pid] ||= /* @__PURE__ */ new Set()).add(sid);
+				allListeners.set(sid, () => {
+					const forced = shouldForce;
+					PendingUpdate.set(sid, forced ? "force" : true);
+					cb(forced);
+				});
+				r.subscribedParentId = pid;
+				r.unsubscribe = () => {
+					allListeners.delete(sid);
+					listenersByParent[pid]?.delete(sid);
+					localStates.delete(sid);
+					states.delete(sid);
+					PendingUpdate.delete(sid);
+					r.unsubscribe = void 0;
+					r.subscribedParentId = void 0;
+				};
+			}
+		} else if (r.unsubscribe) cleanupThemeSubscription(r);
+		return () => {
+			if (r.renderVersion === renderVersion) cleanupThemeState(r);
+		};
+	});
+	if (cascadeOnChange) useIsomorphicLayoutEffect(() => {
+		if (!HasRenderedOnce.get(keys)) {
+			HasRenderedOnce.set(keys, true);
+			return;
+		}
+		if (!propsKey) {
+			if (HadTheme.get(keys)) scheduleUpdate(id);
+			HadTheme.set(keys, false);
+			return;
+		}
+		scheduleUpdate(id);
+		HadTheme.set(keys, true);
+	}, [keys, propsKey]);
+	return state;
 };
-const shouldSubscribeToTheme = (r, cascadeOnChange) => r.isRoot || cascadeOnChange || hasThemeUpdatingProps(r.props) || !!r.keys.current?.size || !!r.props.needsUpdate?.();
+const shouldSubscribeToTheme = (r, cascadeOnChange) => Boolean(r.optimizeForFirstRender || r.isRoot || cascadeOnChange || hasThemeUpdatingProps(r.props) || r.keys.current?.size || r.props.needsUpdate?.());
 function cleanupThemeSubscription(r) {
-  r.unsubscribe?.();
+	r.unsubscribe?.();
 }
 function cleanupThemeState(r) {
-  if (r.unsubscribe) cleanupThemeSubscription(r);else {
-    localStates.delete(r.id);
-    states.delete(r.id);
-    PendingUpdate.delete(r.id);
-  }
+	if (r.unsubscribe) cleanupThemeSubscription(r);
+	else {
+		localStates.delete(r.id);
+		states.delete(r.id);
+		PendingUpdate.delete(r.id);
+	}
+	themeUpdateLayers.delete(r.id);
+	themeProviderParents.delete(r.id);
 }
-const getSnapshotImpl = r => {
-  const {
-    id,
-    parentId,
-    props,
-    propsKey,
-    isRoot,
-    keys,
-    schemeKeys
-  } = r;
-  let local = localStates.get(id);
-  const parentState = states.get(parentId);
-  if (local && !PendingUpdate.has(id)) {
-    if (parentState && local._parentName === parentState.name && local._propsKey === propsKey) return local;
-  }
-  const isSchemeOnlyChange = false;
-  const keysSize = keys?.current?.size ?? 0;
-  const allKeysSchemeOptimized = (schemeKeys?.current?.size ?? 0) === keysSize && keysSize > 0;
-  const canSkipForSchemeChange = isSchemeOnlyChange;
-  const needsUpdate = props.passThrough ? false : isRoot || props.name === "light" || props.name === "dark" || props.name === null ? true : !HasRenderedOnce.get(keys) ? true : keys?.current?.size ? true : props.needsUpdate?.();
-  const [rerender, next] = getNextState(local, props, propsKey, isRoot, id, parentId, needsUpdate, PendingUpdate.get(id));
-  PendingUpdate.delete(id);
-  if (!local || rerender) {
-    local = {
-      ...next
-    };
-    localStates.set(id, local);
-  }
-  if (process.env.NODE_ENV === "development" && props.debug === "verbose") {
-    console.groupCollapsed(` ${id} getSnapshot ${rerender}`, local.name, ">", next.name);
-    console.info({
-      props,
-      propsKey,
-      isRoot,
-      parentId,
-      local,
-      next,
-      needsUpdate,
-      isSchemeOnlyChange,
-      allKeysSchemeOptimized,
-      canSkipForSchemeChange
-    });
-    console.groupEnd();
-  }
-  if (next !== local) {
-    Object.assign(local, next);
-    local.id = id;
-  }
-  local._parentName = parentState?.name;
-  local._propsKey = propsKey;
-  states.set(id, next);
-  return local;
+const getSnapshotImpl = (r) => {
+	const { id, parentId, props, propsKey, isRoot, keys, schemeKeys, optimizeForFirstRender } = r;
+	let local = localStates.get(id);
+	const parentState = states.get(parentId);
+	if (local && !PendingUpdate.has(id)) {
+		if (parentState && local._parentName === parentState.name && local._parentSchemeAuthored === parentState.schemeAuthored && local._propsKey === propsKey) return local;
+	}
+	const isSchemeOnlyChange = !optimizeForFirstRender && false;
+	const allKeysSchemeOptimized = !optimizeForFirstRender && Boolean(keys.current?.size && schemeKeys?.current?.size === keys.current.size);
+	const canSkipForSchemeChange = Boolean(isSchemeOnlyChange && allKeysSchemeOptimized);
+	const needsUpdate = props.passThrough ? false : optimizeForFirstRender ? true : isRoot || props.name === "light" || props.name === "dark" || props.name === null ? true : !HasRenderedOnce.get(keys) ? true : canSkipForSchemeChange ? false : keys?.current?.size ? true : props.needsUpdate?.();
+	const [rerender, nextRaw] = getNextState(local, props, propsKey, isRoot, id, parentId, needsUpdate, PendingUpdate.get(id));
+	let next = nextRaw;
+	if (props._themeUpdate && nextRaw?.theme) {
+		const parentTheme = states.get(parentId)?.theme || nextRaw.theme;
+		const merged = props._themeUpdate.getTheme(parentTheme, nextRaw.name, getConfig());
+		if (merged !== nextRaw.theme) next = {
+			...nextRaw,
+			theme: merged
+		};
+	}
+	PendingUpdate.delete(id);
+	if (!local || rerender) {
+		local = { ...next };
+		localStates.set(id, local);
+	}
+	if (next !== local) {
+		Object.assign(local, next);
+		local.id = id;
+	}
+	local._parentName = parentState?.name;
+	local._parentSchemeAuthored = parentState?.schemeAuthored;
+	local._propsKey = propsKey;
+	states.set(id, next);
+	return local;
 };
 const getNextState = (lastState, props, propsKey, isRoot = false, id, parentId, needsUpdate, pendingUpdate) => {
-  const {
-    debug
-  } = props;
-  const parentState = states.get(parentId);
-  if (props.passThrough) return [false, lastState || parentState || {
-    name: ""
-  }];
-  if (!themes) themes = getConfig().themes;
-  const name = !propsKey && (!lastState || !lastState?.isNew) ? null : getNewThemeName(parentState?.name, props, pendingUpdate === "force" ? true : !!needsUpdate);
-  const isSameAsParent = parentState && (!name || name === parentState.name);
-  const shouldRerender = Boolean(pendingUpdate === "force" || needsUpdate && (pendingUpdate || lastState?.name !== parentState?.name));
-  if (process.env.NODE_ENV === "development" && debug === "verbose") {
-    const message = ` \xB7 useTheme(${id}) getNextState => ${name} needsUpdate ${needsUpdate} shouldRerender ${shouldRerender}`;
-    console.groupCollapsed(message);
-    console.trace({
-      name,
-      lastState,
-      parentState,
-      props,
-      propsKey,
-      id,
-      isSameAsParent
-    });
-    console.groupEnd();
-  }
-  if (isSameAsParent) {
-    if (!shouldRerender && lastState && lastState.name === parentState.name) return [false, lastState];
-    return [shouldRerender, {
-      ...parentState,
-      isNew: false
-    }];
-  }
-  if (!name) {
-    const next = lastState ?? parentState ?? rootThemeState ?? {
-      id,
-      name: "light",
-      theme: getConfig().themes.light
-    };
-    if (shouldRerender) return [true, {
-      ...(parentState || lastState || next)
-    }];
-    return [false, next];
-  }
-  const scheme = getScheme(name);
-  const parentInverses = parentState?.inverses ?? 0;
-  const isInverse = parentState && scheme !== parentState.scheme;
-  const inverses = parentInverses + (isInverse ? 1 : 0);
-  const nextState = {
-    id,
-    name,
-    theme: themes[name],
-    scheme,
-    parentId,
-    parentName: parentState?.name,
-    inverses,
-    isInverse,
-    isNew: true
-  };
-  if (isRoot) rootThemeState = nextState;
-  if (pendingUpdate !== "force" && lastState && lastState.name === name) return [false, nextState];
-  const shouldAvoidRerender = pendingUpdate !== "force" && lastState && !needsUpdate && nextState.name === lastState.name;
-  if (process.env.NODE_ENV === "development" && debug === "verbose") {
-    console.groupCollapsed(` \xB7 useTheme(${id}) \u23ED\uFE0F ${name} shouldAvoidRerender: ${shouldAvoidRerender}`);
-    console.info({
-      lastState,
-      needsUpdate,
-      nextState,
-      pendingUpdate
-    });
-    console.groupEnd();
-  }
-  if (shouldAvoidRerender) return [false, nextState];
-  return [true, nextState];
+	const parentState = states.get(parentId);
+	if (props.passThrough) return [false, lastState || parentState || { name: "" }];
+	themes ||= getConfig().themes;
+	const name = !propsKey && (!lastState || !lastState.isNew) ? null : getNewThemeName(parentState?.name, props, pendingUpdate === "force" ? true : !!needsUpdate);
+	const authoredName = props.name;
+	const parentSchemeAuthored = !!parentState?.schemeAuthored;
+	const schemeAuthored = isRoot ? !!props.forceClassName : parentSchemeAuthored || !!(authoredName && getThemeScheme(authoredName) && authoredName in themes);
+	const intentChanged = schemeAuthored !== parentSchemeAuthored;
+	const resolvedName = name || parentState?.name;
+	const sameAsLast = lastState && lastState.name === resolvedName && !!lastState.schemeAuthored === schemeAuthored;
+	const isSameAsParent = Boolean(parentState && resolvedName === parentState.name && !intentChanged);
+	const shouldRerender = Boolean(pendingUpdate === "force" || needsUpdate && (pendingUpdate || lastState?.name !== parentState?.name || !!lastState?.schemeAuthored !== schemeAuthored));
+	if (isSameAsParent) {
+		if (!shouldRerender && sameAsLast) return [false, lastState];
+		return [shouldRerender, {
+			...parentState,
+			isNew: false
+		}];
+	}
+	if (!resolvedName) {
+		const next = lastState ?? parentState ?? rootThemeState ?? {
+			id,
+			name: "light",
+			theme: getConfig().themes.light
+		};
+		if (shouldRerender) return [true, { ...parentState || lastState || next }];
+		return [false, next];
+	}
+	const scheme = getThemeScheme(resolvedName);
+	const parentInverses = parentState?.inverses ?? 0;
+	const isInverse = Boolean(parentState && scheme !== parentState.scheme);
+	const inverses = parentInverses + (isInverse ? 1 : 0);
+	const nextState = {
+		id,
+		name: resolvedName,
+		theme: themes[resolvedName],
+		scheme,
+		parentId,
+		parentName: parentState?.name,
+		inverses,
+		isInverse,
+		schemeAuthored,
+		isNew: true
+	};
+	if (isRoot) rootThemeState = nextState;
+	return [pendingUpdate === "force" || !sameAsLast, nextState];
 };
 function scheduleUpdate(id) {
-  const queue = [id];
-  const visited = /* @__PURE__ */new Set();
-  while (queue.length) {
-    const children = listenersByParent[queue.shift()];
-    if (children) {
-      for (const childId of children) if (!visited.has(childId)) {
-        visited.add(childId);
-        queue.push(childId);
-      }
-    }
-  }
-  visited.forEach(childId => {
-    allListeners.get(childId)?.();
-  });
-}
-const validSchemes = {
-  light: "light",
-  dark: "dark"
-};
-function getScheme(name) {
-  return validSchemes[name.split("_")[0]];
+	const queue = [id];
+	const visited = /* @__PURE__ */ new Set();
+	while (queue.length) {
+		const children = listenersByParent[queue.shift()];
+		if (children) {
+			for (const childId of children) if (!visited.has(childId)) {
+				visited.add(childId);
+				queue.push(childId);
+			}
+		}
+	}
+	visited.forEach((childId) => {
+		allListeners.get(childId)?.();
+	});
 }
 function getNewThemeName(parentName = "", props, forceUpdate = false) {
-  const {
-    name,
-    reset
-  } = props;
-  const componentName = props.unstyled ? void 0 : props.componentName;
-  if (name && reset) throw new Error(process.env.NODE_ENV === "production" ? `\u274C004` : "Cannot reset and set a new name at the same time.");
-  const cacheKey = `${parentName}|${name || ""}|${componentName || ""}|${reset ? 1 : 0}|${forceUpdate ? 1 : 0}`;
-  if (themeNameCacheVer !== cacheVersion) {
-    themeNameCache.clear();
-    themeNameCacheVer = cacheVersion;
-  } else {
-    const cached = themeNameCache.get(cacheKey);
-    if (cached !== void 0) return cached;
-  }
-  const {
-    themes: themes2
-  } = getConfig();
-  if (reset) {
-    if (parentName === "light" || parentName === "dark") {
-      const result2 = parentName === "light" ? "dark" : "light";
-      themeNameCache.set(cacheKey, result2);
-      return result2;
-    }
-    const lastPartIndex = parentName.lastIndexOf("_");
-    const name2 = lastPartIndex <= 0 ? parentName : parentName.slice(lastPartIndex);
-    const scheme = parentName.slice(0, lastPartIndex);
-    const result = themes2[name2] ? name2 : scheme;
-    themeNameCache.set(cacheKey, result);
-    return result;
-  }
-  const parentParts = parentName.split("_");
-  const lastName = parentParts[parentParts.length - 1];
-  if (lastName && lastName[0].toLowerCase() !== lastName[0]) parentParts.pop();
-  const subNames = [name && componentName ? `${name}_${componentName}` : void 0, name, componentName].filter(Boolean);
-  let found = null;
-  if (name) {
-    const nameHasScheme = getScheme(name);
-    if (nameHasScheme) {
-      for (const subName of subNames) if (subName in themes2) {
-        found = subName;
-        break;
-      }
-    }
-    if (!found && !nameHasScheme) {
-      if (getScheme(parentName)) {
-        const potentialBases = [];
-        for (let i = parentParts.length; i >= 1; i--) potentialBases.push(parentParts.slice(0, i).join("_"));
-        outer: for (const base of potentialBases) {
-          const candidates = [componentName ? `${base}_${name}_${componentName}` : void 0, `${base}_${name}`].filter(Boolean);
-          for (const potential of candidates) if (potential in themes2) {
-            found = potential;
-            break outer;
-          }
-        }
-      }
-    }
-  }
-  if (!found) if (!name && componentName) {
-    const potential = `${parentParts.join("_")}_${componentName}`;
-    if (potential in themes2) found = potential;
-  } else {
-    const max = parentParts.length;
-    for (let i = 0; i <= max; i++) {
-      const base = (i === 0 ? parentParts : parentParts.slice(0, -i)).join("_");
-      for (const subName of subNames) {
-        const potential = base ? `${base}_${subName}` : subName;
-        if (potential in themes2) {
-          found = potential;
-          break;
-        }
-      }
-      if (found) break;
-    }
-  }
-  if (!forceUpdate && found === parentName && !validSchemes[found]) {
-    themeNameCache.set(cacheKey, null);
-    return null;
-  }
-  themeNameCache.set(cacheKey, found);
-  return found;
+	const { name } = props;
+	const cacheKey = `${parentName}|${name || ""}|${forceUpdate ? 1 : 0}`;
+	if (themeNameCacheVer !== cacheVersion) {
+		themeNameCache.clear();
+		themeNameCacheVer = cacheVersion;
+	} else {
+		const cached = themeNameCache.get(cacheKey);
+		if (cached !== void 0) return cached;
+	}
+	const result = resolveThemeName(parentName, name ?? void 0, getConfig().themes, forceUpdate);
+	if (themeNameCache.size >= 1e4) themeNameCache.clear();
+	themeNameCache.set(cacheKey, result);
+	return result;
+}
+const getThemeNameCacheSize = () => themeNameCache.size;
+function resolveThemeName(parentName, name, themes2, forceUpdate = false) {
+	const parentParts = parentName ? parentName.split("_") : [];
+	let found = null;
+	if (name) {
+		const nameHasScheme = getThemeScheme(name);
+		if (nameHasScheme && name in themes2) found = name;
+		if (!found && !nameHasScheme) for (let i = parentParts.length; i >= 0; i--) {
+			const base = parentParts.slice(0, i).join("_");
+			const potential = base ? `${base}_${name}` : name;
+			if (potential in themes2) {
+				found = potential;
+				break;
+			}
+		}
+	}
+	if (!forceUpdate && found === parentName && found !== "light" && found !== "dark") return null;
+	return found;
 }
-const getPropsKey = ({
-  name,
-  reset,
-  forceClassName,
-  componentName
-}) => `${name || ""}${reset || ""}${forceClassName || ""}${componentName || ""}`;
-const hasThemeUpdatingProps = props => "name" in props || "reset" in props || "forceClassName" in props;
-export { ThemeStateContext, forceUpdateThemes, getRootThemeState, getThemeState, hasThemeUpdatingProps, useThemeState };
+const getPropsKey = ({ name, forceClassName, _themeUpdate }) => `${name || ""}${forceClassName || ""}${_themeUpdate?.key || ""}`;
+const hasThemeUpdatingProps = (props) => "name" in props || "forceClassName" in props || "_themeUpdate" in props;
+
+export { ThemeStateContext, forceUpdateThemes, getNewThemeName, getRootThemeState, getThemeNameCacheSize, getThemeProviderChainSizes, getThemeProviderParent, getThemeState, getThemeUpdateLayer, hasThemeUpdatingProps, resolveThemeName, useThemeState };
 //# sourceMappingURL=useThemeState.mjs.map