import { Component, ComponentType, ReactNode } from 'react';
import PropTypes from 'prop-types';
/**
---
category: utilities/react
---
Abstract component identifier. Helpful for picking out a specific child.
```js
class App extends Component {
render () {
const title = pick(Title, this.props.children)
const content = pick(Content, this.props.children)
return (
{title}
{content}
)
}
}
class Title extends ComponentIdentifier { static displayName = 'Title' }
class Content extends ComponentIdentifier { static displayName = 'Content' }
ReactDOM.render(
Hello World!
This text gets decorated within `App`.
,
document.getElementById('container')
)
```
@module ComponentIdentifier
**/
declare class ComponentIdentifier extends Component
{
static propTypes: {
children: PropTypes.Requireable;
};
static defaultProps: {
children: null;
};
static pick: (component: ComponentType, children: ReactNode) => undefined;
render(): JSX.Element | null;
}
export default ComponentIdentifier;
export {
/**
*
* Pick a specific child component from a component's children
*
* @param {Component} component The component to look for
* @param {Array} children The child components to look through
* @return {Component} The matching component if found, otherwise undefined
*/
ComponentIdentifier };
//# sourceMappingURL=ComponentIdentifier.d.ts.map