All files / components ExpandableHeadline.js

0% Statements 0/6
0% Branches 0/2
0% Functions 0/2
0% Lines 0/6

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                                                     
import { Disclosure } from '@headlessui/react'
import { AiOutlinePlus, AiOutlineMinus } from 'react-icons/ai'
import { IconContext } from 'react-icons'
 
export default function GroupedBeltResults({
  qaObject: { question, answer, id },
}) {
  return (
    <Disclosure>
      {({ open }) => (
        <div id={id} className={'target:animate-pulse-short rounded-lg px-2'}>
          <Disclosure.Button className="flex w-full justify-between text-left items-center pt-5 pb-3">
            <h1 className="text-2xl py-1">{question}</h1>
            <IconContext.Provider
              value={{ className: 'fill-periwinkle flex-none ml-2', size: 20 }}
            >
              {open ? <AiOutlineMinus /> : <AiOutlinePlus />}
            </IconContext.Provider>
          </Disclosure.Button>
          <hr />
          <Disclosure.Panel className="py-2">{answer}</Disclosure.Panel>
        </div>
      )}
    </Disclosure>
  )
}