feat: Add skills feature for tool and chat calling (#351)

ChatView/qml/RootItem.qml

@@ -401,15 +401,31 @@ ChatRootView {
                     root.calculateMessageTokensCount(messageInput.text)
                     var cursorPos = messageInput.cursorPosition
                     var textBefore = messageInput.text.substring(0, cursorPos)
+
                     var atIndex = textBefore.lastIndexOf('@')
                     if (atIndex >= 0) {
                         var query = textBefore.substring(atIndex + 1)
                         if (query.indexOf(' ') === -1 && query.indexOf('\n') === -1) {
                             fileMentionPopup.updateSearch(query)
+                            skillCommandPopup.dismiss()
                             return
                         }
                     }
                     fileMentionPopup.dismiss()
+
+                    const slashIndex = textBefore.lastIndexOf('/')
+                    if (slashIndex >= 0) {
+                        const beforeSlash = slashIndex === 0
+                                            ? ' '
+                                            : textBefore.charAt(slashIndex - 1)
+                        const skillQuery = textBefore.substring(slashIndex + 1)
+                        if ((beforeSlash === ' ' || beforeSlash === '\n')
+                                && /^[a-z0-9-]*$/.test(skillQuery)) {
+                            skillCommandPopup.updateSearch(skillQuery)
+                            return
+                        }
+                    }
+                    skillCommandPopup.dismiss()
                 }
 
                 Keys.onPressed: function(event) {
@@ -427,6 +443,20 @@ ChatRootView {
                             fileMentionPopup.dismiss()
                             event.accepted = true
                         }
+                    } else if (skillCommandPopup.visible) {
+                        if (event.key === Qt.Key_Down) {
+                            skillCommandPopup.moveDown()
+                            event.accepted = true
+                        } else if (event.key === Qt.Key_Up) {
+                            skillCommandPopup.moveUp()
+                            event.accepted = true
+                        } else if (event.key === Qt.Key_Return || event.key === Qt.Key_Enter) {
+                            root.applySkillSelection()
+                            event.accepted = true
+                        } else if (event.key === Qt.Key_Escape) {
+                            skillCommandPopup.dismiss()
+                            event.accepted = true
+                        }
                     }
                 }
 
@@ -561,6 +591,23 @@ ChatRootView {
         }
     }
 
+    function applySkillSelection() {
+        const name = skillCommandPopup.currentName()
+        if (name === "")
+            return
+        const cursorPos = messageInput.cursorPosition
+        const textBefore = messageInput.text.substring(0, cursorPos)
+        const slashIndex = textBefore.lastIndexOf('/')
+        if (slashIndex < 0)
+            return
+        const before = messageInput.text.substring(0, slashIndex)
+        const after = messageInput.text.substring(cursorPos)
+        const token = '/' + name + ' '
+        messageInput.text = before + token + after
+        messageInput.cursorPosition = before.length + token.length
+        skillCommandPopup.dismiss()
+    }
+
     function sendChatMessage() {
         root.sendMessage(fileMentionPopup.expandMentions(messageInput.text))
         messageInput.text = ""
@@ -660,6 +707,20 @@ ChatRootView {
         }
     }
 
+    SkillCommandPopup {
+        id: skillCommandPopup
+
+        z: 999
+        width: Math.min(480, root.width - 20)
+
+        x: Math.max(5, Math.min(view.x + 5, root.width - width - 5))
+        y: view.y - height - 4
+
+        skillProvider: root
+
+        onSelectionRequested: root.applySkillSelection()
+    }
+
     Component.onCompleted: {
         focusInput()
     }

ChatView/qml/controls/SkillCommandPopup.qml

@@ -0,0 +1,125 @@
+// Copyright (C) 2026 Petr Mironychev
+// SPDX-License-Identifier: GPL-3.0-or-later
+
+import QtQuick
+import QtQuick.Controls
+import QtQuick.Layouts
+
+Rectangle {
+    id: root
+
+    // Object exposing Q_INVOKABLE QVariantList searchSkills(query).
+    property var skillProvider: null
+    property var searchResults: []
+    property int currentIndex: 0
+
+    signal selectionRequested()
+
+    visible: searchResults.length > 0
+    height: Math.min(searchResults.length * 40, 40 * 6) + 2
+
+    color: palette.window
+    border.color: palette.mid
+    border.width: 1
+    radius: 4
+
+    function updateSearch(query) {
+        searchResults = skillProvider ? skillProvider.searchSkills(query) : []
+        currentIndex = 0
+    }
+
+    function dismiss() {
+        searchResults = []
+        currentIndex = 0
+    }
+
+    function moveUp() {
+        if (currentIndex > 0)
+            currentIndex--
+    }
+
+    function moveDown() {
+        if (currentIndex < searchResults.length - 1)
+            currentIndex++
+    }
+
+    function currentName() {
+        if (currentIndex >= 0 && currentIndex < searchResults.length)
+            return searchResults[currentIndex].name
+        return ""
+    }
+
+    onCurrentIndexChanged: listView.positionViewAtIndex(currentIndex, ListView.Contain)
+
+    ListView {
+        id: listView
+
+        anchors.fill: parent
+        anchors.margins: 1
+        model: root.searchResults
+        currentIndex: root.currentIndex
+        clip: true
+
+        ScrollBar.vertical: ScrollBar {
+            policy: ScrollBar.AsNeeded
+        }
+
+        delegate: Rectangle {
+            id: delegateItem
+
+            required property int index
+            required property var modelData
+
+            width: listView.width
+            height: 40
+            color: index === root.currentIndex
+                   ? palette.highlight
+                   : (hoverArea.containsMouse
+                      ? Qt.rgba(palette.highlight.r, palette.highlight.g, palette.highlight.b, 0.25)
+                      : "transparent")
+
+            ColumnLayout {
+                anchors.fill: parent
+                anchors.leftMargin: 10
+                anchors.rightMargin: 10
+                anchors.topMargin: 4
+                anchors.bottomMargin: 4
+                spacing: 1
+
+                Text {
+                    Layout.fillWidth: true
+                    text: "/" + delegateItem.modelData.name
+                    color: delegateItem.index === root.currentIndex
+                           ? palette.highlightedText
+                           : palette.text
+                    font.bold: true
+                    elide: Text.ElideRight
+                }
+
+                Text {
+                    Layout.fillWidth: true
+                    text: delegateItem.modelData.description
+                    color: delegateItem.index === root.currentIndex
+                           ? Qt.rgba(palette.highlightedText.r,
+                                     palette.highlightedText.g,
+                                     palette.highlightedText.b, 0.7)
+                           : palette.mid
+                    font.pixelSize: 11
+                    elide: Text.ElideRight
+                }
+            }
+
+            MouseArea {
+                id: hoverArea
+
+                anchors.fill: parent
+                hoverEnabled: true
+                onClicked: {
+                    root.currentIndex = delegateItem.index
+                    root.selectionRequested()
+                }
+                onEntered: root.currentIndex = delegateItem.index
+            }
+        }
+    }
+}