Press n or j to go to the next uncovered block, b, p or k for the previous block.
| 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 | 1x 1x 1x 3x 3x 3x 3x 3x 3x 3x 3x 3x 3x 3x 3x 3x 3x 3x 3x 2x 2x 2x 1x 3x 3x 3x | // Libs
import { ReactNode } from 'react';
// Constants
import { CONTENT_MESSAGE } from '@/constants';
// Components
import {
DropdownMenu,
DropdownMenuContent,
DropdownMenuTrigger,
} from './DropdownMenu';
interface DropdownProps {
selectedItem: ReactNode;
items?: ReactNode | ReactNode[];
disable?: boolean;
isOpen?: boolean;
rootProps?: React.ComponentProps<typeof DropdownMenu>;
triggerProps?: React.ComponentProps<typeof DropdownMenuTrigger>;
contentProps?: React.ComponentProps<typeof DropdownMenuContent>;
}
export const Dropdown = ({
selectedItem,
items,
disable,
isOpen,
rootProps,
triggerProps,
contentProps,
}: DropdownProps) => {
const isEmpty = !items || (Array.isArray(items) && items.length === 0);
return (
<DropdownMenu open={isOpen} {...rootProps}>
<DropdownMenuTrigger {...triggerProps} disabled={disable} asChild>
{selectedItem}
</DropdownMenuTrigger>
<DropdownMenuContent {...contentProps}>
{isEmpty ? (
<div className="px-2 py-1.5 text-sm font-semibold">
{CONTENT_MESSAGE.NO_DATA_FOUND}
</div>
) : (
items
)}
</DropdownMenuContent>
</DropdownMenu>
);
};
|