-
Notifications
You must be signed in to change notification settings - Fork 4.2k
/
index.js
112 lines (100 loc) · 2.83 KB
/
index.js
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
/**
* External dependencies
*/
import classnames from 'classnames';
import { get } from 'lodash';
/**
* WordPress dependencies
*/
import { __ } from '@wordpress/i18n';
import { compose } from '@wordpress/element';
import { getDefaultBlockName } from '@wordpress/blocks';
import { decodeEntities } from '@wordpress/utils';
import { withSelect, withDispatch } from '@wordpress/data';
import { DotTip } from '@wordpress/nux';
/**
* Internal dependencies
*/
import './style.scss';
import BlockDropZone from '../block-drop-zone';
import InserterWithShortcuts from '../inserter-with-shortcuts';
import Inserter from '../inserter';
export function DefaultBlockAppender( {
isLocked,
isVisible,
onAppend,
showPrompt,
placeholder,
layout,
rootUID,
hasTip,
} ) {
if ( isLocked || ! isVisible ) {
return null;
}
const value = decodeEntities( placeholder ) || __( 'Write your story' );
return (
<div
data-root-uid={ rootUID || '' }
className={ classnames( 'editor-default-block-appender', {
'has-tip': hasTip,
} ) }>
<BlockDropZone rootUID={ rootUID } layout={ layout } />
<input
role="button"
aria-label={ __( 'Add block' ) }
className="editor-default-block-appender__content"
type="text"
readOnly
onFocus={ onAppend }
onClick={ onAppend }
onKeyDown={ onAppend }
value={ showPrompt ? value : '' }
/>
<InserterWithShortcuts rootUID={ rootUID } layout={ layout } />
<Inserter position="top right">
<DotTip id="core/editor.inserter">
{ __( 'Welcome to the wonderful world of blocks! Click ‘Add block’ to insert different kinds of content—text, images, quotes, video, lists, and much more.' ) }
</DotTip>
</Inserter>
</div>
);
}
export default compose(
withSelect( ( select, ownProps ) => {
const { getBlockCount, getBlock, getEditorSettings } = select( 'core/editor' );
const { isTipVisible } = select( 'core/nux' );
const isEmpty = ! getBlockCount( ownProps.rootUID );
const lastBlock = getBlock( ownProps.lastBlockUID );
const isLastBlockDefault = get( lastBlock, [ 'name' ] ) === getDefaultBlockName();
const { templateLock, bodyPlaceholder } = getEditorSettings();
return {
isVisible: isEmpty || ! isLastBlockDefault,
showPrompt: isEmpty,
isLocked: !! templateLock,
placeholder: bodyPlaceholder,
hasTip: isTipVisible( 'core/editor.inserter' ),
};
} ),
withDispatch( ( dispatch, ownProps ) => {
const {
insertDefaultBlock,
startTyping,
} = dispatch( 'core/editor' );
const { dismissTip } = dispatch( 'core/nux' );
return {
onAppend() {
const { layout, rootUID, hasTip } = ownProps;
let attributes;
if ( layout ) {
attributes = { layout };
}
insertDefaultBlock( attributes, rootUID );
startTyping();
if ( hasTip ) {
dismissTip( 'core/editor.inserter' );
}
},
};
} ),
)( DefaultBlockAppender );