mirror of
https://github.com/ant-design/ant-design.git
synced 2024-12-05 17:59:57 +08:00
523b74e3b6
* feat: add successColor for Progress (#24655) * feat: add successColor for Progress * feat: update * fix: update test * remove snap * feat: add test case * refactor success * feat: adjust styyle * feat: add DevWarning * feat: Support rowSelection.dirty (#24718) * feat: Support rowSelection.dirty * rename to reserveKeys * preserveKeys will keep record also * to preserveSelectedRowKeys * feat: add ghost prop for collapse (#24734) * feat: add ghost prop for collapse * doc: version of collapse's ghost prop * refactor: make ghost collapse's less code to a nested style * chore: remove redundant codes in ghost collapse's less & doc * doc: add a background wrapper for ghost collapse demo * doc: dark-theme wrapper bg-color for ghost collapse demo * test: update snapshot of ghost collapse * doc: use softer bg-color on ghost collapse demo * doc: remove disabled panel in ghost collapse demo * feat: form instance support getFieldInstance (#24711) * support getFieldInstance * update doc * fix lint * move func * move into hooks * update ref logic * fix lint * rm only * fix docs * feat: dropdown support arrow (#23869) * feat: dropdown support arrow prop close #22758 * test: update snapshot * fix: fix dropdown cls names * test: update snapshot * test: update snapshot * doc: update demo * test: update demo snapshot * demo * fix: snapshot * chore: change the style of ghost collapse & demo modified (#24762) * refactor: reduce content padding in ghost collapse * doc: remove the wrapper outside ghost collapse Designer want the demo differs from other demos * refactor: remove redundant .less code in collapse * feat: cascader dropdown-render prop (#24812) * feat: cascader dropdown-render prop * fix: update Cascader dropdownRender type annotation * fix: set rc-cascader semver from ^ to ~ * docs: fix coding style in cascader/custom-dropdown * feat: 🆕 support Drawer closeIcon (#24842) * feat: 🆕 support Drawer closeIcon close #19283 close #19153 * add test case * update docs * feat: 🆕 Cascader expandIcon (#24865) * feat: cascader expandIcon * fix: snap * refactor: reduce CSS size (#24846) * refactor: reduce button css size * refactor: remove redundant button .less code * feat: add Table onChange an action param (#24697) * Working on tests * created TableAction type * changed TableActions to tuple * removed chinese documentation line * refactor TableActions * fix documentation * Moved action into extra param * minor doc change * feat: add closeIcon customize tag close (#24885) * feat: add closeIcon customize tag close * docs fix * update snap * fix: css name * update snapshot * snapshot * feat: add radio `optionType` api to set radio option type (#24809) * feat: radio component * docs: update md * fix: snap * test components * fix: use optionType * fix name * add warning * fix * feat: expand rate character (#24903) * feat: expand rate character * fix: demo * fix: snap * Update components/rate/index.zh-CN.md Co-authored-by: 偏右 <afc163@gmail.com> * fix Co-authored-by: 偏右 <afc163@gmail.com> * Refactor demo code box actions (#24887) * refactor: refine the styling of actions part of demo code-box * fix: lint style * refactor: move Result children to end (#24945) * feat: remove content max-width on dot-step (#24907) * feat: add Skeleton-Image (#24805) * feat: add Skeleton-Image * feat: add docs * fix: adjust skeleton * feat: adjust Image Component * feat: rebase * feat: adjust style * fix: lint * feat: remove size * feat: delete md * feat: fix style * ✨ feat: Mentions support autoSize (#24961) close #17746 * chore: replace textarea with rc-textarea (#24966) * feat: update pagination@2.3.0 support onChange called when pageSize change (#24964) * feat: update pagination@2.5.0 and add test case to relative component * fix: lint * delete * feat: add test case for pagination * adjust test case * feat: Implement centered prop in Tabs (#24958) * Implement centered in Tabs along with its tests and docs * Fix build error * Add Chinese translations and remove test case Co-authored-by: Ashkan Pourghasem <ashkan.pourghasem@gmail.com> * feat: Add modal style parameter (#24773) * add some paramters in default.less * Update components/style/themes/default.less Co-authored-by: Amumu <yoyo837@hotmail.com> * change parameter in compact.less Co-authored-by: Crystal Gao <jinggao@ebay.com> Co-authored-by: Amumu <yoyo837@hotmail.com> * feat: export Tabs addIcon (#25006) * feat: export Tabs addIcon * update snapshot * feat: showNow on timepicker and datetimepicker (#25032) * feat: update rc-picker@1.7.1 and fix icons of month and quarter picker in DatePicker Component (#25035) * feat: update rc-picker@1.7.1 * delete * add * feat: expand rate support props (#24993) * docs: 📝 Add Form.Item hidden in doc (#25108) close #25101 * fix: ⌨️ Improve Pagination accessibility issue (#25119) * ⌨️ Improve Pagination a11y by fixing a W3C error https://github.com/react-component/pagination/issues/280 * update snapshot * 🆙 rc-pagination to 2.4.1 * feat: support triggerSubMenuAction for <Menu /> (#25127) * feat(menu): add triggerSubMenuAction for Menu * feat(menu): test cases * chore: Adjust picker logic (#25135) * chore: update rc-picker 1.10.0 (#25174) * feat: table row check strictly (#24931) * feat: add checkStrictly on Table.rowSelection * fix: LGTM warnings * test: table rowSelection.checkStrictly * test: add cov [wip] * refactor: tree.rowSelection.checkStrictly [wip] * test: table.rowSelection.checkStrictly basic case * feat: support rowKey on checkStrictly table * feat: Table checkStrictly support getCheckboxProps * docs: Table checkStrictly * chore: typo * chore: remove useless comment * chore: update snapshot * chore: update snapshot * fix: fire selectAll on selection dropdown menu & changeRows incorrect in selectAll callback * docs: typo * chore * chore * fix: expand buttons of leaf rows in tree data are not hidden * feat: Table warning about rowKey index parameter * perf: only generate keyEntities when not checkStrictly * refactor: remove useless parseCheckedKeys * refactor: get derived selected & half selected keys from selectedRowKeys * chore: remove env condition stmt * chore: revert index usage & code formatting * chore: rerun ci * docs: table tree-data checkstrictly * test: update snapshots * refactor: use useMergedState hook * chore: rerun ci * chore: rerun ci 2 * chore: revert selection select all behavior * refactor: refactor code based on feature * chore: revert table code format * chore: revert table code format * fix: useMemo deps * fix: useMemo deps * fix: useMemo deps * feat: support preserve (#25186) * docs: add responsibly order for Col (#25139) * feat: add type * feat: add responsibly order cols * feat: add docs * feat: add test case * fix test Co-authored-by: 二货机器人 <smith3816@gmail.com> Co-authored-by: 偏右 <afc163@gmail.com> Co-authored-by: zoomdong <1344492820@qq.com> Co-authored-by: 07akioni <07akioni2@gmail.com> Co-authored-by: wendellhu <wendellhu95@gmail.com> Co-authored-by: xrkffgg <xrkffgg@gmail.com> Co-authored-by: Neto Braghetto <netow93@gmail.com> Co-authored-by: Kermit Xuan <kermitlx@outlook.com> Co-authored-by: Ashkan Pourghasem <64011067+ashkan-pm@users.noreply.github.com> Co-authored-by: Ashkan Pourghasem <ashkan.pourghasem@gmail.com> Co-authored-by: hicrystal <295247343@qq.com> Co-authored-by: Crystal Gao <jinggao@ebay.com> Co-authored-by: Amumu <yoyo837@hotmail.com> Co-authored-by: Li Ming <armyiljfe@gmail.com>
230 lines
7.0 KiB
JavaScript
230 lines
7.0 KiB
JavaScript
import React from 'react';
|
|
import { Helmet } from 'react-helmet-async';
|
|
import { FormattedMessage, injectIntl } from 'react-intl';
|
|
import classNames from 'classnames';
|
|
import { Row, Col, Affix, Tooltip } from 'antd';
|
|
import { getChildren } from 'jsonml.js/lib/utils';
|
|
import { CodeFilled, CodeOutlined, BugFilled, BugOutlined } from '@ant-design/icons';
|
|
import Demo from './Demo';
|
|
import EditButton from './EditButton';
|
|
import { ping, getMetaDescription } from '../utils';
|
|
|
|
const ComponentInMarkdown = React.memo(({ content, utils }) =>
|
|
utils.toReactComponent(['section', { className: 'markdown' }].concat(getChildren(content))),
|
|
);
|
|
|
|
class ComponentDoc extends React.Component {
|
|
state = {
|
|
expandAll: false,
|
|
visibleAll: process.env.NODE_ENV !== 'production',
|
|
showRiddleButton: false,
|
|
};
|
|
|
|
componentDidMount() {
|
|
const { demos = {}, location = {} } = this.props;
|
|
if (location.hash) {
|
|
const demoKey = location.hash.split('-demo-')[1];
|
|
const demoData = demos[demoKey];
|
|
if (demoData && demoData.meta && demoData.meta.debug) {
|
|
this.setState({ visibleAll: true });
|
|
}
|
|
}
|
|
this.pingTimer = ping(status => {
|
|
if (status !== 'timeout' && status !== 'error') {
|
|
this.setState({
|
|
showRiddleButton: true,
|
|
});
|
|
}
|
|
});
|
|
}
|
|
|
|
shouldComponentUpdate(nextProps, nextState) {
|
|
const { location, theme } = this.props;
|
|
const { location: nextLocation, theme: nextTheme } = nextProps;
|
|
const { expandAll, visibleAll, showRiddleButton } = this.state;
|
|
const {
|
|
expandAll: nextExpandAll,
|
|
visibleAll: nextVisibleAll,
|
|
showRiddleButton: nextShowRiddleButton,
|
|
} = nextState;
|
|
|
|
if (
|
|
nextLocation.pathname === location.pathname &&
|
|
expandAll === nextExpandAll &&
|
|
showRiddleButton === nextShowRiddleButton &&
|
|
theme === nextTheme &&
|
|
visibleAll === nextVisibleAll &&
|
|
showRiddleButton === nextShowRiddleButton
|
|
) {
|
|
return false;
|
|
}
|
|
return true;
|
|
}
|
|
|
|
componentWillUnmount() {
|
|
clearTimeout(this.pingTimer);
|
|
}
|
|
|
|
handleExpandToggle = () => {
|
|
const { expandAll } = this.state;
|
|
this.setState({
|
|
expandAll: !expandAll,
|
|
});
|
|
};
|
|
|
|
handleVisibleToggle = () => {
|
|
const { visibleAll } = this.state;
|
|
this.setState({
|
|
visibleAll: !visibleAll,
|
|
});
|
|
};
|
|
|
|
render() {
|
|
const {
|
|
doc,
|
|
location,
|
|
intl: { locale },
|
|
utils,
|
|
theme,
|
|
setIframeTheme,
|
|
demos,
|
|
} = this.props;
|
|
const { content, meta } = doc;
|
|
const demoValues = Object.keys(demos).map(key => demos[key]);
|
|
const { expandAll, visibleAll, showRiddleButton } = this.state;
|
|
const isSingleCol = meta.cols === 1;
|
|
const leftChildren = [];
|
|
const rightChildren = [];
|
|
let showedDemo = demoValues.some(demo => demo.meta.only)
|
|
? demoValues.filter(demo => demo.meta.only)
|
|
: demoValues.filter(demo => demo.preview);
|
|
if (!visibleAll) {
|
|
showedDemo = showedDemo.filter(item => !item.meta.debug);
|
|
}
|
|
showedDemo
|
|
.sort((a, b) => a.meta.order - b.meta.order)
|
|
.forEach((demoData, index) => {
|
|
const demoElem = (
|
|
<Demo
|
|
{...demoData}
|
|
showRiddleButton={showRiddleButton}
|
|
key={demoData.meta.filename}
|
|
utils={utils}
|
|
expand={expandAll}
|
|
location={location}
|
|
theme={theme}
|
|
setIframeTheme={setIframeTheme}
|
|
/>
|
|
);
|
|
if (index % 2 === 0 || isSingleCol) {
|
|
leftChildren.push(demoElem);
|
|
} else {
|
|
rightChildren.push(demoElem);
|
|
}
|
|
});
|
|
const expandTriggerClass = classNames({
|
|
'code-box-expand-trigger': true,
|
|
'code-box-expand-trigger-active': expandAll,
|
|
});
|
|
|
|
const jumper = showedDemo.map(demo => {
|
|
const { title } = demo.meta;
|
|
const localizeTitle = title[locale] || title;
|
|
return (
|
|
<li key={demo.meta.id} title={localizeTitle}>
|
|
<a href={`#${demo.meta.id}`}>{localizeTitle}</a>
|
|
</li>
|
|
);
|
|
});
|
|
|
|
const { title, subtitle, filename } = meta;
|
|
const helmetTitle = `${subtitle || ''} ${title[locale] || title} - Ant Design`;
|
|
const contentChild = getMetaDescription(getChildren(content));
|
|
|
|
return (
|
|
<article>
|
|
<Helmet encodeSpecialCharacters={false}>
|
|
{helmetTitle && <title>{helmetTitle}</title>}
|
|
{helmetTitle && <meta property="og:title" content={helmetTitle} />}
|
|
{contentChild && <meta name="description" content={contentChild} />}
|
|
</Helmet>
|
|
<Affix className="toc-affix" offsetTop={16}>
|
|
<ul id="demo-toc" className="toc">
|
|
{jumper}
|
|
{doc.api && (
|
|
<li key="API" title="API">
|
|
<a href="#API">API</a>
|
|
</li>
|
|
)}
|
|
</ul>
|
|
</Affix>
|
|
<section className="markdown">
|
|
<h1>
|
|
{title[locale] || title}
|
|
{!subtitle ? null : <span className="subtitle">{subtitle}</span>}
|
|
<EditButton
|
|
title={<FormattedMessage id="app.content.edit-page" />}
|
|
filename={filename}
|
|
/>
|
|
</h1>
|
|
<ComponentInMarkdown utils={utils} content={content} />
|
|
<h2>
|
|
<FormattedMessage id="app.component.examples" />
|
|
<span className="all-code-box-controls">
|
|
<Tooltip
|
|
title={
|
|
<FormattedMessage
|
|
id={`app.component.examples.${expandAll ? 'collapse' : 'expand'}`}
|
|
/>
|
|
}
|
|
>
|
|
{expandAll ? (
|
|
<CodeFilled className={expandTriggerClass} onClick={this.handleExpandToggle} />
|
|
) : (
|
|
<CodeOutlined className={expandTriggerClass} onClick={this.handleExpandToggle} />
|
|
)}
|
|
</Tooltip>
|
|
<Tooltip
|
|
title={
|
|
<FormattedMessage
|
|
id={`app.component.examples.${visibleAll ? 'hide' : 'visible'}`}
|
|
/>
|
|
}
|
|
>
|
|
{visibleAll ? (
|
|
<BugFilled className={expandTriggerClass} onClick={this.handleVisibleToggle} />
|
|
) : (
|
|
<BugOutlined className={expandTriggerClass} onClick={this.handleVisibleToggle} />
|
|
)}
|
|
</Tooltip>
|
|
</span>
|
|
</h2>
|
|
</section>
|
|
<Row gutter={16}>
|
|
<Col
|
|
span={isSingleCol ? 24 : 12}
|
|
className={isSingleCol ? 'code-boxes-col-1-1' : 'code-boxes-col-2-1'}
|
|
>
|
|
{leftChildren}
|
|
</Col>
|
|
{isSingleCol ? null : (
|
|
<Col className="code-boxes-col-2-1" span={12}>
|
|
{rightChildren}
|
|
</Col>
|
|
)}
|
|
</Row>
|
|
{utils.toReactComponent(
|
|
[
|
|
'section',
|
|
{
|
|
className: 'markdown api-container',
|
|
},
|
|
].concat(getChildren(doc.api || ['placeholder'])),
|
|
)}
|
|
</article>
|
|
);
|
|
}
|
|
}
|
|
|
|
export default injectIntl(ComponentDoc);
|