first commit
This commit is contained in:
@@ -0,0 +1,100 @@
|
||||
/**
|
||||
* External dependencies
|
||||
*/
|
||||
import classnames from 'classnames';
|
||||
|
||||
/**
|
||||
* WordPress dependencies
|
||||
*/
|
||||
const {
|
||||
__,
|
||||
} = wp.i18n;
|
||||
|
||||
const {
|
||||
Component,
|
||||
Fragment,
|
||||
} = wp.element;
|
||||
|
||||
const {
|
||||
InnerBlocks,
|
||||
} = wp.blockEditor;
|
||||
|
||||
const {
|
||||
withSelect,
|
||||
} = wp.data;
|
||||
|
||||
/**
|
||||
* Component
|
||||
*/
|
||||
class AlertBlockEdit extends Component {
|
||||
constructor() {
|
||||
super(...arguments);
|
||||
|
||||
this.state = {
|
||||
// fix for WP 5.2
|
||||
// styles control generates error
|
||||
showInnerBlocks: !!this.props.clientId,
|
||||
};
|
||||
}
|
||||
|
||||
render() {
|
||||
const {
|
||||
setAttributes,
|
||||
hasChildBlocks,
|
||||
} = this.props;
|
||||
|
||||
let {
|
||||
className,
|
||||
attributes,
|
||||
} = this.props;
|
||||
|
||||
const {
|
||||
dismissible,
|
||||
canvasClassName,
|
||||
} = attributes;
|
||||
|
||||
className = classnames(
|
||||
'cnvs-block-alert',
|
||||
{
|
||||
'cnvs-block-alert-dismissible': dismissible,
|
||||
},
|
||||
canvasClassName,
|
||||
className
|
||||
);
|
||||
|
||||
return (
|
||||
<Fragment>
|
||||
<div className={className}>
|
||||
<div className="cnvs-block-alert-inner">
|
||||
{this.state.showInnerBlocks ? (
|
||||
<InnerBlocks
|
||||
templateLock={false}
|
||||
renderAppender={(
|
||||
hasChildBlocks ?
|
||||
undefined :
|
||||
() => <InnerBlocks.ButtonBlockAppender />
|
||||
)}
|
||||
/>
|
||||
) : __('Alert content')}
|
||||
</div>
|
||||
{dismissible ? (
|
||||
<button className="cnvs-close" type="button" data-dismiss="alert" aria-label={__('Close')}>
|
||||
<i className="cnvs-icon-x" />
|
||||
</button>
|
||||
) : ''}
|
||||
</div>
|
||||
</Fragment>
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
const AlertBlockEditWithSelect = withSelect((select, ownProps) => {
|
||||
const { clientId } = ownProps;
|
||||
const blockEditor = select('core/block-editor');
|
||||
|
||||
return {
|
||||
hasChildBlocks: blockEditor ? blockEditor.getBlockOrder(clientId).length > 0 : false,
|
||||
};
|
||||
})(AlertBlockEdit);
|
||||
|
||||
export default AlertBlockEditWithSelect;
|
||||
Reference in New Issue
Block a user