61 lines
1.7 KiB
Plaintext
61 lines
1.7 KiB
Plaintext
/**
|
|
* Copyright (c) 2013-present, Facebook, Inc.
|
|
* All rights reserved.
|
|
*
|
|
* This source code is licensed under the BSD-style license found in the
|
|
* LICENSE file in the root directory of this source tree. An additional grant
|
|
* of patent rights can be found in the PATENTS file in the same directory.
|
|
*
|
|
* @providesModule DraftEditorPlaceholder.react
|
|
* @format
|
|
* @flow
|
|
*/
|
|
|
|
'use strict';
|
|
|
|
import type { DraftTextAlignment } from './DraftTextAlignment';
|
|
import type EditorState from './EditorState';
|
|
|
|
const React = require('react');
|
|
|
|
const cx = require('fbjs/lib/cx');
|
|
|
|
type Props = {
|
|
accessibilityID: string;
|
|
editorState: EditorState;
|
|
text: string;
|
|
textAlignment: DraftTextAlignment;
|
|
};
|
|
|
|
/**
|
|
* This component is responsible for rendering placeholder text for the
|
|
* `DraftEditor` component.
|
|
*
|
|
* Override placeholder style via CSS.
|
|
*/
|
|
class DraftEditorPlaceholder extends React.Component<Props> {
|
|
shouldComponentUpdate(nextProps: Props): boolean {
|
|
return this.props.text !== nextProps.text || this.props.editorState.getSelection().getHasFocus() !== nextProps.editorState.getSelection().getHasFocus();
|
|
}
|
|
|
|
render(): React.Node {
|
|
const hasFocus = this.props.editorState.getSelection().getHasFocus();
|
|
|
|
const className = cx({
|
|
'public/DraftEditorPlaceholder/root': true,
|
|
'public/DraftEditorPlaceholder/hasFocus': hasFocus
|
|
});
|
|
|
|
const contentStyle = {
|
|
whiteSpace: 'pre-wrap'
|
|
};
|
|
|
|
return <div className={className}>
|
|
<div className={cx('public/DraftEditorPlaceholder/inner')} id={this.props.accessibilityID} style={contentStyle}>
|
|
{this.props.text}
|
|
</div>
|
|
</div>;
|
|
}
|
|
}
|
|
|
|
module.exports = DraftEditorPlaceholder; |