|
- /**
- * Copyright (c) Facebook, Inc. and its affiliates.
- *
- * This source code is licensed under the MIT license found in the
- * LICENSE file in the root directory of this source tree.
- *
- * @format
- * @flow strict-local
- * @emails oncall+draft_js
- */
- '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;
|