kopia lustrzana https://github.com/Stopka/fedisearch
33 wiersze
1017 B
TypeScript
33 wiersze
1017 B
TypeScript
'use client'
|
|
import React, { ReactElement, ReactNode, useContext, useState } from 'react'
|
|
|
|
const AccordionContext = React.createContext<{
|
|
expandedId: string | undefined
|
|
setExpandedId: (id: string | undefined) => void
|
|
} | undefined>(undefined)
|
|
|
|
export const useAccordion = (id: string): [boolean, () => void] => {
|
|
const context = useContext(AccordionContext)
|
|
if (context === undefined) {
|
|
throw new Error('Hook useAccordion needs to be used in Accordion element')
|
|
}
|
|
const { expandedId, setExpandedId } = context
|
|
return [
|
|
expandedId === id,
|
|
() => {
|
|
setExpandedId(expandedId === id ? undefined : id)
|
|
}
|
|
]
|
|
}
|
|
|
|
export default function Accordion ({ children }: {
|
|
children: ReactNode
|
|
}): ReactElement {
|
|
const [expandedId, setExpandedId] = useState<string | undefined>(undefined)
|
|
return <AccordionContext.Provider value={{ expandedId, setExpandedId }}>
|
|
<div className="accordion" id="accordionExample">
|
|
{children}
|
|
</div>
|
|
</AccordionContext.Provider>
|
|
}
|