@homecode/ui 5.10.0 → 5.11.0

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/esm/index.js CHANGED
@@ -21,6 +21,7 @@ export { DropZone } from './src/components/DropZone/DropZone.js';
21
21
  export { Expand } from './src/components/Expand/Expand.js';
22
22
  export { Flex } from './src/components/Flex/Flex.js';
23
23
  export { Form } from './src/components/Form/Form.js';
24
+ export { FormattedText } from './src/components/FormattedText/FormattedText.js';
24
25
  export { Gap } from './src/components/Gap/Gap.js';
25
26
  export { Gallery, normalizeGalleryItem } from './src/components/Gallery/Gallery.js';
26
27
  export { GridLayout } from './src/components/GridLayout/GridLayout.js';
@@ -32,7 +32,7 @@ import '../Router/Link/Link.styl.js';
32
32
  import '../Portal/Portal.js';
33
33
  import '../Paranja/Paranja.styl.js';
34
34
  import '../Table/Table.styl.js';
35
- import '../Chat/ChatFormattedText.styl.js';
35
+ import '../FormattedText/FormattedText.styl.js';
36
36
  import '../Expand/Expand.styl.js';
37
37
  import '../Chat/ChatMessage.styl.js';
38
38
  import '../PromptComposer/PromptComposer.js';
@@ -1,323 +1,8 @@
1
- import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
2
- import React__default from 'react';
3
- import { Button } from '../Button/Button.js';
4
- import { Link } from '../Router/Link/Link.js';
5
- import { Table } from '../Table/Table.js';
6
- import { Tooltip } from '../Tooltip/Tooltip.js';
7
- import S from './ChatFormattedText.styl.js';
1
+ import { jsx } from 'react/jsx-runtime';
2
+ import { FormattedText } from '../FormattedText/FormattedText.js';
8
3
 
9
- function findJsonEndExclusive(content, start) {
10
- const first = content[start];
11
- if (first !== '{' && first !== '[')
12
- return -1;
13
- const stack = first === '{' ? ['}'] : [']'];
14
- let i = start + 1;
15
- let inString = false;
16
- let escape = false;
17
- while (i < content.length && stack.length > 0) {
18
- const c = content[i];
19
- if (inString) {
20
- if (escape)
21
- escape = false;
22
- else if (c === '\\')
23
- escape = true;
24
- else if (c === '"')
25
- inString = false;
26
- i++;
27
- continue;
28
- }
29
- if (c === '"') {
30
- inString = true;
31
- i++;
32
- continue;
33
- }
34
- if (c === '{') {
35
- stack.push('}');
36
- i++;
37
- continue;
38
- }
39
- if (c === '[') {
40
- stack.push(']');
41
- i++;
42
- continue;
43
- }
44
- if (c === '}' || c === ']') {
45
- if (c !== stack[stack.length - 1])
46
- return -1;
47
- stack.pop();
48
- i++;
49
- continue;
50
- }
51
- i++;
52
- }
53
- return stack.length > 0 ? -1 : i;
54
- }
55
- function applyInjectors(text, injectors) {
56
- let result = [text];
57
- injectors.forEach(fn => {
58
- let i = 0;
59
- while (i < result.length) {
60
- const item = result[i];
61
- if (typeof item === 'string') {
62
- const res = fn(item);
63
- if (!res) {
64
- i++;
65
- continue;
66
- }
67
- const { elem, index, length } = res;
68
- if (index >= 0) {
69
- const before = item.substring(0, index);
70
- const after = item.substring(index + length);
71
- result.splice(i, 1, before, elem, after);
72
- if (after.length > 0)
73
- continue;
74
- }
75
- }
76
- i++;
77
- }
78
- });
79
- return result;
80
- }
81
- function ChatFormattedText({ text, className, onButtonClick, }) {
82
- const injectLines = (content) => {
83
- const matches = content.match(/\n---\n/);
84
- if (!matches)
85
- return null;
86
- return {
87
- elem: jsx("div", { className: S.line }),
88
- index: matches.index,
89
- length: matches[0].length,
90
- };
91
- };
92
- const injectBullet = (content) => {
93
- const matches = content.match(/(\n|^)([ \t]*)(-|\*|\+)\s/);
94
- if (!matches)
95
- return null;
96
- return {
97
- elem: (jsxs(Fragment, { children: [matches[1] === '\n' && jsx("br", {}), jsx("div", { className: S.bullet })] })),
98
- index: matches.index,
99
- length: matches[0].length,
100
- };
101
- };
102
- const injectNumbered = (content) => {
103
- const matches = content.match(/(\n|^)([ \t]*)(\d+)\.\s+/);
104
- if (!matches)
105
- return null;
106
- return {
107
- elem: (jsxs(Fragment, { children: [matches[1] === '\n' && jsx("br", {}), jsxs("span", { className: S.numberedIndex, children: [matches[3], "."] })] })),
108
- index: matches.index,
109
- length: matches[0].length,
110
- };
111
- };
112
- const injectBold = (content) => {
113
- const matches = content.match(/\*\*(.*?)\*\*/);
114
- if (!matches)
115
- return null;
116
- return {
117
- elem: jsx("strong", { children: matches[1] }),
118
- index: matches.index,
119
- length: matches[0].length,
120
- };
121
- };
122
- const injectItalic = (content) => {
123
- const matches = content.match(/\*(.*?)\*/);
124
- if (!matches)
125
- return null;
126
- return {
127
- elem: jsx("em", { children: matches[1] }),
128
- index: matches.index,
129
- length: matches[0].length,
130
- };
131
- };
132
- const injectCodeBlock = (content) => {
133
- const multiline = content.match(/```(\w+)?[\s\n]*([\s\S]*?)```/);
134
- if (multiline) {
135
- return {
136
- elem: jsx("code", { className: S.codeBlock, children: multiline[2].trim() }),
137
- index: multiline.index,
138
- length: multiline[0].length,
139
- };
140
- }
141
- const inline = content.match(/`([^`\n]+)`/);
142
- if (!inline)
143
- return null;
144
- return {
145
- elem: jsx("code", { className: S.codeInline, children: inline[1] }),
146
- index: inline.index,
147
- length: inline[0].length,
148
- };
149
- };
150
- const injectPrettyJson = (content) => {
151
- let searchFrom = 0;
152
- while (searchFrom < content.length) {
153
- let start = -1;
154
- for (let j = searchFrom; j < content.length; j++) {
155
- if (content[j] === '{' || content[j] === '[') {
156
- start = j;
157
- break;
158
- }
159
- }
160
- if (start < 0)
161
- return null;
162
- const endExclusive = findJsonEndExclusive(content, start);
163
- if (endExclusive < 0) {
164
- searchFrom = start + 1;
165
- continue;
166
- }
167
- const slice = content.slice(start, endExclusive);
168
- try {
169
- const parsed = JSON.parse(slice);
170
- return {
171
- elem: (jsx("pre", { className: S.jsonPre, children: JSON.stringify(parsed, null, 2) })),
172
- index: start,
173
- length: slice.length,
174
- };
175
- }
176
- catch {
177
- searchFrom = start + 1;
178
- }
179
- }
180
- return null;
181
- };
182
- const injectLinks = (content) => {
183
- const markdown = content.match(/\[([^\]]+)\]\(([^)]+)\)/);
184
- if (markdown) {
185
- let url = markdown[2];
186
- if (url.startsWith('www.'))
187
- url = `https://${url}`;
188
- return {
189
- elem: (jsx(Tooltip, { content: url, direction: "top", children: jsx(Link, { href: url, inline: true, target: "_blank", children: markdown[1] }) })),
190
- index: markdown.index,
191
- length: markdown[0].length,
192
- };
193
- }
194
- const bareDomainTlds = 'com|org|net|edu|gov|mil|int|info|biz|co|io|ai|app|dev|me|tv|cc|ly|sh|so|gg|fm|ws|xyz|tech|cloud|store|online|site|shop|blog|news|link|page|uk|us|ca|de|fr|jp|cn|ru|br|in|au|it|es|nl|se|no|fi|pl|ch|be|at|dk|cz|gr|hu|ie|pt|ro|tr|kr|mx|za|sg|hk|tw|nz|il|ae|ua';
195
- const matches = content.match(new RegExp(`(https?:\\/\\/[^\\s<>"']+|www\\.[^\\s<>"']+|[a-zA-Z0-9](?:[a-zA-Z0-9-]{0,61}[a-zA-Z0-9])?(?:\\.[a-zA-Z0-9](?:[a-zA-Z0-9-]{0,61}[a-zA-Z0-9])?)*\\.(?:${bareDomainTlds})\\b[^\\s<>"']*)`, 'i'));
196
- if (!matches)
197
- return null;
198
- let url = matches[0];
199
- if (url.startsWith('www.'))
200
- url = `https://${url}`;
201
- return {
202
- elem: (jsx(Tooltip, { content: url, direction: "top", children: jsx(Link, { href: url, inline: true, target: "_blank", children: matches[0] }) })),
203
- index: matches.index,
204
- length: matches[0].length,
205
- };
206
- };
207
- const injectButtons = (content) => {
208
- if (!onButtonClick)
209
- return null;
210
- const matches = content.match(/\[(.*?):(.*?)\|([^\]]+)\]/);
211
- if (!matches)
212
- return null;
213
- const [data, label] = matches[0]
214
- .replace('[', '')
215
- .replace(']', '')
216
- .split('|');
217
- const [varName, value] = data.split(':');
218
- return {
219
- elem: (jsx(Button, { variant: "default", size: "s", round: true, onClick: () => onButtonClick({ text: label, [varName]: value }), children: label })),
220
- index: matches.index,
221
- length: matches[0].length,
222
- };
223
- };
224
- const headingTags = ['h1', 'h2', 'h3', 'h4', 'h5', 'h6'];
225
- const processCellContent = (value, depth = 0) => applyInjectors(value, [
226
- injectCodeBlock,
227
- injectPrettyJson,
228
- ...(depth === 0
229
- ? [
230
- (content) => {
231
- const matches = content.match(/(^|\n)(#{1,6})\s+([^\n]+)/);
232
- if (!matches)
233
- return null;
234
- const Tag = headingTags[Math.min(matches[2].length, 6) - 1];
235
- return {
236
- elem: React__default.createElement(Tag, {}, ...processCellContent(matches[3], depth + 1)),
237
- index: matches.index,
238
- length: matches[0].length,
239
- };
240
- },
241
- ]
242
- : []),
243
- injectLines,
244
- injectLinks,
245
- injectBold,
246
- injectItalic,
247
- injectBullet,
248
- injectNumbered,
249
- injectButtons,
250
- ]);
251
- const injectHeading = (content) => {
252
- const matches = content.match(/(^|\n)(#{1,6})\s+([^\n]+)/);
253
- if (!matches)
254
- return null;
255
- const Tag = headingTags[Math.min(matches[2].length, 6) - 1];
256
- return {
257
- elem: React__default.createElement(Tag, {}, ...processCellContent(matches[3], 1)),
258
- index: matches.index,
259
- length: matches[0].length,
260
- };
261
- };
262
- const injectTables = (content) => {
263
- const withSep = content.match(/(\n|^)(\|[^\n]+\|\s*\n)(\|[\s:-]+(?:\|[\s:-]+)*\|\s*\n)((?:\|[^\n]+\|\s*\n?)+)/);
264
- const withoutSep = withSep
265
- ? null
266
- : content.match(/(\n|^)(\|[^\n]+\|\s*\n)((?:\|[^\n]+\|\s*\n?)+)/);
267
- const matches = withSep || withoutSep;
268
- if (!matches)
269
- return null;
270
- const hasSeparator = Boolean(withSep);
271
- const headerRow = matches[2].trim();
272
- const dataRows = (hasSeparator ? matches[4] : matches[3]).trim();
273
- const headers = headerRow.split('|').map(cell => cell.trim()).slice(1, -1);
274
- if (headers.length === 0)
275
- return null;
276
- const rows = dataRows
277
- .split('\n')
278
- .map(row => row.trim())
279
- .filter(row => row.startsWith('|') && row.endsWith('|'))
280
- .map(row => row.split('|').map(cell => cell.trim()).slice(1, -1))
281
- .filter(row => row.length > 0);
282
- if (rows.length === 0)
283
- return null;
284
- const maxCols = Math.max(headers.length, ...rows.map(row => row.length));
285
- const paddedHeaders = [
286
- ...headers,
287
- ...Array(maxCols - headers.length).fill(''),
288
- ];
289
- const columns = paddedHeaders.map((header, idx) => ({
290
- id: `col-${idx}`,
291
- label: processCellContent(header),
292
- dataField: `col-${idx}`,
293
- render: (data) => processCellContent(data[`col-${idx}`] || ''),
294
- }));
295
- const tableData = rows.map((row, rowIdx) => {
296
- const rowData = { id: `row-${rowIdx}` };
297
- paddedHeaders.forEach((_, colIdx) => {
298
- rowData[`col-${colIdx}`] = row[colIdx] || '';
299
- });
300
- return rowData;
301
- });
302
- return {
303
- elem: (jsx(Table, { size: "s", variant: "plain", columns: columns, data: tableData, className: S.table })),
304
- index: matches.index + (matches[1]?.length || 0),
305
- length: matches[0].length - (matches[1]?.length || 0),
306
- };
307
- };
308
- return (jsx("div", { className: className, children: applyInjectors(text, [
309
- injectTables,
310
- injectCodeBlock,
311
- injectPrettyJson,
312
- injectHeading,
313
- injectLines,
314
- injectLinks,
315
- injectBold,
316
- injectItalic,
317
- injectBullet,
318
- injectNumbered,
319
- injectButtons,
320
- ]) }));
4
+ function ChatFormattedText(props) {
5
+ return jsx(FormattedText, { ...props });
321
6
  }
322
7
 
323
8
  export { ChatFormattedText };
@@ -1,6 +1,6 @@
1
1
  import styleInject from '../../../node_modules/style-inject/dist/style-inject.es.js';
2
2
 
3
- var css_248z = ".Expand_root__zxSvx{display:flex;flex-direction:column}.Expand_root__zxSvx+.Expand_root__zxSvx{margin-top:var(--p-3)}.Expand_header__LxAel{justify-content:space-between}.Expand_headerIcon__CXlwY{transition:transform .2s ease-out}.Expand_isOpen__k6lyZ .Expand_header__LxAel{background-color:var(--active-color-alpha-500)}.Expand_isOpen__k6lyZ .Expand_headerIcon__CXlwY{transform:rotate(90deg)}";
3
+ var css_248z = ".Expand_root__zxSvx{display:flex;flex-direction:column}.Expand_root__zxSvx+.Expand_root__zxSvx{margin-top:var(--p-3)}.Expand_header__LxAel{justify-content:space-between}.Expand_headerIcon__CXlwY{opacity:.4;transform:scale(.7);transition:transform .2s ease-out,opacity .2s ease-out}.Expand_header__LxAel:hover .Expand_headerIcon__CXlwY{opacity:1}.Expand_isOpen__k6lyZ .Expand_header__LxAel{background-color:var(--active-color-alpha-500)}.Expand_isOpen__k6lyZ .Expand_headerIcon__CXlwY{transform:scale(.7) rotate(90deg)}";
4
4
  var S = {"root":"Expand_root__zxSvx","header":"Expand_header__LxAel","headerIcon":"Expand_headerIcon__CXlwY","isOpen":"Expand_isOpen__k6lyZ"};
5
5
  styleInject(css_248z);
6
6
 
@@ -0,0 +1,323 @@
1
+ import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
2
+ import React__default from 'react';
3
+ import { Button } from '../Button/Button.js';
4
+ import { Link } from '../Router/Link/Link.js';
5
+ import { Table } from '../Table/Table.js';
6
+ import { Tooltip } from '../Tooltip/Tooltip.js';
7
+ import S from './FormattedText.styl.js';
8
+
9
+ function findJsonEndExclusive(content, start) {
10
+ const first = content[start];
11
+ if (first !== '{' && first !== '[')
12
+ return -1;
13
+ const stack = first === '{' ? ['}'] : [']'];
14
+ let i = start + 1;
15
+ let inString = false;
16
+ let escape = false;
17
+ while (i < content.length && stack.length > 0) {
18
+ const c = content[i];
19
+ if (inString) {
20
+ if (escape)
21
+ escape = false;
22
+ else if (c === '\\')
23
+ escape = true;
24
+ else if (c === '"')
25
+ inString = false;
26
+ i++;
27
+ continue;
28
+ }
29
+ if (c === '"') {
30
+ inString = true;
31
+ i++;
32
+ continue;
33
+ }
34
+ if (c === '{') {
35
+ stack.push('}');
36
+ i++;
37
+ continue;
38
+ }
39
+ if (c === '[') {
40
+ stack.push(']');
41
+ i++;
42
+ continue;
43
+ }
44
+ if (c === '}' || c === ']') {
45
+ if (c !== stack[stack.length - 1])
46
+ return -1;
47
+ stack.pop();
48
+ i++;
49
+ continue;
50
+ }
51
+ i++;
52
+ }
53
+ return stack.length > 0 ? -1 : i;
54
+ }
55
+ function applyInjectors(text, injectors) {
56
+ let result = [text];
57
+ injectors.forEach(fn => {
58
+ let i = 0;
59
+ while (i < result.length) {
60
+ const item = result[i];
61
+ if (typeof item === 'string') {
62
+ const res = fn(item);
63
+ if (!res) {
64
+ i++;
65
+ continue;
66
+ }
67
+ const { elem, index, length } = res;
68
+ if (index >= 0) {
69
+ const before = item.substring(0, index);
70
+ const after = item.substring(index + length);
71
+ result.splice(i, 1, before, elem, after);
72
+ if (after.length > 0)
73
+ continue;
74
+ }
75
+ }
76
+ i++;
77
+ }
78
+ });
79
+ return result;
80
+ }
81
+ function FormattedText({ text, className, onButtonClick, }) {
82
+ const injectLines = (content) => {
83
+ const matches = content.match(/\n---\n/);
84
+ if (!matches)
85
+ return null;
86
+ return {
87
+ elem: jsx("div", { className: S.line }),
88
+ index: matches.index,
89
+ length: matches[0].length,
90
+ };
91
+ };
92
+ const injectBullet = (content) => {
93
+ const matches = content.match(/(\n|^)([ \t]*)(-|\*|\+)\s/);
94
+ if (!matches)
95
+ return null;
96
+ return {
97
+ elem: (jsxs(Fragment, { children: [matches[1] === '\n' && jsx("br", {}), jsx("div", { className: S.bullet })] })),
98
+ index: matches.index,
99
+ length: matches[0].length,
100
+ };
101
+ };
102
+ const injectNumbered = (content) => {
103
+ const matches = content.match(/(\n|^)([ \t]*)(\d+)\.\s+/);
104
+ if (!matches)
105
+ return null;
106
+ return {
107
+ elem: (jsxs(Fragment, { children: [matches[1] === '\n' && jsx("br", {}), jsxs("span", { className: S.numberedIndex, children: [matches[3], "."] })] })),
108
+ index: matches.index,
109
+ length: matches[0].length,
110
+ };
111
+ };
112
+ const injectBold = (content) => {
113
+ const matches = content.match(/\*\*(.*?)\*\*/);
114
+ if (!matches)
115
+ return null;
116
+ return {
117
+ elem: jsx("strong", { children: matches[1] }),
118
+ index: matches.index,
119
+ length: matches[0].length,
120
+ };
121
+ };
122
+ const injectItalic = (content) => {
123
+ const matches = content.match(/\*(.*?)\*/);
124
+ if (!matches)
125
+ return null;
126
+ return {
127
+ elem: jsx("em", { children: matches[1] }),
128
+ index: matches.index,
129
+ length: matches[0].length,
130
+ };
131
+ };
132
+ const injectCodeBlock = (content) => {
133
+ const multiline = content.match(/```(\w+)?[\s\n]*([\s\S]*?)```/);
134
+ if (multiline) {
135
+ return {
136
+ elem: jsx("code", { className: S.codeBlock, children: multiline[2].trim() }),
137
+ index: multiline.index,
138
+ length: multiline[0].length,
139
+ };
140
+ }
141
+ const inline = content.match(/`([^`\n]+)`/);
142
+ if (!inline)
143
+ return null;
144
+ return {
145
+ elem: jsx("code", { className: S.codeInline, children: inline[1] }),
146
+ index: inline.index,
147
+ length: inline[0].length,
148
+ };
149
+ };
150
+ const injectPrettyJson = (content) => {
151
+ let searchFrom = 0;
152
+ while (searchFrom < content.length) {
153
+ let start = -1;
154
+ for (let j = searchFrom; j < content.length; j++) {
155
+ if (content[j] === '{' || content[j] === '[') {
156
+ start = j;
157
+ break;
158
+ }
159
+ }
160
+ if (start < 0)
161
+ return null;
162
+ const endExclusive = findJsonEndExclusive(content, start);
163
+ if (endExclusive < 0) {
164
+ searchFrom = start + 1;
165
+ continue;
166
+ }
167
+ const slice = content.slice(start, endExclusive);
168
+ try {
169
+ const parsed = JSON.parse(slice);
170
+ return {
171
+ elem: (jsx("pre", { className: S.jsonPre, children: JSON.stringify(parsed, null, 2) })),
172
+ index: start,
173
+ length: slice.length,
174
+ };
175
+ }
176
+ catch {
177
+ searchFrom = start + 1;
178
+ }
179
+ }
180
+ return null;
181
+ };
182
+ const injectLinks = (content) => {
183
+ const markdown = content.match(/\[([^\]]+)\]\(([^)]+)\)/);
184
+ if (markdown) {
185
+ let url = markdown[2];
186
+ if (url.startsWith('www.'))
187
+ url = `https://${url}`;
188
+ return {
189
+ elem: (jsx(Tooltip, { content: url, direction: "top", children: jsx(Link, { href: url, inline: true, target: "_blank", children: markdown[1] }) })),
190
+ index: markdown.index,
191
+ length: markdown[0].length,
192
+ };
193
+ }
194
+ const bareDomainTlds = 'com|org|net|edu|gov|mil|int|info|biz|co|io|ai|app|dev|me|tv|cc|ly|sh|so|gg|fm|ws|xyz|tech|cloud|store|online|site|shop|blog|news|link|page|uk|us|ca|de|fr|jp|cn|ru|br|in|au|it|es|nl|se|no|fi|pl|ch|be|at|dk|cz|gr|hu|ie|pt|ro|tr|kr|mx|za|sg|hk|tw|nz|il|ae|ua';
195
+ const matches = content.match(new RegExp(`(https?:\\/\\/[^\\s<>"']+|www\\.[^\\s<>"']+|[a-zA-Z0-9](?:[a-zA-Z0-9-]{0,61}[a-zA-Z0-9])?(?:\\.[a-zA-Z0-9](?:[a-zA-Z0-9-]{0,61}[a-zA-Z0-9])?)*\\.(?:${bareDomainTlds})\\b[^\\s<>"']*)`, 'i'));
196
+ if (!matches)
197
+ return null;
198
+ let url = matches[0];
199
+ if (url.startsWith('www.'))
200
+ url = `https://${url}`;
201
+ return {
202
+ elem: (jsx(Tooltip, { content: url, direction: "top", children: jsx(Link, { href: url, inline: true, target: "_blank", children: matches[0] }) })),
203
+ index: matches.index,
204
+ length: matches[0].length,
205
+ };
206
+ };
207
+ const injectButtons = (content) => {
208
+ if (!onButtonClick)
209
+ return null;
210
+ const matches = content.match(/\[(.*?):(.*?)\|([^\]]+)\]/);
211
+ if (!matches)
212
+ return null;
213
+ const [data, label] = matches[0]
214
+ .replace('[', '')
215
+ .replace(']', '')
216
+ .split('|');
217
+ const [varName, value] = data.split(':');
218
+ return {
219
+ elem: (jsx(Button, { variant: "default", size: "s", round: true, onClick: () => onButtonClick({ text: label, [varName]: value }), children: label })),
220
+ index: matches.index,
221
+ length: matches[0].length,
222
+ };
223
+ };
224
+ const headingTags = ['h1', 'h2', 'h3', 'h4', 'h5', 'h6'];
225
+ const processCellContent = (value, depth = 0) => applyInjectors(value, [
226
+ injectCodeBlock,
227
+ injectPrettyJson,
228
+ ...(depth === 0
229
+ ? [
230
+ (content) => {
231
+ const matches = content.match(/(^|\n)(#{1,6})\s+([^\n]+)/);
232
+ if (!matches)
233
+ return null;
234
+ const Tag = headingTags[Math.min(matches[2].length, 6) - 1];
235
+ return {
236
+ elem: React__default.createElement(Tag, {}, ...processCellContent(matches[3], depth + 1)),
237
+ index: matches.index,
238
+ length: matches[0].length,
239
+ };
240
+ },
241
+ ]
242
+ : []),
243
+ injectLines,
244
+ injectLinks,
245
+ injectBold,
246
+ injectItalic,
247
+ injectBullet,
248
+ injectNumbered,
249
+ injectButtons,
250
+ ]);
251
+ const injectHeading = (content) => {
252
+ const matches = content.match(/(^|\n)(#{1,6})\s+([^\n]+)/);
253
+ if (!matches)
254
+ return null;
255
+ const Tag = headingTags[Math.min(matches[2].length, 6) - 1];
256
+ return {
257
+ elem: React__default.createElement(Tag, {}, ...processCellContent(matches[3], 1)),
258
+ index: matches.index,
259
+ length: matches[0].length,
260
+ };
261
+ };
262
+ const injectTables = (content) => {
263
+ const withSep = content.match(/(\n|^)(\|[^\n]+\|\s*\n)(\|[\s:-]+(?:\|[\s:-]+)*\|\s*\n)((?:\|[^\n]+\|\s*\n?)+)/);
264
+ const withoutSep = withSep
265
+ ? null
266
+ : content.match(/(\n|^)(\|[^\n]+\|\s*\n)((?:\|[^\n]+\|\s*\n?)+)/);
267
+ const matches = withSep || withoutSep;
268
+ if (!matches)
269
+ return null;
270
+ const hasSeparator = Boolean(withSep);
271
+ const headerRow = matches[2].trim();
272
+ const dataRows = (hasSeparator ? matches[4] : matches[3]).trim();
273
+ const headers = headerRow.split('|').map(cell => cell.trim()).slice(1, -1);
274
+ if (headers.length === 0)
275
+ return null;
276
+ const rows = dataRows
277
+ .split('\n')
278
+ .map(row => row.trim())
279
+ .filter(row => row.startsWith('|') && row.endsWith('|'))
280
+ .map(row => row.split('|').map(cell => cell.trim()).slice(1, -1))
281
+ .filter(row => row.length > 0);
282
+ if (rows.length === 0)
283
+ return null;
284
+ const maxCols = Math.max(headers.length, ...rows.map(row => row.length));
285
+ const paddedHeaders = [
286
+ ...headers,
287
+ ...Array(maxCols - headers.length).fill(''),
288
+ ];
289
+ const columns = paddedHeaders.map((header, idx) => ({
290
+ id: `col-${idx}`,
291
+ label: processCellContent(header),
292
+ dataField: `col-${idx}`,
293
+ render: (data) => processCellContent(data[`col-${idx}`] || ''),
294
+ }));
295
+ const tableData = rows.map((row, rowIdx) => {
296
+ const rowData = { id: `row-${rowIdx}` };
297
+ paddedHeaders.forEach((_, colIdx) => {
298
+ rowData[`col-${colIdx}`] = row[colIdx] || '';
299
+ });
300
+ return rowData;
301
+ });
302
+ return {
303
+ elem: (jsx(Table, { size: "s", variant: "plain", columns: columns, data: tableData, className: S.table })),
304
+ index: matches.index + (matches[1]?.length || 0),
305
+ length: matches[0].length - (matches[1]?.length || 0),
306
+ };
307
+ };
308
+ return (jsx("div", { className: className, children: applyInjectors(text, [
309
+ injectTables,
310
+ injectCodeBlock,
311
+ injectPrettyJson,
312
+ injectHeading,
313
+ injectLines,
314
+ injectLinks,
315
+ injectBold,
316
+ injectItalic,
317
+ injectBullet,
318
+ injectNumbered,
319
+ injectButtons,
320
+ ]) }));
321
+ }
322
+
323
+ export { FormattedText };
@@ -0,0 +1,7 @@
1
+ import styleInject from '../../../node_modules/style-inject/dist/style-inject.es.js';
2
+
3
+ var css_248z = ".FormattedText_bullet__vbqlq{display:inline-block;margin-bottom:2px;margin-left:var(--p-2);margin-right:2px}.FormattedText_bullet__vbqlq:before{background-color:var(--accent-color);border-radius:50%;content:\"\";display:block;height:6px;margin:0 4px;width:6px}.FormattedText_numberedIndex__rZ6Kt{font-feature-settings:\"tnum\";color:var(--accent-color);display:inline-block;font-variant-numeric:tabular-nums;margin-left:var(--p-2);margin-right:6px;min-width:1.25em}.FormattedText_line__c2bmE{background-color:var(--accent-color-alpha-200);border-radius:2px;height:2px;margin:var(--p-2) 0;width:100%}.FormattedText_codeBlock__Xrbvn,.FormattedText_codeInline__jCbNL{background-color:var(--decent-color-alpha-400);border-radius:var(--p-2);box-shadow:0 1px 1px var(--accent-color-alpha-50),inset 0 1px 1px var(--decent-color-alpha-500);font-family:monospace;-webkit-user-select:text;-moz-user-select:text;user-select:text}.FormattedText_codeInline__jCbNL{border-radius:3px;display:inline;font-size:90%;padding:0 4px}.FormattedText_codeBlock__Xrbvn,.FormattedText_jsonPre__qOGmo{display:block;font-size:90%;margin:var(--p-2) 0;overflow-x:auto;padding:var(--p-2);white-space:pre-wrap}.FormattedText_jsonPre__qOGmo{background-color:var(--decent-color-alpha-300);border-radius:var(--p-2);box-shadow:0 1px 1px var(--accent-color-alpha-50),inset 0 1px 1px var(--accent-color-alpha-50);font-family:monospace;max-width:100%;-webkit-user-select:text;-moz-user-select:text;user-select:text}.FormattedText_table__ipMMS{margin-bottom:10px}";
4
+ var S = {"bullet":"FormattedText_bullet__vbqlq","numberedIndex":"FormattedText_numberedIndex__rZ6Kt","line":"FormattedText_line__c2bmE","codeInline":"FormattedText_codeInline__jCbNL","codeBlock":"FormattedText_codeBlock__Xrbvn","jsonPre":"FormattedText_jsonPre__qOGmo","table":"FormattedText_table__ipMMS"};
5
+ styleInject(css_248z);
6
+
7
+ export { S as default };
@@ -35,7 +35,7 @@ import '../Card/Card.js';
35
35
  import '../Router/context.js';
36
36
  import '../Router/Link/Link.styl.js';
37
37
  import '../Table/Table.styl.js';
38
- import '../Chat/ChatFormattedText.styl.js';
38
+ import '../FormattedText/FormattedText.styl.js';
39
39
  import '../Expand/Expand.styl.js';
40
40
  import '../Chat/ChatMessage.styl.js';
41
41
  import '../PromptComposer/PromptComposer.js';
@@ -1,6 +1,6 @@
1
1
  import styleInject from '../../../node_modules/style-inject/dist/style-inject.es.js';
2
2
 
3
- var css_248z = ".Menu_root__xhtlo{max-height:200px;width:100%}.keyboard .Menu_root__xhtlo{pointer-events:none}.Menu_item__VtmwS{align-items:center;animation:Menu_fadeIn__XRZkT .3s ease-out;cursor:pointer;display:flex;overflow:hidden;padding-bottom:0!important;padding-top:0!important;position:relative;text-align:left;text-overflow:ellipsis;-webkit-user-select:none;-moz-user-select:none;user-select:none;white-space:nowrap;width:100%}.Menu_item__VtmwS:first-child{border-top-left-radius:2px;border-top-right-radius:2px}.Menu_item__VtmwS:last-child{border-bottom-left-radius:2px;border-bottom-right-radius:2px}.Menu_size-xs__MSbRQ .Menu_item__VtmwS{font-size:14px;height:24px;padding:0 8px}.Menu_size-s__DA0r3 .Menu_item__VtmwS{font-size:16px;height:32px;padding:0 12px}.Menu_size-m__0EI47 .Menu_item__VtmwS{font-size:18px;height:40px;padding:0 16px}.Menu_size-l__PXpIm .Menu_item__VtmwS{font-size:22px;height:48px;padding:0 20px}.Menu_size-xl__U1WW8 .Menu_item__VtmwS{font-size:26px;height:56px;padding:0 24px}.Menu_item__VtmwS.Menu_selected__V71xy{background-color:var(--active-color-alpha-500)}.Menu_item__VtmwS.Menu_disabled__5afRm{cursor:not-allowed;opacity:.4}.keyboard .Menu_item__VtmwS.Menu_focused__FLWqW,.pointer .Menu_item__VtmwS:hover{box-shadow:inset 100vw 0 0 0 var(--accent-color-alpha-200)}.Menu_textOverflow__udsHR .Menu_item__VtmwS>span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.Menu_group__6e-Ef{background-color:var(--decent-color);color:var(--accent-color);font-size:14px;font-weight:500;padding:8px 12px;pointer-events:none;position:sticky;top:0;z-index:1}.Menu_levelIndent__S6HXJ{--menu-indent-size:var(--p-3)}.Menu_levelIndent__S6HXJ.Menu_level-1__kueO2{padding-left:calc(var(--menu-indent-size)*2)}.Menu_levelIndent__S6HXJ.Menu_level-2__JZGkJ{padding-left:calc(var(--menu-indent-size)*3)}.Menu_levelIndent__S6HXJ.Menu_level-3__LFd-F{padding-left:calc(var(--menu-indent-size)*4)}.Menu_levelIndent__S6HXJ.Menu_level-4__2DUMl{padding-left:calc(var(--menu-indent-size)*5)}.Menu_levelIndent__S6HXJ.Menu_level-5__xpgvQ{padding-left:calc(var(--menu-indent-size)*6)}@keyframes Menu_fadeIn__XRZkT{0%{opacity:0}10%{opacity:0}to{opacity:1}}";
3
+ var css_248z = ".Menu_root__xhtlo{max-height:200px;width:100%}.keyboard .Menu_root__xhtlo{pointer-events:none}.Menu_item__VtmwS{align-items:center;animation:Menu_fadeIn__XRZkT .3s ease-out;cursor:pointer;display:flex;overflow:hidden;padding-bottom:0!important;padding-top:0!important;position:relative;text-align:left;text-overflow:ellipsis;-webkit-user-select:none;-moz-user-select:none;user-select:none;white-space:nowrap;width:100%}.Menu_item__VtmwS:first-child{border-top-left-radius:2px;border-top-right-radius:2px}.Menu_item__VtmwS:last-child{border-bottom-left-radius:2px;border-bottom-right-radius:2px}.Menu_size-xs__MSbRQ .Menu_item__VtmwS{font-size:14px;height:24px;padding:0 8px}.Menu_size-s__DA0r3 .Menu_item__VtmwS{font-size:16px;height:32px;padding:0 12px}.Menu_size-m__0EI47 .Menu_item__VtmwS{font-size:18px;height:40px;padding:0 16px}.Menu_size-l__PXpIm .Menu_item__VtmwS{font-size:22px;height:48px;padding:0 20px}.Menu_size-xl__U1WW8 .Menu_item__VtmwS{font-size:26px;height:56px;padding:0 24px}.Menu_item__VtmwS.Menu_selected__V71xy{background-color:var(--active-color-alpha-500)}.Menu_item__VtmwS.Menu_disabled__5afRm{cursor:not-allowed;opacity:.4}.keyboard .Menu_item__VtmwS.Menu_focused__FLWqW,.pointer .Menu_item__VtmwS:hover{box-shadow:inset 100vw 0 0 0 var(--active-color-alpha-200)}.Menu_textOverflow__udsHR .Menu_item__VtmwS>span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.Menu_group__6e-Ef{background-color:var(--decent-color);color:var(--accent-color);font-size:14px;font-weight:500;padding:8px 12px;pointer-events:none;position:sticky;top:0;z-index:1}.Menu_levelIndent__S6HXJ{--menu-indent-size:var(--p-3)}.Menu_levelIndent__S6HXJ.Menu_level-1__kueO2{padding-left:calc(var(--menu-indent-size)*2)}.Menu_levelIndent__S6HXJ.Menu_level-2__JZGkJ{padding-left:calc(var(--menu-indent-size)*3)}.Menu_levelIndent__S6HXJ.Menu_level-3__LFd-F{padding-left:calc(var(--menu-indent-size)*4)}.Menu_levelIndent__S6HXJ.Menu_level-4__2DUMl{padding-left:calc(var(--menu-indent-size)*5)}.Menu_levelIndent__S6HXJ.Menu_level-5__xpgvQ{padding-left:calc(var(--menu-indent-size)*6)}@keyframes Menu_fadeIn__XRZkT{0%{opacity:0}10%{opacity:0}to{opacity:1}}";
4
4
  var S = {"root":"Menu_root__xhtlo","item":"Menu_item__VtmwS","fadeIn":"Menu_fadeIn__XRZkT","size-xs":"Menu_size-xs__MSbRQ","size-s":"Menu_size-s__DA0r3","size-m":"Menu_size-m__0EI47","size-l":"Menu_size-l__PXpIm","size-xl":"Menu_size-xl__U1WW8","selected":"Menu_selected__V71xy","disabled":"Menu_disabled__5afRm","focused":"Menu_focused__FLWqW","textOverflow":"Menu_textOverflow__udsHR","group":"Menu_group__6e-Ef","levelIndent":"Menu_levelIndent__S6HXJ","level-1":"Menu_level-1__kueO2","level-2":"Menu_level-2__JZGkJ","level-3":"Menu_level-3__LFd-F","level-4":"Menu_level-4__2DUMl","level-5":"Menu_level-5__xpgvQ"};
5
5
  styleInject(css_248z);
6
6
 
@@ -1,6 +1,6 @@
1
1
  import styleInject from '../../../node_modules/style-inject/dist/style-inject.es.js';
2
2
 
3
- var css_248z = ".NestedMenu_root__ybyGA{display:inline-flex;position:relative}.NestedMenu_trigger__zBeNI{display:inline-flex}.NestedMenu_popup__q0uYO{background:var(--decent-color);border:1px solid var(--accent-color-alpha-200);border-radius:10px;box-shadow:0 8px 28px rgba(0,0,0,.45);left:0;max-width:280px;min-width:200px;padding:4px;position:absolute;top:calc(100% + 6px);z-index:20}.NestedMenu_alignEnd__L4AZi{left:auto;right:0}.NestedMenu_itemWrap__Qmc0B{position:relative}.NestedMenu_back__dNsDV,.NestedMenu_item__tgbZm,.NestedMenu_row__48g5c{align-items:center;background:none;border:none;border-radius:6px;color:inherit;cursor:pointer;display:flex;font:inherit;font-size:13px;font-weight:500;gap:8px;letter-spacing:.01em;line-height:1.3;padding:6px 10px;text-align:left;text-decoration:none;width:100%}.NestedMenu_back__dNsDV.NestedMenu_itemActive__RfPZH,.NestedMenu_back__dNsDV:hover,.NestedMenu_item__tgbZm.NestedMenu_itemActive__RfPZH,.NestedMenu_item__tgbZm:hover,.NestedMenu_row__48g5c.NestedMenu_itemActive__RfPZH,.NestedMenu_row__48g5c:hover{background:var(--accent-color-alpha-100)}.NestedMenu_back__dNsDV.NestedMenu_itemDisabled__evVk1,.NestedMenu_back__dNsDV:disabled,.NestedMenu_item__tgbZm.NestedMenu_itemDisabled__evVk1,.NestedMenu_item__tgbZm:disabled,.NestedMenu_row__48g5c.NestedMenu_itemDisabled__evVk1,.NestedMenu_row__48g5c:disabled{cursor:default;opacity:.55;pointer-events:none}.NestedMenu_itemDanger__oAJbP{color:var(--active-color)}.NestedMenu_itemDanger__oAJbP .NestedMenu_icon__4g2Yp{color:inherit;opacity:1}.NestedMenu_icon__4g2Yp{display:inline-flex;flex-shrink:0;opacity:.55}.NestedMenu_icon__4g2Yp svg{display:block}.NestedMenu_label__Jnm6l{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.NestedMenu_hint__hotNP{flex-shrink:0;font-weight:400;opacity:.5}.NestedMenu_multiline__MDdk-{grid-row-gap:2px;align-items:start;display:grid;grid-template-columns:auto minmax(0,1fr);min-width:252px;row-gap:2px}.NestedMenu_multiline__MDdk- .NestedMenu_label__Jnm6l{overflow:visible;text-overflow:clip}.NestedMenu_multiline__MDdk- .NestedMenu_hint__hotNP{grid-column:2;min-width:0;white-space:normal}.NestedMenu_chevron__8i-Po{flex-shrink:0;opacity:.45}.NestedMenu_row__48g5c svg{color:var(--active-color);flex-shrink:0}.NestedMenu_submenu__Tx1Ll{background:var(--decent-color);border:1px solid var(--accent-color-alpha-200);border-radius:10px;box-shadow:0 8px 28px rgba(0,0,0,.45);left:calc(100% + 6px);max-height:min(360px,calc(100vh - 24px));max-width:280px;min-width:220px;overflow-x:hidden;overflow-y:auto;padding:4px;position:absolute;top:-4px;z-index:21}.NestedMenu_submenu__Tx1Ll:before{bottom:0;content:\"\";left:-6px;position:absolute;top:0;width:6px}.NestedMenu_submenuLeft__y18Nb{left:auto;right:calc(100% + 6px)}.NestedMenu_submenuLeft__y18Nb:before{left:auto;right:-6px}.NestedMenu_stacked__rMiOi{display:flex;flex-direction:column;max-height:min(360px,calc(100vh - 24px));overflow-y:auto}.NestedMenu_back__dNsDV{font-weight:650;margin-bottom:2px}.NestedMenu_stackedBody__Fbkma{min-width:0}";
3
+ var css_248z = ".NestedMenu_root__ybyGA{display:inline-flex;position:relative}.NestedMenu_trigger__zBeNI{display:inline-flex}.NestedMenu_popup__q0uYO{background:var(--decent-color);border:1px solid var(--accent-color-alpha-200);border-radius:10px;box-shadow:0 8px 28px rgba(0,0,0,.45);display:flex;flex-direction:column;gap:1px;left:0;max-width:280px;min-width:200px;padding:4px;position:absolute;top:calc(100% + 6px);z-index:20}.NestedMenu_alignEnd__L4AZi{left:auto;right:0}.NestedMenu_itemWrap__Qmc0B{position:relative}.NestedMenu_back__dNsDV,.NestedMenu_item__tgbZm,.NestedMenu_row__48g5c{align-items:center;background:none;border:none;border-radius:6px;color:inherit;cursor:pointer;display:flex;font:inherit;font-size:13px;font-weight:500;gap:8px;letter-spacing:.01em;line-height:1.3;padding:6px 10px;text-align:left;text-decoration:none;width:100%}.NestedMenu_back__dNsDV:hover,.NestedMenu_item__tgbZm:hover,.NestedMenu_row__48g5c:hover{background:var(--accent-color-alpha-50)}.NestedMenu_back__dNsDV.NestedMenu_itemActive__RfPZH,.NestedMenu_item__tgbZm.NestedMenu_itemActive__RfPZH,.NestedMenu_row__48g5c.NestedMenu_itemActive__RfPZH{background:var(--accent-color-alpha-100)}.NestedMenu_back__dNsDV.NestedMenu_itemDisabled__evVk1,.NestedMenu_back__dNsDV:disabled,.NestedMenu_item__tgbZm.NestedMenu_itemDisabled__evVk1,.NestedMenu_item__tgbZm:disabled,.NestedMenu_row__48g5c.NestedMenu_itemDisabled__evVk1,.NestedMenu_row__48g5c:disabled{cursor:default;opacity:.55;pointer-events:none}.NestedMenu_itemDanger__oAJbP{color:var(--active-color)}.NestedMenu_itemDanger__oAJbP .NestedMenu_icon__4g2Yp{color:inherit;opacity:1}.NestedMenu_icon__4g2Yp{display:inline-flex;flex-shrink:0;opacity:.55}.NestedMenu_icon__4g2Yp svg{display:block}.NestedMenu_label__Jnm6l{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.NestedMenu_hint__hotNP{flex-shrink:0;font-weight:400;opacity:.5}.NestedMenu_multiline__MDdk-{grid-row-gap:2px;align-items:start;display:grid;grid-template-columns:auto minmax(0,1fr);min-width:252px;row-gap:2px}.NestedMenu_multiline__MDdk- .NestedMenu_label__Jnm6l{overflow:visible;text-overflow:clip}.NestedMenu_multiline__MDdk- .NestedMenu_hint__hotNP{grid-column:2;min-width:0;white-space:normal}.NestedMenu_chevron__8i-Po{flex-shrink:0;opacity:.45}.NestedMenu_row__48g5c svg{color:var(--active-color);flex-shrink:0}.NestedMenu_submenu__Tx1Ll{background:var(--decent-color);border:1px solid var(--accent-color-alpha-200);border-radius:10px;box-shadow:0 8px 28px rgba(0,0,0,.45);left:calc(100% + 6px);max-height:min(360px,calc(100vh - 24px));max-width:280px;min-width:220px;overflow-x:hidden;overflow-y:auto;padding:4px;position:absolute;top:-4px;z-index:21}.NestedMenu_submenu__Tx1Ll:before{bottom:0;content:\"\";left:-6px;position:absolute;top:0;width:6px}.NestedMenu_submenuLeft__y18Nb{left:auto;right:calc(100% + 6px)}.NestedMenu_submenuLeft__y18Nb:before{left:auto;right:-6px}.NestedMenu_stacked__rMiOi{display:flex;flex-direction:column;max-height:min(360px,calc(100vh - 24px));overflow-y:auto}.NestedMenu_back__dNsDV{font-weight:650;margin-bottom:2px}.NestedMenu_stackedBody__Fbkma{min-width:0}";
4
4
  var S = {"root":"NestedMenu_root__ybyGA","trigger":"NestedMenu_trigger__zBeNI","popup":"NestedMenu_popup__q0uYO","alignEnd":"NestedMenu_alignEnd__L4AZi","itemWrap":"NestedMenu_itemWrap__Qmc0B","item":"NestedMenu_item__tgbZm","row":"NestedMenu_row__48g5c","back":"NestedMenu_back__dNsDV","itemActive":"NestedMenu_itemActive__RfPZH","itemDisabled":"NestedMenu_itemDisabled__evVk1","itemDanger":"NestedMenu_itemDanger__oAJbP","icon":"NestedMenu_icon__4g2Yp","label":"NestedMenu_label__Jnm6l","hint":"NestedMenu_hint__hotNP","multiline":"NestedMenu_multiline__MDdk-","chevron":"NestedMenu_chevron__8i-Po","submenu":"NestedMenu_submenu__Tx1Ll","submenuLeft":"NestedMenu_submenuLeft__y18Nb","stacked":"NestedMenu_stacked__rMiOi","stackedBody":"NestedMenu_stackedBody__Fbkma"};
5
5
  styleInject(css_248z);
6
6
 
@@ -53,15 +53,15 @@ const useSimplePositionSetup = ({ triggerRef, tooltipRef, content, delay, direct
53
53
  };
54
54
  trigger.addEventListener('mouseenter', showTooltip);
55
55
  trigger.addEventListener('mouseleave', hideTooltip);
56
- trigger.addEventListener('focus', showTooltip);
57
- trigger.addEventListener('blur', hideTooltip);
56
+ trigger.addEventListener('focusin', showTooltip);
57
+ trigger.addEventListener('focusout', hideTooltip);
58
58
  return () => {
59
59
  clearTimeout(timeoutRef.current);
60
60
  clearTriggerTextStyles(tooltip);
61
61
  trigger.removeEventListener('mouseenter', showTooltip);
62
62
  trigger.removeEventListener('mouseleave', hideTooltip);
63
- trigger.removeEventListener('focus', showTooltip);
64
- trigger.removeEventListener('blur', hideTooltip);
63
+ trigger.removeEventListener('focusin', showTooltip);
64
+ trigger.removeEventListener('focusout', hideTooltip);
65
65
  };
66
66
  }, [content, delay, direction, tooltipRef, triggerRef]);
67
67
  };
@@ -1,6 +1,6 @@
1
1
  import styleInject from '../../../node_modules/style-inject/dist/style-inject.es.js';
2
2
 
3
- var css_248z = ".SlashSuggestionList_root__9KCb1{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background-color:var(--decent-color-alpha-700);border-radius:8px;border-radius:var(--radius-lg,8px);box-shadow:inset 0 0 0 1px var(--accent-color-alpha-50),0 8px 24px rgba(0,0,0,.2);color:var(--foreground);max-width:90vw;min-width:220px;overflow:hidden;position:relative}.SlashSuggestionList_root__9KCb1:before{background-color:var(--accent-color-alpha-50);bottom:0;content:\"\";left:0;pointer-events:none;position:absolute;right:0;top:0}.dark .SlashSuggestionList_root__9KCb1{box-shadow:inset 0 0 0 1px var(--accent-color-alpha-50),0 8px 24px rgba(0,0,0,.5)}.SlashSuggestionList_menu__s-jK3{margin:0;max-height:40vh}.SlashSuggestionList_item__9JBeY{align-items:center;border-radius:var(--p-2);display:flex;flex-direction:row;gap:var(--p-2);height:auto!important;justify-content:flex-start;min-height:0;overflow:visible!important;padding:var(--p-1) var(--p-2)!important;position:relative;text-overflow:clip!important;white-space:normal!important;width:100%}.SlashSuggestionList_itemHighlighted__cStZr{box-shadow:inset 100vw 0 0 0 var(--accent-color-alpha-200)}.SlashSuggestionList_itemIcon__hTtxe{color:var(--accent-color-alpha-800);flex-shrink:0}.SlashSuggestionList_itemText__uwNbZ{align-items:flex-start;display:flex;flex-direction:column;min-width:0}.SlashSuggestionList_itemLabel__OMaov{font-weight:600}.SlashSuggestionList_itemDesc__fAdcA{color:var(--accent-color-alpha-600);font-size:80%;white-space:normal}.SlashSuggestionList_mention__aT45p{align-items:center;background:var(--muted);border-radius:var(--p-1);display:inline-flex;line-height:1.4;margin:0 var(--p-1);padding:0 var(--p-1);transition:background-color .1s ease-in-out;-webkit-user-select:none;-moz-user-select:none;user-select:none;vertical-align:baseline;white-space:nowrap}.SlashSuggestionList_mention__aT45p:hover{background-color:var(--accent-color-alpha-200)}";
3
+ var css_248z = ".SlashSuggestionList_root__9KCb1{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background-color:var(--decent-color-alpha-700);border-radius:8px;border-radius:var(--radius-lg,8px);box-shadow:inset 0 0 0 1px var(--accent-color-alpha-50),0 8px 24px rgba(0,0,0,.2);color:var(--foreground);max-width:90vw;min-width:220px;overflow:hidden;position:relative}.SlashSuggestionList_root__9KCb1:before{background-color:var(--accent-color-alpha-50);bottom:0;content:\"\";left:0;pointer-events:none;position:absolute;right:0;top:0}.dark .SlashSuggestionList_root__9KCb1{box-shadow:inset 0 0 0 1px var(--accent-color-alpha-50),0 8px 24px rgba(0,0,0,.5)}.SlashSuggestionList_menu__s-jK3{margin:0;max-height:40vh}.SlashSuggestionList_item__9JBeY{align-items:center;border-radius:var(--p-2);display:flex;flex-direction:row;gap:var(--p-2);height:auto!important;justify-content:flex-start;min-height:0;overflow:visible!important;padding:var(--p-1) var(--p-2)!important;position:relative;text-overflow:clip!important;white-space:normal!important;width:100%}.SlashSuggestionList_itemHighlighted__cStZr{box-shadow:inset 100vw 0 0 0 var(--active-color-alpha-200)}.SlashSuggestionList_itemIcon__hTtxe{color:var(--accent-color-alpha-800);flex-shrink:0}.SlashSuggestionList_itemText__uwNbZ{align-items:flex-start;display:flex;flex-direction:column;min-width:0}.SlashSuggestionList_itemLabel__OMaov{font-weight:600}.SlashSuggestionList_itemDesc__fAdcA{color:var(--accent-color-alpha-600);font-size:80%;white-space:normal}.SlashSuggestionList_mention__aT45p{align-items:center;background:var(--muted);border-radius:var(--p-1);display:inline-flex;line-height:1.4;margin:0 var(--p-1);padding:0 var(--p-1);transition:background-color .1s ease-in-out;-webkit-user-select:none;-moz-user-select:none;user-select:none;vertical-align:baseline;white-space:nowrap}.SlashSuggestionList_mention__aT45p:hover{background-color:var(--active-color-alpha-200)}";
4
4
  var S = {"root":"SlashSuggestionList_root__9KCb1","menu":"SlashSuggestionList_menu__s-jK3","item":"SlashSuggestionList_item__9JBeY","itemHighlighted":"SlashSuggestionList_itemHighlighted__cStZr","itemIcon":"SlashSuggestionList_itemIcon__hTtxe","itemText":"SlashSuggestionList_itemText__uwNbZ","itemLabel":"SlashSuggestionList_itemLabel__OMaov","itemDesc":"SlashSuggestionList_itemDesc__fAdcA","mention":"SlashSuggestionList_mention__aT45p"};
5
5
  styleInject(css_248z);
6
6
 
@@ -1,4 +1,5 @@
1
1
  import type { ReactNode } from 'react';
2
+ import type { FormattedTextProps } from '../FormattedText/FormattedText.types';
2
3
  export type ChatRole = 'USER' | 'AGENT' | 'SYSTEM';
3
4
  export type ChatContentPart = {
4
5
  type: string;
@@ -28,14 +29,7 @@ export type ChatMessageData = {
28
29
  content: string;
29
30
  createdAt?: string | Date;
30
31
  };
31
- export type ChatFormattedTextProps = {
32
- text: string;
33
- className?: string;
34
- onButtonClick?: (params: {
35
- text: string;
36
- [name: string]: string;
37
- }) => void;
38
- };
32
+ export type ChatFormattedTextProps = FormattedTextProps;
39
33
  export type ChatMessageProps = {
40
34
  data: ChatMessageData;
41
35
  isStacked?: boolean;
@@ -1,3 +1,2 @@
1
- import React from 'react';
2
1
  import type { ChatFormattedTextProps } from './types';
3
- export declare function ChatFormattedText({ text, className, onButtonClick, }: ChatFormattedTextProps): React.JSX.Element;
2
+ export declare function ChatFormattedText(props: ChatFormattedTextProps): import("react").JSX.Element;
@@ -0,0 +1,3 @@
1
+ import React from 'react';
2
+ import type { FormattedTextProps } from './FormattedText.types';
3
+ export declare function FormattedText({ text, className, onButtonClick, }: FormattedTextProps): React.JSX.Element;
@@ -0,0 +1,8 @@
1
+ export type FormattedTextProps = {
2
+ text: string;
3
+ className?: string;
4
+ onButtonClick?: (params: {
5
+ text: string;
6
+ [name: string]: string;
7
+ }) => void;
8
+ };
@@ -0,0 +1,2 @@
1
+ export { FormattedText } from './FormattedText';
2
+ export type { FormattedTextProps } from './FormattedText.types';
@@ -17,6 +17,7 @@ export * from './DropZone/DropZone';
17
17
  export * from './Expand/Expand';
18
18
  export * from './Flex/Flex';
19
19
  export * from './Form/Form';
20
+ export * from './FormattedText';
20
21
  export * from './Gap/Gap';
21
22
  export * from './Gallery/Gallery';
22
23
  export * from './GridLayout/GridLayout';
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@homecode/ui",
3
- "version": "5.10.0",
3
+ "version": "5.11.0",
4
4
  "description": "React UI components library",
5
5
  "scripts": {
6
6
  "tests": "jest",
@@ -1,7 +0,0 @@
1
- import styleInject from '../../../node_modules/style-inject/dist/style-inject.es.js';
2
-
3
- var css_248z = ".ChatFormattedText_bullet__CdKe7{display:inline-block;margin-bottom:2px;margin-left:var(--p-2);margin-right:2px}.ChatFormattedText_bullet__CdKe7:before{background-color:var(--accent-color);border-radius:50%;content:\"\";display:block;height:6px;margin:0 4px;width:6px}.ChatFormattedText_numberedIndex__bejS0{font-feature-settings:\"tnum\";color:var(--accent-color);display:inline-block;font-variant-numeric:tabular-nums;margin-left:var(--p-2);margin-right:6px;min-width:1.25em}.ChatFormattedText_line__1j8Sx{background-color:var(--accent-color-alpha-200);border-radius:2px;height:2px;margin:var(--p-2) 0;width:100%}.ChatFormattedText_codeBlock__Mm7Um,.ChatFormattedText_codeInline__gqRjp{background-color:var(--decent-color-alpha-400);border-radius:var(--p-2);box-shadow:0 1px 1px var(--accent-color-alpha-50),inset 0 1px 1px var(--decent-color-alpha-500);font-family:monospace;-webkit-user-select:text;-moz-user-select:text;user-select:text}.ChatFormattedText_codeInline__gqRjp{border-radius:3px;display:inline;font-size:90%;padding:0 4px}.ChatFormattedText_codeBlock__Mm7Um,.ChatFormattedText_jsonPre__m4NwI{display:block;font-size:90%;margin:var(--p-2) 0;overflow-x:auto;padding:var(--p-2);white-space:pre-wrap}.ChatFormattedText_jsonPre__m4NwI{background-color:var(--decent-color-alpha-300);border-radius:var(--p-2);box-shadow:0 1px 1px var(--accent-color-alpha-50),inset 0 1px 1px var(--accent-color-alpha-50);font-family:monospace;max-width:100%;-webkit-user-select:text;-moz-user-select:text;user-select:text}.ChatFormattedText_table__1rTGx{margin-bottom:10px}";
4
- var S = {"bullet":"ChatFormattedText_bullet__CdKe7","numberedIndex":"ChatFormattedText_numberedIndex__bejS0","line":"ChatFormattedText_line__1j8Sx","codeInline":"ChatFormattedText_codeInline__gqRjp","codeBlock":"ChatFormattedText_codeBlock__Mm7Um","jsonPre":"ChatFormattedText_jsonPre__m4NwI","table":"ChatFormattedText_table__1rTGx"};
5
- styleInject(css_248z);
6
-
7
- export { S as default };