Clean up some workarounds for old upstream bugs (#40199)

* We no longer need to care about nanoid v3 thinking "browser === esm",
  because the GB package that had that dep no longer does.
* Various `jsx-a11y/label-has-associated-control` ignores referring to
  jsx-eslint/eslint-plugin-jsx-a11y#869 seem to be fixed now that #39736
  requires we use `htmlFor`. The one place still needing an ignore is
  jsx-eslint/eslint-plugin-jsx-a11y#578 instead.
* Remove reference to deleted renovate issue.
* Move reference to a Storybook bug to the code actually implementing
  the workaround.
* Update Storybook FAQ reference.
* Remove TODO references to a fixed Storybook bug (and fix a wrong prop
  in one story).
* Remove workaround for WordPress/WordPress-Coding-Standards#2390.

Committed via a GitHub action: https://github.com/Automattic/jetpack/actions/runs/11896972496

Upstream-Ref: Automattic/jetpack@62e385b

vendor/automattic/jetpack-mu-wpcom/CHANGELOG.md

@@ -13,7 +13,9 @@ This is an alpha version! The changes listed here are not final.
 - General: Update minimum PHP version to 7.2.
 
 ### Fixed
+- Add missing ids in Verbum EmailForm.
 - Coming Soon: update color of the banner to WordPress blue
+- Explicitly set `htmlFor` in recommended tags modal FormLabel.
 - Subscribe modal: fix an edge case reported by a user, where the site title shows character codes.
 
 ## [5.66.0] - 2024-11-11

vendor/automattic/jetpack-mu-wpcom/src/build/verbum-comments/verbum-comments.asset.php

@@ -1 +1 @@
-<?php return array('dependencies' => array('wp-polyfill'), 'version' => 'cd952c6ee1d27a42ddee');
+<?php return array('dependencies' => array('wp-polyfill'), 'version' => '97043884103359931e09');

vendor/automattic/jetpack-mu-wpcom/src/build/wpcom-block-editor-nux/wpcom-block-editor-nux.asset.php

@@ -1 +1 @@
-<?php return array('dependencies' => array('jetpack-connection', 'lodash', 'moment', 'react', 'react-dom', 'react-jsx-runtime', 'wp-api-fetch', 'wp-blocks', 'wp-components', 'wp-compose', 'wp-data', 'wp-data-controls', 'wp-dom', 'wp-element', 'wp-hooks', 'wp-i18n', 'wp-notices', 'wp-nux', 'wp-plugins', 'wp-polyfill', 'wp-primitives', 'wp-private-apis', 'wp-router', 'wp-url'), 'version' => 'a88002e8ac58d6ef4ed6');
+<?php return array('dependencies' => array('jetpack-connection', 'lodash', 'moment', 'react', 'react-dom', 'react-jsx-runtime', 'wp-api-fetch', 'wp-blocks', 'wp-components', 'wp-compose', 'wp-data', 'wp-data-controls', 'wp-dom', 'wp-element', 'wp-hooks', 'wp-i18n', 'wp-notices', 'wp-nux', 'wp-plugins', 'wp-polyfill', 'wp-primitives', 'wp-private-apis', 'wp-router', 'wp-url'), 'version' => '6e9b0e0aa9eccf002205');

vendor/automattic/jetpack-mu-wpcom/src/features/verbum-comments/src/components/EmailForm/index.tsx

@@ -84,10 +84,10 @@ export const EmailForm = ( { shouldShowEmailForm }: EmailFormProps ) => {
 			{ shouldShowEmailForm && (
 				<div className="verbum-form__wrapper">
 					<div className="verbum-form__content">
-						{ /* eslint-disable-next-line jsx-a11y/label-has-associated-control -- https://github.com/jsx-eslint/eslint-plugin-jsx-a11y/issues/869 */ }
-						<label className="verbum__label">
+						<label htmlFor="verbum-email-form-email" className="verbum__label">
 							<Email />
 							<input
+								id="verbum-email-form-email"
 								className={ clsx( 'verbum-form__email', {
 									'invalid-form-data': isValidEmail.value === false && isEmailTouched.value,
 								} ) }
@@ -108,10 +108,10 @@ export const EmailForm = ( { shouldShowEmailForm }: EmailFormProps ) => {
 							/>
 						</label>
 
-						{ /* eslint-disable-next-line jsx-a11y/label-has-associated-control -- https://github.com/jsx-eslint/eslint-plugin-jsx-a11y/issues/869 */ }
-						<label className="verbum__label">
+						<label htmlFor="verbum-email-form-name" className="verbum__label">
 							<Name />
 							<input
+								id="verbum-email-form-name"
 								className={ clsx( 'verbum-form__name', {
 									'invalid-form-data': isValidAuthor.value === false && isNameTouched.value,
 								} ) }
@@ -130,10 +130,10 @@ export const EmailForm = ( { shouldShowEmailForm }: EmailFormProps ) => {
 							/>
 						</label>
 
-						{ /* eslint-disable-next-line jsx-a11y/label-has-associated-control -- https://github.com/jsx-eslint/eslint-plugin-jsx-a11y/issues/869 */ }
-						<label className="verbum__label">
+						<label htmlFor="verbum-email-form-website" className="verbum__label">
 							<Website />
 							<input
+								id="verbum-email-form-website"
 								className="verbum-form__website"
 								type="text"
 								spellCheck={ false }

vendor/automattic/jetpack-mu-wpcom/src/features/wpcom-block-editor-nux/src/recommended-tags-modal/form-label.tsx

@@ -16,13 +16,13 @@ const FormLabel: FunctionComponent< Props & LabelProps > = ( {
 	required,
 	optional,
 	className, // Via LabelProps
+	htmlFor,
 	...labelProps
 } ) => {
 	const hasChildren: boolean = Children.count( children ) > 0;
 
 	return (
-		// eslint-disable-next-line jsx-a11y/label-has-associated-control
-		<label { ...labelProps } className={ clsx( className, 'form-label' ) }>
+		<label htmlFor={ htmlFor } { ...labelProps } className={ clsx( className, 'form-label' ) }>
 			{ children }
 			{ hasChildren && required && (
 				<small className="form-label__required">{ __( 'Required', 'jetpack-mu-wpcom' ) }</small>