markdown-actions 1.0.0

package/src/index.js

@@ -0,0 +1,229 @@
+/**
+ * markdown-actions - Lightweight markdown toolbar functionality
+ * Based on GitHub's markdown-toolbar-element
+ */
+
+import { FORMATS, mergeWithDefaults } from './core/formats.js'
+import { insertText, setUndoMethod } from './core/insertion.js'
+import { preserveSelection, isMultipleLines } from './core/selection.js'
+import { blockStyle, multilineStyle } from './operations/block.js'
+import { applyListStyle } from './operations/list.js'
+import { getActiveFormats as getActive, hasFormat as has, expandSelection as expand } from './core/detection.js'
+
+/**
+ * Toggle bold formatting
+ */
+export function toggleBold(textarea) {
+  if (!textarea || textarea.disabled || textarea.readOnly) return
+  const style = mergeWithDefaults(FORMATS.bold)
+  const result = blockStyle(textarea, style)
+  insertText(textarea, result)
+}
+
+/**
+ * Toggle italic formatting
+ */
+export function toggleItalic(textarea) {
+  if (!textarea || textarea.disabled || textarea.readOnly) return
+  const style = mergeWithDefaults(FORMATS.italic)
+  const result = blockStyle(textarea, style)
+  insertText(textarea, result)
+}
+
+/**
+ * Toggle code formatting
+ */
+export function toggleCode(textarea) {
+  if (!textarea || textarea.disabled || textarea.readOnly) return
+  const selectedText = textarea.value.slice(textarea.selectionStart, textarea.selectionEnd)
+  const style = mergeWithDefaults(FORMATS.code)
+  
+  // Use block style for single line, multiline style for multiple lines
+  let result
+  if (isMultipleLines(selectedText)) {
+    // For multiline, we want code blocks
+    const blockStyle = {
+      prefix: '```\n',
+      suffix: '\n```',
+      surroundWithNewlines: true
+    }
+    result = multilineStyle(textarea, mergeWithDefaults(blockStyle))
+  } else {
+    result = blockStyle(textarea, style)
+  }
+  
+  insertText(textarea, result)
+}
+
+/**
+ * Insert or toggle link formatting
+ */
+export function insertLink(textarea, options = {}) {
+  if (!textarea || textarea.disabled || textarea.readOnly) return
+  
+  const selectedText = textarea.value.slice(textarea.selectionStart, textarea.selectionEnd)
+  let style = mergeWithDefaults(FORMATS.link)
+  
+  // Override with custom URL if provided
+  if (options.url) {
+    style.suffix = `](${options.url})`
+    style.replaceNext = ''
+  }
+  
+  // Override with custom text if provided
+  if (options.text && !selectedText) {
+    // Insert the text and select it
+    const pos = textarea.selectionStart
+    textarea.value = textarea.value.slice(0, pos) + options.text + textarea.value.slice(pos)
+    textarea.selectionStart = pos
+    textarea.selectionEnd = pos + options.text.length
+  }
+  
+  const result = blockStyle(textarea, style)
+  insertText(textarea, result)
+}
+
+/**
+ * Toggle bullet list formatting
+ */
+export function toggleBulletList(textarea) {
+  if (!textarea || textarea.disabled || textarea.readOnly) return
+  const style = mergeWithDefaults(FORMATS.bulletList)
+  applyListStyle(textarea, style)
+}
+
+/**
+ * Toggle numbered list formatting
+ */
+export function toggleNumberedList(textarea) {
+  if (!textarea || textarea.disabled || textarea.readOnly) return
+  const style = mergeWithDefaults(FORMATS.numberedList)
+  applyListStyle(textarea, style)
+}
+
+/**
+ * Toggle quote formatting
+ */
+export function toggleQuote(textarea) {
+  if (!textarea || textarea.disabled || textarea.readOnly) return
+  const style = mergeWithDefaults(FORMATS.quote)
+  const result = multilineStyle(textarea, style)
+  insertText(textarea, result)
+}
+
+/**
+ * Insert header with specific level
+ */
+export function insertHeader(textarea, level = 1) {
+  if (!textarea || textarea.disabled || textarea.readOnly) return
+  if (level < 1 || level > 6) level = 1
+  
+  const headerKey = `header${level === 1 ? '1' : level}`
+  const style = mergeWithDefaults(FORMATS[headerKey] || FORMATS.header1)
+  
+  // Select current line
+  const value = textarea.value
+  const start = textarea.selectionStart
+  let lineStart = start
+  let lineEnd = start
+  
+  // Find line boundaries
+  while (lineStart > 0 && value[lineStart - 1] !== '\n') {
+    lineStart--
+  }
+  while (lineEnd < value.length && value[lineEnd] !== '\n') {
+    lineEnd++
+  }
+  
+  textarea.selectionStart = lineStart
+  textarea.selectionEnd = lineEnd
+  
+  const currentLine = value.slice(lineStart, lineEnd)
+  
+  // Remove any existing header formatting
+  const cleanedLine = currentLine.replace(/^#{1,6}\s*/, '')
+  
+  // Apply new header
+  const newLine = style.prefix + cleanedLine
+  const result = {
+    text: newLine,
+    selectionStart: lineStart + style.prefix.length,
+    selectionEnd: lineStart + newLine.length
+  }
+  
+  insertText(textarea, result)
+}
+
+/**
+ * Get active formats at cursor position
+ */
+export function getActiveFormats(textarea) {
+  return getActive(textarea)
+}
+
+/**
+ * Check if format is active at cursor
+ */
+export function hasFormat(textarea, format) {
+  return has(textarea, format)
+}
+
+/**
+ * Expand selection based on options
+ */
+export function expandSelection(textarea, options = {}) {
+  expand(textarea, options)
+}
+
+/**
+ * Apply custom format
+ */
+export function applyCustomFormat(textarea, format) {
+  if (!textarea || textarea.disabled || textarea.readOnly) return
+  
+  const style = mergeWithDefaults(format)
+  let result
+  
+  if (style.multiline) {
+    const selectedText = textarea.value.slice(textarea.selectionStart, textarea.selectionEnd)
+    if (isMultipleLines(selectedText)) {
+      result = multilineStyle(textarea, style)
+    } else {
+      result = blockStyle(textarea, style)
+    }
+  } else {
+    result = blockStyle(textarea, style)
+  }
+  
+  insertText(textarea, result)
+}
+
+/**
+ * Preserve selection during callback
+ */
+export { preserveSelection }
+
+/**
+ * Configure undo method
+ */
+export { setUndoMethod }
+
+/**
+ * Default export with all functions
+ */
+export default {
+  toggleBold,
+  toggleItalic,
+  toggleCode,
+  insertLink,
+  toggleBulletList,
+  toggleNumberedList,
+  toggleQuote,
+  insertHeader,
+  getActiveFormats,
+  hasFormat,
+  expandSelection,
+  applyCustomFormat,
+  preserveSelection,
+  setUndoMethod
+}

package/src/operations/block-new.js

@@ -0,0 +1,109 @@
+/**
+ * Block and multiline operations - EXACT match to GitHub's implementation
+ * Based on markdown-toolbar-element index.ts lines 581-670
+ */
+
+import { 
+  isMultipleLines, 
+  expandSelectedText, 
+  newlinesToSurroundSelectedText 
+} from '../core/selection-new.js'
+
+/**
+ * Block style operation
+ * GitHub: index.ts lines 581-646
+ */
+export function blockStyle(textarea, arg) {
+  let newlinesToAppend
+  let newlinesToPrepend
+
+  const { prefix, suffix, blockPrefix, blockSuffix, replaceNext, prefixSpace, scanFor, surroundWithNewlines } = arg
+  const originalSelectionStart = textarea.selectionStart
+  const originalSelectionEnd = textarea.selectionEnd
+
+  let selectedText = textarea.value.slice(textarea.selectionStart, textarea.selectionEnd)
+  let prefixToUse = isMultipleLines(selectedText) && blockPrefix.length > 0 ? `${blockPrefix}\n` : prefix
+  let suffixToUse = isMultipleLines(selectedText) && blockSuffix.length > 0 ? `\n${blockSuffix}` : suffix
+
+  if (prefixSpace) {
+    const beforeSelection = textarea.value[textarea.selectionStart - 1]
+    if (textarea.selectionStart !== 0 && beforeSelection != null && !beforeSelection.match(/\s/)) {
+      prefixToUse = ` ${prefixToUse}`
+    }
+  }
+  selectedText = expandSelectedText(textarea, prefixToUse, suffixToUse, arg.multiline)
+  let selectionStart = textarea.selectionStart
+  let selectionEnd = textarea.selectionEnd
+  const hasReplaceNext = replaceNext.length > 0 && suffixToUse.indexOf(replaceNext) > -1 && selectedText.length > 0
+  if (surroundWithNewlines) {
+    const ref = newlinesToSurroundSelectedText(textarea)
+    newlinesToAppend = ref.newlinesToAppend
+    newlinesToPrepend = ref.newlinesToPrepend
+    prefixToUse = newlinesToAppend + prefix
+    suffixToUse += newlinesToPrepend
+  }
+
+  if (selectedText.startsWith(prefixToUse) && selectedText.endsWith(suffixToUse)) {
+    const replacementText = selectedText.slice(prefixToUse.length, selectedText.length - suffixToUse.length)
+    if (originalSelectionStart === originalSelectionEnd) {
+      let position = originalSelectionStart - prefixToUse.length
+      position = Math.max(position, selectionStart)
+      position = Math.min(position, selectionStart + replacementText.length)
+      selectionStart = selectionEnd = position
+    } else {
+      selectionEnd = selectionStart + replacementText.length
+    }
+    return { text: replacementText, selectionStart, selectionEnd }
+  } else if (!hasReplaceNext) {
+    let replacementText = prefixToUse + selectedText + suffixToUse
+    selectionStart = originalSelectionStart + prefixToUse.length
+    selectionEnd = originalSelectionEnd + prefixToUse.length
+    const whitespaceEdges = selectedText.match(/^\s*|\s*$/g)
+    if (arg.trimFirst && whitespaceEdges) {
+      const leadingWhitespace = whitespaceEdges[0] || ''
+      const trailingWhitespace = whitespaceEdges[1] || ''
+      replacementText = leadingWhitespace + prefixToUse + selectedText.trim() + suffixToUse + trailingWhitespace
+      selectionStart += leadingWhitespace.length
+      selectionEnd -= trailingWhitespace.length
+    }
+    return { text: replacementText, selectionStart, selectionEnd }
+  } else if (scanFor.length > 0 && selectedText.match(scanFor)) {
+    suffixToUse = suffixToUse.replace(replaceNext, selectedText)
+    const replacementText = prefixToUse + selectedText + suffixToUse
+    selectionStart = selectionEnd = selectionStart + prefixToUse.length
+    return { text: replacementText, selectionStart, selectionEnd }
+  } else {
+    const replacementText = prefixToUse + selectedText + suffixToUse
+    selectionStart = selectionStart + prefixToUse.length + selectedText.length + suffixToUse.indexOf(replaceNext)
+    selectionEnd = selectionStart + replaceNext.length
+    return { text: replacementText, selectionStart, selectionEnd }
+  }
+}
+
+/**
+ * Multiline style operation
+ * GitHub: index.ts lines 648-670
+ */
+export function multilineStyle(textarea, arg) {
+  const { prefix, suffix, surroundWithNewlines } = arg
+  let text = textarea.value.slice(textarea.selectionStart, textarea.selectionEnd)
+  let selectionStart = textarea.selectionStart
+  let selectionEnd = textarea.selectionEnd
+  const lines = text.split('\n')
+  const undoStyle = lines.every(line => line.startsWith(prefix) && line.endsWith(suffix))
+
+  if (undoStyle) {
+    text = lines.map(line => line.slice(prefix.length, line.length - suffix.length)).join('\n')
+    selectionEnd = selectionStart + text.length
+  } else {
+    text = lines.map(line => prefix + line + suffix).join('\n')
+    if (surroundWithNewlines) {
+      const { newlinesToAppend, newlinesToPrepend } = newlinesToSurroundSelectedText(textarea)
+      selectionStart += newlinesToAppend.length
+      selectionEnd = selectionStart + text.length
+      text = newlinesToAppend + text + newlinesToPrepend
+    }
+  }
+
+  return { text, selectionStart, selectionEnd }
+}

package/src/operations/block.js

@@ -0,0 +1,139 @@
+/**
+ * Block-level text formatting operations
+ * Handles inline formats like bold, italic, code, and links
+ */
+
+import { expandSelectedText, newlinesToSurroundSelectedText, isMultipleLines } from '../core/selection.js'
+import { insertText } from '../core/insertion.js'
+
+/**
+ * Apply block-level styling to selected text
+ */
+export function blockStyle(textarea, style) {
+  let newlinesToAppend
+  let newlinesToPrepend
+
+  const { prefix, suffix, blockPrefix, blockSuffix, replaceNext, prefixSpace, scanFor, surroundWithNewlines, trimFirst } = style
+  const originalSelectionStart = textarea.selectionStart
+  const originalSelectionEnd = textarea.selectionEnd
+
+  let selectedText = textarea.value.slice(textarea.selectionStart, textarea.selectionEnd)
+  let prefixToUse = isMultipleLines(selectedText) && blockPrefix && blockPrefix.length > 0 ? `${blockPrefix}\n` : prefix
+  let suffixToUse = isMultipleLines(selectedText) && blockSuffix && blockSuffix.length > 0 ? `\n${blockSuffix}` : suffix
+
+  if (prefixSpace) {
+    const beforeSelection = textarea.value[textarea.selectionStart - 1]
+    if (textarea.selectionStart !== 0 && beforeSelection != null && !beforeSelection.match(/\s/)) {
+      prefixToUse = ` ${prefixToUse}`
+    }
+  }
+  
+  selectedText = expandSelectedText(textarea, prefixToUse, suffixToUse, style.multiline)
+  let selectionStart = textarea.selectionStart
+  let selectionEnd = textarea.selectionEnd
+  const hasReplaceNext = replaceNext && replaceNext.length > 0 && suffixToUse.indexOf(replaceNext) > -1 && selectedText.length > 0
+  
+  if (surroundWithNewlines) {
+    const ref = newlinesToSurroundSelectedText(textarea)
+    newlinesToAppend = ref.newlinesToAppend
+    newlinesToPrepend = ref.newlinesToPrepend
+    prefixToUse = newlinesToAppend + prefix
+    suffixToUse += newlinesToPrepend
+  }
+
+  // Check if we should remove formatting (toggle off)
+  if (selectedText.startsWith(prefixToUse) && selectedText.endsWith(suffixToUse)) {
+    const replacementText = selectedText.slice(prefixToUse.length, selectedText.length - suffixToUse.length)
+    if (originalSelectionStart === originalSelectionEnd) {
+      let position = originalSelectionStart - prefixToUse.length
+      position = Math.max(position, selectionStart)
+      position = Math.min(position, selectionStart + replacementText.length)
+      selectionStart = selectionEnd = position
+    } else {
+      selectionEnd = selectionStart + replacementText.length
+    }
+    return { text: replacementText, selectionStart, selectionEnd }
+  } else if (!hasReplaceNext) {
+    // Add formatting
+    let replacementText = prefixToUse + selectedText + suffixToUse
+    selectionStart = originalSelectionStart + prefixToUse.length
+    selectionEnd = originalSelectionEnd + prefixToUse.length
+    const whitespaceEdges = selectedText.match(/^\s*|\s*$/g)
+    if (trimFirst && whitespaceEdges) {
+      const leadingWhitespace = whitespaceEdges[0] || ''
+      const trailingWhitespace = whitespaceEdges[1] || ''
+      replacementText = leadingWhitespace + prefixToUse + selectedText.trim() + suffixToUse + trailingWhitespace
+      selectionStart += leadingWhitespace.length
+      selectionEnd -= trailingWhitespace.length
+    }
+    return { text: replacementText, selectionStart, selectionEnd }
+  } else if (scanFor && scanFor.length > 0 && selectedText.match(scanFor)) {
+    // Handle link/image with URL detection
+    suffixToUse = suffixToUse.replace(replaceNext, selectedText)
+    const replacementText = prefixToUse + suffixToUse
+    selectionStart = selectionEnd = selectionStart + prefixToUse.length
+    return { text: replacementText, selectionStart, selectionEnd }
+  } else {
+    // Handle link/image with placeholder
+    const replacementText = prefixToUse + selectedText + suffixToUse
+    selectionStart = selectionStart + prefixToUse.length + selectedText.length + suffixToUse.indexOf(replaceNext)
+    selectionEnd = selectionStart + replaceNext.length
+    return { text: replacementText, selectionStart, selectionEnd }
+  }
+}
+
+/**
+ * Apply style to selected text in textarea
+ */
+export function styleSelectedText(textarea, style) {
+  const text = textarea.value.slice(textarea.selectionStart, textarea.selectionEnd)
+  
+  let result
+  if (style.orderedList || style.unorderedList) {
+    // Will be handled by list operations
+    return
+  } else if (style.multiline && isMultipleLines(text)) {
+    result = multilineStyle(textarea, style)
+  } else {
+    result = blockStyle(textarea, style)
+  }
+
+  insertText(textarea, result)
+}
+
+/**
+ * Apply multiline styling (quotes, etc)
+ */
+export function multilineStyle(textarea, style) {
+  const { prefix, suffix, surroundWithNewlines } = style
+  let text = textarea.value.slice(textarea.selectionStart, textarea.selectionEnd)
+  let selectionStart = textarea.selectionStart
+  let selectionEnd = textarea.selectionEnd
+  const lines = text.split('\n')
+  
+  // Check if we need to undo (all lines have the format)
+  const undoStyle = lines.every(line => line.startsWith(prefix) && (!suffix || line.endsWith(suffix)))
+
+  if (undoStyle) {
+    // Remove the formatting
+    text = lines.map(line => {
+      let result = line.slice(prefix.length)
+      if (suffix) {
+        result = result.slice(0, result.length - suffix.length)
+      }
+      return result
+    }).join('\n')
+    selectionEnd = selectionStart + text.length
+  } else {
+    // Apply the formatting
+    text = lines.map(line => prefix + line + (suffix || '')).join('\n')
+    if (surroundWithNewlines) {
+      const { newlinesToAppend, newlinesToPrepend } = newlinesToSurroundSelectedText(textarea)
+      selectionStart += newlinesToAppend.length
+      selectionEnd = selectionStart + text.length
+      text = newlinesToAppend + text + newlinesToPrepend
+    }
+  }
+
+  return { text, selectionStart, selectionEnd }
+}

package/src/operations/list-new.js

@@ -0,0 +1,137 @@
+/**
+ * List operations - EXACT match to GitHub's implementation
+ * Based on markdown-toolbar-element index.ts lines 676-784
+ */
+
+import { expandSelectionToLine, newlinesToSurroundSelectedText } from '../core/selection-new.js'
+
+/**
+ * Undo ordered list style
+ * GitHub: index.ts lines 676-689
+ */
+function undoOrderedListStyle(text) {
+  const lines = text.split('\n')
+  const orderedListRegex = /^\d+\.\s+/
+  const shouldUndoOrderedList = lines.every(line => orderedListRegex.test(line))
+  let result = lines
+  if (shouldUndoOrderedList) {
+    result = lines.map(line => line.replace(orderedListRegex, ''))
+  }
+
+  return {
+    text: result.join('\n'),
+    processed: shouldUndoOrderedList
+  }
+}
+
+/**
+ * Undo unordered list style
+ * GitHub: index.ts lines 691-704
+ */
+function undoUnorderedListStyle(text) {
+  const lines = text.split('\n')
+  const unorderedListPrefix = '- '
+  const shouldUndoUnorderedList = lines.every(line => line.startsWith(unorderedListPrefix))
+  let result = lines
+  if (shouldUndoUnorderedList) {
+    result = lines.map(line => line.slice(unorderedListPrefix.length, line.length))
+  }
+
+  return {
+    text: result.join('\n'),
+    processed: shouldUndoUnorderedList
+  }
+}
+
+/**
+ * Make prefix for list item
+ * GitHub: index.ts lines 706-712
+ */
+function makePrefix(index, unorderedList) {
+  if (unorderedList) {
+    return '- '
+  } else {
+    return `${index + 1}. `
+  }
+}
+
+/**
+ * Clear existing list style
+ * GitHub: index.ts lines 714-728
+ */
+function clearExistingListStyle(style, selectedText) {
+  let undoResultOpositeList
+  let undoResult
+  let pristineText
+  if (style.orderedList) {
+    undoResult = undoOrderedListStyle(selectedText)
+    undoResultOpositeList = undoUnorderedListStyle(undoResult.text)
+    pristineText = undoResultOpositeList.text
+  } else {
+    undoResult = undoUnorderedListStyle(selectedText)
+    undoResultOpositeList = undoOrderedListStyle(undoResult.text)
+    pristineText = undoResultOpositeList.text
+  }
+  return [undoResult, undoResultOpositeList, pristineText]
+}
+
+/**
+ * Apply list style to text
+ * GitHub: index.ts lines 730-784
+ * CRITICAL: This function modifies the textarea selection via expandSelectionToLine
+ */
+export function listStyle(textarea, style) {
+  const noInitialSelection = textarea.selectionStart === textarea.selectionEnd
+  let selectionStart = textarea.selectionStart
+  let selectionEnd = textarea.selectionEnd
+
+  // Select whole line - MODIFIES textarea.selectionStart and textarea.selectionEnd
+  expandSelectionToLine(textarea)
+
+  const selectedText = textarea.value.slice(textarea.selectionStart, textarea.selectionEnd)
+
+  // If the user intent was to do an undo, we will stop after this.
+  // Otherwise, we will still undo to other list type to prevent list stacking
+  const [undoResult, undoResultOpositeList, pristineText] = clearExistingListStyle(style, selectedText)
+
+  const prefixedLines = pristineText.split('\n').map((value, index) => {
+    return `${makePrefix(index, style.unorderedList)}${value}`
+  })
+
+  const totalPrefixLength = prefixedLines.reduce((previousValue, _currentValue, currentIndex) => {
+    return previousValue + makePrefix(currentIndex, style.unorderedList).length
+  }, 0)
+
+  const totalPrefixLengthOpositeList = prefixedLines.reduce((previousValue, _currentValue, currentIndex) => {
+    return previousValue + makePrefix(currentIndex, !style.unorderedList).length
+  }, 0)
+
+  if (undoResult.processed) {
+    if (noInitialSelection) {
+      selectionStart = Math.max(selectionStart - makePrefix(0, style.unorderedList).length, 0)
+      selectionEnd = selectionStart
+    } else {
+      selectionStart = textarea.selectionStart
+      selectionEnd = textarea.selectionEnd - totalPrefixLength
+    }
+    return { text: pristineText, selectionStart, selectionEnd }
+  }
+
+  const { newlinesToAppend, newlinesToPrepend } = newlinesToSurroundSelectedText(textarea)
+  const text = newlinesToAppend + prefixedLines.join('\n') + newlinesToPrepend
+
+  if (noInitialSelection) {
+    selectionStart = Math.max(selectionStart + makePrefix(0, style.unorderedList).length + newlinesToAppend.length, 0)
+    selectionEnd = selectionStart
+  } else {
+    if (undoResultOpositeList.processed) {
+      selectionStart = Math.max(textarea.selectionStart + newlinesToAppend.length, 0)
+      selectionEnd = textarea.selectionEnd + newlinesToAppend.length + totalPrefixLength - totalPrefixLengthOpositeList
+    } else {
+      selectionStart = Math.max(textarea.selectionStart + newlinesToAppend.length, 0)
+      selectionEnd = textarea.selectionEnd + newlinesToAppend.length + totalPrefixLength
+    }
+  }
+
+  return { text, selectionStart, selectionEnd }
+}