Impliment orderList support on markdown toolbar

Author: tomrule007

components/MarkdownToolbar.tsx

@@ -24,10 +24,11 @@ type StyleArgs = {
   blockSuffix?: string
   multiline?: boolean
   surroundWithNewLines?: boolean
+  orderedList?: boolean
 }
 
 const applyMarkdown = (
-  textarea: HTMLTextAreaElement,
+  textarea: HTMLTextAreaElement | null,
   styleArgs: StyleArgs
 ): void => {
   if (!textarea) return
@@ -38,7 +39,8 @@ const applyMarkdown = (
     blockPrefix = '',
     blockSuffix = '',
     multiline = false,
-    surroundWithNewLines = false
+    surroundWithNewLines = false,
+    orderedList = false
   } = styleArgs
 
   const { value, selectionStart, selectionEnd } = textarea
@@ -62,7 +64,8 @@ const applyMarkdown = (
     right,
     selectedPrefix,
     selectedSuffix,
-    multiline
+    multiline,
+    orderedList
   })
 
   console.log({ action })
@@ -96,6 +99,20 @@ const applyMarkdown = (
       )
       textarea.selectionStart = selectionStart
 
+      break
+    case 'removeOrderedList':
+      insertText(
+        textarea,
+        selectionLines.map(line => line.replace(/\d+\. /, '')).join('\n')
+      )
+      textarea.selectionStart = selectionStart
+      break
+    case 'addOrderedList':
+      insertText(
+        textarea,
+        selectionLines.map((line, i) => `${i + 1}. ${line}`).join('\n')
+      )
+      textarea.selectionStart = selectionStart
       break
     default:
       // Handle both add cases 'addSingle' & 'addMulti'
@@ -141,17 +158,31 @@ type StyleDetectionInput = {
   selectedPrefix: string
   selectedSuffix: string
   multiline: boolean
+  orderedList: boolean
 }
-type ActionTypes = 'addMulti' | 'addSingle' | 'removeSingle' | 'removeMulti'
+type ActionTypes =
+  | 'addMulti'
+  | 'addSingle'
+  | 'addOrderedList'
+  | 'removeOrderedList'
+  | 'removeSingle'
+  | 'removeMulti'
 
 export const detectActionType = ({
   left,
   selectionLines,
   right,
   selectedPrefix,
   selectedSuffix,
-  multiline
+  multiline,
+  orderedList
 }: StyleDetectionInput): ActionTypes => {
+  if (orderedList) {
+    return selectionLines.every(line => /^\d+\. /.test(line))
+      ? 'removeOrderedList'
+      : 'addOrderedList'
+  }
+
   if (
     (!multiline || selectionLines.length === 1) &&
     left.endsWith(selectedPrefix) &&
@@ -253,7 +284,7 @@ const buttons = [
   },
   {
     tooltipTitle: 'Add a numbered list',
-    styleArgs: { prefix: '1. ', surroundWithNewLines: true },
+    styleArgs: { prefix: '1. ', surroundWithNewLines: true, orderedList: true },
     Icon: ListOrderedIcon
   },
   {