Add Label Details (Display Source) on Autocomplete

[0xJWLabs]

I would like to request a feature enhancement for the autocomplete suggestions when working with modules let’s say in TypeScript. Specifically, when typing a symbol (e.g., a.ab), it would be useful to see the source module or origin of the symbol alongside the kind and label.

For example, when importing a module like:

import a from "abc_module";

As we type a.ab, the autocomplete should display the following format:

[kind] [label] [label_detail]

Where:

•	Kind refers to the symbol type (e.g., function, variable, class).
•	Label refers to the symbol name (e.g., ab).
•	Label Detail refers to the source or module name (e.g., abc_module).

So, for the example above, the autocomplete would display:

[function] [ab] [abc_module]

Motivation

This feature would greatly improve the developer experience by providing additional context in the autocomplete dropdown. It would help users quickly identify where a symbol is coming from, especially when working with multiple modules or libraries.

Use Case

•	Improves Productivity: Developers can identify the source of a symbol more easily without needing to navigate or hover over the code.
•	Reduces Confusion: When multiple modules or libraries export similarly named symbols, showing the module source can clarify which one is being suggested.

Expected Behavior

The autocomplete suggestions should have an additional field for label_detail, which shows the originating module or source of the symbol.

Example Autocomplete Suggestion Format

For a.ab, imported from abc_module:

[function] [ab] [abc_module]

Example from other plugin

nvim-cmp:

[AbaoFromCUG]

Not what you want, but it should be helpful!

TIP: render what your want from ctx

    ---@param ctx blink.cmp.CompletionRenderContext
    ---@return blink.cmp.Component
    local function render_item(ctx)
        local map = {
            ["blink.cmp.sources.lsp"] = "[LSP]",
            ["blink.cmp.sources.path"] = "[PATH]",
            ["blink.cmp.sources.snippets"] = "[SNIP]",
        }
        return {
            {
                " " .. ctx.item.label,
                fill = true,
                -- hl_group = ctx.deprecated and "BlinkCmpLabelDeprecated" or "BlinkCmpLabel",
            },
            { string.format(" %s%s%-10s", ctx.kind_icon, ctx.icon_gap, ctx.kind), hl_group = "BlinkCmpKind" .. ctx.kind },
            {
                string.format("%6s ", map[ctx.item.source] or "UNKNOWN"),
                hl_group = "BlinkCmpSource",
            },
        }
    end
    require("blink-cmp").setup({
        windows = {
            autocomplete = {
                draw = render_item,
            },
        },
    })

[0xJWLabs]

I know about this, thanks btw, but I’m talking about source like where it comes from, like module a or module b etc

[mcauley-penney]

@0xJWLabs What AbaoFromCUG gave is the first half of the problem (and they knew that, because they said they knew it wasn't what you were after). I was doing this with cmp using a similar method. What you're asking about is the other half of the problem: getting the source information.

I do this like this:

local function get_lsp_completion_context(completion)
  local ok, source_name = pcall(function()
    return vim.lsp.get_client_by_id(completion.client_id).name
  end)

  if not ok then
    return nil
  end

  if source_name == "ts_ls" then
    return completion.detail
  elseif source_name == "pyright" and completion.labelDetails ~= nil then
    return completion.labelDetails.description
  elseif source_name == "texlab" then
    return completion.detail
  elseif source_name == "clangd" then
    local doc = completion.documentation
    if doc == nil then return end

    local import_str = doc.value
    import_str = import_str:gsub("[\n]+", "")

    local str
    str = import_str:match('<(.-)>')
    if str then
      return '<' .. str .. '>'
    end

    str = import_str:match('["\'](.-)["\']')
    if str then
      return '"' .. str .. '"'
    end

    return nil
  end
end 

draw = function(ctx)
          -- differentiate snippets from LSPs, the user, and emmet
          local icon, cmp_item, source = ctx.kind_icon, ctx.item, ctx.item.source


          local cmp_ctx
          if source == "LSP" then
            cmp_ctx = get_lsp_completion_context(cmp_item)

            if cmp_ctx == nil then
              cmp_ctx = ""
            end
          end

          return {
            { " " },
            {
              " " .. ctx.item.label .. " ",
              fill = true,
              hl_group = ctx.deprecated and "BlinkCmpLabelDeprecated" or "BlinkCmpLabel",
              max_width = 45,
            },
            { cmp_ctx },
            { " " },
          }
        end, 

And I get this for clangd:

[Saghen]

Keeping this open as I plan to add support natively in blink

[Saghen]

Please make sure you've read and added the new lsp_capabilities snippet from the README. Otherwise, you won't get any label details