@cognite/aura 0.3.0 → 0.3.1

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.
Files changed (47) hide show
  1. package/DESIGN.md +869 -870
  2. package/README.md +112 -11
  3. package/dist/components/index.d.ts +3 -2
  4. package/dist/components/index.js +165 -160
  5. package/dist/components/ui/core/action-toolbar/action-toolbar.js +4 -4
  6. package/dist/components/ui/core/alert/alert.js +3 -3
  7. package/dist/components/ui/core/banner/banner.js +6 -6
  8. package/dist/components/ui/core/button/button.js +4 -4
  9. package/dist/components/ui/core/checkbox/checkbox.js +8 -8
  10. package/dist/components/ui/core/code-block/code-block.js +6 -6
  11. package/dist/components/ui/core/date-time-pickers/date-picker/date-picker.d.ts +15 -0
  12. package/dist/components/ui/core/date-time-pickers/date-picker/date-picker.js +84 -0
  13. package/dist/components/ui/core/date-time-pickers/date-picker/index.d.ts +3 -0
  14. package/dist/components/ui/core/date-time-pickers/date-picker/types.d.ts +18 -0
  15. package/dist/components/ui/core/date-time-pickers/date-picker/use-date-picker.d.ts +3 -0
  16. package/dist/components/ui/core/date-time-pickers/date-picker/use-date-picker.js +63 -0
  17. package/dist/components/ui/core/date-time-pickers/index.d.ts +2 -0
  18. package/dist/components/ui/core/date-time-pickers/index.js +8 -0
  19. package/dist/components/ui/core/date-time-pickers/shared/hooks/use-single-date-state.d.ts +23 -0
  20. package/dist/components/ui/core/date-time-pickers/shared/hooks/use-single-date-state.js +32 -0
  21. package/dist/components/ui/core/date-time-pickers/utils/calendar-utils.js +3 -3
  22. package/dist/components/ui/core/date-time-pickers/utils/time-utils.js +1 -1
  23. package/dist/components/ui/core/hover-card/hover-card.js +3 -3
  24. package/dist/components/ui/core/input/input.js +1 -1
  25. package/dist/components/ui/core/message/message.js +387 -101
  26. package/dist/components/ui/core/pagination/pagination.js +9 -7
  27. package/dist/components/ui/core/prompt-input/prompt-input.js +16 -16
  28. package/dist/components/ui/core/radio-group/radio-group.js +7 -7
  29. package/dist/components/ui/core/reasoning/reasoning.js +1 -1
  30. package/dist/components/ui/core/segmented-control/segmented-control.js +3 -3
  31. package/dist/components/ui/core/select/select.d.ts +2 -1
  32. package/dist/components/ui/core/select/select.js +134 -110
  33. package/dist/components/ui/core/shimmer/shimmer.d.ts +3 -1
  34. package/dist/components/ui/core/shimmer/shimmer.js +89 -49
  35. package/dist/components/ui/core/tabs/tabs.js +3 -3
  36. package/dist/components/ui/core/textarea/textarea.js +1 -1
  37. package/dist/components/ui/core/toggle/toggle.d.ts +15 -0
  38. package/dist/components/ui/core/toggle/toggle.js +74 -0
  39. package/dist/components/ui/core/tool/tool.js +3 -3
  40. package/dist/index.d.ts +1 -1
  41. package/dist/lib/portal-container-context.js +3 -3
  42. package/dist/lib/utils.d.ts +1 -1
  43. package/dist/lib/utils.js +7 -7
  44. package/dist/styles.css +1 -1
  45. package/dist/styles.source.css +3 -0
  46. package/package.json +200 -18
  47. package/dist/index.js +0 -308
@@ -1,145 +1,313 @@
1
- import { jsx as e, jsxs as m } from "react/jsx-runtime";
2
- import { memo as i, createContext as b } from "react";
3
- import { mermaid as _ } from "@streamdown/mermaid";
4
- import "@tabler/icons-react";
5
- import { Streamdown as p } from "streamdown";
6
- import { cn as d } from "../../../../lib/utils.js";
7
- import { Button as u } from "../button/button.js";
8
- import { Tooltip as w, TooltipTrigger as g, TooltipContent as k } from "../tooltip/tooltip.js";
9
- import { MESSAGE_RESPONSE_DEFAULT_STREAMDOWN_CONTROLS as v } from "./message-response-default-streamdown-controls.js";
10
- const R = ({
11
- className: t,
12
- isResponse: o = !1,
13
- ...a
14
- }) => /* @__PURE__ */ e(
1
+ import { jsx as t, jsxs as l, Fragment as h } from "react/jsx-runtime";
2
+ import { createContext as A, memo as T, useState as w, useCallback as v, useMemo as k, useEffect as z, useContext as C } from "react";
3
+ import { mermaid as I } from "@streamdown/mermaid";
4
+ import { IconX as f, IconPaperclip as P, IconChevronRight as E, IconChevronLeft as S } from "@tabler/icons-react";
5
+ import { Streamdown as R } from "streamdown";
6
+ import { cn as c, getInitials as j } from "../../../../lib/utils.js";
7
+ import { Avatar as q, AvatarImage as L, AvatarFallback as O, AvatarIcon as F } from "../avatar/avatar.js";
8
+ import { Button as g } from "../button/button.js";
9
+ import { ButtonGroupText as G, ButtonGroup as D } from "../button-group/button-group.js";
10
+ import { Tooltip as x, TooltipTrigger as N, TooltipContent as y } from "../tooltip/tooltip.js";
11
+ import { MESSAGE_RESPONSE_DEFAULT_STREAMDOWN_CONTROLS as W } from "./message-response-default-streamdown-controls.js";
12
+ const oe = ({
13
+ className: e,
14
+ isResponse: a = !1,
15
+ ...o
16
+ }) => /* @__PURE__ */ t(
15
17
  "div",
16
18
  {
17
19
  "data-slot": "message",
18
- className: d(
20
+ className: c(
19
21
  "group flex w-full items-start justify-start gap-3 mb-0 py-3",
20
- o ? "is-assistant items-start" : "is-user flex-row-reverse",
21
- t
22
+ a ? "is-assistant items-start" : "is-user flex-row-reverse",
23
+ e
22
24
  ),
23
- ...a
25
+ ...o
24
26
  }
25
- ), j = ({
26
- children: t,
27
- className: o,
28
- ...a
29
- }) => /* @__PURE__ */ e(
27
+ ), re = ({
28
+ children: e,
29
+ className: a,
30
+ ...o
31
+ }) => /* @__PURE__ */ t(
30
32
  "div",
31
33
  {
32
34
  "data-slot": "message-content",
33
- className: d(
35
+ className: c(
34
36
  "is-user:dark flex flex-col gap-4 rounded-md text-base leading-tight tracking-tightest",
35
37
  "max-w-4/5",
36
38
  "group-[.is-user]:overflow-hidden group-[.is-user]:bg-accent-background group-[.is-user]:p-2 group-[.is-user]:text-foreground",
37
39
  "group-[.is-assistant]:text-foreground group-[.is-assistant]:pt-1",
38
- o
40
+ a
39
41
  ),
40
- ...a,
41
- children: t
42
+ ...o,
43
+ children: e
42
44
  }
43
- ), q = ({
44
- className: t,
45
- children: o,
46
- ...a
47
- }) => /* @__PURE__ */ e(
45
+ ), de = ({
46
+ avatarUrl: e,
47
+ name: a,
48
+ className: o,
49
+ children: r,
50
+ variant: s,
51
+ sizes: n,
52
+ ...d
53
+ }) => {
54
+ const m = a ? j(a) : "ME";
55
+ return /* @__PURE__ */ t(
56
+ q,
57
+ {
58
+ "data-slot": "message-avatar",
59
+ className: c("size-7 group-[.is-user]:mt-1", o),
60
+ variant: s,
61
+ sizes: n,
62
+ ...d,
63
+ children: r || /* @__PURE__ */ l(h, { children: [
64
+ e && /* @__PURE__ */ t(
65
+ L,
66
+ {
67
+ alt: a || "",
68
+ className: "mt-0 mb-0",
69
+ src: e
70
+ }
71
+ ),
72
+ /* @__PURE__ */ t(O, { children: m })
73
+ ] })
74
+ }
75
+ );
76
+ }, se = (e) => /* @__PURE__ */ t(F, { "data-slot": "message-avatar-icon", ...e }), ne = ({
77
+ className: e,
78
+ children: a,
79
+ ...o
80
+ }) => /* @__PURE__ */ t(
48
81
  "div",
49
82
  {
50
83
  "data-slot": "message-actions",
51
- className: d("flex items-center gap-2 pt-2", t),
52
- ...a,
53
- children: o
84
+ className: c("flex items-center gap-2 pt-2", e),
85
+ ...o,
86
+ children: a
54
87
  }
55
- ), O = ({
56
- tooltip: t,
57
- children: o,
58
- label: a,
88
+ ), ce = ({
89
+ tooltip: e,
90
+ children: a,
91
+ label: o,
59
92
  className: r,
60
93
  variant: s = "ghost",
61
- size: c = "sm",
62
- ...l
94
+ size: n = "sm",
95
+ ...d
63
96
  }) => {
64
- const n = /* @__PURE__ */ m(
65
- u,
97
+ const m = /* @__PURE__ */ l(
98
+ g,
66
99
  {
67
100
  "data-slot": "message-action",
68
- className: d(
101
+ className: c(
69
102
  "relative icon-sm text-muted-foreground hover:text-foreground",
70
103
  r
71
104
  ),
72
- size: c,
105
+ size: n,
73
106
  type: "button",
74
107
  variant: s,
75
- ...l,
108
+ ...d,
76
109
  children: [
77
- o,
78
- /* @__PURE__ */ e("span", { className: "sr-only", children: a || t })
110
+ a,
111
+ /* @__PURE__ */ t("span", { className: "sr-only", children: o || e })
79
112
  ]
80
113
  }
81
114
  );
82
- return t ? /* @__PURE__ */ m(w, { children: [
83
- /* @__PURE__ */ e(g, { render: n }),
84
- /* @__PURE__ */ e(k, { children: /* @__PURE__ */ e("p", { children: t }) })
85
- ] }) : n;
86
- };
87
- b(
115
+ return e ? /* @__PURE__ */ l(x, { children: [
116
+ /* @__PURE__ */ t(N, { render: m }),
117
+ /* @__PURE__ */ t(y, { children: /* @__PURE__ */ t("p", { children: e }) })
118
+ ] }) : m;
119
+ }, M = A(
88
120
  null
89
- );
90
- const f = {
91
- h1: ({ children: t }) => /* @__PURE__ */ e("h1", { className: "mt-0 mb-2 scroll-m-20 text-xl font-medium tracking-tightest", children: t }),
92
- h2: ({ children: t }) => /* @__PURE__ */ e("h2", { className: "mt-4 mb-1 scroll-m-20 text-lg font-medium tracking-tightest", children: t }),
93
- h3: ({ children: t }) => /* @__PURE__ */ e("h3", { className: "mt-4 mb-1 scroll-m-20 text-base font-medium tracking-tighter", children: t }),
94
- h4: ({ children: t }) => /* @__PURE__ */ e("h4", { className: "mt-2 mb-0 scroll-m-20 text-sm font-medium tracking-normal", children: t }),
95
- h5: ({ children: t }) => /* @__PURE__ */ e("h5", { className: "mt-0 mb-0 scroll-m-20 text-xs font-medium tracking-tighter", children: t }),
96
- h6: ({ children: t }) => /* @__PURE__ */ e("h6", { className: "mt-0 mb-0 scroll-m-20 text-2xs font-medium tracking-tighter", children: t }),
97
- p: ({ children: t }) => /* @__PURE__ */ e("p", { className: "mt-2 mb-3 text-base font-normal leading-5 tracking-tightest", children: t }),
98
- strong: ({ children: t }) => /* @__PURE__ */ e("strong", { className: "font-medium", children: t }),
99
- em: ({ children: t }) => /* @__PURE__ */ e("em", { className: "italic", children: t }),
100
- b: ({ children: t }) => /* @__PURE__ */ e("b", { className: "font-medium", children: t }),
101
- i: ({ children: t }) => /* @__PURE__ */ e("i", { className: "italic", children: t }),
102
- ul: ({ children: t }) => /* @__PURE__ */ e("ul", { className: "ml-8.25 mb-3 pt-2 pl-0 pb-0 list-disc text-base font-normal tracking-tightest", children: t }),
103
- ol: ({ children: t }) => /* @__PURE__ */ e("ol", { className: "ml-8.25 mb-3 pt-2 pl-0 pb-0 list-decimal text-base font-normal tracking-tightest", children: t }),
104
- li: ({ children: t }) => /* @__PURE__ */ e("li", { className: "py-0", children: t }),
105
- blockquote: ({ children: t }) => /* @__PURE__ */ e("blockquote", { className: "my-3 pr-2 pl-2 border-l border-l-border text-sm text-muted-foreground font-normal tracking-tight not-italic", children: t }),
106
- hr: () => /* @__PURE__ */ e("hr", { className: "my-4 border-border" }),
107
- a: ({ children: t, href: o, ...a }) => /* @__PURE__ */ e(
121
+ ), p = () => {
122
+ const e = C(M);
123
+ if (!e)
124
+ throw new Error(
125
+ "MessageBranch components must be used within MessageBranch"
126
+ );
127
+ return e;
128
+ }, me = ({
129
+ defaultBranch: e = 0,
130
+ onBranchChange: a,
131
+ className: o,
132
+ ...r
133
+ }) => {
134
+ const [s, n] = w(e), [d, m] = w([]), i = v(() => {
135
+ n((b) => {
136
+ const u = b > 0 ? b - 1 : d.length - 1;
137
+ return a?.(u), u;
138
+ });
139
+ }, [d.length, a]), _ = v(() => {
140
+ n((b) => {
141
+ const u = b < d.length - 1 ? b + 1 : 0;
142
+ return a?.(u), u;
143
+ });
144
+ }, [d.length, a]), B = k(
145
+ () => ({
146
+ currentBranch: s,
147
+ totalBranches: d.length,
148
+ goToPrevious: i,
149
+ goToNext: _,
150
+ branches: d,
151
+ setBranches: m
152
+ }),
153
+ [s, d, i, _, m]
154
+ );
155
+ return /* @__PURE__ */ t(M.Provider, { value: B, children: /* @__PURE__ */ t(
156
+ "div",
157
+ {
158
+ "data-slot": "message-branch",
159
+ className: c("grid w-full gap-2 [&>div]:pb-0", o),
160
+ ...r
161
+ }
162
+ ) });
163
+ }, le = ({
164
+ children: e,
165
+ ...a
166
+ }) => {
167
+ const { currentBranch: o, setBranches: r, branches: s } = p(), n = k(
168
+ () => Array.isArray(e) ? e : [e],
169
+ [e]
170
+ );
171
+ return z(() => {
172
+ s.length !== n.length && r(n);
173
+ }, [n, s, r]), n.map((d, m) => /* @__PURE__ */ t(
174
+ "div",
175
+ {
176
+ "data-slot": "message-branch-content",
177
+ className: c(
178
+ "grid gap-2 overflow-hidden [&>div]:pb-0",
179
+ m === o ? "block" : "hidden"
180
+ ),
181
+ ...a,
182
+ children: d
183
+ },
184
+ d.key
185
+ ));
186
+ }, ie = ({
187
+ ...e
188
+ }) => {
189
+ const { totalBranches: a } = p();
190
+ return a <= 1 ? null : /* @__PURE__ */ t(
191
+ D,
192
+ {
193
+ "data-slot": "message-branch-selector",
194
+ className: "[&>*:not(:first-child)]:rounded-l-md [&>*:not(:last-child)]:rounded-r-md",
195
+ orientation: "horizontal",
196
+ ...e
197
+ }
198
+ );
199
+ }, be = ({
200
+ children: e,
201
+ ...a
202
+ }) => {
203
+ const { goToPrevious: o, totalBranches: r } = p();
204
+ return /* @__PURE__ */ t(
205
+ g,
206
+ {
207
+ "data-slot": "message-branch-previous",
208
+ "aria-label": "Previous branch",
209
+ disabled: r <= 1,
210
+ onClick: o,
211
+ size: "icon-sm",
212
+ type: "button",
213
+ variant: "ghost",
214
+ ...a,
215
+ children: e ?? /* @__PURE__ */ t(S, { size: 14 })
216
+ }
217
+ );
218
+ }, ue = ({
219
+ children: e,
220
+ ...a
221
+ }) => {
222
+ const { goToNext: o, totalBranches: r } = p();
223
+ return /* @__PURE__ */ t(
224
+ g,
225
+ {
226
+ "data-slot": "message-branch-next",
227
+ "aria-label": "Next branch",
228
+ disabled: r <= 1,
229
+ onClick: o,
230
+ size: "icon-sm",
231
+ type: "button",
232
+ variant: "ghost",
233
+ ...a,
234
+ children: e ?? /* @__PURE__ */ t(E, { size: 14 })
235
+ }
236
+ );
237
+ }, ge = ({
238
+ className: e,
239
+ ...a
240
+ }) => {
241
+ const { currentBranch: o, totalBranches: r } = p();
242
+ return /* @__PURE__ */ l(
243
+ G,
244
+ {
245
+ "data-slot": "message-branch-page",
246
+ className: c(
247
+ "border-none bg-transparent text-muted-foreground shadow-none px-2",
248
+ e
249
+ ),
250
+ ...a,
251
+ children: [
252
+ o + 1,
253
+ "/",
254
+ r
255
+ ]
256
+ }
257
+ );
258
+ }, V = {
259
+ h1: ({ children: e }) => /* @__PURE__ */ t("h1", { className: "mt-0 mb-2 scroll-m-20 text-xl font-medium tracking-tightest", children: e }),
260
+ h2: ({ children: e }) => /* @__PURE__ */ t("h2", { className: "mt-4 mb-1 scroll-m-20 text-lg font-medium tracking-tightest", children: e }),
261
+ h3: ({ children: e }) => /* @__PURE__ */ t("h3", { className: "mt-4 mb-1 scroll-m-20 text-base font-medium tracking-tighter", children: e }),
262
+ h4: ({ children: e }) => /* @__PURE__ */ t("h4", { className: "mt-2 mb-0 scroll-m-20 text-sm font-medium tracking-normal", children: e }),
263
+ h5: ({ children: e }) => /* @__PURE__ */ t("h5", { className: "mt-0 mb-0 scroll-m-20 text-xs font-medium tracking-tighter", children: e }),
264
+ h6: ({ children: e }) => /* @__PURE__ */ t("h6", { className: "mt-0 mb-0 scroll-m-20 text-2xs font-medium tracking-tighter", children: e }),
265
+ p: ({ children: e }) => /* @__PURE__ */ t("p", { className: "mt-2 mb-3 text-base font-normal leading-5 tracking-tightest", children: e }),
266
+ strong: ({ children: e }) => /* @__PURE__ */ t("strong", { className: "font-medium", children: e }),
267
+ em: ({ children: e }) => /* @__PURE__ */ t("em", { className: "italic", children: e }),
268
+ b: ({ children: e }) => /* @__PURE__ */ t("b", { className: "font-medium", children: e }),
269
+ i: ({ children: e }) => /* @__PURE__ */ t("i", { className: "italic", children: e }),
270
+ ul: ({ children: e }) => /* @__PURE__ */ t("ul", { className: "ml-8.25 mb-3 pt-2 pl-0 pb-0 list-disc text-base font-normal tracking-tightest", children: e }),
271
+ ol: ({ children: e }) => /* @__PURE__ */ t("ol", { className: "ml-8.25 mb-3 pt-2 pl-0 pb-0 list-decimal text-base font-normal tracking-tightest", children: e }),
272
+ li: ({ children: e }) => /* @__PURE__ */ t("li", { className: "py-0", children: e }),
273
+ blockquote: ({ children: e }) => /* @__PURE__ */ t("blockquote", { className: "my-3 pr-2 pl-2 border-l border-l-border text-sm text-muted-foreground font-normal tracking-tight not-italic", children: e }),
274
+ hr: () => /* @__PURE__ */ t("hr", { className: "my-4 border-border" }),
275
+ a: ({ children: e, href: a, ...o }) => /* @__PURE__ */ t(
108
276
  "a",
109
277
  {
110
278
  className: "text-link-foreground no-underline hover:underline underline-offset-4",
111
- href: o,
112
- ...a,
113
- children: t
279
+ href: a,
280
+ ...o,
281
+ children: e
114
282
  }
115
283
  ),
116
- table: ({ children: t }) => /* @__PURE__ */ e(
284
+ table: ({ children: e }) => /* @__PURE__ */ t(
117
285
  "div",
118
286
  {
119
287
  className: "my-6 overflow-x-auto",
120
288
  tabIndex: 0,
121
289
  role: "group",
122
290
  "aria-label": "Atlas AI Chat Table",
123
- children: /* @__PURE__ */ e("table", { className: "w-full", children: t })
291
+ children: /* @__PURE__ */ t("table", { className: "w-full", children: e })
124
292
  }
125
293
  ),
126
- thead: ({ children: t }) => /* @__PURE__ */ e("thead", { children: t }),
127
- tbody: ({ children: t }) => /* @__PURE__ */ e("tbody", { children: t }),
128
- tr: ({ children: t }) => /* @__PURE__ */ e("tr", { className: "m-0 border-t p-0 even:bg-muted-background", children: t }),
129
- th: ({ children: t }) => /* @__PURE__ */ e("th", { className: "border px-4 py-2 text-left font-bold", children: t }),
130
- td: ({ children: t }) => /* @__PURE__ */ e("td", { className: "border px-4 py-2 text-left", children: t })
131
- }, h = i(
294
+ thead: ({ children: e }) => /* @__PURE__ */ t("thead", { children: e }),
295
+ tbody: ({ children: e }) => /* @__PURE__ */ t("tbody", { children: e }),
296
+ tr: ({ children: e }) => /* @__PURE__ */ t("tr", { className: "m-0 border-t p-0 even:bg-muted-background", children: e }),
297
+ th: ({ children: e }) => /* @__PURE__ */ t("th", { className: "border px-4 py-2 text-left font-bold", children: e }),
298
+ td: ({ children: e }) => /* @__PURE__ */ t("td", { className: "border px-4 py-2 text-left", children: e })
299
+ }, X = T(
132
300
  ({
133
- className: t,
134
- components: o,
135
- plugins: a,
301
+ className: e,
302
+ components: a,
303
+ plugins: o,
136
304
  controls: r,
137
305
  ...s
138
- }) => /* @__PURE__ */ e(
139
- p,
306
+ }) => /* @__PURE__ */ t(
307
+ R,
140
308
  {
141
309
  "data-slot": "message-response",
142
- className: d(
310
+ className: c(
143
311
  "size-full",
144
312
  // Blockquote paragraph overrides
145
313
  "[&_blockquote_p]:text-sm",
@@ -238,21 +406,139 @@ const f = {
238
406
  // First and last child margin resets
239
407
  "[&>*:first-child]:mt-0",
240
408
  "[&>*:last-child]:mb-0",
241
- t
409
+ e
242
410
  ),
243
- components: { ...f, ...o },
244
- controls: r ?? v,
245
- plugins: { ...a, mermaid: _ },
411
+ components: { ...V, ...a },
412
+ controls: r ?? W,
413
+ plugins: { ...o, mermaid: I },
246
414
  ...s
247
415
  }
248
416
  ),
249
- (t, o) => t.children === o.children
417
+ (e, a) => e.children === a.children
418
+ );
419
+ X.displayName = "MessageResponse";
420
+ function pe({
421
+ data: e,
422
+ className: a,
423
+ onRemove: o,
424
+ ...r
425
+ }) {
426
+ const s = e.filename || "", d = (e.mediaType?.startsWith("image/") && e.url ? "image" : "file") === "image", m = s || (d ? "Image" : "Attachment");
427
+ return /* @__PURE__ */ t(
428
+ "div",
429
+ {
430
+ "data-slot": "message-attachment",
431
+ className: c(
432
+ "group relative size-24 overflow-hidden rounded-lg",
433
+ a
434
+ ),
435
+ ...r,
436
+ children: d ? /* @__PURE__ */ l(h, { children: [
437
+ /* @__PURE__ */ t(
438
+ "img",
439
+ {
440
+ alt: s || "attachment",
441
+ className: "size-full object-cover",
442
+ height: 100,
443
+ src: e.url,
444
+ width: 100
445
+ }
446
+ ),
447
+ o && /* @__PURE__ */ l(
448
+ g,
449
+ {
450
+ "aria-label": "Remove attachment",
451
+ className: "absolute top-2 right-2 size-6 rounded-full bg-background/80 p-0 opacity-0 backdrop-blur-sm transition-opacity hover:bg-background group-hover:opacity-100 [&>svg]:size-3",
452
+ onClick: (i) => {
453
+ i.stopPropagation(), o();
454
+ },
455
+ type: "button",
456
+ variant: "ghost",
457
+ children: [
458
+ /* @__PURE__ */ t(f, {}),
459
+ /* @__PURE__ */ t("span", { className: "sr-only", children: "Remove" })
460
+ ]
461
+ }
462
+ )
463
+ ] }) : /* @__PURE__ */ l(h, { children: [
464
+ /* @__PURE__ */ l(x, { children: [
465
+ /* @__PURE__ */ t(
466
+ N,
467
+ {
468
+ render: /* @__PURE__ */ t("div", { className: "flex size-full shrink-0 items-center justify-center rounded-lg bg-muted-background text-muted-foreground", children: /* @__PURE__ */ t(P, { className: "size-4" }) })
469
+ }
470
+ ),
471
+ /* @__PURE__ */ t(y, { children: /* @__PURE__ */ t("p", { children: m }) })
472
+ ] }),
473
+ o && /* @__PURE__ */ l(
474
+ g,
475
+ {
476
+ "aria-label": "Remove attachment",
477
+ className: "size-6 shrink-0 rounded-full p-0 opacity-0 transition-opacity hover:bg-accent-background group-hover:opacity-100 [&>svg]:size-3",
478
+ onClick: (i) => {
479
+ i.stopPropagation(), o();
480
+ },
481
+ type: "button",
482
+ variant: "ghost",
483
+ children: [
484
+ /* @__PURE__ */ t(f, {}),
485
+ /* @__PURE__ */ t("span", { className: "sr-only", children: "Remove" })
486
+ ]
487
+ }
488
+ )
489
+ ] })
490
+ }
491
+ );
492
+ }
493
+ function he({
494
+ children: e,
495
+ className: a,
496
+ ...o
497
+ }) {
498
+ return e ? /* @__PURE__ */ t(
499
+ "div",
500
+ {
501
+ "data-slot": "message-attachments",
502
+ className: c(
503
+ "ml-auto flex w-fit flex-wrap items-start gap-2",
504
+ a
505
+ ),
506
+ ...o,
507
+ children: e
508
+ }
509
+ ) : null;
510
+ }
511
+ const _e = ({
512
+ className: e,
513
+ children: a,
514
+ ...o
515
+ }) => /* @__PURE__ */ t(
516
+ "div",
517
+ {
518
+ "data-slot": "message-toolbar",
519
+ className: c(
520
+ "mt-4 flex w-full items-center justify-between gap-4",
521
+ e
522
+ ),
523
+ ...o,
524
+ children: a
525
+ }
250
526
  );
251
- h.displayName = "MessageResponse";
252
527
  export {
253
- R as Message,
254
- O as MessageAction,
255
- q as MessageActions,
256
- j as MessageContent,
257
- h as MessageResponse
528
+ oe as Message,
529
+ ce as MessageAction,
530
+ ne as MessageActions,
531
+ pe as MessageAttachment,
532
+ he as MessageAttachments,
533
+ de as MessageAvatar,
534
+ se as MessageAvatarIcon,
535
+ me as MessageBranch,
536
+ le as MessageBranchContent,
537
+ ue as MessageBranchNext,
538
+ ge as MessageBranchPage,
539
+ be as MessageBranchPrevious,
540
+ ie as MessageBranchSelector,
541
+ re as MessageContent,
542
+ X as MessageResponse,
543
+ _e as MessageToolbar
258
544
  };
@@ -1,11 +1,12 @@
1
1
  import { jsx as i, jsxs as L } from "react/jsx-runtime";
2
2
  import { forwardRef as r } from "react";
3
- import { IconDots as I, IconChevronsLeft as w, IconChevronsRight as C, IconChevronRight as T, IconChevronLeft as B } from "@tabler/icons-react";
3
+ import { IconChevronsLeft as I, IconChevronLeft as w, IconChevronRight as C, IconChevronsRight as T, IconDots as B } from "@tabler/icons-react";
4
4
  import { cva as x } from "class-variance-authority";
5
5
  import { cn as l } from "../../../../lib/utils.js";
6
6
  import { Button as z } from "../button/button.js";
7
7
  import { SelectTrigger as _ } from "../select/select.js";
8
8
  import { PaginationSizeContext as k, usePaginationSize as g } from "./pagination-size-context.js";
9
+ import { PaginationTeleport as ra } from "./pagination-teleport.js";
9
10
  const y = x(
10
11
  "text-base font-normal leading-5 tracking-tightest text-secondary-foreground hover:bg-active-muted-background-hover hover:text-active-foreground focus-visible:bg-active-muted-background focus-visible:text-active-foreground focus-visible:shadow-focus-ring",
11
12
  {
@@ -224,7 +225,7 @@ const Z = r(({ className: a, size: t, label: e = "Go to first page", ...n }, o)
224
225
  ref: o,
225
226
  dataSlot: "pagination-first",
226
227
  ariaLabel: e,
227
- icon: /* @__PURE__ */ i(w, {}),
228
+ icon: /* @__PURE__ */ i(I, {}),
228
229
  className: a,
229
230
  size: t,
230
231
  ...n
@@ -237,7 +238,7 @@ const K = r(({ className: a, size: t, label: e = "Go to previous page", ...n },
237
238
  ref: o,
238
239
  dataSlot: "pagination-previous",
239
240
  ariaLabel: e,
240
- icon: /* @__PURE__ */ i(B, {}),
241
+ icon: /* @__PURE__ */ i(w, {}),
241
242
  className: a,
242
243
  size: t,
243
244
  ...n
@@ -250,7 +251,7 @@ const M = r(({ className: a, size: t, label: e = "Go to next page", ...n }, o) =
250
251
  ref: o,
251
252
  dataSlot: "pagination-next",
252
253
  ariaLabel: e,
253
- icon: /* @__PURE__ */ i(T, {}),
254
+ icon: /* @__PURE__ */ i(C, {}),
254
255
  className: a,
255
256
  size: t,
256
257
  ...n
@@ -263,7 +264,7 @@ const U = r(({ className: a, size: t, label: e = "Go to last page", ...n }, o) =
263
264
  ref: o,
264
265
  dataSlot: "pagination-last",
265
266
  ariaLabel: e,
266
- icon: /* @__PURE__ */ i(C, {}),
267
+ icon: /* @__PURE__ */ i(T, {}),
267
268
  className: a,
268
269
  size: t,
269
270
  ...n
@@ -284,7 +285,7 @@ const X = r(({ className: a, size: t, label: e = "More pages", ...n }, o) => {
284
285
  ),
285
286
  ...n,
286
287
  children: [
287
- /* @__PURE__ */ i(I, { "aria-hidden": "true", className: "h-4 w-4" }),
288
+ /* @__PURE__ */ i(B, { "aria-hidden": "true", className: "h-4 w-4" }),
288
289
  /* @__PURE__ */ i("span", { className: "sr-only", children: e })
289
290
  ]
290
291
  }
@@ -331,5 +332,6 @@ export {
331
332
  q as PaginationResultsPerPage,
332
333
  J as PaginationResultsPerPageLabel,
333
334
  O as PaginationSelectTrigger,
334
- H as PaginationStatus
335
+ H as PaginationStatus,
336
+ ra as PaginationTeleport
335
337
  };