@codingame/monaco-vscode-api 37.2.0 → 37.3.1

package/vscode/src/vs/workbench/contrib/chat/browser/aiCustomization/aiCustomizationListWidget.js

@@ -0,0 +1,2036 @@
+
+import { registerCss } from '../../../../../../../../css.js';
+import { __decorate, __param } from '../../../../../../../../external/tslib/tslib.es6.js';
+import * as aiCustomizationManagement from './media/aiCustomizationManagement.css';
+import { $ as $$1, append, createTextNode, addDisposableListener, getWindow, DisposableResizeObserver, EventType, getActiveElement, clearNode, scheduleAtNextAnimationFrame, addDisposableGenericMouseDownListener } from '../../../../../base/browser/dom.js';
+import { status } from '../../../../../base/browser/ui/aria/aria.js';
+import { ActionBar } from '../../../../../base/browser/ui/actionbar/actionbar.js';
+import { DisposableStore, Disposable, MutableDisposable } from '../../../../../base/common/lifecycle.js';
+import { Emitter } from '../../../../../base/common/event.js';
+import '../../../../../base/common/observableInternal/index.js';
+import { isEqual } from '../../../../../base/common/resources.js';
+import { ThemeIcon } from '../../../../../base/common/themables.js';
+import { URI } from '../../../../../base/common/uri.js';
+import { Codicon } from '../../../../../base/common/codicons.js';
+import { localize } from '../../../../../nls.js';
+import { IInstantiationService } from '../../../../../platform/instantiation/common/instantiation.js';
+import { WorkbenchList } from '../../../../../platform/list/browser/listService.js';
+import { NotSelectableGroupId } from '../../../../../base/browser/ui/list/list.js';
+import { PromptsStorage } from '../../common/promptSyntax/service/promptsService.js';
+import { IPromptsService } from '../../common/promptSyntax/service/promptsService.service.js';
+import { PromptsType } from '../../common/promptSyntax/promptTypes.js';
+import { promptIcon, hookIcon, instructionsIcon, skillIcon, agentIcon, workspaceIcon, userIcon, pluginIcon, extensionIcon, builtinIcon } from './aiCustomizationIcons.js';
+import { AI_CUSTOMIZATION_ITEM_TYPE_KEY, AI_CUSTOMIZATION_ITEM_URI_KEY, AI_CUSTOMIZATION_ITEM_DISABLED_KEY, AI_CUSTOMIZATION_ITEM_STORAGE_KEY, AI_CUSTOMIZATION_ITEM_PLUGIN_URI_KEY, getAICustomizationManagementItemMenuId, sectionToPromptType, AICustomizationManagementCreateMenuId } from './aiCustomizationManagement.js';
+import { IAgentPluginService } from '../../common/plugins/agentPluginService.service.js';
+import { InputBox } from '../../../../../base/browser/ui/inputbox/inputBox.js';
+import { defaultInputBoxStyles, defaultButtonStyles, getButtonStyles } from '../../../../../platform/theme/browser/defaultStyles.js';
+import { Delayer } from '../../../../../base/common/async.js';
+import { IContextViewService, IContextMenuService } from '../../../../../platform/contextview/browser/contextView.service.js';
+import { HighlightedLabel } from '../../../../../base/browser/ui/highlightedlabel/highlightedLabel.js';
+import { matchesContiguousSubString } from '../../../../../base/common/filters.js';
+import { IOpenerService } from '../../../../../platform/opener/common/opener.service.js';
+import { Button, ButtonWithDropdown } from '../../../../../base/browser/ui/button/button.js';
+import { MenuItemAction } from '../../../../../platform/actions/common/actions.js';
+import { IMenuService } from '../../../../../platform/actions/common/actions.service.js';
+import { IContextKeyService } from '../../../../../platform/contextkey/common/contextkey.service.js';
+import { createActionViewItem, getContextMenuActions } from '../../../../../platform/actions/browser/menuEntryActionViewItem.js';
+import { ILabelService } from '../../../../../platform/label/common/label.service.js';
+import { AICustomizationSources, AICustomizationManagementSection } from '../../common/aiCustomizationWorkspaceService.js';
+import { IAICustomizationWorkspaceService } from '../../common/aiCustomizationWorkspaceService.service.js';
+import { Action, Separator } from '../../../../../base/common/actions.js';
+import { IClipboardService } from '../../../../../platform/clipboard/common/clipboardService.service.js';
+import { IHoverService } from '../../../../../platform/hover/browser/hover.service.js';
+import { getDefaultHoverDelegate } from '../../../../../base/browser/ui/hover/hoverDelegateFactory.js';
+import { IFileService } from '../../../../../platform/files/common/files.service.js';
+import { hasReadableCustomizationContent } from '../../../../../platform/agentHost/common/agentHostCustomizationUri.js';
+import { generateCustomizationDebugReport } from './aiCustomizationDebugPanel.js';
+import { getCustomizationSecondaryText } from './aiCustomizationListWidgetUtils.js';
+export { truncateToFirstLine } from './aiCustomizationListWidgetUtils.js';
+import { ITelemetryService } from '../../../../../platform/telemetry/common/telemetry.service.js';
+import { ICustomizationHarnessService } from '../../common/customizationHarnessService.service.js';
+import { ICommandService } from '../../../../../platform/commands/common/commands.service.js';
+import { IAICustomizationItemsModel } from './aiCustomizationItemsModel.service.js';
+import { setupCollapsibleSection, renderVirtualizedSectionLoadingPlaceholder, layoutVirtualizedSections, getVirtualizedSectionMinimumHeight, layoutVirtualizedSectionList, createCustomizationCardPrimaryAction } from './customizationCardList.js';
+import { DomScrollableElement } from '../../../../../base/browser/ui/scrollbar/scrollableElement.js';
+import { ScrollbarVisibility } from '../../../../../base/common/scrollable.js';
+import { autorun } from '../../../../../base/common/observableInternal/reactions/autorun.js';
+
+registerCss(aiCustomizationManagement, 1);
+const $ = $$1;
+const ITEM_HEIGHT = 44;
+const GROUP_HEADER_HEIGHT = 36;
+const GROUP_HEADER_HEIGHT_WITH_SEPARATOR = 40;
+class AICustomizationListDelegate {
+    getHeight(element) {
+        if (element.type === "group-header") {
+            return element.isFirst ? GROUP_HEADER_HEIGHT : GROUP_HEADER_HEIGHT_WITH_SEPARATOR;
+        }
+        return ITEM_HEIGHT;
+    }
+    getTemplateId(element) {
+        return element.type === "group-header" ? "groupHeader" : "aiCustomizationItem";
+    }
+}
+class GroupHeaderRenderer {
+    constructor(hoverService) {
+        this.hoverService = hoverService;
+        this.templateId = "groupHeader";
+    }
+    renderTemplate(container) {
+        const disposables = ( new DisposableStore());
+        const elementDisposables = ( new DisposableStore());
+        container.classList.add("ai-customization-group-header");
+        const chevron = append(container, $(".group-chevron"));
+        const icon = append(container, $(".group-icon"));
+        const labelGroup = append(container, $(".group-label-group"));
+        const label = append(labelGroup, $(".group-label"));
+        const count = append(container, $(".group-count"));
+        const infoIcon = append(container, $(".group-info"));
+        infoIcon.classList.add(...ThemeIcon.asClassNameArray(Codicon.info));
+        return {
+            container,
+            chevron,
+            icon,
+            label,
+            count,
+            infoIcon,
+            disposables,
+            elementDisposables
+        };
+    }
+    renderElement(element, _index, templateData) {
+        templateData.elementDisposables.clear();
+        templateData.chevron.className = "group-chevron";
+        templateData.chevron.classList.add(...ThemeIcon.asClassNameArray(
+            element.collapsed ? Codicon.chevronRightCompact : Codicon.chevronDownCompact
+        ));
+        templateData.icon.className = "group-icon";
+        templateData.icon.classList.add(...ThemeIcon.asClassNameArray(element.icon));
+        templateData.label.textContent = element.label;
+        templateData.count.textContent = `${element.count}`;
+        templateData.elementDisposables.add(this.hoverService.setupDelayedHover(templateData.infoIcon, () => ({
+            content: element.description,
+            appearance: {
+                compact: true,
+                skipFadeInAnimation: true
+            }
+        })));
+        templateData.container.classList.toggle("collapsed", element.collapsed);
+        templateData.container.classList.toggle("has-previous-group", !element.isFirst);
+    }
+    disposeTemplate(templateData) {
+        templateData.elementDisposables.dispose();
+        templateData.disposables.dispose();
+    }
+}
+function promptTypeToIcon(type) {
+    switch (type) {
+    case PromptsType.agent:
+        return agentIcon;
+    case PromptsType.skill:
+        return skillIcon;
+    case PromptsType.instructions:
+        return instructionsIcon;
+    case PromptsType.prompt:
+        return promptIcon;
+    case PromptsType.hook:
+        return hookIcon;
+    default:
+        return promptIcon;
+    }
+}
+function formatDisplayName(name) {
+    return name.replace(/\.md$/i, "");
+}
+let AICustomizationItemRenderer = class AICustomizationItemRenderer {
+    constructor(
+        showItemActions,
+        hoverService,
+        labelService,
+        menuService,
+        contextKeyService,
+        instantiationService,
+        agentPluginService
+    ) {
+        this.showItemActions = showItemActions;
+        this.hoverService = hoverService;
+        this.labelService = labelService;
+        this.menuService = menuService;
+        this.contextKeyService = contextKeyService;
+        this.instantiationService = instantiationService;
+        this.agentPluginService = agentPluginService;
+        this.templateId = "aiCustomizationItem";
+        this.templates = ( new Set());
+        this.focusedIndex = -1;
+    }
+    setFocusedIndex(index) {
+        this.focusedIndex = index;
+        for (const template of this.templates) {
+            template.actionBar.setFocusable(index !== -1 && template.currentIndex === index);
+        }
+    }
+    renderTemplate(container) {
+        const disposables = ( new DisposableStore());
+        const elementDisposables = ( new DisposableStore());
+        container.classList.add("ai-customization-list-item");
+        const leftSection = append(container, $(".item-left"));
+        const typeIcon = append(leftSection, $(".item-type-icon"));
+        const textContainer = append(leftSection, $(".item-text"));
+        const nameRow = append(textContainer, $(".item-name-row"));
+        const nameLabel = disposables.add(( new HighlightedLabel(append(nameRow, $(".item-name")))));
+        const badge = append(nameRow, $(".inline-badge.item-badge"));
+        const statusIcon = append(nameRow, $(".item-status-icon"));
+        const description = disposables.add(( new HighlightedLabel(append(textContainer, $(".item-description")))));
+        const actionsContainer = append(container, $(".item-right"));
+        const actionBar = disposables.add(( new ActionBar(actionsContainer, {
+            actionViewItemProvider: createActionViewItem.bind(undefined, this.instantiationService)
+        })));
+        actionBar.setFocusable(false);
+        const template = {
+            container,
+            actionsContainer,
+            actionBar,
+            typeIcon,
+            nameLabel,
+            badge,
+            statusIcon,
+            description,
+            disposables,
+            elementDisposables,
+            currentIndex: -1
+        };
+        this.templates.add(template);
+        return template;
+    }
+    renderElement(entry, index, templateData) {
+        templateData.elementDisposables.clear();
+        templateData.currentIndex = index;
+        templateData.actionBar.setFocusable(this.focusedIndex !== -1 && index === this.focusedIndex);
+        const element = entry.item;
+        templateData.typeIcon.className = "item-type-icon";
+        templateData.typeIcon.classList.add(
+            ...ThemeIcon.asClassNameArray(element.typeIcon ?? promptTypeToIcon(element.promptType))
+        );
+        templateData.elementDisposables.add(this.hoverService.setupDelayedHover(templateData.container, () => {
+            let content;
+            if (element.isBuiltin) {
+                content = `${element.name}\n${( localize(8356, "Built-in"))}`;
+            } else if (element.extensionId) {
+                content = `${element.name}\n${( localize(8357, "Extension: {0}", element.extensionId))}`;
+            } else {
+                const isWorkspaceItem = element.source === AICustomizationSources.local;
+                const uriLabel = this.labelService.getUriLabel(element.uri, {
+                    relative: isWorkspaceItem
+                });
+                content = `${element.name}\n${uriLabel}`;
+            }
+            if (element.badgeTooltip) {
+                content += `\n\n${element.badgeTooltip}`;
+            }
+            const plugin = element.pluginUri && this.agentPluginService.plugins.get().find(p => isEqual(p.uri, element.pluginUri));
+            if (plugin) {
+                content += `\n${( localize(8358, "Plugin: {0}", plugin.label))}`;
+            }
+            return {
+                content,
+                appearance: {
+                    compact: true,
+                    skipFadeInAnimation: true
+                }
+            };
+        }));
+        templateData.container.classList.toggle("disabled", element.disabled);
+        const displayName = element.displayName ?? formatDisplayName(element.name);
+        templateData.nameLabel.set(displayName, element.nameMatches);
+        if (element.badge && element.promptType !== PromptsType.instructions) {
+            templateData.badge.textContent = element.badge;
+            templateData.badge.style.display = "";
+            if (element.badgeTooltip) {
+                templateData.elementDisposables.add(
+                    this.hoverService.setupManagedHover(getDefaultHoverDelegate("mouse"), templateData.badge, element.badgeTooltip)
+                );
+            }
+        } else {
+            templateData.badge.textContent = "";
+            templateData.badge.style.display = "none";
+        }
+        const hideLoadedStatus = element.status === "loaded" && (element.promptType === PromptsType.agent || element.promptType === PromptsType.skill || element.promptType === PromptsType.instructions);
+        if (element.status && !hideLoadedStatus) {
+            templateData.statusIcon.style.display = "";
+            templateData.statusIcon.className = "item-status-icon";
+            switch (element.status) {
+            case "loading":
+                templateData.statusIcon.classList.add(...ThemeIcon.asClassNameArray(Codicon.loading), "codicon-modifier-spin");
+                break;
+            case "loaded":
+                templateData.statusIcon.classList.add(...ThemeIcon.asClassNameArray(Codicon.check));
+                break;
+            case "degraded":
+                templateData.statusIcon.classList.add(...ThemeIcon.asClassNameArray(Codicon.warning));
+                break;
+            case "error":
+                templateData.statusIcon.classList.add(...ThemeIcon.asClassNameArray(Codicon.error));
+                break;
+            }
+            if (element.statusMessage) {
+                templateData.elementDisposables.add(this.hoverService.setupManagedHover(
+                    getDefaultHoverDelegate("mouse"),
+                    templateData.statusIcon,
+                    element.statusMessage
+                ));
+            }
+        } else {
+            templateData.statusIcon.style.display = "none";
+            templateData.statusIcon.className = "item-status-icon";
+        }
+        const secondaryText = getCustomizationSecondaryText(element.description, element.filename, element.promptType);
+        let secondaryTextMatches;
+        if (secondaryText && element.description && element.descriptionMatches) {
+            if (secondaryText === element.description) {
+                secondaryTextMatches = element.descriptionMatches;
+            } else {
+                const maxLength = secondaryText.length;
+                const clampedMatches = element.descriptionMatches.map(match => {
+                    if (match.start >= maxLength || match.end <= 0) {
+                        return undefined;
+                    }
+                    const clampedStart = Math.max(0, match.start);
+                    const clampedEnd = Math.min(match.end, maxLength);
+                    return clampedEnd > clampedStart ? {
+                        start: clampedStart,
+                        end: clampedEnd
+                    } : undefined;
+                }).filter(match => !!match);
+                secondaryTextMatches = clampedMatches.length ? clampedMatches : undefined;
+            }
+        }
+        if (secondaryText) {
+            templateData.description.set(secondaryText, secondaryTextMatches);
+            templateData.description.element.style.display = "";
+            templateData.description.element.classList.toggle("is-filename", !element.description);
+        } else {
+            templateData.description.set("", undefined);
+            templateData.description.element.style.display = "none";
+        }
+        const context = {
+            uri: ( element.uri.toString()),
+            name: element.name,
+            promptType: element.promptType,
+            source: element.source,
+            pluginUri: element.pluginUri?.toString(),
+            itemId: element.id
+        };
+        const overlayPairs = [
+            [AI_CUSTOMIZATION_ITEM_TYPE_KEY, element.promptType],
+            [AI_CUSTOMIZATION_ITEM_URI_KEY, ( element.uri.toString())],
+            [AI_CUSTOMIZATION_ITEM_DISABLED_KEY, element.disabled]
+        ];
+        if (element.source) {
+            overlayPairs.push([AI_CUSTOMIZATION_ITEM_STORAGE_KEY, element.source]);
+        }
+        if (element.pluginUri) {
+            overlayPairs.push([AI_CUSTOMIZATION_ITEM_PLUGIN_URI_KEY, ( element.pluginUri.toString())]);
+        }
+        const overlay = this.contextKeyService.createOverlay(overlayPairs);
+        const menu = templateData.elementDisposables.add(
+            this.menuService.createMenu(getAICustomizationManagementItemMenuId(element.uri), overlay)
+        );
+        const updateActions = () => {
+            templateData.actionBar.clear();
+            if (element.promptType === PromptsType.agent || element.promptType === PromptsType.skill || element.promptType === PromptsType.instructions) {
+                const moreAction = templateData.elementDisposables.add(( new Action("aiCustomization.moreActions", ( localize(8359, "More actions for {0}", displayName)), ThemeIcon.asClassName(Codicon.ellipsis), true, () => this.showItemActions(element, templateData.actionsContainer))));
+                templateData.actionBar.push(moreAction, {
+                    icon: true,
+                    label: false
+                });
+            } else {
+                const actions = menu.getActions({
+                    arg: context,
+                    shouldForwardArgs: true
+                });
+                const {
+                    primary
+                } = getContextMenuActions(actions, "inline");
+                templateData.actionBar.push(primary, {
+                    icon: true,
+                    label: false
+                });
+            }
+        };
+        updateActions();
+        templateData.elementDisposables.add(menu.onDidChange(updateActions));
+        templateData.actionBar.context = context;
+    }
+    disposeElement(_entry, _index, templateData) {
+        templateData.currentIndex = -1;
+    }
+    disposeTemplate(templateData) {
+        this.templates.delete(templateData);
+        templateData.elementDisposables.dispose();
+        templateData.disposables.dispose();
+    }
+};
+AICustomizationItemRenderer = ( __decorate([( __param(1, IHoverService)), ( __param(2, ILabelService)), ( __param(3, IMenuService)), ( __param(4, IContextKeyService)), ( __param(5, IInstantiationService)), ( __param(6, IAgentPluginService))], AICustomizationItemRenderer));
+function toItemsModelSection(section) {
+    switch (section) {
+    case AICustomizationManagementSection.Agents:
+    case AICustomizationManagementSection.Skills:
+    case AICustomizationManagementSection.Instructions:
+    case AICustomizationManagementSection.Prompts:
+    case AICustomizationManagementSection.Hooks:
+        return section;
+    default:
+        return undefined;
+    }
+}
+function usesCustomizationCardLayout(section) {
+    return section === AICustomizationManagementSection.Agents || section === AICustomizationManagementSection.Skills || section === AICustomizationManagementSection.Instructions || section === AICustomizationManagementSection.Hooks || section === AICustomizationManagementSection.Prompts;
+}
+function getAlwaysVisibleCustomizationGroupKeys(section, isFiltering) {
+    return usesCustomizationCardLayout(section) && !isFiltering ? [PromptsStorage.local, PromptsStorage.user] : [];
+}
+function getTargetedCreateActionLabel(label, compactLabel) {
+    return compactLabel ?? label.replace(/^\$\([^)]+\)\s*/, "");
+}
+function getCountAnnouncement(section, count, isFiltering) {
+    switch (section) {
+    case AICustomizationManagementSection.Agents:
+        if (isFiltering) {
+            if (count === 0) {
+                return localize(8360, "No agents found");
+            }
+            if (count === 1) {
+                return localize(8361, "1 agent found");
+            }
+            return localize(8362, "{0} agents found", count);
+        }
+        if (count === 0) {
+            return localize(8363, "No agents");
+        }
+        if (count === 1) {
+            return localize(8364, "1 agent");
+        }
+        return localize(8365, "{0} agents", count);
+    case AICustomizationManagementSection.Skills:
+        if (isFiltering) {
+            if (count === 0) {
+                return localize(8366, "No skills found");
+            }
+            if (count === 1) {
+                return localize(8367, "1 skill found");
+            }
+            return localize(8368, "{0} skills found", count);
+        }
+        if (count === 0) {
+            return localize(8369, "No skills");
+        }
+        if (count === 1) {
+            return localize(8370, "1 skill");
+        }
+        return localize(8371, "{0} skills", count);
+    case AICustomizationManagementSection.Instructions:
+        if (isFiltering) {
+            if (count === 0) {
+                return localize(8372, "No instructions found");
+            }
+            if (count === 1) {
+                return localize(8373, "1 instruction file found");
+            }
+            return localize(8374, "{0} instruction files found", count);
+        }
+        if (count === 0) {
+            return localize(8375, "No instructions");
+        }
+        if (count === 1) {
+            return localize(8376, "1 instruction file");
+        }
+        return localize(8377, "{0} instruction files", count);
+    case AICustomizationManagementSection.Hooks:
+        if (isFiltering) {
+            if (count === 0) {
+                return localize(8378, "No hooks found");
+            }
+            if (count === 1) {
+                return localize(8379, "1 hook found");
+            }
+            return localize(8380, "{0} hooks found", count);
+        }
+        if (count === 0) {
+            return localize(8381, "No hooks");
+        }
+        if (count === 1) {
+            return localize(8382, "1 hook");
+        }
+        return localize(8383, "{0} hooks", count);
+    case AICustomizationManagementSection.Prompts:
+    default:
+        if (isFiltering) {
+            if (count === 0) {
+                return localize(8384, "No prompts found");
+            }
+            if (count === 1) {
+                return localize(8385, "1 prompt found");
+            }
+            return localize(8386, "{0} prompts found", count);
+        }
+        if (count === 0) {
+            return localize(8387, "No prompts");
+        }
+        if (count === 1) {
+            return localize(8388, "1 prompt");
+        }
+        return localize(8389, "{0} prompts", count);
+    }
+}
+function getCollapsedCustomizationGroupKey(section, groupKey) {
+    return `${section}:${groupKey}`;
+}
+function getCustomizationItemStatusLabel(item) {
+    switch (item.status) {
+    case "loading":
+        return localize(8390, "Loading");
+    case "loaded":
+        return localize(8391, "Loaded");
+    case "degraded":
+        return localize(8392, "Needs attention");
+    case "error":
+        return localize(8393, "Error");
+    default:
+        return undefined;
+    }
+}
+function getCustomizationItemAriaLabel(item) {
+    const displayName = item.displayName ?? formatDisplayName(item.name);
+    const secondaryText = getCustomizationSecondaryText(item.description, item.filename, item.promptType);
+    const statusLabel = getCustomizationItemStatusLabel(item);
+    const accessibleSecondaryText = [secondaryText, statusLabel, item.statusMessage].filter(Boolean).join(". ");
+    const nameAndDescription = accessibleSecondaryText ? ( localize(8394, "{0}. {1}", displayName, accessibleSecondaryText)) : displayName;
+    return item.disabled ? ( localize(8395, "{0}, disabled", nameAndDescription)) : nameAndDescription;
+}
+let AICustomizationListWidget = class AICustomizationListWidget extends Disposable {
+    constructor(
+        instantiationService,
+        promptsService,
+        contextViewService,
+        openerService,
+        contextMenuService,
+        menuService,
+        contextKeyService,
+        labelService,
+        workspaceService,
+        clipboardService,
+        hoverService,
+        fileService,
+        telemetryService,
+        harnessService,
+        commandService,
+        itemsModel,
+        agentPluginService
+    ) {
+        super();
+        this.instantiationService = instantiationService;
+        this.promptsService = promptsService;
+        this.contextViewService = contextViewService;
+        this.openerService = openerService;
+        this.contextMenuService = contextMenuService;
+        this.menuService = menuService;
+        this.contextKeyService = contextKeyService;
+        this.labelService = labelService;
+        this.workspaceService = workspaceService;
+        this.clipboardService = clipboardService;
+        this.hoverService = hoverService;
+        this.fileService = fileService;
+        this.telemetryService = telemetryService;
+        this.harnessService = harnessService;
+        this.commandService = commandService;
+        this.itemsModel = itemsModel;
+        this.agentPluginService = agentPluginService;
+        this.cardSectionLists = [];
+        this.cardRowsByUri = ( new Map());
+        this.cardRowsById = ( new Map());
+        this.cardMenuButtonsById = ( new Map());
+        this.cardMenuOpen = false;
+        this.currentSection = AICustomizationManagementSection.Agents;
+        this.allItems = [];
+        this.displayEntries = [];
+        this.searchQuery = "";
+        this.sectionLoading = false;
+        this.collapsedGroups = ( new Set());
+        this._layoutDeferred = false;
+        this.revealLastItemScheduler = this._register(( new MutableDisposable()));
+        this.lastLayoutWidth = 0;
+        this.lastLayoutHeight = 0;
+        this.lastHeaderHeight = 0;
+        this.dropdownActionDisposables = this._register(( new DisposableStore()));
+        this.cardDisposables = this._register(( new DisposableStore()));
+        this.pendingCardSectionLayout = this._register(( new MutableDisposable()));
+        this.cardSectionScrollPositions = ( new Map());
+        this._sectionLoadId = 0;
+        this.delayedFilter = ( new Delayer(200));
+        this.currentSectionSubscription = this._register(( new MutableDisposable()));
+        this._onDidSelectItem = this._register(( new Emitter()));
+        this.onDidSelectItem = this._onDidSelectItem.event;
+        this._onDidChangeItemCount = this._register(( new Emitter()));
+        this.onDidChangeItemCount = this._onDidChangeItemCount.event;
+        this._onDidRequestCreate = this._register(( new Emitter()));
+        this.onDidRequestCreate = this._onDidRequestCreate.event;
+        this._onDidRequestCreateManual = this._register(( new Emitter()));
+        this.onDidRequestCreateManual = this._onDidRequestCreateManual.event;
+        this.element = $(".ai-customization-list-widget.plugin-list-widget");
+        this.create();
+        this._register(autorun(reader => {
+            this.workspaceService.activeProjectRoot.read(reader);
+            this.updateAddButton();
+        }));
+        this._register(autorun(reader => {
+            this.harnessService.activeHarness.read(reader);
+            this.harnessService.availableHarnesses.read(reader);
+            this.updateAddButton();
+        }));
+    }
+    create() {
+        this.sectionTitleHeader = append(this.element, $(".section-title-header"));
+        const titleRow = append(this.sectionTitleHeader, $(".section-title-row"));
+        this.sectionTitle = append(titleRow, $("h2.section-title"));
+        this.sectionTitleDescription = append(this.sectionTitleHeader, $("p.section-title-description"));
+        this.sectionTitleDescriptionText = append(this.sectionTitleDescription, $("span.section-title-description-text"));
+        this.sectionTitleDescription.appendChild(createTextNode(" "));
+        this.sectionLink = append(this.sectionTitleDescription, $("a.section-title-link"));
+        this._register(addDisposableListener(this.sectionLink, "click", e => {
+            e.preventDefault();
+            const href = this.sectionLink.href;
+            if (href) {
+                this.openerService.open(( URI.parse(href)));
+            }
+        }));
+        const targetWindow = getWindow(this.element);
+        const headerObserver = this._register(
+            new DisposableResizeObserver("AICustomizationListWidget.sectionTitleHeader", () => {
+                if (this.lastLayoutWidth <= 0 || this.lastLayoutHeight <= 0) {
+                    return;
+                }
+                const headerHeight = this.sectionTitleHeader.offsetHeight;
+                if (headerHeight === this.lastHeaderHeight) {
+                    return;
+                }
+                this.layout(this.lastLayoutHeight, this.lastLayoutWidth);
+            }, targetWindow)
+        );
+        this._register(headerObserver.observe(this.sectionTitleHeader));
+        this.searchAndButtonContainer = append(this.element, $(".list-search-and-button-container"));
+        this.searchContainer = append(this.searchAndButtonContainer, $(".list-search-container"));
+        this.searchInput = this._register(( new InputBox(this.searchContainer, this.contextViewService, {
+            placeholder: ( localize(8396, "Type to search...")),
+            inputBoxStyles: defaultInputBoxStyles
+        })));
+        this._register(this.searchInput.onDidChange(() => {
+            this.searchQuery = this.searchInput.value;
+            this.delayedFilter.trigger(() => {
+                const matchCount = this.filterItems();
+                this.announceItemCount(matchCount);
+                if (this.searchQuery.trim()) {
+                    this.telemetryService.publicLog2("chatCustomizationEditor.search", {
+                        section: this.currentSection,
+                        resultCount: matchCount
+                    });
+                }
+            });
+        }));
+        this.addButtonContainer = append(this.searchAndButtonContainer, $(".list-add-button-container"));
+        this.addButtonSimple = this._register(( new Button(this.addButtonContainer, {
+            ...defaultButtonStyles
+        })));
+        this.addButtonSimple.element.classList.add("list-add-button");
+        this._register(this.addButtonSimple.onDidClick(() => this.executePrimaryCreateAction()));
+        this.addButton = this._register(( new ButtonWithDropdown(this.addButtonContainer, {
+            ...defaultButtonStyles,
+            contextMenuProvider: this.contextMenuService,
+            addPrimaryActionToDropdown: false,
+            actions: {
+                getActions: () => this.getDropdownActions()
+            }
+        })));
+        this.addButton.element.classList.add("list-add-button");
+        this._register(this.addButton.onDidClick(() => this.executePrimaryCreateAction()));
+        this.cardContainer = append(this.element, $(".plugin-card-container.customization-card-container"));
+        this.cardScrollable = this._register(( new DomScrollableElement(this.cardContainer, {
+            horizontal: ScrollbarVisibility.Hidden,
+            vertical: ScrollbarVisibility.Auto,
+            useShadows: false
+        })));
+        this._register(
+            addDisposableListener(this.cardContainer, EventType.SCROLL, () => {
+                this.cardScrollable.setScrollPosition({
+                    scrollTop: this.cardContainer.scrollTop
+                });
+            })
+        );
+        this.cardScrollableNode = this.cardScrollable.getDomNode();
+        this.cardScrollableNode.classList.add("plugin-card-scrollable");
+        this.cardScrollableNode.style.display = "none";
+        this.element.appendChild(this.cardScrollableNode);
+        const cardResizeObserver = this._register(new DisposableResizeObserver(
+            "AICustomizationListWidget.cardScrollable",
+            () => this.scheduleCardSectionLayout()
+        ));
+        this._register(cardResizeObserver.observe(this.cardScrollableNode));
+        this.listContainer = append(this.element, $(".list-container"));
+        this.emptyStateContainer = append(this.element, $(".list-empty-state"));
+        const emptyStateHeader = append(this.emptyStateContainer, $(".empty-state-header"));
+        this.emptyStateText = append(emptyStateHeader, $(".empty-state-text"));
+        this.emptyStateSubtext = append(this.emptyStateContainer, $(".empty-state-subtext"));
+        this.emptyStateContainer.style.display = "none";
+        const itemRenderer = this.instantiationService.createInstance(
+            AICustomizationItemRenderer,
+            (item, anchor) => this.showCardItemActions(item, anchor)
+        );
+        this.list = this._register(this.instantiationService.createInstance(
+            WorkbenchList,
+            "AICustomizationManagementList",
+            this.listContainer,
+            ( new AICustomizationListDelegate()),
+            [( new GroupHeaderRenderer(this.hoverService)), itemRenderer],
+            {
+                identityProvider: {
+                    getId: entry => entry.type === "group-header" ? entry.id : entry.item.id,
+                    getGroupId: entry => entry.type === "group-header" ? NotSelectableGroupId : 0
+                },
+                accessibilityProvider: {
+                    getAriaLabel: entry => {
+                        if (entry.type === "group-header") {
+                            return localize(
+                                8397,
+                                "{0}, {1} items, {2}",
+                                entry.label,
+                                entry.count,
+                                entry.collapsed ? ( localize(8398, "collapsed")) : ( localize(8399, "expanded"))
+                            );
+                        }
+                        const label = getCustomizationItemAriaLabel(entry.item);
+                        if (!hasReadableCustomizationContent(entry.item.uri)) {
+                            return localize(8400, "{0}, source content unavailable", label);
+                        }
+                        return label;
+                    },
+                    getWidgetAriaLabel: () => ( localize(8401, "Agent Customizations"))
+                },
+                keyboardNavigationLabelProvider: {
+                    getKeyboardNavigationLabel: entry => entry.type === "group-header" ? entry.label : entry.item.name
+                },
+                multipleSelectionSupport: false,
+                openOnSingleClick: true
+            }
+        ));
+        this._register(this.list.onDidOpen(e => {
+            if (e.element) {
+                if (e.element.type === "group-header") {
+                    this.toggleGroup(e.element);
+                } else {
+                    if (hasReadableCustomizationContent(e.element.item.uri)) {
+                        this._onDidSelectItem.fire(e.element.item);
+                    }
+                }
+            }
+        }));
+        this._register(this.list.onDidChangeFocus(e => {
+            itemRenderer.setFocusedIndex(e.indexes.length ? e.indexes[0] : -1);
+        }));
+        this._register(this.list.onDidFocus(() => {
+            if (this.list.getFocus().length === 0 && this.displayEntries.length > 0) {
+                const firstItemIndex = this.displayEntries.findIndex(e => e.type !== "group-header");
+                if (firstItemIndex >= 0) {
+                    this.list.setFocus([firstItemIndex]);
+                }
+            }
+        }));
+        this._register(this.list.onContextMenu(e => {
+            if (!this.usesCardLayout()) {
+                this.onContextMenu(e);
+            }
+        }));
+        this._register(this.fileService.onDidFilesChange(e => {
+            if (e.gotDeleted()) {
+                this.refresh();
+            }
+        }));
+        this.updateSectionHeader();
+        this.updateAddButton();
+    }
+    onContextMenu(e) {
+        if (!e.element || e.element.type !== "file-item") {
+            return;
+        }
+        const item = e.element.item;
+        const context = {
+            uri: ( item.uri.toString()),
+            name: item.name,
+            promptType: item.promptType,
+            source: item.source,
+            pluginUri: item.pluginUri?.toString(),
+            itemId: item.id
+        };
+        const overlayPairs = [
+            [AI_CUSTOMIZATION_ITEM_TYPE_KEY, item.promptType],
+            [AI_CUSTOMIZATION_ITEM_URI_KEY, ( item.uri.toString())],
+            [AI_CUSTOMIZATION_ITEM_DISABLED_KEY, item.disabled]
+        ];
+        if (item.source) {
+            overlayPairs.push([AI_CUSTOMIZATION_ITEM_STORAGE_KEY, item.source]);
+        }
+        if (item.pluginUri) {
+            overlayPairs.push([AI_CUSTOMIZATION_ITEM_PLUGIN_URI_KEY, ( item.pluginUri.toString())]);
+        }
+        const overlay = this.contextKeyService.createOverlay(overlayPairs);
+        const actions = this.menuService.getMenuActions(getAICustomizationManagementItemMenuId(item.uri), overlay, {
+            arg: context,
+            shouldForwardArgs: true
+        });
+        const {
+            secondary
+        } = getContextMenuActions(actions, "inline");
+        const copyActions = item.isBuiltin || !hasReadableCustomizationContent(item.uri) ? [] : [( new Separator()), ( new Action("copyFullPath", ( localize(8402, "Copy Full Path")), undefined, true, async () => {
+            await this.clipboardService.writeText(item.uri.fsPath);
+        })), ( new Action("copyRelativePath", ( localize(8403, "Copy Relative Path")), undefined, true, async () => {
+            const basePath = this.workspaceService.getActiveProjectRoot();
+            if (basePath && item.uri.fsPath.startsWith(basePath.fsPath)) {
+                const relative = item.uri.fsPath.substring(basePath.fsPath.length + 1);
+                await this.clipboardService.writeText(relative);
+            } else {
+                const relativePath = this.labelService.getUriLabel(item.uri, {
+                    relative: true
+                });
+                await this.clipboardService.writeText(relativePath);
+            }
+        }))];
+        this.contextMenuService.showContextMenu({
+            getAnchor: () => e.anchor,
+            getActions: () => [...secondary, ...copyActions]
+        });
+    }
+    showCardItemActions(item, anchor) {
+        this.cardMenuOpen = true;
+        this.lastCardFocusItemId = item.id;
+        const disposables = ( new DisposableStore());
+        const context = {
+            uri: ( item.uri.toString()),
+            name: item.name,
+            promptType: item.promptType,
+            source: item.source,
+            pluginUri: item.pluginUri?.toString(),
+            itemId: item.id
+        };
+        const menu = disposables.add(this.createCardItemMenu(item));
+        const groups = menu.getActions({
+            arg: context,
+            shouldForwardArgs: true
+        });
+        const actions = [];
+        const addedActionIds = ( new Set());
+        for (const [, groupActions] of groups) {
+            const uniqueGroupActions = groupActions.filter(action => {
+                if (( addedActionIds.has(action.id))) {
+                    return false;
+                }
+                addedActionIds.add(action.id);
+                return true;
+            });
+            if (uniqueGroupActions.length === 0) {
+                continue;
+            }
+            if (actions.length > 0) {
+                actions.push(( new Separator()));
+            }
+            actions.push(...uniqueGroupActions);
+        }
+        if (!item.isBuiltin && hasReadableCustomizationContent(item.uri)) {
+            if (actions.length > 0) {
+                actions.push(( new Separator()));
+            }
+            actions.push(disposables.add(( new Action("copyRelativePath", ( localize(8403, "Copy Relative Path")), undefined, true, async () => {
+                const basePath = this.workspaceService.getActiveProjectRoot();
+                const relativePath = basePath && item.uri.fsPath.startsWith(basePath.fsPath) ? item.uri.fsPath.substring(basePath.fsPath.length + 1) : this.labelService.getUriLabel(item.uri, {
+                    relative: true
+                });
+                await this.clipboardService.writeText(relativePath);
+            }))));
+        }
+        if (actions.length === 0) {
+            this.cardMenuOpen = false;
+            disposables.dispose();
+            return;
+        }
+        this.contextMenuService.showContextMenu({
+            getAnchor: () => anchor,
+            getActions: () => actions,
+            onHide: () => {
+                this.cardMenuOpen = false;
+                if (!this.focusCardSectionItem(item.id)) {
+                    (this.cardMenuButtonsById.get(item.id) ?? this.cardRowsById.get(item.id) ?? this.firstCardFocusElement)?.focus();
+                }
+                disposables.dispose();
+            }
+        });
+    }
+    createCardItemMenu(item) {
+        const overlayPairs = [
+            [AI_CUSTOMIZATION_ITEM_TYPE_KEY, item.promptType],
+            [AI_CUSTOMIZATION_ITEM_URI_KEY, ( item.uri.toString())],
+            [AI_CUSTOMIZATION_ITEM_DISABLED_KEY, item.disabled],
+            [AI_CUSTOMIZATION_ITEM_STORAGE_KEY, item.source]
+        ];
+        if (item.pluginUri) {
+            overlayPairs.push([AI_CUSTOMIZATION_ITEM_PLUGIN_URI_KEY, ( item.pluginUri.toString())]);
+        }
+        const overlay = this.contextKeyService.createOverlay(overlayPairs);
+        return this.menuService.createMenu(getAICustomizationManagementItemMenuId(item.uri), overlay);
+    }
+    hasCardItemActions(item) {
+        if (hasReadableCustomizationContent(item.uri)) {
+            return true;
+        }
+        const menu = this.createCardItemMenu(item);
+        try {
+            return ( menu.getActions().some(([, actions]) => actions.length > 0));
+        } finally {
+            menu.dispose();
+        }
+    }
+    async setSection(section) {
+        const loadId = ++this._sectionLoadId;
+        this.currentSection = section;
+        this.element.classList.toggle("plugin-list-widget", this.usesCardLayout());
+        this.updateSectionHeader();
+        const modelSection = toItemsModelSection(section);
+        if (!modelSection) {
+            this.sectionLoading = false;
+            this.currentSectionSubscription.clear();
+            this.allItems = [];
+            const matchCount = this.filterItems();
+            this._onDidChangeItemCount.fire(0);
+            this.updateAddButton();
+            this.announceItemCount(matchCount);
+            return;
+        }
+        const observable = this.itemsModel.getItems(modelSection);
+        this.sectionLoading = true;
+        this.currentSectionSubscription.value = autorun(reader => {
+            const items = observable.read(reader);
+            this.allItems = items;
+            this.filterItems();
+            this._onDidChangeItemCount.fire(items.length);
+        });
+        this.updateAddButton();
+        await this.itemsModel.whenSectionLoaded(modelSection);
+        if (loadId === this._sectionLoadId) {
+            this.sectionLoading = false;
+            this.filterItems();
+            this.announceItemCount(this.applySearchFilter(this.allItems).length);
+        }
+    }
+    updateSectionHeader() {
+        let title;
+        let description;
+        let docsUrl;
+        let learnMoreLabel;
+        switch (this.currentSection) {
+        case AICustomizationManagementSection.Agents:
+            title = ( localize(8404, "Agents"));
+            description = ( localize(
+                8405,
+                "Configure the AI to adopt different personas tailored to specific development tasks. Each agent has its own instructions, tools, and behavior."
+            ));
+            docsUrl = "https://code.visualstudio.com/docs/agent-customization/custom-agents?referrer=in-product";
+            learnMoreLabel = ( localize(8406, "Learn more about custom agents"));
+            break;
+        case AICustomizationManagementSection.Skills:
+            title = ( localize(8407, "Skills"));
+            description = ( localize(
+                8408,
+                "Folders of instructions, scripts, and resources that Copilot loads when relevant to perform specialized tasks."
+            ));
+            docsUrl = "https://code.visualstudio.com/docs/agent-customization/agent-skills?referrer=in-product";
+            learnMoreLabel = ( localize(8409, "Learn more about agent skills"));
+            break;
+        case AICustomizationManagementSection.Instructions:
+            title = ( localize(8410, "Instructions"));
+            description = ( localize(
+                8411,
+                "Define common guidelines and rules that automatically influence how AI generates code and handles development tasks."
+            ));
+            docsUrl = "https://code.visualstudio.com/docs/agent-customization/custom-instructions?referrer=in-product";
+            learnMoreLabel = ( localize(8412, "Learn more about custom instructions"));
+            break;
+        case AICustomizationManagementSection.Hooks:
+            title = ( localize(8413, "Hooks"));
+            description = ( localize(8414, "Prompts executed at specific points during an agentic lifecycle."));
+            docsUrl = "https://code.visualstudio.com/docs/agent-customization/hooks?referrer=in-product";
+            learnMoreLabel = ( localize(8415, "Learn more about hooks"));
+            break;
+        case AICustomizationManagementSection.Prompts:
+        default:
+            title = ( localize(8416, "Prompts"));
+            description = ( localize(
+                8417,
+                "Reusable prompts for common development tasks like generating code, performing reviews, or scaffolding components."
+            ));
+            docsUrl = "https://code.visualstudio.com/docs/agent-customization/prompt-files?referrer=in-product";
+            learnMoreLabel = ( localize(8418, "Learn more about prompt files"));
+            break;
+        }
+        this.sectionTitle.textContent = title;
+        this.sectionTitleDescriptionText.textContent = description;
+        this.sectionLink.textContent = learnMoreLabel;
+        this.sectionLink.href = docsUrl;
+    }
+    updateAddButton() {
+        if (this.usesCardLayout()) {
+            this.addButton.element.style.display = "none";
+            this.addButtonSimple.element.style.display = "none";
+            if (this.allItems.length > 0 || !this.searchQuery.trim()) {
+                this.filterItems();
+            }
+            return;
+        }
+        const actions = this.buildCreateActions();
+        const [primary, ...dropdown] = actions;
+        const hasDropdown = dropdown.length > 0;
+        this.addButton.element.style.display = hasDropdown ? "" : "none";
+        this.addButtonSimple.element.style.display = hasDropdown ? "none" : "";
+        if (!primary) {
+            this.addButtonSimple.element.style.display = "none";
+            this.addButton.element.style.display = "none";
+            return;
+        }
+        if (hasDropdown) {
+            this.addButton.label = primary.label;
+            this.addButton.enabled = primary.enabled;
+            this.addButton.primaryButton.setTitle(primary.tooltip ?? "");
+            this.addButton.dropdownButton.setTitle("");
+        } else {
+            this.addButtonSimple.label = primary.label;
+            this.addButtonSimple.enabled = primary.enabled;
+            this.addButtonSimple.setTitle(primary.tooltip ?? "");
+        }
+    }
+    buildCreateActions() {
+        const typeLabel = this.getTypeLabel();
+        const promptType = sectionToPromptType(this.currentSection);
+        const descriptor = this.harnessService.getActiveDescriptor();
+        const override = descriptor.sectionOverrides?.get(this.currentSection);
+        const hasWorkspace = this.hasActiveWorkspace();
+        if (override?.commandId) {
+            return [{
+                label: override.label ?? ( localize(8419, "New {0}", typeLabel)),
+                enabled: true,
+                run: () => {
+                    this.commandService.executeCommand(override.commandId);
+                }
+            }];
+        }
+        const menuActions = this.menuService.getMenuActions(AICustomizationManagementCreateMenuId, this.contextKeyService, {
+            shouldForwardArgs: true
+        });
+        const extensionCreateActions = [];
+        for (const [, group] of menuActions) {
+            for (const menuItem of group) {
+                if (menuItem instanceof MenuItemAction) {
+                    extensionCreateActions.push({
+                        label: typeof menuItem.item.title === "string" ? menuItem.item.title : menuItem.item.title.value,
+                        enabled: menuItem.enabled,
+                        run: () => {
+                            menuItem.run();
+                        }
+                    });
+                }
+            }
+        }
+        if (extensionCreateActions.length > 0) {
+            return extensionCreateActions;
+        }
+        const createTypeLabel = override?.typeLabel ?? typeLabel;
+        const actions = [];
+        const addedTargets = ( new Set());
+        if (override?.rootFile && hasWorkspace) {
+            actions.push({
+                label: override.label ?? ( localize(8419, "New {0}", typeLabel)),
+                enabled: true,
+                target: "workspace",
+                run: () => {
+                    this._onDidRequestCreateManual.fire({
+                        type: promptType,
+                        target: "workspace-root"
+                    });
+                }
+            });
+            addedTargets.add("workspace-root");
+        }
+        if (promptType === PromptsType.hook) {
+            if (!this.workspaceService.isSessionsWindow && !descriptor.hideGenerateButton) {
+                actions.push({
+                    label: ( localize(8420, "Generate with AI")),
+                    tooltip: ( localize(8421, "Generate {0} with AI", typeLabel)),
+                    enabled: true,
+                    kind: "generate",
+                    run: () => {
+                        this._onDidRequestCreate.fire(promptType);
+                    }
+                });
+            }
+            if (hasWorkspace) {
+                actions.push({
+                    label: ( localize(8422, "New Hook")),
+                    compactLabel: ( localize(8422, "New Hook")),
+                    enabled: true,
+                    target: "workspace",
+                    run: () => {
+                        this._onDidRequestCreateManual.fire({
+                            type: promptType,
+                            target: "local"
+                        });
+                    }
+                });
+            }
+            actions.push({
+                label: ( localize(8422, "New Hook")),
+                compactLabel: ( localize(8422, "New Hook")),
+                enabled: true,
+                target: "user",
+                run: () => {
+                    this._onDidRequestCreateManual.fire({
+                        type: promptType,
+                        target: "user"
+                    });
+                }
+            });
+            return actions;
+        }
+        if (!override?.rootFile) {
+            if (!this.workspaceService.isSessionsWindow && !descriptor.hideGenerateButton) {
+                actions.push({
+                    label: ( localize(8420, "Generate with AI")),
+                    tooltip: ( localize(8421, "Generate {0} with AI", typeLabel)),
+                    enabled: true,
+                    kind: "generate",
+                    run: () => {
+                        this._onDidRequestCreate.fire(promptType);
+                    }
+                });
+            } else if (hasWorkspace) {
+                actions.push({
+                    label: ( localize(8423, "New {0} (Workspace)", createTypeLabel)),
+                    compactLabel: ( localize(8419, "New {0}", createTypeLabel)),
+                    enabled: true,
+                    target: "workspace",
+                    run: () => {
+                        this._onDidRequestCreateManual.fire({
+                            type: promptType,
+                            target: "local"
+                        });
+                    }
+                });
+                addedTargets.add("workspace");
+            } else {
+                actions.push({
+                    label: ( localize(8424, "New {0} (User)", createTypeLabel)),
+                    compactLabel: ( localize(8419, "New {0}", createTypeLabel)),
+                    enabled: true,
+                    target: "user",
+                    run: () => {
+                        this._onDidRequestCreateManual.fire({
+                            type: promptType,
+                            target: "user"
+                        });
+                    }
+                });
+                addedTargets.add("user");
+            }
+        }
+        if (hasWorkspace && !( addedTargets.has("workspace"))) {
+            actions.push({
+                label: ( localize(8423, "New {0} (Workspace)", createTypeLabel)),
+                compactLabel: ( localize(8419, "New {0}", createTypeLabel)),
+                enabled: true,
+                target: "workspace",
+                run: () => {
+                    this._onDidRequestCreateManual.fire({
+                        type: promptType,
+                        target: "local"
+                    });
+                }
+            });
+        }
+        if (!( addedTargets.has("user"))) {
+            actions.push({
+                label: ( localize(8424, "New {0} (User)", createTypeLabel)),
+                compactLabel: ( localize(8419, "New {0}", createTypeLabel)),
+                enabled: true,
+                target: "user",
+                run: () => {
+                    this._onDidRequestCreateManual.fire({
+                        type: promptType,
+                        target: "user"
+                    });
+                }
+            });
+        }
+        if (hasWorkspace && override?.rootFileShortcuts && !( addedTargets.has("workspace-root"))) {
+            for (const fileName of override.rootFileShortcuts) {
+                actions.push({
+                    label: ( localize(8425, "New {0}", fileName)),
+                    enabled: true,
+                    target: "workspace",
+                    run: () => {
+                        this._onDidRequestCreateManual.fire({
+                            type: promptType,
+                            target: "workspace-root",
+                            rootFileName: fileName
+                        });
+                    }
+                });
+            }
+        }
+        return actions;
+    }
+    getDropdownActions() {
+        this.dropdownActionDisposables.clear();
+        const allActions = this.buildCreateActions();
+        return allActions.slice(1).map((a, i) => this.dropdownActionDisposables.add(( new Action(`create_${i}`, a.label, undefined, a.enabled, () => a.run()))));
+    }
+    hasActiveWorkspace() {
+        return !!this.workspaceService.getActiveProjectRoot();
+    }
+    executePrimaryCreateAction() {
+        const actions = this.buildCreateActions();
+        if (actions.length > 0 && actions[0].enabled) {
+            actions[0].run();
+        }
+    }
+    getTypeLabel() {
+        switch (this.currentSection) {
+        case AICustomizationManagementSection.Agents:
+            return localize(8426, "Agent");
+        case AICustomizationManagementSection.Skills:
+            return localize(8427, "Skill");
+        case AICustomizationManagementSection.Instructions:
+            return localize(8428, "Instruction");
+        case AICustomizationManagementSection.Hooks:
+            return localize(8429, "Hook");
+        case AICustomizationManagementSection.Prompts:
+        default:
+            return localize(8430, "Prompt");
+        }
+    }
+    announceItemCount(count) {
+        const isFiltering = this.searchQuery.trim().length > 0;
+        status(getCountAnnouncement(this.currentSection, count, isFiltering));
+    }
+    refresh() {
+        if (this._store.isDisposed) {
+            return;
+        }
+        this.applyItemsFromModel();
+        this.updateAddButton();
+    }
+    applyItemsFromModel() {
+        const section = toItemsModelSection(this.currentSection);
+        this.allItems = section ? this.itemsModel.getItems(section).get() : [];
+        this.filterItems();
+        this._onDidChangeItemCount.fire(this.allItems.length);
+    }
+    computeItemCountForSection(section) {
+        const modelSection = toItemsModelSection(section);
+        return modelSection ? this.itemsModel.getCount(modelSection).get() : 0;
+    }
+    applySearchFilter(items) {
+        if (!this.searchQuery.trim()) {
+            return items.map(item => ({
+                ...item,
+                nameMatches: undefined,
+                descriptionMatches: undefined
+            }));
+        }
+        const query = this.searchQuery.toLowerCase();
+        const matched = [];
+        for (const item of items) {
+            const displayName = item.displayName ?? formatDisplayName(item.name);
+            const nameMatches = matchesContiguousSubString(query, displayName);
+            const descriptionMatches = item.description ? matchesContiguousSubString(query, item.description) : null;
+            const filenameMatches = matchesContiguousSubString(query, item.filename);
+            const badgeMatches = item.badge ? matchesContiguousSubString(query, item.badge) : null;
+            if (nameMatches || descriptionMatches || filenameMatches || badgeMatches) {
+                matched.push({
+                    ...item,
+                    nameMatches: nameMatches || undefined,
+                    descriptionMatches: descriptionMatches || undefined
+                });
+            }
+        }
+        return matched;
+    }
+    buildGroupedEntries(groups) {
+        for (const group of groups) {
+            group.items.sort((a, b) => a.name.localeCompare(b.name));
+        }
+        this.displayEntries = [];
+        let isFirstGroup = true;
+        for (const group of groups) {
+            if (group.items.length === 0) {
+                continue;
+            }
+            const collapsed = !this.usesCardLayout() && ( this.collapsedGroups.has(this.getCollapsedGroupKey(group.groupKey)));
+            this.displayEntries.push({
+                type: "group-header",
+                id: `group-${group.groupKey}`,
+                groupKey: group.groupKey,
+                label: group.label,
+                icon: group.icon,
+                count: group.items.length,
+                isFirst: isFirstGroup,
+                description: group.description,
+                collapsed
+            });
+            isFirstGroup = false;
+            if (!collapsed) {
+                for (const item of group.items) {
+                    this.displayEntries.push({
+                        type: "file-item",
+                        item
+                    });
+                }
+            }
+        }
+    }
+    commitDisplayEntries() {
+        this.list.splice(0, this.list.length, this.displayEntries);
+        this.updateEmptyState();
+    }
+    groupMatchedItems(matchedItems) {
+        const groups = [{
+            groupKey: PromptsStorage.local,
+            label: ( localize(8431, "Workspace")),
+            icon: workspaceIcon,
+            description: ( localize(
+                8432,
+                "Customizations stored as files in your project folder and shared with your team via version control."
+            )),
+            items: []
+        }, {
+            groupKey: PromptsStorage.user,
+            label: ( localize(8433, "User")),
+            icon: userIcon,
+            description: ( localize(
+                8434,
+                "Customizations stored locally on your machine in a central location. Private to you and available across all projects."
+            )),
+            items: []
+        }, {
+            groupKey: PromptsStorage.plugin,
+            label: ( localize(8435, "Plugins")),
+            icon: pluginIcon,
+            description: ( localize(8436, "Read-only customizations provided by installed plugins.")),
+            items: []
+        }, {
+            groupKey: PromptsStorage.extension,
+            label: ( localize(8437, "Extensions")),
+            icon: extensionIcon,
+            description: ( localize(8438, "Read-only customizations provided by installed extensions.")),
+            items: []
+        }, {
+            groupKey: PromptsStorage.builtIn,
+            label: ( localize(8439, "Built-in")),
+            icon: builtinIcon,
+            description: ( localize(8440, "Built-in customizations shipped with the application.")),
+            items: []
+        }];
+        for (const item of matchedItems) {
+            const key = this.currentSection === AICustomizationManagementSection.Instructions ? item.source : item.groupKey ?? item.source ?? AICustomizationSources.local;
+            let group = groups.find(g => g.groupKey === key);
+            if (!group) {
+                let label;
+                let description = "";
+                switch (key) {
+                case "remote-host":
+                    label = ( localize(8441, "Remote"));
+                    if (this.currentSection === AICustomizationManagementSection.Skills) {
+                        description = ( localize(
+                            8442,
+                            "Skills available from {0}, the active remote agent environment.",
+                            this.harnessService.getActiveDescriptor().label
+                        ));
+                    }
+                    break;
+                case "remote-client":
+                    label = ( localize(8443, "Local"));
+                    if (this.currentSection === AICustomizationManagementSection.Skills) {
+                        description = ( localize(
+                            8444,
+                            "Skills stored on your local machine and synced to {0}, the active remote agent environment.",
+                            this.harnessService.getActiveDescriptor().label
+                        ));
+                    }
+                    break;
+                default:
+                    label = formatDisplayName(key);
+                }
+                group = {
+                    groupKey: key,
+                    label,
+                    icon: Codicon.folder,
+                    description,
+                    items: []
+                };
+                const builtinIdx = groups.findIndex(g => g.groupKey === PromptsStorage.builtIn);
+                if (builtinIdx >= 0) {
+                    groups.splice(builtinIdx, 0, group);
+                } else {
+                    groups.push(group);
+                }
+            }
+            group.items.push(item);
+        }
+        this.buildGroupedEntries(groups);
+        if (this.usesCardLayout()) {
+            this.renderCardGroups(groups);
+        } else {
+            this.commitDisplayEntries();
+        }
+    }
+    usesCardLayout() {
+        return usesCustomizationCardLayout(this.currentSection);
+    }
+    renderCardGroups(groups) {
+        const activeElement = getActiveElement();
+        const shouldRestoreFocus = this.cardMenuOpen || !!activeElement && this.cardContainer.contains(activeElement);
+        const focusItemId = this.lastCardFocusItemId;
+        const isFiltering = !!this.searchQuery.trim();
+        const usesTargetedCreateActions = this.usesTargetedCreateActions();
+        const createGroupKey = isFiltering || usesTargetedCreateActions ? undefined : this.getCreateActionGroupKey();
+        const alwaysVisibleGroupKeys = ( new Set(getAlwaysVisibleCustomizationGroupKeys(this.currentSection, isFiltering)));
+        const visibleGroups = groups.filter(group => group.items.length > 0 || ( alwaysVisibleGroupKeys.has(group.groupKey)) || group.groupKey === createGroupKey || this.sectionLoading && !isFiltering);
+        if (visibleGroups.length === 0) {
+            this.captureCardSectionScrollPositions();
+            this.cardDisposables.clear();
+            this.cardSectionLists = [];
+            this.cardRowsByUri.clear();
+            this.cardRowsById.clear();
+            this.cardMenuButtonsById.clear();
+            this.firstCardFocusElement = undefined;
+            this.cardSectionLayoutContainer = undefined;
+            clearNode(this.cardContainer);
+            this.cardScrollableNode.style.display = "none";
+            this.updateEmptyState();
+            return;
+        }
+        if (createGroupKey) {
+            const createGroupIndex = visibleGroups.findIndex(group => group.groupKey === createGroupKey);
+            if (createGroupIndex > 0) {
+                visibleGroups.unshift(...visibleGroups.splice(createGroupIndex, 1));
+            }
+        }
+        this.captureCardSectionScrollPositions();
+        this.cardDisposables.clear();
+        this.cardSectionLists = [];
+        this.cardRowsByUri.clear();
+        this.cardRowsById.clear();
+        this.cardMenuButtonsById.clear();
+        this.firstCardFocusElement = undefined;
+        this.cardSectionLayoutContainer = undefined;
+        clearNode(this.cardContainer);
+        this.listContainer.style.display = "none";
+        this.emptyStateContainer.style.display = "none";
+        this.cardScrollableNode.style.display = "";
+        const content = append(this.cardContainer, $(
+            ".plugin-card-scroll.plugin-card-scroll-content.customization-card-scroll.distributed-section-layout"
+        ));
+        this.cardSectionLayoutContainer = content;
+        const contentResizeObserver = this.cardDisposables.add(new DisposableResizeObserver(
+            "AICustomizationListWidget.cardScrollContent",
+            () => this.scheduleCardSectionLayout()
+        ));
+        this.cardDisposables.add(contentResizeObserver.observe(content));
+        for (const group of visibleGroups) {
+            const collapsedGroupKey = this.getCollapsedGroupKey(group.groupKey);
+            const section = append(content, $(".plugin-card-section.customization-card-section"));
+            const header = append(section, $(".plugin-card-section-header"));
+            const text = append(header, $(".plugin-card-section-text"));
+            const headingRow = append(text, $(".plugin-card-section-heading-row"));
+            const heading = append(headingRow, $("h3.plugin-card-section-title"));
+            heading.textContent = group.label;
+            const count = append(headingRow, $(".plugin-card-section-count"));
+            count.textContent = String(group.items.length);
+            if (group.description) {
+                const description = append(text, $(".plugin-card-section-description"));
+                description.textContent = group.description;
+            }
+            if (!isFiltering && usesTargetedCreateActions && (group.groupKey === PromptsStorage.local || group.groupKey === PromptsStorage.user)) {
+                this.renderTargetedCardCreateActions(header, group.groupKey);
+            } else if (group.groupKey === createGroupKey) {
+                this.renderCardCreateActions(header);
+            }
+            const inventory = append(section, $(
+                ".plugin-card-grid.plugin-inventory-list.customization-inventory-list.virtualized-section-list"
+            ));
+            setupCollapsibleSection(headingRow, inventory, group.label, this.cardDisposables, ( this.collapsedGroups.has(collapsedGroupKey)), collapsed => {
+                if (collapsed) {
+                    this.collapsedGroups.add(collapsedGroupKey);
+                } else {
+                    this.collapsedGroups.delete(collapsedGroupKey);
+                }
+                this.layoutCardSectionLists();
+                this.cardScrollable.scanDomNode();
+                this.scheduleCardSectionLayout();
+            });
+            if (group.items.length === 0) {
+                if (this.sectionLoading) {
+                    renderVirtualizedSectionLoadingPlaceholder(inventory, ( localize(8445, "Loading customizations...")), ITEM_HEIGHT);
+                } else {
+                    const empty = append(inventory, $(".plugin-inventory-empty"));
+                    empty.textContent = this.getEmptyGroupMessage(group.groupKey);
+                }
+                continue;
+            }
+            this.createCustomizationSectionList(inventory, group.groupKey, group.label, group.items);
+        }
+        this.layoutCardSectionLists();
+        this.cardScrollable.scanDomNode();
+        this.scheduleCardSectionLayout();
+        if (shouldRestoreFocus) {
+            getWindow(this.element).requestAnimationFrame(() => {
+                if (!focusItemId || !this.focusCardSectionItem(focusItemId)) {
+                    this.firstCardFocusElement?.focus();
+                }
+            });
+        }
+    }
+    createCustomizationSectionList(container, groupKey, label, items) {
+        const key = `${this.currentSection}:${groupKey}`;
+        container.style.height = `${ITEM_HEIGHT}px`;
+        const itemRenderer = this.instantiationService.createInstance(
+            AICustomizationItemRenderer,
+            (item, anchor) => this.showCardItemActions(item, anchor)
+        );
+        const list = this.cardDisposables.add(this.instantiationService.createInstance(
+            WorkbenchList,
+            `AICustomizationManagementList.${label}`,
+            container,
+            ( new AICustomizationListDelegate()),
+            [itemRenderer],
+            {
+                identityProvider: {
+                    getId: entry => entry.item.id
+                },
+                accessibilityProvider: {
+                    getAriaLabel: entry => getCustomizationItemAriaLabel(entry.item),
+                    getWidgetAriaLabel: () => label,
+                    getSetSize: (_entry, _index, listLength) => listLength,
+                    getPosInSet: (_entry, index) => index + 1
+                },
+                keyboardNavigationLabelProvider: {
+                    getKeyboardNavigationLabel: entry => entry.item.name
+                },
+                multipleSelectionSupport: false,
+                openOnSingleClick: true
+            }
+        ));
+        list.splice(0, 0, items.map(item => ({
+            type: "file-item",
+            item
+        })));
+        list.scrollTop = this.cardSectionScrollPositions.get(key) ?? 0;
+        this.cardDisposables.add(list.onDidOpen(event => {
+            if (event.element) {
+                this._onDidSelectItem.fire(event.element.item);
+            }
+        }));
+        this.cardDisposables.add(list.onDidChangeFocus(event => {
+            itemRenderer.setFocusedIndex(event.indexes.length ? event.indexes[0] : -1);
+            if (event.elements.length > 0) {
+                this.lastCardFocusItemId = event.elements[0].item.id;
+            }
+        }));
+        this.cardDisposables.add(list.onDidFocus(() => {
+            if (list.getFocus().length === 0 && items.length > 0) {
+                list.setFocus([0]);
+            }
+        }));
+        this.cardDisposables.add(list.onContextMenu(event => this.onContextMenu(event)));
+        this.cardSectionLists.push({
+            list,
+            items,
+            container,
+            key
+        });
+    }
+    captureCardSectionScrollPositions() {
+        for (const section of this.cardSectionLists) {
+            this.cardSectionScrollPositions.set(section.key, section.list.scrollTop);
+        }
+    }
+    layoutCardSectionLists() {
+        const content = this.cardSectionLayoutContainer;
+        if (!content) {
+            return;
+        }
+        const heights = layoutVirtualizedSections(content, this.cardSectionLists.map(section => ({
+            container: section.container,
+            contentHeight: section.items.length * ITEM_HEIGHT,
+            minimumHeight: getVirtualizedSectionMinimumHeight(section.items, () => ITEM_HEIGHT)
+        })));
+        for (let index = 0; index < this.cardSectionLists.length; index++) {
+            const section = this.cardSectionLists[index];
+            const height = heights[index];
+            layoutVirtualizedSectionList(
+                section.list,
+                section.container,
+                height,
+                section.container.clientWidth || undefined
+            );
+        }
+    }
+    scheduleCardSectionLayout() {
+        const targetWindow = getWindow(this.element);
+        this.pendingCardSectionLayout.value = scheduleAtNextAnimationFrame(targetWindow, () => {
+            this.layoutCardSectionLists();
+            this.cardScrollable.scanDomNode();
+        });
+    }
+    focusCardSectionItem(itemId) {
+        for (const section of this.cardSectionLists) {
+            const index = section.items.findIndex(item => item.id === itemId);
+            if (index >= 0) {
+                section.list.reveal(index);
+                section.list.setFocus([index]);
+                section.list.domFocus();
+                return true;
+            }
+        }
+        return false;
+    }
+    usesTargetedCreateActions() {
+        return this.currentSection === AICustomizationManagementSection.Agents || this.currentSection === AICustomizationManagementSection.Skills || this.currentSection === AICustomizationManagementSection.Instructions || this.currentSection === AICustomizationManagementSection.Hooks || this.currentSection === AICustomizationManagementSection.Prompts;
+    }
+    getCreateActionGroupKey() {
+        if (this.buildCreateActions().length === 0) {
+            return undefined;
+        }
+        return this.hasActiveWorkspace() ? PromptsStorage.local : PromptsStorage.user;
+    }
+    renderTargetedCardCreateActions(header, groupKey) {
+        const target = groupKey === PromptsStorage.local ? "workspace" : "user";
+        const hasWorkspace = this.hasActiveWorkspace();
+        const actions = this.buildCreateActions().filter(
+            action => action.target === target || action.target === undefined && (target === "workspace" ? hasWorkspace : !hasWorkspace)
+        );
+        const primary = actions.find(action => action.target === target) ?? actions[0];
+        if (!primary) {
+            return;
+        }
+        const container = append(header, $(".plugin-card-section-actions"));
+        const label = this.formatTargetedCreateActionLabel(primary);
+        const button = this.cardDisposables.add(( new Button(container, {
+            ...defaultButtonStyles,
+            secondary: true,
+            title: primary.tooltip ?? label,
+            ariaLabel: primary.tooltip ?? label
+        })));
+        button.element.classList.add("customization-create-action");
+        button.label = label;
+        button.enabled = primary.enabled;
+        this.firstCardFocusElement ??= button.element;
+        this.cardDisposables.add(button.onDidClick(() => primary.run()));
+        const generateAction = actions.find(action => action.kind === "generate");
+        if (generateAction && generateAction !== primary) {
+            const generateButton = this.cardDisposables.add(( new Button(container, {
+                ...defaultButtonStyles,
+                secondary: true,
+                title: generateAction.tooltip ?? generateAction.label,
+                ariaLabel: generateAction.tooltip ?? generateAction.label
+            })));
+            generateButton.element.classList.add("customization-generate-action");
+            generateButton.label = generateAction.label;
+            generateButton.enabled = generateAction.enabled;
+            this.cardDisposables.add(generateButton.onDidClick(() => generateAction.run()));
+        }
+        const secondaryActions = actions.filter(action => action !== primary && action !== generateAction);
+        if (secondaryActions.length > 0) {
+            const moreLabel = ( localize(
+                8446,
+                "More creation actions for {0}",
+                groupKey === PromptsStorage.local ? ( localize(8447, "Workspace")) : ( localize(8448, "User"))
+            ));
+            const more = this.cardDisposables.add(( new Button(container, {
+                ...getButtonStyles({
+                    buttonSecondaryBackground: undefined,
+                    buttonSecondaryBorder: undefined
+                }),
+                secondary: true,
+                supportIcons: true,
+                title: moreLabel,
+                ariaLabel: moreLabel
+            })));
+            more.element.classList.add("plugin-card-icon-button", "customization-create-more-action");
+            more.label = `$(${Codicon.ellipsis.id})`;
+            this.cardDisposables.add(
+                more.onDidClick(() => this.showCreateActionsMenu(secondaryActions, more.element))
+            );
+        }
+    }
+    formatTargetedCreateActionLabel(action) {
+        return getTargetedCreateActionLabel(action.label, action.compactLabel);
+    }
+    showCreateActionsMenu(createActions, anchor) {
+        const disposables = ( new DisposableStore());
+        const actions = createActions.map((action, index) => disposables.add(( new Action(
+            `customization.create.${index}`,
+            action.label.replace(/^\$\([^)]+\)\s*/, ""),
+            undefined,
+            action.enabled,
+            () => action.run()
+        ))));
+        this.contextMenuService.showContextMenu({
+            getAnchor: () => anchor,
+            getActions: () => actions,
+            onHide: () => disposables.dispose()
+        });
+    }
+    getEmptyGroupMessage(groupKey) {
+        const workspace = groupKey === PromptsStorage.local;
+        switch (this.currentSection) {
+        case AICustomizationManagementSection.Agents:
+            return workspace ? ( localize(8449, "No workspace agents yet.")) : ( localize(8450, "No user agents yet."));
+        case AICustomizationManagementSection.Skills:
+            return workspace ? ( localize(8451, "No workspace skills yet.")) : ( localize(8452, "No user skills yet."));
+        case AICustomizationManagementSection.Instructions:
+            return workspace ? ( localize(8453, "No workspace instructions yet.")) : ( localize(8454, "No user instructions yet."));
+        case AICustomizationManagementSection.Hooks:
+            return workspace ? ( localize(8455, "No workspace hooks yet.")) : ( localize(8456, "No user hooks yet."));
+        case AICustomizationManagementSection.Prompts:
+            return workspace ? ( localize(8457, "No workspace prompts yet.")) : ( localize(8458, "No user prompts yet."));
+        default:
+            return localize(8459, "No customizations are available.");
+        }
+    }
+    renderCardCreateActions(header) {
+        const actions = this.buildCreateActions();
+        const [primary, ...dropdown] = actions;
+        if (!primary) {
+            return;
+        }
+        const container = append(header, $(".plugin-card-section-actions"));
+        const accessibleLabel = primary.tooltip ?? primary.label.replace(/\$\([^)]+\)\s*/g, "");
+        if (dropdown.length > 0) {
+            const button = this.cardDisposables.add(( new ButtonWithDropdown(container, {
+                ...defaultButtonStyles,
+                secondary: true,
+                contextMenuProvider: this.contextMenuService,
+                addPrimaryActionToDropdown: false,
+                actions: {
+                    getActions: () => this.getDropdownActions()
+                },
+                title: accessibleLabel,
+                ariaLabel: accessibleLabel
+            })));
+            button.element.classList.add("customization-create-action");
+            button.label = primary.label;
+            button.enabled = primary.enabled;
+            this.firstCardFocusElement ??= button.element;
+            this.cardDisposables.add(button.onDidClick(() => this.executePrimaryCreateAction()));
+            return;
+        }
+        const button = this.cardDisposables.add(( new Button(container, {
+            ...defaultButtonStyles,
+            secondary: true,
+            title: accessibleLabel,
+            ariaLabel: accessibleLabel
+        })));
+        button.element.classList.add("customization-create-action");
+        button.label = primary.label;
+        button.enabled = primary.enabled;
+        this.firstCardFocusElement ??= button.element;
+        this.cardDisposables.add(button.onDidClick(() => this.executePrimaryCreateAction()));
+    }
+    appendCustomizationCardRow(parent, item, groupLabel, cardList) {
+        const row = append(parent, $(".plugin-list-item.plugin-home-row.customization-home-row"));
+        row.classList.toggle("disabled", item.disabled);
+        const displayName = item.displayName ?? formatDisplayName(item.name);
+        const secondaryText = getCustomizationSecondaryText(item.description, item.filename, item.promptType);
+        const statusLabel = getCustomizationItemStatusLabel(item);
+        const accessibleSecondaryText = [secondaryText, statusLabel].filter(Boolean).join(". ");
+        const accessibleLabel = item.disabled ? ( localize(
+            8460,
+            "{0}. {1}. Disabled",
+            displayName,
+            accessibleSecondaryText || groupLabel
+        )) : ( localize(8461, "{0}. {1}", displayName, accessibleSecondaryText || groupLabel));
+        const primary = createCustomizationCardPrimaryAction(row, accessibleLabel, "customization-row-primary");
+        const hasReadableContent = hasReadableCustomizationContent(item.uri);
+        if (!hasReadableContent) {
+            primary.setAttribute("aria-disabled", "true");
+        }
+        this.firstCardFocusElement ??= primary;
+        if (!( this.cardRowsByUri.has(( item.uri.toString())))) {
+            this.cardRowsByUri.set(( item.uri.toString()), primary);
+        }
+        this.cardRowsById.set(item.id, primary);
+        this.cardDisposables.add(addDisposableListener(primary, "focus", () => {
+            this.lastCardFocusItemId = item.id;
+        }));
+        if (hasReadableContent) {
+            this.cardDisposables.add(
+                addDisposableListener(primary, "click", () => this._onDidSelectItem.fire(item))
+            );
+        }
+        const hasItemActions = this.hasCardItemActions(item);
+        if (hasItemActions) {
+            this.cardDisposables.add(addDisposableListener(row, "contextmenu", event => {
+                event.preventDefault();
+                this.showCardItemActions(item, row);
+            }));
+        }
+        this.cardDisposables.add(this.hoverService.setupDelayedHover(row, () => ({
+            content: `${displayName}\n${this.labelService.getUriLabel(item.uri, {
+    relative: item.source === AICustomizationSources.local
+})}`,
+            appearance: {
+                compact: true,
+                skipFadeInAnimation: true
+            }
+        })));
+        const details = append(primary, $(".plugin-list-item-details"));
+        const nameRow = append(details, $(".plugin-list-item-name-row"));
+        const name = append(nameRow, $(".plugin-list-item-name"));
+        name.textContent = displayName;
+        if (item.badge && item.promptType !== PromptsType.instructions) {
+            const badge = append(nameRow, $(".inline-badge.item-badge"));
+            badge.textContent = item.badge;
+            badge.title = item.badgeTooltip ?? item.badge;
+        }
+        const description = append(details, $(".plugin-list-item-description"));
+        description.textContent = secondaryText ?? ( localize(8462, "No description provided."));
+        const actionElements = [];
+        if (hasItemActions) {
+            const actionContainer = append(row, $(".plugin-list-item-action"));
+            this.cardDisposables.add(
+                addDisposableGenericMouseDownListener(actionContainer, e => e.stopPropagation())
+            );
+            this.cardDisposables.add(
+                addDisposableListener(actionContainer, "click", e => e.stopPropagation())
+            );
+            const more = this.cardDisposables.add(( new Button(actionContainer, {
+                ...getButtonStyles({
+                    buttonSecondaryBackground: undefined,
+                    buttonSecondaryBorder: undefined
+                }),
+                secondary: true,
+                supportIcons: true,
+                ariaLabel: ( localize(8359, "More actions for {0}", displayName))
+            })));
+            more.element.classList.add("plugin-card-icon-button");
+            more.label = `$(${Codicon.ellipsis.id})`;
+            this.cardMenuButtonsById.set(item.id, more.element);
+            this.cardDisposables.add(addDisposableListener(more.element, "focus", () => {
+                this.lastCardFocusItemId = item.id;
+            }));
+            this.cardDisposables.add(more.onDidClick(() => this.showCardItemActions(item, more.element)));
+            actionElements.push(more.element);
+        }
+        cardList.addItem({
+            row,
+            primaryAction: primary,
+            label: displayName,
+            actions: actionElements,
+            contextMenuAction: actionElements[0]
+        });
+    }
+    filterItems() {
+        const matchedItems = this.applySearchFilter(this.allItems);
+        this.groupMatchedItems(matchedItems);
+        return matchedItems.length;
+    }
+    toggleGroup(entry) {
+        const collapsedGroupKey = this.getCollapsedGroupKey(entry.groupKey);
+        if (( this.collapsedGroups.has(collapsedGroupKey))) {
+            this.collapsedGroups.delete(collapsedGroupKey);
+        } else {
+            this.collapsedGroups.add(collapsedGroupKey);
+        }
+        this.filterItems();
+    }
+    getCollapsedGroupKey(groupKey) {
+        return getCollapsedCustomizationGroupKey(this.currentSection, groupKey);
+    }
+    updateEmptyState() {
+        const hasItems = this.displayEntries.length > 0;
+        if (!hasItems) {
+            this.cardScrollableNode.style.display = "none";
+            this.emptyStateContainer.style.display = "flex";
+            this.listContainer.style.display = "none";
+            if (this.searchQuery.trim()) {
+                this.emptyStateText.textContent = ( localize(8463, "No items match '{0}'", this.searchQuery));
+                this.emptyStateSubtext.textContent = ( localize(8464, "Try a different search term"));
+            } else {
+                const emptyInfo = this.getEmptyStateInfo();
+                this.emptyStateText.textContent = emptyInfo.title;
+                this.emptyStateSubtext.textContent = emptyInfo.description;
+            }
+        } else {
+            this.emptyStateContainer.style.display = "none";
+            this.listContainer.style.display = this.usesCardLayout() ? "none" : "";
+            this.cardScrollableNode.style.display = this.usesCardLayout() ? "" : "none";
+        }
+    }
+    getEmptyStateInfo() {
+        switch (this.currentSection) {
+        case AICustomizationManagementSection.Agents:
+            return {
+                title: ( localize(8465, "No agents yet")),
+                description: ( localize(8466, "Create your first custom agent to get started"))
+            };
+        case AICustomizationManagementSection.Skills:
+            return {
+                title: ( localize(8467, "No skills yet")),
+                description: ( localize(8468, "Create your first skill to extend agent capabilities"))
+            };
+        case AICustomizationManagementSection.Instructions:
+            return {
+                title: ( localize(8469, "No instructions yet")),
+                description: ( localize(8470, "Add instructions to teach Copilot about your codebase"))
+            };
+        case AICustomizationManagementSection.Hooks:
+            return {
+                title: ( localize(8471, "No hooks yet")),
+                description: ( localize(8472, "Create hooks to execute commands at agent lifecycle events"))
+            };
+        case AICustomizationManagementSection.Prompts:
+        default:
+            return {
+                title: ( localize(8473, "No prompts yet")),
+                description: ( localize(8474, "Create reusable prompts for common tasks"))
+            };
+        }
+    }
+    setSearchQuery(query) {
+        this.searchInput.value = query;
+    }
+    clearSearch() {
+        this.searchInput.value = "";
+    }
+    focusSearch() {
+        this.searchInput.focus();
+    }
+    focusList() {
+        if (this.usesCardLayout()) {
+            if (!this.firstCardFocusElement) {
+                const firstSection = this.cardSectionLists[0];
+                if (firstSection?.items.length) {
+                    firstSection.list.setFocus([0]);
+                    firstSection.list.domFocus();
+                }
+            } else {
+                this.firstCardFocusElement.focus();
+            }
+            return;
+        }
+        this.list.domFocus();
+        if (this.displayEntries.length > 0) {
+            this.list.setFocus([0]);
+        }
+    }
+    revealLastItem() {
+        if (this.usesCardLayout()) {
+            const reveal = () => {
+                const section = this.cardSectionLists.at(-1);
+                if (section?.items.length) {
+                    section.list.reveal(section.items.length - 1);
+                }
+                this.cardScrollable.scanDomNode();
+                this.cardScrollable.setScrollPosition({
+                    scrollTop: this.cardContainer.scrollHeight
+                });
+            };
+            reveal();
+            this.revealLastItemScheduler.value = scheduleAtNextAnimationFrame(getWindow(this.element), reveal);
+            return;
+        }
+        if (this.displayEntries.length > 0) {
+            this.list.reveal(this.displayEntries.length - 1);
+        }
+    }
+    revealAndSelectFirstItemByUri(uris) {
+        if (this.usesCardLayout()) {
+            for (const section of this.cardSectionLists) {
+                const index = section.items.findIndex(item => ( uris.some(uri => isEqual(item.uri, uri))));
+                if (index >= 0) {
+                    section.list.reveal(index);
+                    section.list.setFocus([index]);
+                    section.list.setSelection([index]);
+                    section.list.domFocus();
+                    return true;
+                }
+            }
+            return false;
+        }
+        const entryIndex = this.displayEntries.findIndex(entry => {
+            return entry.type === "file-item" && ( uris.some(uri => isEqual(entry.item.uri, uri)));
+        });
+        if (entryIndex < 0) {
+            return false;
+        }
+        this.list.reveal(entryIndex);
+        this.list.setFocus([entryIndex]);
+        this.list.setSelection([entryIndex]);
+        this.list.domFocus();
+        return true;
+    }
+    layout(height, width) {
+        this.lastLayoutHeight = height;
+        this.lastLayoutWidth = width;
+        if (this.element.parentElement?.style.display === "none") {
+            return;
+        }
+        this.element.classList.toggle("narrow-layout", width < 500);
+        this.element.classList.toggle("wide-layout", width >= 600);
+        this.element.style.height = "";
+        this.searchInput.layout();
+        const searchBarHeight = this.searchAndButtonContainer.offsetHeight;
+        if (searchBarHeight === 0 && !this._layoutDeferred) {
+            this._layoutDeferred = true;
+            getWindow(this.element).requestAnimationFrame(() => {
+                try {
+                    this.layout(height, width);
+                } finally {
+                    this._layoutDeferred = false;
+                }
+            });
+            return;
+        }
+        const headerHeight = this.sectionTitleHeader.offsetHeight;
+        this.lastHeaderHeight = headerHeight;
+        const availableHeight = this.element.clientHeight || height;
+        const listHeight = Math.max(0, availableHeight - searchBarHeight - headerHeight);
+        this.cardScrollableNode.style.height = `${listHeight}px`;
+        this.listContainer.style.height = `${listHeight}px`;
+        if (this.usesCardLayout()) {
+            this.layoutCardSectionLists();
+            this.cardScrollable.scanDomNode();
+            this.scheduleCardSectionLayout();
+        } else {
+            this.list.layout(listHeight, width);
+        }
+    }
+    get itemCount() {
+        return this.allItems.length;
+    }
+    async generateDebugReport() {
+        if (this._store.isDisposed) {
+            return "";
+        }
+        return generateCustomizationDebugReport(this.currentSection, this.promptsService, this.workspaceService, {
+            allItems: this.allItems,
+            displayEntries: this.displayEntries
+        }, this.itemsModel.getActiveItemSource(), this.harnessService, this.agentPluginService);
+    }
+};
+AICustomizationListWidget = ( __decorate([( __param(0, IInstantiationService)), ( __param(1, IPromptsService)), ( __param(2, IContextViewService)), ( __param(3, IOpenerService)), ( __param(4, IContextMenuService)), ( __param(5, IMenuService)), ( __param(6, IContextKeyService)), ( __param(7, ILabelService)), ( __param(8, IAICustomizationWorkspaceService)), ( __param(9, IClipboardService)), ( __param(10, IHoverService)), ( __param(11, IFileService)), ( __param(12, ITelemetryService)), ( __param(13, ICustomizationHarnessService)), ( __param(14, ICommandService)), ( __param(15, IAICustomizationItemsModel)), ( __param(16, IAgentPluginService))], AICustomizationListWidget));
+
+export { AICustomizationListWidget, formatDisplayName, getAlwaysVisibleCustomizationGroupKeys, getCollapsedCustomizationGroupKey, getCountAnnouncement, getCustomizationItemAriaLabel, getCustomizationItemStatusLabel, getTargetedCreateActionLabel, usesCustomizationCardLayout };