@abstractframework/panel-chat 0.1.0 → 0.1.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/README.md +10 -8
- package/dist/chat_composer.d.ts +0 -1
- package/dist/chat_composer.d.ts.map +1 -1
- package/dist/chat_composer.js +0 -1
- package/dist/chat_message_card.d.ts +0 -1
- package/dist/chat_message_card.d.ts.map +1 -1
- package/dist/chat_message_card.js +0 -1
- package/dist/chat_thread.d.ts +0 -1
- package/dist/chat_thread.d.ts.map +1 -1
- package/dist/chat_thread.js +0 -1
- package/dist/json_viewer.d.ts +0 -1
- package/dist/json_viewer.d.ts.map +1 -1
- package/dist/json_viewer.js +0 -1
- package/dist/markdown.d.ts +0 -1
- package/dist/markdown.d.ts.map +1 -1
- package/dist/markdown.js +6 -3
- package/dist/message_content.d.ts +0 -1
- package/dist/message_content.d.ts.map +1 -1
- package/dist/message_content.js +0 -1
- package/package.json +5 -2
- package/src/panel_chat.css +3 -1
package/README.md
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
# @
|
|
1
|
+
# @abstractframework/panel-chat
|
|
2
2
|
|
|
3
3
|
Chat UI primitives for AbstractFramework-style UIs: thread rendering, message cards, a composer, and lightweight Markdown/JSON rendering.
|
|
4
4
|
|
|
@@ -7,12 +7,12 @@ Chat UI primitives for AbstractFramework-style UIs: thread rendering, message ca
|
|
|
7
7
|
Declared in `panel-chat/package.json`:
|
|
8
8
|
|
|
9
9
|
- `react@^18`, `react-dom@^18`
|
|
10
|
-
- `@
|
|
10
|
+
- `@abstractframework/ui-kit` (icons used by `ChatMessageCard`)
|
|
11
11
|
|
|
12
12
|
## Install
|
|
13
13
|
|
|
14
|
-
- Workspace: add a dependency on `@
|
|
15
|
-
- npm (once published): `npm i @
|
|
14
|
+
- Workspace: add a dependency on `@abstractframework/panel-chat`
|
|
15
|
+
- npm (once published): `npm i @abstractframework/panel-chat`
|
|
16
16
|
|
|
17
17
|
## Exported API
|
|
18
18
|
|
|
@@ -27,7 +27,7 @@ See `panel-chat/src/index.ts` for the authoritative export list. Common entry po
|
|
|
27
27
|
|
|
28
28
|
```tsx
|
|
29
29
|
import React, { useState } from "react";
|
|
30
|
-
import { ChatThread, ChatComposer, type ChatMessage } from "@
|
|
30
|
+
import { ChatThread, ChatComposer, type ChatMessage } from "@abstractframework/panel-chat";
|
|
31
31
|
|
|
32
32
|
export function ChatView() {
|
|
33
33
|
const [value, setValue] = useState("");
|
|
@@ -49,14 +49,16 @@ export function ChatView() {
|
|
|
49
49
|
- JSON ⇒ `JsonViewer`
|
|
50
50
|
- otherwise ⇒ `Markdown` (or your `renderMarkdown` override)
|
|
51
51
|
|
|
52
|
-
Markdown is intentionally minimal and implemented in `panel-chat/src/markdown.tsx` (headings 1–
|
|
52
|
+
Markdown is intentionally minimal and implemented in `panel-chat/src/markdown.tsx` (headings 1–5, code fences, lists, tables, blockquotes, hr, emphasis, and optional highlighting).
|
|
53
53
|
|
|
54
54
|
## Styling & theming
|
|
55
55
|
|
|
56
|
-
-
|
|
57
|
-
-
|
|
56
|
+
- Import CSS in your app entrypoint (recommended):
|
|
57
|
+
- `import "@abstractframework/panel-chat/panel_chat.css";`
|
|
58
|
+
- `import "@abstractframework/ui-kit/theme.css";` (shared tokens)
|
|
58
59
|
|
|
59
60
|
## Related docs
|
|
60
61
|
|
|
61
62
|
- Getting started: [`docs/getting-started.md`](../docs/getting-started.md)
|
|
63
|
+
- API reference: [`docs/api.md`](../docs/api.md)
|
|
62
64
|
- Architecture: [`docs/architecture.md`](../docs/architecture.md)
|
package/dist/chat_composer.d.ts
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"chat_composer.d.ts","sourceRoot":"","sources":["../src/chat_composer.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,
|
|
1
|
+
{"version":3,"file":"chat_composer.d.ts","sourceRoot":"","sources":["../src/chat_composer.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,MAAM,MAAM,iBAAiB,GAAG;IAC9B,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAClC,QAAQ,EAAE,MAAM,IAAI,CAAC;IACrB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAC3B,mBAAmB,CAAC,EAAE,MAAM,CAAC;IAC7B,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,OAAO,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CAC3B,CAAC;AAEF,eAAO,MAAM,YAAY,+FA6CvB,CAAC"}
|
package/dist/chat_composer.js
CHANGED
|
@@ -1,6 +1,5 @@
|
|
|
1
1
|
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
2
|
import React from "react";
|
|
3
|
-
import "./panel_chat.css";
|
|
4
3
|
export const ChatComposer = React.forwardRef(function ChatComposer(props, ref) {
|
|
5
4
|
const rows = typeof props.rows === "number" && Number.isFinite(props.rows) ? Math.max(1, Math.trunc(props.rows)) : 3;
|
|
6
5
|
const disabled = Boolean(props.disabled);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"chat_message_card.d.ts","sourceRoot":"","sources":["../src/chat_message_card.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA4B,MAAM,OAAO,CAAC;
|
|
1
|
+
{"version":3,"file":"chat_message_card.d.ts","sourceRoot":"","sources":["../src/chat_message_card.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA4B,MAAM,OAAO,CAAC;AAOjD,MAAM,MAAM,gBAAgB,GAAG,MAAM,GAAG,MAAM,GAAG,OAAO,CAAC;AAEzD,MAAM,MAAM,WAAW,GAAG;IACxB,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,IAAI,EAAE,MAAM,CAAC;IACb,OAAO,EAAE,MAAM,CAAC;IAChB,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,KAAK,CAAC,EAAE,gBAAgB,CAAC;IACzB,IAAI,CAAC,EAAE,MAAM,CAAC;CACf,CAAC;AAEF,MAAM,MAAM,cAAc,GAAG;IAC3B,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,KAAK,EAAE,MAAM,CAAC;IACd,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;CACtB,CAAC;AAEF,MAAM,MAAM,QAAQ,GAAG;IACrB,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,IAAI,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACvB,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;CACtB,CAAC;AAyBF,MAAM,MAAM,oBAAoB,GAAG;IACjC,OAAO,EAAE,WAAW,CAAC;IACrB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,cAAc,CAAC,EAAE,CAAC,QAAQ,EAAE,MAAM,KAAK,KAAK,CAAC,YAAY,CAAC;IAC1D,WAAW,CAAC,EAAE,cAAc,EAAE,CAAC;IAC/B,KAAK,CAAC,EAAE,QAAQ,EAAE,CAAC;IACnB,aAAa,CAAC,EAAE,CAAC,OAAO,EAAE,WAAW,KAAK,IAAI,CAAC;IAC/C,aAAa,CAAC,EAAE,CAAC,OAAO,EAAE,WAAW,KAAK,MAAM,GAAG,SAAS,GAAG,SAAS,GAAG,QAAQ,CAAC;IACpF,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,sBAAsB,CAAC,EAAE,MAAM,CAAC;CACjC,CAAC;AAEF,wBAAgB,eAAe,CAAC,KAAK,EAAE,oBAAoB,GAAG,KAAK,CAAC,YAAY,CAqH/E;AAED,eAAe,eAAe,CAAC"}
|
|
@@ -1,6 +1,5 @@
|
|
|
1
1
|
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
2
|
import { useMemo, useState } from "react";
|
|
3
|
-
import "./panel_chat.css";
|
|
4
3
|
import { Icon } from "@abstractframework/ui-kit";
|
|
5
4
|
import { ChatMessageContent } from "./message_content";
|
|
6
5
|
import { copyText } from "./utils";
|
package/dist/chat_thread.d.ts
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"chat_thread.d.ts","sourceRoot":"","sources":["../src/chat_thread.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA+C,MAAM,OAAO,CAAC;AAEpE,OAAO,
|
|
1
|
+
{"version":3,"file":"chat_thread.d.ts","sourceRoot":"","sources":["../src/chat_thread.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA+C,MAAM,OAAO,CAAC;AAEpE,OAAO,EAAmB,KAAK,WAAW,EAAE,KAAK,oBAAoB,EAAE,MAAM,qBAAqB,CAAC;AAEnG,MAAM,MAAM,eAAe,GAAG;IAC5B,QAAQ,EAAE,WAAW,EAAE,CAAC;IACxB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,KAAK,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACxB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,qBAAqB,CAAC,EAAE,MAAM,CAAC;IAC/B,YAAY,CAAC,EAAE,IAAI,CAAC,oBAAoB,EAAE,SAAS,CAAC,CAAC;CACtD,CAAC;AAQF,wBAAgB,UAAU,CAAC,KAAK,EAAE,eAAe,GAAG,KAAK,CAAC,YAAY,CAoCrE;AAED,eAAe,UAAU,CAAC"}
|
package/dist/chat_thread.js
CHANGED
|
@@ -1,6 +1,5 @@
|
|
|
1
1
|
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
2
|
import { useEffect, useMemo, useRef, useState } from "react";
|
|
3
|
-
import "./panel_chat.css";
|
|
4
3
|
import { ChatMessageCard } from "./chat_message_card";
|
|
5
4
|
function is_near_bottom(el, thresholdPx) {
|
|
6
5
|
const thr = Math.max(0, Math.trunc(thresholdPx));
|
package/dist/json_viewer.d.ts
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"json_viewer.d.ts","sourceRoot":"","sources":["../src/json_viewer.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"json_viewer.d.ts","sourceRoot":"","sources":["../src/json_viewer.tsx"],"names":[],"mappings":"AAoJA,wBAAgB,UAAU,CAAC,KAAK,EAAE;IAAE,KAAK,EAAE,OAAO,CAAC;IAAC,SAAS,CAAC,EAAE,MAAM,CAAC;IAAC,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAAC,QAAQ,CAAC,EAAE,OAAO,CAAA;CAAE,GAAG,KAAK,CAAC,YAAY,CAsB7I"}
|
package/dist/json_viewer.js
CHANGED
|
@@ -1,6 +1,5 @@
|
|
|
1
1
|
import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
2
|
import { useMemo, useState } from "react";
|
|
3
|
-
import "./panel_chat.css";
|
|
4
3
|
function isJsonObject(value) {
|
|
5
4
|
return Boolean(value) && typeof value === "object" && !Array.isArray(value);
|
|
6
5
|
}
|
package/dist/markdown.d.ts
CHANGED
package/dist/markdown.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"markdown.d.ts","sourceRoot":"","sources":["../src/markdown.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;
|
|
1
|
+
{"version":3,"file":"markdown.d.ts","sourceRoot":"","sources":["../src/markdown.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAqI1B,wBAAgB,QAAQ,CAAC,EACvB,IAAI,EACJ,SAAS,EACT,SAAS,EACT,UAAU,EACV,kBAAkB,EAClB,WAAW,GACZ,EAAE;IACD,IAAI,EAAE,MAAM,CAAC;IACb,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,UAAU,CAAC,EAAE,MAAM,EAAE,CAAC;IACtB,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAC5B,WAAW,CAAC,EAAE,MAAM,CAAC;CACtB,GAAG,KAAK,CAAC,YAAY,CAyLrB"}
|
package/dist/markdown.js
CHANGED
|
@@ -1,6 +1,5 @@
|
|
|
1
1
|
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
2
|
import React from "react";
|
|
3
|
-
import "./panel_chat.css";
|
|
4
3
|
function highlightInline(text, state) {
|
|
5
4
|
const s = String(text ?? "");
|
|
6
5
|
if (!state || !state.needles.length)
|
|
@@ -163,7 +162,7 @@ export function Markdown({ text, className, highlight, highlights, highlightClas
|
|
|
163
162
|
blocks.push(_jsx("pre", { className: "pc-md_pre", children: _jsx("code", { className: lang ? `language-${lang}` : undefined, children: code }) }, `pre:${i}`));
|
|
164
163
|
continue;
|
|
165
164
|
}
|
|
166
|
-
const headingM = line.match(/^(#{1,
|
|
165
|
+
const headingM = line.match(/^(#{1,5})\s+(.*)$/);
|
|
167
166
|
if (headingM) {
|
|
168
167
|
const level = headingM[1].length;
|
|
169
168
|
const content = headingM[2] || "";
|
|
@@ -172,8 +171,12 @@ export function Markdown({ text, className, highlight, highlights, highlightClas
|
|
|
172
171
|
blocks.push(_jsx("h1", { children: nodes }, `h1:${i}`));
|
|
173
172
|
else if (level === 2)
|
|
174
173
|
blocks.push(_jsx("h2", { children: nodes }, `h2:${i}`));
|
|
175
|
-
else
|
|
174
|
+
else if (level === 3)
|
|
176
175
|
blocks.push(_jsx("h3", { children: nodes }, `h3:${i}`));
|
|
176
|
+
else if (level === 4)
|
|
177
|
+
blocks.push(_jsx("h4", { children: nodes }, `h4:${i}`));
|
|
178
|
+
else
|
|
179
|
+
blocks.push(_jsx("h5", { children: nodes }, `h5:${i}`));
|
|
177
180
|
i += 1;
|
|
178
181
|
continue;
|
|
179
182
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"message_content.d.ts","sourceRoot":"","sources":["../src/message_content.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;
|
|
1
|
+
{"version":3,"file":"message_content.d.ts","sourceRoot":"","sources":["../src/message_content.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAM1B,wBAAgB,kBAAkB,CAAC,KAAK,EAAE;IACxC,IAAI,EAAE,MAAM,CAAC;IACb,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,cAAc,CAAC,EAAE,CAAC,QAAQ,EAAE,MAAM,KAAK,KAAK,CAAC,YAAY,CAAC;IAC1D,sBAAsB,CAAC,EAAE,MAAM,CAAC;CACjC,GAAG,KAAK,CAAC,YAAY,CAsBrB"}
|
package/dist/message_content.js
CHANGED
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@abstractframework/panel-chat",
|
|
3
|
-
"version": "0.1.
|
|
3
|
+
"version": "0.1.3",
|
|
4
4
|
"description": "Shared chat panel components for AbstractFramework (extracted from AbstractCode; reusable by other UIs).",
|
|
5
5
|
"type": "module",
|
|
6
6
|
"author": "Laurent-Philippe Albou",
|
|
@@ -39,11 +39,14 @@
|
|
|
39
39
|
"prepublishOnly": "npm run build"
|
|
40
40
|
},
|
|
41
41
|
"peerDependencies": {
|
|
42
|
-
"@abstractframework/ui-kit": "^0.1.
|
|
42
|
+
"@abstractframework/ui-kit": "^0.1.3",
|
|
43
43
|
"react": "^18.0.0",
|
|
44
44
|
"react-dom": "^18.0.0"
|
|
45
45
|
},
|
|
46
46
|
"devDependencies": {
|
|
47
|
+
"@abstractframework/ui-kit": "^0.1.3",
|
|
48
|
+
"react": "^18.0.0",
|
|
49
|
+
"react-dom": "^18.0.0",
|
|
47
50
|
"@types/react": "^18.2.48",
|
|
48
51
|
"@types/react-dom": "^18.2.18",
|
|
49
52
|
"typescript": "^5.3.3"
|