FR: snacks.picker support

[uroybd]

Pretty much the title. Currently, Catppuccin has snacks.nvim diagnostic support. However, the new picker looks ugly since it is not supported.

[SebastianBalle]

@mikededo Could you help here? You were so kind to introduce the snacks.nvim integration.

[uroybd]

If it helps in any way, I have been able to fix the look by adding the following custom highlight:

NormalFloat = { bg = colors.base, fg = colors.text },

[mikededo]

Hey @SebastianBalle, the only issue at the moment with snacks is that they have not updated their list of highlights. I'm working on adding a PR myself, and then it'd be easier to update all the highlights in this plugin. At the same time, most of snacks highlights are using the base ones, so there should be direct compatibility with the plugin (for example, using NormalFloat for the pickers and so on).

At the same time, there's extra configuration to be done in order to make a picker look the way you want. For example, in my case, here's how my picker looks:

While I had to customize some highlights in catppuccin's configuration, the layout and other must be done through snacks config.
Should we find an agreement on the colors of the picker and similar? I initially thought of "copying" the colors from the telescope configuration.

[mikededo]

I've been looking into the generated highlights from snacks, using the macchiato color scheme, and there's only only highlight that does not have any value assigned. It also includes the already defined highlights in our plugin section:

Snacks highlights (152 highlights, if I counted right)

SnacksDashboardTitle fg: | bg: | link: Title
fg: #8AADF4| bg: | link: 

SnacksDashboardSpecial fg: | bg: | link: Special
fg: #F5BDE6| bg: | link: 

SnacksDashboardTerminal fg: | bg: | link: SnacksDashboardNormal
fg: | bg: | link: Normal
fg: #CAD3F5| bg: #24273A| link: 

SnacksDashboardNormal fg: | bg: | link: Normal
fg: #CAD3F5| bg: #24273A| link: 

SnacksDashboardKey fg: #F5A97F| bg: | link: 

SnacksDashboardIcon fg: #F5BDE6| bg: | link: 

SnacksDashboardHeader fg: #8AADF4| bg: | link: 

SnacksDashboardFooter fg: #EED49F| bg: | link: 

SnacksDashboardDir fg: | bg: | link: NonText
fg: #6E738D| bg: | link: 

SnacksDashboardFile fg: #B7BDF8| bg: | link: 

SnacksDashboardDesc fg: #8AADF4| bg: | link: 

SnacksNotifierFooterTrace fg: | bg: | link: DiagnosticHint
fg: #8BD5CA| bg: | link: 

SnacksNotifierBorderTrace fg: #F4DBD6| bg: | link: 

SnacksNotifierTitleTrace fg: #F4DBD6| bg: | link: 

SnacksNotifierIconTrace fg: #F4DBD6| bg: | link: 

SnacksNotifierTrace fg: #F4DBD6| bg: | link: 

SnacksNotifierFooterError fg: | bg: | link: DiagnosticError
fg: #ED8796| bg: | link: 

SnacksNotifierBorderError fg: #ED8796| bg: | link: 

SnacksNotifierTitleError fg: #ED8796| bg: | link: 

SnacksNotifierIconError fg: #ED8796| bg: | link: 

SnacksNotifierError fg: #ED8796| bg: | link: 

SnacksNotifierFooterDebug fg: | bg: | link: DiagnosticHint
fg: #8BD5CA| bg: | link: 

SnacksNotifierBorderDebug fg: #F5A97F| bg: | link: 

SnacksNotifierTitleDebug fg: #F5A97F| bg: | link: 

SnacksNotifierIconDebug fg: #F5A97F| bg: | link: 

SnacksNotifierDebug fg: #F5A97F| bg: | link: 

SnacksNotifierFooterWarn fg: | bg: | link: DiagnosticWarn
fg: #EED49F| bg: | link: 

SnacksNotifierBorderWarn fg: #EED49F| bg: | link: 

SnacksNotifierTitleWarn fg: #EED49F| bg: | link: 

SnacksNotifierIconWarn fg: #EED49F| bg: | link: 

SnacksNotifierWarn fg: #EED49F| bg: | link: 

SnacksNotifierBorderInfo fg: #8AADF4| bg: | link: 

SnacksNotifierFooterInfo fg: | bg: | link: DiagnosticInfo
fg: #91D7E3| bg: | link: 

SnacksNotifierTitleInfo fg: #8AADF4| bg: | link: 

SnacksNotifierIconInfo fg: #8AADF4| bg: | link: 

SnacksNotifierInfo fg: #8AADF4| bg: | link: 

SnacksWinBarNC fg: | bg: | link: SnacksWinBar
fg: | bg: | link: Title
fg: #8AADF4| bg: | link: 

SnacksWinBar fg: | bg: | link: Title
fg: #8AADF4| bg: | link: 

SnacksBackdrop fg: #6E738D| bg: | link: 

SnacksNormal fg: | bg: | link: NormalFloat
fg: #CAD3F5| bg: #1E2030| link: 

SnacksPickerDiagnosticSource fg: | bg: | link: Comment
fg: #939AB7| bg: | link: 

SnacksInputPrompt fg: | bg: | link: SnacksInputTitle
fg: | bg: | link: DiagnosticInfo
fg: #91D7E3| bg: | link: 

SnacksPickerToggleRegex fg: | bg: | link: SnacksPickerToggle
fg: | bg: | link: DiagnosticVirtualTextInfo
fg: #91D7E3| bg: #2E384A| link: 

SnacksPickerToggleFollow fg: | bg: | link: SnacksPickerToggle
fg: | bg: | link: DiagnosticVirtualTextInfo
fg: #91D7E3| bg: #2E384A| link: 

SnacksPickerToggleModified fg: | bg: | link: SnacksPickerToggle
fg: | bg: | link: DiagnosticVirtualTextInfo
fg: #91D7E3| bg: #2E384A| link: 

SnacksPickerToggleIgnored fg: | bg: | link: SnacksPickerToggle
fg: | bg: | link: DiagnosticVirtualTextInfo
fg: #91D7E3| bg: #2E384A| link: 

SnacksPickerToggleHidden fg: | bg: | link: SnacksPickerToggle
fg: | bg: | link: DiagnosticVirtualTextInfo
fg: #91D7E3| bg: #2E384A| link: 

SnacksPickerGitDate fg: | bg: | link: Special
fg: #F5BDE6| bg: | link: 

SnacksPickerGitIssue fg: | bg: | link: Number
fg: #F5A97F| bg: | link: 

SnacksPickerGitType fg: | bg: | link: Title
fg: #8AADF4| bg: | link: 

SnacksPickerIconArray fg: | bg: | link: @punctuation.bracket
fg: #939AB7| bg: | link: 

SnacksPickerIconInterface fg: | bg: | link: @lsp.type.interface
fg: #F0C6C6| bg: | link: 

SnacksPickerIconKey fg: | bg: | link: @lsp.type.keyword
fg: | bg: | link: @keyword
fg: | bg: | link: Keyword
fg: #C6A0F6| bg: | link: 

SnacksPickerIconMethod fg: | bg: | link: @function.method
fg: | bg: | link: Function
fg: #8AADF4| bg: | link: 

SnacksPickerIconModule fg: | bg: | link: @module
fg: #B7BDF8| bg: | link: 

SnacksInputNormal fg: | bg: | link: Normal
fg: #CAD3F5| bg: #24273A| link: 

SnacksInputTitle fg: | bg: | link: DiagnosticInfo
fg: #91D7E3| bg: | link: 

SnacksInputIcon fg: | bg: | link: DiagnosticHint
fg: #8BD5CA| bg: | link: 

SnacksInputBorder fg: | bg: | link: DiagnosticInfo
fg: #91D7E3| bg: | link: 

SnacksPickerGitStatusRenamed fg: | bg: | link: SnacksPickerGitStatus
fg: | bg: | link: Special
fg: #F5BDE6| bg: | link: 

SnacksPickerGitStatusCopied fg: | bg: | link: SnacksPickerGitStatus
fg: | bg: | link: Special
fg: #F5BDE6| bg: | link: 

SnacksPickerGitBranchCurrent fg: | bg: | link: Number
fg: #F5A97F| bg: | link: 

SnacksPickerGitBranch fg: | bg: | link: Title
fg: #8AADF4| bg: | link: 

SnacksPickerGitBreaking fg: | bg: | link: Error
fg: #ED8796| bg: | link: 

SnacksPickerManPage fg: | bg: | link: Special
fg: #F5BDE6| bg: | link: 

SnacksPickerUndoSaved fg: | bg: | link: Special
fg: #F5BDE6| bg: | link: 

SnacksPickerToggle fg: | bg: | link: DiagnosticVirtualTextInfo
fg: #91D7E3| bg: #2E384A| link: 

SnacksPickerUndoCurrent fg: | bg: | link: @variable.builtin
fg: #ED8796| bg: | link: 

SnacksPickerUndoRemoved fg: | bg: | link: Removed
fg: #FFC0B9| bg: | link: 

SnacksPickerUndoAdded fg: | bg: | link: Added
fg: #B3F6C0| bg: | link: 

SnacksPickerTime fg: | bg: | link: Special
fg: #F5BDE6| bg: | link: 

SnacksPickerKeymapRhs fg: | bg: | link: NonText
fg: #6E738D| bg: | link: 

SnacksPickerBufFlags fg: | bg: | link: NonText
fg: #6E738D| bg: | link: 

SnacksPickerBufNr fg: | bg: | link: Number
fg: #F5A97F| bg: | link: 

SnacksPickerKeymapNowait fg: | bg: | link: @variable.builtin
fg: #ED8796| bg: | link: 

SnacksPickerKeymapLhs fg: | bg: | link: Special
fg: #F5BDE6| bg: | link: 

SnacksPickerFile fg: | bg: | link: 

SnacksPickerCol fg: | bg: | link: LineNr
fg: #494D64| bg: | link: 

SnacksPickerDelim fg: | bg: | link: Delimiter
fg: #939AB7| bg: | link: 

SnacksPickerSpinner fg: | bg: | link: Special
fg: #F5BDE6| bg: | link: 

SnacksPickerSelected fg: | bg: | link: Number
fg: #F5A97F| bg: | link: 

SnacksPickerComment fg: | bg: | link: Comment
fg: #939AB7| bg: | link: 

SnacksPickerCmdBuiltin fg: | bg: | link: @constructor
fg: #7DC4E4| bg: | link: 

SnacksPickerUnselected fg: | bg: | link: NonText
fg: #6E738D| bg: | link: 

SnacksPickerIdx fg: | bg: | link: Number
fg: #F5A97F| bg: | link: 

SnacksPickerTree fg: | bg: | link: LineNr
fg: #494D64| bg: | link: 

SnacksPickerAuPattern fg: | bg: | link: String
fg: #A6DA95| bg: | link: 

SnacksPickerAuEvent fg: | bg: | link: Constant
fg: #F5A97F| bg: | link: 

SnacksPickerLabel fg: | bg: | link: SnacksPickerSpecial
fg: | bg: | link: Special
fg: #F5BDE6| bg: | link: 

SnacksPickerItalic fg: | bg: | link: Italic
fg: | bg: | link: 

SnacksPickerDiagnosticCode fg: | bg: | link: Special
fg: #F5BDE6| bg: | link: 

SnacksPickerRegister fg: | bg: | link: Number
fg: #F5A97F| bg: | link: 

SnacksPickerRow fg: | bg: | link: String
fg: #A6DA95| bg: | link: 

SnacksPickerDimmed fg: | bg: | link: Conceal
fg: #8087A2| bg: | link: 

SnacksPickerPathHidden fg: | bg: | link: NonText
fg: #6E738D| bg: | link: 

SnacksPickerDirectory fg: | bg: | link: Directory
fg: #8AADF4| bg: | link: 

SnacksPickerLinkBroken fg: | bg: | link: DiagnosticError
fg: #ED8796| bg: | link: 

SnacksPickerLink fg: | bg: | link: Comment
fg: #939AB7| bg: | link: 

SnacksPickerTotals fg: | bg: | link: NonText
fg: #6E738D| bg: | link: 

SnacksPickerInputSearch fg: | bg: | link: @keyword
fg: | bg: | link: Keyword
fg: #C6A0F6| bg: | link: 

SnacksPickerMatch fg: | bg: | link: Special
fg: #F5BDE6| bg: | link: 

SnacksPickerIconCategory fg: | bg: | link: @module
fg: #B7BDF8| bg: | link: 

SnacksPickerIconName fg: | bg: | link: @keyword
fg: | bg: | link: Keyword
fg: #C6A0F6| bg: | link: 

SnacksPickerSpecial fg: | bg: | link: Special
fg: #F5BDE6| bg: | link: 

SnacksPickerPickWinCurrent fg: | bg: | link: CurSearch
fg: #1E2030| bg: #ED8796| link: 

SnacksPickerPickWin fg: | bg: | link: Search
fg: #CAD3F5| bg: #455C6D| link: 

SnacksPickerManSection fg: | bg: | link: Number
fg: #F5A97F| bg: | link: 

SnacksPickerGitStatusStaged fg: | bg: | link: DiagnosticHint
fg: #8BD5CA| bg: | link: 

SnacksPickerGitStatusUnmerged fg: | bg: | link: DiagnosticError
fg: #ED8796| bg: | link: 

SnacksPickerIcon fg: | bg: | link: Special
fg: #F5BDE6| bg: | link: 

SnacksPickerDir fg: | bg: | link: NonText
fg: #6E738D| bg: | link: 

SnacksPickerDesc fg: | bg: | link: Comment
fg: #939AB7| bg: | link: 

SnacksPickerIconEnumMember fg: | bg: | link: @lsp.type.enumMember
fg: | bg: | link: @constant
fg: | bg: | link: Constant
fg: #F5A97F| bg: | link: 

SnacksPickerCode fg: | bg: | link: @markup.raw.markdown_inline

SnacksPickerIconBoolean fg: | bg: | link: @boolean
fg: | bg: | link: Boolean
fg: #F5A97F| bg: | link: 

SnacksPickerIconTypeParameter fg: | bg: | link: @lsp.type.typeParameter
fg: | bg: | link: @type.definition
fg: | bg: | link: Type
fg: #EED49F| bg: | link: 

SnacksPickerIconVariable fg: | bg: | link: @variable
fg: #CAD3F5| bg: | link: 

SnacksPickerIconStruct fg: | bg: | link: @lsp.type.struct
fg: | bg: | link: @type
fg: | bg: | link: Type
fg: #EED49F| bg: | link: 

SnacksPickerIconString fg: | bg: | link: @string
fg: | bg: | link: String
fg: #A6DA95| bg: | link: 

SnacksPickerIconProperty fg: | bg: | link: @property
fg: #B7BDF8| bg: | link: 

SnacksPickerIconPackage fg: | bg: | link: @module
fg: #B7BDF8| bg: | link: 

SnacksPickerSearch fg: | bg: | link: Search
fg: #CAD3F5| bg: #455C6D| link: 

SnacksPickerIconObject fg: | bg: | link: @constant
fg: | bg: | link: Constant
fg: #F5A97F| bg: | link: 

SnacksPickerIconNumber fg: | bg: | link: @number
fg: | bg: | link: Number
fg: #F5A97F| bg: | link: 

SnacksPickerIconNull fg: | bg: | link: @constant.builtin
fg: #F5A97F| bg: | link: 

SnacksPickerIconNamespace fg: | bg: | link: @module
fg: #B7BDF8| bg: | link: 

SnacksPickerIconFunction fg: | bg: | link: @function
fg: | bg: | link: Function
fg: #8AADF4| bg: | link: 

SnacksPickerIconFile fg: | bg: | link: Normal
fg: #CAD3F5| bg: #24273A| link: 

SnacksPickerIconField fg: | bg: | link: @variable.member
fg: #B7BDF8| bg: | link: 

SnacksPickerIconEvent fg: | bg: | link: Special
fg: #F5BDE6| bg: | link: 

SnacksPickerIconEnum fg: | bg: | link: @lsp.type.enum
fg: | bg: | link: @type
fg: | bg: | link: Type
fg: #EED49F| bg: | link: 

SnacksPickerIconConstructor fg: | bg: | link: @constructor
fg: #7DC4E4| bg: | link: 

SnacksPickerIconConstant fg: | bg: | link: @constant
fg: | bg: | link: Constant
fg: #F5A97F| bg: | link: 

SnacksPickerIconClass fg: | bg: | link: @type
fg: | bg: | link: Type
fg: #EED49F| bg: | link: 

SnacksPickerBold fg: | bg: | link: Bold
fg: | bg: | link: 

SnacksPickerIconSource fg: | bg: | link: @constant
fg: | bg: | link: Constant
fg: #F5A97F| bg: | link: 

SnacksPickerPathIgnored fg: | bg: | link: NonText
fg: #6E738D| bg: | link: 

SnacksPickerCmd fg: | bg: | link: Function
fg: #8AADF4| bg: | link: 

SnacksPickerAuGroup fg: | bg: | link: Type
fg: #EED49F| bg: | link: 

SnacksPickerKeymapMode fg: | bg: | link: Number
fg: #F5A97F| bg: | link: 

SnacksPickerGitCommit fg: | bg: | link: @variable.builtin
fg: #ED8796| bg: | link: 

SnacksPickerIconOperator fg: | bg: | link: @operator
fg: | bg: | link: Operator
fg: #91D7E3| bg: | link: 

SnacksPickerGitStatusDeleted fg: | bg: | link: Removed
fg: #FFC0B9| bg: | link: 

SnacksPickerPrompt fg: | bg: | link: Special
fg: #F5BDE6| bg: | link: 

SnacksPickerGitStatusModified fg: | bg: | link: DiagnosticWarn
fg: #EED49F| bg: | link: 

SnacksPickerGitStatusAdded fg: | bg: | link: Added
fg: #B3F6C0| bg: | link: 

SnacksPickerGitStatus fg: | bg: | link: Special
fg: #F5BDE6| bg: | link: 

SnacksPickerGitScope fg: | bg: | link: Italic
fg: | bg: | link: 

SnacksPickerGitDetached fg: | bg: | link: DiagnosticWarn
fg: #EED49F| bg: | link: 

SnacksPickerGitStatusUntracked fg: | bg: | link: NonText
fg: #6E738D| bg: | link: 

SnacksPickerGitStatusIgnored fg: | bg: | link: NonText
fg: #6E738D| bg: | link: 

SnacksNormalNC fg: | bg: | link: NormalFloat
fg: #CAD3F5| bg: #1E2030| link: 

We'd have to define which should be modified, for example, if a highlight does not match what's expected. For example, the default picker highlights look like this:

I agree with @uroybd that it looks really bad. While we can work on updating the colors, we cannot update the layout, since it's out of the scope of the plugin.
I can try to find time to work in this. The idea would be to adapt the telescope highlights into the snacks.picker. Would that work @SebastianBalle? What are your thoughts on this?

[SebastianBalle]

@mikededo I believe adopting telescope highlights into the snacks.picker would be a good suggestion.

[SebastianBalle]

@mikededo any progress here? I liked you idea 👍