@nucleux/md3-knowledge-base 0.0.0-stage → 0.6.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,46 @@
-# Temporary Holding Version
+# @nucleux/md3-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.
+Material 3 Knowledge Base — persistent, named sources the agent grounds in, with readiness and provenance — 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).
+
+This is the Material 3 twin of [`@nucleux/knowledge-base`](../knowledge-base) and **shares its API**: the props types are re-exported from it, so switching families is a change of import only.
+
+## Exports
+
+- **`Md3KnowledgeBase`** — pick the bases the agent grounds in: a card of checkable list rows (default) or a wrap of filter chips with document counts (`variant="chips"`). Readiness is a word on each row (Ready, Processing, Needs refresh, Couldn't process) led by a ring (not usable yet) or a filled disc (usable); a failed row is outlined in error with Retry on the row (`onRefresh`); `onAdd` adds an "Add a base" control.
+- **`Md3KnowledgeBaseSources`** — the documents (and sections) an answer read; while `reading`, a pulsing tonal band says so, politely announced.
+- **`Md3KnowledgeBaseCoverage`** — a tonal label: "Well-covered · 14 matches", "Partly covered", "Thin coverage".
+- Types: `Md3KnowledgeBaseProps`, `Md3KnowledgeBaseSourcesProps`, `Md3KnowledgeBaseCoverageProps`, `Md3KnowledgeBaseVariant`, `Md3KnowledgeBaseCoverageLevel`, `Md3KnowledgeSourceStatus`, `KnowledgeSource`, `KnowledgeBaseSourceRef`
+
+## Install
+
+```bash
+pnpm add @nucleux/md3-knowledge-base @nucleux/tokens
+```
+
+`react` / `react-dom` are peer dependencies.
+
+## Usage
+
+```tsx
+import { Md3KnowledgeBase, Md3KnowledgeBaseSources, Md3KnowledgeBaseCoverage } from "@nucleux/md3-knowledge-base";
+
+<Md3KnowledgeBase
+  heading="Active knowledge"
+  onRefresh={(id) => reindex(id)}
+  sources={[
+    { id: "crm", name: "CRM records", status: "ready", count: 18240 },
+    { id: "msa", name: "MSA Template.pdf", status: "error", meta: "Password-protected" },
+  ]}
+/>
+<Md3KnowledgeBaseSources baseName="Sales playbook" sources={[{ id: "1", name: "Renewal Playbook v3", section: "§4.1" }]} />
+<Md3KnowledgeBaseCoverage 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,361 @@
+"use client";
+'use strict';
+
+var React = require('react');
+var utils = require('@nucleux/utils');
+var md3Button = require('@nucleux/md3-button');
+var md3Chip = require('@nucleux/md3-chip');
+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-md-primary",
+  processing: "text-md-on-surface-variant",
+  stale: "text-md-tertiary",
+  error: "text-md-error"
+};
+var StatusDot = ({ status }) => {
+  const usable = status === "ready" || status === "stale";
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    "span",
+    {
+      "aria-hidden": "true",
+      className: utils.cn(
+        "inline-block size-2 shrink-0 rounded-full border-2 border-current align-middle transition-colors duration-200 motion-reduce:transition-none",
+        usable ? "bg-current" : "bg-transparent"
+      )
+    }
+  );
+};
+var nameText = (n, fallback) => typeof n === "string" ? n : fallback;
+var Md3KnowledgeBase = 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-3 rounded-md-md bg-md-surface-container-low p-4 text-md-on-surface shadow-md-1",
+            className
+          ),
+          ...props,
+          children: [
+            heading && /* @__PURE__ */ jsxRuntime.jsx("p", { id: headingId, className: "text-sm font-medium tracking-[0.1px] text-md-on-surface", children: heading }),
+            /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-wrap gap-2", children: [
+              sources.map((source) => {
+                const active = selected.includes(source.id);
+                return /* @__PURE__ */ jsxRuntime.jsxs(
+                  md3Chip.Md3Chip,
+                  {
+                    variant: "filter",
+                    selected: active,
+                    role: "checkbox",
+                    "aria-checked": active,
+                    "aria-pressed": void 0,
+                    onClick: () => toggle(source.id),
+                    className: "transition-colors duration-200 motion-reduce:transition-none",
+                    children: [
+                      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.jsx(md3Chip.Md3Chip, { variant: "assist", icon: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Plus, { "aria-hidden": "true" }), onClick: onAdd, children: addLabel })
+            ] })
+          ]
+        }
+      );
+    }
+    return /* @__PURE__ */ jsxRuntime.jsxs(
+      "div",
+      {
+        ref,
+        className: utils.cn(
+          "flex flex-col gap-1 rounded-md-md bg-md-surface-container-low py-3 text-md-on-surface shadow-md-1",
+          className
+        ),
+        ...props,
+        children: [
+          heading && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-between px-4 pb-1", children: [
+            /* @__PURE__ */ jsxRuntime.jsx("p", { id: headingId, className: "text-sm font-medium tracking-[0.1px] text-md-on-surface-variant", children: heading }),
+            selected.length > 0 && /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "text-xs font-medium tracking-[0.5px] text-md-on-surface-variant", 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 px-2",
+              children: sources.map((source) => {
+                const active = selected.includes(source.id);
+                const failed = source.status === "error";
+                const recover = onRefresh && (source.status === "stale" || failed) ? /* @__PURE__ */ jsxRuntime.jsx(
+                  md3Button.Md3Button,
+                  {
+                    variant: "text",
+                    onClick: () => onRefresh(source.id),
+                    "aria-label": `${failed ? "Retry" : "Refresh"} ${nameText(source.name, source.id)}`,
+                    icon: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.RotateCw, { "aria-hidden": "true" }),
+                    className: "h-8 shrink-0 px-3 text-xs [&_svg]:size-4",
+                    children: failed ? "Retry" : "Refresh"
+                  }
+                ) : null;
+                return /* @__PURE__ */ jsxRuntime.jsxs(
+                  "li",
+                  {
+                    "data-status": source.status,
+                    className: utils.cn(
+                      "flex items-center gap-1 rounded-md-sm border pr-1",
+                      failed ? "border-md-error" : "border-transparent"
+                    ),
+                    children: [
+                      /* @__PURE__ */ jsxRuntime.jsxs(
+                        "button",
+                        {
+                          type: "button",
+                          role: "checkbox",
+                          "aria-checked": active,
+                          onClick: () => toggle(source.id),
+                          className: utils.cn(
+                            "relative flex min-h-14 w-full min-w-0 flex-1 items-center gap-4 overflow-hidden rounded-md-sm px-2 py-2 text-left outline-none transition-colors duration-200 motion-reduce:transition-none",
+                            "before:absolute before:inset-0 before:bg-md-on-surface before:opacity-0 before:transition-opacity before:content-['']",
+                            "hover:before:opacity-[0.08] focus-visible:before:opacity-[0.12] active:before:opacity-[0.12]",
+                            "focus-visible:ring-2 focus-visible:ring-inset focus-visible:ring-md-primary",
+                            active && "bg-md-secondary-container text-md-on-secondary-container"
+                          ),
+                          children: [
+                            /* @__PURE__ */ jsxRuntime.jsx("span", { className: "relative inline-flex size-10 shrink-0 items-center justify-center rounded-full bg-md-surface-container-high text-md-on-surface-variant [&_svg]:size-5", children: source.icon ?? /* @__PURE__ */ jsxRuntime.jsx(lucideReact.FileText, { "aria-hidden": "true" }) }),
+                            /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "relative flex min-w-0 flex-1 flex-col", children: [
+                              /* @__PURE__ */ jsxRuntime.jsx("span", { className: "truncate text-base text-md-on-surface", children: source.name }),
+                              (source.meta || source.status || source.count != null) && /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "truncate text-sm text-md-on-surface-variant", children: [
+                                source.status && /* @__PURE__ */ jsxRuntime.jsxs("span", { className: utils.cn("inline-flex items-center gap-1.5 font-medium", statusTone[source.status]), children: [
+                                  /* @__PURE__ */ jsxRuntime.jsx(StatusDot, { status: source.status }),
+                                  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",
+                              {
+                                "aria-hidden": "true",
+                                className: utils.cn(
+                                  "relative inline-flex size-[18px] shrink-0 items-center justify-center rounded-[2px] border-2 transition-colors duration-200 motion-reduce:transition-none [&_svg]:size-[14px]",
+                                  active ? "border-md-primary bg-md-primary text-md-on-primary" : "border-md-on-surface-variant text-transparent"
+                                ),
+                                children: active && /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Check, { "aria-hidden": "true" })
+                              }
+                            )
+                          ]
+                        }
+                      ),
+                      recover
+                    ]
+                  },
+                  source.id
+                );
+              })
+            }
+          ),
+          onAdd && /* @__PURE__ */ jsxRuntime.jsx(
+            md3Button.Md3Button,
+            {
+              variant: "text",
+              onClick: onAdd,
+              icon: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Plus, { "aria-hidden": "true" }),
+              className: "mx-2 mt-1 self-start px-3",
+              children: addLabel
+            }
+          )
+        ]
+      }
+    );
+  }
+);
+Md3KnowledgeBase.displayName = "Md3KnowledgeBase";
+var Md3KnowledgeBaseSources = 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-2 text-md-on-surface", className), ...props, children: [
+      /* @__PURE__ */ jsxRuntime.jsxs(
+        "p",
+        {
+          id: headingId,
+          role: "status",
+          "aria-live": "polite",
+          className: utils.cn(
+            "inline-flex items-center gap-2 text-xs font-medium tracking-[0.5px] text-md-on-surface-variant",
+            reading && "self-start rounded-full bg-md-secondary-container px-3 py-1 text-md-on-secondary-container"
+          ),
+          children: [
+            reading && /* @__PURE__ */ jsxRuntime.jsx(
+              "span",
+              {
+                "aria-hidden": "true",
+                className: "size-2 shrink-0 rounded-full bg-md-primary animate-pulse 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: "relative size-4 shrink-0 text-md-on-surface-variant" }),
+          /* @__PURE__ */ jsxRuntime.jsx("span", { className: "relative truncate", children: s.name }),
+          s.section && /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "relative shrink-0 text-md-on-surface-variant", children: [
+            "\xB7 ",
+            s.section
+          ] })
+        ] });
+        const cls = "relative flex items-center gap-2 overflow-hidden rounded-md-sm bg-md-surface-container px-3 py-2 text-sm text-md-on-surface";
+        return /* @__PURE__ */ jsxRuntime.jsx("li", { children: s.href ? /* @__PURE__ */ jsxRuntime.jsx(
+          "a",
+          {
+            href: s.href,
+            className: utils.cn(
+              cls,
+              "outline-none before:absolute before:inset-0 before:bg-md-on-surface before:opacity-0 before:transition-opacity before:content-['']",
+              "hover:before:opacity-[0.08] focus-visible:before:opacity-[0.12] focus-visible:ring-2 focus-visible:ring-md-primary"
+            ),
+            children: body
+          }
+        ) : /* @__PURE__ */ jsxRuntime.jsx("span", { className: cls, children: body }) }, s.id);
+      }) })
+    ] });
+  }
+);
+Md3KnowledgeBaseSources.displayName = "Md3KnowledgeBaseSources";
+var coverage = {
+  high: {
+    word: "Well-covered",
+    icon: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Check, { "aria-hidden": "true", className: "size-3.5" }),
+    cls: "bg-md-primary-container text-md-on-primary-container"
+  },
+  partial: {
+    word: "Partly covered",
+    icon: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.AlertTriangle, { "aria-hidden": "true", className: "size-3.5" }),
+    cls: "bg-md-tertiary-container text-md-on-tertiary-container"
+  },
+  low: {
+    word: "Thin coverage",
+    icon: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.CircleAlert, { "aria-hidden": "true", className: "size-3.5" }),
+    cls: "bg-md-error-container text-md-on-error-container"
+  }
+};
+var Md3KnowledgeBaseCoverage = React__namespace.forwardRef(
+  ({ level, matches, label, className, ...props }, ref) => {
+    const c = coverage[level];
+    return /* @__PURE__ */ jsxRuntime.jsxs(
+      "span",
+      {
+        ref,
+        "data-level": level,
+        className: utils.cn(
+          "inline-flex h-6 items-center gap-1 rounded-md-sm px-2 text-xs font-medium tracking-[0.5px]",
+          c.cls,
+          className
+        ),
+        ...props,
+        children: [
+          c.icon,
+          label ?? c.word,
+          matches != null && /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "font-normal", children: [
+            "\xB7 ",
+            matches,
+            " ",
+            matches === 1 ? "match" : "matches"
+          ] })
+        ]
+      }
+    );
+  }
+);
+Md3KnowledgeBaseCoverage.displayName = "Md3KnowledgeBaseCoverage";
+
+exports.Md3KnowledgeBase = Md3KnowledgeBase;
+exports.Md3KnowledgeBaseCoverage = Md3KnowledgeBaseCoverage;
+exports.Md3KnowledgeBaseSources = Md3KnowledgeBaseSources;
+//# sourceMappingURL=index.cjs.map
+//# sourceMappingURL=index.cjs.map

package/dist/index.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/index.tsx"],"names":["jsx","cn","React","jsxs","Md3Chip","Plus","Md3Button","RotateCw","FileText","Check","Fragment","AlertTriangle","CircleAlert"],"mappings":"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","file":"index.cjs","sourcesContent":["import * as React from \"react\";\nimport { cn } from \"@nucleux/utils\";\nimport { Md3Button } from \"@nucleux/md3-button\";\nimport { Md3Chip } from \"@nucleux/md3-chip\";\nimport { AlertTriangle, Check, CircleAlert, FileText, Plus, RotateCw } from \"lucide-react\";\nimport type {\n  KnowledgeBaseProps,\n  KnowledgeBaseSourcesProps,\n  KnowledgeBaseCoverageProps,\n  KnowledgeBaseVariant,\n  KnowledgeBaseCoverageLevel,\n  KnowledgeSourceStatus,\n} from \"@nucleux/knowledge-base\";\n\n// Same API as @nucleux/knowledge-base: props and data shapes come from the twin.\nexport type Md3KnowledgeBaseProps = KnowledgeBaseProps;\nexport type Md3KnowledgeBaseSourcesProps = KnowledgeBaseSourcesProps;\nexport type Md3KnowledgeBaseCoverageProps = KnowledgeBaseCoverageProps;\nexport type Md3KnowledgeBaseVariant = KnowledgeBaseVariant;\nexport type Md3KnowledgeBaseCoverageLevel = KnowledgeBaseCoverageLevel;\nexport type Md3KnowledgeSourceStatus = KnowledgeSourceStatus;\nexport type { KnowledgeSource, KnowledgeBaseSourceRef } from \"@nucleux/knowledge-base\";\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-md-primary\",\n  processing: \"text-md-on-surface-variant\",\n  stale: \"text-md-tertiary\",\n  error: \"text-md-error\",\n};\n\n/**\n * The status mark: a ring while the source cannot be used (processing, failed)\n * and a filled disc once it can (ready, stale) — the distinction is a shape,\n * not only a colour, so it survives greyscale.\n */\nconst StatusDot = ({ status }: { status: KnowledgeSourceStatus }) => {\n  const usable = status === \"ready\" || status === \"stale\";\n  return (\n    <span\n      aria-hidden=\"true\"\n      className={cn(\n        \"inline-block size-2 shrink-0 rounded-full border-2 border-current align-middle transition-colors duration-200 motion-reduce:transition-none\",\n        usable ? \"bg-current\" : \"bg-transparent\",\n      )}\n    />\n  );\n};\n\nconst nameText = (n: React.ReactNode, fallback: string) => (typeof n === \"string\" ? n : fallback);\n\n/**\n * Material 3 twin of `KnowledgeBase`: lets people choose which knowledge bases\n * the agent grounds in for this session — a card holding a list of checkable\n * rows (default) or a wrap of filter chips with document counts\n * (`variant=\"chips\"`). Readiness is a word on each row (Ready, Processing,\n * Needs refresh, Couldn't process) led by a ring (not usable yet) or a filled\n * disc (usable); a failed row is outlined in error, not flooded, with its\n * Retry/Refresh on the row itself. Shares the API of `@nucleux/knowledge-base`.\n */\nexport const Md3KnowledgeBase = React.forwardRef<HTMLDivElement, Md3KnowledgeBaseProps>(\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(\n            \"flex flex-col gap-3 rounded-md-md bg-md-surface-container-low p-4 text-md-on-surface shadow-md-1\",\n            className,\n          )}\n          {...props}\n        >\n          {heading && (\n            <p id={headingId} className=\"text-sm font-medium tracking-[0.1px] text-md-on-surface\">\n              {heading}\n            </p>\n          )}\n          <div className=\"flex flex-wrap gap-2\">\n            {sources.map((source) => {\n              const active = selected.includes(source.id);\n              return (\n                <Md3Chip\n                  key={source.id}\n                  variant=\"filter\"\n                  selected={active}\n                  role=\"checkbox\"\n                  aria-checked={active}\n                  aria-pressed={undefined}\n                  onClick={() => toggle(source.id)}\n                  className=\"transition-colors duration-200 motion-reduce:transition-none\"\n                >\n                  {source.name}\n                  {source.count != null && (\n                    <span className=\"font-normal\"> · {source.count.toLocaleString()}</span>\n                  )}\n                  {source.status && source.status !== \"ready\" && (\n                    <span className={cn(\"font-normal\", statusTone[source.status])}> · {statusWord[source.status]}</span>\n                  )}\n                </Md3Chip>\n              );\n            })}\n            {onAdd && (\n              <Md3Chip variant=\"assist\" icon={<Plus aria-hidden=\"true\" />} onClick={onAdd}>\n                {addLabel}\n              </Md3Chip>\n            )}\n          </div>\n        </div>\n      );\n    }\n\n    return (\n      <div\n        ref={ref}\n        className={cn(\n          \"flex flex-col gap-1 rounded-md-md bg-md-surface-container-low py-3 text-md-on-surface shadow-md-1\",\n          className,\n        )}\n        {...props}\n      >\n        {heading && (\n          <div className=\"flex items-center justify-between px-4 pb-1\">\n            <p id={headingId} className=\"text-sm font-medium tracking-[0.1px] text-md-on-surface-variant\">\n              {heading}\n            </p>\n            {selected.length > 0 && (\n              <span className=\"text-xs font-medium tracking-[0.5px] text-md-on-surface-variant\">\n                {selected.length} selected\n              </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 px-2\"\n        >\n          {sources.map((source) => {\n            const active = selected.includes(source.id);\n            const failed = source.status === \"error\";\n            const recover =\n              onRefresh && (source.status === \"stale\" || failed) ? (\n                <Md3Button\n                  variant=\"text\"\n                  onClick={() => onRefresh(source.id)}\n                  aria-label={`${failed ? \"Retry\" : \"Refresh\"} ${nameText(source.name, source.id)}`}\n                  icon={<RotateCw aria-hidden=\"true\" />}\n                  className=\"h-8 shrink-0 px-3 text-xs [&_svg]:size-4\"\n                >\n                  {failed ? \"Retry\" : \"Refresh\"}\n                </Md3Button>\n              ) : null;\n            return (\n              <li\n                key={source.id}\n                data-status={source.status}\n                className={cn(\n                  \"flex items-center gap-1 rounded-md-sm border pr-1\",\n                  failed ? \"border-md-error\" : \"border-transparent\",\n                )}\n              >\n                <button\n                  type=\"button\"\n                  role=\"checkbox\"\n                  aria-checked={active}\n                  onClick={() => toggle(source.id)}\n                  className={cn(\n                    \"relative flex min-h-14 w-full min-w-0 flex-1 items-center gap-4 overflow-hidden rounded-md-sm px-2 py-2 text-left outline-none transition-colors duration-200 motion-reduce:transition-none\",\n                    \"before:absolute before:inset-0 before:bg-md-on-surface before:opacity-0 before:transition-opacity before:content-['']\",\n                    \"hover:before:opacity-[0.08] focus-visible:before:opacity-[0.12] active:before:opacity-[0.12]\",\n                    \"focus-visible:ring-2 focus-visible:ring-inset focus-visible:ring-md-primary\",\n                    active && \"bg-md-secondary-container text-md-on-secondary-container\",\n                  )}\n                >\n                  <span className=\"relative inline-flex size-10 shrink-0 items-center justify-center rounded-full bg-md-surface-container-high text-md-on-surface-variant [&_svg]:size-5\">\n                    {source.icon ?? <FileText aria-hidden=\"true\" />}\n                  </span>\n                  <span className=\"relative flex min-w-0 flex-1 flex-col\">\n                    <span className=\"truncate text-base text-md-on-surface\">{source.name}</span>\n                    {(source.meta || source.status || source.count != null) && (\n                      <span className=\"truncate text-sm text-md-on-surface-variant\">\n                        {source.status && (\n                          <span className={cn(\"inline-flex items-center gap-1.5 font-medium\", statusTone[source.status])}>\n                            <StatusDot status={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                  {/* Material 3 checkbox visual (the row itself is the checkbox). */}\n                  <span\n                    aria-hidden=\"true\"\n                    className={cn(\n                      \"relative inline-flex size-[18px] shrink-0 items-center justify-center rounded-[2px] border-2 transition-colors duration-200 motion-reduce:transition-none [&_svg]:size-[14px]\",\n                      active\n                        ? \"border-md-primary bg-md-primary text-md-on-primary\"\n                        : \"border-md-on-surface-variant text-transparent\",\n                    )}\n                  >\n                    {active && <Check aria-hidden=\"true\" />}\n                  </span>\n                </button>\n                {recover}\n              </li>\n            );\n          })}\n        </ul>\n        {onAdd && (\n          <Md3Button\n            variant=\"text\"\n            onClick={onAdd}\n            icon={<Plus aria-hidden=\"true\" />}\n            className=\"mx-2 mt-1 self-start px-3\"\n          >\n            {addLabel}\n          </Md3Button>\n        )}\n      </div>\n    );\n  },\n);\nMd3KnowledgeBase.displayName = \"Md3KnowledgeBase\";\n\n/**\n * Material 3 twin of `KnowledgeBaseSources`: the source list under an answer —\n * exactly which knowledge-base documents (and sections) the agent read. While\n * `reading`, a pulsing band says so (politely announced; deliberately not a\n * progress bar, since no honest percentage exists) and it swaps to provenance\n * when the answer finishes. Shares the API of `@nucleux/knowledge-base`.\n */\nexport const Md3KnowledgeBaseSources = React.forwardRef<HTMLDivElement, Md3KnowledgeBaseSourcesProps>(\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-2 text-md-on-surface\", className)} {...props}>\n        <p\n          id={headingId}\n          role=\"status\"\n          aria-live=\"polite\"\n          className={cn(\n            \"inline-flex items-center gap-2 text-xs font-medium tracking-[0.5px] text-md-on-surface-variant\",\n            reading && \"self-start rounded-full bg-md-secondary-container px-3 py-1 text-md-on-secondary-container\",\n          )}\n        >\n          {reading && (\n            <span\n              aria-hidden=\"true\"\n              className=\"size-2 shrink-0 rounded-full bg-md-primary animate-pulse motion-reduce:animate-none\"\n            />\n          )}\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=\"relative size-4 shrink-0 text-md-on-surface-variant\" />\n                  <span className=\"relative truncate\">{s.name}</span>\n                  {s.section && <span className=\"relative shrink-0 text-md-on-surface-variant\">· {s.section}</span>}\n                </>\n              );\n              const cls =\n                \"relative flex items-center gap-2 overflow-hidden rounded-md-sm bg-md-surface-container px-3 py-2 text-sm text-md-on-surface\";\n              return (\n                <li key={s.id}>\n                  {s.href ? (\n                    <a\n                      href={s.href}\n                      className={cn(\n                        cls,\n                        \"outline-none before:absolute before:inset-0 before:bg-md-on-surface before:opacity-0 before:transition-opacity before:content-['']\",\n                        \"hover:before:opacity-[0.08] focus-visible:before:opacity-[0.12] focus-visible:ring-2 focus-visible:ring-md-primary\",\n                      )}\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);\nMd3KnowledgeBaseSources.displayName = \"Md3KnowledgeBaseSources\";\n\nconst coverage: Record<KnowledgeBaseCoverageLevel, { word: string; icon: React.ReactNode; cls: string }> = {\n  high: {\n    word: \"Well-covered\",\n    icon: <Check aria-hidden=\"true\" className=\"size-3.5\" />,\n    cls: \"bg-md-primary-container text-md-on-primary-container\",\n  },\n  partial: {\n    word: \"Partly covered\",\n    icon: <AlertTriangle aria-hidden=\"true\" className=\"size-3.5\" />,\n    cls: \"bg-md-tertiary-container text-md-on-tertiary-container\",\n  },\n  low: {\n    word: \"Thin coverage\",\n    icon: <CircleAlert aria-hidden=\"true\" className=\"size-3.5\" />,\n    cls: \"bg-md-error-container text-md-on-error-container\",\n  },\n};\n\n/**\n * Material 3 twin of `KnowledgeBaseCoverage`: a small tonal label saying how\n * well the knowledge base covers the question — \"Well-covered · 14 matches\",\n * or a warning when context is thin. The word carries the meaning; the\n * container colour only reinforces it. Shares the API of `@nucleux/knowledge-base`.\n */\nexport const Md3KnowledgeBaseCoverage = React.forwardRef<HTMLSpanElement, Md3KnowledgeBaseCoverageProps>(\n  ({ level, matches, label, className, ...props }, ref) => {\n    const c = coverage[level];\n    return (\n      <span\n        ref={ref}\n        data-level={level}\n        className={cn(\n          \"inline-flex h-6 items-center gap-1 rounded-md-sm px-2 text-xs font-medium tracking-[0.5px]\",\n          c.cls,\n          className,\n        )}\n        {...props}\n      >\n        {c.icon}\n        {label ?? c.word}\n        {matches != null && (\n          <span className=\"font-normal\">\n            · {matches} {matches === 1 ? \"match\" : \"matches\"}\n          </span>\n        )}\n      </span>\n    );\n  },\n);\nMd3KnowledgeBaseCoverage.displayName = \"Md3KnowledgeBaseCoverage\";\n"]}

package/dist/index.d.cts

@@ -0,0 +1,38 @@
+import * as React from 'react';
+import { KnowledgeBaseProps, KnowledgeBaseCoverageProps, KnowledgeBaseCoverageLevel, KnowledgeBaseSourcesProps, KnowledgeBaseVariant, KnowledgeSourceStatus } from '@nucleux/knowledge-base';
+export { KnowledgeBaseSourceRef, KnowledgeSource } from '@nucleux/knowledge-base';
+
+type Md3KnowledgeBaseProps = KnowledgeBaseProps;
+type Md3KnowledgeBaseSourcesProps = KnowledgeBaseSourcesProps;
+type Md3KnowledgeBaseCoverageProps = KnowledgeBaseCoverageProps;
+type Md3KnowledgeBaseVariant = KnowledgeBaseVariant;
+type Md3KnowledgeBaseCoverageLevel = KnowledgeBaseCoverageLevel;
+type Md3KnowledgeSourceStatus = KnowledgeSourceStatus;
+
+/**
+ * Material 3 twin of `KnowledgeBase`: lets people choose which knowledge bases
+ * the agent grounds in for this session — a card holding a list of checkable
+ * rows (default) or a wrap of filter chips with document counts
+ * (`variant="chips"`). Readiness is a word on each row (Ready, Processing,
+ * Needs refresh, Couldn't process) led by a ring (not usable yet) or a filled
+ * disc (usable); a failed row is outlined in error, not flooded, with its
+ * Retry/Refresh on the row itself. Shares the API of `@nucleux/knowledge-base`.
+ */
+declare const Md3KnowledgeBase: React.ForwardRefExoticComponent<KnowledgeBaseProps & React.RefAttributes<HTMLDivElement>>;
+/**
+ * Material 3 twin of `KnowledgeBaseSources`: the source list under an answer —
+ * exactly which knowledge-base documents (and sections) the agent read. While
+ * `reading`, a pulsing band says so (politely announced; deliberately not a
+ * progress bar, since no honest percentage exists) and it swaps to provenance
+ * when the answer finishes. Shares the API of `@nucleux/knowledge-base`.
+ */
+declare const Md3KnowledgeBaseSources: React.ForwardRefExoticComponent<KnowledgeBaseSourcesProps & React.RefAttributes<HTMLDivElement>>;
+/**
+ * Material 3 twin of `KnowledgeBaseCoverage`: a small tonal label 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; the
+ * container colour only reinforces it. Shares the API of `@nucleux/knowledge-base`.
+ */
+declare const Md3KnowledgeBaseCoverage: React.ForwardRefExoticComponent<KnowledgeBaseCoverageProps & React.RefAttributes<HTMLSpanElement>>;
+
+export { Md3KnowledgeBase, Md3KnowledgeBaseCoverage, type Md3KnowledgeBaseCoverageLevel, type Md3KnowledgeBaseCoverageProps, type Md3KnowledgeBaseProps, Md3KnowledgeBaseSources, type Md3KnowledgeBaseSourcesProps, type Md3KnowledgeBaseVariant, type Md3KnowledgeSourceStatus };

package/dist/index.d.ts

@@ -0,0 +1,38 @@
+import * as React from 'react';
+import { KnowledgeBaseProps, KnowledgeBaseCoverageProps, KnowledgeBaseCoverageLevel, KnowledgeBaseSourcesProps, KnowledgeBaseVariant, KnowledgeSourceStatus } from '@nucleux/knowledge-base';
+export { KnowledgeBaseSourceRef, KnowledgeSource } from '@nucleux/knowledge-base';
+
+type Md3KnowledgeBaseProps = KnowledgeBaseProps;
+type Md3KnowledgeBaseSourcesProps = KnowledgeBaseSourcesProps;
+type Md3KnowledgeBaseCoverageProps = KnowledgeBaseCoverageProps;
+type Md3KnowledgeBaseVariant = KnowledgeBaseVariant;
+type Md3KnowledgeBaseCoverageLevel = KnowledgeBaseCoverageLevel;
+type Md3KnowledgeSourceStatus = KnowledgeSourceStatus;
+
+/**
+ * Material 3 twin of `KnowledgeBase`: lets people choose which knowledge bases
+ * the agent grounds in for this session — a card holding a list of checkable
+ * rows (default) or a wrap of filter chips with document counts
+ * (`variant="chips"`). Readiness is a word on each row (Ready, Processing,
+ * Needs refresh, Couldn't process) led by a ring (not usable yet) or a filled
+ * disc (usable); a failed row is outlined in error, not flooded, with its
+ * Retry/Refresh on the row itself. Shares the API of `@nucleux/knowledge-base`.
+ */
+declare const Md3KnowledgeBase: React.ForwardRefExoticComponent<KnowledgeBaseProps & React.RefAttributes<HTMLDivElement>>;
+/**
+ * Material 3 twin of `KnowledgeBaseSources`: the source list under an answer —
+ * exactly which knowledge-base documents (and sections) the agent read. While
+ * `reading`, a pulsing band says so (politely announced; deliberately not a
+ * progress bar, since no honest percentage exists) and it swaps to provenance
+ * when the answer finishes. Shares the API of `@nucleux/knowledge-base`.
+ */
+declare const Md3KnowledgeBaseSources: React.ForwardRefExoticComponent<KnowledgeBaseSourcesProps & React.RefAttributes<HTMLDivElement>>;
+/**
+ * Material 3 twin of `KnowledgeBaseCoverage`: a small tonal label 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; the
+ * container colour only reinforces it. Shares the API of `@nucleux/knowledge-base`.
+ */
+declare const Md3KnowledgeBaseCoverage: React.ForwardRefExoticComponent<KnowledgeBaseCoverageProps & React.RefAttributes<HTMLSpanElement>>;
+
+export { Md3KnowledgeBase, Md3KnowledgeBaseCoverage, type Md3KnowledgeBaseCoverageLevel, type Md3KnowledgeBaseCoverageProps, type Md3KnowledgeBaseProps, Md3KnowledgeBaseSources, type Md3KnowledgeBaseSourcesProps, type Md3KnowledgeBaseVariant, type Md3KnowledgeSourceStatus };

package/dist/index.js

@@ -0,0 +1,337 @@
+"use client";
+import * as React from 'react';
+import { cn } from '@nucleux/utils';
+import { Md3Button } from '@nucleux/md3-button';
+import { Md3Chip } from '@nucleux/md3-chip';
+import { Plus, RotateCw, FileText, Check, 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-md-primary",
+  processing: "text-md-on-surface-variant",
+  stale: "text-md-tertiary",
+  error: "text-md-error"
+};
+var StatusDot = ({ status }) => {
+  const usable = status === "ready" || status === "stale";
+  return /* @__PURE__ */ jsx(
+    "span",
+    {
+      "aria-hidden": "true",
+      className: cn(
+        "inline-block size-2 shrink-0 rounded-full border-2 border-current align-middle transition-colors duration-200 motion-reduce:transition-none",
+        usable ? "bg-current" : "bg-transparent"
+      )
+    }
+  );
+};
+var nameText = (n, fallback) => typeof n === "string" ? n : fallback;
+var Md3KnowledgeBase = 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-3 rounded-md-md bg-md-surface-container-low p-4 text-md-on-surface shadow-md-1",
+            className
+          ),
+          ...props,
+          children: [
+            heading && /* @__PURE__ */ jsx("p", { id: headingId, className: "text-sm font-medium tracking-[0.1px] text-md-on-surface", children: heading }),
+            /* @__PURE__ */ jsxs("div", { className: "flex flex-wrap gap-2", children: [
+              sources.map((source) => {
+                const active = selected.includes(source.id);
+                return /* @__PURE__ */ jsxs(
+                  Md3Chip,
+                  {
+                    variant: "filter",
+                    selected: active,
+                    role: "checkbox",
+                    "aria-checked": active,
+                    "aria-pressed": void 0,
+                    onClick: () => toggle(source.id),
+                    className: "transition-colors duration-200 motion-reduce:transition-none",
+                    children: [
+                      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__ */ jsx(Md3Chip, { variant: "assist", icon: /* @__PURE__ */ jsx(Plus, { "aria-hidden": "true" }), onClick: onAdd, children: addLabel })
+            ] })
+          ]
+        }
+      );
+    }
+    return /* @__PURE__ */ jsxs(
+      "div",
+      {
+        ref,
+        className: cn(
+          "flex flex-col gap-1 rounded-md-md bg-md-surface-container-low py-3 text-md-on-surface shadow-md-1",
+          className
+        ),
+        ...props,
+        children: [
+          heading && /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between px-4 pb-1", children: [
+            /* @__PURE__ */ jsx("p", { id: headingId, className: "text-sm font-medium tracking-[0.1px] text-md-on-surface-variant", children: heading }),
+            selected.length > 0 && /* @__PURE__ */ jsxs("span", { className: "text-xs font-medium tracking-[0.5px] text-md-on-surface-variant", 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 px-2",
+              children: sources.map((source) => {
+                const active = selected.includes(source.id);
+                const failed = source.status === "error";
+                const recover = onRefresh && (source.status === "stale" || failed) ? /* @__PURE__ */ jsx(
+                  Md3Button,
+                  {
+                    variant: "text",
+                    onClick: () => onRefresh(source.id),
+                    "aria-label": `${failed ? "Retry" : "Refresh"} ${nameText(source.name, source.id)}`,
+                    icon: /* @__PURE__ */ jsx(RotateCw, { "aria-hidden": "true" }),
+                    className: "h-8 shrink-0 px-3 text-xs [&_svg]:size-4",
+                    children: failed ? "Retry" : "Refresh"
+                  }
+                ) : null;
+                return /* @__PURE__ */ jsxs(
+                  "li",
+                  {
+                    "data-status": source.status,
+                    className: cn(
+                      "flex items-center gap-1 rounded-md-sm border pr-1",
+                      failed ? "border-md-error" : "border-transparent"
+                    ),
+                    children: [
+                      /* @__PURE__ */ jsxs(
+                        "button",
+                        {
+                          type: "button",
+                          role: "checkbox",
+                          "aria-checked": active,
+                          onClick: () => toggle(source.id),
+                          className: cn(
+                            "relative flex min-h-14 w-full min-w-0 flex-1 items-center gap-4 overflow-hidden rounded-md-sm px-2 py-2 text-left outline-none transition-colors duration-200 motion-reduce:transition-none",
+                            "before:absolute before:inset-0 before:bg-md-on-surface before:opacity-0 before:transition-opacity before:content-['']",
+                            "hover:before:opacity-[0.08] focus-visible:before:opacity-[0.12] active:before:opacity-[0.12]",
+                            "focus-visible:ring-2 focus-visible:ring-inset focus-visible:ring-md-primary",
+                            active && "bg-md-secondary-container text-md-on-secondary-container"
+                          ),
+                          children: [
+                            /* @__PURE__ */ jsx("span", { className: "relative inline-flex size-10 shrink-0 items-center justify-center rounded-full bg-md-surface-container-high text-md-on-surface-variant [&_svg]:size-5", children: source.icon ?? /* @__PURE__ */ jsx(FileText, { "aria-hidden": "true" }) }),
+                            /* @__PURE__ */ jsxs("span", { className: "relative flex min-w-0 flex-1 flex-col", children: [
+                              /* @__PURE__ */ jsx("span", { className: "truncate text-base text-md-on-surface", children: source.name }),
+                              (source.meta || source.status || source.count != null) && /* @__PURE__ */ jsxs("span", { className: "truncate text-sm text-md-on-surface-variant", children: [
+                                source.status && /* @__PURE__ */ jsxs("span", { className: cn("inline-flex items-center gap-1.5 font-medium", statusTone[source.status]), children: [
+                                  /* @__PURE__ */ jsx(StatusDot, { status: source.status }),
+                                  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",
+                              {
+                                "aria-hidden": "true",
+                                className: cn(
+                                  "relative inline-flex size-[18px] shrink-0 items-center justify-center rounded-[2px] border-2 transition-colors duration-200 motion-reduce:transition-none [&_svg]:size-[14px]",
+                                  active ? "border-md-primary bg-md-primary text-md-on-primary" : "border-md-on-surface-variant text-transparent"
+                                ),
+                                children: active && /* @__PURE__ */ jsx(Check, { "aria-hidden": "true" })
+                              }
+                            )
+                          ]
+                        }
+                      ),
+                      recover
+                    ]
+                  },
+                  source.id
+                );
+              })
+            }
+          ),
+          onAdd && /* @__PURE__ */ jsx(
+            Md3Button,
+            {
+              variant: "text",
+              onClick: onAdd,
+              icon: /* @__PURE__ */ jsx(Plus, { "aria-hidden": "true" }),
+              className: "mx-2 mt-1 self-start px-3",
+              children: addLabel
+            }
+          )
+        ]
+      }
+    );
+  }
+);
+Md3KnowledgeBase.displayName = "Md3KnowledgeBase";
+var Md3KnowledgeBaseSources = 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-2 text-md-on-surface", className), ...props, children: [
+      /* @__PURE__ */ jsxs(
+        "p",
+        {
+          id: headingId,
+          role: "status",
+          "aria-live": "polite",
+          className: cn(
+            "inline-flex items-center gap-2 text-xs font-medium tracking-[0.5px] text-md-on-surface-variant",
+            reading && "self-start rounded-full bg-md-secondary-container px-3 py-1 text-md-on-secondary-container"
+          ),
+          children: [
+            reading && /* @__PURE__ */ jsx(
+              "span",
+              {
+                "aria-hidden": "true",
+                className: "size-2 shrink-0 rounded-full bg-md-primary animate-pulse 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: "relative size-4 shrink-0 text-md-on-surface-variant" }),
+          /* @__PURE__ */ jsx("span", { className: "relative truncate", children: s.name }),
+          s.section && /* @__PURE__ */ jsxs("span", { className: "relative shrink-0 text-md-on-surface-variant", children: [
+            "\xB7 ",
+            s.section
+          ] })
+        ] });
+        const cls = "relative flex items-center gap-2 overflow-hidden rounded-md-sm bg-md-surface-container px-3 py-2 text-sm text-md-on-surface";
+        return /* @__PURE__ */ jsx("li", { children: s.href ? /* @__PURE__ */ jsx(
+          "a",
+          {
+            href: s.href,
+            className: cn(
+              cls,
+              "outline-none before:absolute before:inset-0 before:bg-md-on-surface before:opacity-0 before:transition-opacity before:content-['']",
+              "hover:before:opacity-[0.08] focus-visible:before:opacity-[0.12] focus-visible:ring-2 focus-visible:ring-md-primary"
+            ),
+            children: body
+          }
+        ) : /* @__PURE__ */ jsx("span", { className: cls, children: body }) }, s.id);
+      }) })
+    ] });
+  }
+);
+Md3KnowledgeBaseSources.displayName = "Md3KnowledgeBaseSources";
+var coverage = {
+  high: {
+    word: "Well-covered",
+    icon: /* @__PURE__ */ jsx(Check, { "aria-hidden": "true", className: "size-3.5" }),
+    cls: "bg-md-primary-container text-md-on-primary-container"
+  },
+  partial: {
+    word: "Partly covered",
+    icon: /* @__PURE__ */ jsx(AlertTriangle, { "aria-hidden": "true", className: "size-3.5" }),
+    cls: "bg-md-tertiary-container text-md-on-tertiary-container"
+  },
+  low: {
+    word: "Thin coverage",
+    icon: /* @__PURE__ */ jsx(CircleAlert, { "aria-hidden": "true", className: "size-3.5" }),
+    cls: "bg-md-error-container text-md-on-error-container"
+  }
+};
+var Md3KnowledgeBaseCoverage = React.forwardRef(
+  ({ level, matches, label, className, ...props }, ref) => {
+    const c = coverage[level];
+    return /* @__PURE__ */ jsxs(
+      "span",
+      {
+        ref,
+        "data-level": level,
+        className: cn(
+          "inline-flex h-6 items-center gap-1 rounded-md-sm px-2 text-xs font-medium tracking-[0.5px]",
+          c.cls,
+          className
+        ),
+        ...props,
+        children: [
+          c.icon,
+          label ?? c.word,
+          matches != null && /* @__PURE__ */ jsxs("span", { className: "font-normal", children: [
+            "\xB7 ",
+            matches,
+            " ",
+            matches === 1 ? "match" : "matches"
+          ] })
+        ]
+      }
+    );
+  }
+);
+Md3KnowledgeBaseCoverage.displayName = "Md3KnowledgeBaseCoverage";
+
+export { Md3KnowledgeBase, Md3KnowledgeBaseCoverage, Md3KnowledgeBaseSources };
+//# 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 { Md3Button } from \"@nucleux/md3-button\";\nimport { Md3Chip } from \"@nucleux/md3-chip\";\nimport { AlertTriangle, Check, CircleAlert, FileText, Plus, RotateCw } from \"lucide-react\";\nimport type {\n  KnowledgeBaseProps,\n  KnowledgeBaseSourcesProps,\n  KnowledgeBaseCoverageProps,\n  KnowledgeBaseVariant,\n  KnowledgeBaseCoverageLevel,\n  KnowledgeSourceStatus,\n} from \"@nucleux/knowledge-base\";\n\n// Same API as @nucleux/knowledge-base: props and data shapes come from the twin.\nexport type Md3KnowledgeBaseProps = KnowledgeBaseProps;\nexport type Md3KnowledgeBaseSourcesProps = KnowledgeBaseSourcesProps;\nexport type Md3KnowledgeBaseCoverageProps = KnowledgeBaseCoverageProps;\nexport type Md3KnowledgeBaseVariant = KnowledgeBaseVariant;\nexport type Md3KnowledgeBaseCoverageLevel = KnowledgeBaseCoverageLevel;\nexport type Md3KnowledgeSourceStatus = KnowledgeSourceStatus;\nexport type { KnowledgeSource, KnowledgeBaseSourceRef } from \"@nucleux/knowledge-base\";\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-md-primary\",\n  processing: \"text-md-on-surface-variant\",\n  stale: \"text-md-tertiary\",\n  error: \"text-md-error\",\n};\n\n/**\n * The status mark: a ring while the source cannot be used (processing, failed)\n * and a filled disc once it can (ready, stale) — the distinction is a shape,\n * not only a colour, so it survives greyscale.\n */\nconst StatusDot = ({ status }: { status: KnowledgeSourceStatus }) => {\n  const usable = status === \"ready\" || status === \"stale\";\n  return (\n    <span\n      aria-hidden=\"true\"\n      className={cn(\n        \"inline-block size-2 shrink-0 rounded-full border-2 border-current align-middle transition-colors duration-200 motion-reduce:transition-none\",\n        usable ? \"bg-current\" : \"bg-transparent\",\n      )}\n    />\n  );\n};\n\nconst nameText = (n: React.ReactNode, fallback: string) => (typeof n === \"string\" ? n : fallback);\n\n/**\n * Material 3 twin of `KnowledgeBase`: lets people choose which knowledge bases\n * the agent grounds in for this session — a card holding a list of checkable\n * rows (default) or a wrap of filter chips with document counts\n * (`variant=\"chips\"`). Readiness is a word on each row (Ready, Processing,\n * Needs refresh, Couldn't process) led by a ring (not usable yet) or a filled\n * disc (usable); a failed row is outlined in error, not flooded, with its\n * Retry/Refresh on the row itself. Shares the API of `@nucleux/knowledge-base`.\n */\nexport const Md3KnowledgeBase = React.forwardRef<HTMLDivElement, Md3KnowledgeBaseProps>(\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(\n            \"flex flex-col gap-3 rounded-md-md bg-md-surface-container-low p-4 text-md-on-surface shadow-md-1\",\n            className,\n          )}\n          {...props}\n        >\n          {heading && (\n            <p id={headingId} className=\"text-sm font-medium tracking-[0.1px] text-md-on-surface\">\n              {heading}\n            </p>\n          )}\n          <div className=\"flex flex-wrap gap-2\">\n            {sources.map((source) => {\n              const active = selected.includes(source.id);\n              return (\n                <Md3Chip\n                  key={source.id}\n                  variant=\"filter\"\n                  selected={active}\n                  role=\"checkbox\"\n                  aria-checked={active}\n                  aria-pressed={undefined}\n                  onClick={() => toggle(source.id)}\n                  className=\"transition-colors duration-200 motion-reduce:transition-none\"\n                >\n                  {source.name}\n                  {source.count != null && (\n                    <span className=\"font-normal\"> · {source.count.toLocaleString()}</span>\n                  )}\n                  {source.status && source.status !== \"ready\" && (\n                    <span className={cn(\"font-normal\", statusTone[source.status])}> · {statusWord[source.status]}</span>\n                  )}\n                </Md3Chip>\n              );\n            })}\n            {onAdd && (\n              <Md3Chip variant=\"assist\" icon={<Plus aria-hidden=\"true\" />} onClick={onAdd}>\n                {addLabel}\n              </Md3Chip>\n            )}\n          </div>\n        </div>\n      );\n    }\n\n    return (\n      <div\n        ref={ref}\n        className={cn(\n          \"flex flex-col gap-1 rounded-md-md bg-md-surface-container-low py-3 text-md-on-surface shadow-md-1\",\n          className,\n        )}\n        {...props}\n      >\n        {heading && (\n          <div className=\"flex items-center justify-between px-4 pb-1\">\n            <p id={headingId} className=\"text-sm font-medium tracking-[0.1px] text-md-on-surface-variant\">\n              {heading}\n            </p>\n            {selected.length > 0 && (\n              <span className=\"text-xs font-medium tracking-[0.5px] text-md-on-surface-variant\">\n                {selected.length} selected\n              </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 px-2\"\n        >\n          {sources.map((source) => {\n            const active = selected.includes(source.id);\n            const failed = source.status === \"error\";\n            const recover =\n              onRefresh && (source.status === \"stale\" || failed) ? (\n                <Md3Button\n                  variant=\"text\"\n                  onClick={() => onRefresh(source.id)}\n                  aria-label={`${failed ? \"Retry\" : \"Refresh\"} ${nameText(source.name, source.id)}`}\n                  icon={<RotateCw aria-hidden=\"true\" />}\n                  className=\"h-8 shrink-0 px-3 text-xs [&_svg]:size-4\"\n                >\n                  {failed ? \"Retry\" : \"Refresh\"}\n                </Md3Button>\n              ) : null;\n            return (\n              <li\n                key={source.id}\n                data-status={source.status}\n                className={cn(\n                  \"flex items-center gap-1 rounded-md-sm border pr-1\",\n                  failed ? \"border-md-error\" : \"border-transparent\",\n                )}\n              >\n                <button\n                  type=\"button\"\n                  role=\"checkbox\"\n                  aria-checked={active}\n                  onClick={() => toggle(source.id)}\n                  className={cn(\n                    \"relative flex min-h-14 w-full min-w-0 flex-1 items-center gap-4 overflow-hidden rounded-md-sm px-2 py-2 text-left outline-none transition-colors duration-200 motion-reduce:transition-none\",\n                    \"before:absolute before:inset-0 before:bg-md-on-surface before:opacity-0 before:transition-opacity before:content-['']\",\n                    \"hover:before:opacity-[0.08] focus-visible:before:opacity-[0.12] active:before:opacity-[0.12]\",\n                    \"focus-visible:ring-2 focus-visible:ring-inset focus-visible:ring-md-primary\",\n                    active && \"bg-md-secondary-container text-md-on-secondary-container\",\n                  )}\n                >\n                  <span className=\"relative inline-flex size-10 shrink-0 items-center justify-center rounded-full bg-md-surface-container-high text-md-on-surface-variant [&_svg]:size-5\">\n                    {source.icon ?? <FileText aria-hidden=\"true\" />}\n                  </span>\n                  <span className=\"relative flex min-w-0 flex-1 flex-col\">\n                    <span className=\"truncate text-base text-md-on-surface\">{source.name}</span>\n                    {(source.meta || source.status || source.count != null) && (\n                      <span className=\"truncate text-sm text-md-on-surface-variant\">\n                        {source.status && (\n                          <span className={cn(\"inline-flex items-center gap-1.5 font-medium\", statusTone[source.status])}>\n                            <StatusDot status={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                  {/* Material 3 checkbox visual (the row itself is the checkbox). */}\n                  <span\n                    aria-hidden=\"true\"\n                    className={cn(\n                      \"relative inline-flex size-[18px] shrink-0 items-center justify-center rounded-[2px] border-2 transition-colors duration-200 motion-reduce:transition-none [&_svg]:size-[14px]\",\n                      active\n                        ? \"border-md-primary bg-md-primary text-md-on-primary\"\n                        : \"border-md-on-surface-variant text-transparent\",\n                    )}\n                  >\n                    {active && <Check aria-hidden=\"true\" />}\n                  </span>\n                </button>\n                {recover}\n              </li>\n            );\n          })}\n        </ul>\n        {onAdd && (\n          <Md3Button\n            variant=\"text\"\n            onClick={onAdd}\n            icon={<Plus aria-hidden=\"true\" />}\n            className=\"mx-2 mt-1 self-start px-3\"\n          >\n            {addLabel}\n          </Md3Button>\n        )}\n      </div>\n    );\n  },\n);\nMd3KnowledgeBase.displayName = \"Md3KnowledgeBase\";\n\n/**\n * Material 3 twin of `KnowledgeBaseSources`: the source list under an answer —\n * exactly which knowledge-base documents (and sections) the agent read. While\n * `reading`, a pulsing band says so (politely announced; deliberately not a\n * progress bar, since no honest percentage exists) and it swaps to provenance\n * when the answer finishes. Shares the API of `@nucleux/knowledge-base`.\n */\nexport const Md3KnowledgeBaseSources = React.forwardRef<HTMLDivElement, Md3KnowledgeBaseSourcesProps>(\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-2 text-md-on-surface\", className)} {...props}>\n        <p\n          id={headingId}\n          role=\"status\"\n          aria-live=\"polite\"\n          className={cn(\n            \"inline-flex items-center gap-2 text-xs font-medium tracking-[0.5px] text-md-on-surface-variant\",\n            reading && \"self-start rounded-full bg-md-secondary-container px-3 py-1 text-md-on-secondary-container\",\n          )}\n        >\n          {reading && (\n            <span\n              aria-hidden=\"true\"\n              className=\"size-2 shrink-0 rounded-full bg-md-primary animate-pulse motion-reduce:animate-none\"\n            />\n          )}\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=\"relative size-4 shrink-0 text-md-on-surface-variant\" />\n                  <span className=\"relative truncate\">{s.name}</span>\n                  {s.section && <span className=\"relative shrink-0 text-md-on-surface-variant\">· {s.section}</span>}\n                </>\n              );\n              const cls =\n                \"relative flex items-center gap-2 overflow-hidden rounded-md-sm bg-md-surface-container px-3 py-2 text-sm text-md-on-surface\";\n              return (\n                <li key={s.id}>\n                  {s.href ? (\n                    <a\n                      href={s.href}\n                      className={cn(\n                        cls,\n                        \"outline-none before:absolute before:inset-0 before:bg-md-on-surface before:opacity-0 before:transition-opacity before:content-['']\",\n                        \"hover:before:opacity-[0.08] focus-visible:before:opacity-[0.12] focus-visible:ring-2 focus-visible:ring-md-primary\",\n                      )}\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);\nMd3KnowledgeBaseSources.displayName = \"Md3KnowledgeBaseSources\";\n\nconst coverage: Record<KnowledgeBaseCoverageLevel, { word: string; icon: React.ReactNode; cls: string }> = {\n  high: {\n    word: \"Well-covered\",\n    icon: <Check aria-hidden=\"true\" className=\"size-3.5\" />,\n    cls: \"bg-md-primary-container text-md-on-primary-container\",\n  },\n  partial: {\n    word: \"Partly covered\",\n    icon: <AlertTriangle aria-hidden=\"true\" className=\"size-3.5\" />,\n    cls: \"bg-md-tertiary-container text-md-on-tertiary-container\",\n  },\n  low: {\n    word: \"Thin coverage\",\n    icon: <CircleAlert aria-hidden=\"true\" className=\"size-3.5\" />,\n    cls: \"bg-md-error-container text-md-on-error-container\",\n  },\n};\n\n/**\n * Material 3 twin of `KnowledgeBaseCoverage`: a small tonal label saying how\n * well the knowledge base covers the question — \"Well-covered · 14 matches\",\n * or a warning when context is thin. The word carries the meaning; the\n * container colour only reinforces it. Shares the API of `@nucleux/knowledge-base`.\n */\nexport const Md3KnowledgeBaseCoverage = React.forwardRef<HTMLSpanElement, Md3KnowledgeBaseCoverageProps>(\n  ({ level, matches, label, className, ...props }, ref) => {\n    const c = coverage[level];\n    return (\n      <span\n        ref={ref}\n        data-level={level}\n        className={cn(\n          \"inline-flex h-6 items-center gap-1 rounded-md-sm px-2 text-xs font-medium tracking-[0.5px]\",\n          c.cls,\n          className,\n        )}\n        {...props}\n      >\n        {c.icon}\n        {label ?? c.word}\n        {matches != null && (\n          <span className=\"font-normal\">\n            · {matches} {matches === 1 ? \"match\" : \"matches\"}\n          </span>\n        )}\n      </span>\n    );\n  },\n);\nMd3KnowledgeBaseCoverage.displayName = \"Md3KnowledgeBaseCoverage\";\n"]}

package/package.json

@@ -1,6 +1,65 @@
 {
   "name": "@nucleux/md3-knowledge-base",
-  "version": "0.0.0-stage",
-  "stub": true,
-  "description": "Temporary package placeholder for staged publishing"
+  "version": "0.6.0",
+  "type": "module",
+  "sideEffects": false,
+  "description": "Material 3 Knowledge Base — persistent, named sources the agent grounds in, with readiness and provenance — Nucleux agentic UI for React.",
+  "keywords": [
+    "nucleux",
+    "react",
+    "ui",
+    "components",
+    "agentic",
+    "ai",
+    "tailwind",
+    "md3",
+    "material",
+    "knowledge-base",
+    "rag",
+    "sources"
+  ],
+  "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/knowledge-base": "0.6.0",
+    "@nucleux/md3-button": "0.6.0",
+    "@nucleux/md3-chip": "0.6.0",
+    "@nucleux/utils": "0.6.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/md3-knowledge-base"
+  },
+  "homepage": "https://github.com/intelligaia-open-labs/nucleux#readme",
+  "scripts": {
+    "build": "tsup"
+  }
 }