@nucleux/connectors 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,43 @@
-# Temporary Holding Version
+# @nucleux/connectors
 
-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.
+Connector — enable an external tool or data connector — 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
+
+- **`Connector`** — one service: `name`, `description`, `icon`, `connected`, `onConnect`, `onDisconnect`, `connectLabel`, `disconnectLabel`, plus
+  - `status` (`"disconnected"` | `"connecting"` | `"connected"` | `"expired"` | `"error"`; overrides `connected`), announced politely
+  - `scopes` — what the agent will be able to do, in plain verbs, shown before connecting
+  - `account` — who the sign-in is with, shown once connected ("You can disconnect at any time")
+  - `onReconnect` — for an expired sign-in (falls back to `onConnect`); `error`
+- **`ConnectorList`** (variant `connector-list`) — a list of Connector cards (`label`, default "Connected services").
+- **`ConnectorScopePicker`** (variant `scope-picker`) — "Aria can read from:" with a checkbox per channel, folder or repo, starting from nothing; `allowWrite` / `onAllowWriteChange` asks for write access as a separate switch.
+- **`ConnectorLivePill`** (variant `live-source-pill`) — "Reading 12 docs from Drive…", pulsing (the pulse stops under reduced motion), announced politely.
+- Types: `ConnectorProps`, `ConnectorStatus`, `ConnectorListProps`, `ConnectorScope`, `ConnectorScopePickerProps`, `ConnectorLivePillProps`.
+
+## Install
+
+```bash
+pnpm add @nucleux/connectors @nucleux/tokens
+```
+
+`react` / `react-dom` are peer dependencies.
+
+## Usage
+
+```tsx
+import { Connector, ConnectorList, ConnectorScopePicker, ConnectorLivePill } from "@nucleux/connectors";
+
+<ConnectorList>
+  <Connector name="Google Drive" connected account="sam@acme.com" onDisconnect={disconnect} />
+  <Connector name="Slack" scopes={["Read channels you choose"]} onConnect={connectSlack} />
+</ConnectorList>
+```
+
+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,247 @@
+"use client";
+'use strict';
+
+var React = require('react');
+var utils = require('@nucleux/utils');
+var button = require('@nucleux/button');
+var checkbox = require('@nucleux/checkbox');
+var spinner = require('@nucleux/spinner');
+var _switch = require('@nucleux/switch');
+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 statusText = {
+  connecting: "Connecting\u2026",
+  expired: "Sign-in expired",
+  error: "Couldn't connect"
+};
+var Connector = React__namespace.forwardRef(
+  ({
+    name,
+    description,
+    icon,
+    connected = false,
+    status: statusProp,
+    onConnect,
+    onDisconnect,
+    onReconnect,
+    connectLabel = "Connect",
+    disconnectLabel = "Disconnect",
+    scopes,
+    account,
+    error,
+    className,
+    ...props
+  }, ref) => {
+    const status = statusProp ?? (connected ? "connected" : "disconnected");
+    const reconnect = onReconnect ?? onConnect;
+    return /* @__PURE__ */ jsxRuntime.jsxs(
+      "div",
+      {
+        ref,
+        "data-status": status,
+        className: utils.cn(
+          "flex flex-col gap-3 rounded-xl border border-border bg-background p-4",
+          status === "expired" && "border-warning/50",
+          status === "error" && "border-destructive/50",
+          className
+        ),
+        ...props,
+        children: [
+          /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-3", children: [
+            /* @__PURE__ */ jsxRuntime.jsx("span", { className: "inline-flex size-10 shrink-0 items-center justify-center rounded-lg bg-muted text-foreground [&_svg]:size-5", children: icon ?? /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Plug, { "aria-hidden": "true" }) }),
+            /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex min-w-0 flex-1 flex-col", children: [
+              /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-sm font-medium text-foreground", children: name }),
+              description && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-xs text-muted-foreground", children: description })
+            ] }),
+            /* @__PURE__ */ jsxRuntime.jsxs("span", { role: "status", "aria-live": "polite", className: "contents", children: [
+              status === "connected" && /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "inline-flex shrink-0 items-center gap-1 rounded-full bg-success/15 px-2 py-0.5 text-xs font-medium text-success [&_svg]:size-3.5", children: [
+                /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Check, { "aria-hidden": "true" }),
+                "Connected"
+              ] }),
+              status === "connecting" && /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "inline-flex shrink-0 items-center gap-1.5 text-xs text-muted-foreground", children: [
+                /* @__PURE__ */ jsxRuntime.jsx(spinner.Spinner, { "aria-hidden": "true", role: void 0, className: "size-3.5 motion-reduce:animate-none" }),
+                statusText.connecting
+              ] }),
+              status === "expired" && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "shrink-0 rounded-full bg-warning/15 px-2 py-0.5 text-xs font-medium text-warning", children: statusText.expired }),
+              status === "error" && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "shrink-0 rounded-full bg-destructive/15 px-2 py-0.5 text-xs font-medium text-destructive", children: statusText.error })
+            ] }),
+            status === "connected" && onDisconnect && /* @__PURE__ */ jsxRuntime.jsx(
+              "button",
+              {
+                type: "button",
+                onClick: onDisconnect,
+                className: "shrink-0 rounded-md px-2 py-1 text-xs font-medium text-muted-foreground transition-colors hover:bg-accent hover:text-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring",
+                children: disconnectLabel
+              }
+            ),
+            status === "disconnected" && /* @__PURE__ */ jsxRuntime.jsx(
+              "button",
+              {
+                type: "button",
+                onClick: onConnect,
+                className: "inline-flex shrink-0 items-center rounded-lg border border-border bg-background px-3 py-1.5 text-sm font-medium text-foreground shadow-sm transition-colors hover:bg-accent focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring",
+                children: connectLabel
+              }
+            ),
+            (status === "expired" || status === "error") && reconnect && /* @__PURE__ */ jsxRuntime.jsx(button.Button, { size: "sm", variant: "secondary", onClick: reconnect, className: "shrink-0", children: status === "expired" ? "Reconnect" : "Try again" })
+          ] }),
+          status === "error" && error && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-xs text-destructive", children: error }),
+          status === "expired" && /* @__PURE__ */ jsxRuntime.jsxs("p", { className: "text-xs text-muted-foreground", children: [
+            "Nothing was lost \u2014 sign in again",
+            account ? /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+              " as ",
+              account
+            ] }) : null,
+            " to keep reading from ",
+            name,
+            "."
+          ] }),
+          (status === "disconnected" || status === "connecting") && scopes && scopes.length > 0 && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-1 border-t border-border pt-3", children: [
+            /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-xs font-medium text-foreground", children: "If you connect, the agent can:" }),
+            /* @__PURE__ */ jsxRuntime.jsx("ul", { className: "flex flex-col gap-0.5 text-xs text-muted-foreground", children: scopes.map((scope, i) => /* @__PURE__ */ jsxRuntime.jsxs("li", { className: "flex items-start gap-1.5", children: [
+              /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Check, { "aria-hidden": "true", className: "mt-0.5 size-3 shrink-0 text-muted-foreground" }),
+              scope
+            ] }, i)) })
+          ] }),
+          status === "connected" && account && /* @__PURE__ */ jsxRuntime.jsxs("p", { className: "text-xs text-muted-foreground", children: [
+            "Signed in as ",
+            account,
+            ". You can disconnect at any time."
+          ] })
+        ]
+      }
+    );
+  }
+);
+Connector.displayName = "Connector";
+var ConnectorList = React__namespace.forwardRef(
+  ({ label = "Connected services", className, children, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx("div", { ref, role: "list", "aria-label": label, className: utils.cn("flex flex-col gap-2", className), ...props, children: React__namespace.Children.map(
+    children,
+    (child) => child == null || child === false ? null : /* @__PURE__ */ jsxRuntime.jsx("div", { role: "listitem", children: child })
+  ) })
+);
+ConnectorList.displayName = "ConnectorList";
+var ConnectorScopePicker = React__namespace.forwardRef(
+  ({
+    scopes,
+    value,
+    defaultValue = [],
+    onValueChange,
+    agentName = "Aria",
+    title,
+    allowWrite,
+    onAllowWriteChange,
+    writeLabel = "Also allow changes (create, edit, post)",
+    className,
+    ...props
+  }, ref) => {
+    const [internal, setInternal] = React__namespace.useState(defaultValue);
+    const granted = value !== void 0 ? value : internal;
+    const headingId = React__namespace.useId();
+    const set = (id, on) => {
+      const next = on ? [...granted, id] : granted.filter((g) => g !== id);
+      if (value === void 0) setInternal(next);
+      onValueChange?.(next);
+    };
+    return /* @__PURE__ */ jsxRuntime.jsxs(
+      "div",
+      {
+        ref,
+        role: "group",
+        "aria-labelledby": headingId,
+        className: utils.cn("flex flex-col gap-2 rounded-xl border border-border bg-background p-3", className),
+        ...props,
+        children: [
+          /* @__PURE__ */ jsxRuntime.jsx("p", { id: headingId, className: "text-sm font-semibold text-foreground", children: title ?? /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+            agentName,
+            " can read from:"
+          ] }) }),
+          /* @__PURE__ */ jsxRuntime.jsx("ul", { className: "flex flex-col gap-1.5", children: scopes.map((scope) => {
+            const on = granted.includes(scope.id);
+            const labelId = `${headingId}-${scope.id}`;
+            return /* @__PURE__ */ jsxRuntime.jsx("li", { children: /* @__PURE__ */ jsxRuntime.jsxs("label", { className: "flex cursor-pointer items-center gap-2 text-sm", children: [
+              /* @__PURE__ */ jsxRuntime.jsx(checkbox.Checkbox, { checked: on, onCheckedChange: (c) => set(scope.id, c), "aria-labelledby": labelId }),
+              /* @__PURE__ */ jsxRuntime.jsxs("span", { id: labelId, className: utils.cn(on ? "text-foreground" : "text-muted-foreground"), children: [
+                scope.label,
+                scope.description && /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "text-xs text-muted-foreground", children: [
+                  " \xB7 ",
+                  scope.description
+                ] })
+              ] })
+            ] }) }, scope.id);
+          }) }),
+          (allowWrite !== void 0 || onAllowWriteChange) && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-between gap-3 border-t border-border pt-2", children: [
+            /* @__PURE__ */ jsxRuntime.jsx("span", { id: `${headingId}-write`, className: "text-sm text-foreground", children: writeLabel }),
+            /* @__PURE__ */ jsxRuntime.jsx(
+              _switch.Switch,
+              {
+                size: "sm",
+                checked: allowWrite ?? false,
+                onCheckedChange: onAllowWriteChange,
+                "aria-labelledby": `${headingId}-write`
+              }
+            )
+          ] })
+        ]
+      }
+    );
+  }
+);
+ConnectorScopePicker.displayName = "ConnectorScopePicker";
+var ConnectorLivePill = React__namespace.forwardRef(
+  ({ source, count, noun = "docs", className, children, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsxs(
+    "span",
+    {
+      ref,
+      role: "status",
+      "aria-live": "polite",
+      className: utils.cn(
+        "inline-flex items-center gap-2 rounded-full border border-brand/50 bg-brand-muted/50 px-3 py-1 text-xs font-semibold text-brand",
+        className
+      ),
+      ...props,
+      children: [
+        /* @__PURE__ */ jsxRuntime.jsx("span", { "aria-hidden": "true", className: "size-2 rounded-full bg-brand animate-pulse motion-reduce:animate-none" }),
+        children ?? /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+          "Reading",
+          count != null ? ` ${count} ${noun}` : "",
+          source ? /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+            " from ",
+            source
+          ] }) : null,
+          "\u2026"
+        ] })
+      ]
+    }
+  )
+);
+ConnectorLivePill.displayName = "ConnectorLivePill";
+
+exports.Connector = Connector;
+exports.ConnectorList = ConnectorList;
+exports.ConnectorLivePill = ConnectorLivePill;
+exports.ConnectorScopePicker = ConnectorScopePicker;
+//# 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","Plug","Check","Spinner","Button","Fragment","Checkbox","Switch"],"mappings":"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","file":"index.cjs","sourcesContent":["import * as React from \"react\";\nimport { cn } from \"@nucleux/utils\";\nimport { Button } from \"@nucleux/button\";\nimport { Checkbox } from \"@nucleux/checkbox\";\nimport { Spinner } from \"@nucleux/spinner\";\nimport { Switch } from \"@nucleux/switch\";\nimport { Plug, Check } from \"lucide-react\";\n\n/** Connection state. `expired` is the sign-in people meet most often: connected once, needs signing in again. */\nexport type ConnectorStatus = \"disconnected\" | \"connecting\" | \"connected\" | \"expired\" | \"error\";\n\nexport interface ConnectorProps\n  extends Omit<React.HTMLAttributes<HTMLDivElement>, \"title\"> {\n  /** Connector name, e.g. `\"GitHub\"`. */\n  name: React.ReactNode;\n  /** What the connector gives the agent access to. */\n  description?: React.ReactNode;\n  /** Connector logo/icon. Defaults to a plug glyph. */\n  icon?: React.ReactNode;\n  /** Whether the connector is already connected. Shorthand for `status=\"connected\"`. */\n  connected?: boolean;\n  /** Full connection state; overrides `connected` when set. */\n  status?: ConnectorStatus;\n  /** Called to connect. Renders the connect button when set and not connected. */\n  onConnect?: () => void;\n  /** Called to disconnect. Renders a manage/disconnect control when connected. */\n  onDisconnect?: () => void;\n  /** Called to sign in again when `status` is `\"expired\"` or `\"error\"`. Falls back to `onConnect`. */\n  onReconnect?: () => void;\n  /** Label for the connect action. Defaults to a localized \"Connect\". */\n  connectLabel?: React.ReactNode;\n  /** Label for the disconnect action. Defaults to a localized \"Disconnect\". */\n  disconnectLabel?: React.ReactNode;\n  /** What the agent will be able to do, in plain verbs — shown before the handoff, e.g. `[\"Read files in folders you choose\", \"Search file names\"]`. */\n  scopes?: React.ReactNode[];\n  /** Who the sign-in is with, e.g. `\"sam@acme.com\"`. Shown once connected. */\n  account?: React.ReactNode;\n  /** What went wrong, when `status` is `\"error\"`. */\n  error?: React.ReactNode;\n}\n\nconst statusText: Record<Exclude<ConnectorStatus, \"disconnected\">, string> = {\n  connecting: \"Connecting…\",\n  connected: \"Connected\",\n  expired: \"Sign-in expired\",\n  error: \"Couldn't connect\",\n};\n\n/**\n * A card to enable an external tool or data connector for the agent — icon,\n * name, what it unlocks, and a connect action. Before connecting it can list\n * the scopes in plain verbs (never over-grant); once connected it says who the\n * sign-in is with and that access can be withdrawn. Status is a word, announced\n * politely: Connecting…, Connected, Sign-in expired (with Reconnect), Couldn't\n * connect. Group several in a ConnectorList; narrow access with\n * ConnectorScopePicker; show live reads with ConnectorLivePill.\n * Source: Figma \"Context Expansion / Connector suggestion card\".\n */\nexport const Connector = React.forwardRef<HTMLDivElement, ConnectorProps>(\n  (\n    {\n      name,\n      description,\n      icon,\n      connected = false,\n      status: statusProp,\n      onConnect,\n      onDisconnect,\n      onReconnect,\n      connectLabel = \"Connect\",\n      disconnectLabel = \"Disconnect\",\n      scopes,\n      account,\n      error,\n      className,\n      ...props\n    },\n    ref,\n  ) => {\n    const status: ConnectorStatus = statusProp ?? (connected ? \"connected\" : \"disconnected\");\n    const reconnect = onReconnect ?? onConnect;\n    return (\n      <div\n        ref={ref}\n        data-status={status}\n        className={cn(\n          \"flex flex-col gap-3 rounded-xl border border-border bg-background p-4\",\n          status === \"expired\" && \"border-warning/50\",\n          status === \"error\" && \"border-destructive/50\",\n          className,\n        )}\n        {...props}\n      >\n        <div className=\"flex items-center gap-3\">\n          <span className=\"inline-flex size-10 shrink-0 items-center justify-center rounded-lg bg-muted text-foreground [&_svg]:size-5\">\n            {icon ?? <Plug aria-hidden=\"true\" />}\n          </span>\n          <div className=\"flex min-w-0 flex-1 flex-col\">\n            <span className=\"text-sm font-medium text-foreground\">{name}</span>\n            {description && <span className=\"text-xs text-muted-foreground\">{description}</span>}\n          </div>\n          <span role=\"status\" aria-live=\"polite\" className=\"contents\">\n            {status === \"connected\" && (\n              <span className=\"inline-flex shrink-0 items-center gap-1 rounded-full bg-success/15 px-2 py-0.5 text-xs font-medium text-success [&_svg]:size-3.5\">\n                <Check aria-hidden=\"true\" />\n                Connected\n              </span>\n            )}\n            {status === \"connecting\" && (\n              <span className=\"inline-flex shrink-0 items-center gap-1.5 text-xs text-muted-foreground\">\n                <Spinner aria-hidden=\"true\" role={undefined} className=\"size-3.5 motion-reduce:animate-none\" />\n                {statusText.connecting}\n              </span>\n            )}\n            {status === \"expired\" && (\n              <span className=\"shrink-0 rounded-full bg-warning/15 px-2 py-0.5 text-xs font-medium text-warning\">\n                {statusText.expired}\n              </span>\n            )}\n            {status === \"error\" && (\n              <span className=\"shrink-0 rounded-full bg-destructive/15 px-2 py-0.5 text-xs font-medium text-destructive\">\n                {statusText.error}\n              </span>\n            )}\n          </span>\n          {status === \"connected\" && onDisconnect && (\n            <button\n              type=\"button\"\n              onClick={onDisconnect}\n              className=\"shrink-0 rounded-md px-2 py-1 text-xs font-medium text-muted-foreground transition-colors hover:bg-accent hover:text-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring\"\n            >\n              {disconnectLabel}\n            </button>\n          )}\n          {status === \"disconnected\" && (\n            <button\n              type=\"button\"\n              onClick={onConnect}\n              className=\"inline-flex shrink-0 items-center rounded-lg border border-border bg-background px-3 py-1.5 text-sm font-medium text-foreground shadow-sm transition-colors hover:bg-accent focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring\"\n            >\n              {connectLabel}\n            </button>\n          )}\n          {(status === \"expired\" || status === \"error\") && reconnect && (\n            <Button size=\"sm\" variant=\"secondary\" onClick={reconnect} className=\"shrink-0\">\n              {status === \"expired\" ? \"Reconnect\" : \"Try again\"}\n            </Button>\n          )}\n        </div>\n        {status === \"error\" && error && <p className=\"text-xs text-destructive\">{error}</p>}\n        {status === \"expired\" && (\n          <p className=\"text-xs text-muted-foreground\">\n            Nothing was lost — sign in again{account ? <> as {account}</> : null} to keep reading from {name}.\n          </p>\n        )}\n        {(status === \"disconnected\" || status === \"connecting\") && scopes && scopes.length > 0 && (\n          <div className=\"flex flex-col gap-1 border-t border-border pt-3\">\n            <p className=\"text-xs font-medium text-foreground\">If you connect, the agent can:</p>\n            <ul className=\"flex flex-col gap-0.5 text-xs text-muted-foreground\">\n              {scopes.map((scope, i) => (\n                <li key={i} className=\"flex items-start gap-1.5\">\n                  <Check aria-hidden=\"true\" className=\"mt-0.5 size-3 shrink-0 text-muted-foreground\" />\n                  {scope}\n                </li>\n              ))}\n            </ul>\n          </div>\n        )}\n        {status === \"connected\" && account && (\n          <p className=\"text-xs text-muted-foreground\">\n            Signed in as {account}. You can disconnect at any time.\n          </p>\n        )}\n      </div>\n    );\n  },\n);\nConnector.displayName = \"Connector\";\n\nexport interface ConnectorListProps extends React.HTMLAttributes<HTMLDivElement> {\n  /** Accessible name. Defaults to `\"Connected services\"`. */\n  label?: string;\n}\n\n/**\n * The connector list: available services with their status and a connect\n * button, one per row. Wrap Connector cards; each child becomes a list item.\n */\nexport const ConnectorList = React.forwardRef<HTMLDivElement, ConnectorListProps>(\n  ({ label = \"Connected services\", className, children, ...props }, ref) => (\n    <div ref={ref} role=\"list\" aria-label={label} className={cn(\"flex flex-col gap-2\", className)} {...props}>\n      {React.Children.map(children, (child) =>\n        child == null || child === false ? null : <div role=\"listitem\">{child}</div>,\n      )}\n    </div>\n  ),\n);\nConnectorList.displayName = \"ConnectorList\";\n\n/** One thing the agent could read: a channel, folder, repo or branch. */\nexport interface ConnectorScope {\n  /** Stable id. */\n  id: string;\n  /** Label, e.g. `\"#renewals\"`. */\n  label: React.ReactNode;\n  /** Optional detail, e.g. `\"412 messages\"`. */\n  description?: React.ReactNode;\n}\n\nexport interface ConnectorScopePickerProps\n  extends Omit<React.HTMLAttributes<HTMLDivElement>, \"title\" | \"defaultValue\" | \"onChange\"> {\n  /** The scopes on offer. */\n  scopes: ConnectorScope[];\n  /** Granted scope ids (controlled). */\n  value?: string[];\n  /** Initial grant (uncontrolled). Defaults to none — least privilege. */\n  defaultValue?: string[];\n  /** Called with the granted ids. */\n  onValueChange?: (ids: string[]) => void;\n  /** Who reads. Defaults to `\"Aria\"`. */\n  agentName?: React.ReactNode;\n  /** Heading override. Defaults to `\"<agent> can read from:\"`. */\n  title?: React.ReactNode;\n  /** Write access, asked separately (controlled). Renders the write switch when this or `onAllowWriteChange` is set. */\n  allowWrite?: boolean;\n  /** Called when write access is switched. */\n  onAllowWriteChange?: (on: boolean) => void;\n  /** Label for the write switch. Defaults to `\"Also allow changes (create, edit, post)\"`. */\n  writeLabel?: React.ReactNode;\n}\n\n/**\n * The scope picker: exactly what the agent can read — workspace, channel,\n * folder, repo — granular rather than all-or-nothing, starting from nothing.\n * Write access, when offered, is a separate and visible question.\n */\nexport const ConnectorScopePicker = React.forwardRef<HTMLDivElement, ConnectorScopePickerProps>(\n  (\n    {\n      scopes,\n      value,\n      defaultValue = [],\n      onValueChange,\n      agentName = \"Aria\",\n      title,\n      allowWrite,\n      onAllowWriteChange,\n      writeLabel = \"Also allow changes (create, edit, post)\",\n      className,\n      ...props\n    },\n    ref,\n  ) => {\n    const [internal, setInternal] = React.useState<string[]>(defaultValue);\n    const granted = value !== undefined ? value : internal;\n    const headingId = React.useId();\n    const set = (id: string, on: boolean) => {\n      const next = on ? [...granted, id] : granted.filter((g) => g !== id);\n      if (value === undefined) setInternal(next);\n      onValueChange?.(next);\n    };\n    return (\n      <div\n        ref={ref}\n        role=\"group\"\n        aria-labelledby={headingId}\n        className={cn(\"flex flex-col gap-2 rounded-xl border border-border bg-background p-3\", className)}\n        {...props}\n      >\n        <p id={headingId} className=\"text-sm font-semibold text-foreground\">\n          {title ?? <>{agentName} can read from:</>}\n        </p>\n        <ul className=\"flex flex-col gap-1.5\">\n          {scopes.map((scope) => {\n            const on = granted.includes(scope.id);\n            const labelId = `${headingId}-${scope.id}`;\n            return (\n              <li key={scope.id}>\n                <label className=\"flex cursor-pointer items-center gap-2 text-sm\">\n                  <Checkbox checked={on} onCheckedChange={(c) => set(scope.id, c)} aria-labelledby={labelId} />\n                  <span id={labelId} className={cn(on ? \"text-foreground\" : \"text-muted-foreground\")}>\n                    {scope.label}\n                    {scope.description && <span className=\"text-xs text-muted-foreground\"> · {scope.description}</span>}\n                  </span>\n                </label>\n              </li>\n            );\n          })}\n        </ul>\n        {(allowWrite !== undefined || onAllowWriteChange) && (\n          <div className=\"flex items-center justify-between gap-3 border-t border-border pt-2\">\n            <span id={`${headingId}-write`} className=\"text-sm text-foreground\">\n              {writeLabel}\n            </span>\n            <Switch\n              size=\"sm\"\n              checked={allowWrite ?? false}\n              onCheckedChange={onAllowWriteChange}\n              aria-labelledby={`${headingId}-write`}\n            />\n          </div>\n        )}\n      </div>\n    );\n  },\n);\nConnectorScopePicker.displayName = \"ConnectorScopePicker\";\n\nexport interface ConnectorLivePillProps extends React.HTMLAttributes<HTMLSpanElement> {\n  /** The connector being read, e.g. `\"Drive\"`. */\n  source?: React.ReactNode;\n  /** How many items are being read. */\n  count?: number;\n  /** Noun for `count`. Defaults to `\"docs\"`. */\n  noun?: string;\n}\n\n/**\n * The live source pill: a pulsing chip that shows the agent is reading from a\n * connector right now (\"Reading 12 docs from Drive…\"), announced politely.\n * Pass children to word it yourself. The pulse stops under reduced motion.\n */\nexport const ConnectorLivePill = React.forwardRef<HTMLSpanElement, ConnectorLivePillProps>(\n  ({ source, count, noun = \"docs\", className, children, ...props }, ref) => (\n    <span\n      ref={ref}\n      role=\"status\"\n      aria-live=\"polite\"\n      className={cn(\n        \"inline-flex items-center gap-2 rounded-full border border-brand/50 bg-brand-muted/50 px-3 py-1 text-xs font-semibold text-brand\",\n        className,\n      )}\n      {...props}\n    >\n      <span aria-hidden=\"true\" className=\"size-2 rounded-full bg-brand animate-pulse motion-reduce:animate-none\" />\n      {children ?? (\n        <>\n          Reading{count != null ? ` ${count} ${noun}` : \"\"}\n          {source ? <> from {source}</> : null}…\n        </>\n      )}\n    </span>\n  ),\n);\nConnectorLivePill.displayName = \"ConnectorLivePill\";\n"]}

package/dist/index.d.cts

@@ -0,0 +1,103 @@
+import * as React from 'react';
+
+/** Connection state. `expired` is the sign-in people meet most often: connected once, needs signing in again. */
+type ConnectorStatus = "disconnected" | "connecting" | "connected" | "expired" | "error";
+interface ConnectorProps extends Omit<React.HTMLAttributes<HTMLDivElement>, "title"> {
+    /** Connector name, e.g. `"GitHub"`. */
+    name: React.ReactNode;
+    /** What the connector gives the agent access to. */
+    description?: React.ReactNode;
+    /** Connector logo/icon. Defaults to a plug glyph. */
+    icon?: React.ReactNode;
+    /** Whether the connector is already connected. Shorthand for `status="connected"`. */
+    connected?: boolean;
+    /** Full connection state; overrides `connected` when set. */
+    status?: ConnectorStatus;
+    /** Called to connect. Renders the connect button when set and not connected. */
+    onConnect?: () => void;
+    /** Called to disconnect. Renders a manage/disconnect control when connected. */
+    onDisconnect?: () => void;
+    /** Called to sign in again when `status` is `"expired"` or `"error"`. Falls back to `onConnect`. */
+    onReconnect?: () => void;
+    /** Label for the connect action. Defaults to a localized "Connect". */
+    connectLabel?: React.ReactNode;
+    /** Label for the disconnect action. Defaults to a localized "Disconnect". */
+    disconnectLabel?: React.ReactNode;
+    /** What the agent will be able to do, in plain verbs — shown before the handoff, e.g. `["Read files in folders you choose", "Search file names"]`. */
+    scopes?: React.ReactNode[];
+    /** Who the sign-in is with, e.g. `"sam@acme.com"`. Shown once connected. */
+    account?: React.ReactNode;
+    /** What went wrong, when `status` is `"error"`. */
+    error?: React.ReactNode;
+}
+/**
+ * A card to enable an external tool or data connector for the agent — icon,
+ * name, what it unlocks, and a connect action. Before connecting it can list
+ * the scopes in plain verbs (never over-grant); once connected it says who the
+ * sign-in is with and that access can be withdrawn. Status is a word, announced
+ * politely: Connecting…, Connected, Sign-in expired (with Reconnect), Couldn't
+ * connect. Group several in a ConnectorList; narrow access with
+ * ConnectorScopePicker; show live reads with ConnectorLivePill.
+ * Source: Figma "Context Expansion / Connector suggestion card".
+ */
+declare const Connector: React.ForwardRefExoticComponent<ConnectorProps & React.RefAttributes<HTMLDivElement>>;
+interface ConnectorListProps extends React.HTMLAttributes<HTMLDivElement> {
+    /** Accessible name. Defaults to `"Connected services"`. */
+    label?: string;
+}
+/**
+ * The connector list: available services with their status and a connect
+ * button, one per row. Wrap Connector cards; each child becomes a list item.
+ */
+declare const ConnectorList: React.ForwardRefExoticComponent<ConnectorListProps & React.RefAttributes<HTMLDivElement>>;
+/** One thing the agent could read: a channel, folder, repo or branch. */
+interface ConnectorScope {
+    /** Stable id. */
+    id: string;
+    /** Label, e.g. `"#renewals"`. */
+    label: React.ReactNode;
+    /** Optional detail, e.g. `"412 messages"`. */
+    description?: React.ReactNode;
+}
+interface ConnectorScopePickerProps extends Omit<React.HTMLAttributes<HTMLDivElement>, "title" | "defaultValue" | "onChange"> {
+    /** The scopes on offer. */
+    scopes: ConnectorScope[];
+    /** Granted scope ids (controlled). */
+    value?: string[];
+    /** Initial grant (uncontrolled). Defaults to none — least privilege. */
+    defaultValue?: string[];
+    /** Called with the granted ids. */
+    onValueChange?: (ids: string[]) => void;
+    /** Who reads. Defaults to `"Aria"`. */
+    agentName?: React.ReactNode;
+    /** Heading override. Defaults to `"<agent> can read from:"`. */
+    title?: React.ReactNode;
+    /** Write access, asked separately (controlled). Renders the write switch when this or `onAllowWriteChange` is set. */
+    allowWrite?: boolean;
+    /** Called when write access is switched. */
+    onAllowWriteChange?: (on: boolean) => void;
+    /** Label for the write switch. Defaults to `"Also allow changes (create, edit, post)"`. */
+    writeLabel?: React.ReactNode;
+}
+/**
+ * The scope picker: exactly what the agent can read — workspace, channel,
+ * folder, repo — granular rather than all-or-nothing, starting from nothing.
+ * Write access, when offered, is a separate and visible question.
+ */
+declare const ConnectorScopePicker: React.ForwardRefExoticComponent<ConnectorScopePickerProps & React.RefAttributes<HTMLDivElement>>;
+interface ConnectorLivePillProps extends React.HTMLAttributes<HTMLSpanElement> {
+    /** The connector being read, e.g. `"Drive"`. */
+    source?: React.ReactNode;
+    /** How many items are being read. */
+    count?: number;
+    /** Noun for `count`. Defaults to `"docs"`. */
+    noun?: string;
+}
+/**
+ * The live source pill: a pulsing chip that shows the agent is reading from a
+ * connector right now ("Reading 12 docs from Drive…"), announced politely.
+ * Pass children to word it yourself. The pulse stops under reduced motion.
+ */
+declare const ConnectorLivePill: React.ForwardRefExoticComponent<ConnectorLivePillProps & React.RefAttributes<HTMLSpanElement>>;
+
+export { Connector, ConnectorList, type ConnectorListProps, ConnectorLivePill, type ConnectorLivePillProps, type ConnectorProps, type ConnectorScope, ConnectorScopePicker, type ConnectorScopePickerProps, type ConnectorStatus };

package/dist/index.d.ts

@@ -0,0 +1,103 @@
+import * as React from 'react';
+
+/** Connection state. `expired` is the sign-in people meet most often: connected once, needs signing in again. */
+type ConnectorStatus = "disconnected" | "connecting" | "connected" | "expired" | "error";
+interface ConnectorProps extends Omit<React.HTMLAttributes<HTMLDivElement>, "title"> {
+    /** Connector name, e.g. `"GitHub"`. */
+    name: React.ReactNode;
+    /** What the connector gives the agent access to. */
+    description?: React.ReactNode;
+    /** Connector logo/icon. Defaults to a plug glyph. */
+    icon?: React.ReactNode;
+    /** Whether the connector is already connected. Shorthand for `status="connected"`. */
+    connected?: boolean;
+    /** Full connection state; overrides `connected` when set. */
+    status?: ConnectorStatus;
+    /** Called to connect. Renders the connect button when set and not connected. */
+    onConnect?: () => void;
+    /** Called to disconnect. Renders a manage/disconnect control when connected. */
+    onDisconnect?: () => void;
+    /** Called to sign in again when `status` is `"expired"` or `"error"`. Falls back to `onConnect`. */
+    onReconnect?: () => void;
+    /** Label for the connect action. Defaults to a localized "Connect". */
+    connectLabel?: React.ReactNode;
+    /** Label for the disconnect action. Defaults to a localized "Disconnect". */
+    disconnectLabel?: React.ReactNode;
+    /** What the agent will be able to do, in plain verbs — shown before the handoff, e.g. `["Read files in folders you choose", "Search file names"]`. */
+    scopes?: React.ReactNode[];
+    /** Who the sign-in is with, e.g. `"sam@acme.com"`. Shown once connected. */
+    account?: React.ReactNode;
+    /** What went wrong, when `status` is `"error"`. */
+    error?: React.ReactNode;
+}
+/**
+ * A card to enable an external tool or data connector for the agent — icon,
+ * name, what it unlocks, and a connect action. Before connecting it can list
+ * the scopes in plain verbs (never over-grant); once connected it says who the
+ * sign-in is with and that access can be withdrawn. Status is a word, announced
+ * politely: Connecting…, Connected, Sign-in expired (with Reconnect), Couldn't
+ * connect. Group several in a ConnectorList; narrow access with
+ * ConnectorScopePicker; show live reads with ConnectorLivePill.
+ * Source: Figma "Context Expansion / Connector suggestion card".
+ */
+declare const Connector: React.ForwardRefExoticComponent<ConnectorProps & React.RefAttributes<HTMLDivElement>>;
+interface ConnectorListProps extends React.HTMLAttributes<HTMLDivElement> {
+    /** Accessible name. Defaults to `"Connected services"`. */
+    label?: string;
+}
+/**
+ * The connector list: available services with their status and a connect
+ * button, one per row. Wrap Connector cards; each child becomes a list item.
+ */
+declare const ConnectorList: React.ForwardRefExoticComponent<ConnectorListProps & React.RefAttributes<HTMLDivElement>>;
+/** One thing the agent could read: a channel, folder, repo or branch. */
+interface ConnectorScope {
+    /** Stable id. */
+    id: string;
+    /** Label, e.g. `"#renewals"`. */
+    label: React.ReactNode;
+    /** Optional detail, e.g. `"412 messages"`. */
+    description?: React.ReactNode;
+}
+interface ConnectorScopePickerProps extends Omit<React.HTMLAttributes<HTMLDivElement>, "title" | "defaultValue" | "onChange"> {
+    /** The scopes on offer. */
+    scopes: ConnectorScope[];
+    /** Granted scope ids (controlled). */
+    value?: string[];
+    /** Initial grant (uncontrolled). Defaults to none — least privilege. */
+    defaultValue?: string[];
+    /** Called with the granted ids. */
+    onValueChange?: (ids: string[]) => void;
+    /** Who reads. Defaults to `"Aria"`. */
+    agentName?: React.ReactNode;
+    /** Heading override. Defaults to `"<agent> can read from:"`. */
+    title?: React.ReactNode;
+    /** Write access, asked separately (controlled). Renders the write switch when this or `onAllowWriteChange` is set. */
+    allowWrite?: boolean;
+    /** Called when write access is switched. */
+    onAllowWriteChange?: (on: boolean) => void;
+    /** Label for the write switch. Defaults to `"Also allow changes (create, edit, post)"`. */
+    writeLabel?: React.ReactNode;
+}
+/**
+ * The scope picker: exactly what the agent can read — workspace, channel,
+ * folder, repo — granular rather than all-or-nothing, starting from nothing.
+ * Write access, when offered, is a separate and visible question.
+ */
+declare const ConnectorScopePicker: React.ForwardRefExoticComponent<ConnectorScopePickerProps & React.RefAttributes<HTMLDivElement>>;
+interface ConnectorLivePillProps extends React.HTMLAttributes<HTMLSpanElement> {
+    /** The connector being read, e.g. `"Drive"`. */
+    source?: React.ReactNode;
+    /** How many items are being read. */
+    count?: number;
+    /** Noun for `count`. Defaults to `"docs"`. */
+    noun?: string;
+}
+/**
+ * The live source pill: a pulsing chip that shows the agent is reading from a
+ * connector right now ("Reading 12 docs from Drive…"), announced politely.
+ * Pass children to word it yourself. The pulse stops under reduced motion.
+ */
+declare const ConnectorLivePill: React.ForwardRefExoticComponent<ConnectorLivePillProps & React.RefAttributes<HTMLSpanElement>>;
+
+export { Connector, ConnectorList, type ConnectorListProps, ConnectorLivePill, type ConnectorLivePillProps, type ConnectorProps, type ConnectorScope, ConnectorScopePicker, type ConnectorScopePickerProps, type ConnectorStatus };

package/dist/index.js

@@ -0,0 +1,222 @@
+"use client";
+import * as React from 'react';
+import { cn } from '@nucleux/utils';
+import { Button } from '@nucleux/button';
+import { Checkbox } from '@nucleux/checkbox';
+import { Spinner } from '@nucleux/spinner';
+import { Switch } from '@nucleux/switch';
+import { Plug, Check } from 'lucide-react';
+import { jsxs, jsx, Fragment } from 'react/jsx-runtime';
+
+// src/index.tsx
+var statusText = {
+  connecting: "Connecting\u2026",
+  expired: "Sign-in expired",
+  error: "Couldn't connect"
+};
+var Connector = React.forwardRef(
+  ({
+    name,
+    description,
+    icon,
+    connected = false,
+    status: statusProp,
+    onConnect,
+    onDisconnect,
+    onReconnect,
+    connectLabel = "Connect",
+    disconnectLabel = "Disconnect",
+    scopes,
+    account,
+    error,
+    className,
+    ...props
+  }, ref) => {
+    const status = statusProp ?? (connected ? "connected" : "disconnected");
+    const reconnect = onReconnect ?? onConnect;
+    return /* @__PURE__ */ jsxs(
+      "div",
+      {
+        ref,
+        "data-status": status,
+        className: cn(
+          "flex flex-col gap-3 rounded-xl border border-border bg-background p-4",
+          status === "expired" && "border-warning/50",
+          status === "error" && "border-destructive/50",
+          className
+        ),
+        ...props,
+        children: [
+          /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-3", children: [
+            /* @__PURE__ */ jsx("span", { className: "inline-flex size-10 shrink-0 items-center justify-center rounded-lg bg-muted text-foreground [&_svg]:size-5", children: icon ?? /* @__PURE__ */ jsx(Plug, { "aria-hidden": "true" }) }),
+            /* @__PURE__ */ jsxs("div", { className: "flex min-w-0 flex-1 flex-col", children: [
+              /* @__PURE__ */ jsx("span", { className: "text-sm font-medium text-foreground", children: name }),
+              description && /* @__PURE__ */ jsx("span", { className: "text-xs text-muted-foreground", children: description })
+            ] }),
+            /* @__PURE__ */ jsxs("span", { role: "status", "aria-live": "polite", className: "contents", children: [
+              status === "connected" && /* @__PURE__ */ jsxs("span", { className: "inline-flex shrink-0 items-center gap-1 rounded-full bg-success/15 px-2 py-0.5 text-xs font-medium text-success [&_svg]:size-3.5", children: [
+                /* @__PURE__ */ jsx(Check, { "aria-hidden": "true" }),
+                "Connected"
+              ] }),
+              status === "connecting" && /* @__PURE__ */ jsxs("span", { className: "inline-flex shrink-0 items-center gap-1.5 text-xs text-muted-foreground", children: [
+                /* @__PURE__ */ jsx(Spinner, { "aria-hidden": "true", role: void 0, className: "size-3.5 motion-reduce:animate-none" }),
+                statusText.connecting
+              ] }),
+              status === "expired" && /* @__PURE__ */ jsx("span", { className: "shrink-0 rounded-full bg-warning/15 px-2 py-0.5 text-xs font-medium text-warning", children: statusText.expired }),
+              status === "error" && /* @__PURE__ */ jsx("span", { className: "shrink-0 rounded-full bg-destructive/15 px-2 py-0.5 text-xs font-medium text-destructive", children: statusText.error })
+            ] }),
+            status === "connected" && onDisconnect && /* @__PURE__ */ jsx(
+              "button",
+              {
+                type: "button",
+                onClick: onDisconnect,
+                className: "shrink-0 rounded-md px-2 py-1 text-xs font-medium text-muted-foreground transition-colors hover:bg-accent hover:text-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring",
+                children: disconnectLabel
+              }
+            ),
+            status === "disconnected" && /* @__PURE__ */ jsx(
+              "button",
+              {
+                type: "button",
+                onClick: onConnect,
+                className: "inline-flex shrink-0 items-center rounded-lg border border-border bg-background px-3 py-1.5 text-sm font-medium text-foreground shadow-sm transition-colors hover:bg-accent focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring",
+                children: connectLabel
+              }
+            ),
+            (status === "expired" || status === "error") && reconnect && /* @__PURE__ */ jsx(Button, { size: "sm", variant: "secondary", onClick: reconnect, className: "shrink-0", children: status === "expired" ? "Reconnect" : "Try again" })
+          ] }),
+          status === "error" && error && /* @__PURE__ */ jsx("p", { className: "text-xs text-destructive", children: error }),
+          status === "expired" && /* @__PURE__ */ jsxs("p", { className: "text-xs text-muted-foreground", children: [
+            "Nothing was lost \u2014 sign in again",
+            account ? /* @__PURE__ */ jsxs(Fragment, { children: [
+              " as ",
+              account
+            ] }) : null,
+            " to keep reading from ",
+            name,
+            "."
+          ] }),
+          (status === "disconnected" || status === "connecting") && scopes && scopes.length > 0 && /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-1 border-t border-border pt-3", children: [
+            /* @__PURE__ */ jsx("p", { className: "text-xs font-medium text-foreground", children: "If you connect, the agent can:" }),
+            /* @__PURE__ */ jsx("ul", { className: "flex flex-col gap-0.5 text-xs text-muted-foreground", children: scopes.map((scope, i) => /* @__PURE__ */ jsxs("li", { className: "flex items-start gap-1.5", children: [
+              /* @__PURE__ */ jsx(Check, { "aria-hidden": "true", className: "mt-0.5 size-3 shrink-0 text-muted-foreground" }),
+              scope
+            ] }, i)) })
+          ] }),
+          status === "connected" && account && /* @__PURE__ */ jsxs("p", { className: "text-xs text-muted-foreground", children: [
+            "Signed in as ",
+            account,
+            ". You can disconnect at any time."
+          ] })
+        ]
+      }
+    );
+  }
+);
+Connector.displayName = "Connector";
+var ConnectorList = React.forwardRef(
+  ({ label = "Connected services", className, children, ...props }, ref) => /* @__PURE__ */ jsx("div", { ref, role: "list", "aria-label": label, className: cn("flex flex-col gap-2", className), ...props, children: React.Children.map(
+    children,
+    (child) => child == null || child === false ? null : /* @__PURE__ */ jsx("div", { role: "listitem", children: child })
+  ) })
+);
+ConnectorList.displayName = "ConnectorList";
+var ConnectorScopePicker = React.forwardRef(
+  ({
+    scopes,
+    value,
+    defaultValue = [],
+    onValueChange,
+    agentName = "Aria",
+    title,
+    allowWrite,
+    onAllowWriteChange,
+    writeLabel = "Also allow changes (create, edit, post)",
+    className,
+    ...props
+  }, ref) => {
+    const [internal, setInternal] = React.useState(defaultValue);
+    const granted = value !== void 0 ? value : internal;
+    const headingId = React.useId();
+    const set = (id, on) => {
+      const next = on ? [...granted, id] : granted.filter((g) => g !== id);
+      if (value === void 0) setInternal(next);
+      onValueChange?.(next);
+    };
+    return /* @__PURE__ */ jsxs(
+      "div",
+      {
+        ref,
+        role: "group",
+        "aria-labelledby": headingId,
+        className: cn("flex flex-col gap-2 rounded-xl border border-border bg-background p-3", className),
+        ...props,
+        children: [
+          /* @__PURE__ */ jsx("p", { id: headingId, className: "text-sm font-semibold text-foreground", children: title ?? /* @__PURE__ */ jsxs(Fragment, { children: [
+            agentName,
+            " can read from:"
+          ] }) }),
+          /* @__PURE__ */ jsx("ul", { className: "flex flex-col gap-1.5", children: scopes.map((scope) => {
+            const on = granted.includes(scope.id);
+            const labelId = `${headingId}-${scope.id}`;
+            return /* @__PURE__ */ jsx("li", { children: /* @__PURE__ */ jsxs("label", { className: "flex cursor-pointer items-center gap-2 text-sm", children: [
+              /* @__PURE__ */ jsx(Checkbox, { checked: on, onCheckedChange: (c) => set(scope.id, c), "aria-labelledby": labelId }),
+              /* @__PURE__ */ jsxs("span", { id: labelId, className: cn(on ? "text-foreground" : "text-muted-foreground"), children: [
+                scope.label,
+                scope.description && /* @__PURE__ */ jsxs("span", { className: "text-xs text-muted-foreground", children: [
+                  " \xB7 ",
+                  scope.description
+                ] })
+              ] })
+            ] }) }, scope.id);
+          }) }),
+          (allowWrite !== void 0 || onAllowWriteChange) && /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between gap-3 border-t border-border pt-2", children: [
+            /* @__PURE__ */ jsx("span", { id: `${headingId}-write`, className: "text-sm text-foreground", children: writeLabel }),
+            /* @__PURE__ */ jsx(
+              Switch,
+              {
+                size: "sm",
+                checked: allowWrite ?? false,
+                onCheckedChange: onAllowWriteChange,
+                "aria-labelledby": `${headingId}-write`
+              }
+            )
+          ] })
+        ]
+      }
+    );
+  }
+);
+ConnectorScopePicker.displayName = "ConnectorScopePicker";
+var ConnectorLivePill = React.forwardRef(
+  ({ source, count, noun = "docs", className, children, ...props }, ref) => /* @__PURE__ */ jsxs(
+    "span",
+    {
+      ref,
+      role: "status",
+      "aria-live": "polite",
+      className: cn(
+        "inline-flex items-center gap-2 rounded-full border border-brand/50 bg-brand-muted/50 px-3 py-1 text-xs font-semibold text-brand",
+        className
+      ),
+      ...props,
+      children: [
+        /* @__PURE__ */ jsx("span", { "aria-hidden": "true", className: "size-2 rounded-full bg-brand animate-pulse motion-reduce:animate-none" }),
+        children ?? /* @__PURE__ */ jsxs(Fragment, { children: [
+          "Reading",
+          count != null ? ` ${count} ${noun}` : "",
+          source ? /* @__PURE__ */ jsxs(Fragment, { children: [
+            " from ",
+            source
+          ] }) : null,
+          "\u2026"
+        ] })
+      ]
+    }
+  )
+);
+ConnectorLivePill.displayName = "ConnectorLivePill";
+
+export { Connector, ConnectorList, ConnectorLivePill, ConnectorScopePicker };
+//# 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 { Button } from \"@nucleux/button\";\nimport { Checkbox } from \"@nucleux/checkbox\";\nimport { Spinner } from \"@nucleux/spinner\";\nimport { Switch } from \"@nucleux/switch\";\nimport { Plug, Check } from \"lucide-react\";\n\n/** Connection state. `expired` is the sign-in people meet most often: connected once, needs signing in again. */\nexport type ConnectorStatus = \"disconnected\" | \"connecting\" | \"connected\" | \"expired\" | \"error\";\n\nexport interface ConnectorProps\n  extends Omit<React.HTMLAttributes<HTMLDivElement>, \"title\"> {\n  /** Connector name, e.g. `\"GitHub\"`. */\n  name: React.ReactNode;\n  /** What the connector gives the agent access to. */\n  description?: React.ReactNode;\n  /** Connector logo/icon. Defaults to a plug glyph. */\n  icon?: React.ReactNode;\n  /** Whether the connector is already connected. Shorthand for `status=\"connected\"`. */\n  connected?: boolean;\n  /** Full connection state; overrides `connected` when set. */\n  status?: ConnectorStatus;\n  /** Called to connect. Renders the connect button when set and not connected. */\n  onConnect?: () => void;\n  /** Called to disconnect. Renders a manage/disconnect control when connected. */\n  onDisconnect?: () => void;\n  /** Called to sign in again when `status` is `\"expired\"` or `\"error\"`. Falls back to `onConnect`. */\n  onReconnect?: () => void;\n  /** Label for the connect action. Defaults to a localized \"Connect\". */\n  connectLabel?: React.ReactNode;\n  /** Label for the disconnect action. Defaults to a localized \"Disconnect\". */\n  disconnectLabel?: React.ReactNode;\n  /** What the agent will be able to do, in plain verbs — shown before the handoff, e.g. `[\"Read files in folders you choose\", \"Search file names\"]`. */\n  scopes?: React.ReactNode[];\n  /** Who the sign-in is with, e.g. `\"sam@acme.com\"`. Shown once connected. */\n  account?: React.ReactNode;\n  /** What went wrong, when `status` is `\"error\"`. */\n  error?: React.ReactNode;\n}\n\nconst statusText: Record<Exclude<ConnectorStatus, \"disconnected\">, string> = {\n  connecting: \"Connecting…\",\n  connected: \"Connected\",\n  expired: \"Sign-in expired\",\n  error: \"Couldn't connect\",\n};\n\n/**\n * A card to enable an external tool or data connector for the agent — icon,\n * name, what it unlocks, and a connect action. Before connecting it can list\n * the scopes in plain verbs (never over-grant); once connected it says who the\n * sign-in is with and that access can be withdrawn. Status is a word, announced\n * politely: Connecting…, Connected, Sign-in expired (with Reconnect), Couldn't\n * connect. Group several in a ConnectorList; narrow access with\n * ConnectorScopePicker; show live reads with ConnectorLivePill.\n * Source: Figma \"Context Expansion / Connector suggestion card\".\n */\nexport const Connector = React.forwardRef<HTMLDivElement, ConnectorProps>(\n  (\n    {\n      name,\n      description,\n      icon,\n      connected = false,\n      status: statusProp,\n      onConnect,\n      onDisconnect,\n      onReconnect,\n      connectLabel = \"Connect\",\n      disconnectLabel = \"Disconnect\",\n      scopes,\n      account,\n      error,\n      className,\n      ...props\n    },\n    ref,\n  ) => {\n    const status: ConnectorStatus = statusProp ?? (connected ? \"connected\" : \"disconnected\");\n    const reconnect = onReconnect ?? onConnect;\n    return (\n      <div\n        ref={ref}\n        data-status={status}\n        className={cn(\n          \"flex flex-col gap-3 rounded-xl border border-border bg-background p-4\",\n          status === \"expired\" && \"border-warning/50\",\n          status === \"error\" && \"border-destructive/50\",\n          className,\n        )}\n        {...props}\n      >\n        <div className=\"flex items-center gap-3\">\n          <span className=\"inline-flex size-10 shrink-0 items-center justify-center rounded-lg bg-muted text-foreground [&_svg]:size-5\">\n            {icon ?? <Plug aria-hidden=\"true\" />}\n          </span>\n          <div className=\"flex min-w-0 flex-1 flex-col\">\n            <span className=\"text-sm font-medium text-foreground\">{name}</span>\n            {description && <span className=\"text-xs text-muted-foreground\">{description}</span>}\n          </div>\n          <span role=\"status\" aria-live=\"polite\" className=\"contents\">\n            {status === \"connected\" && (\n              <span className=\"inline-flex shrink-0 items-center gap-1 rounded-full bg-success/15 px-2 py-0.5 text-xs font-medium text-success [&_svg]:size-3.5\">\n                <Check aria-hidden=\"true\" />\n                Connected\n              </span>\n            )}\n            {status === \"connecting\" && (\n              <span className=\"inline-flex shrink-0 items-center gap-1.5 text-xs text-muted-foreground\">\n                <Spinner aria-hidden=\"true\" role={undefined} className=\"size-3.5 motion-reduce:animate-none\" />\n                {statusText.connecting}\n              </span>\n            )}\n            {status === \"expired\" && (\n              <span className=\"shrink-0 rounded-full bg-warning/15 px-2 py-0.5 text-xs font-medium text-warning\">\n                {statusText.expired}\n              </span>\n            )}\n            {status === \"error\" && (\n              <span className=\"shrink-0 rounded-full bg-destructive/15 px-2 py-0.5 text-xs font-medium text-destructive\">\n                {statusText.error}\n              </span>\n            )}\n          </span>\n          {status === \"connected\" && onDisconnect && (\n            <button\n              type=\"button\"\n              onClick={onDisconnect}\n              className=\"shrink-0 rounded-md px-2 py-1 text-xs font-medium text-muted-foreground transition-colors hover:bg-accent hover:text-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring\"\n            >\n              {disconnectLabel}\n            </button>\n          )}\n          {status === \"disconnected\" && (\n            <button\n              type=\"button\"\n              onClick={onConnect}\n              className=\"inline-flex shrink-0 items-center rounded-lg border border-border bg-background px-3 py-1.5 text-sm font-medium text-foreground shadow-sm transition-colors hover:bg-accent focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring\"\n            >\n              {connectLabel}\n            </button>\n          )}\n          {(status === \"expired\" || status === \"error\") && reconnect && (\n            <Button size=\"sm\" variant=\"secondary\" onClick={reconnect} className=\"shrink-0\">\n              {status === \"expired\" ? \"Reconnect\" : \"Try again\"}\n            </Button>\n          )}\n        </div>\n        {status === \"error\" && error && <p className=\"text-xs text-destructive\">{error}</p>}\n        {status === \"expired\" && (\n          <p className=\"text-xs text-muted-foreground\">\n            Nothing was lost — sign in again{account ? <> as {account}</> : null} to keep reading from {name}.\n          </p>\n        )}\n        {(status === \"disconnected\" || status === \"connecting\") && scopes && scopes.length > 0 && (\n          <div className=\"flex flex-col gap-1 border-t border-border pt-3\">\n            <p className=\"text-xs font-medium text-foreground\">If you connect, the agent can:</p>\n            <ul className=\"flex flex-col gap-0.5 text-xs text-muted-foreground\">\n              {scopes.map((scope, i) => (\n                <li key={i} className=\"flex items-start gap-1.5\">\n                  <Check aria-hidden=\"true\" className=\"mt-0.5 size-3 shrink-0 text-muted-foreground\" />\n                  {scope}\n                </li>\n              ))}\n            </ul>\n          </div>\n        )}\n        {status === \"connected\" && account && (\n          <p className=\"text-xs text-muted-foreground\">\n            Signed in as {account}. You can disconnect at any time.\n          </p>\n        )}\n      </div>\n    );\n  },\n);\nConnector.displayName = \"Connector\";\n\nexport interface ConnectorListProps extends React.HTMLAttributes<HTMLDivElement> {\n  /** Accessible name. Defaults to `\"Connected services\"`. */\n  label?: string;\n}\n\n/**\n * The connector list: available services with their status and a connect\n * button, one per row. Wrap Connector cards; each child becomes a list item.\n */\nexport const ConnectorList = React.forwardRef<HTMLDivElement, ConnectorListProps>(\n  ({ label = \"Connected services\", className, children, ...props }, ref) => (\n    <div ref={ref} role=\"list\" aria-label={label} className={cn(\"flex flex-col gap-2\", className)} {...props}>\n      {React.Children.map(children, (child) =>\n        child == null || child === false ? null : <div role=\"listitem\">{child}</div>,\n      )}\n    </div>\n  ),\n);\nConnectorList.displayName = \"ConnectorList\";\n\n/** One thing the agent could read: a channel, folder, repo or branch. */\nexport interface ConnectorScope {\n  /** Stable id. */\n  id: string;\n  /** Label, e.g. `\"#renewals\"`. */\n  label: React.ReactNode;\n  /** Optional detail, e.g. `\"412 messages\"`. */\n  description?: React.ReactNode;\n}\n\nexport interface ConnectorScopePickerProps\n  extends Omit<React.HTMLAttributes<HTMLDivElement>, \"title\" | \"defaultValue\" | \"onChange\"> {\n  /** The scopes on offer. */\n  scopes: ConnectorScope[];\n  /** Granted scope ids (controlled). */\n  value?: string[];\n  /** Initial grant (uncontrolled). Defaults to none — least privilege. */\n  defaultValue?: string[];\n  /** Called with the granted ids. */\n  onValueChange?: (ids: string[]) => void;\n  /** Who reads. Defaults to `\"Aria\"`. */\n  agentName?: React.ReactNode;\n  /** Heading override. Defaults to `\"<agent> can read from:\"`. */\n  title?: React.ReactNode;\n  /** Write access, asked separately (controlled). Renders the write switch when this or `onAllowWriteChange` is set. */\n  allowWrite?: boolean;\n  /** Called when write access is switched. */\n  onAllowWriteChange?: (on: boolean) => void;\n  /** Label for the write switch. Defaults to `\"Also allow changes (create, edit, post)\"`. */\n  writeLabel?: React.ReactNode;\n}\n\n/**\n * The scope picker: exactly what the agent can read — workspace, channel,\n * folder, repo — granular rather than all-or-nothing, starting from nothing.\n * Write access, when offered, is a separate and visible question.\n */\nexport const ConnectorScopePicker = React.forwardRef<HTMLDivElement, ConnectorScopePickerProps>(\n  (\n    {\n      scopes,\n      value,\n      defaultValue = [],\n      onValueChange,\n      agentName = \"Aria\",\n      title,\n      allowWrite,\n      onAllowWriteChange,\n      writeLabel = \"Also allow changes (create, edit, post)\",\n      className,\n      ...props\n    },\n    ref,\n  ) => {\n    const [internal, setInternal] = React.useState<string[]>(defaultValue);\n    const granted = value !== undefined ? value : internal;\n    const headingId = React.useId();\n    const set = (id: string, on: boolean) => {\n      const next = on ? [...granted, id] : granted.filter((g) => g !== id);\n      if (value === undefined) setInternal(next);\n      onValueChange?.(next);\n    };\n    return (\n      <div\n        ref={ref}\n        role=\"group\"\n        aria-labelledby={headingId}\n        className={cn(\"flex flex-col gap-2 rounded-xl border border-border bg-background p-3\", className)}\n        {...props}\n      >\n        <p id={headingId} className=\"text-sm font-semibold text-foreground\">\n          {title ?? <>{agentName} can read from:</>}\n        </p>\n        <ul className=\"flex flex-col gap-1.5\">\n          {scopes.map((scope) => {\n            const on = granted.includes(scope.id);\n            const labelId = `${headingId}-${scope.id}`;\n            return (\n              <li key={scope.id}>\n                <label className=\"flex cursor-pointer items-center gap-2 text-sm\">\n                  <Checkbox checked={on} onCheckedChange={(c) => set(scope.id, c)} aria-labelledby={labelId} />\n                  <span id={labelId} className={cn(on ? \"text-foreground\" : \"text-muted-foreground\")}>\n                    {scope.label}\n                    {scope.description && <span className=\"text-xs text-muted-foreground\"> · {scope.description}</span>}\n                  </span>\n                </label>\n              </li>\n            );\n          })}\n        </ul>\n        {(allowWrite !== undefined || onAllowWriteChange) && (\n          <div className=\"flex items-center justify-between gap-3 border-t border-border pt-2\">\n            <span id={`${headingId}-write`} className=\"text-sm text-foreground\">\n              {writeLabel}\n            </span>\n            <Switch\n              size=\"sm\"\n              checked={allowWrite ?? false}\n              onCheckedChange={onAllowWriteChange}\n              aria-labelledby={`${headingId}-write`}\n            />\n          </div>\n        )}\n      </div>\n    );\n  },\n);\nConnectorScopePicker.displayName = \"ConnectorScopePicker\";\n\nexport interface ConnectorLivePillProps extends React.HTMLAttributes<HTMLSpanElement> {\n  /** The connector being read, e.g. `\"Drive\"`. */\n  source?: React.ReactNode;\n  /** How many items are being read. */\n  count?: number;\n  /** Noun for `count`. Defaults to `\"docs\"`. */\n  noun?: string;\n}\n\n/**\n * The live source pill: a pulsing chip that shows the agent is reading from a\n * connector right now (\"Reading 12 docs from Drive…\"), announced politely.\n * Pass children to word it yourself. The pulse stops under reduced motion.\n */\nexport const ConnectorLivePill = React.forwardRef<HTMLSpanElement, ConnectorLivePillProps>(\n  ({ source, count, noun = \"docs\", className, children, ...props }, ref) => (\n    <span\n      ref={ref}\n      role=\"status\"\n      aria-live=\"polite\"\n      className={cn(\n        \"inline-flex items-center gap-2 rounded-full border border-brand/50 bg-brand-muted/50 px-3 py-1 text-xs font-semibold text-brand\",\n        className,\n      )}\n      {...props}\n    >\n      <span aria-hidden=\"true\" className=\"size-2 rounded-full bg-brand animate-pulse motion-reduce:animate-none\" />\n      {children ?? (\n        <>\n          Reading{count != null ? ` ${count} ${noun}` : \"\"}\n          {source ? <> from {source}</> : null}…\n        </>\n      )}\n    </span>\n  ),\n);\nConnectorLivePill.displayName = \"ConnectorLivePill\";\n"]}

package/package.json

@@ -1,6 +1,62 @@
 {
   "name": "@nucleux/connectors",
-  "version": "0.0.0-stage",
-  "stub": true,
-  "description": "Temporary package placeholder for staged publishing"
+  "version": "0.7.0",
+  "type": "module",
+  "sideEffects": false,
+  "description": "Connectors — connect an external tool or data source — Nucleux agentic UI for React.",
+  "keywords": [
+    "nucleux",
+    "react",
+    "ui",
+    "components",
+    "agentic",
+    "ai",
+    "tailwind",
+    "connectors"
+  ],
+  "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/button": "0.7.0",
+    "@nucleux/checkbox": "0.7.0",
+    "@nucleux/spinner": "0.7.0",
+    "@nucleux/switch": "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/connectors"
+  },
+  "homepage": "https://github.com/intelligaia-open-labs/nucleux#readme",
+  "scripts": {
+    "build": "tsup"
+  }
 }