| 556 | // prior to the state being updated. This results in onSelectionChange being called multiple times. |
| 557 | // TODO: refactor useComboBoxState to avoid this. |
| 558 | function useValueId(depArray: ReadonlyArray<any> = []): string | undefined { |
| 559 | let id = useId(); |
| 560 | let [exists, setExists] = useState(true); |
| 561 | let [lastDeps, setLastDeps] = useState(depArray); |
| 562 | |
| 563 | // If the deps changed, set exists to true so we can test whether the element exists. |
| 564 | if (lastDeps.some((v, i) => !Object.is(v, depArray[i]))) { |
| 565 | setExists(true); |
| 566 | setLastDeps(depArray); |
| 567 | } |
| 568 | |
| 569 | useEffect(() => { |
| 570 | if (exists && !document.getElementById(id)) { |
| 571 | // oxlint-disable-next-line react/react-compiler |
| 572 | setExists(false); |
| 573 | } |
| 574 | }, [id, exists, lastDeps]); |
| 575 | |
| 576 | return exists ? id : undefined; |
| 577 | } |