Skip to content

Add image link support #117

@YousefHadder

Description

@YousefHadder

Add comprehensive support for Markdown image links, mirroring the existing link management functionality but adapted for image-specific syntax.

Overview

Implement a new images feature module that handles image link insertion, editing, and conversion operations using the ![alt](url) syntax.

Proposed Features

  1. Insert Image Link (<leader>mL)

    • Prompt for alt text and URL
    • Insert ![alt](url) at cursor position
    • Support optional title attribute: ![alt](url "title")
  2. Edit Image Link (<leader>mE)

    • Detect image link under cursor
    • Prompt to edit alt text and URL
    • Preserve title attribute if present
  3. Convert Selection to Image Link (Visual mode <leader>mL)

    • Use selected text as alt text
    • Prompt for URL only
    • Insert image link with selection as alt
  4. Convert Regular Link to Image Link (<leader>mA)

    • Detect [text](url) under cursor
    • Convert to ![text](url)
    • Toggle behavior (image → regular link)

Technical Specifications

File Structure:

lua/markdown-plus/images/
  └── init.lua          # Main image module

Module API:

M.insert_image()              -- Insert new image link
M.edit_image()                -- Edit image under cursor
M.selection_to_image()        -- Convert visual selection to image
M.toggle_image_link()         -- Convert link ↔ image
M.get_image_at_cursor()       -- Detect image link at cursor position

Pattern Matching:

-- Image link pattern: ![alt](url) or ![alt](url "title")
local IMAGE_PATTERN = "%!%[([^%]]*)%]%(([^%)]+)%)"
local IMAGE_WITH_TITLE = '%!%[([^%]]*)%]%(([^%s]+)%s+"([^"]+)"%)'

Configuration:

features = {
  images = true,  -- default: true
}

Keymaps:

Keymap Mode Description
<leader>mL Normal Insert new image link
<leader>mL Visual Convert selection to image
<leader>mE Normal Edit image under cursor
<leader>mA Normal Toggle link ↔ image

<Plug> Mappings:

  • <Plug>(MarkdownPlusInsertImage)
  • <Plug>(MarkdownPlusEditImage)
  • <Plug>(MarkdownPlusSelectionToImage)
  • <Plug>(MarkdownPlusToggleImageLink)

Implementation Checklist

  • Create lua/markdown-plus/images/init.lua module
  • Implement insert_image() function with alt/URL prompts
  • Implement edit_image() with cursor position detection
  • Implement selection_to_image() for visual mode
  • Implement toggle_image_link() for link conversion
  • Add title attribute support (optional)
  • Register <Plug> mappings in module
  • Add default keymaps with hasmapto() check
  • Update lua/markdown-plus/types.lua with type annotations
  • Update lua/markdown-plus/config/validate.lua for features.images
  • Update lua/markdown-plus/init.lua to load images module
  • Add comprehensive tests in spec/markdown-plus/images_spec.lua
  • Update README.md with new section and examples
  • Update doc/markdown-plus.txt with documentation
  • Update health check to report images feature status

Documentation Requirements

README Examples:

### Insert Image Link
In normal mode, press <leader>mL:
1. Alt text: "Screenshot"
2. URL: "images/screenshot.png"
Result: ![Screenshot](images/screenshot.png)

### Edit Image Link
![Old Alt](old-url.png)  ← cursor here
Press <leader>mE to edit both alt and URL

### Convert Link to Image
[My Photo](photo.jpg)  ← cursor here
Press <leader>mA → ![My Photo](photo.jpg)

Metadata

Metadata

Assignees

No one assigned

    Labels

    enhancementNew feature or request

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions