Skip to content

component

windwp edited this page Sep 18, 2021 · 34 revisions

Component

You can return a list of the child components.

basic.section_y = {
   hl_colors = airline_colors.b,
   text = function()
       if check_width() then
           return {
               { sep.left_filled, state.mode[2] .. 'Sep' },
               { b_components.file_type({ icon = true }), state.mode[2] },
               { ' ', '' },
           }
       end
       return { { sep.left_filled, state.mode[2] .. 'Sep' } }
   end,
}

child component

child component can be a function too.

comps.modified = {
    hl_colors = {
        default = { 'white', 'red' },
        before = { 'white', 'red' },
        after = { 'white', 'red' },
        bg = { 'black', 'green' },
        red = { 'red', 'black' },
        green = { 'green', 'black' },
    },
    text = function()
        return {
            { sep_ani, 'before' },
            {
                function()
                    if vim.bo.modified or vim.bo.modifiable == false then
                        return ''
                    end
                    return ''
                end,
                function(hl_data)
                    if vim.bo.modified then
                        return hl_data.green
                    elseif vim.bo.modifiable == false or vim.bo.readonly == true then
                        return hl_data.red
                    end
                    return hl_data.bg
                end,
            },
            { sep.slant_right, 'after' },
        }
    end
}

child component highlight can be a function. but it needs to use hl_data and return a hl_name

comps.modified = {
    hl_colors = {
        default = { 'white', 'red' },
        after = { 'red', 'RightBg' },
        before = { 'white', 'red' },
        bg = { 'black', 'green' },
        red = { 'red', 'black' },
        green = { 'green', 'black' },
    },
    text = function()
        return {
            { sep.slant_right, 'before' },
            {
                function()
                    if vim.bo.modified or vim.bo.modifiable == false then
                        return ''
                    end
                    return ''
                end,
                function(hl_data)
                    if vim.bo.modified then
                        return hl_data.green
                    elseif vim.bo.modifiable == false or vim.bo.readonly == true then
                        return hl_data.red
                    end
                    return hl_data.bg
                end,
            },
            { sep.slant_right, 'after' },
        }
    end,
}

add or remove component

It make you can add some cool animation to your statusline when you press a key or some event happen.

local windline = require('windline')
  windline.add_component({
      name = 'test',
      hl_colors = {
          red = { 'red', 'NormalBg' },
      },
      text = function()
          return {
              { '🧛 ', 'red' },
              { 'new component', 'red' },
          }
      end,
  }, {
      filetype = 'default',
      -- it will add a new component before git component
      -- you can use and index number
      position = 'git',
      -- if you want to add on inactive component
      --kind ='inactive',
  })
  windline.remove_component({ name = 'test', filetype = 'default' })

sample

-- press `<leader>x` to add a new component or `<leader>z` to remove component
require('wlsample.test_add_component')

utility

Cache value on buffer

If you have a complex function please use that function with cache_on_buffer

--- it create a function then set a result of function to
--- `vim.b.wl_file_name`.It update value on BufEnter event otherwise it return
--- value from buffer`vim.b.wl_file_name`
local cache_utils = require('windline.cache_utils')
local cache_file_name = cache_utils.cache_on_buffer('BufEnter', 'wl_file_name', function()

end)

Sample

--- it is a filename function It shorten the first part of
--- pathname and the second part has a different color
--- if you don't use cache_on_buffer it will calculate every time you change mode
--- or redraw status line,
comps.file_name = {
    text = cache_utils.cache_on_buffer('BufEnter', 'wl_file_name', function()
        print('calc file_name')
        local path = fn.expand("%")
        local name = fn.fnamemodify(path, ':p:t')
        if string.match(path, '^fugitive') ~= nil then
            name = name .. '[git]'
            return { { name, 'git' } }
        end
        if path == "" or path == "./" then
            return '[No Name]'
        end
        local dir = path  and fn.fnamemodify(fn.pathshorten(path), ":h:h") .. "/" or ""
        local fname = path and fn.fnamemodify(path, ":h:t") .. "/" .. name or name
        if dir == "./" then
            dir = fn.fnamemodify(fname, ":h") .. "/"
            fname = name
        end
        return {
            {dir, 'dir'},
            {fname, 'path'}
        }
    end),
    hl_colors = {
        dir = {'white_light', 'blue'},
        path = { 'white', 'blue' },
        git = { 'red', 'blue' },
    },
}

you can use the cache_on_buffer function on the child component too. But remember it use the same function with a buffer_name_variable so if you send a different function with the same variable name only uses the first function.

the performance is huge improved if you use a cache version sample render statusline 1000 time with file_size(0.22s) vs cache_file_size(0.03s) you can run :WindLineBenchmark to test it render 10.000 time

job utils

it runs a system command a gets a result to display on status line. when command is running it uses an animation library to display a loading spinner

local job_utils = require('wlanimation.components.job')
local job_interval = {
    hl_colors = hl_list.Black,
    text = job_utils.job_interval(
        'sleep 10', -- it use uv.spawn so you can't use pipe on command
        3000,-- interval miliseconds
        'job_inerval', -- a unique name for job
        function(data)

            if data.is_load then
                return 'interval ' .. data.loading_text
            end
            return 'interval done ' .. (data.data or '')
        end
    ),
}

local job = {
     hl_colors = hl_list.Black,
     text = job_utils.job_event(
         'sleep 10',
         'BufEnter', -- re run command on BufEnter event
         'job_enter',
         function(data)
            if data.is_load then
                return 'event ' .. data.loading_text
            end
            return 'bufenter done ' .. (data.data or '')
         end
     ),
 }

Builtin component

Basic

local basic_components = require('windline.components.basic')
Component Usage
divider %= use to algin status
line_col display line and column
progress display progress
full_file_name() full file name of current path
file_name('default','unique,full,short') get unique file name or short name
cache_file_name same of file name but it cache value on buffer
file_type({icon=true,default=' '}) get file_type
cache_file_type same of file type but it cache value on buffer
file_size() get file size
cache_file_size same of file size but it cache value on buffer
file_icon get file icon
({default='',hl_colors={'red','blue'})
cache_file_icon() same of file icon but it cache value on buffer
file_format() get file format
file_modified() get file modified

Lsp

local lsp_components = require('windline.components.lsp')
Usage KEY
check_lsp() check is have lsp server
lsp_name() get lsp server name
lsp_error({show_zero=true,format="%s"}) get lsp error number
lsp_hint({show_zero=true,format="%s"}) get lsp hint number
lsp_warning({show_zero=true,format="%s"}) get lsp warning number
lsp_info({show_zero=true,format="%s"}) get lsp info number

Git

git component require gitsign to work.

local git_components = require('windline.components.git')
Usage KEY
is_git() check is git
git_branch() get git branch
diff_added({show_zero=true,format="%s"}) get diff added number
diff_changed({show_zero=true,format="%s"}) get diff changed number
diff_removed({show_zero=true,format="%s"}) get diff remove number

Clone this wiki locally