Using multiple `hrefs` seems to cause unpredictable removal of PendingStyle

[craigrileyuk]

	<ShadowRoot
		hrefs={[
			`${window.$adsf.pluginUrl}development/gutenberg/editor/dist/index.css`,
			`${window.$asdf.pluginUrl}development/gutenberg/editor/dist/roboto.css`,
		]}
		pendingStyles={css`
			:host {
				display: block;
				opacity: 0;
				transition: opacity 300ms ease-in-out;
			}
		`}
	>
		<div className="font-sans text-zinc-800" {...props}></div>
	</ShadowRoot>

When I'm using a single external stylesheet (via href or hrefs), everything works fine.

However if I have 2+ stylesheets, my shadow DOM stays invisible (as styled by pendingStyles).

It seems to be an issue with const onHrefLoad = React2.useCallback() wherin the loaded state of the previous stylesheet doesn't persist across multiple callbacks.