Fixed overlap issue with adjacent Dropdown components (#1141)

closes #885

- when two Dropdown components are used in close proximity the z-index of 0 on the containers meant the popup (which has z-index of -1) would sit behind any Dropdown components that the popup should be covering
- fixed the issue by increasing the z-index of the Dropdown container when the popup is open

packages/koenig-lexical/src/components/ui/Dropdown.jsx

@@ -60,9 +60,10 @@ export function Dropdown({value, menu, onChange, dataTestId}) {
 
     const selectedItem = menu.find(menuItem => menuItem.name === value);
     const trigger = selectedItem?.label ?? '';
+    const zIndex = open ? 'z-10' : 'z-0';
 
     return (
-        <div className="relative z-0 font-sans text-sm font-normal" data-testid={dataTestId}>
+        <div className={`relative ${zIndex} font-sans text-sm font-normal`} data-testid={dataTestId}>
             <button
                 className={`relative w-full cursor-pointer border border-grey-300 px-3 py-2 text-left font-sans font-normal text-grey-900 focus-visible:outline-none dark:border-grey-900 dark:bg-grey-900 dark:text-white dark:placeholder:text-grey-800 ${open ? 'rounded-t' : 'rounded'}`}
                 data-testid={`${dataTestId}-value`}