[Docs] Use htmlIdGenerator()() in EuiFlyout examples for aria-labelledby

[cchaos]

It's a bit of a chore, but might it be worth it:

I've found that folks will sometimes copy our static ids from docs into their apps and then will run into multiple duplicate id issues.

This one is unlikely to cause that issue... But thought I'd bring it up anyways just for consistently having the same example of always using unique ids.

Originally posted by @myasonik in #4713 (comment)

[cchaos]

Example:

eui/src-docs/src/views/flyout/flyout.js

Lines 30 to 39 in 658e5d2

	if (isFlyoutVisible) {
	flyout = (
	<EuiFlyout
	ownFocus
	onClose={() => setIsFlyoutVisible(false)}
	aria-labelledby="flyoutTitle">
	<EuiFlyoutHeader hasBorder>
	<EuiTitle size="m">
	<h2 id="flyoutTitle">A typical flyout</h2>
	</EuiTitle>

Would change to:

  const titleId = htmlIdGenerator('flyoutTitle')();

  if (isFlyoutVisible) {
    flyout = (
      <EuiFlyout
        ownFocus
        onClose={() => setIsFlyoutVisible(false)}
        aria-labelledby={titleId}>
        <EuiFlyoutHeader hasBorder>
          <EuiTitle size="m">
            <h2 id={titleId}>A typical flyout</h2>
          </EuiTitle>

[hetanthakkar]

@cchaos Apart from this particular example, any other example you would like to change!? If I am not wrong this is a minor change

[myasonik]

Anywhere in our docs that we set an id to a static string we probably want it to be a random string... Don't have a list of those cases though, you'd have to dig through the docs to see.

[hetanthakkar]

@myasonik Thanks I am working on this