@epam/ai-dial-attachment-input 1.2.0-dev.61 → 1.2.0-dev.69
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.
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"File.d.ts","sourceRoot":"","sources":["../../../../src/components/AttachmentCard/Attachments/File.tsx"],"names":[],"mappings":"AAMA,OAAO,EACL,KAAK,EAAE,EAKR,MAAM,OAAO,CAAC;AAGf,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,qCAAqC,CAAC;
|
|
1
|
+
{"version":3,"file":"File.d.ts","sourceRoot":"","sources":["../../../../src/components/AttachmentCard/Attachments/File.tsx"],"names":[],"mappings":"AAMA,OAAO,EACL,KAAK,EAAE,EAKR,MAAM,OAAO,CAAC;AAGf,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,qCAAqC,CAAC;AAoB/E,2HAA2H;AAC3H,eAAO,MAAM,cAAc,EAAE,EAAE,CAAC,mBAAmB,CAuPlD,CAAC"}
|
package/index.js
CHANGED
|
@@ -1,10 +1,10 @@
|
|
|
1
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
2
|
import { useCallback as o, useEffect as s, useId as c, useMemo as l, useRef as u, useState as d } from "react";
|
|
3
|
-
import { IconClipboard as f, IconDownload as p, IconExternalLink as m, IconFile as h, IconFileDescription as g, IconFileTypeBmp as _, IconFileTypeCss as v, IconFileTypeCsv as y, IconFileTypeDoc as b, IconFileTypeDocx as x, IconFileTypeHtml as S, IconFileTypeJpg as C, IconFileTypeJs as w, IconFileTypeJsx as T, IconFileTypePdf as E, IconFileTypePhp as D, IconFileTypePng as O, IconFileTypePpt as k, IconFileTypeRs as A, IconFileTypeSql as j, IconFileTypeSvg as M, IconFileTypeTs as N, IconFileTypeTsx as P, IconFileTypeTxt as F, IconFileTypeVue as I, IconFileTypeXls as L, IconFileTypeXml as
|
|
4
|
-
import { DIAL_ICON_SIZE as U, DIAL_KIT_ICON_STROKE as W, ElementSize as
|
|
5
|
-
import { Fragment as
|
|
3
|
+
import { IconClipboard as f, IconDownload as p, IconExternalLink as m, IconFile as h, IconFileDescription as g, IconFileTypeBmp as _, IconFileTypeCss as v, IconFileTypeCsv as y, IconFileTypeDoc as b, IconFileTypeDocx as x, IconFileTypeHtml as S, IconFileTypeJpg as C, IconFileTypeJs as w, IconFileTypeJsx as T, IconFileTypePdf as E, IconFileTypePhp as D, IconFileTypePng as O, IconFileTypePpt as k, IconFileTypeRs as A, IconFileTypeSql as j, IconFileTypeSvg as M, IconFileTypeTs as N, IconFileTypeTsx as P, IconFileTypeTxt as F, IconFileTypeVue as I, IconFileTypeXls as L, IconFileTypeXml as R, IconFileTypeZip as ee, IconFileX as te, IconMusic as z, IconPaperclip as B, IconPhoto as V, IconReload as ne, IconTerminal2 as H, IconVideo as re, IconX as ie } from "@tabler/icons-react";
|
|
4
|
+
import { DIAL_ICON_SIZE as U, DIAL_KIT_ICON_STROKE as W, ElementSize as G, GhostIconButton as ae, Highlight as oe, Skeleton as se, SkeletonVariant as ce, Spinner as le, StaticIconButton as ue } from "@epam/ai-dial-ui-kit";
|
|
5
|
+
import { Fragment as de, jsx as K, jsxs as q } from "react/jsx-runtime";
|
|
6
6
|
//#region src/utils/attachment.ts
|
|
7
|
-
var
|
|
7
|
+
var fe = () => `${Date.now()}-${Math.random().toString(36).slice(2)}`, pe = (e) => {
|
|
8
8
|
if (e == null) return "";
|
|
9
9
|
let t = e.lastIndexOf(".");
|
|
10
10
|
return t > 0 ? e.slice(0, t) : e;
|
|
@@ -59,13 +59,13 @@ var q = () => `${Date.now()}-${Math.random().toString(36).slice(2)}`, pe = (e) =
|
|
|
59
59
|
case "application/x-rar-compressed":
|
|
60
60
|
case "application/x-7z-compressed":
|
|
61
61
|
case "application/gzip":
|
|
62
|
-
case "application/x-tar": return
|
|
62
|
+
case "application/x-tar": return ee;
|
|
63
63
|
case "text/csv": return y;
|
|
64
64
|
case "text/plain": return F;
|
|
65
65
|
case "text/html":
|
|
66
66
|
case "application/xhtml+xml": return S;
|
|
67
67
|
case "text/xml":
|
|
68
|
-
case "application/xml": return
|
|
68
|
+
case "application/xml": return R;
|
|
69
69
|
case "application/sql":
|
|
70
70
|
case "text/x-sql": return j;
|
|
71
71
|
case "text/javascript":
|
|
@@ -131,39 +131,39 @@ var q = () => `${Date.now()}-${Math.random().toString(36).slice(2)}`, pe = (e) =
|
|
|
131
131
|
track: "_track_s2es2_50",
|
|
132
132
|
actionButton: "_actionButton_s2es2_56",
|
|
133
133
|
imageActionButton: "_imageActionButton_s2es2_60"
|
|
134
|
-
}, Z = ({ ariaLabel: e, errorTitle: t, errorDescId: n, onClick: r, id: i, icon: o, className: s }) => /* @__PURE__ */
|
|
134
|
+
}, Z = ({ ariaLabel: e, errorTitle: t, errorDescId: n, onClick: r, id: i, icon: o, className: s }) => /* @__PURE__ */ K(ue, {
|
|
135
135
|
icon: o,
|
|
136
|
-
size:
|
|
136
|
+
size: G.Small,
|
|
137
137
|
className: a("opacity-0 focus-visible:opacity-100 group-focus-within/attachment-tile:opacity-100 group-hover/attachment-tile:opacity-100", X.actionButton, s, Y.tileAction),
|
|
138
138
|
"aria-label": e,
|
|
139
139
|
"aria-describedby": t ? n : void 0,
|
|
140
140
|
onClick: (e) => {
|
|
141
141
|
e.stopPropagation(), r(i);
|
|
142
142
|
}
|
|
143
|
-
}), we = ({ ...e }) => /* @__PURE__ */
|
|
144
|
-
icon: /* @__PURE__ */
|
|
143
|
+
}), we = ({ ...e }) => /* @__PURE__ */ K(Z, {
|
|
144
|
+
icon: /* @__PURE__ */ K(ne, {
|
|
145
145
|
size: U.SM,
|
|
146
146
|
"aria-hidden": !0,
|
|
147
147
|
stroke: W
|
|
148
148
|
}),
|
|
149
149
|
className: X.retryIcon,
|
|
150
150
|
...e
|
|
151
|
-
}), Te = ({ ...e }) => /* @__PURE__ */
|
|
152
|
-
icon: /* @__PURE__ */
|
|
151
|
+
}), Te = ({ ...e }) => /* @__PURE__ */ K(Z, {
|
|
152
|
+
icon: /* @__PURE__ */ K(p, {
|
|
153
153
|
size: U.SM,
|
|
154
154
|
"aria-hidden": !0,
|
|
155
155
|
stroke: W
|
|
156
156
|
}),
|
|
157
157
|
...e
|
|
158
|
-
}), Ee = ({ ...e }) => /* @__PURE__ */
|
|
159
|
-
icon: /* @__PURE__ */
|
|
158
|
+
}), Ee = ({ ...e }) => /* @__PURE__ */ K(Z, {
|
|
159
|
+
icon: /* @__PURE__ */ K(m, {
|
|
160
160
|
size: U.SM,
|
|
161
161
|
"aria-hidden": !0,
|
|
162
162
|
stroke: W
|
|
163
163
|
}),
|
|
164
164
|
...e
|
|
165
|
-
}), De = ({ ...e }) => /* @__PURE__ */
|
|
166
|
-
icon: /* @__PURE__ */
|
|
165
|
+
}), De = ({ ...e }) => /* @__PURE__ */ K(Z, {
|
|
166
|
+
icon: /* @__PURE__ */ K(ie, {
|
|
167
167
|
size: U.SM,
|
|
168
168
|
"aria-hidden": !0,
|
|
169
169
|
stroke: W
|
|
@@ -171,65 +171,66 @@ var q = () => `${Date.now()}-${Math.random().toString(36).slice(2)}`, pe = (e) =
|
|
|
171
171
|
...e
|
|
172
172
|
}), Oe = {
|
|
173
173
|
[e.Network]: "Upload failed · network error",
|
|
174
|
-
[e.UnsupportedType]: "Upload failed · unsupported file type"
|
|
174
|
+
[e.UnsupportedType]: "Upload failed · unsupported file type",
|
|
175
|
+
[e.FileTooLarge]: "Upload failed · file too large"
|
|
175
176
|
}, ke = ({ attachment: t, searchQuery: n = "", onClick: i, onRetry: s, labels: u, styles: d, onDownload: f, isPasted: p, isLink: m, cssVars: h, onExpand: g, isExpandable: _, onRemove: v, isSelected: y }) => {
|
|
176
|
-
let { clickLabel: b = "Download attachment", retryLabel: x = "Retry upload", removeLabel: S = "Remove attachment", openInNewTabLabel: C = "Open in new tab", sizeLabel: w, uploadingLabel: T = "Uploading", errorReasonLabels: E, genericErrorLabel: D = "Upload failed" } = u ?? {}, { typography: O, className: k } = d ?? {}, { id: A, name: j, status: M, errorReason: N } = t, P = M === r.Loading, F = M === r.Error, I = c(), L = F ? N && (E?.[N] ?? Oe[N]) || D : "", { BottomIcon:
|
|
177
|
+
let { clickLabel: b = "Download attachment", retryLabel: x = "Retry upload", removeLabel: S = "Remove attachment", openInNewTabLabel: C = "Open in new tab", sizeLabel: w, uploadingLabel: T = "Uploading", errorReasonLabels: E, genericErrorLabel: D = "Upload failed" } = u ?? {}, { typography: O, className: k } = d ?? {}, { id: A, name: j, status: M, errorReason: N } = t, P = M === r.Loading, F = M === r.Error, I = c(), L = F ? N && (E?.[N] ?? Oe[N]) || D : "", { BottomIcon: R, typeLabel: ee } = J(t), te = !F && !P && f && !m, z = F && !!s && N !== e.UnsupportedType && N !== e.FileTooLarge, B = Number(!!te) + Number(!!z) + Number(!!m) + Number(!!v), V = B > 1 ? "pe-11" : B === 1 ? "pe-5" : void 0, ne = (e) => {
|
|
177
178
|
e.target === e.currentTarget && (e.key === "Enter" || e.key === " ") && (e.preventDefault(), i?.(t.id));
|
|
178
179
|
}, H = l(() => p ? j : pe(j), [p, j]), re = o(() => {
|
|
179
180
|
window.open(t.referenceUrl, "_blank", "noopener,noreferrer");
|
|
180
|
-
}, [t]), ie = a(Ce, "group/attachment-tile relative flex-col justify-between items-start gap-1 overflow-hidden p-1.5", X.tile, !F && X.hovered, y && X.selected, F && X.tileError, Y.tile, y && Y.tileSelected), U = /* @__PURE__ */
|
|
181
|
+
}, [t]), ie = a(Ce, "group/attachment-tile relative flex-col justify-between items-start gap-1 overflow-hidden p-1.5", X.tile, !F && X.hovered, y && X.selected, F && X.tileError, Y.tile, y && Y.tileSelected), U = /* @__PURE__ */ K("div", {
|
|
181
182
|
title: H,
|
|
182
183
|
className: a(O?.nameClassName ?? "dial-caption-text", "line-clamp-2 w-full min-w-0 break-words", X.nameText, !F && V, Y.tileName),
|
|
183
|
-
children: n ? /* @__PURE__ */
|
|
184
|
+
children: n ? /* @__PURE__ */ K(oe, {
|
|
184
185
|
text: H,
|
|
185
186
|
query: n,
|
|
186
187
|
maxLines: 2
|
|
187
188
|
}) : H
|
|
188
|
-
}), W =
|
|
189
|
+
}), W = R && /* @__PURE__ */ q("div", {
|
|
189
190
|
className: a("flex w-full items-center gap-1", F && V, Y.tileType),
|
|
190
|
-
children: [/* @__PURE__ */
|
|
191
|
+
children: [/* @__PURE__ */ K(R, {
|
|
191
192
|
size: 16,
|
|
192
193
|
className: X.typeText,
|
|
193
194
|
"aria-hidden": !0
|
|
194
|
-
}), /* @__PURE__ */
|
|
195
|
+
}), /* @__PURE__ */ K("span", {
|
|
195
196
|
className: a(O?.metaClassName ?? "dial-caption-text", "min-w-0 flex-1 truncate", X.typeText),
|
|
196
|
-
children: w ? `${
|
|
197
|
+
children: w ? `${ee} · ${w}` : ee
|
|
197
198
|
})]
|
|
198
|
-
}),
|
|
199
|
+
}), G = () => {
|
|
199
200
|
_ && g ? g(A) : i && i(A);
|
|
200
|
-
},
|
|
201
|
+
}, ae = /* @__PURE__ */ q(de, { children: [
|
|
201
202
|
U,
|
|
202
203
|
W,
|
|
203
|
-
P && /* @__PURE__ */
|
|
204
|
+
P && /* @__PURE__ */ K("div", {
|
|
204
205
|
role: "progressbar",
|
|
205
206
|
"aria-label": T,
|
|
206
207
|
className: a("absolute start-[-1px] top-[-1px] flex size-full items-center justify-center rounded", X.track),
|
|
207
|
-
children: /* @__PURE__ */
|
|
208
|
+
children: /* @__PURE__ */ K(le, { size: 32 })
|
|
208
209
|
}),
|
|
209
|
-
/* @__PURE__ */
|
|
210
|
+
/* @__PURE__ */ q("div", {
|
|
210
211
|
className: "absolute end-1 top-1 flex gap-1",
|
|
211
212
|
children: [
|
|
212
|
-
te && /* @__PURE__ */
|
|
213
|
+
te && /* @__PURE__ */ K(Te, {
|
|
213
214
|
ariaLabel: b,
|
|
214
215
|
errorTitle: L,
|
|
215
216
|
errorDescId: I,
|
|
216
217
|
onClick: f,
|
|
217
218
|
id: A
|
|
218
219
|
}),
|
|
219
|
-
z && /* @__PURE__ */
|
|
220
|
+
z && /* @__PURE__ */ K(we, {
|
|
220
221
|
ariaLabel: x,
|
|
221
222
|
errorTitle: L,
|
|
222
223
|
errorDescId: I,
|
|
223
224
|
onClick: s,
|
|
224
225
|
id: A
|
|
225
226
|
}),
|
|
226
|
-
m && /* @__PURE__ */
|
|
227
|
+
m && /* @__PURE__ */ K(Ee, {
|
|
227
228
|
ariaLabel: C,
|
|
228
229
|
errorTitle: L,
|
|
229
230
|
errorDescId: I,
|
|
230
231
|
onClick: re
|
|
231
232
|
}),
|
|
232
|
-
v && /* @__PURE__ */
|
|
233
|
+
v && /* @__PURE__ */ K(De, {
|
|
233
234
|
ariaLabel: S,
|
|
234
235
|
errorTitle: L,
|
|
235
236
|
errorDescId: I,
|
|
@@ -238,7 +239,7 @@ var q = () => `${Date.now()}-${Math.random().toString(36).slice(2)}`, pe = (e) =
|
|
|
238
239
|
})
|
|
239
240
|
]
|
|
240
241
|
}),
|
|
241
|
-
F && /* @__PURE__ */
|
|
242
|
+
F && /* @__PURE__ */ K("span", {
|
|
242
243
|
id: I,
|
|
243
244
|
role: "status",
|
|
244
245
|
"aria-live": "polite",
|
|
@@ -246,19 +247,19 @@ var q = () => `${Date.now()}-${Math.random().toString(36).slice(2)}`, pe = (e) =
|
|
|
246
247
|
children: L
|
|
247
248
|
})
|
|
248
249
|
] });
|
|
249
|
-
return /* @__PURE__ */
|
|
250
|
+
return /* @__PURE__ */ K("div", {
|
|
250
251
|
style: h,
|
|
251
252
|
className: a("inline-flex", k),
|
|
252
|
-
children: /* @__PURE__ */
|
|
253
|
+
children: /* @__PURE__ */ K("div", {
|
|
253
254
|
role: "button",
|
|
254
255
|
tabIndex: 0,
|
|
255
256
|
"aria-label": b,
|
|
256
257
|
"aria-busy": P,
|
|
257
|
-
onClick:
|
|
258
|
+
onClick: G,
|
|
258
259
|
onKeyDown: ne,
|
|
259
260
|
style: h,
|
|
260
261
|
className: a(ie, "cursor-pointer focus-within:outline focus-within:outline-1 focus-within:outline-offset-1"),
|
|
261
|
-
children:
|
|
262
|
+
children: ae
|
|
262
263
|
})
|
|
263
264
|
});
|
|
264
265
|
}, Q = /* @__PURE__ */ function(e) {
|
|
@@ -285,7 +286,7 @@ var q = () => `${Date.now()}-${Math.random().toString(36).slice(2)}`, pe = (e) =
|
|
|
285
286
|
}), D = () => {
|
|
286
287
|
b && n ? n(_) : w && r && r(_);
|
|
287
288
|
};
|
|
288
|
-
return /* @__PURE__ */
|
|
289
|
+
return /* @__PURE__ */ K("div", {
|
|
289
290
|
className: a(Ce, "group/attachment-tile", w && "cursor-pointer", X.tile, d && X.selected, g, Y.tile, d && Y.tileSelected),
|
|
290
291
|
onClick: D,
|
|
291
292
|
onKeyDown: (e) => {
|
|
@@ -295,29 +296,29 @@ var q = () => `${Date.now()}-${Math.random().toString(36).slice(2)}`, pe = (e) =
|
|
|
295
296
|
role: "button",
|
|
296
297
|
style: s,
|
|
297
298
|
"aria-label": w ? f : b ? p : void 0,
|
|
298
|
-
children: /* @__PURE__ */
|
|
299
|
+
children: /* @__PURE__ */ q("div", {
|
|
299
300
|
className: "relative h-full w-full overflow-hidden",
|
|
300
301
|
children: [
|
|
301
|
-
/* @__PURE__ */
|
|
302
|
+
/* @__PURE__ */ q("div", {
|
|
302
303
|
className: "absolute end-1 top-1 z-10 flex gap-1",
|
|
303
|
-
children: [o && /* @__PURE__ */
|
|
304
|
+
children: [o && /* @__PURE__ */ K(De, {
|
|
304
305
|
ariaLabel: m,
|
|
305
306
|
onClick: o,
|
|
306
307
|
id: _,
|
|
307
308
|
className: X.imageActionButton
|
|
308
|
-
}), c && /* @__PURE__ */
|
|
309
|
+
}), c && /* @__PURE__ */ K(Te, {
|
|
309
310
|
ariaLabel: h,
|
|
310
311
|
onClick: c,
|
|
311
312
|
id: _,
|
|
312
313
|
className: X.imageActionButton
|
|
313
314
|
})]
|
|
314
315
|
}),
|
|
315
|
-
E !== Q.Loaded && /* @__PURE__ */
|
|
316
|
-
variant:
|
|
316
|
+
E !== Q.Loaded && /* @__PURE__ */ K(se, {
|
|
317
|
+
variant: ce.Rectangular,
|
|
317
318
|
width: "100%",
|
|
318
319
|
height: "100%",
|
|
319
320
|
active: E === Q.Loading,
|
|
320
|
-
overlay: /* @__PURE__ */
|
|
321
|
+
overlay: /* @__PURE__ */ K(V, {
|
|
321
322
|
size: U.LG,
|
|
322
323
|
className: X.typeText,
|
|
323
324
|
"aria-hidden": !0,
|
|
@@ -325,7 +326,7 @@ var q = () => `${Date.now()}-${Math.random().toString(36).slice(2)}`, pe = (e) =
|
|
|
325
326
|
}),
|
|
326
327
|
className: "absolute inset-0 rounded-xl"
|
|
327
328
|
}),
|
|
328
|
-
/* @__PURE__ */
|
|
329
|
+
/* @__PURE__ */ K("img", {
|
|
329
330
|
ref: T,
|
|
330
331
|
src: y,
|
|
331
332
|
alt: v,
|
|
@@ -354,7 +355,7 @@ var q = () => `${Date.now()}-${Math.random().toString(36).slice(2)}`, pe = (e) =
|
|
|
354
355
|
"--ai-tile-hover-icon-color": p?.hoverIconColor,
|
|
355
356
|
"--ai-tile-progress-track": p?.trackBackground
|
|
356
357
|
}), { isImage: _, isLink: v } = l(() => J(e), [e]);
|
|
357
|
-
return _ ? /* @__PURE__ */
|
|
358
|
+
return _ ? /* @__PURE__ */ K(je, {
|
|
358
359
|
attachment: e,
|
|
359
360
|
labels: u,
|
|
360
361
|
onClick: s,
|
|
@@ -364,7 +365,7 @@ var q = () => `${Date.now()}-${Math.random().toString(36).slice(2)}`, pe = (e) =
|
|
|
364
365
|
cssVars: g,
|
|
365
366
|
onDownload: c,
|
|
366
367
|
isSelected: f
|
|
367
|
-
}) : /* @__PURE__ */
|
|
368
|
+
}) : /* @__PURE__ */ K(ke, {
|
|
368
369
|
attachment: e,
|
|
369
370
|
searchQuery: n,
|
|
370
371
|
onClick: s,
|
|
@@ -382,14 +383,14 @@ var q = () => `${Date.now()}-${Math.random().toString(36).slice(2)}`, pe = (e) =
|
|
|
382
383
|
});
|
|
383
384
|
}, Ne = ({ attachments: e, onRemove: t, onRetry: n, onExpand: r, onAttachmentClick: i, labels: o, styles: s }) => {
|
|
384
385
|
let { ariaLabel: c = "Attached files", removeLabel: l, retryLabel: u, clickLabel: d, uploadingLabel: f } = o ?? {}, { className: p } = s ?? {};
|
|
385
|
-
return e.length === 0 ? null : /* @__PURE__ */
|
|
386
|
+
return e.length === 0 ? null : /* @__PURE__ */ K("div", {
|
|
386
387
|
role: "list",
|
|
387
388
|
"aria-label": c,
|
|
388
389
|
className: a("flex w-full min-w-0 gap-2 overflow-x-auto", p, Y.tray),
|
|
389
|
-
children: e.map((e) => /* @__PURE__ */
|
|
390
|
+
children: e.map((e) => /* @__PURE__ */ K("div", {
|
|
390
391
|
role: "listitem",
|
|
391
392
|
className: Y.trayItem,
|
|
392
|
-
children: /* @__PURE__ */
|
|
393
|
+
children: /* @__PURE__ */ K(Me, {
|
|
393
394
|
attachment: e,
|
|
394
395
|
onRemove: t,
|
|
395
396
|
onRetry: n,
|
|
@@ -417,40 +418,40 @@ var q = () => `${Date.now()}-${Math.random().toString(36).slice(2)}`, pe = (e) =
|
|
|
417
418
|
let n = e.find((e) => e.id === t);
|
|
418
419
|
n && o?.([n]);
|
|
419
420
|
};
|
|
420
|
-
return /* @__PURE__ */
|
|
421
|
+
return /* @__PURE__ */ q("div", {
|
|
421
422
|
role: "group",
|
|
422
423
|
"aria-label": d,
|
|
423
424
|
style: T,
|
|
424
425
|
className: a("flex flex-col gap-1", k ? "w-full min-w-0 max-w-[492px]" : "max-w-[420px]", Pe.container, w),
|
|
425
|
-
children: [/* @__PURE__ */
|
|
426
|
+
children: [/* @__PURE__ */ q("div", {
|
|
426
427
|
className: "flex items-center justify-between",
|
|
427
|
-
children: [/* @__PURE__ */
|
|
428
|
+
children: [/* @__PURE__ */ q("div", {
|
|
428
429
|
className: "flex items-center gap-1",
|
|
429
|
-
children: [/* @__PURE__ */
|
|
430
|
+
children: [/* @__PURE__ */ K(A, {
|
|
430
431
|
size: U.SM,
|
|
431
432
|
className: a("shrink-0", Pe.headerIcon),
|
|
432
433
|
"aria-hidden": !0
|
|
433
|
-
}), /* @__PURE__ */
|
|
434
|
+
}), /* @__PURE__ */ K("span", {
|
|
434
435
|
className: a(S?.headerLabelClassName ?? "dial-tiny-semi-text", Pe.headerLabel),
|
|
435
436
|
children: j
|
|
436
437
|
})]
|
|
437
|
-
}), e.length >= 2 && (o || n) && /* @__PURE__ */
|
|
438
|
-
icon: /* @__PURE__ */
|
|
438
|
+
}), e.length >= 2 && (o || n) && /* @__PURE__ */ K(ae, {
|
|
439
|
+
icon: /* @__PURE__ */ K(p, {
|
|
439
440
|
size: U.SM,
|
|
440
441
|
"aria-hidden": !0,
|
|
441
442
|
stroke: W
|
|
442
443
|
}),
|
|
443
|
-
size:
|
|
444
|
+
size: G.Small,
|
|
444
445
|
"aria-label": g,
|
|
445
446
|
onClick: M
|
|
446
447
|
})]
|
|
447
|
-
}), /* @__PURE__ */
|
|
448
|
+
}), /* @__PURE__ */ K("div", {
|
|
448
449
|
role: "list",
|
|
449
450
|
"aria-label": j,
|
|
450
451
|
className: a("gap-3", k ? "grid grid-cols-[repeat(5,83px)]" : "flex flex-wrap"),
|
|
451
|
-
children: e.map((e, t) => /* @__PURE__ */
|
|
452
|
+
children: e.map((e, t) => /* @__PURE__ */ K("div", {
|
|
452
453
|
role: "listitem",
|
|
453
|
-
children: /* @__PURE__ */
|
|
454
|
+
children: /* @__PURE__ */ K(Me, {
|
|
454
455
|
attachment: e,
|
|
455
456
|
onClick: n,
|
|
456
457
|
onDownload: N,
|
|
@@ -482,26 +483,26 @@ var q = () => `${Date.now()}-${Math.random().toString(36).slice(2)}`, pe = (e) =
|
|
|
482
483
|
}), d = o ?? (t ? "Attach files" : "No attachments allowed"), f = s ?? (t ? "Drop files here to attach them to message" : "Attachments can't be added to message"), p = t ? Le.icon : Le.deniedIcon, m = (e) => {
|
|
483
484
|
e.preventDefault();
|
|
484
485
|
}, h = t ? g : te;
|
|
485
|
-
return /* @__PURE__ */
|
|
486
|
+
return /* @__PURE__ */ K("div", {
|
|
486
487
|
role: "status",
|
|
487
488
|
"aria-live": "polite",
|
|
488
489
|
className: a("fixed inset-0 z-[9999] flex items-center justify-center backdrop-blur-sm", Le.overlay, t ? "pointer-events-none" : "pointer-events-auto cursor-not-allowed"),
|
|
489
490
|
onDragOver: t ? void 0 : m,
|
|
490
491
|
onDrop: t ? void 0 : m,
|
|
491
492
|
style: u,
|
|
492
|
-
children: /* @__PURE__ */
|
|
493
|
+
children: /* @__PURE__ */ q("div", {
|
|
493
494
|
className: "flex flex-col items-center text-center",
|
|
494
495
|
children: [
|
|
495
|
-
/* @__PURE__ */
|
|
496
|
+
/* @__PURE__ */ K(h, {
|
|
496
497
|
size: 100,
|
|
497
498
|
className: p,
|
|
498
499
|
"aria-hidden": !0
|
|
499
500
|
}),
|
|
500
|
-
/* @__PURE__ */
|
|
501
|
+
/* @__PURE__ */ K("span", {
|
|
501
502
|
className: a("mt-5", l?.titleClassName ?? "dial-h3-text"),
|
|
502
503
|
children: d
|
|
503
504
|
}),
|
|
504
|
-
/* @__PURE__ */
|
|
505
|
+
/* @__PURE__ */ K("span", {
|
|
505
506
|
className: a("mt-4", l?.subtitleClassName ?? "dial-small-text"),
|
|
506
507
|
children: f
|
|
507
508
|
})
|
|
@@ -522,7 +523,7 @@ var q = () => `${Date.now()}-${Math.random().toString(36).slice(2)}`, pe = (e) =
|
|
|
522
523
|
let i = e.getAsFile();
|
|
523
524
|
if (!i) continue;
|
|
524
525
|
let o = Be(a, s, n.length), c = new File([i], o, { type: i.type }), l = {
|
|
525
|
-
id:
|
|
526
|
+
id: fe(),
|
|
526
527
|
name: o,
|
|
527
528
|
contentType: i.type,
|
|
528
529
|
file: c,
|
|
@@ -538,7 +539,7 @@ var q = () => `${Date.now()}-${Math.random().toString(36).slice(2)}`, pe = (e) =
|
|
|
538
539
|
let l = i.clipboardData.getData("text/plain");
|
|
539
540
|
if (l.length > n) {
|
|
540
541
|
let n = l.trim(), a = (n.length > 80 ? `${n.slice(0, 80).trimEnd()}…` : n) || s, o = new File([l], a, { type: "text/plain" }), c = {
|
|
541
|
-
id:
|
|
542
|
+
id: fe(),
|
|
542
543
|
name: a,
|
|
543
544
|
contentType: "text/plain",
|
|
544
545
|
file: o,
|
|
@@ -555,4 +556,4 @@ var q = () => `${Date.now()}-${Math.random().toString(36).slice(2)}`, pe = (e) =
|
|
|
555
556
|
]) };
|
|
556
557
|
}, He = 100;
|
|
557
558
|
//#endregion
|
|
558
|
-
export { Se as ATTACHMENT_COLLAPSE_THRESHOLD, Y as ATTACHMENT_INPUT_CLASS, Me as AttachmentCard, Ie as AttachmentGroup, Ne as AttachmentTray, Re as FileDndOverlay, Q as LazyImageLoadStatus, He as MAX_UPLOADS_PER_MINUTE,
|
|
559
|
+
export { Se as ATTACHMENT_COLLAPSE_THRESHOLD, Y as ATTACHMENT_INPUT_CLASS, Me as AttachmentCard, Ie as AttachmentGroup, Ne as AttachmentTray, Re as FileDndOverlay, Q as LazyImageLoadStatus, He as MAX_UPLOADS_PER_MINUTE, fe as generateAttachmentId, J as getAttachmentCardState, ve as getAttachmentIcon, be as getExtFromContentType, pe as getNameWithoutExtension, _e as isMimeTypeAllowed, ge as mimeTypesToExtensionLabels, Ve as useClipboardPaste, Ae as useLazyImageLoad };
|
package/package.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@epam/ai-dial-attachment-input",
|
|
3
3
|
"description": "File attachment input components with upload validation, drag-and-drop, and progress tracking",
|
|
4
|
-
"version": "1.2.0-dev.
|
|
4
|
+
"version": "1.2.0-dev.69",
|
|
5
5
|
"license": "Apache-2.0",
|
|
6
6
|
"type": "module",
|
|
7
7
|
"main": "./index.js",
|
|
@@ -20,7 +20,7 @@
|
|
|
20
20
|
"@tabler/icons-react": "^3.44.0"
|
|
21
21
|
},
|
|
22
22
|
"peerDependencies": {
|
|
23
|
-
"@epam/ai-dial-chat-shared": "1.2.0-dev.
|
|
23
|
+
"@epam/ai-dial-chat-shared": "1.2.0-dev.69",
|
|
24
24
|
"react": "^19.2.8",
|
|
25
25
|
"@epam/ai-dial-ui-kit": "^0.15.0-dev.9"
|
|
26
26
|
},
|