/
index.tsx
44 lines (39 loc) · 1017 Bytes
/
index.tsx
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
/**
* External dependencies
*/
// eslint-disable-next-line no-restricted-imports
import * as Ariakit from '@ariakit/react';
/**
* WordPress dependencies
*/
import { forwardRef } from '@wordpress/element';
/**
* Internal dependencies
*/
import type { DisclosureContentProps } from './types';
import type { WordPressComponentProps } from '../context';
/**
* Accessible Disclosure component that controls visibility of a section of
* content. It follows the WAI-ARIA Disclosure Pattern.
*/
const UnforwardedDisclosureContent = (
{
visible,
children,
...props
}: WordPressComponentProps< DisclosureContentProps, 'div', false >,
ref: React.ForwardedRef< any >
) => {
const disclosure = Ariakit.useDisclosureStore( { open: visible } );
return (
<Ariakit.DisclosureContent
store={ disclosure }
ref={ ref }
{ ...props }
>
{ children }
</Ariakit.DisclosureContent>
);
};
export const DisclosureContent = forwardRef( UnforwardedDisclosureContent );
export default DisclosureContent;