@epam/ai-dial-attachment-input 1.1.0-dev.297 → 1.1.0-dev.299

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/Attachments/Actions.d.ts.map +1 -1
  2. package/components/AttachmentCard/Attachments/Image.d.ts.map +1 -1
  3. package/components/AttachmentGroup/AttachmentGroup.d.ts.map +1 -1
  4. package/index.js +99 -93
  5. package/package.json +3 -3
package/components/AttachmentCard/Attachments/Actions.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"Actions.d.ts","sourceRoot":"","sources":["../../../../src/components/AttachmentCard/Attachments/Actions.tsx"],"names":[],"mappings":"AAYA,OAAO,EAAE,SAAS,EAAE,KAAK,EAAE,EAAmB,MAAM,OAAO,CAAC;AAG5D,UAAU,WAAW;IACnB,wCAAwC;IACxC,IAAI,EAAE,SAAS,CAAC;IAChB,qDAAqD;IACrD,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,uDAAuD;IACvD,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,sDAAsD;IACtD,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,wDAAwD;IACxD,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,oDAAoD;IACpD,OAAO,EAAE,CAAC,EAAE,EAAE,MAAM,KAAK,IAAI,CAAC;IAC9B,qCAAqC;IACrC,EAAE,CAAC,EAAE,MAAM,CAAC;CACb;AA+BD,uCAAuC;AACvC,eAAO,MAAM,YAAY,EAAE,EAAE,CAAC,IAAI,CAAC,WAAW,EAAE,MAAM,CAAC,CAQtD,CAAC;AAEF,6CAA6C;AAC7C,eAAO,MAAM,cAAc,EAAE,EAAE,CAAC,IAAI,CAAC,WAAW,EAAE,MAAM,CAAC,CAOxD,CAAC;AAEF,mDAAmD;AACnD,eAAO,MAAM,cAAc,EAAE,EAAE,CAAC,IAAI,CAAC,WAAW,EAAE,MAAM,CAAC,CAOxD,CAAC;AAEF,qCAAqC;AACrC,eAAO,MAAM,YAAY,EAAE,EAAE,CAAC,IAAI,CAAC,WAAW,EAAE,MAAM,CAAC,CAOtD,CAAC"}
1
+ {"version":3,"file":"Actions.d.ts","sourceRoot":"","sources":["../../../../src/components/AttachmentCard/Attachments/Actions.tsx"],"names":[],"mappings":"AAaA,OAAO,EAAE,SAAS,EAAE,KAAK,EAAE,EAAmB,MAAM,OAAO,CAAC;AAG5D,UAAU,WAAW;IACnB,wCAAwC;IACxC,IAAI,EAAE,SAAS,CAAC;IAChB,qDAAqD;IACrD,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,uDAAuD;IACvD,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,sDAAsD;IACtD,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,wDAAwD;IACxD,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,oDAAoD;IACpD,OAAO,EAAE,CAAC,EAAE,EAAE,MAAM,KAAK,IAAI,CAAC;IAC9B,qCAAqC;IACrC,EAAE,CAAC,EAAE,MAAM,CAAC;CACb;AA+BD,uCAAuC;AACvC,eAAO,MAAM,YAAY,EAAE,EAAE,CAAC,IAAI,CAAC,WAAW,EAAE,MAAM,CAAC,CActD,CAAC;AAEF,6CAA6C;AAC7C,eAAO,MAAM,cAAc,EAAE,EAAE,CAAC,IAAI,CAAC,WAAW,EAAE,MAAM,CAAC,CAaxD,CAAC;AAEF,mDAAmD;AACnD,eAAO,MAAM,cAAc,EAAE,EAAE,CAAC,IAAI,CAAC,WAAW,EAAE,MAAM,CAAC,CAaxD,CAAC;AAEF,qCAAqC;AACrC,eAAO,MAAM,YAAY,EAAE,EAAE,CAAC,IAAI,CAAC,WAAW,EAAE,MAAM,CAAC,CAatD,CAAC"}
package/components/AttachmentCard/Attachments/Image.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"Image.d.ts","sourceRoot":"","sources":["../../../../src/components/AttachmentCard/Attachments/Image.tsx"],"names":[],"mappings":"AAAA,OAAO,EAEL,iBAAiB,EAElB,MAAM,2BAA2B,CAAC;AAOnC,OAAO,EAAE,aAAa,EAAE,KAAK,EAAE,EAA+B,MAAM,OAAO,CAAC;AAM5E,OAAO,KAAK,EACV,oBAAoB,EACpB,oBAAoB,EACrB,MAAM,iCAAiC,CAAC;AAKzC,UAAU,oBAAoB;IAC5B,UAAU,EAAE,iBAAiB,CAAC;IAC9B,QAAQ,CAAC,EAAE,CAAC,YAAY,EAAE,MAAM,KAAK,IAAI,CAAC;IAC1C,OAAO,CAAC,EAAE,CAAC,YAAY,EAAE,MAAM,KAAK,IAAI,CAAC;IACzC,QAAQ,CAAC,EAAE,CAAC,YAAY,EAAE,MAAM,KAAK,IAAI,CAAC;IAC1C,MAAM,CAAC,EAAE,oBAAoB,CAAC;IAC9B,MAAM,CAAC,EAAE,oBAAoB,CAAC;IAC9B,OAAO,CAAC,EAAE,aAAa,CAAC;IACxB,UAAU,CAAC,EAAE,CAAC,EAAE,EAAE,MAAM,KAAK,IAAI,CAAC;IAClC,uHAAuH;IACvH,UAAU,CAAC,EAAE,OAAO,CAAC;CACtB;AAED,0EAA0E;AAC1E,eAAO,MAAM,eAAe,EAAE,EAAE,CAAC,oBAAoB,CAmHpD,CAAC"}
1
+ {"version":3,"file":"Image.d.ts","sourceRoot":"","sources":["../../../../src/components/AttachmentCard/Attachments/Image.tsx"],"names":[],"mappings":"AAAA,OAAO,EAEL,iBAAiB,EAElB,MAAM,2BAA2B,CAAC;AAQnC,OAAO,EAAE,aAAa,EAAE,KAAK,EAAE,EAA+B,MAAM,OAAO,CAAC;AAM5E,OAAO,KAAK,EACV,oBAAoB,EACpB,oBAAoB,EACrB,MAAM,iCAAiC,CAAC;AAKzC,UAAU,oBAAoB;IAC5B,UAAU,EAAE,iBAAiB,CAAC;IAC9B,QAAQ,CAAC,EAAE,CAAC,YAAY,EAAE,MAAM,KAAK,IAAI,CAAC;IAC1C,OAAO,CAAC,EAAE,CAAC,YAAY,EAAE,MAAM,KAAK,IAAI,CAAC;IACzC,QAAQ,CAAC,EAAE,CAAC,YAAY,EAAE,MAAM,KAAK,IAAI,CAAC;IAC1C,MAAM,CAAC,EAAE,oBAAoB,CAAC;IAC9B,MAAM,CAAC,EAAE,oBAAoB,CAAC;IAC9B,OAAO,CAAC,EAAE,aAAa,CAAC;IACxB,UAAU,CAAC,EAAE,CAAC,EAAE,EAAE,MAAM,KAAK,IAAI,CAAC;IAClC,uHAAuH;IACvH,UAAU,CAAC,EAAE,OAAO,CAAC;CACtB;AAED,0EAA0E;AAC1E,eAAO,MAAM,eAAe,EAAE,EAAE,CAAC,oBAAoB,CAoHpD,CAAC"}
package/components/AttachmentGroup/AttachmentGroup.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"AttachmentGroup.d.ts","sourceRoot":"","sources":["../../../src/components/AttachmentGroup/AttachmentGroup.tsx"],"names":[],"mappings":"AAiBA,OAAO,EAAE,KAAK,EAAE,EAAE,MAAM,OAAO,CAAC;AAEhC,OAAO,EAAE,KAAK,oBAAoB,EAAE,MAAM,+BAA+B,CAAC;AAO1E,kIAAkI;AAClI,eAAO,MAAM,eAAe,EAAE,EAAE,CAAC,oBAAoB,CAmIpD,CAAC"}
1
+ {"version":3,"file":"AttachmentGroup.d.ts","sourceRoot":"","sources":["../../../src/components/AttachmentGroup/AttachmentGroup.tsx"],"names":[],"mappings":"AAkBA,OAAO,EAAE,KAAK,EAAE,EAAE,MAAM,OAAO,CAAC;AAEhC,OAAO,EAAE,KAAK,oBAAoB,EAAE,MAAM,+BAA+B,CAAC;AAO1E,kIAAkI;AAClI,eAAO,MAAM,eAAe,EAAE,EAAE,CAAC,oBAAoB,CAyIpD,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
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 z, IconFileX as B, IconMusic as ee, IconPaperclip as V, IconPhoto as H, IconReload as te, IconTerminal2 as ne, IconVideo as re, IconX as ie } from "@tabler/icons-react";
4
- import { DIAL_ICON_SIZE as U, ElementSize as ae, GhostIconButton as oe, Highlight as se, Skeleton as ce, SkeletonVariant as le, Spinner as ue, StaticIconButton as de } from "@epam/ai-dial-ui-kit";
5
- import { Fragment as fe, jsx as W, jsxs as G } from "react/jsx-runtime";
4
+ import { DIAL_ICON_SIZE as U, DIAL_KIT_ICON_STROKE as W, ElementSize as ae, GhostIconButton as oe, Highlight as se, Skeleton as ce, SkeletonVariant as le, Spinner as ue, StaticIconButton as de } from "@epam/ai-dial-ui-kit";
5
+ import { Fragment as fe, jsx as G, jsxs as K } from "react/jsx-runtime";
6
6
  //#region src/utils/attachment.ts
7
- var K = () => `${Date.now()}-${Math.random().toString(36).slice(2)}`, pe = (e) => {
7
+ var q = () => `${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;
@@ -97,7 +97,7 @@ var K = () => `${Date.now()}-${Math.random().toString(36).slice(2)}`, pe = (e) =
97
97
  if (i == null) return "";
98
98
  let o = i.lastIndexOf(".");
99
99
  return o > 0 && o < i.length - 1 ? `.${i.slice(o + 1).toLowerCase()}` : i;
100
- }, q = (e, n = {}) => {
100
+ }, J = (e, n = {}) => {
101
101
  let { type: i, status: a, previewUrl: o, url: s } = e, c = a === r.Loading, l = a === r.Error, u = i === t.Image && !!(o ?? s) && !l, d = i === t.Link && !l;
102
102
  return {
103
103
  isLoading: c,
@@ -107,7 +107,7 @@ var K = () => `${Date.now()}-${Math.random().toString(36).slice(2)}`, pe = (e) =
107
107
  BottomIcon: d ? null : ve(e),
108
108
  typeLabel: d ? null : be(e, n)
109
109
  };
110
- }, xe = 5, Se = "flex size-[84px] items-center justify-center rounded-xl border", J = {
110
+ }, xe = 5, Se = "flex size-[84px] items-center justify-center rounded-xl border", Y = {
111
111
  tile: "_tile_1whwz_1",
112
112
  hovered: "_hovered_1whwz_5",
113
113
  selected: "_selected_1whwz_15",
@@ -118,100 +118,104 @@ var K = () => `${Date.now()}-${Math.random().toString(36).slice(2)}`, pe = (e) =
118
118
  track: "_track_1whwz_37",
119
119
  actionButton: "_actionButton_1whwz_43",
120
120
  imageActionButton: "_imageActionButton_1whwz_47"
121
- }, Y = ({ ariaLabel: e, errorTitle: t, errorDescId: n, onClick: r, id: i, icon: o, className: s }) => /* @__PURE__ */ W(de, {
121
+ }, X = ({ ariaLabel: e, errorTitle: t, errorDescId: n, onClick: r, id: i, icon: o, className: s }) => /* @__PURE__ */ G(de, {
122
122
  icon: o,
123
123
  size: ae.Small,
124
- className: a("absolute end-1 top-1 opacity-0 focus-visible:opacity-100 group-focus-within/attachment-tile:opacity-100 group-hover/attachment-tile:opacity-100", J.actionButton, s),
124
+ className: a("absolute end-1 top-1 opacity-0 focus-visible:opacity-100 group-focus-within/attachment-tile:opacity-100 group-hover/attachment-tile:opacity-100", Y.actionButton, s),
125
125
  "aria-label": e,
126
126
  "aria-describedby": t ? n : void 0,
127
127
  onClick: (e) => {
128
128
  e.stopPropagation(), r(i);
129
129
  }
130
- }), Ce = ({ ...e }) => /* @__PURE__ */ W(Y, {
131
- icon: /* @__PURE__ */ W(te, {
130
+ }), Ce = ({ ...e }) => /* @__PURE__ */ G(X, {
131
+ icon: /* @__PURE__ */ G(te, {
132
132
  size: U.SM,
133
- "aria-hidden": !0
133
+ "aria-hidden": !0,
134
+ stroke: W
134
135
  }),
135
- className: J.retryIcon,
136
+ className: Y.retryIcon,
136
137
  ...e
137
- }), we = ({ ...e }) => /* @__PURE__ */ W(Y, {
138
- icon: /* @__PURE__ */ W(p, {
138
+ }), we = ({ ...e }) => /* @__PURE__ */ G(X, {
139
+ icon: /* @__PURE__ */ G(p, {
139
140
  size: U.SM,
140
- "aria-hidden": !0
141
+ "aria-hidden": !0,
142
+ stroke: W
141
143
  }),
142
144
  ...e
143
- }), Te = ({ ...e }) => /* @__PURE__ */ W(Y, {
144
- icon: /* @__PURE__ */ W(m, {
145
+ }), Te = ({ ...e }) => /* @__PURE__ */ G(X, {
146
+ icon: /* @__PURE__ */ G(m, {
145
147
  size: U.SM,
146
- "aria-hidden": !0
148
+ "aria-hidden": !0,
149
+ stroke: W
147
150
  }),
148
151
  ...e
149
- }), Ee = ({ ...e }) => /* @__PURE__ */ W(Y, {
150
- icon: /* @__PURE__ */ W(ie, {
152
+ }), Ee = ({ ...e }) => /* @__PURE__ */ G(X, {
153
+ icon: /* @__PURE__ */ G(ie, {
151
154
  size: U.SM,
152
- "aria-hidden": !0
155
+ "aria-hidden": !0,
156
+ stroke: W
153
157
  }),
154
158
  ...e
155
159
  }), De = {
156
160
  [e.Network]: "Upload failed · network error",
157
161
  [e.UnsupportedType]: "Upload failed · unsupported file type"
158
162
  }, Oe = ({ 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 }) => {
159
- let { clickLabel: b = "Download attachment", retryLabel: x = "Retry upload", sizeLabel: S, uploadingLabel: C = "Uploading", errorReasonLabels: w, genericErrorLabel: T = "Upload failed" } = u ?? {}, { typography: E, className: D } = d ?? {}, { id: O, name: k, status: A, errorReason: j } = t, M = A === r.Loading, N = A === r.Error, P = c(), F = N ? j && (w?.[j] ?? De[j]) || T : "", { BottomIcon: I, typeLabel: L } = q(t), R = !N && !M && f && !m, z = N && !!s && j !== e.UnsupportedType, B = R || z ? "pe-5" : void 0, ee = (e) => {
163
+ let { clickLabel: b = "Download attachment", retryLabel: x = "Retry upload", sizeLabel: S, uploadingLabel: C = "Uploading", errorReasonLabels: w, genericErrorLabel: T = "Upload failed" } = u ?? {}, { typography: E, className: D } = d ?? {}, { id: O, name: k, status: A, errorReason: j } = t, M = A === r.Loading, N = A === r.Error, P = c(), F = N ? j && (w?.[j] ?? De[j]) || T : "", { BottomIcon: I, typeLabel: L } = J(t), R = !N && !M && f && !m, z = N && !!s && j !== e.UnsupportedType, B = R || z ? "pe-5" : void 0, ee = (e) => {
160
164
  (e.key === "Enter" || e.key === " ") && (e.preventDefault(), i?.(t.id));
161
165
  }, V = l(() => p ? k : pe(k), [p, k]), H = o(() => {
162
166
  window.open(t.referenceUrl, "_blank", "noopener,noreferrer");
163
- }, [t]), te = a(Se, "group/attachment-tile relative flex-col justify-between items-start gap-1 overflow-hidden p-1.5", J.tile, !N && J.hovered, y && J.selected, N && J.tileError), ne = /* @__PURE__ */ W("div", {
167
+ }, [t]), te = a(Se, "group/attachment-tile relative flex-col justify-between items-start gap-1 overflow-hidden p-1.5", Y.tile, !N && Y.hovered, y && Y.selected, N && Y.tileError), ne = /* @__PURE__ */ G("div", {
164
168
  title: V,
165
- className: a(E?.nameClassName ?? "dial-caption-text", "line-clamp-2 min-w-0 break-all", J.nameText, !N && B),
166
- children: n ? /* @__PURE__ */ W(se, {
169
+ className: a(E?.nameClassName ?? "dial-caption-text", "line-clamp-2 min-w-0 break-all", Y.nameText, !N && B),
170
+ children: n ? /* @__PURE__ */ G(se, {
167
171
  text: V,
168
172
  query: n,
169
173
  maxLines: 2
170
174
  }) : V
171
- }), re = I && /* @__PURE__ */ G("div", {
175
+ }), re = I && /* @__PURE__ */ K("div", {
172
176
  className: a("flex w-full items-center gap-1", N && B),
173
- children: [/* @__PURE__ */ W(I, {
177
+ children: [/* @__PURE__ */ G(I, {
174
178
  size: 16,
175
- className: J.typeText,
179
+ className: Y.typeText,
176
180
  "aria-hidden": !0
177
- }), /* @__PURE__ */ W("span", {
178
- className: a(E?.metaClassName ?? "dial-caption-text", "min-w-0 flex-1 truncate", J.typeText),
181
+ }), /* @__PURE__ */ G("span", {
182
+ className: a(E?.metaClassName ?? "dial-caption-text", "min-w-0 flex-1 truncate", Y.typeText),
179
183
  children: S ? `${L} · ${S}` : L
180
184
  })]
181
185
  }), ie = () => {
182
186
  _ && g ? g(O) : i && i(O);
183
- }, U = /* @__PURE__ */ G(fe, { children: [
187
+ }, U = /* @__PURE__ */ K(fe, { children: [
184
188
  ne,
185
189
  re,
186
- M && /* @__PURE__ */ W("div", {
190
+ M && /* @__PURE__ */ G("div", {
187
191
  "aria-label": C,
188
- className: a("absolute left-[-1px] top-[-1px] flex size-full items-center justify-center rounded", J.track),
189
- children: /* @__PURE__ */ W(ue, { size: 32 })
192
+ className: a("absolute left-[-1px] top-[-1px] flex size-full items-center justify-center rounded", Y.track),
193
+ children: /* @__PURE__ */ G(ue, { size: 32 })
190
194
  }),
191
- /* @__PURE__ */ G("div", {
195
+ /* @__PURE__ */ K("div", {
192
196
  className: a("absolute right-0 top-0 flex gap-1"),
193
197
  children: [
194
- R && /* @__PURE__ */ W(we, {
198
+ R && /* @__PURE__ */ G(we, {
195
199
  ariaLabel: b,
196
200
  errorTitle: F,
197
201
  errorDescId: P,
198
202
  onClick: f,
199
203
  id: O
200
204
  }),
201
- z && /* @__PURE__ */ W(Ce, {
205
+ z && /* @__PURE__ */ G(Ce, {
202
206
  ariaLabel: x,
203
207
  errorTitle: F,
204
208
  errorDescId: P,
205
209
  onClick: s,
206
210
  id: O
207
211
  }),
208
- m && /* @__PURE__ */ W(Te, {
212
+ m && /* @__PURE__ */ G(Te, {
209
213
  ariaLabel: x,
210
214
  errorTitle: F,
211
215
  errorDescId: P,
212
216
  onClick: H
213
217
  }),
214
- v && /* @__PURE__ */ W(Ee, {
218
+ v && /* @__PURE__ */ G(Ee, {
215
219
  ariaLabel: x,
216
220
  errorTitle: F,
217
221
  errorDescId: P,
@@ -220,7 +224,7 @@ var K = () => `${Date.now()}-${Math.random().toString(36).slice(2)}`, pe = (e) =
220
224
  })
221
225
  ]
222
226
  }),
223
- N && /* @__PURE__ */ W("span", {
227
+ N && /* @__PURE__ */ G("span", {
224
228
  id: P,
225
229
  role: "status",
226
230
  "aria-live": "polite",
@@ -228,10 +232,10 @@ var K = () => `${Date.now()}-${Math.random().toString(36).slice(2)}`, pe = (e) =
228
232
  children: F
229
233
  })
230
234
  ] });
231
- return /* @__PURE__ */ W("div", {
235
+ return /* @__PURE__ */ G("div", {
232
236
  style: h,
233
237
  className: a("inline-flex", D),
234
- children: /* @__PURE__ */ W("div", {
238
+ children: /* @__PURE__ */ G("div", {
235
239
  role: "button",
236
240
  tabIndex: 0,
237
241
  "aria-label": b,
@@ -242,7 +246,7 @@ var K = () => `${Date.now()}-${Math.random().toString(36).slice(2)}`, pe = (e) =
242
246
  children: U
243
247
  })
244
248
  });
245
- }, X = /* @__PURE__ */ function(e) {
249
+ }, Z = /* @__PURE__ */ function(e) {
246
250
  return e.Idle = "idle", e.Loading = "loading", e.Loaded = "loaded", e.Error = "error", e;
247
251
  }({}), ke = ({ enabled: e, src: t }) => {
248
252
  let n = u(null), [r, i] = d("idle");
@@ -260,14 +264,14 @@ var K = () => `${Date.now()}-${Math.random().toString(36).slice(2)}`, pe = (e) =
260
264
  imageLoadStatus: r
261
265
  };
262
266
  }, Ae = ({ attachment: e, onExpand: n, onClick: r, labels: i, onRemove: o, cssVars: s, onDownload: c, styles: u, isSelected: d }) => {
263
- let { clickLabel: f = "Open attachment", expandLabel: p = "Expand pasted text" } = i ?? {}, { className: m } = u ?? {}, { id: h, name: g } = e, _ = e.previewUrl ?? e.url, v = e.type === t.Pasted && n !== void 0, { isLoading: y, isError: b, isImage: x } = l(() => q(e), [e]), S = r !== void 0 && !v && !y && !b, { imageRef: C, imageLoadStatus: w } = ke({
267
+ let { clickLabel: f = "Open attachment", expandLabel: p = "Expand pasted text" } = i ?? {}, { className: m } = u ?? {}, { id: h, name: g } = e, _ = e.previewUrl ?? e.url, v = e.type === t.Pasted && n !== void 0, { isLoading: y, isError: b, isImage: x } = l(() => J(e), [e]), S = r !== void 0 && !v && !y && !b, { imageRef: C, imageLoadStatus: w } = ke({
264
268
  enabled: x,
265
269
  src: _
266
270
  }), T = () => {
267
271
  v && n ? n(h) : S && r && r(h);
268
272
  };
269
- return /* @__PURE__ */ W("div", {
270
- className: a(Se, "group/attachment-tile", S && "cursor-pointer", J.tile, d && J.selected, m),
273
+ return /* @__PURE__ */ G("div", {
274
+ className: a(Se, "group/attachment-tile", S && "cursor-pointer", Y.tile, d && Y.selected, m),
271
275
  onClick: T,
272
276
  onKeyDown: (e) => {
273
277
  (e.key === "Enter" || e.key === " ") && (e.preventDefault(), T());
@@ -276,43 +280,44 @@ var K = () => `${Date.now()}-${Math.random().toString(36).slice(2)}`, pe = (e) =
276
280
  role: "button",
277
281
  style: s,
278
282
  "aria-label": S ? f : v ? p : void 0,
279
- children: /* @__PURE__ */ G("div", {
283
+ children: /* @__PURE__ */ K("div", {
280
284
  className: "relative h-full w-full overflow-hidden",
281
285
  children: [
282
- o && /* @__PURE__ */ W(Ee, {
286
+ o && /* @__PURE__ */ G(Ee, {
283
287
  onClick: o,
284
288
  id: h,
285
- className: J.imageActionButton
289
+ className: Y.imageActionButton
286
290
  }),
287
- c && /* @__PURE__ */ W(we, {
291
+ c && /* @__PURE__ */ G(we, {
288
292
  onClick: c,
289
293
  id: h,
290
- className: J.imageActionButton
294
+ className: Y.imageActionButton
291
295
  }),
292
- w !== X.Loaded && /* @__PURE__ */ W(ce, {
296
+ w !== Z.Loaded && /* @__PURE__ */ G(ce, {
293
297
  variant: le.Rectangular,
294
298
  width: "100%",
295
299
  height: "100%",
296
- active: w === X.Loading,
297
- overlay: /* @__PURE__ */ W(H, {
300
+ active: w === Z.Loading,
301
+ overlay: /* @__PURE__ */ G(H, {
298
302
  size: U.LG,
299
- className: J.typeText,
300
- "aria-hidden": !0
303
+ className: Y.typeText,
304
+ "aria-hidden": !0,
305
+ stroke: W
301
306
  }),
302
307
  className: "absolute inset-0 rounded-xl"
303
308
  }),
304
- /* @__PURE__ */ W("img", {
309
+ /* @__PURE__ */ G("img", {
305
310
  ref: C,
306
311
  src: _,
307
312
  alt: g,
308
313
  loading: "lazy",
309
314
  decoding: "async",
310
- className: a("h-full w-full rounded-xl object-cover transition-opacity duration-200", w === X.Loaded ? "opacity-100" : "opacity-0")
315
+ className: a("h-full w-full rounded-xl object-cover transition-opacity duration-200", w === Z.Loaded ? "opacity-100" : "opacity-0")
311
316
  })
312
317
  ]
313
318
  })
314
319
  });
315
- }, Z = ({ attachment: e, searchQuery: n = "", onRemove: r, onRetry: a, onExpand: o, onClick: s, onDownload: c, labels: u, styles: d, isSelected: f }) => {
320
+ }, Q = ({ attachment: e, searchQuery: n = "", onRemove: r, onRetry: a, onExpand: o, onClick: s, onDownload: c, labels: u, styles: d, isSelected: f }) => {
316
321
  let { colors: p } = d ?? {}, m = e.type === t.Pasted, h = m && o !== void 0, g = i({
317
322
  "--ai-tile-bg": p?.background,
318
323
  "--ai-tile-border": p?.border,
@@ -329,8 +334,8 @@ var K = () => `${Date.now()}-${Math.random().toString(36).slice(2)}`, pe = (e) =
329
334
  "--ai-tile-hover-icon-bg": p?.hoverIconBackground,
330
335
  "--ai-tile-hover-icon-color": p?.hoverIconColor,
331
336
  "--ai-tile-progress-track": p?.trackBackground
332
- }), { isImage: _, isLink: v } = l(() => q(e), [e]);
333
- return _ ? /* @__PURE__ */ W(Ae, {
337
+ }), { isImage: _, isLink: v } = l(() => J(e), [e]);
338
+ return _ ? /* @__PURE__ */ G(Ae, {
334
339
  attachment: e,
335
340
  labels: u,
336
341
  onClick: s,
@@ -340,7 +345,7 @@ var K = () => `${Date.now()}-${Math.random().toString(36).slice(2)}`, pe = (e) =
340
345
  cssVars: g,
341
346
  onDownload: c,
342
347
  isSelected: f
343
- }) : /* @__PURE__ */ W(Oe, {
348
+ }) : /* @__PURE__ */ G(Oe, {
344
349
  attachment: e,
345
350
  searchQuery: n,
346
351
  onClick: s,
@@ -358,13 +363,13 @@ var K = () => `${Date.now()}-${Math.random().toString(36).slice(2)}`, pe = (e) =
358
363
  });
359
364
  }, je = ({ attachments: e, onRemove: t, onRetry: n, onExpand: r, onAttachmentClick: i, labels: o, styles: s }) => {
360
365
  let { ariaLabel: c = "Attached files", removeLabel: l, retryLabel: u, clickLabel: d } = o ?? {}, { className: f } = s ?? {};
361
- return e.length === 0 ? null : /* @__PURE__ */ W("div", {
366
+ return e.length === 0 ? null : /* @__PURE__ */ G("div", {
362
367
  role: "list",
363
368
  "aria-label": c,
364
369
  className: a("flex w-full min-w-0 gap-2 overflow-x-auto", f),
365
- children: e.map((e) => /* @__PURE__ */ W("div", {
370
+ children: e.map((e) => /* @__PURE__ */ G("div", {
366
371
  role: "listitem",
367
- children: /* @__PURE__ */ W(Z, {
372
+ children: /* @__PURE__ */ G(Q, {
368
373
  attachment: e,
369
374
  onRemove: t,
370
375
  onRetry: n,
@@ -378,7 +383,7 @@ var K = () => `${Date.now()}-${Math.random().toString(36).slice(2)}`, pe = (e) =
378
383
  })
379
384
  }, e.id))
380
385
  });
381
- }, Q = {
386
+ }, $ = {
382
387
  headerIcon: "_headerIcon_1dmgi_1",
383
388
  headerLabel: "_headerLabel_1dmgi_2"
384
389
  }, Me = (e, t) => `${e} ${t}${e === 1 ? "" : "s"}`, Ne = ({ attachments: e, onAttachmentClick: n, onDownloadAll: o, onRetry: s, labels: c, styles: l, selectedAttachmentId: u }) => {
@@ -391,39 +396,40 @@ var K = () => `${Date.now()}-${Math.random().toString(36).slice(2)}`, pe = (e) =
391
396
  let n = e.find((e) => e.id === t);
392
397
  n && o?.([n]);
393
398
  };
394
- return /* @__PURE__ */ G("div", {
399
+ return /* @__PURE__ */ K("div", {
395
400
  role: "group",
396
401
  "aria-label": d,
397
402
  style: T,
398
- className: a("flex flex-col gap-1", k ? "w-full min-w-0 max-w-[492px]" : "max-w-[420px]", Q.container, w),
399
- children: [/* @__PURE__ */ G("div", {
403
+ className: a("flex flex-col gap-1", k ? "w-full min-w-0 max-w-[492px]" : "max-w-[420px]", $.container, w),
404
+ children: [/* @__PURE__ */ K("div", {
400
405
  className: "flex items-center justify-between",
401
- children: [/* @__PURE__ */ G("div", {
406
+ children: [/* @__PURE__ */ K("div", {
402
407
  className: "flex items-center gap-1",
403
- children: [/* @__PURE__ */ W(A, {
408
+ children: [/* @__PURE__ */ G(A, {
404
409
  size: U.SM,
405
- className: a("shrink-0", Q.headerIcon),
410
+ className: a("shrink-0", $.headerIcon),
406
411
  "aria-hidden": !0
407
- }), /* @__PURE__ */ W("span", {
408
- className: a(S?.headerLabelClassName ?? "dial-tiny-semi-text", Q.headerLabel),
412
+ }), /* @__PURE__ */ G("span", {
413
+ className: a(S?.headerLabelClassName ?? "dial-tiny-semi-text", $.headerLabel),
409
414
  children: j
410
415
  })]
411
- }), e.length >= 2 && (o || n) && /* @__PURE__ */ W(oe, {
412
- icon: /* @__PURE__ */ W(p, {
416
+ }), e.length >= 2 && (o || n) && /* @__PURE__ */ G(oe, {
417
+ icon: /* @__PURE__ */ G(p, {
413
418
  size: U.SM,
414
- "aria-hidden": !0
419
+ "aria-hidden": !0,
420
+ stroke: W
415
421
  }),
416
422
  size: ae.Small,
417
423
  "aria-label": g,
418
424
  onClick: M
419
425
  })]
420
- }), /* @__PURE__ */ W("div", {
426
+ }), /* @__PURE__ */ G("div", {
421
427
  role: "list",
422
428
  "aria-label": j,
423
429
  className: a("gap-3", k ? "grid grid-cols-[repeat(5,83px)]" : "flex flex-wrap"),
424
- children: e.map((e, t) => /* @__PURE__ */ W("div", {
430
+ children: e.map((e, t) => /* @__PURE__ */ G("div", {
425
431
  role: "listitem",
426
- children: /* @__PURE__ */ W(Z, {
432
+ children: /* @__PURE__ */ G(Q, {
427
433
  attachment: e,
428
434
  onClick: n,
429
435
  onDownload: N,
@@ -441,47 +447,47 @@ var K = () => `${Date.now()}-${Math.random().toString(36).slice(2)}`, pe = (e) =
441
447
  }, `${e.id}-${t}`))
442
448
  })]
443
449
  });
444
- }, $ = {
450
+ }, Pe = {
445
451
  overlay: "_overlay_mzpdp_1",
446
452
  icon: "_icon_mzpdp_5",
447
453
  deniedIcon: "_deniedIcon_mzpdp_9"
448
- }, Pe = ({ isVisible: e, isAttachmentsAllowed: t = !0, labels: n, styles: r }) => {
454
+ }, Fe = ({ isVisible: e, isAttachmentsAllowed: t = !0, labels: n, styles: r }) => {
449
455
  let { title: o, subtitle: s } = n ?? {}, { colors: c, typography: l } = r ?? {};
450
456
  if (!e) return null;
451
457
  let u = i({
452
458
  "--ai-fd-bg": c?.background,
453
459
  "--ai-fd-icon": c?.icon,
454
460
  "--ai-fd-denied-icon": c?.deniedIcon
455
- }), 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 ? $.icon : $.deniedIcon, m = (e) => {
461
+ }), 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 ? Pe.icon : Pe.deniedIcon, m = (e) => {
456
462
  e.preventDefault();
457
463
  }, h = t ? g : B;
458
- return /* @__PURE__ */ W("div", {
464
+ return /* @__PURE__ */ G("div", {
459
465
  role: "status",
460
466
  "aria-live": "polite",
461
- className: a("fixed inset-0 z-[9999] flex items-center justify-center backdrop-blur-sm", $.overlay, t ? "pointer-events-none" : "pointer-events-auto cursor-not-allowed"),
467
+ className: a("fixed inset-0 z-[9999] flex items-center justify-center backdrop-blur-sm", Pe.overlay, t ? "pointer-events-none" : "pointer-events-auto cursor-not-allowed"),
462
468
  onDragOver: t ? void 0 : m,
463
469
  onDrop: t ? void 0 : m,
464
470
  style: u,
465
- children: /* @__PURE__ */ G("div", {
471
+ children: /* @__PURE__ */ K("div", {
466
472
  className: "flex flex-col items-center text-center",
467
473
  children: [
468
- /* @__PURE__ */ W(h, {
474
+ /* @__PURE__ */ G(h, {
469
475
  size: 100,
470
476
  className: p,
471
477
  "aria-hidden": !0
472
478
  }),
473
- /* @__PURE__ */ W("span", {
479
+ /* @__PURE__ */ G("span", {
474
480
  className: a("mt-5", l?.titleClassName ?? "dial-h3-text"),
475
481
  children: d
476
482
  }),
477
- /* @__PURE__ */ W("span", {
483
+ /* @__PURE__ */ G("span", {
478
484
  className: a("mt-4", l?.subtitleClassName ?? "dial-small-text"),
479
485
  children: f
480
486
  })
481
487
  ]
482
488
  })
483
489
  });
484
- }, Fe = (e, n, i = {}) => {
490
+ }, Ie = (e, n, i = {}) => {
485
491
  let { screenshotName: a = "Screenshot.png", pastedTextName: s = "Pasted text" } = i;
486
492
  return { handlePaste: o((i) => {
487
493
  if (!i.clipboardData) return;
@@ -492,7 +498,7 @@ var K = () => `${Date.now()}-${Math.random().toString(36).slice(2)}`, pe = (e) =
492
498
  let i = e.getAsFile();
493
499
  if (!i) continue;
494
500
  let o = new File([i], a, { type: i.type }), s = {
495
- id: K(),
501
+ id: q(),
496
502
  name: a,
497
503
  contentType: i.type,
498
504
  file: o,
@@ -508,7 +514,7 @@ var K = () => `${Date.now()}-${Math.random().toString(36).slice(2)}`, pe = (e) =
508
514
  let l = i.clipboardData.getData("text/plain");
509
515
  if (l.length > n) {
510
516
  let n = l.trim(), a = (n.length > 80 ? `${n.slice(0, 80).trimEnd()}…` : n) || s, o = new File([l], a, { type: "text/plain" }), c = {
511
- id: K(),
517
+ id: q(),
512
518
  name: a,
513
519
  contentType: "text/plain",
514
520
  file: o,
@@ -523,6 +529,6 @@ var K = () => `${Date.now()}-${Math.random().toString(36).slice(2)}`, pe = (e) =
523
529
  a,
524
530
  s
525
531
  ]) };
526
- }, Ie = 100;
532
+ }, Le = 100;
527
533
  //#endregion
528
- export { xe as ATTACHMENT_COLLAPSE_THRESHOLD, Z as AttachmentCard, Ne as AttachmentGroup, je as AttachmentTray, Pe as FileDndOverlay, X as LazyImageLoadStatus, Ie as MAX_UPLOADS_PER_MINUTE, K as generateAttachmentId, q as getAttachmentCardState, _e as getAttachmentIcon, ye as getExtFromContentType, pe as getNameWithoutExtension, ge as isMimeTypeAllowed, he as mimeTypesToExtensionLabels, Fe as useClipboardPaste, ke as useLazyImageLoad };
534
+ export { xe as ATTACHMENT_COLLAPSE_THRESHOLD, Q as AttachmentCard, Ne as AttachmentGroup, je as AttachmentTray, Fe as FileDndOverlay, Z as LazyImageLoadStatus, Le as MAX_UPLOADS_PER_MINUTE, q as generateAttachmentId, J as getAttachmentCardState, _e as getAttachmentIcon, ye as getExtFromContentType, pe as getNameWithoutExtension, ge as isMimeTypeAllowed, he as mimeTypesToExtensionLabels, Ie as useClipboardPaste, ke 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.1.0-dev.297",
4
+ "version": "1.1.0-dev.299",
5
5
  "license": "Apache-2.0",
6
6
  "type": "module",
7
7
  "main": "./index.js",
@@ -17,10 +17,10 @@
17
17
  }
18
18
  },
19
19
  "peerDependencies": {
20
- "@epam/ai-dial-chat-shared": "1.1.0-dev.297",
20
+ "@epam/ai-dial-chat-shared": "1.1.0-dev.299",
21
21
  "@tabler/icons-react": "^3.44.0",
22
22
  "react": "^19.0.0",
23
- "@epam/ai-dial-ui-kit": "^0.14.0-dev.13"
23
+ "@epam/ai-dial-ui-kit": "^0.14.0-dev.15"
24
24
  },
25
25
  "repository": {
26
26
  "type": "git",