UNPKG

@olleemilsson/flowbite-react

Version:

<div align="center"> <h1>:construction: flowbite-react (unreleased) :construction:</h1> <p> <a href="https://flowbite-react.com"> <img alt="Flowbite - Tailwind CSS components" width="350" src=".github/assets/flowbite-react-github.png"> <

11 lines (10 loc) 1.02 kB
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime"; import classNames from 'classnames'; import { useTheme } from '../Flowbite/ThemeContext'; import { useAccordionContext } from './AccordionPanelContext'; export const AccordionTitle = ({ as: Heading = 'h2', children, className, ...props }) => { const { arrowIcon: ArrowIcon, flush, isOpen, setOpen } = useAccordionContext(); const theme = useTheme().theme.accordion.title; const onClick = () => typeof setOpen !== 'undefined' && setOpen(); return (_jsxs("button", { className: classNames(theme.base, theme.flush[flush ? 'on' : 'off'], theme.open[isOpen ? 'on' : 'off'], className), onClick: onClick, type: "button", ...props, children: [_jsx(Heading, { className: theme.heading, "data-testid": "flowbite-accordion-heading", children: children }), ArrowIcon && (_jsx(ArrowIcon, { "aria-hidden": true, className: classNames(theme.arrow.base, theme.arrow.open[isOpen ? 'on' : 'off']), "data-testid": "flowbite-accordion-arrow" }))] })); };