mirror of
https://github.com/getredash/redash.git
synced 2026-03-22 19:00:09 -04:00
Add Collapse component (#3867)
This commit is contained in:
@@ -33,6 +33,7 @@
|
||||
@import "~antd/lib/spin/style/index";
|
||||
@import "~antd/lib/tabs/style/index";
|
||||
@import "~antd/lib/notification/style/index";
|
||||
@import "~antd/lib/collapse/style/index";
|
||||
@import "~antd/lib/progress/style/index";
|
||||
@import 'inc/ant-variables';
|
||||
|
||||
@@ -322,3 +323,25 @@
|
||||
.@{btn-prefix-cls} .@{iconfont-css-prefix}-ellipsis {
|
||||
margin: 0 -7px;
|
||||
}
|
||||
|
||||
// Collapse
|
||||
|
||||
.@{collapse-prefix-cls} {
|
||||
&&-headerless {
|
||||
border: 0;
|
||||
background: none;
|
||||
|
||||
.@{collapse-prefix-cls}-header {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.@{collapse-prefix-cls}-item,
|
||||
.@{collapse-prefix-cls}-content {
|
||||
border: 0;
|
||||
}
|
||||
|
||||
.@{collapse-prefix-cls}-content-box {
|
||||
padding: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
24
client/app/components/Collapse.jsx
Normal file
24
client/app/components/Collapse.jsx
Normal file
@@ -0,0 +1,24 @@
|
||||
import React from 'react';
|
||||
import PropTypes from 'prop-types';
|
||||
import cx from 'classnames';
|
||||
import AntCollapse from 'antd/lib/collapse';
|
||||
|
||||
export default function Collapse({ collapsed, children, className, ...props }) {
|
||||
return (
|
||||
<AntCollapse {...props} activeKey={collapsed ? null : 'content'} className={cx(className, 'ant-collapse-headerless')}>
|
||||
<AntCollapse.Panel key="content" header="">{children}</AntCollapse.Panel>
|
||||
</AntCollapse>
|
||||
);
|
||||
}
|
||||
|
||||
Collapse.propTypes = {
|
||||
collapsed: PropTypes.bool,
|
||||
children: PropTypes.node,
|
||||
className: PropTypes.string,
|
||||
};
|
||||
|
||||
Collapse.defaultProps = {
|
||||
collapsed: true,
|
||||
children: null,
|
||||
className: '',
|
||||
};
|
||||
Reference in New Issue
Block a user