@nucleux/knowledge-base 0.0.0-stage → 0.7.0

package/LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2026 Nucleux
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/README.md

@@ -1,3 +1,39 @@
-# Temporary Holding Version
+# @nucleux/knowledge-base
 
-This version is a temporary placeholder for this package. An operational version to replace this has been submitted for review and is awaiting a staged release.
+KnowledgeBase — select the context files an agent may use — Nucleux agentic UI for React.
+
+Part of **[Nucleux](https://github.com/intelligaia-open-labs/nucleux)** — agentic UI components for React. Install a single component, or the full kit via [`@nucleux/react`](https://www.npmjs.com/package/@nucleux/react).
+
+## Exports
+
+- **`KnowledgeBase`** (variant `kb-picker`) — choose which bases the agent grounds in this session. Props: `sources`, `value` / `defaultValue` / `onValueChange`, `heading`, plus `variant` (`"list"` default, or `"chips"` — "Product docs · 412"), `onAdd` / `addLabel` ("Add a base"), `onRefresh(id)` (Refresh / Retry on a stale or failed row).
+  `KnowledgeSource`: `id`, `name`, `meta`, `icon`, plus `status` (`"ready"` | `"processing"` | `"stale"` | `"error"`, shown as Ready, Processing, Needs refresh, Couldn't process) and `count`.
+- **`KnowledgeBaseSources`** (variant `kb-source-list`) — under an answer: the documents and sections it read (`sources: { id, name, section?, href? }[]`), "Used 3 sources from Sales playbook" with `baseName`; `reading` shows and announces "Reading…" while it happens.
+- **`KnowledgeBaseCoverage`** (variant `kb-coverage-badge`) — `level` (`"high"` | `"partial"` | `"low"`) and `matches`: "Well-covered · 14 matches", "Partly covered", "Thin coverage".
+- Types: `KnowledgeBaseProps`, `KnowledgeBaseVariant`, `KnowledgeSource`, `KnowledgeSourceStatus`, `KnowledgeBaseSourceRef`, `KnowledgeBaseSourcesProps`, `KnowledgeBaseCoverageProps`, `KnowledgeBaseCoverageLevel`.
+
+## Install
+
+```bash
+pnpm add @nucleux/knowledge-base @nucleux/tokens
+```
+
+`react` / `react-dom` are peer dependencies.
+
+## Usage
+
+```tsx
+import { KnowledgeBase, KnowledgeBaseSources, KnowledgeBaseCoverage } from "@nucleux/knowledge-base";
+
+<KnowledgeBase variant="chips" heading="Grounded in" sources={bases} value={active} onValueChange={setActive} onAdd={addBase} />
+
+<KnowledgeBaseSources sources={[{ id: "1", name: "Renewal Playbook v3", section: "§4.1" }]} />
+<KnowledgeBaseCoverage level="high" matches={14} />
+```
+
+Requires the theme once in your app: `import "@nucleux/tokens/styles.css";`
+and the Tailwind preset from `@nucleux/tokens/preset`.
+
+## License
+
+MIT © Nucleux

package/dist/index.cjs

@@ -0,0 +1,290 @@
+"use client";
+'use strict';
+
+var React = require('react');
+var utils = require('@nucleux/utils');
+var badge = require('@nucleux/badge');
+var button = require('@nucleux/button');
+var spinner = require('@nucleux/spinner');
+var lucideReact = require('lucide-react');
+var jsxRuntime = require('react/jsx-runtime');
+
+function _interopNamespace(e) {
+  if (e && e.__esModule) return e;
+  var n = Object.create(null);
+  if (e) {
+    Object.keys(e).forEach(function (k) {
+      if (k !== 'default') {
+        var d = Object.getOwnPropertyDescriptor(e, k);
+        Object.defineProperty(n, k, d.get ? d : {
+          enumerable: true,
+          get: function () { return e[k]; }
+        });
+      }
+    });
+  }
+  n.default = e;
+  return Object.freeze(n);
+}
+
+var React__namespace = /*#__PURE__*/_interopNamespace(React);
+
+// src/index.tsx
+var statusWord = {
+  ready: "Ready",
+  processing: "Processing",
+  stale: "Needs refresh",
+  error: "Couldn't process"
+};
+var statusTone = {
+  ready: "text-success",
+  processing: "text-muted-foreground",
+  stale: "text-warning",
+  error: "text-destructive"
+};
+var nameText = (n, fallback) => typeof n === "string" ? n : fallback;
+var KnowledgeBase = React__namespace.forwardRef(
+  ({
+    sources,
+    value,
+    defaultValue = [],
+    onValueChange,
+    heading = "Knowledge sources",
+    variant = "list",
+    onAdd,
+    addLabel = "Add a base",
+    onRefresh,
+    className,
+    ...props
+  }, ref) => {
+    const [internal, setInternal] = React__namespace.useState(defaultValue);
+    const selected = value !== void 0 ? value : internal;
+    const headingId = React__namespace.useId();
+    const toggle = (id) => {
+      const next = selected.includes(id) ? selected.filter((v) => v !== id) : [...selected, id];
+      if (value === void 0) setInternal(next);
+      onValueChange?.(next);
+    };
+    if (variant === "chips") {
+      return /* @__PURE__ */ jsxRuntime.jsxs(
+        "div",
+        {
+          ref,
+          role: "group",
+          "aria-labelledby": heading ? headingId : void 0,
+          "aria-label": heading ? void 0 : "Knowledge sources",
+          className: utils.cn("flex flex-col gap-2 rounded-xl border border-border bg-background p-3", className),
+          ...props,
+          children: [
+            heading && /* @__PURE__ */ jsxRuntime.jsx("p", { id: headingId, className: "text-xs font-semibold text-foreground", children: heading }),
+            /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-wrap gap-1.5", children: [
+              sources.map((source) => {
+                const active = selected.includes(source.id);
+                return /* @__PURE__ */ jsxRuntime.jsxs(
+                  "button",
+                  {
+                    type: "button",
+                    role: "checkbox",
+                    "aria-checked": active,
+                    onClick: () => toggle(source.id),
+                    className: utils.cn(
+                      "inline-flex items-center gap-1 rounded-full border px-2.5 py-1 text-xs font-medium transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring [&_svg]:size-3",
+                      active ? "border-brand bg-brand-muted/50 text-brand" : "border-border text-muted-foreground hover:bg-accent hover:text-foreground"
+                    ),
+                    children: [
+                      active && /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Check, { "aria-hidden": "true" }),
+                      source.name,
+                      source.count != null && /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "font-normal", children: [
+                        "\xB7 ",
+                        source.count.toLocaleString()
+                      ] }),
+                      source.status && source.status !== "ready" && /* @__PURE__ */ jsxRuntime.jsxs("span", { className: utils.cn("font-normal", statusTone[source.status]), children: [
+                        "\xB7 ",
+                        statusWord[source.status]
+                      ] })
+                    ]
+                  },
+                  source.id
+                );
+              }),
+              onAdd && /* @__PURE__ */ jsxRuntime.jsxs(
+                "button",
+                {
+                  type: "button",
+                  onClick: onAdd,
+                  className: "inline-flex items-center gap-1 rounded-full border border-dashed border-border px-2.5 py-1 text-xs text-muted-foreground transition-colors hover:bg-accent hover:text-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring [&_svg]:size-3",
+                  children: [
+                    /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Plus, { "aria-hidden": "true" }),
+                    addLabel
+                  ]
+                }
+              )
+            ] })
+          ]
+        }
+      );
+    }
+    return /* @__PURE__ */ jsxRuntime.jsxs(
+      "div",
+      {
+        ref,
+        className: utils.cn("flex flex-col gap-2 rounded-xl border border-border bg-background p-3", className),
+        ...props,
+        children: [
+          heading && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-between px-1", children: [
+            /* @__PURE__ */ jsxRuntime.jsx("p", { id: headingId, className: "text-xs font-medium uppercase tracking-wide text-muted-foreground", children: heading }),
+            selected.length > 0 && /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "text-xs text-muted-foreground", children: [
+              selected.length,
+              " selected"
+            ] })
+          ] }),
+          /* @__PURE__ */ jsxRuntime.jsx(
+            "ul",
+            {
+              "aria-labelledby": heading ? headingId : void 0,
+              "aria-label": heading ? void 0 : "Knowledge sources",
+              className: "flex flex-col gap-1",
+              children: sources.map((source) => {
+                const active = selected.includes(source.id);
+                const recover = onRefresh && (source.status === "stale" || source.status === "error") ? /* @__PURE__ */ jsxRuntime.jsx(
+                  button.Button,
+                  {
+                    variant: "ghost",
+                    size: "sm",
+                    onClick: () => onRefresh(source.id),
+                    "aria-label": `${source.status === "error" ? "Retry" : "Refresh"} ${nameText(source.name, source.id)}`,
+                    leftIcon: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.RotateCw, { "aria-hidden": "true", className: "size-3.5" }),
+                    className: "h-7 shrink-0 px-2 text-xs",
+                    children: source.status === "error" ? "Retry" : "Refresh"
+                  }
+                ) : null;
+                return /* @__PURE__ */ jsxRuntime.jsxs("li", { className: "flex items-center gap-1", "data-status": source.status, children: [
+                  /* @__PURE__ */ jsxRuntime.jsxs(
+                    "button",
+                    {
+                      type: "button",
+                      role: "checkbox",
+                      "aria-checked": active,
+                      onClick: () => toggle(source.id),
+                      className: utils.cn(
+                        "flex w-full min-w-0 flex-1 items-center gap-3 rounded-lg border px-3 py-2 text-left transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring",
+                        active ? "border-brand bg-brand-muted/40" : "border-transparent hover:bg-accent"
+                      ),
+                      children: [
+                        /* @__PURE__ */ jsxRuntime.jsx("span", { className: "inline-flex size-8 shrink-0 items-center justify-center rounded-md bg-muted text-muted-foreground [&_svg]:size-4", children: source.icon ?? /* @__PURE__ */ jsxRuntime.jsx(lucideReact.FileText, { "aria-hidden": "true" }) }),
+                        /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "flex min-w-0 flex-1 flex-col", children: [
+                          /* @__PURE__ */ jsxRuntime.jsx("span", { className: "truncate text-sm font-medium text-foreground", children: source.name }),
+                          (source.meta || source.status || source.count != null) && /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "truncate text-xs text-muted-foreground", children: [
+                            source.status && /* @__PURE__ */ jsxRuntime.jsx("span", { className: utils.cn("font-medium", statusTone[source.status]), children: statusWord[source.status] }),
+                            source.status && (source.meta || source.count != null) && " \xB7 ",
+                            source.count != null && `${source.count.toLocaleString()} docs`,
+                            source.count != null && source.meta && " \xB7 ",
+                            source.meta
+                          ] })
+                        ] }),
+                        /* @__PURE__ */ jsxRuntime.jsx(
+                          "span",
+                          {
+                            className: utils.cn(
+                              "inline-flex size-5 shrink-0 items-center justify-center rounded-md border transition-colors [&_svg]:size-3.5",
+                              active ? "border-brand bg-brand text-brand-foreground" : "border-border"
+                            ),
+                            children: active && /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Check, { "aria-hidden": "true" })
+                          }
+                        )
+                      ]
+                    }
+                  ),
+                  recover
+                ] }, source.id);
+              })
+            }
+          ),
+          onAdd && /* @__PURE__ */ jsxRuntime.jsx(button.Button, { variant: "ghost", size: "sm", onClick: onAdd, leftIcon: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Plus, { "aria-hidden": "true", className: "size-4" }), className: "self-start", children: addLabel })
+        ]
+      }
+    );
+  }
+);
+KnowledgeBase.displayName = "KnowledgeBase";
+var KnowledgeBaseSources = React__namespace.forwardRef(
+  ({ sources, baseName, heading, reading = false, className, ...props }, ref) => {
+    const headingId = React__namespace.useId();
+    const n = sources.length;
+    const count = `${n} ${n === 1 ? "source" : "sources"}`;
+    const title = heading ?? (reading ? /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+      "Reading",
+      baseName ? /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+        " ",
+        baseName
+      ] }) : null,
+      "\u2026"
+    ] }) : baseName ? /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+      "Used ",
+      count,
+      " from ",
+      baseName
+    ] }) : count);
+    return /* @__PURE__ */ jsxRuntime.jsxs("div", { ref, className: utils.cn("flex flex-col gap-1.5", className), ...props, children: [
+      /* @__PURE__ */ jsxRuntime.jsxs(
+        "p",
+        {
+          id: headingId,
+          role: "status",
+          "aria-live": "polite",
+          className: "inline-flex items-center gap-1.5 text-xs font-semibold uppercase tracking-wide text-muted-foreground",
+          children: [
+            reading && /* @__PURE__ */ jsxRuntime.jsx(spinner.Spinner, { "aria-hidden": "true", role: void 0, className: "size-3 motion-reduce:animate-none" }),
+            title
+          ]
+        }
+      ),
+      n > 0 && /* @__PURE__ */ jsxRuntime.jsx("ul", { "aria-labelledby": headingId, className: "flex flex-col gap-1", children: sources.map((s) => {
+        const body = /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+          /* @__PURE__ */ jsxRuntime.jsx(lucideReact.FileText, { "aria-hidden": "true", className: "size-3.5 shrink-0 text-muted-foreground" }),
+          /* @__PURE__ */ jsxRuntime.jsx("span", { className: "truncate", children: s.name }),
+          s.section && /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "shrink-0 text-muted-foreground", children: [
+            "\xB7 ",
+            s.section
+          ] })
+        ] });
+        const cls = "flex items-center gap-2 rounded-md bg-muted/60 px-2.5 py-1.5 text-xs text-foreground";
+        return /* @__PURE__ */ jsxRuntime.jsx("li", { children: s.href ? /* @__PURE__ */ jsxRuntime.jsx(
+          "a",
+          {
+            href: s.href,
+            className: utils.cn(cls, "transition-colors hover:bg-accent focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring"),
+            children: body
+          }
+        ) : /* @__PURE__ */ jsxRuntime.jsx("span", { className: cls, children: body }) }, s.id);
+      }) })
+    ] });
+  }
+);
+KnowledgeBaseSources.displayName = "KnowledgeBaseSources";
+var coverage = {
+  high: { word: "Well-covered", icon: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Check, { "aria-hidden": "true", className: "size-3" }), cls: "bg-success/15 text-success" },
+  partial: { word: "Partly covered", icon: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.AlertTriangle, { "aria-hidden": "true", className: "size-3" }), cls: "bg-warning/15 text-warning" },
+  low: { word: "Thin coverage", icon: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.CircleAlert, { "aria-hidden": "true", className: "size-3" }), cls: "bg-destructive/15 text-destructive" }
+};
+var KnowledgeBaseCoverage = React__namespace.forwardRef(
+  ({ level, matches, label, className, ...props }, ref) => {
+    const c = coverage[level];
+    return /* @__PURE__ */ jsxRuntime.jsxs(badge.Badge, { ref, variant: "outline", icon: c.icon, "data-level": level, className: utils.cn("border-transparent", c.cls, className), ...props, children: [
+      label ?? c.word,
+      matches != null && /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "font-normal", children: [
+        "\xB7 ",
+        matches,
+        " ",
+        matches === 1 ? "match" : "matches"
+      ] })
+    ] });
+  }
+);
+KnowledgeBaseCoverage.displayName = "KnowledgeBaseCoverage";
+
+exports.KnowledgeBase = KnowledgeBase;
+exports.KnowledgeBaseCoverage = KnowledgeBaseCoverage;
+exports.KnowledgeBaseSources = KnowledgeBaseSources;
+//# sourceMappingURL=index.cjs.map
+//# sourceMappingURL=index.cjs.map

package/dist/index.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/index.tsx"],"names":["React","jsxs","cn","jsx","Check","Plus","Button","RotateCw","FileText","Fragment","Spinner","AlertTriangle","CircleAlert","Badge"],"mappings":"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","file":"index.cjs","sourcesContent":["import * as React from \"react\";\nimport { cn } from \"@nucleux/utils\";\nimport { Badge } from \"@nucleux/badge\";\nimport { Button } from \"@nucleux/button\";\nimport { Spinner } from \"@nucleux/spinner\";\nimport { AlertTriangle, Check, CircleAlert, FileText, Plus, RotateCw } from \"lucide-react\";\n\n/** Picker layout: a vertical list of rows, or a wrap of chips with document counts. */\nexport type KnowledgeBaseVariant = \"list\" | \"chips\";\n\n/** Whether a source is usable yet, and whether it is still current. */\nexport type KnowledgeSourceStatus = \"ready\" | \"processing\" | \"stale\" | \"error\";\n\n/** How well the knowledge base covers the question. */\nexport type KnowledgeBaseCoverageLevel = \"high\" | \"partial\" | \"low\";\n\nexport interface KnowledgeSource {\n  /** Stable id. */\n  id: string;\n  /** Source name, e.g. a filename. */\n  name: React.ReactNode;\n  /** Metadata line, e.g. `\"PDF · 12 pages\"`. */\n  meta?: React.ReactNode;\n  /** Leading icon. Defaults to a document glyph. */\n  icon?: React.ReactNode;\n  /** Readiness, shown as a word on the row. Omit for plain sources. */\n  status?: KnowledgeSourceStatus;\n  /** Number of documents in the base, shown on chips: `\"Product docs · 412\"`. */\n  count?: number;\n}\n\nexport interface KnowledgeBaseProps\n  extends Omit<React.HTMLAttributes<HTMLDivElement>, \"onChange\"> {\n  /** The available knowledge sources. */\n  sources: KnowledgeSource[];\n  /** Selected source ids (controlled). */\n  value?: string[];\n  /** Initial selection (uncontrolled). */\n  defaultValue?: string[];\n  /** Called when the selection changes. */\n  onValueChange?: (ids: string[]) => void;\n  /** Heading above the list. Defaults to `\"Knowledge sources\"`. */\n  heading?: React.ReactNode;\n  /** Layout. Defaults to `\"list\"`; `\"chips\"` is the compact \"Grounded in\" picker. */\n  variant?: KnowledgeBaseVariant;\n  /** Adds an \"Add a base\" control. */\n  onAdd?: () => void;\n  /** Label for the add control. Defaults to `\"Add a base\"`. */\n  addLabel?: React.ReactNode;\n  /** Recovery for a stale or failed source; renders Refresh / Retry on that row. */\n  onRefresh?: (id: string) => void;\n}\n\nconst statusWord: Record<KnowledgeSourceStatus, string> = {\n  ready: \"Ready\",\n  processing: \"Processing\",\n  stale: \"Needs refresh\",\n  error: \"Couldn't process\",\n};\n\nconst statusTone: Record<KnowledgeSourceStatus, string> = {\n  ready: \"text-success\",\n  processing: \"text-muted-foreground\",\n  stale: \"text-warning\",\n  error: \"text-destructive\",\n};\n\nconst nameText = (n: React.ReactNode, fallback: string) => (typeof n === \"string\" ? n : fallback);\n\n/**\n * Lets people choose which knowledge bases the agent grounds in for this\n * session — a list of checkable rows (default) or a compact wrap of chips with\n * document counts (`variant=\"chips\"`). Each source can carry its readiness as a\n * word (Ready, Processing, Needs refresh, Couldn't process) with the recovery\n * on the row that failed. Pair it with KnowledgeBaseSources (what an answer\n * actually read) and KnowledgeBaseCoverage (how well the base covers it).\n * Source: Figma \"Context Expansion / Knowledge Bases\".\n */\nexport const KnowledgeBase = React.forwardRef<HTMLDivElement, KnowledgeBaseProps>(\n  (\n    {\n      sources,\n      value,\n      defaultValue = [],\n      onValueChange,\n      heading = \"Knowledge sources\",\n      variant = \"list\",\n      onAdd,\n      addLabel = \"Add a base\",\n      onRefresh,\n      className,\n      ...props\n    },\n    ref,\n  ) => {\n    const [internal, setInternal] = React.useState<string[]>(defaultValue);\n    const selected = value !== undefined ? value : internal;\n    const headingId = React.useId();\n    const toggle = (id: string) => {\n      const next = selected.includes(id) ? selected.filter((v) => v !== id) : [...selected, id];\n      if (value === undefined) setInternal(next);\n      onValueChange?.(next);\n    };\n\n    if (variant === \"chips\") {\n      return (\n        <div\n          ref={ref}\n          role=\"group\"\n          aria-labelledby={heading ? headingId : undefined}\n          aria-label={heading ? undefined : \"Knowledge sources\"}\n          className={cn(\"flex flex-col gap-2 rounded-xl border border-border bg-background p-3\", className)}\n          {...props}\n        >\n          {heading && (\n            <p id={headingId} className=\"text-xs font-semibold text-foreground\">\n              {heading}\n            </p>\n          )}\n          <div className=\"flex flex-wrap gap-1.5\">\n            {sources.map((source) => {\n              const active = selected.includes(source.id);\n              return (\n                <button\n                  key={source.id}\n                  type=\"button\"\n                  role=\"checkbox\"\n                  aria-checked={active}\n                  onClick={() => toggle(source.id)}\n                  className={cn(\n                    \"inline-flex items-center gap-1 rounded-full border px-2.5 py-1 text-xs font-medium transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring [&_svg]:size-3\",\n                    active\n                      ? \"border-brand bg-brand-muted/50 text-brand\"\n                      : \"border-border text-muted-foreground hover:bg-accent hover:text-foreground\",\n                  )}\n                >\n                  {active && <Check aria-hidden=\"true\" />}\n                  {source.name}\n                  {source.count != null && <span className=\"font-normal\">· {source.count.toLocaleString()}</span>}\n                  {source.status && source.status !== \"ready\" && (\n                    <span className={cn(\"font-normal\", statusTone[source.status])}>· {statusWord[source.status]}</span>\n                  )}\n                </button>\n              );\n            })}\n            {onAdd && (\n              <button\n                type=\"button\"\n                onClick={onAdd}\n                className=\"inline-flex items-center gap-1 rounded-full border border-dashed border-border px-2.5 py-1 text-xs text-muted-foreground transition-colors hover:bg-accent hover:text-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring [&_svg]:size-3\"\n              >\n                <Plus aria-hidden=\"true\" />\n                {addLabel}\n              </button>\n            )}\n          </div>\n        </div>\n      );\n    }\n\n    return (\n      <div\n        ref={ref}\n        className={cn(\"flex flex-col gap-2 rounded-xl border border-border bg-background p-3\", className)}\n        {...props}\n      >\n        {heading && (\n          <div className=\"flex items-center justify-between px-1\">\n            <p id={headingId} className=\"text-xs font-medium uppercase tracking-wide text-muted-foreground\">\n              {heading}\n            </p>\n            {selected.length > 0 && (\n              <span className=\"text-xs text-muted-foreground\">{selected.length} selected</span>\n            )}\n          </div>\n        )}\n        <ul\n          aria-labelledby={heading ? headingId : undefined}\n          aria-label={heading ? undefined : \"Knowledge sources\"}\n          className=\"flex flex-col gap-1\"\n        >\n          {sources.map((source) => {\n            const active = selected.includes(source.id);\n            const recover =\n              onRefresh && (source.status === \"stale\" || source.status === \"error\") ? (\n                <Button\n                  variant=\"ghost\"\n                  size=\"sm\"\n                  onClick={() => onRefresh(source.id)}\n                  aria-label={`${source.status === \"error\" ? \"Retry\" : \"Refresh\"} ${nameText(source.name, source.id)}`}\n                  leftIcon={<RotateCw aria-hidden=\"true\" className=\"size-3.5\" />}\n                  className=\"h-7 shrink-0 px-2 text-xs\"\n                >\n                  {source.status === \"error\" ? \"Retry\" : \"Refresh\"}\n                </Button>\n              ) : null;\n            return (\n              <li key={source.id} className=\"flex items-center gap-1\" data-status={source.status}>\n                <button\n                  type=\"button\"\n                  role=\"checkbox\"\n                  aria-checked={active}\n                  onClick={() => toggle(source.id)}\n                  className={cn(\n                    \"flex w-full min-w-0 flex-1 items-center gap-3 rounded-lg border px-3 py-2 text-left transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring\",\n                    active ? \"border-brand bg-brand-muted/40\" : \"border-transparent hover:bg-accent\",\n                  )}\n                >\n                  <span className=\"inline-flex size-8 shrink-0 items-center justify-center rounded-md bg-muted text-muted-foreground [&_svg]:size-4\">\n                    {source.icon ?? <FileText aria-hidden=\"true\" />}\n                  </span>\n                  <span className=\"flex min-w-0 flex-1 flex-col\">\n                    <span className=\"truncate text-sm font-medium text-foreground\">{source.name}</span>\n                    {(source.meta || source.status || source.count != null) && (\n                      <span className=\"truncate text-xs text-muted-foreground\">\n                        {source.status && (\n                          <span className={cn(\"font-medium\", statusTone[source.status])}>\n                            {statusWord[source.status]}\n                          </span>\n                        )}\n                        {source.status && (source.meta || source.count != null) && \" · \"}\n                        {source.count != null && `${source.count.toLocaleString()} docs`}\n                        {source.count != null && source.meta && \" · \"}\n                        {source.meta}\n                      </span>\n                    )}\n                  </span>\n                  <span\n                    className={cn(\n                      \"inline-flex size-5 shrink-0 items-center justify-center rounded-md border transition-colors [&_svg]:size-3.5\",\n                      active ? \"border-brand bg-brand text-brand-foreground\" : \"border-border\",\n                    )}\n                  >\n                    {active && <Check aria-hidden=\"true\" />}\n                  </span>\n                </button>\n                {recover}\n              </li>\n            );\n          })}\n        </ul>\n        {onAdd && (\n          <Button variant=\"ghost\" size=\"sm\" onClick={onAdd} leftIcon={<Plus aria-hidden=\"true\" className=\"size-4\" />} className=\"self-start\">\n            {addLabel}\n          </Button>\n        )}\n      </div>\n    );\n  },\n);\nKnowledgeBase.displayName = \"KnowledgeBase\";\n\n/** One document an answer drew on. */\nexport interface KnowledgeBaseSourceRef {\n  /** Stable id. */\n  id: string;\n  /** Document title, e.g. `\"Renewal Playbook v3\"`. */\n  name: React.ReactNode;\n  /** Section the answer came from, e.g. `\"§4.1\"`. */\n  section?: React.ReactNode;\n  /** Link to open the document at that section. */\n  href?: string;\n}\n\nexport interface KnowledgeBaseSourcesProps extends React.HTMLAttributes<HTMLDivElement> {\n  /** The documents the answer read. */\n  sources: KnowledgeBaseSourceRef[];\n  /** The base they came from, for the heading: \"Used 3 sources from Sales playbook\". */\n  baseName?: React.ReactNode;\n  /** Heading override. Defaults to `\"N sources\"` (or the base sentence). */\n  heading?: React.ReactNode;\n  /** The agent is reading right now: shows \"Reading…\" and announces it. */\n  reading?: boolean;\n}\n\n/**\n * The source list shown under an answer: exactly which knowledge-base\n * documents (and sections) the agent read, so the answer can be checked.\n * While `reading` it says so — politely announced — and swaps to provenance\n * when the answer finishes.\n */\nexport const KnowledgeBaseSources = React.forwardRef<HTMLDivElement, KnowledgeBaseSourcesProps>(\n  ({ sources, baseName, heading, reading = false, className, ...props }, ref) => {\n    const headingId = React.useId();\n    const n = sources.length;\n    const count = `${n} ${n === 1 ? \"source\" : \"sources\"}`;\n    const title =\n      heading ??\n      (reading ? (\n        <>Reading{baseName ? <> {baseName}</> : null}…</>\n      ) : baseName ? (\n        <>\n          Used {count} from {baseName}\n        </>\n      ) : (\n        count\n      ));\n    return (\n      <div ref={ref} className={cn(\"flex flex-col gap-1.5\", className)} {...props}>\n        <p\n          id={headingId}\n          role=\"status\"\n          aria-live=\"polite\"\n          className=\"inline-flex items-center gap-1.5 text-xs font-semibold uppercase tracking-wide text-muted-foreground\"\n        >\n          {reading && <Spinner aria-hidden=\"true\" role={undefined} className=\"size-3 motion-reduce:animate-none\" />}\n          {title}\n        </p>\n        {n > 0 && (\n          <ul aria-labelledby={headingId} className=\"flex flex-col gap-1\">\n            {sources.map((s) => {\n              const body = (\n                <>\n                  <FileText aria-hidden=\"true\" className=\"size-3.5 shrink-0 text-muted-foreground\" />\n                  <span className=\"truncate\">{s.name}</span>\n                  {s.section && <span className=\"shrink-0 text-muted-foreground\">· {s.section}</span>}\n                </>\n              );\n              const cls =\n                \"flex items-center gap-2 rounded-md bg-muted/60 px-2.5 py-1.5 text-xs text-foreground\";\n              return (\n                <li key={s.id}>\n                  {s.href ? (\n                    <a\n                      href={s.href}\n                      className={cn(cls, \"transition-colors hover:bg-accent focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring\")}\n                    >\n                      {body}\n                    </a>\n                  ) : (\n                    <span className={cls}>{body}</span>\n                  )}\n                </li>\n              );\n            })}\n          </ul>\n        )}\n      </div>\n    );\n  },\n);\nKnowledgeBaseSources.displayName = \"KnowledgeBaseSources\";\n\nexport interface KnowledgeBaseCoverageProps extends React.HTMLAttributes<HTMLSpanElement> {\n  /** How well the base covers the question. */\n  level: KnowledgeBaseCoverageLevel;\n  /** Number of matching passages, e.g. `14`. */\n  matches?: number;\n  /** Label override. Defaults to \"Well-covered\", \"Partly covered\" or \"Thin coverage\". */\n  label?: React.ReactNode;\n}\n\nconst coverage: Record<KnowledgeBaseCoverageLevel, { word: string; icon: React.ReactNode; cls: string }> = {\n  high: { word: \"Well-covered\", icon: <Check aria-hidden=\"true\" className=\"size-3\" />, cls: \"bg-success/15 text-success\" },\n  partial: { word: \"Partly covered\", icon: <AlertTriangle aria-hidden=\"true\" className=\"size-3\" />, cls: \"bg-warning/15 text-warning\" },\n  low: { word: \"Thin coverage\", icon: <CircleAlert aria-hidden=\"true\" className=\"size-3\" />, cls: \"bg-destructive/15 text-destructive\" },\n};\n\n/**\n * A small badge saying how well the knowledge base covers the question —\n * \"Well-covered · 14 matches\", or a warning when context is thin. The word\n * carries the meaning; colour only reinforces it.\n */\nexport const KnowledgeBaseCoverage = React.forwardRef<HTMLSpanElement, KnowledgeBaseCoverageProps>(\n  ({ level, matches, label, className, ...props }, ref) => {\n    const c = coverage[level];\n    return (\n      <Badge ref={ref} variant=\"outline\" icon={c.icon} data-level={level} className={cn(\"border-transparent\", c.cls, className)} {...props}>\n        {label ?? c.word}\n        {matches != null && <span className=\"font-normal\">· {matches} {matches === 1 ? \"match\" : \"matches\"}</span>}\n      </Badge>\n    );\n  },\n);\nKnowledgeBaseCoverage.displayName = \"KnowledgeBaseCoverage\";\n"]}

package/dist/index.d.cts

@@ -0,0 +1,96 @@
+import * as React from 'react';
+
+/** Picker layout: a vertical list of rows, or a wrap of chips with document counts. */
+type KnowledgeBaseVariant = "list" | "chips";
+/** Whether a source is usable yet, and whether it is still current. */
+type KnowledgeSourceStatus = "ready" | "processing" | "stale" | "error";
+/** How well the knowledge base covers the question. */
+type KnowledgeBaseCoverageLevel = "high" | "partial" | "low";
+interface KnowledgeSource {
+    /** Stable id. */
+    id: string;
+    /** Source name, e.g. a filename. */
+    name: React.ReactNode;
+    /** Metadata line, e.g. `"PDF · 12 pages"`. */
+    meta?: React.ReactNode;
+    /** Leading icon. Defaults to a document glyph. */
+    icon?: React.ReactNode;
+    /** Readiness, shown as a word on the row. Omit for plain sources. */
+    status?: KnowledgeSourceStatus;
+    /** Number of documents in the base, shown on chips: `"Product docs · 412"`. */
+    count?: number;
+}
+interface KnowledgeBaseProps extends Omit<React.HTMLAttributes<HTMLDivElement>, "onChange"> {
+    /** The available knowledge sources. */
+    sources: KnowledgeSource[];
+    /** Selected source ids (controlled). */
+    value?: string[];
+    /** Initial selection (uncontrolled). */
+    defaultValue?: string[];
+    /** Called when the selection changes. */
+    onValueChange?: (ids: string[]) => void;
+    /** Heading above the list. Defaults to `"Knowledge sources"`. */
+    heading?: React.ReactNode;
+    /** Layout. Defaults to `"list"`; `"chips"` is the compact "Grounded in" picker. */
+    variant?: KnowledgeBaseVariant;
+    /** Adds an "Add a base" control. */
+    onAdd?: () => void;
+    /** Label for the add control. Defaults to `"Add a base"`. */
+    addLabel?: React.ReactNode;
+    /** Recovery for a stale or failed source; renders Refresh / Retry on that row. */
+    onRefresh?: (id: string) => void;
+}
+/**
+ * Lets people choose which knowledge bases the agent grounds in for this
+ * session — a list of checkable rows (default) or a compact wrap of chips with
+ * document counts (`variant="chips"`). Each source can carry its readiness as a
+ * word (Ready, Processing, Needs refresh, Couldn't process) with the recovery
+ * on the row that failed. Pair it with KnowledgeBaseSources (what an answer
+ * actually read) and KnowledgeBaseCoverage (how well the base covers it).
+ * Source: Figma "Context Expansion / Knowledge Bases".
+ */
+declare const KnowledgeBase: React.ForwardRefExoticComponent<KnowledgeBaseProps & React.RefAttributes<HTMLDivElement>>;
+/** One document an answer drew on. */
+interface KnowledgeBaseSourceRef {
+    /** Stable id. */
+    id: string;
+    /** Document title, e.g. `"Renewal Playbook v3"`. */
+    name: React.ReactNode;
+    /** Section the answer came from, e.g. `"§4.1"`. */
+    section?: React.ReactNode;
+    /** Link to open the document at that section. */
+    href?: string;
+}
+interface KnowledgeBaseSourcesProps extends React.HTMLAttributes<HTMLDivElement> {
+    /** The documents the answer read. */
+    sources: KnowledgeBaseSourceRef[];
+    /** The base they came from, for the heading: "Used 3 sources from Sales playbook". */
+    baseName?: React.ReactNode;
+    /** Heading override. Defaults to `"N sources"` (or the base sentence). */
+    heading?: React.ReactNode;
+    /** The agent is reading right now: shows "Reading…" and announces it. */
+    reading?: boolean;
+}
+/**
+ * The source list shown under an answer: exactly which knowledge-base
+ * documents (and sections) the agent read, so the answer can be checked.
+ * While `reading` it says so — politely announced — and swaps to provenance
+ * when the answer finishes.
+ */
+declare const KnowledgeBaseSources: React.ForwardRefExoticComponent<KnowledgeBaseSourcesProps & React.RefAttributes<HTMLDivElement>>;
+interface KnowledgeBaseCoverageProps extends React.HTMLAttributes<HTMLSpanElement> {
+    /** How well the base covers the question. */
+    level: KnowledgeBaseCoverageLevel;
+    /** Number of matching passages, e.g. `14`. */
+    matches?: number;
+    /** Label override. Defaults to "Well-covered", "Partly covered" or "Thin coverage". */
+    label?: React.ReactNode;
+}
+/**
+ * A small badge saying how well the knowledge base covers the question —
+ * "Well-covered · 14 matches", or a warning when context is thin. The word
+ * carries the meaning; colour only reinforces it.
+ */
+declare const KnowledgeBaseCoverage: React.ForwardRefExoticComponent<KnowledgeBaseCoverageProps & React.RefAttributes<HTMLSpanElement>>;
+
+export { KnowledgeBase, KnowledgeBaseCoverage, type KnowledgeBaseCoverageLevel, type KnowledgeBaseCoverageProps, type KnowledgeBaseProps, type KnowledgeBaseSourceRef, KnowledgeBaseSources, type KnowledgeBaseSourcesProps, type KnowledgeBaseVariant, type KnowledgeSource, type KnowledgeSourceStatus };

package/dist/index.d.ts

@@ -0,0 +1,96 @@
+import * as React from 'react';
+
+/** Picker layout: a vertical list of rows, or a wrap of chips with document counts. */
+type KnowledgeBaseVariant = "list" | "chips";
+/** Whether a source is usable yet, and whether it is still current. */
+type KnowledgeSourceStatus = "ready" | "processing" | "stale" | "error";
+/** How well the knowledge base covers the question. */
+type KnowledgeBaseCoverageLevel = "high" | "partial" | "low";
+interface KnowledgeSource {
+    /** Stable id. */
+    id: string;
+    /** Source name, e.g. a filename. */
+    name: React.ReactNode;
+    /** Metadata line, e.g. `"PDF · 12 pages"`. */
+    meta?: React.ReactNode;
+    /** Leading icon. Defaults to a document glyph. */
+    icon?: React.ReactNode;
+    /** Readiness, shown as a word on the row. Omit for plain sources. */
+    status?: KnowledgeSourceStatus;
+    /** Number of documents in the base, shown on chips: `"Product docs · 412"`. */
+    count?: number;
+}
+interface KnowledgeBaseProps extends Omit<React.HTMLAttributes<HTMLDivElement>, "onChange"> {
+    /** The available knowledge sources. */
+    sources: KnowledgeSource[];
+    /** Selected source ids (controlled). */
+    value?: string[];
+    /** Initial selection (uncontrolled). */
+    defaultValue?: string[];
+    /** Called when the selection changes. */
+    onValueChange?: (ids: string[]) => void;
+    /** Heading above the list. Defaults to `"Knowledge sources"`. */
+    heading?: React.ReactNode;
+    /** Layout. Defaults to `"list"`; `"chips"` is the compact "Grounded in" picker. */
+    variant?: KnowledgeBaseVariant;
+    /** Adds an "Add a base" control. */
+    onAdd?: () => void;
+    /** Label for the add control. Defaults to `"Add a base"`. */
+    addLabel?: React.ReactNode;
+    /** Recovery for a stale or failed source; renders Refresh / Retry on that row. */
+    onRefresh?: (id: string) => void;
+}
+/**
+ * Lets people choose which knowledge bases the agent grounds in for this
+ * session — a list of checkable rows (default) or a compact wrap of chips with
+ * document counts (`variant="chips"`). Each source can carry its readiness as a
+ * word (Ready, Processing, Needs refresh, Couldn't process) with the recovery
+ * on the row that failed. Pair it with KnowledgeBaseSources (what an answer
+ * actually read) and KnowledgeBaseCoverage (how well the base covers it).
+ * Source: Figma "Context Expansion / Knowledge Bases".
+ */
+declare const KnowledgeBase: React.ForwardRefExoticComponent<KnowledgeBaseProps & React.RefAttributes<HTMLDivElement>>;
+/** One document an answer drew on. */
+interface KnowledgeBaseSourceRef {
+    /** Stable id. */
+    id: string;
+    /** Document title, e.g. `"Renewal Playbook v3"`. */
+    name: React.ReactNode;
+    /** Section the answer came from, e.g. `"§4.1"`. */
+    section?: React.ReactNode;
+    /** Link to open the document at that section. */
+    href?: string;
+}
+interface KnowledgeBaseSourcesProps extends React.HTMLAttributes<HTMLDivElement> {
+    /** The documents the answer read. */
+    sources: KnowledgeBaseSourceRef[];
+    /** The base they came from, for the heading: "Used 3 sources from Sales playbook". */
+    baseName?: React.ReactNode;
+    /** Heading override. Defaults to `"N sources"` (or the base sentence). */
+    heading?: React.ReactNode;
+    /** The agent is reading right now: shows "Reading…" and announces it. */
+    reading?: boolean;
+}
+/**
+ * The source list shown under an answer: exactly which knowledge-base
+ * documents (and sections) the agent read, so the answer can be checked.
+ * While `reading` it says so — politely announced — and swaps to provenance
+ * when the answer finishes.
+ */
+declare const KnowledgeBaseSources: React.ForwardRefExoticComponent<KnowledgeBaseSourcesProps & React.RefAttributes<HTMLDivElement>>;
+interface KnowledgeBaseCoverageProps extends React.HTMLAttributes<HTMLSpanElement> {
+    /** How well the base covers the question. */
+    level: KnowledgeBaseCoverageLevel;
+    /** Number of matching passages, e.g. `14`. */
+    matches?: number;
+    /** Label override. Defaults to "Well-covered", "Partly covered" or "Thin coverage". */
+    label?: React.ReactNode;
+}
+/**
+ * A small badge saying how well the knowledge base covers the question —
+ * "Well-covered · 14 matches", or a warning when context is thin. The word
+ * carries the meaning; colour only reinforces it.
+ */
+declare const KnowledgeBaseCoverage: React.ForwardRefExoticComponent<KnowledgeBaseCoverageProps & React.RefAttributes<HTMLSpanElement>>;
+
+export { KnowledgeBase, KnowledgeBaseCoverage, type KnowledgeBaseCoverageLevel, type KnowledgeBaseCoverageProps, type KnowledgeBaseProps, type KnowledgeBaseSourceRef, KnowledgeBaseSources, type KnowledgeBaseSourcesProps, type KnowledgeBaseVariant, type KnowledgeSource, type KnowledgeSourceStatus };

package/dist/index.js

@@ -0,0 +1,266 @@
+"use client";
+import * as React from 'react';
+import { cn } from '@nucleux/utils';
+import { Badge } from '@nucleux/badge';
+import { Button } from '@nucleux/button';
+import { Spinner } from '@nucleux/spinner';
+import { Check, Plus, RotateCw, FileText, CircleAlert, AlertTriangle } from 'lucide-react';
+import { jsxs, jsx, Fragment } from 'react/jsx-runtime';
+
+// src/index.tsx
+var statusWord = {
+  ready: "Ready",
+  processing: "Processing",
+  stale: "Needs refresh",
+  error: "Couldn't process"
+};
+var statusTone = {
+  ready: "text-success",
+  processing: "text-muted-foreground",
+  stale: "text-warning",
+  error: "text-destructive"
+};
+var nameText = (n, fallback) => typeof n === "string" ? n : fallback;
+var KnowledgeBase = React.forwardRef(
+  ({
+    sources,
+    value,
+    defaultValue = [],
+    onValueChange,
+    heading = "Knowledge sources",
+    variant = "list",
+    onAdd,
+    addLabel = "Add a base",
+    onRefresh,
+    className,
+    ...props
+  }, ref) => {
+    const [internal, setInternal] = React.useState(defaultValue);
+    const selected = value !== void 0 ? value : internal;
+    const headingId = React.useId();
+    const toggle = (id) => {
+      const next = selected.includes(id) ? selected.filter((v) => v !== id) : [...selected, id];
+      if (value === void 0) setInternal(next);
+      onValueChange?.(next);
+    };
+    if (variant === "chips") {
+      return /* @__PURE__ */ jsxs(
+        "div",
+        {
+          ref,
+          role: "group",
+          "aria-labelledby": heading ? headingId : void 0,
+          "aria-label": heading ? void 0 : "Knowledge sources",
+          className: cn("flex flex-col gap-2 rounded-xl border border-border bg-background p-3", className),
+          ...props,
+          children: [
+            heading && /* @__PURE__ */ jsx("p", { id: headingId, className: "text-xs font-semibold text-foreground", children: heading }),
+            /* @__PURE__ */ jsxs("div", { className: "flex flex-wrap gap-1.5", children: [
+              sources.map((source) => {
+                const active = selected.includes(source.id);
+                return /* @__PURE__ */ jsxs(
+                  "button",
+                  {
+                    type: "button",
+                    role: "checkbox",
+                    "aria-checked": active,
+                    onClick: () => toggle(source.id),
+                    className: cn(
+                      "inline-flex items-center gap-1 rounded-full border px-2.5 py-1 text-xs font-medium transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring [&_svg]:size-3",
+                      active ? "border-brand bg-brand-muted/50 text-brand" : "border-border text-muted-foreground hover:bg-accent hover:text-foreground"
+                    ),
+                    children: [
+                      active && /* @__PURE__ */ jsx(Check, { "aria-hidden": "true" }),
+                      source.name,
+                      source.count != null && /* @__PURE__ */ jsxs("span", { className: "font-normal", children: [
+                        "\xB7 ",
+                        source.count.toLocaleString()
+                      ] }),
+                      source.status && source.status !== "ready" && /* @__PURE__ */ jsxs("span", { className: cn("font-normal", statusTone[source.status]), children: [
+                        "\xB7 ",
+                        statusWord[source.status]
+                      ] })
+                    ]
+                  },
+                  source.id
+                );
+              }),
+              onAdd && /* @__PURE__ */ jsxs(
+                "button",
+                {
+                  type: "button",
+                  onClick: onAdd,
+                  className: "inline-flex items-center gap-1 rounded-full border border-dashed border-border px-2.5 py-1 text-xs text-muted-foreground transition-colors hover:bg-accent hover:text-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring [&_svg]:size-3",
+                  children: [
+                    /* @__PURE__ */ jsx(Plus, { "aria-hidden": "true" }),
+                    addLabel
+                  ]
+                }
+              )
+            ] })
+          ]
+        }
+      );
+    }
+    return /* @__PURE__ */ jsxs(
+      "div",
+      {
+        ref,
+        className: cn("flex flex-col gap-2 rounded-xl border border-border bg-background p-3", className),
+        ...props,
+        children: [
+          heading && /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between px-1", children: [
+            /* @__PURE__ */ jsx("p", { id: headingId, className: "text-xs font-medium uppercase tracking-wide text-muted-foreground", children: heading }),
+            selected.length > 0 && /* @__PURE__ */ jsxs("span", { className: "text-xs text-muted-foreground", children: [
+              selected.length,
+              " selected"
+            ] })
+          ] }),
+          /* @__PURE__ */ jsx(
+            "ul",
+            {
+              "aria-labelledby": heading ? headingId : void 0,
+              "aria-label": heading ? void 0 : "Knowledge sources",
+              className: "flex flex-col gap-1",
+              children: sources.map((source) => {
+                const active = selected.includes(source.id);
+                const recover = onRefresh && (source.status === "stale" || source.status === "error") ? /* @__PURE__ */ jsx(
+                  Button,
+                  {
+                    variant: "ghost",
+                    size: "sm",
+                    onClick: () => onRefresh(source.id),
+                    "aria-label": `${source.status === "error" ? "Retry" : "Refresh"} ${nameText(source.name, source.id)}`,
+                    leftIcon: /* @__PURE__ */ jsx(RotateCw, { "aria-hidden": "true", className: "size-3.5" }),
+                    className: "h-7 shrink-0 px-2 text-xs",
+                    children: source.status === "error" ? "Retry" : "Refresh"
+                  }
+                ) : null;
+                return /* @__PURE__ */ jsxs("li", { className: "flex items-center gap-1", "data-status": source.status, children: [
+                  /* @__PURE__ */ jsxs(
+                    "button",
+                    {
+                      type: "button",
+                      role: "checkbox",
+                      "aria-checked": active,
+                      onClick: () => toggle(source.id),
+                      className: cn(
+                        "flex w-full min-w-0 flex-1 items-center gap-3 rounded-lg border px-3 py-2 text-left transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring",
+                        active ? "border-brand bg-brand-muted/40" : "border-transparent hover:bg-accent"
+                      ),
+                      children: [
+                        /* @__PURE__ */ jsx("span", { className: "inline-flex size-8 shrink-0 items-center justify-center rounded-md bg-muted text-muted-foreground [&_svg]:size-4", children: source.icon ?? /* @__PURE__ */ jsx(FileText, { "aria-hidden": "true" }) }),
+                        /* @__PURE__ */ jsxs("span", { className: "flex min-w-0 flex-1 flex-col", children: [
+                          /* @__PURE__ */ jsx("span", { className: "truncate text-sm font-medium text-foreground", children: source.name }),
+                          (source.meta || source.status || source.count != null) && /* @__PURE__ */ jsxs("span", { className: "truncate text-xs text-muted-foreground", children: [
+                            source.status && /* @__PURE__ */ jsx("span", { className: cn("font-medium", statusTone[source.status]), children: statusWord[source.status] }),
+                            source.status && (source.meta || source.count != null) && " \xB7 ",
+                            source.count != null && `${source.count.toLocaleString()} docs`,
+                            source.count != null && source.meta && " \xB7 ",
+                            source.meta
+                          ] })
+                        ] }),
+                        /* @__PURE__ */ jsx(
+                          "span",
+                          {
+                            className: cn(
+                              "inline-flex size-5 shrink-0 items-center justify-center rounded-md border transition-colors [&_svg]:size-3.5",
+                              active ? "border-brand bg-brand text-brand-foreground" : "border-border"
+                            ),
+                            children: active && /* @__PURE__ */ jsx(Check, { "aria-hidden": "true" })
+                          }
+                        )
+                      ]
+                    }
+                  ),
+                  recover
+                ] }, source.id);
+              })
+            }
+          ),
+          onAdd && /* @__PURE__ */ jsx(Button, { variant: "ghost", size: "sm", onClick: onAdd, leftIcon: /* @__PURE__ */ jsx(Plus, { "aria-hidden": "true", className: "size-4" }), className: "self-start", children: addLabel })
+        ]
+      }
+    );
+  }
+);
+KnowledgeBase.displayName = "KnowledgeBase";
+var KnowledgeBaseSources = React.forwardRef(
+  ({ sources, baseName, heading, reading = false, className, ...props }, ref) => {
+    const headingId = React.useId();
+    const n = sources.length;
+    const count = `${n} ${n === 1 ? "source" : "sources"}`;
+    const title = heading ?? (reading ? /* @__PURE__ */ jsxs(Fragment, { children: [
+      "Reading",
+      baseName ? /* @__PURE__ */ jsxs(Fragment, { children: [
+        " ",
+        baseName
+      ] }) : null,
+      "\u2026"
+    ] }) : baseName ? /* @__PURE__ */ jsxs(Fragment, { children: [
+      "Used ",
+      count,
+      " from ",
+      baseName
+    ] }) : count);
+    return /* @__PURE__ */ jsxs("div", { ref, className: cn("flex flex-col gap-1.5", className), ...props, children: [
+      /* @__PURE__ */ jsxs(
+        "p",
+        {
+          id: headingId,
+          role: "status",
+          "aria-live": "polite",
+          className: "inline-flex items-center gap-1.5 text-xs font-semibold uppercase tracking-wide text-muted-foreground",
+          children: [
+            reading && /* @__PURE__ */ jsx(Spinner, { "aria-hidden": "true", role: void 0, className: "size-3 motion-reduce:animate-none" }),
+            title
+          ]
+        }
+      ),
+      n > 0 && /* @__PURE__ */ jsx("ul", { "aria-labelledby": headingId, className: "flex flex-col gap-1", children: sources.map((s) => {
+        const body = /* @__PURE__ */ jsxs(Fragment, { children: [
+          /* @__PURE__ */ jsx(FileText, { "aria-hidden": "true", className: "size-3.5 shrink-0 text-muted-foreground" }),
+          /* @__PURE__ */ jsx("span", { className: "truncate", children: s.name }),
+          s.section && /* @__PURE__ */ jsxs("span", { className: "shrink-0 text-muted-foreground", children: [
+            "\xB7 ",
+            s.section
+          ] })
+        ] });
+        const cls = "flex items-center gap-2 rounded-md bg-muted/60 px-2.5 py-1.5 text-xs text-foreground";
+        return /* @__PURE__ */ jsx("li", { children: s.href ? /* @__PURE__ */ jsx(
+          "a",
+          {
+            href: s.href,
+            className: cn(cls, "transition-colors hover:bg-accent focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring"),
+            children: body
+          }
+        ) : /* @__PURE__ */ jsx("span", { className: cls, children: body }) }, s.id);
+      }) })
+    ] });
+  }
+);
+KnowledgeBaseSources.displayName = "KnowledgeBaseSources";
+var coverage = {
+  high: { word: "Well-covered", icon: /* @__PURE__ */ jsx(Check, { "aria-hidden": "true", className: "size-3" }), cls: "bg-success/15 text-success" },
+  partial: { word: "Partly covered", icon: /* @__PURE__ */ jsx(AlertTriangle, { "aria-hidden": "true", className: "size-3" }), cls: "bg-warning/15 text-warning" },
+  low: { word: "Thin coverage", icon: /* @__PURE__ */ jsx(CircleAlert, { "aria-hidden": "true", className: "size-3" }), cls: "bg-destructive/15 text-destructive" }
+};
+var KnowledgeBaseCoverage = React.forwardRef(
+  ({ level, matches, label, className, ...props }, ref) => {
+    const c = coverage[level];
+    return /* @__PURE__ */ jsxs(Badge, { ref, variant: "outline", icon: c.icon, "data-level": level, className: cn("border-transparent", c.cls, className), ...props, children: [
+      label ?? c.word,
+      matches != null && /* @__PURE__ */ jsxs("span", { className: "font-normal", children: [
+        "\xB7 ",
+        matches,
+        " ",
+        matches === 1 ? "match" : "matches"
+      ] })
+    ] });
+  }
+);
+KnowledgeBaseCoverage.displayName = "KnowledgeBaseCoverage";
+
+export { KnowledgeBase, KnowledgeBaseCoverage, KnowledgeBaseSources };
+//# sourceMappingURL=index.js.map
+//# sourceMappingURL=index.js.map

package/dist/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/index.tsx"],"names":[],"mappings":"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","file":"index.js","sourcesContent":["import * as React from \"react\";\nimport { cn } from \"@nucleux/utils\";\nimport { Badge } from \"@nucleux/badge\";\nimport { Button } from \"@nucleux/button\";\nimport { Spinner } from \"@nucleux/spinner\";\nimport { AlertTriangle, Check, CircleAlert, FileText, Plus, RotateCw } from \"lucide-react\";\n\n/** Picker layout: a vertical list of rows, or a wrap of chips with document counts. */\nexport type KnowledgeBaseVariant = \"list\" | \"chips\";\n\n/** Whether a source is usable yet, and whether it is still current. */\nexport type KnowledgeSourceStatus = \"ready\" | \"processing\" | \"stale\" | \"error\";\n\n/** How well the knowledge base covers the question. */\nexport type KnowledgeBaseCoverageLevel = \"high\" | \"partial\" | \"low\";\n\nexport interface KnowledgeSource {\n  /** Stable id. */\n  id: string;\n  /** Source name, e.g. a filename. */\n  name: React.ReactNode;\n  /** Metadata line, e.g. `\"PDF · 12 pages\"`. */\n  meta?: React.ReactNode;\n  /** Leading icon. Defaults to a document glyph. */\n  icon?: React.ReactNode;\n  /** Readiness, shown as a word on the row. Omit for plain sources. */\n  status?: KnowledgeSourceStatus;\n  /** Number of documents in the base, shown on chips: `\"Product docs · 412\"`. */\n  count?: number;\n}\n\nexport interface KnowledgeBaseProps\n  extends Omit<React.HTMLAttributes<HTMLDivElement>, \"onChange\"> {\n  /** The available knowledge sources. */\n  sources: KnowledgeSource[];\n  /** Selected source ids (controlled). */\n  value?: string[];\n  /** Initial selection (uncontrolled). */\n  defaultValue?: string[];\n  /** Called when the selection changes. */\n  onValueChange?: (ids: string[]) => void;\n  /** Heading above the list. Defaults to `\"Knowledge sources\"`. */\n  heading?: React.ReactNode;\n  /** Layout. Defaults to `\"list\"`; `\"chips\"` is the compact \"Grounded in\" picker. */\n  variant?: KnowledgeBaseVariant;\n  /** Adds an \"Add a base\" control. */\n  onAdd?: () => void;\n  /** Label for the add control. Defaults to `\"Add a base\"`. */\n  addLabel?: React.ReactNode;\n  /** Recovery for a stale or failed source; renders Refresh / Retry on that row. */\n  onRefresh?: (id: string) => void;\n}\n\nconst statusWord: Record<KnowledgeSourceStatus, string> = {\n  ready: \"Ready\",\n  processing: \"Processing\",\n  stale: \"Needs refresh\",\n  error: \"Couldn't process\",\n};\n\nconst statusTone: Record<KnowledgeSourceStatus, string> = {\n  ready: \"text-success\",\n  processing: \"text-muted-foreground\",\n  stale: \"text-warning\",\n  error: \"text-destructive\",\n};\n\nconst nameText = (n: React.ReactNode, fallback: string) => (typeof n === \"string\" ? n : fallback);\n\n/**\n * Lets people choose which knowledge bases the agent grounds in for this\n * session — a list of checkable rows (default) or a compact wrap of chips with\n * document counts (`variant=\"chips\"`). Each source can carry its readiness as a\n * word (Ready, Processing, Needs refresh, Couldn't process) with the recovery\n * on the row that failed. Pair it with KnowledgeBaseSources (what an answer\n * actually read) and KnowledgeBaseCoverage (how well the base covers it).\n * Source: Figma \"Context Expansion / Knowledge Bases\".\n */\nexport const KnowledgeBase = React.forwardRef<HTMLDivElement, KnowledgeBaseProps>(\n  (\n    {\n      sources,\n      value,\n      defaultValue = [],\n      onValueChange,\n      heading = \"Knowledge sources\",\n      variant = \"list\",\n      onAdd,\n      addLabel = \"Add a base\",\n      onRefresh,\n      className,\n      ...props\n    },\n    ref,\n  ) => {\n    const [internal, setInternal] = React.useState<string[]>(defaultValue);\n    const selected = value !== undefined ? value : internal;\n    const headingId = React.useId();\n    const toggle = (id: string) => {\n      const next = selected.includes(id) ? selected.filter((v) => v !== id) : [...selected, id];\n      if (value === undefined) setInternal(next);\n      onValueChange?.(next);\n    };\n\n    if (variant === \"chips\") {\n      return (\n        <div\n          ref={ref}\n          role=\"group\"\n          aria-labelledby={heading ? headingId : undefined}\n          aria-label={heading ? undefined : \"Knowledge sources\"}\n          className={cn(\"flex flex-col gap-2 rounded-xl border border-border bg-background p-3\", className)}\n          {...props}\n        >\n          {heading && (\n            <p id={headingId} className=\"text-xs font-semibold text-foreground\">\n              {heading}\n            </p>\n          )}\n          <div className=\"flex flex-wrap gap-1.5\">\n            {sources.map((source) => {\n              const active = selected.includes(source.id);\n              return (\n                <button\n                  key={source.id}\n                  type=\"button\"\n                  role=\"checkbox\"\n                  aria-checked={active}\n                  onClick={() => toggle(source.id)}\n                  className={cn(\n                    \"inline-flex items-center gap-1 rounded-full border px-2.5 py-1 text-xs font-medium transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring [&_svg]:size-3\",\n                    active\n                      ? \"border-brand bg-brand-muted/50 text-brand\"\n                      : \"border-border text-muted-foreground hover:bg-accent hover:text-foreground\",\n                  )}\n                >\n                  {active && <Check aria-hidden=\"true\" />}\n                  {source.name}\n                  {source.count != null && <span className=\"font-normal\">· {source.count.toLocaleString()}</span>}\n                  {source.status && source.status !== \"ready\" && (\n                    <span className={cn(\"font-normal\", statusTone[source.status])}>· {statusWord[source.status]}</span>\n                  )}\n                </button>\n              );\n            })}\n            {onAdd && (\n              <button\n                type=\"button\"\n                onClick={onAdd}\n                className=\"inline-flex items-center gap-1 rounded-full border border-dashed border-border px-2.5 py-1 text-xs text-muted-foreground transition-colors hover:bg-accent hover:text-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring [&_svg]:size-3\"\n              >\n                <Plus aria-hidden=\"true\" />\n                {addLabel}\n              </button>\n            )}\n          </div>\n        </div>\n      );\n    }\n\n    return (\n      <div\n        ref={ref}\n        className={cn(\"flex flex-col gap-2 rounded-xl border border-border bg-background p-3\", className)}\n        {...props}\n      >\n        {heading && (\n          <div className=\"flex items-center justify-between px-1\">\n            <p id={headingId} className=\"text-xs font-medium uppercase tracking-wide text-muted-foreground\">\n              {heading}\n            </p>\n            {selected.length > 0 && (\n              <span className=\"text-xs text-muted-foreground\">{selected.length} selected</span>\n            )}\n          </div>\n        )}\n        <ul\n          aria-labelledby={heading ? headingId : undefined}\n          aria-label={heading ? undefined : \"Knowledge sources\"}\n          className=\"flex flex-col gap-1\"\n        >\n          {sources.map((source) => {\n            const active = selected.includes(source.id);\n            const recover =\n              onRefresh && (source.status === \"stale\" || source.status === \"error\") ? (\n                <Button\n                  variant=\"ghost\"\n                  size=\"sm\"\n                  onClick={() => onRefresh(source.id)}\n                  aria-label={`${source.status === \"error\" ? \"Retry\" : \"Refresh\"} ${nameText(source.name, source.id)}`}\n                  leftIcon={<RotateCw aria-hidden=\"true\" className=\"size-3.5\" />}\n                  className=\"h-7 shrink-0 px-2 text-xs\"\n                >\n                  {source.status === \"error\" ? \"Retry\" : \"Refresh\"}\n                </Button>\n              ) : null;\n            return (\n              <li key={source.id} className=\"flex items-center gap-1\" data-status={source.status}>\n                <button\n                  type=\"button\"\n                  role=\"checkbox\"\n                  aria-checked={active}\n                  onClick={() => toggle(source.id)}\n                  className={cn(\n                    \"flex w-full min-w-0 flex-1 items-center gap-3 rounded-lg border px-3 py-2 text-left transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring\",\n                    active ? \"border-brand bg-brand-muted/40\" : \"border-transparent hover:bg-accent\",\n                  )}\n                >\n                  <span className=\"inline-flex size-8 shrink-0 items-center justify-center rounded-md bg-muted text-muted-foreground [&_svg]:size-4\">\n                    {source.icon ?? <FileText aria-hidden=\"true\" />}\n                  </span>\n                  <span className=\"flex min-w-0 flex-1 flex-col\">\n                    <span className=\"truncate text-sm font-medium text-foreground\">{source.name}</span>\n                    {(source.meta || source.status || source.count != null) && (\n                      <span className=\"truncate text-xs text-muted-foreground\">\n                        {source.status && (\n                          <span className={cn(\"font-medium\", statusTone[source.status])}>\n                            {statusWord[source.status]}\n                          </span>\n                        )}\n                        {source.status && (source.meta || source.count != null) && \" · \"}\n                        {source.count != null && `${source.count.toLocaleString()} docs`}\n                        {source.count != null && source.meta && \" · \"}\n                        {source.meta}\n                      </span>\n                    )}\n                  </span>\n                  <span\n                    className={cn(\n                      \"inline-flex size-5 shrink-0 items-center justify-center rounded-md border transition-colors [&_svg]:size-3.5\",\n                      active ? \"border-brand bg-brand text-brand-foreground\" : \"border-border\",\n                    )}\n                  >\n                    {active && <Check aria-hidden=\"true\" />}\n                  </span>\n                </button>\n                {recover}\n              </li>\n            );\n          })}\n        </ul>\n        {onAdd && (\n          <Button variant=\"ghost\" size=\"sm\" onClick={onAdd} leftIcon={<Plus aria-hidden=\"true\" className=\"size-4\" />} className=\"self-start\">\n            {addLabel}\n          </Button>\n        )}\n      </div>\n    );\n  },\n);\nKnowledgeBase.displayName = \"KnowledgeBase\";\n\n/** One document an answer drew on. */\nexport interface KnowledgeBaseSourceRef {\n  /** Stable id. */\n  id: string;\n  /** Document title, e.g. `\"Renewal Playbook v3\"`. */\n  name: React.ReactNode;\n  /** Section the answer came from, e.g. `\"§4.1\"`. */\n  section?: React.ReactNode;\n  /** Link to open the document at that section. */\n  href?: string;\n}\n\nexport interface KnowledgeBaseSourcesProps extends React.HTMLAttributes<HTMLDivElement> {\n  /** The documents the answer read. */\n  sources: KnowledgeBaseSourceRef[];\n  /** The base they came from, for the heading: \"Used 3 sources from Sales playbook\". */\n  baseName?: React.ReactNode;\n  /** Heading override. Defaults to `\"N sources\"` (or the base sentence). */\n  heading?: React.ReactNode;\n  /** The agent is reading right now: shows \"Reading…\" and announces it. */\n  reading?: boolean;\n}\n\n/**\n * The source list shown under an answer: exactly which knowledge-base\n * documents (and sections) the agent read, so the answer can be checked.\n * While `reading` it says so — politely announced — and swaps to provenance\n * when the answer finishes.\n */\nexport const KnowledgeBaseSources = React.forwardRef<HTMLDivElement, KnowledgeBaseSourcesProps>(\n  ({ sources, baseName, heading, reading = false, className, ...props }, ref) => {\n    const headingId = React.useId();\n    const n = sources.length;\n    const count = `${n} ${n === 1 ? \"source\" : \"sources\"}`;\n    const title =\n      heading ??\n      (reading ? (\n        <>Reading{baseName ? <> {baseName}</> : null}…</>\n      ) : baseName ? (\n        <>\n          Used {count} from {baseName}\n        </>\n      ) : (\n        count\n      ));\n    return (\n      <div ref={ref} className={cn(\"flex flex-col gap-1.5\", className)} {...props}>\n        <p\n          id={headingId}\n          role=\"status\"\n          aria-live=\"polite\"\n          className=\"inline-flex items-center gap-1.5 text-xs font-semibold uppercase tracking-wide text-muted-foreground\"\n        >\n          {reading && <Spinner aria-hidden=\"true\" role={undefined} className=\"size-3 motion-reduce:animate-none\" />}\n          {title}\n        </p>\n        {n > 0 && (\n          <ul aria-labelledby={headingId} className=\"flex flex-col gap-1\">\n            {sources.map((s) => {\n              const body = (\n                <>\n                  <FileText aria-hidden=\"true\" className=\"size-3.5 shrink-0 text-muted-foreground\" />\n                  <span className=\"truncate\">{s.name}</span>\n                  {s.section && <span className=\"shrink-0 text-muted-foreground\">· {s.section}</span>}\n                </>\n              );\n              const cls =\n                \"flex items-center gap-2 rounded-md bg-muted/60 px-2.5 py-1.5 text-xs text-foreground\";\n              return (\n                <li key={s.id}>\n                  {s.href ? (\n                    <a\n                      href={s.href}\n                      className={cn(cls, \"transition-colors hover:bg-accent focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring\")}\n                    >\n                      {body}\n                    </a>\n                  ) : (\n                    <span className={cls}>{body}</span>\n                  )}\n                </li>\n              );\n            })}\n          </ul>\n        )}\n      </div>\n    );\n  },\n);\nKnowledgeBaseSources.displayName = \"KnowledgeBaseSources\";\n\nexport interface KnowledgeBaseCoverageProps extends React.HTMLAttributes<HTMLSpanElement> {\n  /** How well the base covers the question. */\n  level: KnowledgeBaseCoverageLevel;\n  /** Number of matching passages, e.g. `14`. */\n  matches?: number;\n  /** Label override. Defaults to \"Well-covered\", \"Partly covered\" or \"Thin coverage\". */\n  label?: React.ReactNode;\n}\n\nconst coverage: Record<KnowledgeBaseCoverageLevel, { word: string; icon: React.ReactNode; cls: string }> = {\n  high: { word: \"Well-covered\", icon: <Check aria-hidden=\"true\" className=\"size-3\" />, cls: \"bg-success/15 text-success\" },\n  partial: { word: \"Partly covered\", icon: <AlertTriangle aria-hidden=\"true\" className=\"size-3\" />, cls: \"bg-warning/15 text-warning\" },\n  low: { word: \"Thin coverage\", icon: <CircleAlert aria-hidden=\"true\" className=\"size-3\" />, cls: \"bg-destructive/15 text-destructive\" },\n};\n\n/**\n * A small badge saying how well the knowledge base covers the question —\n * \"Well-covered · 14 matches\", or a warning when context is thin. The word\n * carries the meaning; colour only reinforces it.\n */\nexport const KnowledgeBaseCoverage = React.forwardRef<HTMLSpanElement, KnowledgeBaseCoverageProps>(\n  ({ level, matches, label, className, ...props }, ref) => {\n    const c = coverage[level];\n    return (\n      <Badge ref={ref} variant=\"outline\" icon={c.icon} data-level={level} className={cn(\"border-transparent\", c.cls, className)} {...props}>\n        {label ?? c.word}\n        {matches != null && <span className=\"font-normal\">· {matches} {matches === 1 ? \"match\" : \"matches\"}</span>}\n      </Badge>\n    );\n  },\n);\nKnowledgeBaseCoverage.displayName = \"KnowledgeBaseCoverage\";\n"]}

package/package.json

@@ -1,6 +1,61 @@
 {
   "name": "@nucleux/knowledge-base",
-  "version": "0.0.0-stage",
-  "stub": true,
-  "description": "Temporary package placeholder for staged publishing"
+  "version": "0.7.0",
+  "type": "module",
+  "sideEffects": false,
+  "description": "Knowledge Base — choose the sources the agent may draw on — Nucleux agentic UI for React.",
+  "keywords": [
+    "nucleux",
+    "react",
+    "ui",
+    "components",
+    "agentic",
+    "ai",
+    "tailwind",
+    "knowledge-base"
+  ],
+  "main": "./dist/index.cjs",
+  "module": "./dist/index.js",
+  "types": "./dist/index.d.ts",
+  "exports": {
+    ".": {
+      "types": "./dist/index.d.ts",
+      "import": "./dist/index.js",
+      "require": "./dist/index.cjs"
+    }
+  },
+  "files": [
+    "dist",
+    "README.md"
+  ],
+  "peerDependencies": {
+    "react": ">=18",
+    "react-dom": ">=18"
+  },
+  "dependencies": {
+    "@nucleux/utils": "0.7.0",
+    "@nucleux/badge": "0.7.0",
+    "@nucleux/button": "0.7.0",
+    "@nucleux/spinner": "0.7.0",
+    "lucide-react": "^0.469.0"
+  },
+  "devDependencies": {
+    "tsup": "^8.3.5",
+    "typescript": "^5.7.2",
+    "@types/react": "^18.3.18",
+    "react": "^18.3.1"
+  },
+  "publishConfig": {
+    "access": "public"
+  },
+  "license": "MIT",
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/intelligaia-open-labs/nucleux.git",
+    "directory": "packages/knowledge-base"
+  },
+  "homepage": "https://github.com/intelligaia-open-labs/nucleux#readme",
+  "scripts": {
+    "build": "tsup"
+  }
 }