import classNames from 'clsx'; import React from 'react'; import { defineMessages, useIntl } from 'react-intl'; import { Text } from 'soapbox/components/ui'; import DropdownMenu from 'soapbox/containers/dropdown_menu_container'; import type { Menu } from 'soapbox/components/dropdown_menu'; const messages = defineMessages({ collapse: { id: 'accordion.collapse', defaultMessage: 'Collapse' }, expand: { id: 'accordion.expand', defaultMessage: 'Expand' }, }); interface IAccordion { headline: React.ReactNode, children?: React.ReactNode, menu?: Menu, expanded?: boolean, onToggle?: (value: boolean) => void, } const Accordion: React.FC = ({ headline, children, menu, expanded = false, onToggle = () => {} }) => { const intl = useIntl(); const handleToggle = (e: React.MouseEvent) => { onToggle(!expanded); e.preventDefault(); }; return (
{menu && (
)}
{children}
); }; export default Accordion;