ant-design/components/collapse/CollapsePanel.tsx
杨腿_ 0054ff9dfd
feat: add icon to collapsible (#37566)
* feat: add icon to collapsible in collapse

* fix: typo

* Apply suggestions from code review

* test: update snapshot of collapsible.md

* feat: edit api support version

* feat: edit api support version

* fix: reinstall modules and update snapshots

Co-authored-by: yangchen7 <yangchen7@360.cn>
Co-authored-by: afc163 <afc163@gmail.com>
2022-09-20 19:32:18 +08:00

45 lines
1.3 KiB
TypeScript

import classNames from 'classnames';
import RcCollapse from 'rc-collapse';
import * as React from 'react';
import { ConfigContext } from '../config-provider';
import warning from '../_util/warning';
export type CollapsibleType = 'header' | 'icon' | 'disabled';
export interface CollapsePanelProps {
key: string | number;
header: React.ReactNode;
/** @deprecated Use `collapsible="disabled"` instead */
disabled?: boolean;
className?: string;
style?: React.CSSProperties;
showArrow?: boolean;
prefixCls?: string;
forceRender?: boolean;
id?: string;
extra?: React.ReactNode;
collapsible?: CollapsibleType;
children?: React.ReactNode;
}
const CollapsePanel: React.FC<CollapsePanelProps> = props => {
warning(
!('disabled' in props),
'Collapse.Panel',
'`disabled` is deprecated. Please use `collapsible="disabled"` instead.',
);
const { getPrefixCls } = React.useContext(ConfigContext);
const { prefixCls: customizePrefixCls, className = '', showArrow = true } = props;
const prefixCls = getPrefixCls('collapse', customizePrefixCls);
const collapsePanelClassName = classNames(
{
[`${prefixCls}-no-arrow`]: !showArrow,
},
className,
);
return <RcCollapse.Panel {...props} prefixCls={prefixCls} className={collapsePanelClassName} />;
};
export default CollapsePanel;