@taskforcehq/taskforce 0.3.327 → 0.3.329

package/dist/components/features/TaskSettings.js

@@ -8,6 +8,7 @@ import { MCP_CLIENT_OPTIONS, buildCloudMcpClientIntegration, buildLocalMcpClient
 import { resolveTaskforceMcpBaseUrlFromBaseUrl } from '../../config/cloudEnvironment';
 import { TaxonomyManager } from './settings/TaxonomyManager';
 import { normalizeTaskforceApplicationBaseUrl } from '../../shared/taskDeepLinks.js';
+import { TaskCard } from '../task/TaskCard';
 const THEME_ICON_MAP = {
     sun: Sun,
     wind: Wind,
@@ -21,13 +22,29 @@ const MCP_CONFIG_CODE_COLORS = {
     punctuation: '#cbd5e1',
     text: '#f8fafc'
 };
+const TASK_CARD_PREVIEW_INITIATIVE = {
+    id: 'task-card-settings-preview-initiative',
+    referenceNumber: 29,
+    referenceLabel: 'IN-29',
+    title: 'Task Experience',
+    description: null,
+    createdAt: '2026-08-14T12:00:00.000Z',
+};
+const TASK_CARD_PREVIEW_WORKSTREAM = {
+    id: 'task-card-settings-preview-workstream',
+    referenceNumber: 749,
+    referenceLabel: 'WS-749',
+    initiativeId: TASK_CARD_PREVIEW_INITIATIVE.id,
+    title: 'Task Card Polish',
+    description: null,
+    createdAt: '2026-08-14T12:00:00.000Z',
+};
 export function TaskSettings(props) {
     const { settingsModel, onSectionChange, renderMode = 'full' } = props;
     const isMcpOnly = renderMode === 'mcp-only';
-    const { currentTheme, globalTheme, themeUseGlobalDefault, keyShortcut, jsonBackupEnabled, globalJsonBackupEnabled, globalWeekStartsOn, locale = 'en-US', supportedLocales = ['en-US', 'es-419', 'pt-BR'], jsonBackupUseGlobalDefault, manualComplexityEnabled, checklistDropdownEnabled = true, showTaskCardStatusLabel = false, initialSection, onThemeChange, onSaveTheme, onSaveGlobalTheme, onResetProjectToGlobal, onKeyShortcutChange, onJsonBackupEnabledChange, onSaveGlobalJsonBackupEnabled, onSaveGlobalWeekStartsOn, onSaveLocale, onManualComplexityEnabledChange, onChecklistDropdownEnabledChange, onShowTaskCardStatusLabelChange, onSaveSettings, onShowFolderBrowserChange, onBrowserTargetChange, onFetchFolders, categories, pathValidation, taxonomyDisplayLabels, onUpdateCategory, onRemoveCategory, onSaveCategory, onAddPath, onRemovePath, onUpdateCategoryIcon, onUpdateCategoryColor, types, onSaveType, onRemoveType, onUpdateType, taxonomies, onUpdateTaxonomies, priorities, onUpdatePriorities, onAnalyzeSystemTaxonomyPack, onApplySystemTaxonomyPack, onUpdateTaxonomyDisplayLabels, projectRoot, projectName, mcpHostRoot, serverHostRoot, mcpScriptPath, tenantId, workspaceId, runtimeMode = 'local', cloudAuthBaseUrl = '', cloudMcpBaseUrl = '', fetchCloudAuthApi, checkLocalMcpCliHealth, getLocalUpdateStatus, workspaceSwitchingEnabled = false, currentWorkspaceRole = 'member', currentWorkspaceName = '', onDeleteWorkspace, onMcpHostRootChange, onOpenCloudAuth, isAuthenticated = false, setupState = null, buildInfo = null, onSaveSetupMode, onSaveWorkspaceProfile, initiativeTemplates = [], onRefreshInitiativeTemplates, onCreateInitiativeFromTemplate } = settingsModel;
+    const { currentTheme, globalTheme, themeUseGlobalDefault, keyShortcut, jsonBackupEnabled, globalJsonBackupEnabled, globalWeekStartsOn, locale = 'en-US', supportedLocales = ['en-US', 'es-419', 'pt-BR'], jsonBackupUseGlobalDefault, manualComplexityEnabled, checklistDropdownEnabled = true, showTaskCardStatusLabel = false, showTaskCardDescription = true, showTaskCardAttachments = true, showTaskCardChecklistProgress = true, showTaskCardLatestActivity = true, tintTaskCardActivityBackground = false, initialSection, onThemeChange, onSaveTheme, onSaveGlobalTheme, onUseGlobalThemeDefault, onKeyShortcutChange, onJsonBackupEnabledChange, onSaveGlobalJsonBackupEnabled, onUseGlobalJsonBackupDefault, onSaveGlobalWeekStartsOn, onSaveLocale, onManualComplexityEnabledChange, onChecklistDropdownEnabledChange, onShowTaskCardStatusLabelChange, onShowTaskCardDescriptionChange, onShowTaskCardAttachmentsChange, onShowTaskCardChecklistProgressChange, onShowTaskCardLatestActivityChange, onTintTaskCardActivityBackgroundChange, onSaveSettings, onShowFolderBrowserChange, onBrowserTargetChange, onFetchFolders, categories, pathValidation, taxonomyDisplayLabels, onUpdateCategory, onRemoveCategory, onSaveCategory, onAddPath, onRemovePath, onUpdateCategoryIcon, onUpdateCategoryColor, types, onSaveType, onRemoveType, onUpdateType, taxonomies, onUpdateTaxonomies, priorities, onUpdatePriorities, onAnalyzeSystemTaxonomyPack, onApplySystemTaxonomyPack, onUpdateTaxonomyDisplayLabels, projectRoot, projectName, mcpHostRoot, serverHostRoot, mcpScriptPath, tenantId, workspaceId, runtimeMode = 'local', cloudAuthBaseUrl = '', cloudMcpBaseUrl = '', fetchCloudAuthApi, checkLocalMcpCliHealth, getLocalUpdateStatus, workspaceSwitchingEnabled = false, currentWorkspaceRole = 'member', currentWorkspaceName = '', onDeleteWorkspace, onMcpHostRootChange, onOpenCloudAuth, isAuthenticated = false, setupState = null, buildInfo = null, onSaveSetupMode, onSaveWorkspaceProfile, initiativeTemplates = [], onRefreshInitiativeTemplates, onCreateInitiativeFromTemplate } = settingsModel;
     const showJsonBackupSettings = runtimeMode !== 'cloud';
     const [settingsFeedback, setSettingsFeedback] = useState(null);
-    const [setupMode, setSetupMode] = useState(() => setupState?.mode === 'operations' ? 'operations' : 'core');
     const [workspaceDisplayName, setWorkspaceDisplayName] = useState(() => String(setupState?.workspace?.name || '').trim());
     const [workspaceDescription, setWorkspaceDescription] = useState(() => String(setupState?.workspace?.description || ''));
     const [selectedInitiativeTemplateId, setSelectedInitiativeTemplateId] = useState('');
@@ -38,6 +55,53 @@ export function TaskSettings(props) {
     const [generalScopeTab, setGeneralScopeTab] = useState(() => {
         return 'project';
     });
+    const taskCardPreviewTask = useMemo(() => ({
+        id: 'task-card-settings-preview',
+        referenceNumber: 1590,
+        referenceLabel: 'T-1590',
+        title: 'Polish Task card appearance',
+        description: 'Make card preferences easy to understand at a glance.',
+        category: categories.find((option) => !option.disabled)?.value || 'general',
+        type: types[0]?.value || 'feature',
+        priority: priorities.find((option) => Number(option.value) === 2)?.value ?? priorities[0]?.value ?? 2,
+        complexity: 3,
+        status: 'in-progress',
+        workstreamId: TASK_CARD_PREVIEW_WORKSTREAM.id,
+        createdAt: '2026-08-14T12:00:00.000Z',
+        attachments: [{
+                path: '/task-card-preview.md',
+                displayName: 'task-card-style-guide.md',
+                originalFilename: 'task-card-style-guide.md',
+                linkRole: 'attachment',
+            }],
+        commentCount: 2,
+        checklistCount: 3,
+        completedChecklistCount: 1,
+        latestActivity: {
+            id: 'task-card-settings-preview-activity',
+            type: 'event',
+            timestamp: '2026-08-14T12:30:00.000Z',
+            event: {
+                action: 'task-status-changed',
+                actor: 'Cardsmith',
+                actorType: 'ai',
+                actorProfile: {
+                    id: 'task-card-settings-preview-actor',
+                    kind: 'ai',
+                    label: 'Cardsmith',
+                    username: 'cardsmith',
+                    icon: 'Bot',
+                    color: 'violet-500',
+                    isNamed: true,
+                },
+                details: {
+                    changes: {
+                        status: { from: 'task', to: 'in-progress' },
+                    },
+                },
+            },
+        },
+    }), [categories, priorities, types]);
     useEffect(() => {
         if (initiativeTemplates.length > 0 && !selectedInitiativeTemplateId) {
             setSelectedInitiativeTemplateId(initiativeTemplates[0].id);
@@ -49,13 +113,31 @@ export function TaskSettings(props) {
         const timer = setTimeout(() => setSettingsFeedback(null), 2500);
         return () => clearTimeout(timer);
     }, [settingsFeedback]);
-    useEffect(() => {
-        setSetupMode(setupState?.mode === 'operations' ? 'operations' : 'core');
-    }, [setupState?.mode]);
+    const reportTaskCardPreferenceResult = (success, errorMessage) => {
+        setSettingsFeedback(success ? null : { type: 'error', message: errorMessage });
+    };
     useEffect(() => {
         setWorkspaceDisplayName(String(setupState?.workspace?.name || '').trim());
         setWorkspaceDescription(String(setupState?.workspace?.description || ''));
     }, [setupState?.workspace?.name, setupState?.workspace?.description]);
+    const resolvedWorkspaceId = String(workspaceId || setupState?.workspaceId || setupState?.workspace?.id || '').trim();
+    const handleCopyWorkspaceId = async () => {
+        if (!resolvedWorkspaceId) {
+            setSettingsFeedback({ type: 'error', message: 'Workspace ID is unavailable.' });
+            return;
+        }
+        if (!navigator.clipboard?.writeText) {
+            setSettingsFeedback({ type: 'error', message: 'Clipboard copy is unavailable in this browser.' });
+            return;
+        }
+        try {
+            await navigator.clipboard.writeText(resolvedWorkspaceId);
+            setSettingsFeedback({ type: 'success', message: 'Workspace ID copied.' });
+        }
+        catch {
+            setSettingsFeedback({ type: 'error', message: 'Failed to copy workspace ID.' });
+        }
+    };
     const handleThemeChange = async (theme) => {
         onThemeChange(theme);
         const success = await onSaveTheme(theme);
@@ -831,7 +913,13 @@ export function TaskSettings(props) {
         setActiveTab(tab);
         onSectionChange?.(section);
     };
-    const renderProjectThemeControls = () => (_jsxs("div", { className: styles.settingGroup, children: [_jsx("h3", { className: `${styles.settingTitle} tf-heading-section`, children: "Theme" }), _jsx("div", { className: styles.buttonGrid, children: TASKFORCE_THEME_OPTIONS.map((themeOption) => renderThemeButton(themeOption, currentTheme, handleThemeChange)) })] }));
+    const renderProjectThemeControls = () => (_jsxs("div", { className: styles.settingGroup, children: [_jsxs("div", { className: styles.settingTitleRow, children: [_jsx("h3", { className: `${styles.settingTitle} tf-heading-section`, children: "Theme" }), !themeUseGlobalDefault && (_jsx("button", { type: "button", className: "tf-button-secondary tf-button-compact", onClick: async () => {
+                            const success = await onUseGlobalThemeDefault();
+                            setSettingsFeedback({
+                                type: success ? 'success' : 'error',
+                                message: success ? 'Using global theme default.' : 'Failed to use global theme default.'
+                            });
+                        }, children: "Use global theme" }))] }), _jsx("div", { className: styles.buttonGrid, children: TASKFORCE_THEME_OPTIONS.map((themeOption) => renderThemeButton(themeOption, currentTheme, handleThemeChange)) })] }));
     const renderGlobalThemeControls = () => (_jsxs("div", { className: styles.settingGroup, children: [_jsx("h3", { className: `${styles.settingTitle} tf-heading-section`, children: "Theme Defaults" }), _jsx("div", { className: styles.buttonGrid, children: TASKFORCE_THEME_OPTIONS.map((themeOption) => renderThemeButton(themeOption, globalTheme, async (theme) => {
                     const success = await onSaveGlobalTheme(theme);
                     setSettingsFeedback({
@@ -848,30 +936,27 @@ export function TaskSettings(props) {
                                 message: success ? 'Checklist dropdown setting saved.' : 'Failed to save checklist dropdown setting.'
                             });
                         }, disabled: !onChecklistDropdownEnabledChange }), _jsx("span", { children: "Enable checklist dropdown in task form" })] })] }));
-    return (_jsx("div", { className: `${styles.settingsTab} ${isMcpOnly ? styles.settingsTabMcpOnly : ''}`.trim(), children: _jsxs("div", { className: `${styles.settingsLayout} ${isMcpOnly ? styles.settingsLayoutMcpOnly : ''}`.trim(), children: [!isMcpOnly && (_jsxs("aside", { className: styles.settingsSidebar, children: [_jsx("div", { className: styles.settingsSidebarHeader, children: "Sections" }), _jsxs("div", { className: `${styles.settingsSidebarNav} tf-scrollbar tf-scrollbar--track-transparent tf-scrollbar--compact`, children: [settingsNavItems.filter((item) => item.key === 'general').map((item) => (_jsxs("button", { className: `${styles.settingsSidebarBtn} ${activeTab === item.key ? styles.settingsSidebarBtnActive : ''}`, onClick: () => selectTab(item.key, item.section), children: [item.icon, _jsx("span", { children: item.label })] }, item.key))), _jsxs("div", { className: styles.settingsSidebarGroup, children: [_jsxs("button", { className: `${styles.settingsSidebarBtn} ${styles.settingsSidebarGroupBtn} ${(activeTab === 'appearanceApplication' || activeTab === 'appearanceTaskCards' || activeTab === 'appearanceTaskForms') ? styles.settingsSidebarBtnActive : ''}`, onClick: () => setAppearanceExpanded((current) => !current), "aria-expanded": appearanceExpanded, "aria-controls": "settings-appearance-nav", children: [_jsx(Sparkles, { size: 14 }), _jsx("span", { className: styles.settingsSidebarGroupLabel, children: "Appearance" }), _jsx("span", { className: styles.settingsSidebarGroupChevron, children: appearanceExpanded ? _jsx(ChevronDown, { size: 14 }) : _jsx(ChevronRight, { size: 14 }) })] }), appearanceExpanded && (_jsx("div", { id: "settings-appearance-nav", className: styles.settingsSidebarSubnav, children: appearanceNavItems.map((item) => (_jsx("button", { className: `${styles.settingsSidebarSubBtn} ${activeTab === item.key ? styles.settingsSidebarBtnActive : ''}`, onClick: () => selectTab(item.key, item.section), children: _jsx("span", { children: item.label }) }, item.key))) }))] }), settingsNavItems.filter((item) => item.key !== 'general').map((item) => (_jsxs("button", { className: `${styles.settingsSidebarBtn} ${activeTab === item.key ? styles.settingsSidebarBtnActive : ''}`, onClick: () => selectTab(item.key, item.section), children: [item.icon, _jsx("span", { children: item.label })] }, item.key)))] })] })), _jsxs("div", { className: styles.settingsContent, children: [settingsFeedback && (_jsxs("div", { className: `${styles.settingsToast} ${settingsFeedback.type === 'success' ? styles.settingsToastSuccess : styles.settingsToastError}`, children: [settingsFeedback.type === 'success' ? _jsx(Check, { size: 14 }) : _jsx(AlertTriangle, { size: 14 }), _jsx("span", { children: settingsFeedback.message })] })), activeTab === 'general' && (_jsxs(_Fragment, { children: [_jsxs("div", { className: styles.settingGroup, children: [_jsxs("div", { className: `${styles.settingsTabs} tf-scrollbar tf-scrollbar--track-transparent tf-scrollbar--compact`, children: [_jsx("button", { className: `${styles.settingsTabBtn} ${generalScopeTab === 'project' ? styles.settingsTabBtnActive : ''}`, onClick: () => setGeneralScopeTab('project'), children: "Project" }), _jsx("button", { className: `${styles.settingsTabBtn} ${generalScopeTab === 'global' ? styles.settingsTabBtnActive : ''}`, onClick: () => setGeneralScopeTab('global'), children: "Global" })] }), generalScopeTab === 'project' && (_jsx("div", { className: styles.pathInputGroup, style: { justifyContent: 'flex-end' }, children: _jsx("button", { onClick: async () => {
-                                                    const confirmed = window.confirm('Reset project Theme and Backups to global defaults?');
-                                                    if (!confirmed)
-                                                        return;
-                                                    const success = await onResetProjectToGlobal();
-                                                    setSettingsFeedback({
-                                                        type: success ? 'success' : 'error',
-                                                        message: success ? 'Project settings reset to global.' : 'Failed to reset project settings.'
-                                                    });
-                                                }, className: styles.copyBtn, children: "Reset to Global" }) }))] }), generalScopeTab === 'project' && (_jsxs("div", { className: styles.settingGroup, children: [_jsxs("div", { className: styles.pathInputGroup, children: [_jsxs("label", { className: styles.label, style: { minWidth: '110px' }, children: [setupMode === 'operations' ? 'Mission' : 'Project', " name:"] }), _jsx("input", { className: styles.input, type: "text", value: workspaceDisplayName, onChange: (event) => setWorkspaceDisplayName(event.target.value), placeholder: setupMode === 'operations' ? 'Mission name' : 'Project name' })] }), _jsxs("div", { className: styles.pathInputGroup, children: [_jsx("label", { className: styles.label, style: { minWidth: '110px' }, children: "Description:" }), _jsx("textarea", { className: styles.textarea, value: workspaceDescription, onChange: (event) => setWorkspaceDescription(event.target.value), placeholder: setupMode === 'operations' ? 'Mission description (optional)' : 'Project description (optional)', rows: 3 })] }), _jsx("div", { className: styles.pathInputGroup, style: { justifyContent: 'flex-end' }, children: _jsx("button", { onClick: async () => {
-                                                    if (!onSaveWorkspaceProfile)
-                                                        return;
-                                                    const result = await onSaveWorkspaceProfile({
-                                                        workspaceId: setupState?.workspaceId,
-                                                        name: workspaceDisplayName,
-                                                        description: workspaceDescription
-                                                    });
-                                                    setSettingsFeedback({
-                                                        type: result.success ? 'success' : 'error',
-                                                        message: result.success
-                                                            ? `${setupMode === 'operations' ? 'Mission' : 'Project'} profile saved.`
-                                                            : (result.error || 'Failed to save workspace profile.')
-                                                    });
-                                                }, className: styles.copyBtn, disabled: !onSaveWorkspaceProfile, children: "Save" }) })] })), generalScopeTab === 'project' && (_jsx("div", { className: styles.settingGroup, children: showJsonBackupSettings && (_jsxs(_Fragment, { children: [_jsx("h3", { className: styles.settingTitle, children: "Backup" }), _jsxs("label", { className: styles.archiveToggle, children: [_jsx("input", { type: "checkbox", checked: jsonBackupEnabled, onChange: async (e) => {
+    return (_jsx("div", { className: `${styles.settingsTab} ${isMcpOnly ? styles.settingsTabMcpOnly : ''}`.trim(), children: _jsxs("div", { className: `${styles.settingsLayout} ${isMcpOnly ? styles.settingsLayoutMcpOnly : ''}`.trim(), children: [!isMcpOnly && (_jsxs("aside", { className: styles.settingsSidebar, children: [_jsx("div", { className: styles.settingsSidebarHeader, children: "Sections" }), _jsxs("div", { className: `${styles.settingsSidebarNav} tf-scrollbar tf-scrollbar--track-transparent tf-scrollbar--compact`, children: [settingsNavItems.filter((item) => item.key === 'general').map((item) => (_jsxs("button", { className: `${styles.settingsSidebarBtn} ${activeTab === item.key ? styles.settingsSidebarBtnActive : ''}`, onClick: () => selectTab(item.key, item.section), children: [item.icon, _jsx("span", { children: item.label })] }, item.key))), _jsxs("div", { className: styles.settingsSidebarGroup, children: [_jsxs("button", { className: `${styles.settingsSidebarBtn} ${styles.settingsSidebarGroupBtn} ${(activeTab === 'appearanceApplication' || activeTab === 'appearanceTaskCards' || activeTab === 'appearanceTaskForms') ? styles.settingsSidebarBtnActive : ''}`, onClick: () => setAppearanceExpanded((current) => !current), "aria-expanded": appearanceExpanded, "aria-controls": "settings-appearance-nav", children: [_jsx(Sparkles, { size: 14 }), _jsx("span", { className: styles.settingsSidebarGroupLabel, children: "Appearance" }), _jsx("span", { className: styles.settingsSidebarGroupChevron, children: appearanceExpanded ? _jsx(ChevronDown, { size: 14 }) : _jsx(ChevronRight, { size: 14 }) })] }), appearanceExpanded && (_jsx("div", { id: "settings-appearance-nav", className: styles.settingsSidebarSubnav, children: appearanceNavItems.map((item) => (_jsx("button", { className: `${styles.settingsSidebarSubBtn} ${activeTab === item.key ? styles.settingsSidebarBtnActive : ''}`, onClick: () => selectTab(item.key, item.section), children: _jsx("span", { children: item.label }) }, item.key))) }))] }), settingsNavItems.filter((item) => item.key !== 'general').map((item) => (_jsxs("button", { className: `${styles.settingsSidebarBtn} ${activeTab === item.key ? styles.settingsSidebarBtnActive : ''}`, onClick: () => selectTab(item.key, item.section), children: [item.icon, _jsx("span", { children: item.label })] }, item.key)))] })] })), _jsxs("div", { className: styles.settingsContent, children: [settingsFeedback && (_jsxs("div", { className: `${styles.settingsToast} ${settingsFeedback.type === 'success' ? styles.settingsToastSuccess : styles.settingsToastError}`, role: settingsFeedback.type === 'success' ? 'status' : 'alert', "aria-live": settingsFeedback.type === 'success' ? 'polite' : 'assertive', children: [settingsFeedback.type === 'success' ? _jsx(Check, { size: 14 }) : _jsx(AlertTriangle, { size: 14 }), _jsx("span", { children: settingsFeedback.message })] })), activeTab === 'general' && (_jsxs(_Fragment, { children: [_jsx("div", { className: styles.settingGroup, children: _jsxs("div", { className: `${styles.settingsTabs} tf-scrollbar tf-scrollbar--track-transparent tf-scrollbar--compact`, children: [_jsx("button", { className: `${styles.settingsTabBtn} ${generalScopeTab === 'project' ? styles.settingsTabBtnActive : ''}`, onClick: () => setGeneralScopeTab('project'), children: "Project" }), _jsx("button", { className: `${styles.settingsTabBtn} ${generalScopeTab === 'global' ? styles.settingsTabBtnActive : ''}`, onClick: () => setGeneralScopeTab('global'), children: "Global" })] }) }), generalScopeTab === 'project' && (_jsxs("div", { className: styles.settingGroup, children: [_jsxs("div", { className: styles.workspaceIdentity, children: [_jsx("span", { className: styles.label, children: "Workspace ID:" }), _jsxs("div", { className: styles.workspaceIdentityValueRow, children: [_jsx("code", { className: styles.workspaceIdentityValue, children: resolvedWorkspaceId || 'Unavailable' }), _jsx("button", { type: "button", className: "tf-control-icon tf-control-icon-compact", onClick: () => { void handleCopyWorkspaceId(); }, disabled: !resolvedWorkspaceId, "aria-label": "Copy workspace ID", title: "Copy workspace ID", children: _jsx(Copy, { size: 14, "aria-hidden": "true" }) })] })] }), _jsxs("div", { className: styles.workspaceProfileForm, children: [_jsx("label", { htmlFor: "workspace-name", className: styles.label, children: "Workspace name:" }), _jsx("input", { id: "workspace-name", className: styles.input, type: "text", value: workspaceDisplayName, onChange: (event) => setWorkspaceDisplayName(event.target.value), placeholder: "Workspace name" }), _jsx("label", { htmlFor: "workspace-description", className: `${styles.label} ${styles.workspaceProfileTextareaLabel}`, children: "Description:" }), _jsx("textarea", { id: "workspace-description", className: styles.textarea, value: workspaceDescription, onChange: (event) => setWorkspaceDescription(event.target.value), placeholder: "Describe this workspace (optional)", rows: 3 }), _jsx("div", { className: styles.workspaceProfileActions, children: _jsx("button", { type: "button", onClick: async () => {
+                                                            if (!onSaveWorkspaceProfile)
+                                                                return;
+                                                            const result = await onSaveWorkspaceProfile({
+                                                                workspaceId: setupState?.workspaceId,
+                                                                name: workspaceDisplayName,
+                                                                description: workspaceDescription
+                                                            });
+                                                            setSettingsFeedback({
+                                                                type: result.success ? 'success' : 'error',
+                                                                message: result.success
+                                                                    ? 'Workspace profile saved.'
+                                                                    : (result.error || 'Failed to save workspace profile.')
+                                                            });
+                                                        }, className: "tf-button-primary tf-button-compact", disabled: !onSaveWorkspaceProfile, children: "Save" }) })] })] })), generalScopeTab === 'project' && (_jsx("div", { className: styles.settingGroup, children: showJsonBackupSettings && (_jsxs(_Fragment, { children: [_jsxs("div", { className: styles.settingTitleRow, children: [_jsx("h3", { className: styles.settingTitle, children: "Backup" }), !jsonBackupUseGlobalDefault && (_jsx("button", { type: "button", className: "tf-button-secondary tf-button-compact", onClick: async () => {
+                                                            const success = await onUseGlobalJsonBackupDefault();
+                                                            setSettingsFeedback({
+                                                                type: success ? 'success' : 'error',
+                                                                message: success ? 'Using global backup default.' : 'Failed to use global backup default.'
+                                                            });
+                                                        }, children: "Use global backup" }))] }), _jsxs("label", { className: styles.archiveToggle, children: [_jsx("input", { type: "checkbox", checked: jsonBackupEnabled, onChange: async (e) => {
                                                             const success = await onJsonBackupEnabledChange(e.target.checked);
                                                             setSettingsFeedback({
                                                                 type: success ? 'success' : 'error',
@@ -907,7 +992,7 @@ export function TaskSettings(props) {
                                                                     type: success ? 'success' : 'error',
                                                                     message: success ? 'Global shortcut saved.' : 'Failed to save global shortcut.'
                                                                 });
-                                                            }, className: `${styles.saveSettingsBtn} ${styles.saveSettingsBtnWrapper}`, children: "Save" })] }), _jsxs("p", { className: styles.settingHelper, children: ["Supported modifiers: Alt, Option, Ctrl, Shift, Meta (Cmd). Example: ", _jsx("code", { children: "Alt+T" }), " or ", _jsx("code", { children: "Ctrl+Shift+L" }), "."] })] })] })), generalScopeTab === 'project' && runtimeMode === 'cloud' && (_jsxs("div", { className: styles.settingGroup, children: [_jsx("h3", { className: styles.settingTitle, children: "Danger Zone" }), !workspaceSwitchingEnabled ? (_jsx("p", { className: styles.settingHelper, children: "Workspace deletion is available in cloud runtime only." })) : !isAuthenticated ? (_jsx("p", { className: styles.settingHelper, children: "Sign in to manage workspace deletion." })) : currentWorkspaceRole !== 'owner' ? (_jsx("p", { className: styles.settingHelper, children: "Only workspace owners can delete a workspace." })) : (_jsx("div", { className: styles.pathInputGroup, children: _jsxs("button", { className: styles.destructiveBtn, onClick: async () => {
+                                                            }, className: `${styles.saveSettingsBtn} ${styles.saveSettingsBtnWrapper}`, children: "Save" })] }), _jsxs("p", { className: styles.settingHelper, children: ["Supported modifiers: Alt, Option, Ctrl, Shift, Meta (Cmd). Example: ", _jsx("code", { children: "Alt+T" }), " or ", _jsx("code", { children: "Ctrl+Shift+L" }), "."] })] })] })), generalScopeTab === 'project' && runtimeMode === 'cloud' && (_jsxs("div", { className: styles.settingGroup, children: [_jsx("h3", { className: styles.settingTitle, children: "Danger Zone" }), !workspaceSwitchingEnabled ? (_jsx("p", { className: styles.settingHelper, children: "Workspace deletion is available in cloud runtime only." })) : !isAuthenticated ? (_jsx("p", { className: styles.settingHelper, children: "Sign in to manage workspace deletion." })) : currentWorkspaceRole !== 'owner' ? (_jsx("p", { className: styles.settingHelper, children: "Only workspace owners can delete a workspace." })) : (_jsx("div", { className: styles.pathInputGroup, children: _jsxs("button", { className: "tf-button-destructive tf-button-compact", onClick: async () => {
                                                     if (!onDeleteWorkspace)
                                                         return;
                                                     const normalizedWorkspaceId = String(workspaceId || '').trim();
@@ -944,15 +1029,37 @@ export function TaskSettings(props) {
                                                             ? `Workspace deleted with ${warningCount} cleanup warning(s).`
                                                             : 'Workspace deleted.'
                                                     });
-                                                }, disabled: !onDeleteWorkspace, children: [_jsx(Trash2, { size: 14, style: { marginRight: 8 } }), "Delete Workspace"] }) }))] }))] })), activeTab === 'appearanceApplication' && (_jsxs(_Fragment, { children: [_jsx("div", { className: styles.settingGroup, children: _jsxs("div", { className: `${styles.settingsTabs} tf-scrollbar tf-scrollbar--track-transparent tf-scrollbar--compact`, children: [_jsx("button", { className: `${styles.settingsTabBtn} ${generalScopeTab === 'project' ? styles.settingsTabBtnActive : ''}`, onClick: () => setGeneralScopeTab('project'), children: "Project" }), _jsx("button", { className: `${styles.settingsTabBtn} ${generalScopeTab === 'global' ? styles.settingsTabBtnActive : ''}`, onClick: () => setGeneralScopeTab('global'), children: "Global" })] }) }), generalScopeTab === 'project' ? renderProjectThemeControls() : renderGlobalThemeControls()] })), activeTab === 'appearanceTaskCards' && (_jsxs("div", { className: styles.settingGroup, children: [_jsx("h3", { className: `${styles.settingTitle} tf-heading-section`, children: "Task Cards" }), _jsxs("label", { className: styles.archiveToggle, children: [_jsx("input", { type: "checkbox", checked: showTaskCardStatusLabel, onChange: async (e) => {
-                                                if (!onShowTaskCardStatusLabelChange)
-                                                    return;
-                                                const success = await onShowTaskCardStatusLabelChange(e.target.checked);
-                                                setSettingsFeedback({
-                                                    type: success ? 'success' : 'error',
-                                                    message: success ? 'Task card status label setting saved.' : 'Failed to save task card status label setting.'
-                                                });
-                                            }, disabled: !onShowTaskCardStatusLabelChange }), _jsx("span", { children: "Show status label" })] })] })), activeTab === 'appearanceTaskForms' && renderTaskFormsControls(), activeTab === 'initiatives' && (_jsxs("div", { className: styles.settingGroup, children: [_jsxs("div", { className: styles.settingTitleRow, children: [_jsx("h3", { className: styles.settingTitle, children: "Initiative Templates" }), _jsx("button", { className: styles.copyBtn, onClick: () => { void onRefreshInitiativeTemplates?.(); }, children: "Refresh" })] }), _jsx("p", { className: `${styles.settingsHint} ${styles.marginBottom12}`, children: "Create launch, migration, or incident initiatives from reusable templates." }), _jsxs("div", { className: styles.exportItem, children: [_jsx("label", { className: styles.label, children: "Template" }), _jsx("select", { className: styles.input, value: selectedInitiativeTemplateId, onChange: (e) => {
+                                                }, disabled: !onDeleteWorkspace, children: [_jsx(Trash2, { size: 14, "aria-hidden": "true" }), "Delete Workspace"] }) }))] }))] })), activeTab === 'appearanceApplication' && (_jsxs(_Fragment, { children: [_jsx("div", { className: styles.settingGroup, children: _jsxs("div", { className: `${styles.settingsTabs} tf-scrollbar tf-scrollbar--track-transparent tf-scrollbar--compact`, children: [_jsx("button", { className: `${styles.settingsTabBtn} ${generalScopeTab === 'project' ? styles.settingsTabBtnActive : ''}`, onClick: () => setGeneralScopeTab('project'), children: "Project" }), _jsx("button", { className: `${styles.settingsTabBtn} ${generalScopeTab === 'global' ? styles.settingsTabBtnActive : ''}`, onClick: () => setGeneralScopeTab('global'), children: "Global" })] }) }), generalScopeTab === 'project' ? renderProjectThemeControls() : renderGlobalThemeControls()] })), activeTab === 'appearanceTaskCards' && (_jsxs("div", { className: styles.taskCardSettingsLayout, children: [_jsxs("div", { className: styles.settingGroup, children: [_jsx("h3", { className: `${styles.settingTitle} tf-heading-section`, children: "Task Cards" }), _jsxs("label", { className: styles.archiveToggle, children: [_jsx("input", { type: "checkbox", checked: showTaskCardStatusLabel, onChange: async (e) => {
+                                                        if (!onShowTaskCardStatusLabelChange)
+                                                            return;
+                                                        const success = await onShowTaskCardStatusLabelChange(e.target.checked);
+                                                        reportTaskCardPreferenceResult(success, 'Failed to save task card status label setting.');
+                                                    }, disabled: !onShowTaskCardStatusLabelChange }), _jsx("span", { children: "Show status label" })] }), _jsxs("div", { className: styles.taskCardSettingWithHelp, children: [_jsxs("label", { className: styles.archiveToggle, children: [_jsx("input", { type: "checkbox", checked: runtimeMode !== 'cloud' && showTaskCardDescription, onChange: async (e) => {
+                                                                if (!onShowTaskCardDescriptionChange)
+                                                                    return;
+                                                                const success = await onShowTaskCardDescriptionChange(e.target.checked);
+                                                                reportTaskCardPreferenceResult(success, 'Failed to save task card description setting.');
+                                                            }, disabled: runtimeMode === 'cloud' || !onShowTaskCardDescriptionChange, "aria-describedby": runtimeMode === 'cloud' ? 'task-card-description-cloud-help' : undefined }), _jsx("span", { children: "Show description" })] }), runtimeMode === 'cloud' && (_jsx("span", { id: "task-card-description-cloud-help", className: styles.taskCardSettingHelp, children: "Unavailable in cloud to keep task collections fast." }))] }), _jsxs("label", { className: styles.archiveToggle, children: [_jsx("input", { type: "checkbox", checked: showTaskCardAttachments, onChange: async (e) => {
+                                                        if (!onShowTaskCardAttachmentsChange)
+                                                            return;
+                                                        const success = await onShowTaskCardAttachmentsChange(e.target.checked);
+                                                        reportTaskCardPreferenceResult(success, 'Failed to save task card attachments setting.');
+                                                    }, disabled: !onShowTaskCardAttachmentsChange }), _jsx("span", { children: "Show attachments" })] }), _jsxs("label", { className: styles.archiveToggle, children: [_jsx("input", { type: "checkbox", checked: showTaskCardChecklistProgress, onChange: async (e) => {
+                                                        if (!onShowTaskCardChecklistProgressChange)
+                                                            return;
+                                                        const success = await onShowTaskCardChecklistProgressChange(e.target.checked);
+                                                        reportTaskCardPreferenceResult(success, 'Failed to save task card checklist progress setting.');
+                                                    }, disabled: !onShowTaskCardChecklistProgressChange }), _jsx("span", { children: "Show checklist progress" })] }), _jsxs("label", { className: styles.archiveToggle, children: [_jsx("input", { type: "checkbox", checked: showTaskCardLatestActivity, onChange: async (e) => {
+                                                        if (!onShowTaskCardLatestActivityChange)
+                                                            return;
+                                                        const success = await onShowTaskCardLatestActivityChange(e.target.checked);
+                                                        reportTaskCardPreferenceResult(success, 'Failed to save task card latest activity setting.');
+                                                    }, disabled: !onShowTaskCardLatestActivityChange }), _jsx("span", { children: "Show latest activity" })] }), _jsxs("label", { className: `${styles.archiveToggle} ${styles.taskCardDependentSetting}`, children: [_jsx("input", { type: "checkbox", checked: tintTaskCardActivityBackground, onChange: async (e) => {
+                                                        if (!onTintTaskCardActivityBackgroundChange)
+                                                            return;
+                                                        const success = await onTintTaskCardActivityBackgroundChange(e.target.checked);
+                                                        reportTaskCardPreferenceResult(success, 'Failed to save task card activity background setting.');
+                                                    }, disabled: !showTaskCardLatestActivity || !onTintTaskCardActivityBackgroundChange }), _jsx("span", { children: "Tint latest activity background" })] })] }), _jsxs("section", { className: styles.taskCardSettingsPreview, "aria-labelledby": "task-card-preview-title", children: [_jsx("h3", { id: "task-card-preview-title", className: `${styles.settingTitle} tf-heading-section`, children: "Preview" }), _jsx("div", { className: styles.taskCardSettingsPreviewFrame, inert: true, children: _jsx(TaskCard, { task: taskCardPreviewTask, categories: categories, types: types, priorities: priorities, taxonomies: taxonomies, taskInitiative: TASK_CARD_PREVIEW_INITIATIVE, taskWorkstream: TASK_CARD_PREVIEW_WORKSTREAM, showStatusLabel: showTaskCardStatusLabel, showDescription: runtimeMode !== 'cloud' && showTaskCardDescription, showAttachments: showTaskCardAttachments, showChecklistProgress: showTaskCardChecklistProgress, showLatestActivity: showTaskCardLatestActivity, tintActivityBackground: tintTaskCardActivityBackground }) })] })] })), activeTab === 'appearanceTaskForms' && renderTaskFormsControls(), activeTab === 'initiatives' && (_jsxs("div", { className: styles.settingGroup, children: [_jsxs("div", { className: styles.settingTitleRow, children: [_jsx("h3", { className: styles.settingTitle, children: "Initiative Templates" }), _jsx("button", { className: styles.copyBtn, onClick: () => { void onRefreshInitiativeTemplates?.(); }, children: "Refresh" })] }), _jsx("p", { className: `${styles.settingsHint} ${styles.marginBottom12}`, children: "Create launch, migration, or incident initiatives from reusable templates." }), _jsxs("div", { className: styles.exportItem, children: [_jsx("label", { className: styles.label, children: "Template" }), _jsx("select", { className: styles.input, value: selectedInitiativeTemplateId, onChange: (e) => {
                                                 const nextId = e.target.value;
                                                 setSelectedInitiativeTemplateId(nextId);
                                             }, children: initiativeTemplates.map(template => (_jsx("option", { value: template.id, children: template.name }, template.id))) })] }), _jsxs("div", { className: `${styles.exportItem} ${styles.marginTop12}`, children: [_jsx("label", { className: styles.label, children: "Initiative Title" }), _jsx("input", { className: styles.input, placeholder: "Enter initiative title", value: initiativeTitle, onChange: (e) => setInitiativeTitle(e.target.value) })] }), _jsxs("button", { className: `${styles.secondaryHeaderBtn} ${styles.marginTop12}`, disabled: isCreatingInitiative || !selectedInitiativeTemplateId || !initiativeTitle.trim() || !onCreateInitiativeFromTemplate, onClick: async () => {

package/dist/components/features/agentCapabilities/AgentCapabilitiesPrototype.d.ts

@@ -24,7 +24,7 @@ export declare const TASKFORCE_TOOL_MODULES: readonly [{
     readonly description: "Read workspace configuration, people, and managed Agent identity.";
     readonly icon: import("react").ForwardRefExoticComponent<Omit<import("lucide-react").LucideProps, "ref"> & import("react").RefAttributes<SVGSVGElement>>;
 }];
-export declare const TASKFORCE_TOOL_MODULE_KEYS: ("tasks" | "planning" | "workspace" | "documents" | "images")[];
+export declare const TASKFORCE_TOOL_MODULE_KEYS: ("images" | "documents" | "tasks" | "planning" | "workspace")[];
 export type ToolAccessMode = 'active' | 'preview' | 'requirement';
 export declare function ToolAccessSelector({ selectedKeys, onChange, disabled, mode, title, description, showFutureTools, requireOne, hasCustomOverrides, }: {
     selectedKeys: string[];

package/dist/components/features/planning/PlanningEntitySummary.d.ts

@@ -1,6 +1,7 @@
 import React from 'react';
 import type { TaskAssigneeOption } from '../../../utils/assignees';
 import type { PlanningNodeSummary, PlanningStatusCounts } from './planningWorkspaceModel';
+import { type PlanningIdentityPatch } from './PlanningVisualIdentity';
 export declare function PlanningReferenceBadge({ label, entityType, entityName, interactive, provisional, pending, }: {
     label: string;
     entityType: 'initiative' | 'workstream' | 'task';
@@ -34,11 +35,12 @@ export declare function PlanningSummaryMeta({ item, workstreamCount, className,
     workstreamCount?: number;
     className?: string;
 }): import("react/jsx-runtime").JSX.Element;
-export declare function PlanningEntitySummary({ item, entityType, workstreamCount, ownerOption, ownerOptions, onChangeOwner, }: {
+export declare function PlanningEntitySummary({ item, entityType, workstreamCount, ownerOption, ownerOptions, onChangeOwner, onChangeIdentity, }: {
     item: PlanningNodeSummary;
     entityType: 'initiative' | 'workstream';
     workstreamCount?: number;
     ownerOption?: TaskAssigneeOption;
     ownerOptions?: TaskAssigneeOption[];
     onChangeOwner?: (ownerId: string) => void | Promise<void>;
+    onChangeIdentity?: (patch: PlanningIdentityPatch) => void | Promise<void>;
 }): import("react/jsx-runtime").JSX.Element;

package/dist/components/features/planning/PlanningEntitySummary.js

@@ -6,6 +6,7 @@ import { getStatusDefinition, resolveColor } from '../../../utils/constants';
 import { ReferenceBadgeButton } from '../../ui/ReferenceBadgeButton';
 import { PlanningCardIdentity } from './PlanningCardIdentity';
 import styles from './PlanningEntitySummary.module.css';
+import { PlanningVisualIdentity } from './PlanningVisualIdentity';
 const PLANNING_PROGRESS_STATUS_ORDER = [
     'done',
     'review',
@@ -91,7 +92,7 @@ export function PlanningSummaryMeta({ item, workstreamCount, className = '', })
     const normalizedWorkstreamCount = Math.max(0, Number(workstreamCount) || 0);
     return (_jsxs(PlanningCardMeta, { className: className, children: [workstreamCount !== undefined ? (_jsxs(_Fragment, { children: [_jsxs("span", { className: styles.scopeCount, children: [normalizedWorkstreamCount, " ", normalizedWorkstreamCount === 1 ? 'workstream' : 'workstreams'] }), _jsx("span", { "aria-hidden": "true", children: "\u2022" })] })) : null, hasTasks ? (_jsxs(_Fragment, { children: [_jsxs("span", { children: [item.completedTaskCount, " of ", item.taskCount, " complete"] }), _jsx("span", { "aria-hidden": "true", children: "\u2022" })] })) : null, _jsx(PlanningContextCount, { count: item.attachmentCount })] }));
 }
-export function PlanningEntitySummary({ item, entityType, workstreamCount, ownerOption, ownerOptions, onChangeOwner, }) {
+export function PlanningEntitySummary({ item, entityType, workstreamCount, ownerOption, ownerOptions, onChangeOwner, onChangeIdentity, }) {
     const hasTasks = item.taskCount > 0;
-    return (_jsxs(_Fragment, { children: [_jsx(PlanningCardTitle, { children: item.title }), hasTasks ? (_jsx(PlanningProgress, { value: item.progressPercent, label: `${item.title}: ${item.progressPercent}% resolved`, statusCounts: item.statusCounts })) : null, _jsxs(PlanningCardFooter, { identity: (_jsx(PlanningCardIdentity, { role: "owner", option: ownerOption, label: item.ownerLabel, value: item.ownerId, options: ownerOptions, onChange: onChangeOwner, disabled: Boolean(item.isArchived) })), children: [!hasTasks ? _jsx(PlanningNoTasks, {}) : null, _jsx(PlanningSummaryMeta, { item: item, workstreamCount: entityType === 'initiative' ? workstreamCount : undefined })] })] }));
+    return (_jsxs("div", { className: styles.summaryLayout, children: [_jsx(PlanningVisualIdentity, { entityType: entityType, entityId: item.id, icon: item.icon, color: item.color, disabled: Boolean(item.isArchived), onChange: onChangeIdentity }), _jsxs("div", { className: styles.summaryContent, children: [_jsx(PlanningCardTitle, { children: item.title }), hasTasks ? (_jsx(PlanningProgress, { value: item.progressPercent, label: `${item.title}: ${item.progressPercent}% resolved`, statusCounts: item.statusCounts })) : null, _jsxs(PlanningCardFooter, { identity: (_jsx(PlanningCardIdentity, { role: "owner", option: ownerOption, label: item.ownerLabel, value: item.ownerId, options: ownerOptions, onChange: onChangeOwner, disabled: Boolean(item.isArchived) })), children: [!hasTasks ? _jsx(PlanningNoTasks, {}) : null, _jsx(PlanningSummaryMeta, { item: item, workstreamCount: entityType === 'initiative' ? workstreamCount : undefined })] })] })] }));
 }

package/dist/components/features/planning/PlanningLinkPicker.d.ts

@@ -1,9 +1,11 @@
 import type { PlanningLinkOption } from './planningWorkspaceModel';
-export declare function PlanningLinkPicker({ options, selectedId, entityLabel, onSelect, disabled, className, }: {
+export declare function PlanningLinkPicker({ options, selectedId, entityLabel, onSelect, disabled, className, iconTrigger, triggerTitle, }: {
     options: PlanningLinkOption[];
     selectedId?: string;
     entityLabel: 'initiative' | 'workstream' | 'task';
     onSelect: (option: PlanningLinkOption) => void | Promise<void>;
     disabled?: boolean;
     className?: string;
+    iconTrigger?: boolean;
+    triggerTitle?: string;
 }): import("react/jsx-runtime").JSX.Element;

package/dist/components/features/planning/PlanningLinkPicker.js

@@ -3,9 +3,11 @@ import React from 'react';
 import { Link2 } from 'lucide-react';
 import { TaxonomyDropdown } from '../../ui/TaxonomyDropdown';
 import { PlanningReferenceBadge } from './PlanningEntitySummary';
+import taskforceStyles from '../../../Taskforce.module.css';
 import controlStyles from './PlanningDropdownControl.module.css';
 import styles from './PlanningLinkPicker.module.css';
-export function PlanningLinkPicker({ options, selectedId = '', entityLabel, onSelect, disabled = false, className = '', }) {
+import { PlanningVisualIdentity } from './PlanningVisualIdentity';
+export function PlanningLinkPicker({ options, selectedId = '', entityLabel, onSelect, disabled = false, className = '', iconTrigger = false, triggerTitle, }) {
     const optionById = React.useMemo(() => new Map(options.map((option) => [option.id, option])), [options]);
     const dropdownOptions = React.useMemo(() => options.map((option) => ({
         value: option.id,
@@ -17,10 +19,10 @@ export function PlanningLinkPicker({ options, selectedId = '', entityLabel, onSe
             const option = optionById.get(String(value));
             if (option)
                 void onSelect(option);
-        }, disabled: disabled || options.length === 0, className: `${controlStyles.control} ${className}`.trim(), portalPanel: true, panelAlign: "start", panelMinWidth: 320, searchable: true, searchPlaceholder: `Search ${entityLabel}s by title or reference`, noResultsText: `No matching ${entityLabel}s.`, ariaLabel: linkLabel, triggerContent: selectedOption ? (_jsxs("span", { className: styles.triggerSelection, children: [_jsx(PlanningReferenceBadge, { label: selectedOption.referenceLabel, entityType: entityLabel, entityName: selectedOption.title }), _jsx("span", { children: selectedOption.title })] })) : (_jsxs("span", { className: styles.triggerAction, children: [_jsx(Link2, { size: 14, "aria-hidden": "true" }), _jsx("span", { children: linkLabel })] })), renderOptionContent: (option) => {
+        }, disabled: disabled || options.length === 0, className: `${iconTrigger ? `${styles.iconPicker} ${taskforceStyles.taskWorkstreamPicker}` : controlStyles.control} ${className}`.trim(), portalPanel: true, panelAlign: "start", panelMinWidth: 320, searchable: true, searchPlaceholder: `Search ${entityLabel}s by title or reference`, noResultsText: `No matching ${entityLabel}s.`, ariaLabel: linkLabel, title: iconTrigger ? (triggerTitle || linkLabel) : undefined, hideChevron: iconTrigger, triggerContent: iconTrigger ? (_jsx(Link2, { size: 14, "aria-hidden": "true" })) : selectedOption ? (_jsxs("span", { className: styles.triggerSelection, children: [_jsx(PlanningReferenceBadge, { label: selectedOption.referenceLabel, entityType: entityLabel, entityName: selectedOption.title }), _jsx("span", { children: selectedOption.title })] })) : (_jsxs("span", { className: styles.triggerAction, children: [_jsx(Link2, { size: 14, "aria-hidden": "true" }), _jsx("span", { children: linkLabel })] })), renderOptionContent: (option) => {
             const candidate = optionById.get(String(option.value));
             if (!candidate)
                 return option.label;
-            return (_jsxs("span", { className: styles.option, children: [_jsxs("span", { className: styles.optionTopRow, children: [_jsx(PlanningReferenceBadge, { label: candidate.referenceLabel, entityType: entityLabel, entityName: candidate.title }), _jsx("span", { className: styles.optionTitle, children: candidate.title })] }), candidate.meta ? _jsx("span", { className: styles.optionMeta, children: candidate.meta }) : null] }));
+            return (_jsxs("span", { className: styles.option, children: [_jsxs("span", { className: styles.optionTopRow, children: [entityLabel !== 'task' ? (_jsx(PlanningVisualIdentity, { entityType: entityLabel, entityId: candidate.id, icon: candidate.icon, color: candidate.color, size: "inline", disabled: true })) : null, _jsx(PlanningReferenceBadge, { label: candidate.referenceLabel, entityType: entityLabel, entityName: candidate.title }), _jsx("span", { className: styles.optionTitle, children: candidate.title })] }), candidate.meta ? _jsx("span", { className: styles.optionMeta, children: candidate.meta }) : null] }));
         }, placeholder: linkLabel }));
 }