You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
32 lines
1.0 KiB
32 lines
1.0 KiB
6 years ago
|
import * as React from 'react';
|
||
|
|
import CopyableIcon from './CopyableIcon';
|
||
|
|
import { injectIntl } from 'react-intl';
|
||
|
|
class Category extends React.Component {
|
||
|
|
constructor() {
|
||
|
|
super(...arguments);
|
||
|
|
this.state = {
|
||
|
|
justCopied: null,
|
||
|
|
};
|
||
|
|
this.onCopied = (type) => {
|
||
|
|
this.setState({ justCopied: type }, () => {
|
||
|
|
setTimeout(() => {
|
||
|
|
this.setState({ justCopied: null });
|
||
|
|
}, 2000);
|
||
|
|
});
|
||
|
|
};
|
||
|
|
}
|
||
|
|
render() {
|
||
|
|
const { icons, title, theme, newIcons, intl: { messages }, } = this.props;
|
||
|
|
const items = icons.map((name) => {
|
||
|
|
return (<CopyableIcon key={name} type={name} theme={theme} isNew={newIcons.indexOf(name) >= 0} justCopied={this.state.justCopied} onCopied={this.onCopied}/>);
|
||
|
|
});
|
||
|
|
return (<div>
|
||
|
|
<h3>{messages[`app.docs.components.icon.category.${title}`]}</h3>
|
||
|
|
<ul className={'anticons-list'}>
|
||
|
|
{items}
|
||
|
|
</ul>
|
||
|
|
</div>);
|
||
|
|
}
|
||
|
|
}
|
||
|
|
export default injectIntl(Category);
|