@osdk/react-components 0.33.0 → 0.34.0-main-d24cc61b1e7fde7722d8229ed2b6821f5ce1bf8a

package/docs/AipAgentChat.md

@@ -0,0 +1,207 @@
+# AipAgentChat
+
+A React component for rendering an AI chat surface backed by Foundry's
+LMS via `useChat` from `@osdk/react/experimental/aip`. Importing the
+component is sufficient — consumers do not need to import `useChat` or
+`foundryModel` themselves.
+
+## Import
+
+```tsx
+import {
+  AipAgentChat,
+  BaseAipAgentChat,
+} from "@osdk/react-components/experimental/aip-agent-chat";
+```
+
+- **`AipAgentChat`** — Primary component for OSDK usage. Accepts a
+  Foundry `PlatformClient` and an LMS model API name; constructs the
+  language-model handle, drives `useChat`, and renders the chat UI.
+- **`BaseAipAgentChat`** — Lower-level OSDK-agnostic component that
+  accepts `messages`, `status`, and `onSendMessage` directly. Use this
+  when you already manage chat state yourself (a custom hook, a
+  non-OSDK backend, etc.).
+
+## Usage
+
+### Minimal
+
+```tsx
+import { AipAgentChat } from "@osdk/react-components/experimental/aip-agent-chat";
+import { platformClient } from "./foundryClient.js";
+
+// `model` and `defaultModel` are both optional — falls back to "gpt-4o".
+<AipAgentChat client={platformClient} />;
+```
+
+### Pinned model
+
+```tsx
+<AipAgentChat
+  client={platformClient}
+  model="gpt-4o"
+  system="You are a concise assistant. Keep answers short."
+/>;
+```
+
+### With model picker (controlled)
+
+```tsx
+function MyChat() {
+  const [model, setModel] = useState("gpt-4o");
+  return (
+    <AipAgentChat
+      client={platformClient}
+      model={model}
+      availableModels={["gpt-4o", "AnthropicClaude_4_6_Sonnet"]}
+      onModelChange={setModel}
+    />
+  );
+}
+```
+
+### With model picker (uncontrolled)
+
+```tsx
+<AipAgentChat
+  client={platformClient}
+  defaultModel="gpt-4o"
+  availableModels={["gpt-4o", "AnthropicClaude_4_6_Sonnet"]}
+  onModelChange={(modelName) => analytics.track({ modelName })}
+/>;
+```
+
+The component manages model state internally; `onModelChange` is a
+non-controlling listener (analytics, persistence, etc.).
+
+### Custom render
+
+```tsx
+import {
+  AipAgentChat,
+  getUIMessageText,
+  type UIMessage,
+} from "@osdk/react-components/experimental/aip-agent-chat";
+
+<AipAgentChat
+  client={platformClient}
+  model="gpt-4o"
+  renderMessage={(message: UIMessage) => (
+    <div>
+      <strong>{message.role}:</strong> {getUIMessageText(message)}
+    </div>
+  )}
+  renderEmptyState={() => <p>Ready when you are.</p>}
+/>;
+```
+
+### Drop down to BaseAipAgentChat
+
+`BaseAipAgentChat` is OSDK-agnostic — the consumer drives the chat by
+passing the current `messages`, `status`, `error`, and an `onSendMessage`
+callback that resolves once the user's message has been forwarded.
+Use it for non-OSDK backends, custom transports, or unit tests.
+
+```tsx
+import {
+  BaseAipAgentChat,
+  type ChatStatus,
+  type UIMessage,
+} from "@osdk/react-components/experimental/aip-agent-chat";
+
+function MyChat() {
+  const [messages, setMessages] = useState<ReadonlyArray<UIMessage>>([]);
+  const [status, setStatus] = useState<ChatStatus>("ready");
+  const [error, setError] = useState<Error | undefined>();
+
+  return (
+    <BaseAipAgentChat
+      messages={messages}
+      status={status}
+      error={error}
+      onSendMessage={async (text) => {
+        setStatus("submitted");
+        try {
+          const reply = await callMyBackend(text, { history: messages });
+          setMessages((prev) => [
+            ...prev,
+            {
+              id: crypto.randomUUID(),
+              role: "user",
+              parts: [{ type: "text", text }],
+            },
+            {
+              id: crypto.randomUUID(),
+              role: "assistant",
+              parts: [{ type: "text", text: reply }],
+            },
+          ]);
+          setStatus("ready");
+        } catch (err) {
+          setError(err as Error);
+          setStatus("error");
+        }
+      }}
+      onStop={() => setStatus("ready")}
+      onClearError={() => setError(undefined)}
+    />
+  );
+}
+```
+
+### Drop further: useChat directly
+
+For full control over the chat hook (regenerate, multi-step agent
+loops, custom transports), call `useChat` from `@osdk/react/experimental/aip`
+yourself and feed the result into your own UI.
+
+```tsx
+import { foundryModel } from "@osdk/aip-core";
+import { useChat } from "@osdk/react/experimental/aip";
+
+function MyChat() {
+  const lmsModel = useMemo(
+    () => foundryModel({ client: platformClient, model: "gpt-4o" }),
+    [],
+  );
+  const { messages, status, error, sendMessage, stop, clearError } = useChat({
+    model: lmsModel,
+  });
+
+  return (
+    <YourCustomChatLayout
+      messages={messages}
+      status={status}
+      error={error}
+      onSend={(text) => void sendMessage({ text })}
+      onStop={stop}
+      onClearError={clearError}
+    />
+  );
+}
+```
+
+## Props
+
+See [`AipAgentChatApi.ts`](../src/aip-agent-chat/AipAgentChatApi.ts) for
+the full prop list with JSDoc. `client` is the only required prop.
+`model` (controlled) and `defaultModel` (uncontrolled) are both
+optional; if neither is supplied the chat falls back to the first
+entry of `availableModels` (when provided), or to `"gpt-4o"`. Notable
+optional props:
+
+- `availableModels` + `onModelChange` — render a model picker in the
+  composer footer.
+- `system` — system prompt prepended to every request.
+- `initialMessages` — seed conversation snapshot.
+- `enableAutoScroll` (default `true`) — auto-pin to the bottom of the
+  message list as new tokens arrive.
+- `renderEmptyState` / `renderMessage` — render overrides.
+- `onError`, `onFinish` — listeners forwarded to `useChat`.
+
+## Theming
+
+CSS variables are documented in
+[`docs/CSSVariables.md`](./CSSVariables.md). The `--osdk-aip-agent-chat-*`
+namespace covers spacing, bubble colors, composer styling, and the
+3-dot loader.

package/docs/CSSVariables.md

@@ -232,6 +232,58 @@ Component-specific semantic tokens that may reference Blueprint tokens or define
 | `--osdk-surface-border`               | `var(--osdk-surface-border-width) solid var(--osdk-surface-border-color-default)` | Reusable border shorthand      |
 | `--osdk-disabled-opacity`             | `0.5`                                                                             | Disabled state opacity         |
 
+### AIP Agent Chat
+
+Tokens for the `AipAgentChat` chat surface (container, message bubbles, composer, empty state, loader, error banner).
+
+| Variable                                             | Default Value                                                                                             | Description                                         |
+| ---------------------------------------------------- | --------------------------------------------------------------------------------------------------------- | --------------------------------------------------- |
+| `--osdk-aip-agent-chat-background`                   | `var(--osdk-background-primary)`                                                                          | Chat container background                           |
+| `--osdk-aip-agent-chat-border-color`                 | `var(--osdk-surface-border-color-default)`                                                                | Container and composer separator color              |
+| `--osdk-aip-agent-chat-border-radius`                | `var(--osdk-surface-border-radius)`                                                                       | Container corner radius                             |
+| `--osdk-aip-agent-chat-padding`                      | `calc(var(--osdk-surface-spacing) * 5)`                                                                   | Outer padding for message list and composer         |
+| `--osdk-aip-agent-chat-message-gap`                  | `calc(var(--osdk-surface-spacing) * 5)`                                                                   | Vertical gap between messages                       |
+| `--osdk-aip-agent-chat-section-gap`                  | `calc(var(--osdk-surface-spacing) * 2.5)`                                                                 | Gap between composer rows / footer items            |
+| `--osdk-aip-agent-chat-content-max-width`            | `780px`                                                                                                   | Maximum width of the chat content area              |
+| `--osdk-aip-agent-chat-bubble-padding`               | `calc(var(--osdk-surface-spacing) * 3)`                                                                   | Padding inside each message bubble                  |
+| `--osdk-aip-agent-chat-bubble-border-radius`         | `var(--osdk-surface-border-radius)`                                                                       | Bubble corner radius                                |
+| `--osdk-aip-agent-chat-bubble-max-width`             | `80%`                                                                                                     | Maximum bubble width                                |
+| `--osdk-aip-agent-chat-user-bubble-background`       | `var(--osdk-background-secondary)`                                                                        | User-message bubble background                      |
+| `--osdk-aip-agent-chat-user-bubble-color`            | `var(--osdk-typography-color-default-rest)`                                                               | User-message text color                             |
+| `--osdk-aip-agent-chat-user-bubble-border-radius`    | `var(--osdk-surface-border-radius) var(--osdk-surface-border-radius) 0 var(--osdk-surface-border-radius)` | User-message bubble corner radius (chat-tail shape) |
+| `--osdk-aip-agent-chat-assistant-bubble-color`       | `var(--osdk-typography-color-default-rest)`                                                               | Assistant-message text color                        |
+| `--osdk-aip-agent-chat-composer-border-radius`       | `calc(var(--osdk-surface-spacing) * 2.5)`                                                                 | Composer input border radius                        |
+| `--osdk-aip-agent-chat-composer-background`          | `var(--osdk-surface-background-color-default-rest)`                                                       | Composer background                                 |
+| `--osdk-aip-agent-chat-composer-textarea-min-height` | `calc(var(--osdk-surface-spacing) * 14)`                                                                  | Textarea minimum height                             |
+| `--osdk-aip-agent-chat-composer-textarea-max-height` | `200px`                                                                                                   | Textarea maximum height                             |
+| `--osdk-aip-agent-chat-empty-color`                  | `var(--osdk-typography-color-muted)`                                                                      | Empty-state subtext color                           |
+| `--osdk-aip-agent-chat-empty-icon-color`             | `var(--osdk-intent-primary-rest)`                                                                         | Empty-state icon color                              |
+| `--osdk-aip-agent-chat-empty-icon-size`              | `calc(var(--osdk-surface-spacing) * 12)`                                                                  | Empty-state icon size                               |
+| `--osdk-aip-agent-chat-loader-color`                 | `var(--osdk-typography-color-muted)`                                                                      | 3-dot streaming loader color                        |
+| `--osdk-aip-agent-chat-loader-dot-size`              | `calc(var(--osdk-surface-spacing) * 1.5)`                                                                 | Loader dot diameter                                 |
+| `--osdk-aip-agent-chat-loader-dot-gap`               | `calc(var(--osdk-surface-spacing) * 0.5)`                                                                 | Loader dot gap                                      |
+
+### Callout
+
+Tokens for the `Callout` component used for error, warning, success, and info banners. In dark mode, the intent text colors switch to brighter `--rest` shades for readability.
+
+| Variable                            | Default Value                                                                | Description               |
+| ----------------------------------- | ---------------------------------------------------------------------------- | ------------------------- |
+| `--osdk-callout-padding`            | `calc(var(--osdk-surface-spacing) * 4)`                                      | Inner padding             |
+| `--osdk-callout-gap`                | `calc(var(--osdk-surface-spacing) * 2)`                                      | Gap between icon and text |
+| `--osdk-callout-border-radius`      | `var(--osdk-surface-border-radius)`                                          | Corner radius             |
+| `--osdk-callout-title-font-size`    | `var(--osdk-typography-size-body-medium)`                                    | Title font size           |
+| `--osdk-callout-title-font-weight`  | `var(--osdk-typography-weight-bold)`                                         | Title font weight         |
+| `--osdk-callout-message-font-size`  | `var(--osdk-typography-size-body-small)`                                     | Message body font size    |
+| `--osdk-callout-error-background`   | `color-mix(in srgb, var(--osdk-intent-danger-rest) 10%, transparent)`        | Error intent background   |
+| `--osdk-callout-error-color`        | `var(--osdk-intent-danger-hover)` (dark: `var(--osdk-intent-danger-rest)`)   | Error intent text color   |
+| `--osdk-callout-warning-background` | `color-mix(in srgb, var(--osdk-intent-warning-rest) 10%, transparent)`       | Warning intent background |
+| `--osdk-callout-warning-color`      | `var(--osdk-intent-warning-hover)` (dark: `var(--osdk-intent-warning-rest)`) | Warning intent text color |
+| `--osdk-callout-success-background` | `color-mix(in srgb, var(--osdk-intent-success-rest) 10%, transparent)`       | Success intent background |
+| `--osdk-callout-success-color`      | `var(--osdk-intent-success-hover)` (dark: `var(--osdk-intent-success-rest)`) | Success intent text color |
+| `--osdk-callout-info-background`    | `color-mix(in srgb, var(--osdk-intent-primary-rest) 10%, transparent)`       | Info intent background    |
+| `--osdk-callout-info-color`         | `var(--osdk-intent-primary-hover)` (dark: `var(--osdk-intent-primary-rest)`) | Info intent text color    |
+
 ### Drag Handle
 
 Shared tokens for drag handle styling across components.

package/docs/Welcome.md

@@ -18,6 +18,7 @@ forms, and filters.
 | `FilterList`     | Interactive filter panel with histogram filters, date ranges, and search     |
 | `ActionForm`     | Auto-generated form for executing Ontology Actions                           |
 | `DocumentViewer` | Unified media viewer that auto-detects file type (PDF, Excel, images, video) |
+| `AipAgentChat`   | Chat surface backed by Foundry LMS                                           |
 
 All components are exported under `@osdk/react-components/experimental/*`
 sub-paths (e.g. `@osdk/react-components/experimental/object-table`).

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@osdk/react-components",
-  "version": "0.33.0",
+  "version": "0.34.0-main-d24cc61b1e7fde7722d8229ed2b6821f5ce1bf8a",
   "license": "Apache-2.0",
   "repository": {
     "type": "git",
@@ -43,6 +43,15 @@
       "require": "./build/cjs/public/experimental/action-form.cjs",
       "default": "./build/browser/public/experimental/action-form.js"
     },
+    "./experimental/aip-agent-chat": {
+      "browser": "./build/browser/public/experimental/aip-agent-chat.js",
+      "import": {
+        "types": "./build/types/public/experimental/aip-agent-chat.d.ts",
+        "default": "./build/esm/public/experimental/aip-agent-chat.js"
+      },
+      "require": "./build/cjs/public/experimental/aip-agent-chat.cjs",
+      "default": "./build/browser/public/experimental/aip-agent-chat.js"
+    },
     "./experimental/cbac-picker": {
       "browser": "./build/browser/public/experimental/cbac-picker.js",
       "import": {
@@ -193,14 +202,20 @@
     "xlsx-republish": "0.20.3"
   },
   "peerDependencies": {
-    "@osdk/api": "^2.8.0",
-    "@osdk/client": "^2.8.0",
-    "@osdk/react": "^2.8.0",
+    "@osdk/aip-core": ">=0.5.0 <1.0.0",
+    "@osdk/api": ">=2.41.0-beta.0",
+    "@osdk/client": ">=2.41.0-beta.0",
+    "@osdk/react": ">=2.41.0-beta.0",
     "@types/react": "^17 || ^18 || ^19",
     "classnames": "^2.0.0",
     "react": "^17 || ^18 || ^19",
     "react-dom": "^17 || ^18 || ^19"
   },
+  "peerDependenciesMeta": {
+    "@osdk/aip-core": {
+      "optional": true
+    }
+  },
   "devDependencies": {
     "@testing-library/react": "^16.3.0",
     "@types/lodash-es": "^4.17.12",
@@ -213,11 +228,12 @@
     "react": "^18.3.1",
     "react-dom": "^18.3.1",
     "typescript": "~5.5.4",
-    "@osdk/client": "2.40.0",
+    "@osdk/aip-core": "0.6.0-main-d24cc61b1e7fde7722d8229ed2b6821f5ce1bf8a",
+    "@osdk/api": "2.41.0-main-d24cc61b1e7fde7722d8229ed2b6821f5ce1bf8a",
+    "@osdk/client": "2.41.0-main-d24cc61b1e7fde7722d8229ed2b6821f5ce1bf8a",
     "@osdk/monorepo.api-extractor": "~0.7.0",
-    "@osdk/react": "2.40.0",
-    "@osdk/api": "2.40.0",
-    "@osdk/monorepo.tsconfig": "~0.7.0"
+    "@osdk/monorepo.tsconfig": "~0.7.0",
+    "@osdk/react": "2.41.0-main-d24cc61b1e7fde7722d8229ed2b6821f5ce1bf8a"
   },
   "publishConfig": {
     "access": "public"

package/build/cjs/chunk-364UCCB2.cjs.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../../src/util/UserAgent.ts","../../src/util/withOsdkMetrics.ts"],"names":["useRegisterUserAgent","React"],"mappings":";;;;;;;;;;;;AAgBA,IAAM,kBAAA,GAAqB,yBAAyB,QAA2B,CAAA,CAAA;AACxE,SAAS,mBAAmB,aAAA,EAAe;AAChD,EAAA,OAAO,CAAA,EAAG,kBAAkB,CAAA,CAAA,EAAI,aAAa,CAAA,CAAA;AAC/C;;;ACKO,SAAS,eAAA,CAAgB,WAAW,IAAA,EAAM;AAC/C,EAAA,MAAM,UAAU,CAAA,KAAA,KAAS;AACvB,IAAAA,0BAAA,CAAqB,kBAAA,CAAmB,IAAI,CAAC,CAAA;AAC7C,IAAA,uBAAoBC,sBAAA,CAAM,aAAA,CAAc,SAAA,EAAW,KAAK,CAAA;AAAA,EAC1D,CAAA;AACA,EAAA,OAAA,CAAQ,WAAA,GAAc,mBAAmB,IAAI,CAAA,CAAA,CAAA;AAC7C,EAAA,OAAO,OAAA;AACT","file":"chunk-364UCCB2.cjs","sourcesContent":["/*\n * Copyright 2025 Palantir Technologies, Inc. All rights reserved.\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nconst PACKAGE_USER_AGENT = `osdk-react-components/${process.env.PACKAGE_VERSION}`;\nexport function componentUserAgent(componentName) {\n  return `${PACKAGE_USER_AGENT}/${componentName}`;\n}","/*\n * Copyright 2026 Palantir Technologies, Inc. All rights reserved.\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport { useRegisterUserAgent } from \"@osdk/react\";\nimport React from \"react\";\nimport { componentUserAgent } from \"./UserAgent.js\";\n\n// `any` is required: FunctionComponent defaults to FunctionComponent<{}> which\n// rejects components with required props. A generic P parameter doesn't help\n// because TS can't infer both P and C simultaneously from a single argument.\n// eslint-disable-next-line @typescript-eslint/no-explicit-any\nexport function withOsdkMetrics(Component, name) {\n  const Wrapped = props => {\n    useRegisterUserAgent(componentUserAgent(name));\n    return /*#__PURE__*/React.createElement(Component, props);\n  };\n  Wrapped.displayName = `withOsdkMetrics(${name})`;\n  return Wrapped;\n}"]}

package/build/cjs/chunk-3MDT2TJK.cjs

@@ -1,11 +0,0 @@
-'use strict';
-
-var chunkVOROB7KJ_cjs = require('./chunk-VOROB7KJ.cjs');
-var chunk364UCCB2_cjs = require('./chunk-364UCCB2.cjs');
-
-// src/public/experimental/image-viewer.ts
-var ImageViewer2 = chunk364UCCB2_cjs.withOsdkMetrics(chunkVOROB7KJ_cjs.ImageViewer, "ImageViewer");
-
-exports.ImageViewer = ImageViewer2;
-//# sourceMappingURL=chunk-3MDT2TJK.cjs.map
-//# sourceMappingURL=chunk-3MDT2TJK.cjs.map

package/build/cjs/chunk-AEFCONAY.cjs

@@ -1,11 +0,0 @@
-'use strict';
-
-var chunkKHMOMROL_cjs = require('./chunk-KHMOMROL.cjs');
-var chunk364UCCB2_cjs = require('./chunk-364UCCB2.cjs');
-
-// src/public/experimental/video-viewer.ts
-var VideoViewer2 = chunk364UCCB2_cjs.withOsdkMetrics(chunkKHMOMROL_cjs.VideoViewer, "VideoViewer");
-
-exports.VideoViewer = VideoViewer2;
-//# sourceMappingURL=chunk-AEFCONAY.cjs.map
-//# sourceMappingURL=chunk-AEFCONAY.cjs.map

package/build/cjs/chunk-D6RQIMMX.cjs

@@ -1,11 +0,0 @@
-'use strict';
-
-var chunkPKJFOG2Z_cjs = require('./chunk-PKJFOG2Z.cjs');
-var chunk364UCCB2_cjs = require('./chunk-364UCCB2.cjs');
-
-// src/public/experimental/email-viewer.ts
-var EmailViewer2 = chunk364UCCB2_cjs.withOsdkMetrics(chunkPKJFOG2Z_cjs.EmailViewer, "EmailViewer");
-
-exports.EmailViewer = EmailViewer2;
-//# sourceMappingURL=chunk-D6RQIMMX.cjs.map
-//# sourceMappingURL=chunk-D6RQIMMX.cjs.map

package/build/cjs/chunk-N7TOWLUY.cjs

@@ -1,11 +0,0 @@
-'use strict';
-
-var chunkOUJQJQ7N_cjs = require('./chunk-OUJQJQ7N.cjs');
-var chunk364UCCB2_cjs = require('./chunk-364UCCB2.cjs');
-
-// src/public/experimental/xml-viewer.ts
-var XmlViewer2 = chunk364UCCB2_cjs.withOsdkMetrics(chunkOUJQJQ7N_cjs.XmlViewer, "XmlViewer");
-
-exports.XmlViewer = XmlViewer2;
-//# sourceMappingURL=chunk-N7TOWLUY.cjs.map
-//# sourceMappingURL=chunk-N7TOWLUY.cjs.map

package/build/cjs/chunk-SUEZQS7M.cjs

@@ -1,11 +0,0 @@
-'use strict';
-
-var chunk3SJODG6U_cjs = require('./chunk-3SJODG6U.cjs');
-var chunk364UCCB2_cjs = require('./chunk-364UCCB2.cjs');
-
-// src/public/experimental/excel-viewer.ts
-var ExcelViewer2 = chunk364UCCB2_cjs.withOsdkMetrics(chunk3SJODG6U_cjs.ExcelViewer, "ExcelViewer");
-
-exports.ExcelViewer = ExcelViewer2;
-//# sourceMappingURL=chunk-SUEZQS7M.cjs.map
-//# sourceMappingURL=chunk-SUEZQS7M.cjs.map