1- import React , { forwardRef , Ref , useEffect } from "react" ;
1+ import React , { forwardRef , MutableRefObject , useEffect } from "react" ;
22import { useAutocompleteInputProps } from "components/cellTypes/Editor/autocomplete" ;
33import {
44 autoPairBracketsCommands ,
@@ -10,22 +10,17 @@ import {
1010} from "components/cellTypes/Editor/commands" ;
1111import { EMITTERS_GROUPS } from "helpers/Constants" ;
1212import { MarkdownEditorProps } from "cdm/EditorModel" ;
13+ import useAutosizeTextArea from "components/styles/hooks/useAutosizeTextArea" ;
1314
1415export const MarkdownEditor = forwardRef ( function MarkdownEditor (
1516 { onEnter, onEscape, view, ...inputProps } : MarkdownEditorProps ,
16- ref : Ref < HTMLTextAreaElement >
17+ ref : MutableRefObject < HTMLTextAreaElement >
1718) {
18- const shouldAutoPairMarkdown = ( app . vault as any ) . getConfig (
19- "autoPairMarkdown"
20- ) ;
21- const shouldAutoPairBrackets = ( app . vault as any ) . getConfig (
22- "autoPairBrackets"
23- ) ;
24- const shouldUseTab = ( app . vault as any ) . getConfig ( "useTab" ) ;
25- const tabWidth = ( app . vault as any ) . getConfig ( "tabSize" ) ;
26- const shouldUseMarkdownLinks = ! ! ( app . vault as any ) . getConfig (
27- "useMarkdownLinks"
28- ) ;
19+ const shouldAutoPairMarkdown = app . vault . getConfig ( "autoPairMarkdown" ) ;
20+ const shouldAutoPairBrackets = app . vault . getConfig ( "autoPairBrackets" ) ;
21+ const shouldUseTab = app . vault . getConfig ( "useTab" ) ;
22+ const tabWidth = app . vault . getConfig ( "tabSize" ) ;
23+ const shouldUseMarkdownLinks = ! ! app . vault . getConfig ( "useMarkdownLinks" ) ;
2924
3025 const autocompleteProps = useAutocompleteInputProps ( {
3126 isInputVisible : true ,
@@ -97,19 +92,17 @@ export const MarkdownEditor = forwardRef(function MarkdownEditor(
9792 } ;
9893 } , [ view ] ) ;
9994
95+ useAutosizeTextArea ( ref . current , inputProps . value . toString ( ) ) ;
96+
10097 return (
10198 < textarea
10299 { ...inputProps }
103100 { ...autocompleteProps }
104101 ref = { ( c : HTMLTextAreaElement ) => {
105102 autocompleteProps . ref . current = c ;
106-
107- if ( ref && typeof ref === "function" ) {
108- ref ( c ) ;
109- } else if ( ref ) {
110- ( ref as any ) . current = c ;
111- }
103+ ref . current = c ;
112104 } }
105+ rows = { inputProps . value . toString ( ) ?. split ( "\n" ) . length || 1 }
113106 />
114107 ) ;
115108} ) ;
0 commit comments