1
0
mirror of https://github.com/lensapp/lens.git synced 2025-05-20 05:10:56 +00:00

Introduce Dropdown component with Menu

Signed-off-by: Alex Andreev <alex.andreev.email@gmail.com>
This commit is contained in:
Alex Andreev 2022-08-15 14:42:42 +03:00
parent 33564dd592
commit c4c2eaf6d3

View File

@ -0,0 +1,37 @@
/**
* Copyright (c) OpenLens Authors. All rights reserved.
* Licensed under MIT License. See LICENSE in root directory for more information.
*/
import React, { HTMLAttributes, useState } from "react";
import { Menu } from "../menu";
interface DropdownProps extends HTMLAttributes<HTMLDivElement> {
contentForToggle: React.ReactNode;
}
export function Dropdown(props: DropdownProps) {
const { id, contentForToggle, children, ...rest } = props;
const [opened, setOpened] = useState(false);
const toggle = () => {
setOpened(!opened);
};
return (
<div {...rest}>
<div id={id}>
{contentForToggle}
</div>
<Menu
usePortal
htmlFor={id}
isOpen={opened}
close={toggle}
open={toggle}
>
{React.Children.toArray(children)}
</Menu>
</div>
);
}