@papermap/papermap 1.0.2 → 1.0.3
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/index.d.mts +12 -12
- package/dist/index.d.ts +12 -12
- package/dist/index.js +30 -36
- package/dist/index.js.map +1 -1
- package/dist/index.mjs +27 -33
- package/dist/index.mjs.map +1 -1
- package/package.json +1 -1
- package/readme.md +27 -27
package/package.json
CHANGED
package/readme.md
CHANGED
|
@@ -4,22 +4,22 @@ Embeddable AI-powered components from the [Papermap](https://www.papermap.ai) da
|
|
|
4
4
|
|
|
5
5
|
## Main components
|
|
6
6
|
|
|
7
|
-
- **`
|
|
8
|
-
- **`
|
|
9
|
-
- **`
|
|
7
|
+
- **`PaperChat`** — Full AI chat assistant with streaming, conversation history, and chart generation.
|
|
8
|
+
- **`PaperCard`** — Standalone chart card with toolbar actions. Use `variant="streaming"` for an embedded chart + conversation dialog (without the floating assistant).
|
|
9
|
+
- **`PaperBoard`** — Responsive grid layout of chart cards, toolbar (screenshot, generate dashboard, theme), optional chat assistant, and controlled or uncontrolled layouts.
|
|
10
10
|
|
|
11
11
|
```tsx
|
|
12
|
-
import {
|
|
12
|
+
import { PaperChat, PaperCard, PaperBoard } from '@papermap/papermap'
|
|
13
13
|
|
|
14
14
|
// AI chat assistant
|
|
15
|
-
<
|
|
15
|
+
<PaperChat
|
|
16
16
|
token="your-base64-api-token"
|
|
17
17
|
workspaceId="your-workspace-id"
|
|
18
18
|
dashboardId="your-dashboard-id"
|
|
19
19
|
/>
|
|
20
20
|
|
|
21
21
|
// Standalone chart card
|
|
22
|
-
<
|
|
22
|
+
<PaperCard
|
|
23
23
|
token="your-base64-api-token"
|
|
24
24
|
workspaceId="your-workspace-id"
|
|
25
25
|
dashboardId="your-dashboard-id"
|
|
@@ -27,7 +27,7 @@ import { PapermapChat, PapermapChartCard, PapermapGridDashboard } from '@paperma
|
|
|
27
27
|
/>
|
|
28
28
|
|
|
29
29
|
// Streaming chart card (embedded dialog + chat)
|
|
30
|
-
<
|
|
30
|
+
<PaperCard
|
|
31
31
|
token="your-base64-api-token"
|
|
32
32
|
workspaceId="your-workspace-id"
|
|
33
33
|
dashboardId="your-dashboard-id"
|
|
@@ -35,8 +35,8 @@ import { PapermapChat, PapermapChartCard, PapermapGridDashboard } from '@paperma
|
|
|
35
35
|
chartId="your-chart-id" // optional; card shows empty state if omitted
|
|
36
36
|
/>
|
|
37
37
|
|
|
38
|
-
// Full grid dashboard (wraps chart cards + optional
|
|
39
|
-
<
|
|
38
|
+
// Full grid dashboard (wraps chart cards + optional PaperChat)
|
|
39
|
+
<PaperBoard
|
|
40
40
|
token="..."
|
|
41
41
|
workspaceId="..."
|
|
42
42
|
dashboardId="..."
|
|
@@ -75,8 +75,8 @@ import '@papermap/papermap/styles.css'
|
|
|
75
75
|
```tsx
|
|
76
76
|
import {
|
|
77
77
|
PapermapConfigProvider,
|
|
78
|
-
|
|
79
|
-
|
|
78
|
+
PaperChat,
|
|
79
|
+
PaperCard,
|
|
80
80
|
} from '@papermap/papermap'
|
|
81
81
|
|
|
82
82
|
function App() {
|
|
@@ -87,8 +87,8 @@ function App() {
|
|
|
87
87
|
dashboardId="your-dashboard-id"
|
|
88
88
|
// optional: apiUrl="https://dataapi.papermap.ai"
|
|
89
89
|
>
|
|
90
|
-
<
|
|
91
|
-
<
|
|
90
|
+
<PaperChat />
|
|
91
|
+
<PaperCard chartId="existing-chat-id" />
|
|
92
92
|
</PapermapConfigProvider>
|
|
93
93
|
)
|
|
94
94
|
}
|
|
@@ -99,18 +99,18 @@ function App() {
|
|
|
99
99
|
Pass `token`, `workspaceId`, and `dashboardId` on each component (or rely on an existing parent `PapermapProvider`).
|
|
100
100
|
|
|
101
101
|
```tsx
|
|
102
|
-
import {
|
|
102
|
+
import { PaperChat, PaperCard } from '@papermap/papermap'
|
|
103
103
|
|
|
104
104
|
function App() {
|
|
105
105
|
return (
|
|
106
106
|
<>
|
|
107
|
-
<
|
|
107
|
+
<PaperChat
|
|
108
108
|
token="your-base64-api-token"
|
|
109
109
|
workspaceId="your-workspace-id"
|
|
110
110
|
dashboardId="your-dashboard-id"
|
|
111
111
|
/>
|
|
112
112
|
|
|
113
|
-
<
|
|
113
|
+
<PaperCard
|
|
114
114
|
token="your-base64-api-token"
|
|
115
115
|
workspaceId="your-workspace-id"
|
|
116
116
|
dashboardId="your-dashboard-id"
|
|
@@ -123,7 +123,7 @@ function App() {
|
|
|
123
123
|
|
|
124
124
|
### 4. Props
|
|
125
125
|
|
|
126
|
-
#### `
|
|
126
|
+
#### `PaperChat` props
|
|
127
127
|
|
|
128
128
|
| Prop | Type | Required | Default | Description |
|
|
129
129
|
| ------------- | ---------------------- | -------- | --------------------------------- | ------------------------------------ |
|
|
@@ -140,7 +140,7 @@ function App() {
|
|
|
140
140
|
|
|
141
141
|
\*Omit on the component when values come from `PapermapConfigProvider` / `PapermapProvider`.
|
|
142
142
|
|
|
143
|
-
#### `
|
|
143
|
+
#### `PaperCard` props
|
|
144
144
|
|
|
145
145
|
| Prop | Type | Required | Default | Description |
|
|
146
146
|
| -------------- | ---------------------------------------- | -------- | --------------------------------- | --------------------------------------------------------------------- |
|
|
@@ -163,7 +163,7 @@ function App() {
|
|
|
163
163
|
**Pre-loaded chart:**
|
|
164
164
|
|
|
165
165
|
```tsx
|
|
166
|
-
import {
|
|
166
|
+
import { PaperCard } from '@papermap/papermap'
|
|
167
167
|
import type { TChartResponse } from '@papermap/papermap'
|
|
168
168
|
|
|
169
169
|
const chart: TChartResponse = {
|
|
@@ -183,7 +183,7 @@ const chart: TChartResponse = {
|
|
|
183
183
|
},
|
|
184
184
|
}
|
|
185
185
|
|
|
186
|
-
<
|
|
186
|
+
<PaperCard
|
|
187
187
|
token="..."
|
|
188
188
|
workspaceId="..."
|
|
189
189
|
dashboardId="..."
|
|
@@ -193,7 +193,7 @@ const chart: TChartResponse = {
|
|
|
193
193
|
/>
|
|
194
194
|
```
|
|
195
195
|
|
|
196
|
-
#### `
|
|
196
|
+
#### `PaperBoard` props (high level)
|
|
197
197
|
|
|
198
198
|
| Prop | Notes |
|
|
199
199
|
| ---- | ----- |
|
|
@@ -202,23 +202,23 @@ const chart: TChartResponse = {
|
|
|
202
202
|
| `layouts` / `onLayoutsChange` | Controlled grid layouts per breakpoint. |
|
|
203
203
|
| `isEditMode`, `editLayout`, `isViewer` | Edit vs view behavior. |
|
|
204
204
|
| `showToolbar`, `showScreenshot`, `showGenerateDashboard`, `showHeader`, `showChatAssistant` | Feature toggles. |
|
|
205
|
-
| `variant` | `'default' \| 'streaming'` for embedded chart cards (matches `
|
|
205
|
+
| `variant` | `'default' \| 'streaming'` for embedded chart cards (matches `PaperCard`). |
|
|
206
206
|
| `dashboardTheme`, `onDashboardThemeChange`, `persistWorkspaceTheme`, `renderThemeModal` | Theming; built-in modal uses `ThemeCustomizationSettings`. |
|
|
207
207
|
| Callbacks | `onEditChart`, `onDeleteChart`, `onPinChange`, `onGenerateDashboard`, `onTakeScreenshot`, `onThemeModalOpen`, etc. |
|
|
208
208
|
|
|
209
|
-
See TypeScript types `
|
|
209
|
+
See TypeScript types `PaperBoardProps` and Storybook stories for full detail.
|
|
210
210
|
|
|
211
211
|
### Streaming chart card variant
|
|
212
212
|
|
|
213
213
|
With `variant="streaming"`, the edit action opens an embedded expanded view with chart + conversation, SSE streaming, save-to-dashboard and maximize actions, and audit log on assistant messages.
|
|
214
214
|
|
|
215
215
|
```tsx
|
|
216
|
-
import {
|
|
216
|
+
import { PaperCard } from '@papermap/papermap'
|
|
217
217
|
|
|
218
218
|
export function EmbeddedStreamingChart() {
|
|
219
219
|
return (
|
|
220
220
|
<div className="h-[420px] w-[520px]">
|
|
221
|
-
<
|
|
221
|
+
<PaperCard
|
|
222
222
|
token="..."
|
|
223
223
|
workspaceId="..."
|
|
224
224
|
dashboardId="..."
|
|
@@ -255,7 +255,7 @@ For custom layouts, the package also exports subcomponents (for example `ChatAss
|
|
|
255
255
|
|
|
256
256
|
- Set `apiUrl` on the provider or per component. Default is `https://dataapi.papermap.ai`.
|
|
257
257
|
|
|
258
|
-
### Charts do not appear in `
|
|
258
|
+
### Charts do not appear in `PaperCard`
|
|
259
259
|
|
|
260
260
|
- Pass a valid backend `chartId` (chat id), or supply preloaded `chart` data.
|
|
261
261
|
|
|
@@ -291,7 +291,7 @@ The library decodes it and sends these headers on API requests:
|
|
|
291
291
|
3. SSE connects to `POST /api/v1/analytics/requests/stream` for live updates; HTTP remains a fallback.
|
|
292
292
|
4. History: `GET /api/v1/analytics/chats/{id}/conversations`, dashboard recent chats, and full chart history per chat as needed.
|
|
293
293
|
|
|
294
|
-
### What users see in `
|
|
294
|
+
### What users see in `PaperChat`
|
|
295
295
|
|
|
296
296
|
- Floating input bar (portaled to `document.body`), Cmd/Ctrl+K to focus, Escape to dismiss.
|
|
297
297
|
- Expanding input, backdrop, conversation panel, stop during load, new chat, scroll and history pagination.
|