@epam/ai-dial-attachment-input 0.0.0-dev.0 → 1.0.0-dev.459

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 (5) hide show
  1. package/components/AttachmentCard/AttachmentCard.d.ts.map +1 -1
  2. package/index.js +182 -170
  3. package/models/AttachmentCard.d.ts +2 -0
  4. package/models/AttachmentCard.d.ts.map +1 -1
  5. package/package.json +9 -3
package/components/AttachmentCard/AttachmentCard.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"AttachmentCard.d.ts","sourceRoot":"","sources":["../../../src/components/AttachmentCard/AttachmentCard.tsx"],"names":[],"mappings":"AAoBA,OAAO,EAAE,KAAK,EAAE,EAAgD,MAAM,OAAO,CAAC;AAK9E,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,6BAA6B,CAAC;AAKvE,eAAO,MAAM,cAAc,EAAE,EAAE,CAAC,mBAAmB,CA6TlD,CAAC"}
1
+ {"version":3,"file":"AttachmentCard.d.ts","sourceRoot":"","sources":["../../../src/components/AttachmentCard/AttachmentCard.tsx"],"names":[],"mappings":"AAqBA,OAAO,EAAE,KAAK,EAAE,EAAgD,MAAM,OAAO,CAAC;AAK9E,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,6BAA6B,CAAC;AAKvE,eAAO,MAAM,cAAc,EAAE,EAAE,CAAC,mBAAmB,CAsVlD,CAAC"}
package/index.js CHANGED
@@ -1,16 +1,16 @@
1
- import { AttachmentErrorReason as e, AttachmentType as t, MIME_TYPE_EXT_MAP as n, RequestStatus as r, buildCssVars as i, mergeClasses as a } from "@epam/ai-dial-chat-shared";
2
- import { DIAL_ICON_SIZE as o, DialGhostIconButton as s, DialSkeleton as c, DialSkeletonVariant as l, DialSpinner as u, ElementSize as d } from "@epam/ai-dial-ui-kit";
3
- import { IconClipboard as f, IconDownload as p, IconFile as m, IconFileDescription as h, IconFileTypeBmp as g, IconFileTypeCss as _, IconFileTypeCsv as v, IconFileTypeDoc as ee, IconFileTypeDocx as y, IconFileTypeHtml as b, IconFileTypeJpg as x, IconFileTypeJs as S, IconFileTypeJsx as C, IconFileTypePdf as w, IconFileTypePhp as T, IconFileTypePng as E, IconFileTypePpt as D, IconFileTypeRs as O, IconFileTypeSql as k, IconFileTypeSvg as A, IconFileTypeTs as j, IconFileTypeTsx as M, IconFileTypeTxt as N, IconFileTypeVue as P, IconFileTypeXls as F, IconFileTypeXml as I, IconFileTypeZip as te, IconFileX as L, IconMusic as R, IconPhoto as z, IconReload as ne, IconTerminal2 as B, IconVideo as V, IconX as re } from "@tabler/icons-react";
4
- import { useCallback as H, useEffect as U, useMemo as ie, useRef as W, useState as G } from "react";
5
- import { Fragment as K, jsx as q, jsxs as J } from "react/jsx-runtime";
1
+ import { AttachmentErrorReason as e, AttachmentType as t, Highlight as n, MIME_TYPE_EXT_MAP as r, RequestStatus as i, buildCssVars as a, mergeClasses as o } from "@epam/ai-dial-chat-shared";
2
+ import { DIAL_ICON_SIZE as s, DialGhostIconButton as c, DialSkeleton as l, DialSkeletonVariant as u, DialSpinner as d, ElementSize as f } from "@epam/ai-dial-ui-kit";
3
+ import { IconClipboard as p, IconDownload as ee, IconFile as m, IconFileDescription as h, IconFileTypeBmp as g, IconFileTypeCss as _, IconFileTypeCsv as v, IconFileTypeDoc as te, IconFileTypeDocx as ne, IconFileTypeHtml as y, IconFileTypeJpg as b, IconFileTypeJs as x, IconFileTypeJsx as S, IconFileTypePdf as C, IconFileTypePhp as w, IconFileTypePng as T, IconFileTypePpt as E, IconFileTypeRs as D, IconFileTypeSql as O, IconFileTypeSvg as k, IconFileTypeTs as A, IconFileTypeTsx as j, IconFileTypeTxt as M, IconFileTypeVue as N, IconFileTypeXls as P, IconFileTypeXml as F, IconFileTypeZip as re, IconFileX as ie, IconMusic as I, IconPhoto as L, IconReload as ae, IconTerminal2 as R, IconVideo as z, IconX as oe } from "@tabler/icons-react";
4
+ import { useCallback as B, useEffect as V, useMemo as se, useRef as H, useState as U } from "react";
5
+ import { Fragment as W, jsx as G, jsxs as K } from "react/jsx-runtime";
6
6
  //#region src/hooks/useLazyImageLoad.ts
7
- var Y = /* @__PURE__ */ function(e) {
7
+ var q = /* @__PURE__ */ function(e) {
8
8
  return e.Idle = "idle", e.Loading = "loading", e.Loaded = "loaded", e.Error = "error", e;
9
- }({}), ae = ({ enabled: e, src: t }) => {
10
- let n = W(null), [r, i] = G("idle");
11
- return U(() => {
9
+ }({}), ce = ({ enabled: e, src: t }) => {
10
+ let n = H(null), [r, i] = U("idle");
11
+ return V(() => {
12
12
  i(e && t ? "loading" : "idle");
13
- }, [e, t]), U(() => {
13
+ }, [e, t]), V(() => {
14
14
  let r = n.current;
15
15
  if (!r || !e || !t) return;
16
16
  let a = () => i("loaded"), o = () => i("error");
@@ -21,7 +21,7 @@ var Y = /* @__PURE__ */ function(e) {
21
21
  imageRef: n,
22
22
  imageLoadStatus: r
23
23
  };
24
- }, X = {
24
+ }, J = {
25
25
  card: "_card_11tpd_1",
26
26
  cardError: "_cardError_11tpd_6",
27
27
  cardSelected: "_cardSelected_11tpd_10",
@@ -32,311 +32,323 @@ var Y = /* @__PURE__ */ function(e) {
32
32
  loadingOverlay: "_loadingOverlay_11tpd_28",
33
33
  actionBtn: "_actionBtn_11tpd_32",
34
34
  removeBtnImage: "_removeBtnImage_11tpd_43"
35
- }, Z = (e) => {
35
+ }, Y = (e) => {
36
36
  if (!e) return m;
37
37
  if (e.startsWith("image/")) switch (e) {
38
38
  case "image/jpeg":
39
- case "image/jpg": return x;
40
- case "image/png": return E;
41
- case "image/svg+xml": return A;
39
+ case "image/jpg": return b;
40
+ case "image/png": return T;
41
+ case "image/svg+xml": return k;
42
42
  case "image/bmp": return g;
43
- default: return z;
43
+ default: return L;
44
44
  }
45
- if (e.startsWith("video/")) return V;
46
- if (e.startsWith("audio/")) return R;
45
+ if (e.startsWith("video/")) return z;
46
+ if (e.startsWith("audio/")) return I;
47
47
  switch (e) {
48
- case "application/pdf": return w;
48
+ case "application/pdf": return C;
49
49
  case "application/msword":
50
- case "application/vnd.ms-word": return ee;
51
- case "application/vnd.openxmlformats-officedocument.wordprocessingml.document": return y;
52
- case "application/vnd.ms-powerpoint": return D;
53
- case "application/vnd.openxmlformats-officedocument.presentationml.presentation": return D;
54
- case "application/vnd.ms-excel": return F;
55
- case "application/vnd.openxmlformats-officedocument.spreadsheetml.sheet": return F;
50
+ case "application/vnd.ms-word": return te;
51
+ case "application/vnd.openxmlformats-officedocument.wordprocessingml.document": return ne;
52
+ case "application/vnd.ms-powerpoint": return E;
53
+ case "application/vnd.openxmlformats-officedocument.presentationml.presentation": return E;
54
+ case "application/vnd.ms-excel": return P;
55
+ case "application/vnd.openxmlformats-officedocument.spreadsheetml.sheet": return P;
56
56
  case "application/zip":
57
57
  case "application/x-zip-compressed":
58
58
  case "application/x-rar-compressed":
59
59
  case "application/x-7z-compressed":
60
60
  case "application/gzip":
61
- case "application/x-tar": return te;
61
+ case "application/x-tar": return re;
62
62
  case "text/csv": return v;
63
- case "text/plain": return N;
63
+ case "text/plain": return M;
64
64
  case "text/html":
65
- case "application/xhtml+xml": return b;
65
+ case "application/xhtml+xml": return y;
66
66
  case "text/xml":
67
- case "application/xml": return I;
67
+ case "application/xml": return F;
68
68
  case "application/sql":
69
- case "text/x-sql": return k;
69
+ case "text/x-sql": return O;
70
70
  case "text/javascript":
71
- case "application/javascript": return S;
72
- case "text/jsx": return C;
71
+ case "application/javascript": return x;
72
+ case "text/jsx": return S;
73
73
  case "application/typescript":
74
- case "text/typescript": return j;
75
- case "text/tsx": return M;
74
+ case "text/typescript": return A;
75
+ case "text/tsx": return j;
76
76
  case "text/css": return _;
77
77
  case "text/x-php":
78
- case "application/x-php": return T;
78
+ case "application/x-php": return w;
79
79
  case "text/x-rustsrc":
80
- case "application/x-rust": return O;
81
- case "text/x-vue": return P;
80
+ case "application/x-rust": return D;
81
+ case "text/x-vue": return N;
82
82
  default: return m;
83
83
  }
84
- }, Q = (e) => {
84
+ }, X = (e) => {
85
85
  let { type: n, contentType: r } = e;
86
- return n === t.Prompt ? B : n === t.Pasted ? f : n === t.Image ? z : Z(r ?? "");
87
- }, oe = (e) => {
88
- let t = e.toLowerCase().split(";")[0].trim(), r = n[t];
89
- if (r) return r;
86
+ return n === t.Prompt ? R : n === t.Pasted ? p : n === t.Image ? L : Y(r ?? "");
87
+ }, Z = (e) => {
88
+ let t = e.toLowerCase().split(";")[0].trim(), n = r[t];
89
+ if (n) return n;
90
90
  let i = t.split("/")[1];
91
91
  if (i && !i.startsWith("vnd.") && !i.includes("+")) return i;
92
- }, se = (e) => {
92
+ }, le = (e) => {
93
93
  let { type: n, name: r, contentType: i } = e;
94
94
  if (n === t.Prompt) return "Prompt";
95
95
  if (n === t.Pasted) return "Pasted";
96
96
  if (n === t.Image) return "Image";
97
97
  if (i) {
98
- let e = oe(i);
98
+ let e = Z(i);
99
99
  if (e) return `.${e}`;
100
100
  }
101
101
  let a = r.lastIndexOf(".");
102
102
  return a > 0 && a < r.length - 1 ? `.${r.slice(a + 1).toLowerCase()}` : r;
103
- }, ce = (e, n, i) => {
104
- let { type: o, status: s, previewUrl: c, url: l } = e, u = s === r.Loading, d = s === r.Error, f = o === t.Image && !!(c ?? l) && !d, p = o === t.Audio && !d, m = a(X.card, d && X.cardError, n && X.cardSelected, !d && !n && o === t.Prompt && X.cardPrompt, !d && !n && o === t.Pasted && X.cardPasted);
103
+ }, ue = (e, n, r) => {
104
+ let { type: a, status: s, previewUrl: c, url: l } = e, u = s === i.Loading, d = s === i.Error, f = a === t.Image && !!(c ?? l) && !d, p = a === t.Audio && !d, ee = o(J.card, d && J.cardError, n && J.cardSelected, !d && !n && a === t.Prompt && J.cardPrompt, !d && !n && a === t.Pasted && J.cardPasted);
105
105
  return {
106
106
  isLoading: u,
107
107
  isError: d,
108
108
  isImage: f,
109
109
  isAudio: p,
110
- areActionsVisible: d || i,
111
- BottomIcon: Q(e),
112
- typeLabel: se(e),
113
- cardColorClass: m,
114
- removeBtnClass: f ? X.removeBtnImage : X.actionBtn
110
+ areActionsVisible: d || r,
111
+ BottomIcon: X(e),
112
+ typeLabel: le(e),
113
+ cardColorClass: ee,
114
+ removeBtnClass: f ? J.removeBtnImage : J.actionBtn
115
115
  };
116
- }, le = (e) => {
116
+ }, Q = (e) => {
117
117
  let t = e.lastIndexOf(".");
118
118
  return t > 0 ? e.slice(0, t) : e;
119
- }, ue = ({ attachment: n, onRemove: r, onRetry: f, onExpand: m, onClick: h, isSelected: g, shouldAlwaysShowActions: _, removeLabel: v = "Remove attachment", retryLabel: ee = "Retry upload", clickLabel: y = "Open attachment", colors: b, typography: x, roundedClassName: S = "rounded", className: C }) => {
120
- let { id: w, name: T } = n, E = n.previewUrl ?? n.url, D = n.type === t.Pasted, O = D && m !== void 0, k = h !== void 0 && !O, A = O || k, j = ie(() => D ? T : le(T), [D, T]), M = i({
119
+ }, de = ({ attachment: r, searchQuery: i = "", onRemove: p, onRetry: m, onExpand: h, onClick: g, isSelected: _, shouldAlwaysShowActions: v, removeLabel: te = "Remove attachment", retryLabel: ne = "Retry upload", clickLabel: y = "Open attachment", colors: b, typography: x, roundedClassName: S = "rounded", className: C }) => {
120
+ let { id: w, name: T } = r, E = r.previewUrl ?? r.url, D = r.type === t.Pasted, O = D && h !== void 0, k = g !== void 0 && !O, A = O || k, j = se(() => D ? T : Q(T), [D, T]), M = a({
121
121
  "--ci-card-border": b?.border,
122
122
  "--ci-card-bg": b?.background,
123
123
  "--ci-card-name": b?.nameText,
124
124
  "--ci-card-meta": b?.metaText
125
- }), { isLoading: N, isError: P, isImage: F, isAudio: I, areActionsVisible: te, BottomIcon: L, typeLabel: R, cardColorClass: B, removeBtnClass: V } = ie(() => ce(n, g ?? !1, _ ?? !1), [
126
- n,
127
- g,
128
- _
129
- ]), { imageRef: H, imageLoadStatus: U } = ae({
125
+ }), { isLoading: N, isError: P, isImage: F, isAudio: re, areActionsVisible: ie, BottomIcon: I, typeLabel: R, cardColorClass: z, removeBtnClass: B } = se(() => ue(r, _ ?? !1, v ?? !1), [
126
+ r,
127
+ _,
128
+ v
129
+ ]), { imageRef: V, imageLoadStatus: H } = ce({
130
130
  enabled: F,
131
131
  src: E
132
- }), W = () => {
133
- O && m ? m(w) : k && h && h(w);
134
- }, G = (e) => {
135
- (e.key === "Enter" || e.key === " ") && (e.preventDefault(), W());
132
+ }), U = () => {
133
+ O && h ? h(w) : k && g && g(w);
134
+ }, Y = (e) => {
135
+ (e.key === "Enter" || e.key === " ") && (e.preventDefault(), U());
136
136
  };
137
- if (I) return /* @__PURE__ */ J("div", {
137
+ if (re) return /* @__PURE__ */ K("div", {
138
138
  style: M,
139
- className: a("group flex w-full min-w-[280px] max-w-[300px] flex-col gap-2 border p-3", S, B, C),
140
- children: [/* @__PURE__ */ J("div", {
139
+ className: o("group flex w-full min-w-[280px] max-w-[300px] flex-col gap-2 border p-3", S, z, C),
140
+ children: [/* @__PURE__ */ K("div", {
141
141
  className: "flex items-center justify-between gap-2",
142
- children: [/* @__PURE__ */ q("span", {
143
- title: n.name,
144
- className: a(x?.fontClassName ?? "dial-tiny-text", "min-w-0 truncate", X.name),
145
- children: n.name
146
- }), h && /* @__PURE__ */ q(s, {
147
- icon: /* @__PURE__ */ q(p, {
148
- size: o.SM,
142
+ children: [/* @__PURE__ */ G("span", {
143
+ title: r.name,
144
+ className: o(x?.fontClassName ?? "dial-tiny-text", "min-w-0 truncate", J.name),
145
+ children: i ? /* @__PURE__ */ G(n, {
146
+ text: r.name,
147
+ query: i,
148
+ maxLines: 1
149
+ }) : r.name
150
+ }), g && /* @__PURE__ */ G(c, {
151
+ icon: /* @__PURE__ */ G(ee, {
152
+ size: s.SM,
149
153
  "aria-hidden": !0
150
154
  }),
151
- size: d.Small,
152
- className: a("h-6 w-6 shrink-0 rounded", V),
155
+ size: f.Small,
156
+ className: o("h-6 w-6 shrink-0 rounded", B),
153
157
  "aria-label": y,
154
158
  onClick: (e) => {
155
- e.stopPropagation(), h(w);
159
+ e.stopPropagation(), g(w);
156
160
  }
157
161
  })]
158
- }), n.playUrl && /* @__PURE__ */ q("audio", {
162
+ }), r.playUrl && /* @__PURE__ */ G("audio", {
159
163
  controls: !0,
160
- src: n.playUrl,
164
+ src: r.playUrl,
161
165
  className: "w-full",
162
166
  preload: "metadata"
163
167
  })]
164
168
  });
165
- let Z = a("group relative flex h-[100px] w-[100px] flex-shrink-0 border focus-within:outline focus-within:outline-1 focus-within:outline-offset-1", S, B, !F && "flex-col gap-3 p-3", A && "cursor-pointer", C), Q = /* @__PURE__ */ J(K, { children: [
166
- F ? /* @__PURE__ */ J("div", {
169
+ let X = o("group relative flex h-[100px] w-[100px] flex-shrink-0 border focus-within:outline focus-within:outline-1 focus-within:outline-offset-1", S, z, !F && "flex-col gap-3 p-3", A && "cursor-pointer", C), Z = /* @__PURE__ */ K(W, { children: [
170
+ F ? /* @__PURE__ */ K("div", {
167
171
  className: "relative h-full w-full overflow-hidden",
168
- children: [U !== Y.Loaded && /* @__PURE__ */ q(c, {
169
- variant: l.Rectangular,
172
+ children: [H !== q.Loaded && /* @__PURE__ */ G(l, {
173
+ variant: u.Rectangular,
170
174
  width: "100%",
171
175
  height: "100%",
172
- active: U === Y.Loading,
173
- overlay: /* @__PURE__ */ q(z, {
174
- size: o.LG,
176
+ active: H === q.Loading,
177
+ overlay: /* @__PURE__ */ G(L, {
178
+ size: s.LG,
175
179
  className: x?.placeholderIconClassName ?? "text-secondary",
176
180
  "aria-hidden": !0
177
181
  }),
178
- className: a("absolute inset-0", S)
179
- }), /* @__PURE__ */ q("img", {
180
- ref: H,
182
+ className: o("absolute inset-0", S)
183
+ }), /* @__PURE__ */ G("img", {
184
+ ref: V,
181
185
  src: E,
182
186
  alt: T,
183
187
  loading: "lazy",
184
188
  decoding: "async",
185
- className: a("h-full w-full object-cover transition-opacity duration-200", U === Y.Loaded ? "opacity-100" : "opacity-0", S)
189
+ className: o("h-full w-full object-cover transition-opacity duration-200", H === q.Loaded ? "opacity-100" : "opacity-0", S)
186
190
  })]
187
- }) : P ? /* @__PURE__ */ J(K, { children: [/* @__PURE__ */ J("div", {
191
+ }) : P ? /* @__PURE__ */ K(W, { children: [/* @__PURE__ */ K("div", {
188
192
  className: "flex flex-row items-center gap-1 overflow-hidden",
189
- children: [/* @__PURE__ */ q(L, {
190
- size: o.SM,
191
- className: a("shrink-0", X.meta),
193
+ children: [/* @__PURE__ */ G(I, {
194
+ size: s.SM,
195
+ className: o("shrink-0", J.meta),
192
196
  "aria-hidden": !0
193
- }), /* @__PURE__ */ q("span", {
197
+ }), /* @__PURE__ */ G("span", {
194
198
  title: R,
195
- className: a(x?.metaClassName ?? "dial-tiny-text", "min-w-0 truncate", X.meta),
199
+ className: o(x?.metaClassName ?? "dial-tiny-text", "min-w-0 truncate", J.meta),
196
200
  children: R
197
201
  })]
198
- }), /* @__PURE__ */ q("div", {
202
+ }), /* @__PURE__ */ G("div", {
199
203
  className: "min-w-0 flex-1",
200
- children: /* @__PURE__ */ q("div", {
204
+ children: /* @__PURE__ */ G("div", {
201
205
  title: j,
202
- className: a(x?.fontClassName ?? "dial-tiny-text", "line-clamp-3 break-words", X.name),
203
- children: j
206
+ className: o(x?.fontClassName ?? "dial-tiny-text", "line-clamp-3 break-words", J.name),
207
+ children: i ? /* @__PURE__ */ G(n, {
208
+ text: j,
209
+ query: i,
210
+ maxLines: 3
211
+ }) : j
204
212
  })
205
- })] }) : /* @__PURE__ */ J(K, { children: [/* @__PURE__ */ q("div", {
213
+ })] }) : /* @__PURE__ */ K(W, { children: [/* @__PURE__ */ G("div", {
206
214
  className: "min-w-0 flex-1",
207
- children: /* @__PURE__ */ q("div", {
215
+ children: /* @__PURE__ */ G("div", {
208
216
  title: j,
209
- className: a(x?.fontClassName ?? "dial-tiny-text", "line-clamp-3 break-words", X.name),
210
- children: j
217
+ className: o(x?.fontClassName ?? "dial-tiny-text", "line-clamp-3 break-words", J.name),
218
+ children: i ? /* @__PURE__ */ G(n, {
219
+ text: j,
220
+ query: i,
221
+ maxLines: 3
222
+ }) : j
211
223
  })
212
- }), /* @__PURE__ */ J("div", {
224
+ }), /* @__PURE__ */ K("div", {
213
225
  className: "flex flex-row items-center gap-1 overflow-hidden",
214
- children: [/* @__PURE__ */ q(L, {
215
- size: o.SM,
216
- className: a("shrink-0", X.meta),
226
+ children: [/* @__PURE__ */ G(I, {
227
+ size: s.SM,
228
+ className: o("shrink-0", J.meta),
217
229
  "aria-hidden": !0
218
- }), /* @__PURE__ */ q("span", {
230
+ }), /* @__PURE__ */ G("span", {
219
231
  title: R,
220
- className: a(x?.metaClassName ?? "dial-tiny-text", "min-w-0 truncate", X.meta),
232
+ className: o(x?.metaClassName ?? "dial-tiny-text", "min-w-0 truncate", J.meta),
221
233
  children: R
222
234
  })]
223
235
  })] }),
224
- N && /* @__PURE__ */ q("span", {
225
- className: a("absolute inset-0 flex items-center justify-center", S, X.loadingOverlay),
226
- children: /* @__PURE__ */ q(u, {
236
+ N && /* @__PURE__ */ G("span", {
237
+ className: o("absolute inset-0 flex items-center justify-center", S, J.loadingOverlay),
238
+ children: /* @__PURE__ */ G(d, {
227
239
  size: 40,
228
240
  ariaLabel: "Loading attachment",
229
241
  className: "z-50"
230
242
  })
231
243
  }),
232
- !N && /* @__PURE__ */ J("div", {
233
- className: a("absolute end-1 top-1 flex gap-1 transition-opacity", te ? "opacity-100" : "opacity-0 group-focus-within:opacity-100 group-hover:opacity-100 mobile:opacity-100"),
234
- children: [P && f && n.errorReason !== e.UnsupportedType && /* @__PURE__ */ q(s, {
235
- icon: /* @__PURE__ */ q(ne, {
236
- size: o.SM,
244
+ !N && /* @__PURE__ */ K("div", {
245
+ className: o("absolute end-1 top-1 flex gap-1 transition-opacity", ie ? "opacity-100" : "opacity-0 group-focus-within:opacity-100 group-hover:opacity-100 mobile:opacity-100"),
246
+ children: [P && m && r.errorReason !== e.UnsupportedType && /* @__PURE__ */ G(c, {
247
+ icon: /* @__PURE__ */ G(ae, {
248
+ size: s.SM,
237
249
  "aria-hidden": !0
238
250
  }),
239
- size: d.Small,
240
- className: a("h-6 w-6 rounded", V),
241
- "aria-label": ee,
251
+ size: f.Small,
252
+ className: o("h-6 w-6 rounded", B),
253
+ "aria-label": ne,
242
254
  onClick: (e) => {
243
- e.stopPropagation(), f(w);
255
+ e.stopPropagation(), m(w);
244
256
  }
245
- }), r && /* @__PURE__ */ q(s, {
246
- icon: /* @__PURE__ */ q(re, {
247
- size: o.SM,
257
+ }), p && /* @__PURE__ */ G(c, {
258
+ icon: /* @__PURE__ */ G(oe, {
259
+ size: s.SM,
248
260
  "aria-hidden": !0
249
261
  }),
250
- size: d.Small,
251
- className: a("h-6 w-6 rounded", V),
252
- "aria-label": v,
262
+ size: f.Small,
263
+ className: o("h-6 w-6 rounded", B),
264
+ "aria-label": te,
253
265
  onClick: (e) => {
254
- e.stopPropagation(), r?.(w);
266
+ e.stopPropagation(), p?.(w);
255
267
  }
256
268
  })]
257
269
  })
258
270
  ] });
259
- return A ? /* @__PURE__ */ q("div", {
271
+ return A ? /* @__PURE__ */ G("div", {
260
272
  style: M,
261
- className: Z,
262
- onClick: W,
263
- onKeyDown: G,
273
+ className: X,
274
+ onClick: U,
275
+ onKeyDown: Y,
264
276
  tabIndex: 0,
265
277
  role: "button",
266
278
  "aria-label": k ? y : void 0,
267
- children: Q
268
- }) : /* @__PURE__ */ q("div", {
279
+ children: Z
280
+ }) : /* @__PURE__ */ G("div", {
269
281
  style: M,
270
- className: Z,
271
- children: Q
282
+ className: X,
283
+ children: Z
272
284
  });
273
- }, de = ({ attachments: e, onRemove: t, onRetry: n, onExpand: r, ariaLabel: i = "Attached files", removeLabel: o, retryLabel: s, onAttachmentClick: c, clickLabel: l, className: u }) => e.length === 0 ? null : /* @__PURE__ */ q("div", {
285
+ }, fe = ({ attachments: e, onRemove: t, onRetry: n, onExpand: r, ariaLabel: i = "Attached files", removeLabel: a, retryLabel: s, onAttachmentClick: c, clickLabel: l, className: u }) => e.length === 0 ? null : /* @__PURE__ */ G("div", {
274
286
  role: "list",
275
287
  "aria-label": i,
276
- className: a("flex w-full min-w-0 gap-2 overflow-x-auto", u),
277
- children: e.map((e) => /* @__PURE__ */ q("div", {
288
+ className: o("flex w-full min-w-0 gap-2 overflow-x-auto", u),
289
+ children: e.map((e) => /* @__PURE__ */ G("div", {
278
290
  role: "listitem",
279
- children: /* @__PURE__ */ q(ue, {
291
+ children: /* @__PURE__ */ G(de, {
280
292
  attachment: e,
281
293
  onRemove: t,
282
294
  onRetry: n,
283
295
  onExpand: r,
284
- removeLabel: o,
296
+ removeLabel: a,
285
297
  retryLabel: s,
286
298
  onClick: c ? () => c(e) : void 0,
287
299
  clickLabel: l
288
300
  })
289
301
  }, e.id))
290
- }), fe = ({ isVisible: e, isAttachmentsAllowed: t = !0, title: n, subtitle: r, iconClassName: i = "text-accent-primary", deniedIconClassName: o = "text-error", titleClassName: s = "heading-3 font-semibold", subtitleClassName: c = "dial-small-text" }) => {
302
+ }), pe = ({ isVisible: e, isAttachmentsAllowed: t = !0, title: n, subtitle: r, iconClassName: i = "text-accent-primary", deniedIconClassName: a = "text-error", titleClassName: s = "heading-3 font-semibold", subtitleClassName: c = "dial-small-text" }) => {
291
303
  if (!e) return null;
292
- let l = n ?? (t ? "Attach files" : "No attachments allowed"), u = r ?? (t ? "Drop files here to attach them to message" : "Attachments can't be added to message"), d = t ? i : o, f = (e) => {
304
+ let l = n ?? (t ? "Attach files" : "No attachments allowed"), u = r ?? (t ? "Drop files here to attach them to message" : "Attachments can't be added to message"), d = t ? i : a, f = (e) => {
293
305
  e.preventDefault();
294
- }, p = t ? h : L;
295
- return /* @__PURE__ */ q("div", {
296
- className: a("fixed inset-0 z-[9999] flex items-center justify-center bg-blackout backdrop-blur-sm", t ? "pointer-events-none" : "pointer-events-auto cursor-not-allowed"),
306
+ }, p = t ? h : ie;
307
+ return /* @__PURE__ */ G("div", {
308
+ className: o("fixed inset-0 z-[9999] flex items-center justify-center bg-blackout backdrop-blur-sm", t ? "pointer-events-none" : "pointer-events-auto cursor-not-allowed"),
297
309
  onDragOver: t ? void 0 : f,
298
310
  onDrop: t ? void 0 : f,
299
- children: /* @__PURE__ */ J("div", {
311
+ children: /* @__PURE__ */ K("div", {
300
312
  className: "flex flex-col items-center text-center",
301
313
  children: [
302
- /* @__PURE__ */ q(p, {
314
+ /* @__PURE__ */ G(p, {
303
315
  size: 100,
304
316
  className: d
305
317
  }),
306
- /* @__PURE__ */ q("span", {
307
- className: a("mt-5", s),
318
+ /* @__PURE__ */ G("span", {
319
+ className: o("mt-5", s),
308
320
  children: l
309
321
  }),
310
- /* @__PURE__ */ q("span", {
311
- className: a("mt-4", c),
322
+ /* @__PURE__ */ G("span", {
323
+ className: o("mt-4", c),
312
324
  children: u
313
325
  })
314
326
  ]
315
327
  })
316
328
  });
317
- }, $ = () => `${Date.now()}-${Math.random().toString(36).slice(2)}`, pe = (e, n) => ({ handlePaste: H((i) => {
318
- if (!i.clipboardData) return;
319
- let a = Array.from(i.clipboardData.items).filter((e) => e.kind === "file" && e.type.startsWith("image/")), o = i.clipboardData.getData("text/plain").length > 0;
329
+ }, $ = () => `${Date.now()}-${Math.random().toString(36).slice(2)}`, me = (e, n) => ({ handlePaste: B((r) => {
330
+ if (!r.clipboardData) return;
331
+ let a = Array.from(r.clipboardData.items).filter((e) => e.kind === "file" && e.type.startsWith("image/")), o = r.clipboardData.getData("text/plain").length > 0;
320
332
  if (a.length > 0 && !o) {
321
333
  let n = [];
322
334
  for (let e of a) {
323
- let i = e.getAsFile();
324
- if (!i) continue;
325
- let a = new File([i], "Screenshot.png", { type: i.type }), o = {
335
+ let r = e.getAsFile();
336
+ if (!r) continue;
337
+ let a = new File([r], "Screenshot.png", { type: r.type }), o = {
326
338
  id: $(),
327
339
  name: "Screenshot.png",
328
- contentType: i.type,
340
+ contentType: r.type,
329
341
  file: a,
330
342
  type: t.Image,
331
- status: r.Idle,
343
+ status: i.Idle,
332
344
  previewUrl: URL.createObjectURL(a)
333
345
  };
334
346
  n.push(o);
335
347
  }
336
- i.preventDefault(), e(n);
348
+ r.preventDefault(), e(n);
337
349
  return;
338
350
  }
339
- let s = i.clipboardData.getData("text/plain");
351
+ let s = r.clipboardData.getData("text/plain");
340
352
  if (s.length > n) {
341
353
  let n = s.trim(), a = (n.length > 80 ? `${n.slice(0, 80).trimEnd()}…` : n) || "Pasted text", o = new File([s], a, { type: "text/plain" }), c = {
342
354
  id: $(),
@@ -344,29 +356,29 @@ var Y = /* @__PURE__ */ function(e) {
344
356
  contentType: "text/plain",
345
357
  file: o,
346
358
  type: t.Pasted,
347
- status: r.Idle
359
+ status: i.Idle
348
360
  };
349
- i.preventDefault(), e([c]);
361
+ r.preventDefault(), e([c]);
350
362
  }
351
- }, [e, n]) }), me = {
363
+ }, [e, n]) }), he = {
352
364
  image: "Image files",
353
365
  audio: "Audio files",
354
366
  video: "Video files",
355
367
  text: "Text files"
356
- }, he = (e) => e.map((e) => {
368
+ }, ge = (e) => e.map((e) => {
357
369
  if (e.endsWith("/*")) {
358
370
  let t = e.slice(0, -2);
359
- return me[t] ?? `${t} files`;
371
+ return he[t] ?? `${t} files`;
360
372
  }
361
373
  let t = e.split("/")[1];
362
374
  return t == null ? e.toUpperCase() : t.toUpperCase();
363
- }).join(", "), ge = (e, t) => t.length === 0 ? !1 : t.some((t) => {
375
+ }).join(", "), _e = (e, t) => t.length === 0 ? !1 : t.some((t) => {
364
376
  if (t === "*" || t === "*/*") return !0;
365
377
  if (t.endsWith("/*")) {
366
378
  let n = t.slice(0, -2);
367
379
  return e.startsWith(`${n}/`);
368
380
  }
369
381
  return e === t;
370
- }), _e = 100;
382
+ }), ve = 100;
371
383
  //#endregion
372
- export { ue as AttachmentCard, de as AttachmentTray, fe as FileDndOverlay, Y as LazyImageLoadStatus, _e as MAX_UPLOADS_PER_MINUTE, $ as generateAttachmentId, ce as getAttachmentCardState, Z as getAttachmentIcon, le as getNameWithoutExtension, ge as isMimeTypeAllowed, he as mimeTypesToExtensionLabels, pe as useClipboardPaste, ae as useLazyImageLoad };
384
+ export { de as AttachmentCard, fe as AttachmentTray, pe as FileDndOverlay, q as LazyImageLoadStatus, ve as MAX_UPLOADS_PER_MINUTE, $ as generateAttachmentId, ue as getAttachmentCardState, Y as getAttachmentIcon, Q as getNameWithoutExtension, _e as isMimeTypeAllowed, ge as mimeTypesToExtensionLabels, me as useClipboardPaste, ce as useLazyImageLoad };
package/models/AttachmentCard.d.ts CHANGED
@@ -23,6 +23,8 @@ export interface AttachmentCardTypography {
23
23
  export interface AttachmentCardProps {
24
24
  /** The attachment data to display. */
25
25
  attachment: DisplayAttachment;
26
+ /** Current search query — when set, matches in the file name are highlighted. */
27
+ searchQuery?: string;
26
28
  /** Called when the user activates the remove button. */
27
29
  onRemove?: (id: string) => void;
28
30
  /** Called when the user activates the retry button (error state only). */
package/models/AttachmentCard.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"AttachmentCard.d.ts","sourceRoot":"","sources":["../../src/models/AttachmentCard.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,2BAA2B,CAAC;AAEnE,wEAAwE;AACxE,MAAM,WAAW,oBAAoB;IACnC,8CAA8C;IAC9C,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,kDAAkD;IAClD,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,4BAA4B;IAC5B,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,sCAAsC;IACtC,QAAQ,CAAC,EAAE,MAAM,CAAC;CACnB;AAED,+DAA+D;AAC/D,MAAM,WAAW,wBAAwB;IACvC,mFAAmF;IACnF,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,2GAA2G;IAC3G,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,sHAAsH;IACtH,wBAAwB,CAAC,EAAE,MAAM,CAAC;CACnC;AAED,wDAAwD;AACxD,MAAM,WAAW,mBAAmB;IAClC,sCAAsC;IACtC,UAAU,EAAE,iBAAiB,CAAC;IAC9B,wDAAwD;IACxD,QAAQ,CAAC,EAAE,CAAC,EAAE,EAAE,MAAM,KAAK,IAAI,CAAC;IAChC,0EAA0E;IAC1E,OAAO,CAAC,EAAE,CAAC,EAAE,EAAE,MAAM,KAAK,IAAI,CAAC;IAC/B,6GAA6G;IAC7G,QAAQ,CAAC,EAAE,CAAC,EAAE,EAAE,MAAM,KAAK,IAAI,CAAC;IAChC,8EAA8E;IAC9E,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,kFAAkF;IAClF,uBAAuB,CAAC,EAAE,OAAO,CAAC;IAClC,8CAA8C;IAC9C,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,gEAAgE;IAChE,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,gGAAgG;IAChG,OAAO,CAAC,EAAE,CAAC,EAAE,EAAE,MAAM,KAAK,IAAI,CAAC;IAC/B,uHAAuH;IACvH,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,wDAAwD;IACxD,MAAM,CAAC,EAAE,oBAAoB,CAAC;IAC9B,8DAA8D;IAC9D,UAAU,CAAC,EAAE,wBAAwB,CAAC;IACtC,wHAAwH;IACxH,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,wDAAwD;IACxD,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB"}
1
+ {"version":3,"file":"AttachmentCard.d.ts","sourceRoot":"","sources":["../../src/models/AttachmentCard.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,2BAA2B,CAAC;AAEnE,wEAAwE;AACxE,MAAM,WAAW,oBAAoB;IACnC,8CAA8C;IAC9C,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,kDAAkD;IAClD,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,4BAA4B;IAC5B,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,sCAAsC;IACtC,QAAQ,CAAC,EAAE,MAAM,CAAC;CACnB;AAED,+DAA+D;AAC/D,MAAM,WAAW,wBAAwB;IACvC,mFAAmF;IACnF,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,2GAA2G;IAC3G,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,sHAAsH;IACtH,wBAAwB,CAAC,EAAE,MAAM,CAAC;CACnC;AAED,wDAAwD;AACxD,MAAM,WAAW,mBAAmB;IAClC,sCAAsC;IACtC,UAAU,EAAE,iBAAiB,CAAC;IAC9B,iFAAiF;IACjF,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,wDAAwD;IACxD,QAAQ,CAAC,EAAE,CAAC,EAAE,EAAE,MAAM,KAAK,IAAI,CAAC;IAChC,0EAA0E;IAC1E,OAAO,CAAC,EAAE,CAAC,EAAE,EAAE,MAAM,KAAK,IAAI,CAAC;IAC/B,6GAA6G;IAC7G,QAAQ,CAAC,EAAE,CAAC,EAAE,EAAE,MAAM,KAAK,IAAI,CAAC;IAChC,8EAA8E;IAC9E,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,kFAAkF;IAClF,uBAAuB,CAAC,EAAE,OAAO,CAAC;IAClC,8CAA8C;IAC9C,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,gEAAgE;IAChE,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,gGAAgG;IAChG,OAAO,CAAC,EAAE,CAAC,EAAE,EAAE,MAAM,KAAK,IAAI,CAAC;IAC/B,uHAAuH;IACvH,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,wDAAwD;IACxD,MAAM,CAAC,EAAE,oBAAoB,CAAC;IAC9B,8DAA8D;IAC9D,UAAU,CAAC,EAAE,wBAAwB,CAAC;IACtC,wHAAwH;IACxH,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,wDAAwD;IACxD,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB"}
package/package.json CHANGED
@@ -1,6 +1,7 @@
1
1
  {
2
2
  "name": "@epam/ai-dial-attachment-input",
3
- "version": "0.0.0-dev.0",
3
+ "description": "File attachment input components with upload validation, drag-and-drop, and progress tracking",
4
+ "version": "1.0.0-dev.459",
4
5
  "license": "Apache-2.0",
5
6
  "type": "module",
6
7
  "main": "./index.js",
@@ -16,9 +17,14 @@
16
17
  }
17
18
  },
18
19
  "peerDependencies": {
19
- "@epam/ai-dial-chat-shared": "0.0.0-dev.0",
20
- "@epam/ai-dial-ui-kit": "0.12.0-dev.21",
20
+ "@epam/ai-dial-chat-shared": "1.0.0-dev.459",
21
+ "@epam/ai-dial-ui-kit": "0.12.0-dev.25",
21
22
  "@tabler/icons-react": "^3.44.0",
22
23
  "react": "^19.0.0"
24
+ },
25
+ "repository": {
26
+ "type": "git",
27
+ "url": "git+https://github.com/epam/ai-dial-chat.git",
28
+ "directory": "libs/attachment-input"
23
29
  }
24
30
  }