Enhance view-markdown-source with line actions

[shadowbq]

Currently within the source/features/view-markdown-source.tsx the plugin does not add the ... menu on line highlight.

Before:

After:

Example URL:
https://github.com/sindresorhus/refined-github/blob/3d517d6cd00e83a51973808c7ff03cae2b692d2b/contributing.md

[shadowbq]

I also understand that links like "https://github.com/sindresorhus/refined-github/blob/master/contributing.md#L76" only work with RG installed. Non RG users will just be brought to the top of the file. (That is a shortcoming of GH with markdown.)

[fregante]

This feature appears to be super easy. This is the code needed, it just needs to be cleaned up (use .append, JSX, our icons, drop unnecessary attributes)

1. Visit: https://github.com/sindresorhus/refined-github/blob/3d517d6cd00e83a51973808c7ff03cae2b692d2b/contributing.md#L
2. Run this code

$('.blob-wrapper').insertAdjacentHTML('beforeend', `<details class="details-reset details-overlay BlobToolbar position-absolute js-file-line-actions dropdown d-none" aria-hidden="true" >
    <summary class="btn-octicon ml-0 px-2 p-0 bg-white border border-gray-dark rounded-1" aria-label="Inline file action toolbar" aria-haspopup="menu" role="button">
      <svg class="octicon octicon-kebab-horizontal" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true"><path d="M8 9a1.5 1.5 0 100-3 1.5 1.5 0 000 3zM1.5 9a1.5 1.5 0 100-3 1.5 1.5 0 000 3zm13 0a1.5 1.5 0 100-3 1.5 1.5 0 000 3z"></path></svg>
    </summary>
    <details-menu role="menu">
      <ul class="BlobToolbar-dropdown dropdown-menu dropdown-menu-se mt-2" style="width:185px">
        <li>
          <clipboard-copy role="menuitem" class="dropdown-item" id="js-copy-lines" style="cursor:pointer;" tabindex="0" value="import select from 'select-dom';" data-ga-click="Blob, copyLines, numLines:1">Copy line</clipboard-copy>
        </li>
        <li>
          <clipboard-copy role="menuitem" class="dropdown-item" id="js-copy-permalink" style="cursor:pointer;" tabindex="0" value="https://github.com/sindresorhus/refined-github/blob/3d517d6cd00e83a51973808c7ff03cae2b692d2b/source/features/view-markdown-source.tsx#L3" data-ga-click="Blob, copyPermalink, numLines:1">
            Copy permalink
          </clipboard-copy>
        </li>
        <li><a class="dropdown-item js-update-url-with-hash" id="js-view-git-blame" role="menuitem" href="https://github.com/sindresorhus/refined-github/blame/3d517d6cd00e83a51973808c7ff03cae2b692d2b/source/features/view-markdown-source.tsx#L3" data-ga-click="Blob, viewGitBlame, numLines:1">View git blame</a></li>
          <li><a class="dropdown-item" id="js-new-issue" role="menuitem" href="https://github.com/sindresorhus/refined-github/issues/new?permalink=https%3A%2F%2Fgithub.com%2Fsindresorhus%2Frefined-github%2Fblob%2F3d517d6cd00e83a51973808c7ff03cae2b692d2b%2Fsource%2Ffeatures%2Fview-markdown-source.tsx%23L3" data-ga-click="Blob, newIssue, numLines:1">Reference in new issue</a></li>
      </ul>
    </details-menu>
  </details>`)

3. Click on a line (or multiple lines) like you normally would