diff --git a/scripts/core/editor3/components/multi-line-quote/MultiLineQuote.tsx b/scripts/core/editor3/components/multi-line-quote/MultiLineQuote.tsx index d3e2e582dc..8f7c47998b 100644 --- a/scripts/core/editor3/components/multi-line-quote/MultiLineQuote.tsx +++ b/scripts/core/editor3/components/multi-line-quote/MultiLineQuote.tsx @@ -5,6 +5,8 @@ import {EditorState, ContentBlock} from 'draft-js'; import {TableBlock} from '../tables/TableBlock'; import {IActiveCell} from 'superdesk-api'; +export const MULTI_LINE_QUOTE_CLASS = 'multi-line-quote'; + interface IProps { block: ContentBlock; readOnly: boolean; @@ -24,7 +26,8 @@ export class MultiLineQuoteComponent extends React.Component { render() { return ( { 'table-header': withHeader, }); + const fullWidthStyle = this.props.fullWidth ? {width: '100%'} : {}; + return (
{ this.onMouseDown(e); }} > - - +
+ {Array.from(new Array(numRows)).map((_, i) => ( - + {Array.from(new Array(numCols)).map((__, j) => ( 0} key={`cell-${i}-${j}-${numRows}-${numCols}`} readOnly={this.props.readOnly} editorState={this.getCellEditorState(data, i, j)} diff --git a/scripts/core/editor3/components/tables/TableCell.tsx b/scripts/core/editor3/components/tables/TableCell.tsx index 712f5746c9..f1220180fa 100644 --- a/scripts/core/editor3/components/tables/TableCell.tsx +++ b/scripts/core/editor3/components/tables/TableCell.tsx @@ -1,5 +1,4 @@ import React from 'react'; -import PropTypes from 'prop-types'; import {Editor, RichUtils, getDefaultKeyBinding, DraftHandleValue, SelectionState, EditorState} from 'draft-js'; import {getSelectedEntityType, getSelectedEntityRange} from '../links/entityUtils'; import {customStyleMap} from '../customStyleMap'; @@ -11,6 +10,7 @@ interface IProps { onUndo: () => void; onRedo: () => void; onFocus: (styles: Array, selection: SelectionState) => void; + fullWidth?: boolean; } interface IState { @@ -185,9 +185,17 @@ export class TableCell extends React.Component { render() { const {editorState} = this.state; const {readOnly} = this.props; + const fullWidthStyle = this.props.fullWidth ? {width: '100%'} : {}; return ( -
event.stopPropagation()}> + { + e.preventDefault(); + }} + style={fullWidthStyle} + onClick={(event) => event.stopPropagation()} + > { it('should render', () => { const wrapper = shallow( { /* no-op */ }} readOnly={false} diff --git a/scripts/core/editor3/html/to-html/AtomicBlockParser.ts b/scripts/core/editor3/html/to-html/AtomicBlockParser.ts index e4143ebed9..b215327998 100644 --- a/scripts/core/editor3/html/to-html/AtomicBlockParser.ts +++ b/scripts/core/editor3/html/to-html/AtomicBlockParser.ts @@ -3,6 +3,7 @@ import {isQumuWidget, postProccessQumuEmbed} from '../../components/embeds/QumuW import {logger} from 'core/services/logger'; import {editor3StateToHtml} from './editor3StateToHtml'; import {getData, IEditor3TableData} from 'core/editor3/helpers/table'; +import {MULTI_LINE_QUOTE_CLASS} from 'core/editor3/components/multi-line-quote/MultiLineQuote'; /** * @ngdoc class @@ -200,7 +201,7 @@ export class AtomicBlockParser { } const {cells} = data; - let html = '
'; + let html = `
`; const cellContentState = cells[0]?.[0] != null ? convertFromRaw(cells[0][0]) : ContentState.createFromText('');