Can the `ChangeHistory` component adjust the label rendering logic or the passed value?

[btea]

Enter your suggestions in details:

If the label is passed a string, then both aria-label and the content rendered by the div will be plain strings. The special Markdown formatting within the div will not be rendered correctly. If the label is passed a JSX object, the div will render correctly, but the aria-label attribute will display [object Object].

nodejs.org/packages/ui-components/src/Common/ChangeHistory/index.tsx

Lines 9 to 19 in 147063e

	export type HistoryChange = {
	versions: Array<string>;
	label: string;
	url?: string;
	};
	type ChangeHistoryProps = ComponentProps<'div'> & {
	label: string;
	changes: Array<HistoryChange>;
	as?: LinkLike;
	};

nodejs.org/packages/ui-components/src/Common/ChangeHistory/index.tsx

Lines 46 to 58 in 147063e

	<MenuItem
	key={change.label}
	className={styles.dropdownItem}
	role="menuitem"
	tabIndex={0}
	aria-label={`${change.label}: ${change.versions.join(', ')}`}
	href={change.url}
	>
	<div className={styles.dropdownLabel}>{change.label}</div>
	<div className={styles.dropdownVersions}>
	{change.versions.join(', ')}
	</div>
	</MenuItem>

The doc-kit previously fixed the aria-label rendering issue using nodejs/doc-kit#1034. However, it wasn't completely resolved; currently, Markdown formatting is not rendered correctly within divs.

[btea]

It seems that #9115 has solved the problem. cc @avivkeller

[AugustinMauroy]

it's accept react value now but need to transform first nodejs/doc-kit#1049

[btea]

I noticed that too. Good job. 👍

[avivkeller]

Yep! Great minds think alike :-) this is on my list of things to do. After changing the component to accept a node I'll fix the remaining parts in doc kit