How to customize layout for Snacks.picker.select

[A7Lavinraj]

I have read docs and similar discussion but i still don't have any idea about how to change the layout of Snacks.picker.select only for that function call (not globally). BTW i want to use "vscode" layout that is awesome!

[A7Lavinraj]

@folke please give me any solution

[A7Lavinraj]

Are they accepted for future?

[A7Lavinraj]

@drowning-cat can please give me the code for selection of options = { a, b, c }

[A7Lavinraj]

With vscode layout

[drowning-cat]

There might be an easier way to do this, but this is the first one that comes to my mind.

vim.env.LAZY_STDPATH = '.repro'
load(vim.fn.system 'curl -s https://raw.githubusercontent.com/folke/lazy.nvim/main/bootstrap.lua')()

---@module 'snacks'

-- https://github.com/folke/snacks.nvim/blob/main/lua/snacks/picker/select.lua

---@class LayoutOpt: snacks.picker.layout.Config
---@field layout? snacks.layout.Box

---@generic T
---@param items T[] Arbitrary items
---@param opts? {prompt?: string, format_item?: (fun(item: T): string), layout?: LayoutOpt, kind?: string}
---@param on_choice fun(item?: T, idx?: number)
local picker_select = function(items, opts, on_choice)
  assert(type(on_choice) == 'function', 'on_choice must be a function')
  opts = opts or {}
  opts.layout = opts.layout or {}

  ---@type snacks.picker.finder.Item[]
  local finder_items = {}
  for idx, item in ipairs(items) do
    local text = (opts.format_item or tostring)(item)
    table.insert(finder_items, {
      formatted = text,
      text = idx .. ' ' .. text,
      item = item,
      idx = idx,
    })
  end

  local title = opts.prompt or 'Select'
  title = title:gsub('^%s*', ''):gsub('[%s:]*$', '')
  local completed = false

  return Snacks.picker.pick {
    source = 'select',
    items = finder_items,
    format = Snacks.picker.format.ui_select(opts.kind, #items),
    title = title,
    layout = vim.tbl_deep_extend('keep', opts.layout, {
      preview = false,
      layout = {
        height = math.floor(math.min(vim.o.lines * 0.8 - 10, #items + 3) + 0.5),
      },
    }),
    actions = {
      confirm = function(picker, item)
        if completed then
          return
        end
        completed = true
        picker:close()
        vim.schedule(function()
          on_choice(item and item.item, item and item.idx)
        end)
      end,
    },
    on_close = function()
      if completed then
        return
      end
      completed = true
      vim.schedule(on_choice)
    end,
  }
end

---@diagnostic disable-line: missing-fields
require('lazy.minit').repro {
  spec = {
    {
      'folke/snacks.nvim',
      lazy = false,
      keys = {
        {
          '<F1>',
          function()
            picker_select({ 1, 2, 3, 5, 6, 7, 8, 9, 10 }, { layout = { preset = 'vscode' } }, function() end)
          end,
          desc = 'Toggle custom select',
        },
        {
          '<F2>',
          function()
            Snacks.picker.select({ 1, 2, 3, 5, 6, 7, 8, 9, 10 }, {}, function() end)
          end,
          desc = 'Toggle custom select',
        },
      },
      ---@type snacks.Config
      opts = {},
    },
  },
}

[A7Lavinraj]

Thanks @drowning-cat you are a life saver. Actually dressing.nvim recently archived so that's why I want something to replace it for my plugin 😇

[A7Lavinraj]

@drowning-cat I have a table of strings which i want to show as options in the picker with layout of vscode. Any help will be appreciable

[drowning-cat]

Oops, sorry—I missed your message. If you're still having trouble, just drop some more details here.

[sugvn]

@drowning-cat I have a table of strings which i want to show as options in the picker with layout of vscode. Any help will be appreciable

something like this for a cutom picker("i made this for opening directories")
vim.keymap.set("n", "fk", function()
local Snacks = require("snacks")
local dirs = get_directories()

return Snacks.picker({
    finder = function()
        local items = {}
        for i, item in ipairs(dirs) do
            table.insert(items, {
                idx = i,
                file = item,
                text = item,
            })
        end
        return items
    end,
    layout = {
        layout = {
            box = "horizontal",
            width = 0.5,
            height = 0.5,
            {
                box = "vertical",
                border = "rounded",
                title = "Find directory",
                { win = "input", height = 1, border = "bottom" },
                { win = "list", border = "none" },
            },
        },
    },
    format = function(item, _)
        local file = item.file
        local ret = {}
        local a = Snacks.picker.util.align
        local icon, icon_hl = Snacks.util.icon(file.ft, "directory")
        ret[#ret + 1] = { a(icon, 3), icon_hl }
        ret[#ret + 1] = { " " }
        ret[#ret + 1] = { a(file, 20) }

        return ret
    end,
    confirm = function(picker, item)
        picker:close()
        Snacks.picker.pick("files", {
            dirs = { item.file },
        })
    end,
})

end)

[sugvn]

you can pass layout={preset="vscode"} as an argument to the snacks.picker function
like this:
Snacks.picker.files({layout={preset="vscode"}})