@@ -102,7 +102,7 @@ const StyledEditorDiv = styled(Box)(({ theme }) => ({
102102 } ,
103103} ) ) ;
104104
105- const ResizableDiv = ( { columnIndex, children, ...otherProps } ) => {
105+ const ResizableDiv = ( { columnIndex, children, resizeKey , defaultSize , ...otherProps } ) => {
106106
107107 const editorRef = React . useRef ( null ) ;
108108 const { getCellElement} = useContext ( RowInfoContext ) ;
@@ -124,12 +124,20 @@ const ResizableDiv = ({columnIndex, children, ...otherProps}) => {
124124 if ( box . right > innerWidth ) {
125125 editorRef . current . firstChild . style . width = `${ currentWidth - widthDiff - 20 } px` ;
126126 }
127+ if ( currentHeight || currentWidth ) {
128+ window . resizeKeys = window . resizeKeys || { } ;
129+ window . resizeKeys [ resizeKey ] = { height : editorRef . current . firstChild . style . height , width : editorRef . current . firstChild . style . width } ;
130+ }
131+
127132 } ;
128133
129134 editorRef . current . addEventListener ( 'mousedown' , ( ) => {
130135 document . addEventListener ( 'mouseup' , resizeEditor , { once : true } ) ;
131136 } ) ;
132137
138+ editorRef . current . firstChild . style . height = window . resizeKeys ?. [ resizeKey ] ?. height || defaultSize . height ;
139+ editorRef . current . firstChild . style . width = window . resizeKeys ?. [ resizeKey ] ?. width || defaultSize . width ;
140+
133141 return ( ) => document . removeEventListener ( 'mouseup' , resizeEditor ) ;
134142
135143 } , [ ] ) ;
@@ -146,7 +154,9 @@ const ResizableDiv = ({columnIndex, children, ...otherProps}) => {
146154ResizableDiv . displayName = 'ResizableDiv' ;
147155ResizableDiv . propTypes = {
148156 children : CustomPropTypes . children ,
149- columnIndex : PropTypes . number
157+ columnIndex : PropTypes . number ,
158+ resizeKey : PropTypes . string ,
159+ defaultSize : PropTypes . object ,
150160} ;
151161
152162function autoFocusAndSelect ( input ) {
@@ -249,7 +259,7 @@ export function TextEditor({row, column, onRowChange, onClose}) {
249259 return (
250260 < Portal container = { document . body } >
251261 < ResizableDiv columnIndex = { column . idx }
252- className = 'Editors-textEditor' data-label = "pg-editor" onKeyDown = { suppressEnterKey } >
262+ className = 'Editors-textEditor' data-label = "pg-editor" resizeKey = { 'text' } defaultSize = { { height : '80px' , width : '250px' } } onKeyDown = { suppressEnterKey } >
253263 < textarea ref = { autoFocusAndSelect } className = 'Editors-textarea' value = { localVal } onChange = { onChange } onKeyDown = { onkeydown } />
254264 < Box display = "flex" justifyContent = "flex-end" >
255265 < DefaultButton startIcon = { < CloseIcon /> } onClick = { ( ) => onClose ( false ) } size = "small" >
@@ -436,7 +446,7 @@ export function JsonTextEditor({row, column, onRowChange, onClose}) {
436446 return (
437447 < Portal container = { document . body } >
438448 < ResizableDiv columnIndex = { column . idx }
439- className = 'Editors-jsonEditor' data-label = "pg-editor" onKeyDown = { suppressEnterKey } >
449+ className = 'Editors-jsonEditor' data-label = "pg-editor" resizeKey = { 'json' } defaultSize = { { height : '500px' , width : '600px' } } onKeyDown = { suppressEnterKey } >
440450 < JsonEditor
441451 setJsonEditorSize = { setJsonEditorSize }
442452 value = { localVal }
0 commit comments