@elevasis/ui 2.25.6 → 2.26.0

package/dist/features/knowledge/index.js

@@ -1,66 +1,58 @@
-import { KnowledgeTree } from '../../chunk-HAEJ4M54.js';
-import { buildOrganizationGraph, OrganizationModelSchema, DEFAULT_ORGANIZATION_MODEL_OPERATIONS, DEFAULT_ORGANIZATION_MODEL_STATUSES, DEFAULT_ORGANIZATION_MODEL_GOALS, DEFAULT_ORGANIZATION_MODEL_ROLES, DEFAULT_ORGANIZATION_MODEL_OFFERINGS, DEFAULT_ORGANIZATION_MODEL_CUSTOMERS, DEFAULT_ORGANIZATION_MODEL_IDENTITY, DEFAULT_ORGANIZATION_MODEL_PROJECTS, DEFAULT_ORGANIZATION_MODEL_BRANDING } from '../../chunk-6U7AIIHF.js';
+import { KnowledgeSearchBar, KnowledgeTree, getKnowledgeIconToken, byKind } from '../../chunk-ONFKASZI.js';
+import { CommandViewSidebarContent, OrganizationModelSchema, buildOrganizationGraph, DEFAULT_ORGANIZATION_MODEL_OPERATIONS, DEFAULT_ORGANIZATION_MODEL_STATUSES, DEFAULT_ORGANIZATION_MODEL_GOALS, DEFAULT_ORGANIZATION_MODEL_ROLES, DEFAULT_ORGANIZATION_MODEL_OFFERINGS, DEFAULT_ORGANIZATION_MODEL_CUSTOMERS, DEFAULT_ORGANIZATION_MODEL_IDENTITY, DEFAULT_ORGANIZATION_MODEL_PROJECTS, DEFAULT_ORGANIZATION_MODEL_BRANDING } from '../../chunk-OHXU5WWK.js';
+import '../../chunk-ZTWA5H77.js';
+import { SemanticIcon } from '../../chunk-KEFWANZY.js';
+import '../../chunk-XQQEKWTL.js';
 import { KNOWLEDGE_FEATURE_ID } from '../../chunk-ECNNI3NT.js';
-import { DEFAULT_ORGANIZATION_MODEL_PROSPECTING } from '../../chunk-BDKM56TP.js';
+import { DEFAULT_ORGANIZATION_MODEL_PROSPECTING } from '../../chunk-4KTLOK7K.js';
+import '../../chunk-CW3UNAF2.js';
 import { SubshellSidebarSection } from '../../chunk-IIMU5YAJ.js';
-import { DEFAULT_ORGANIZATION_MODEL_SALES } from '../../chunk-5RLYII6P.js';
+import '../../chunk-7M2VOCYN.js';
+import '../../chunk-YHBPR67D.js';
+import '../../chunk-VKMNWHTL.js';
+import '../../chunk-G26INIF3.js';
+import '../../chunk-BRXELOHC.js';
+import '../../chunk-3ZMAGTWF.js';
+import '../../chunk-VMJVQAFZ.js';
+import '../../chunk-JPGX3533.js';
+import '../../chunk-LH4GPYDX.js';
+import '../../chunk-HLFFKKT3.js';
+import '../../chunk-WLOQ4IBG.js';
+import '../../chunk-ZFLM2YVW.js';
+import '../../chunk-RIFTUOPE.js';
+import '../../chunk-3KMDHCAR.js';
+import { DEFAULT_ORGANIZATION_MODEL_SALES } from '../../chunk-W2ZTLH7Y.js';
+import '../../chunk-SZHARWKU.js';
+import { useElevasisFeatures } from '../../chunk-V3HUIZJX.js';
+import '../../chunk-TKAYX2SP.js';
+import '../../chunk-NYBEU5TE.js';
+import '../../chunk-SGS4CQ2B.js';
 import '../../chunk-2IFYDILW.js';
 import { useRouterContext } from '../../chunk-Q7DJKLEN.js';
+import '../../chunk-GESXCQWY.js';
+import '../../chunk-HOIT677G.js';
+import '../../chunk-E565XMTQ.js';
+import '../../chunk-KU7ZDWQ7.js';
 import '../../chunk-DT3QYZVU.js';
+import '../../chunk-RNP5R5I3.js';
+import '../../chunk-QD4X4H5A.js';
+import '../../chunk-KRWALB24.js';
+import '../../chunk-WFTNY755.js';
+import '../../chunk-WKJ47GIW.js';
+import '../../chunk-DD3CCMCZ.js';
+import '../../chunk-XTVZFT7U.js';
+import '../../chunk-5WWZXCS5.js';
+import '../../chunk-BRJ3QZ4E.js';
 import '../../chunk-I2KLQ2HA.js';
-import { IconBrain } from '@tabler/icons-react';
-import { Stack } from '@mantine/core';
-import { useMemo } from 'react';
+import { IconBrain, IconCheck, IconCopy } from '@tabler/icons-react';
+import { Stack, Box, SegmentedControl, Text, UnstyledButton, Group, Badge } from '@mantine/core';
+import { useClipboard } from '@mantine/hooks';
+import { useMemo, useState } from 'react';
 import { jsx, jsxs } from 'react/jsx-runtime';
 
 // ../core/src/organization-model/defaults.ts
 var DEFAULT_ORGANIZATION_MODEL_KNOWLEDGE = {
-  nodes: [
-    // --- playbook: outreach sequence SOP ---
-    {
-      id: "knowledge.outreach-playbook",
-      kind: "playbook",
-      title: "Outreach Sequence Playbook",
-      summary: "Step-by-step runbook for launching a cold outreach campaign: prospect sourcing, copy review, sending schedule, and reply handling.",
-      body: "## Overview\n\nThis playbook covers the end-to-end process for launching a cold outreach campaign using the Elevasis lead-gen pipeline.\n\n## Steps\n\n1. Source prospects via the Lead Gen feature.\n2. Review and approve copy in the CRM campaign editor.\n3. Schedule sends using the Task Scheduler.\n4. Monitor replies in the CRM inbox and route to the appropriate deal stage.",
-      links: [{ nodeId: "feature:sales.lead-gen" }, { nodeId: "feature:sales.crm" }],
-      ownerIds: [],
-      updatedAt: "2026-05-01"
-    },
-    // --- strategy: lead-gen targeting strategy ---
-    {
-      id: "knowledge.lead-gen-strategy",
-      kind: "strategy",
-      title: "Lead Gen Targeting Strategy",
-      summary: "Defines ICP signal prioritization, firmographic filters, and scoring thresholds used by the lead-gen pipeline.",
-      body: "## Strategy\n\nThe lead-gen pipeline targets SMBs with 10-200 employees in recession-resistant verticals (manufacturing, logistics, professional services). Firmographic filters: revenue \\>$1M, HQ in US/CA/AU, tech stack includes at least one SaaS CRM.\n\n## Scoring Thresholds\n\n- High priority: ICP score \\>= 80\n- Medium priority: ICP score 60-79\n- Low priority: \\< 60 (excluded from active outreach)",
-      links: [{ nodeId: "feature:sales.lead-gen" }],
-      ownerIds: [],
-      updatedAt: "2026-05-01"
-    },
-    // --- reference: organization model schema reference ---
-    {
-      id: "knowledge.org-model-reference",
-      kind: "reference",
-      title: "Organization Model Schema Reference",
-      summary: "Technical reference for the OrganizationModel Zod schema: all domains, field contracts, and versioning rules.",
-      body: "## Schema\n\nThe `OrganizationModel` schema is defined in `packages/core/src/organization-model/schema.ts`. It is versioned at `version: 1` and composed from domain sub-schemas.\n\n## Domains\n\n- `features` \u2014 flat array of FeatureSchema nodes (nav tree)\n- `knowledge` \u2014 flat array of KnowledgeNodeSchema nodes\n- `sales`, `prospecting`, `projects` \u2014 sales and GTM domains\n- `operations`, `statuses` \u2014 runtime entity domains\n- `customers`, `offerings`, `roles`, `goals` \u2014 business context domains",
-      links: [{ nodeId: "feature:knowledge.command-view" }],
-      ownerIds: [],
-      updatedAt: "2026-05-01"
-    },
-    // --- playbook: multi-feature governs (SEO + lead-gen) ---
-    {
-      id: "knowledge.seo-lead-gen-playbook",
-      kind: "playbook",
-      title: "SEO-to-Lead-Gen Handoff Playbook",
-      summary: "Runbook for promoting SEO-qualified prospects into the active lead-gen pipeline: signal capture, scoring override, and campaign assignment.",
-      body: "## Overview\n\nThis playbook governs the handoff from SEO-sourced traffic to the lead-gen pipeline.\n\n## Steps\n\n1. SEO feature captures visitor signal (form fill or intent data).\n2. Score the lead using the standard ICP scoring thresholds.\n3. If score >= 60, inject into the lead-gen prospect list.\n4. Assign to the appropriate outreach campaign in the CRM.",
-      links: [{ nodeId: "feature:seo" }, { nodeId: "feature:sales.lead-gen" }, { nodeId: "feature:sales.crm" }],
-      ownerIds: [],
-      updatedAt: "2026-05-01"
-    }
-  ]
+  nodes: []
 };
 var DEFAULT_ORGANIZATION_MODEL = {
   version: 1,
@@ -70,16 +62,39 @@ var DEFAULT_ORGANIZATION_MODEL = {
       label: "Dashboard",
       enabled: true,
       path: "/",
-      icon: "dashboard",
+      icon: "feature.dashboard",
       uiPosition: "sidebar-primary"
     },
+    {
+      id: "identity",
+      label: "Identity",
+      description: "Company identity, positioning, and market context",
+      enabled: true,
+      color: "indigo"
+    },
+    {
+      id: "platform",
+      label: "Platform",
+      description: "Elevasis platform architecture, capabilities, and implementation patterns",
+      enabled: true,
+      color: "cyan",
+      icon: "feature.platform"
+    },
+    {
+      id: "finance",
+      label: "Finance",
+      description: "Finance operations, accounting, billing, reconciliation, and tax prep",
+      enabled: true,
+      color: "green",
+      icon: "feature.finance"
+    },
     {
       id: "sales",
       label: "Sales",
       description: "Revenue workflows and customer acquisition",
       enabled: true,
       color: "blue",
-      icon: "crm",
+      icon: "feature.sales",
       uiPosition: "sidebar-primary"
     },
     {
@@ -88,7 +103,7 @@ var DEFAULT_ORGANIZATION_MODEL = {
       description: "Relationship pipeline and deal management",
       enabled: true,
       color: "blue",
-      icon: "crm",
+      icon: "feature.crm",
       path: "/crm"
     },
     {
@@ -97,7 +112,7 @@ var DEFAULT_ORGANIZATION_MODEL = {
       description: "Prospecting, qualification, and outreach preparation",
       enabled: true,
       color: "cyan",
-      icon: "lead-gen",
+      icon: "feature.lead-gen",
       path: "/lead-gen"
     },
     {
@@ -106,7 +121,7 @@ var DEFAULT_ORGANIZATION_MODEL = {
       description: "Projects, milestones, and client work execution",
       enabled: true,
       color: "orange",
-      icon: "projects",
+      icon: "feature.projects",
       path: "/projects",
       uiPosition: "sidebar-primary"
     },
@@ -116,7 +131,7 @@ var DEFAULT_ORGANIZATION_MODEL = {
       description: "Operational resources, topology, and orchestration visibility",
       enabled: true,
       color: "violet",
-      icon: "operations",
+      icon: "feature.operations",
       uiPosition: "sidebar-primary"
     },
     {
@@ -202,7 +217,7 @@ var DEFAULT_ORGANIZATION_MODEL = {
       id: "settings",
       label: "Settings",
       enabled: true,
-      icon: "settings",
+      icon: "feature.settings",
       uiPosition: "sidebar-bottom"
     },
     {
@@ -258,7 +273,7 @@ var DEFAULT_ORGANIZATION_MODEL = {
       label: "Admin",
       enabled: true,
       path: "/admin",
-      icon: "settings",
+      icon: "feature.admin",
       uiPosition: "sidebar-bottom",
       requiresAdmin: true
     },
@@ -297,7 +312,7 @@ var DEFAULT_ORGANIZATION_MODEL = {
       label: "Archive",
       enabled: true,
       path: "/archive",
-      icon: "archive",
+      icon: "feature.archive",
       uiPosition: "sidebar-bottom",
       devOnly: true
     },
@@ -325,7 +340,7 @@ var DEFAULT_ORGANIZATION_MODEL = {
       description: "Operational knowledge, playbooks, and strategy docs",
       enabled: true,
       color: "teal",
-      icon: "knowledge",
+      icon: "feature.knowledge",
       uiPosition: "sidebar-primary"
     },
     {
@@ -365,31 +380,319 @@ function resolveOrganizationModel(override, organizationId) {
   }
   return model;
 }
-var ORG_MODEL = resolveOrganizationModel();
-var KNOWLEDGE_GRAPH = buildOrganizationGraph({ organizationModel: ORG_MODEL });
+var SEGMENT_DATA = [
+  { label: "By Feature", value: "by-feature" },
+  { label: "By Kind", value: "by-kind" },
+  { label: "Config", value: "config" }
+];
 var KnowledgeSidebarMiddle = () => {
   const { navigate, currentPath } = useRouterContext();
-  const knowledgeNodes = useMemo(() => ORG_MODEL.knowledge.nodes, []);
+  const { timeRange = "30d", organizationModel } = useElevasisFeatures();
+  if (currentPath.startsWith("/knowledge/command-view")) {
+    return /* @__PURE__ */ jsx(CommandViewSidebarContent, { timeRange });
+  }
+  const orgModel = organizationModel ?? resolveOrganizationModel();
+  return /* @__PURE__ */ jsx(KnowledgeBaseSidebarBody, { navigate, currentPath, organizationModel: orgModel });
+};
+function KnowledgeBaseSidebarBody({ navigate, currentPath, organizationModel }) {
+  const knowledgeNodes = useMemo(() => organizationModel.knowledge.nodes, [organizationModel]);
+  const graph = useMemo(() => buildOrganizationGraph({ organizationModel }), [organizationModel]);
+  const [searchResults, setSearchResults] = useState(null);
+  const [axis, setAxis] = useState("by-feature");
   const selectedNodeId = useMemo(() => {
     const match = currentPath.match(/^\/knowledge\/([^/]+)/);
     if (!match) return void 0;
     const segment = match[1];
-    if (["by-feature", "by-kind", "by-owner", "graph", "command-view"].includes(segment)) return void 0;
+    if (["by-feature", "by-kind", "config", "graph", "command-view"].includes(segment)) return void 0;
     return segment;
   }, [currentPath]);
+  const handleSelect = (node) => {
+    navigate(`/knowledge/${node.id}`);
+  };
+  const handleSelectGraphNode = (node) => {
+    navigate(`/knowledge/${node.id}`);
+  };
   return /* @__PURE__ */ jsxs(Stack, { gap: 0, style: { flex: 1, overflow: "hidden", display: "flex", flexDirection: "column" }, children: [
     /* @__PURE__ */ jsx(SubshellSidebarSection, { icon: IconBrain, label: "Knowledge", withTopBorder: false }),
-    /* @__PURE__ */ jsx(Stack, { gap: 0, style: { flex: 1, overflowY: "auto" }, children: /* @__PURE__ */ jsx(
-      KnowledgeTree,
+    /* @__PURE__ */ jsx(Box, { px: "sm", pt: "sm", pb: 0, children: /* @__PURE__ */ jsx(
+      SegmentedControl,
       {
-        graph: KNOWLEDGE_GRAPH,
+        "data-testid": "knowledge-axis-control",
+        fullWidth: true,
+        size: "xs",
+        value: axis,
+        onChange: (v) => setAxis(v),
+        data: SEGMENT_DATA
+      }
+    ) }),
+    /* @__PURE__ */ jsx(Box, { p: "sm", pb: 0, children: /* @__PURE__ */ jsx(KnowledgeSearchBar, { knowledgeNodes, onResults: setSearchResults }) }),
+    /* @__PURE__ */ jsx(Stack, { gap: 0, style: { flex: 1, overflowY: "auto" }, children: searchResults ? /* @__PURE__ */ jsx(SearchResultsList, { searchResults, selectedNodeId, onSelect: handleSelect }) : /* @__PURE__ */ jsx(
+      AxisBody,
+      {
+        axis,
+        graph,
         knowledgeNodes,
-        onSelectNode: (node) => navigate(`/knowledge/${node.id}`),
-        selectedNodeId
+        selectedNodeId,
+        onSelect: handleSelect,
+        onSelectGraphNode: handleSelectGraphNode
       }
     ) })
   ] });
+}
+function SearchResultsList({ searchResults, selectedNodeId, onSelect }) {
+  if (searchResults.length === 0) {
+    return /* @__PURE__ */ jsx(Box, { p: "md", children: /* @__PURE__ */ jsx(Text, { size: "sm", c: "dimmed", children: "No results." }) });
+  }
+  return /* @__PURE__ */ jsx(Stack, { gap: 2, p: "sm", children: searchResults.map((node) => {
+    const isActive = node.id === selectedNodeId;
+    return /* @__PURE__ */ jsx(NodeButton, { node, isActive, onSelect }, node.id);
+  }) });
+}
+function AxisBody({ axis, graph, knowledgeNodes, selectedNodeId, onSelect, onSelectGraphNode }) {
+  switch (axis) {
+    case "by-feature":
+      return /* @__PURE__ */ jsx(
+        KnowledgeTree,
+        {
+          graph,
+          knowledgeNodes,
+          onSelectNode: onSelect,
+          selectedNodeId
+        }
+      );
+    case "by-kind":
+      return /* @__PURE__ */ jsx(ByKindBody, { graph, knowledgeNodes, selectedNodeId, onSelect });
+    case "config":
+      return /* @__PURE__ */ jsx(ConfigBody, { graph, selectedNodeId, onSelect: onSelectGraphNode });
+  }
+}
+var KIND_ORDER = ["playbook", "strategy", "reference"];
+var KIND_LABELS = {
+  playbook: "Playbook",
+  strategy: "Strategy",
+  reference: "Reference"
+};
+function ByKindBody({ graph, knowledgeNodes, selectedNodeId, onSelect }) {
+  const groups = useMemo(() => {
+    return KIND_ORDER.map((kind) => ({
+      kind,
+      nodes: byKind(graph, kind, knowledgeNodes)
+    })).filter((g) => g.nodes.length > 0);
+  }, [graph, knowledgeNodes]);
+  if (groups.length === 0) {
+    return /* @__PURE__ */ jsx(Box, { p: "md", children: /* @__PURE__ */ jsx(Text, { size: "sm", c: "dimmed", children: "No knowledge nodes." }) });
+  }
+  return /* @__PURE__ */ jsx(Stack, { gap: "md", style: { padding: "var(--mantine-spacing-sm)" }, children: groups.map(({ kind, nodes }) => /* @__PURE__ */ jsxs(Stack, { gap: 4, children: [
+    /* @__PURE__ */ jsx(
+      GroupHeader,
+      {
+        label: KIND_LABELS[kind],
+        count: nodes.length,
+        command: getKnowledgeReadKindFolderCommand(kind)
+      }
+    ),
+    /* @__PURE__ */ jsx(Stack, { gap: 2, children: nodes.map((node) => /* @__PURE__ */ jsx(NodeButton, { node, isActive: node.id === selectedNodeId, onSelect }, node.id)) })
+  ] }, kind)) });
+}
+var CONFIG_KIND_ORDER = ["feature", "resource", "organization", "entity", "surface", "capability"];
+var CONFIG_KIND_LABELS = {
+  feature: "Features",
+  resource: "Resources",
+  organization: "Organizations",
+  entity: "Entities",
+  surface: "Surfaces",
+  capability: "Capabilities"
 };
+function isSelectedConfigNode(selectedNodeId, node) {
+  if (!selectedNodeId) return false;
+  return selectedNodeId === node.id || selectedNodeId === node.sourceId || selectedNodeId === node.id.split(":")[1];
+}
+function ConfigBody({ graph, selectedNodeId, onSelect }) {
+  const groups = useMemo(() => {
+    const grouped = /* @__PURE__ */ new Map();
+    for (const node of graph.nodes) {
+      if (node.kind === "knowledge") continue;
+      const nodes = grouped.get(node.kind) ?? [];
+      nodes.push(node);
+      grouped.set(node.kind, nodes);
+    }
+    const knownGroups = CONFIG_KIND_ORDER.map((kind) => ({
+      kind,
+      label: CONFIG_KIND_LABELS[kind],
+      nodes: grouped.get(kind)?.sort((a, b) => a.label.localeCompare(b.label)) ?? []
+    })).filter((group) => group.nodes.length > 0);
+    const unknownGroups = Array.from(grouped.entries()).filter(([kind]) => !CONFIG_KIND_ORDER.includes(kind)).map(([kind, nodes]) => ({
+      kind,
+      label: CONFIG_KIND_LABELS[kind] ?? kind,
+      nodes: nodes.sort((a, b) => a.label.localeCompare(b.label))
+    })).sort((a, b) => a.label.localeCompare(b.label));
+    return [...knownGroups, ...unknownGroups];
+  }, [graph]);
+  if (groups.length === 0) {
+    return /* @__PURE__ */ jsx(Box, { p: "md", children: /* @__PURE__ */ jsx(Text, { size: "sm", c: "dimmed", children: "No configuration nodes." }) });
+  }
+  return /* @__PURE__ */ jsx(Stack, { gap: "md", style: { padding: "var(--mantine-spacing-sm)" }, children: groups.map(({ kind, label, nodes }) => /* @__PURE__ */ jsxs(Stack, { gap: 4, children: [
+    /* @__PURE__ */ jsx(GroupHeader, { label, count: nodes.length }),
+    /* @__PURE__ */ jsx(Stack, { gap: 2, children: nodes.map((node) => /* @__PURE__ */ jsx(
+      ConfigNodeButton,
+      {
+        node,
+        isActive: isSelectedConfigNode(selectedNodeId, node),
+        onSelect
+      },
+      node.id
+    )) })
+  ] }, kind)) });
+}
+function GroupHeader({ label, count, command }) {
+  const [hovered, setHovered] = useState(false);
+  return /* @__PURE__ */ jsxs(Group, { gap: "xs", onMouseEnter: () => setHovered(true), onMouseLeave: () => setHovered(false), children: [
+    /* @__PURE__ */ jsx(Text, { size: "xs", fw: 600, tt: "uppercase", c: "dimmed", style: { letterSpacing: "0.05em" }, children: label }),
+    /* @__PURE__ */ jsx(TrailingCopySlot, { count, command, label: "Copy group knowledge commands", showCopy: hovered })
+  ] });
+}
+function NodeButton({ node, isActive, onSelect }) {
+  const [hovered, setHovered] = useState(false);
+  return /* @__PURE__ */ jsx(
+    UnstyledButton,
+    {
+      onClick: () => onSelect(node),
+      onMouseEnter: () => setHovered(true),
+      onMouseLeave: () => setHovered(false),
+      style: {
+        padding: "6px 10px",
+        borderRadius: "var(--mantine-radius-sm)",
+        backgroundColor: isActive ? "color-mix(in srgb, var(--color-primary) 10%, transparent)" : hovered ? "var(--color-surface-hover)" : "transparent",
+        width: "100%",
+        textAlign: "left",
+        transition: "background-color var(--duration-fast) var(--easing), color var(--duration-fast) var(--easing)"
+      },
+      children: /* @__PURE__ */ jsx(
+        Text,
+        {
+          size: "sm",
+          c: isActive ? "var(--color-primary)" : hovered ? "var(--color-text)" : void 0,
+          fw: isActive ? 600 : 400,
+          children: /* @__PURE__ */ jsxs(Group, { component: "span", gap: "xs", wrap: "nowrap", children: [
+            /* @__PURE__ */ jsx(
+              SemanticIcon,
+              {
+                token: getKnowledgeIconToken(node),
+                fallbackKind: node.kind,
+                size: 15,
+                style: {
+                  color: isActive ? "var(--color-primary)" : hovered ? "var(--color-text)" : "var(--color-text-subtle)"
+                }
+              }
+            ),
+            /* @__PURE__ */ jsx("span", { style: { minWidth: 0, overflow: "hidden", textOverflow: "ellipsis", whiteSpace: "nowrap" }, children: node.title }),
+            /* @__PURE__ */ jsx(
+              CopyCommandControl,
+              {
+                command: getKnowledgeReadCommand(node.id),
+                label: "Copy knowledge command",
+                visible: hovered
+              }
+            )
+          ] })
+        }
+      )
+    }
+  );
+}
+function ConfigNodeButton({ node, isActive, onSelect }) {
+  return /* @__PURE__ */ jsx(
+    UnstyledButton,
+    {
+      onClick: () => onSelect(node),
+      style: {
+        padding: "6px 10px",
+        borderRadius: "var(--mantine-radius-sm)",
+        backgroundColor: isActive ? "color-mix(in srgb, var(--color-primary) 10%, transparent)" : "transparent",
+        width: "100%",
+        textAlign: "left"
+      },
+      children: /* @__PURE__ */ jsxs(Group, { gap: "xs", wrap: "nowrap", children: [
+        /* @__PURE__ */ jsx(
+          SemanticIcon,
+          {
+            token: node.icon,
+            fallbackKind: node.kind === "feature" ? "feature" : node.kind === "knowledge" ? "knowledge" : "unknown",
+            size: 15,
+            style: { color: isActive ? "var(--color-primary)" : "var(--color-text-subtle)" }
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          Text,
+          {
+            size: "sm",
+            c: isActive ? "var(--color-primary)" : void 0,
+            fw: isActive ? 600 : 400,
+            style: { flex: 1, minWidth: 0, overflow: "hidden", textOverflow: "ellipsis", whiteSpace: "nowrap" },
+            children: node.label
+          }
+        )
+      ] })
+    }
+  );
+}
+function getKnowledgeReadCommand(nodeId) {
+  return `/knowledge read ${nodeId}`;
+}
+function getKnowledgeReadKindFolderCommand(kind) {
+  return `/knowledge read-folder kind:${kind}`;
+}
+function CopyCommandControl({ command, label, visible }) {
+  const clipboard = useClipboard({ timeout: 1500 });
+  return /* @__PURE__ */ jsx(
+    "span",
+    {
+      role: "button",
+      tabIndex: 0,
+      "aria-label": label,
+      onClick: (event) => {
+        event.preventDefault();
+        event.stopPropagation();
+        clipboard.copy(command);
+      },
+      onKeyDown: (event) => {
+        if (event.key !== "Enter" && event.key !== " ") return;
+        event.preventDefault();
+        event.stopPropagation();
+        clipboard.copy(command);
+      },
+      style: {
+        display: "inline-flex",
+        alignItems: "center",
+        justifyContent: "center",
+        width: 22,
+        height: 22,
+        flexShrink: 0,
+        opacity: visible ? 1 : 0,
+        pointerEvents: visible ? "auto" : "none",
+        color: clipboard.copied ? "var(--color-primary)" : "var(--color-text-subtle)",
+        transition: "opacity 120ms ease, color 120ms ease"
+      },
+      children: clipboard.copied ? /* @__PURE__ */ jsx(IconCheck, { size: 14 }) : /* @__PURE__ */ jsx(IconCopy, { size: 14 })
+    }
+  );
+}
+function TrailingCopySlot({ count, command, label, showCopy }) {
+  return /* @__PURE__ */ jsx(
+    "span",
+    {
+      style: {
+        display: "inline-flex",
+        alignItems: "center",
+        justifyContent: "center",
+        width: 32,
+        height: 22,
+        flexShrink: 0
+      },
+      children: showCopy && command ? /* @__PURE__ */ jsx(CopyCommandControl, { command, label, visible: true }) : /* @__PURE__ */ jsx(Badge, { size: "xs", variant: "light", color: "gray", children: count })
+    }
+  );
+}
 var KnowledgeSidebar = () => /* @__PURE__ */ jsx(Stack, { gap: 0, style: { height: "100%", display: "flex", flexDirection: "column" }, children: /* @__PURE__ */ jsx(KnowledgeSidebarMiddle, {}) });
 
 // src/features/knowledge/manifest.ts

package/dist/features/lead-gen/index.css

@@ -138,14 +138,14 @@
 }
 .lead-gen-build-action-button:disabled,
 .lead-gen-build-action-button[data-disabled] {
-  background-color: color-mix(in srgb, var(--mantine-color-gray-8) 48%, var(--color-surface) 52%) !important;
-  border-color: color-mix(in srgb, var(--mantine-color-gray-8) 58%, var(--color-surface) 42%) !important;
+  background-color: var(--surface-primary-muted) !important;
+  border-color: var(--border-primary-subtle) !important;
   color: color-mix(in srgb, var(--color-text-subtle) 88%, var(--color-text-dimmed) 12%) !important;
   opacity: 0.78;
 }
 .lead-gen-build-action-button:disabled:hover,
 .lead-gen-build-action-button[data-disabled]:hover {
-  background-color: color-mix(in srgb, var(--mantine-color-gray-8) 48%, var(--color-surface) 52%) !important;
+  background-color: var(--surface-primary-muted) !important;
 }
 .mantine-Accordion-control:hover {
   background-color: var(--color-surface-hover);
@@ -153,8 +153,18 @@
 .mantine-Menu-item:hover:not([data-disabled]) {
   background-color: var(--color-surface-hover);
 }
-.mantine-Select-option:hover {
-  background-color: var(--color-surface-hover) !important;
+.mantine-Select-option:hover,
+.mantine-MultiSelect-option:hover,
+.mantine-TagsInput-option:hover,
+.mantine-Combobox-option:hover {
+  background-color: var(--surface-primary-muted) !important;
+}
+.mantine-Select-option[data-combobox-selected],
+.mantine-MultiSelect-option[data-combobox-selected],
+.mantine-TagsInput-option[data-combobox-selected],
+.mantine-Combobox-option[data-combobox-selected] {
+  background-color: var(--surface-primary-subtle) !important;
+  color: var(--color-text);
 }
 [data-mantine-color-scheme=dark] .mantine-Tabs-root {
   --tab-border-color: var(--color-border);
@@ -216,6 +226,16 @@
   display: none;
 }
 
+/* src/graph/Graph.globals.css */
+.elevasis-graph-root .react-flow__node.selected,
+.elevasis-graph-root .react-flow__node:focus,
+.elevasis-graph-root .react-flow__node:focus-visible {
+  outline: none !important;
+}
+.elevasis-graph-root .react-flow__node.selected > * {
+  box-shadow: none;
+}
+
 /* src/graph/Graph.module.css */
 @keyframes edgeFlow {
   0% {
@@ -589,13 +609,3 @@
     transform: none;
   }
 }
-
-/* src/graph/Graph.globals.css */
-.elevasis-graph-root .react-flow__node.selected,
-.elevasis-graph-root .react-flow__node:focus,
-.elevasis-graph-root .react-flow__node:focus-visible {
-  outline: none !important;
-}
-.elevasis-graph-root .react-flow__node.selected > * {
-  box-shadow: none;
-}