@carbon/react
Version:
React components for the Carbon Design System
106 lines (105 loc) • 3.87 kB
TypeScript
import PropTypes from 'prop-types';
import { AnimationEventHandler, AriaAttributes, KeyboardEvent, MouseEventHandler, PropsWithChildren, ReactElement, ReactNode } from 'react';
export interface AccordionItemProps {
/**
* Specify an optional className to be
* applied to the container node.
*/
className?: string;
/**
* Specify whether an individual `AccordionItem` should
* be disabled (overrides the parent accordion state). If undefined,
* this value will be managed by the parent Accordion.
*/
disabled?: boolean;
/**
* The handler of the massaged `click` event.
*/
onClick?: MouseEventHandler<HTMLLIElement>;
/**
* The handler of the massaged `click` event on
* the heading.
*/
onHeadingClick?: ({ isOpen, event, }: {
isOpen: boolean;
event: Parameters<MouseEventHandler<HTMLButtonElement>>[0];
}) => void;
/**
* `true` to open the expand.
*/
open?: boolean;
/**
* @deprecated This prop has been deprecated and will be
* removed in the next major release of Carbon. Use the
* `renderToggle` prop instead.
*/
renderExpando?: (props: PropsWithChildren<AccordionToggleProps>) => ReactElement<any>;
/**
* The callback function to render the expand button.
* Can be a React component class.
*/
renderToggle?: (props: PropsWithChildren<AccordionToggleProps>) => ReactElement<any>;
/**
* The accordion title.
*/
title?: ReactNode;
/**
* The callback function to run on the `onAnimationEnd`
* event for the list item.
*/
handleAnimationEnd?: AnimationEventHandler<HTMLElement>;
}
export interface AccordionToggleProps {
'aria-controls'?: AriaAttributes['aria-controls'];
'aria-expanded'?: AriaAttributes['aria-expanded'];
className?: string;
disabled?: boolean;
onClick?: MouseEventHandler<HTMLButtonElement>;
onKeyDown?: (event: KeyboardEvent<HTMLButtonElement>) => void;
type?: 'button';
}
declare function AccordionItem({ children, className: customClassName, open, onHeadingClick, renderExpando, // remove renderExpando in next major release
renderToggle, title, disabled: controlledDisabled, handleAnimationEnd, ...rest }: PropsWithChildren<AccordionItemProps>): import("react/jsx-runtime").JSX.Element;
declare namespace AccordionItem {
var propTypes: {
/**
* Provide the contents of your AccordionItem
*/
children: PropTypes.Requireable<PropTypes.ReactNodeLike>;
/**
* Specify an optional className to be applied to the container node
*/
className: PropTypes.Requireable<string>;
/**
* Specify whether an individual AccordionItem should be disabled
*/
disabled: PropTypes.Requireable<boolean>;
/**
* The handler of the massaged `click` event.
*/
onClick: PropTypes.Requireable<(...args: any[]) => any>;
/**
* The handler of the massaged `click` event on the heading.
*/
onHeadingClick: PropTypes.Requireable<(...args: any[]) => any>;
/**
* `true` to open the expand.
*/
open: PropTypes.Requireable<boolean>;
/**
* The callback function to render the expand button.
* Can be a React component class.
*/
renderExpando: (props: Record<string, any>, propName: string, componentName: string, ...rest: any[]) => any;
/**
* The callback function to render the expand button.
* Can be a React component class.
*/
renderToggle: PropTypes.Requireable<(...args: any[]) => any>;
/**
* The accordion title.
*/
title: PropTypes.Requireable<PropTypes.ReactNodeLike>;
};
}
export default AccordionItem;