diff --git a/components/__tests__/__snapshots__/index.test.js.snap b/components/__tests__/__snapshots__/index.test.js.snap index 6bfaa07821..211cf437e4 100644 --- a/components/__tests__/__snapshots__/index.test.js.snap +++ b/components/__tests__/__snapshots__/index.test.js.snap @@ -35,6 +35,7 @@ Array [ "message", "Menu", "Modal", + "Statistic", "notification", "Pagination", "Popconfirm", diff --git a/components/_util/wave.tsx b/components/_util/wave.tsx index bdc2c5e4e9..df8a066986 100644 --- a/components/_util/wave.tsx +++ b/components/_util/wave.tsx @@ -2,6 +2,7 @@ import * as React from 'react'; import { findDOMNode } from 'react-dom'; import TransitionEvents from 'css-animation/lib/Event'; import raf from '../_util/raf'; +import { ConfigConsumer, ConfigConsumerProps, CSPConfig } from '../config-provider'; let styleForPesudo: HTMLStyleElement | null; @@ -23,6 +24,7 @@ export default class Wave extends React.Component<{ insertExtraNode?: boolean }> private animationStartId: number; private animationStart: boolean = false; private destroy: boolean = false; + private csp?: CSPConfig; isNotGrey(color: string) { const match = (color || '').match(/rgba?\((\d*), (\d*), (\d*)(, [\.\d]*)?\)/); @@ -52,6 +54,11 @@ export default class Wave extends React.Component<{ insertExtraNode?: boolean }> !/rgba\(\d*, \d*, \d*, 0\)/.test(waveColor) && // any transparent rgba color waveColor !== 'transparent' ) { + // Add nonce if CSP exist + if (this.csp && this.csp.nonce) { + styleForPesudo.nonce = this.csp.nonce; + } + extraNode.style.borderColor = waveColor; styleForPesudo.innerHTML = `[ant-click-animating-without-extra-node="true"]:after { border-color: ${waveColor}; }`; if (!document.body.contains(styleForPesudo)) { @@ -168,7 +175,14 @@ export default class Wave extends React.Component<{ insertExtraNode?: boolean }> this.destroy = true; } + renderWave = ({ csp }: ConfigConsumerProps) => { + const { children } = this.props; + this.csp = csp; + + return children; + }; + render() { - return this.props.children; + return {this.renderWave}; } } diff --git a/components/alert/__tests__/__snapshots__/demo.test.js.snap b/components/alert/__tests__/__snapshots__/demo.test.js.snap index b6302739cd..7ea77e933c 100644 --- a/components/alert/__tests__/__snapshots__/demo.test.js.snap +++ b/components/alert/__tests__/__snapshots__/demo.test.js.snap @@ -7,6 +7,7 @@ exports[`renders ./components/alert/demo/banner.md correctly 1`] = ` data-show="true" > @@ -398,6 +399,7 @@ exports[`renders ./components/badge/demo/change.md correctly 1`] = ` type="button" > +
diff --git a/components/button/index.en-US.md b/components/button/index.en-US.md index 115ca2375e..efadc924aa 100644 --- a/components/button/index.en-US.md +++ b/components/button/index.en-US.md @@ -22,7 +22,7 @@ To get a customized button, just set `type`/`shape`/`size`/`loading`/`disabled`. | htmlType | set the original html `type` of `button`, see: [MDN](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#attr-type) | string | `button` | | icon | set the icon of button, see: Icon component | string | - | | loading | set the loading status of button | boolean \| { delay: number } | false | -| shape | can be set to `circle` or omitted | string | - | +| shape | can be set to `circle`, `round` or omitted | string | - | | size | can be set to `small` `large` or omitted | string | `default` | | target | same as target attribute of a, works when href is specified | string | - | | type | can be set to `primary` `ghost` `dashed` `danger`(added in 2.7) or omitted (meaning `default`) | string | `default` | @@ -35,6 +35,12 @@ It accepts all props which native button support. `` will be rendered into `Hello world!`. +## FAQ + +### How to remove space between 2 chinese characters + +Use [ConfigProvider](/components/config-provider/#API) to set `autoInsertSpaceInButton` as `false`. +