import {Disclosure} from '../src/Disclosure';
import {
  Button,
  UNSTABLE_DisclosurePanel as DisclosurePanel
} from 'react-aria-components';

import type {Meta} from '@storybook/react';

const meta: Meta<typeof Disclosure> = {
  component: Disclosure,
  parameters: {
    layout: 'centered'
  },
  tags: ['autodocs']
};

export default meta;

export const Example = (args: any) => (
  <Disclosure {...args}>
    <h3>
      <Button slot="trigger">
        <svg viewBox="0 0 24 24">
          <path d="m8.25 4.5 7.5 7.5-7.5 7.5" />
        </svg>
        System Requirements
      </Button>
    </h3>
    <DisclosurePanel>
      <p>Details about system requirements here.</p>
    </DisclosurePanel>
  </Disclosure>
);
