@epam/ai-dial-skill-editor 1.1.0-dev.433 → 1.1.0-dev.438

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 (3) hide show
  1. package/components/SkillEditor/SkillEditor.d.ts.map +1 -1
  2. package/index.js +287 -284
  3. package/package.json +3 -3
package/components/SkillEditor/SkillEditor.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"SkillEditor.d.ts","sourceRoot":"","sources":["../../../src/components/SkillEditor/SkillEditor.tsx"],"names":[],"mappings":"AA+BA,OAAO,0CAA0C,CAAC;AAClD,OAAO,0CAA0C,CAAC;AAClD,OAAO,EAEL,EAAE,EAQH,MAAM,OAAO,CAAC;AAEf,OAAO,KAAK,EACV,gBAAgB,EAGjB,MAAM,iCAAiC,CAAC;AAsBzC,qFAAqF;AACrF,eAAO,MAAM,WAAW,EAAE,EAAE,CAAC,gBAAgB,CAie5C,CAAC"}
1
+ {"version":3,"file":"SkillEditor.d.ts","sourceRoot":"","sources":["../../../src/components/SkillEditor/SkillEditor.tsx"],"names":[],"mappings":"AAiCA,OAAO,0CAA0C,CAAC;AAClD,OAAO,0CAA0C,CAAC;AAClD,OAAO,EAEL,EAAE,EAQH,MAAM,OAAO,CAAC;AAEf,OAAO,KAAK,EACV,gBAAgB,EAGjB,MAAM,iCAAiC,CAAC;AAsBzC,qFAAqF;AACrF,eAAO,MAAM,WAAW,EAAE,EAAE,CAAC,gBAAgB,CA2e5C,CAAC"}
package/index.js CHANGED
@@ -1,97 +1,97 @@
1
- import { MARKDOWN_EDITOR_MAX_HEIGHT_CLASS_NAME as e, buildCssVars as t, formatFileSize as n, mergeClasses as r } from "@epam/ai-dial-chat-shared";
2
- import { Fragment as i, jsx as a, jsxs as o } from "react/jsx-runtime";
3
- import { Accordion as s, CaptionText as c, DIAL_ICON_SIZE as l, DIAL_KIT_ICON_STROKE as u, EditorThemes as d, ErrorText as f, FileDropzone as p, GhostButton as m, GhostIconButton as h, Input as g, NeutralButton as _, Popup as v, PopupSize as ee, PrimaryButton as te, Spinner as y, Textarea as b } from "@epam/ai-dial-ui-kit";
4
- import { IconArrowNarrowLeft as x, IconFileText as ne, IconPlus as S, IconTrashX as re, IconUpload as ie } from "@tabler/icons-react";
5
- import { Suspense as ae, lazy as C, useCallback as w, useEffect as T, useId as E, useMemo as D, useRef as O, useState as k } from "react";
6
- import { DialFileNodeType as A, DialFoldersTree as oe } from "@epam/ai-dial-react-file-manager";
7
- import { LazyMarkdownEditor as j } from "@epam/ai-dial-ui-kit/editors";
8
- var M = {
1
+ import { MARKDOWN_EDITOR_MAX_HEIGHT_CLASS_NAME as e, MARKDOWN_EDITOR_PREVIEW_LIST_CLASS_NAME as t, buildCssVars as n, formatFileSize as r, mergeClasses as i, useAvailableHeightCap as a } from "@epam/ai-dial-chat-shared";
2
+ import { Fragment as o, jsx as s, jsxs as c } from "react/jsx-runtime";
3
+ import { Accordion as l, CaptionText as u, DIAL_ICON_SIZE as d, DIAL_KIT_ICON_STROKE as f, EditorThemes as p, ErrorText as m, FileDropzone as h, GhostButton as ee, GhostIconButton as g, Input as _, NeutralButton as v, Popup as te, PopupSize as ne, PrimaryButton as re, Spinner as y, Textarea as b } from "@epam/ai-dial-ui-kit";
4
+ import { IconArrowNarrowLeft as x, IconFileText as ie, IconPlus as S, IconTrashX as ae, IconUpload as C } from "@tabler/icons-react";
5
+ import { Suspense as w, lazy as T, useCallback as E, useEffect as D, useId as O, useMemo as k, useRef as A, useState as j } from "react";
6
+ import { DialFileNodeType as M, DialFoldersTree as oe } from "@epam/ai-dial-react-file-manager";
7
+ import { LazyMarkdownEditor as N } from "@epam/ai-dial-ui-kit/editors";
8
+ var P = {
9
9
  headerBorder: "_headerBorder_1kidu_1",
10
10
  footerBorder: "_footerBorder_1kidu_5",
11
11
  sidebarBorder: "_sidebarBorder_1kidu_9"
12
- }, N = ({ title: e, onBack: n, backAriaLabel: i = "Back", actions: s, leftContent: c, rightContent: d, isSaving: f = !1, labels: p, styles: m, dir: g }) => {
13
- let _ = E(), v = f ? p?.savingStatusLabel ?? "Saving" : "";
14
- return /* @__PURE__ */ o("div", {
15
- dir: g,
12
+ }, F = ({ title: e, onBack: t, backAriaLabel: r = "Back", actions: a, leftContent: o, rightContent: l, isSaving: u = !1, labels: p, styles: m, dir: h }) => {
13
+ let ee = O(), _ = u ? p?.savingStatusLabel ?? "Saving" : "";
14
+ return /* @__PURE__ */ c("div", {
15
+ dir: h,
16
16
  className: "flex min-h-0 flex-1 flex-col",
17
- style: t({
17
+ style: n({
18
18
  "--el-header-border-color": m?.colors?.headerBorderColor,
19
19
  "--el-sidebar-border-color": m?.colors?.sidebarBorderColor
20
20
  }),
21
21
  children: [
22
- /* @__PURE__ */ a("span", {
22
+ /* @__PURE__ */ s("span", {
23
23
  role: "status",
24
24
  "aria-live": "polite",
25
25
  className: "sr-only",
26
- id: _,
27
- children: v
26
+ id: ee,
27
+ children: _
28
28
  }),
29
- /* @__PURE__ */ o("div", {
30
- className: r("flex items-center justify-between gap-2 border-b px-4 py-2 desktop:px-8 desktop:pb-3 desktop:pt-3", M.headerBorder),
31
- children: [/* @__PURE__ */ o("div", {
29
+ /* @__PURE__ */ c("div", {
30
+ className: i("flex items-center justify-between gap-2 border-b px-4 py-2 desktop:px-8 desktop:pb-3 desktop:pt-3", P.headerBorder),
31
+ children: [/* @__PURE__ */ c("div", {
32
32
  className: "flex min-w-0 flex-1 items-center gap-2",
33
- children: [/* @__PURE__ */ a(h, {
34
- icon: /* @__PURE__ */ a(x, {
35
- size: l.LG,
36
- stroke: u,
33
+ children: [/* @__PURE__ */ s(g, {
34
+ icon: /* @__PURE__ */ s(x, {
35
+ size: d.LG,
36
+ stroke: f,
37
37
  "aria-hidden": !0,
38
38
  className: "rtl:scale-x-[-1]"
39
39
  }),
40
- "aria-label": i,
41
- onClick: n
42
- }), /* @__PURE__ */ a("h1", {
40
+ "aria-label": r,
41
+ onClick: t
42
+ }), /* @__PURE__ */ s("h1", {
43
43
  className: "dial-h2-text min-w-0 truncate",
44
44
  children: e
45
45
  })]
46
- }), s != null && /* @__PURE__ */ a("div", {
46
+ }), a != null && /* @__PURE__ */ s("div", {
47
47
  className: "hidden shrink-0 items-center gap-2 desktop:flex",
48
- children: s
48
+ children: a
49
49
  })]
50
50
  }),
51
- /* @__PURE__ */ o("div", {
51
+ /* @__PURE__ */ c("div", {
52
52
  className: "flex flex-1 flex-col overflow-y-auto desktop:flex-row desktop:overflow-hidden",
53
- children: [/* @__PURE__ */ a("div", {
54
- className: r(d == null ? "desktop:flex-1" : "desktop:w-[360px] desktop:shrink-0 desktop:overflow-y-auto desktop:border-e", "desktop:overflow-y-auto", d == null ? void 0 : M.sidebarBorder),
55
- children: c
56
- }), d != null && /* @__PURE__ */ a("div", {
53
+ children: [/* @__PURE__ */ s("div", {
54
+ className: i(l == null ? "desktop:flex-1" : "desktop:w-[360px] desktop:shrink-0 desktop:overflow-y-auto desktop:border-e", "desktop:overflow-y-auto", l == null ? void 0 : P.sidebarBorder),
55
+ children: o
56
+ }), l != null && /* @__PURE__ */ s("div", {
57
57
  className: "desktop:flex-1 desktop:overflow-y-auto",
58
- children: d
58
+ children: l
59
59
  })]
60
60
  }),
61
- s != null && /* @__PURE__ */ a("div", {
62
- className: r("flex shrink-0 flex-row-reverse items-center gap-2 border-t px-4 py-2 desktop:hidden [&>*]:flex-1", M.footerBorder),
63
- children: s
61
+ a != null && /* @__PURE__ */ s("div", {
62
+ className: i("flex shrink-0 flex-row-reverse items-center gap-2 border-t px-4 py-2 desktop:hidden [&>*]:flex-1", P.footerBorder),
63
+ children: a
64
64
  })
65
65
  ]
66
66
  });
67
- }, P = (e) => !!e.dataTransfer?.types.includes("Files"), se = (e) => {
68
- let [t, n] = k(!1), r = O(0);
67
+ }, I = (e) => !!e.dataTransfer?.types.includes("Files"), se = (e) => {
68
+ let [t, n] = j(!1), r = A(0);
69
69
  return {
70
70
  isDragActive: t,
71
71
  dropZoneHandlers: {
72
- onDragEnter: w((e) => {
73
- P(e) && (e.preventDefault(), r.current += 1, n(!0));
72
+ onDragEnter: E((e) => {
73
+ I(e) && (e.preventDefault(), r.current += 1, n(!0));
74
74
  }, []),
75
- onDragLeave: w((e) => {
76
- P(e) && (--r.current, r.current <= 0 && (r.current = 0, n(!1)));
75
+ onDragLeave: E((e) => {
76
+ I(e) && (--r.current, r.current <= 0 && (r.current = 0, n(!1)));
77
77
  }, []),
78
- onDragOver: w((e) => {
79
- P(e) && e.preventDefault();
78
+ onDragOver: E((e) => {
79
+ I(e) && e.preventDefault();
80
80
  }, []),
81
- onDrop: w((t) => {
82
- if (!P(t)) return;
81
+ onDrop: E((t) => {
82
+ if (!I(t)) return;
83
83
  t.preventDefault(), r.current = 0, n(!1);
84
84
  let i = Array.from(t.dataTransfer?.files ?? []);
85
85
  i.length > 0 && e(i);
86
86
  }, [e])
87
87
  }
88
88
  };
89
- }, F = "SKILL.md", I = /* @__PURE__ */ function(e) {
89
+ }, L = "SKILL.md", R = /* @__PURE__ */ function(e) {
90
90
  return e.File = "file", e.Folder = "folder", e;
91
- }({}), L = (e) => {
91
+ }({}), z = (e) => {
92
92
  let t = e.lastIndexOf("/");
93
93
  return t === -1 ? null : e.slice(0, t);
94
- }, R = (e) => {
94
+ }, B = (e) => {
95
95
  let t = e.lastIndexOf("/");
96
96
  return t === -1 ? e : e.slice(t + 1);
97
97
  }, ce = (e) => {
@@ -100,30 +100,30 @@ var M = {
100
100
  if (n) return n;
101
101
  let r = {
102
102
  path: e,
103
- name: R(e),
104
- nodeType: A.FOLDER,
105
- parentPath: L(e),
103
+ name: B(e),
104
+ nodeType: M.FOLDER,
105
+ parentPath: z(e),
106
106
  folderId: e,
107
107
  items: []
108
108
  };
109
109
  return t.set(e, r), r;
110
110
  };
111
111
  for (let r of e) {
112
- if (r.kind === I.Folder) {
112
+ if (r.kind === R.Folder) {
113
113
  n(r.path);
114
114
  continue;
115
115
  }
116
116
  t.set(r.path, {
117
117
  path: r.path,
118
118
  name: r.name,
119
- nodeType: A.ITEM,
120
- parentPath: L(r.path),
121
- folderId: L(r.path) ?? ""
119
+ nodeType: M.ITEM,
120
+ parentPath: z(r.path),
121
+ folderId: z(r.path) ?? ""
122
122
  });
123
123
  }
124
124
  for (let t of [...e]) {
125
- let e = L(t.path);
126
- for (; e != null;) n(e), e = L(e);
125
+ let e = z(t.path);
126
+ for (; e != null;) n(e), e = z(e);
127
127
  }
128
128
  let r = [];
129
129
  for (let e of t.values()) {
@@ -138,383 +138,383 @@ var M = {
138
138
  }, le = ({ isVisible: e, labels: t }) => {
139
139
  if (!e) return null;
140
140
  let n = t ?? {};
141
- return /* @__PURE__ */ a("div", {
141
+ return /* @__PURE__ */ s("div", {
142
142
  role: "status",
143
143
  "aria-live": "polite",
144
- className: r("pointer-events-none absolute inset-0 z-[100] flex items-center justify-center backdrop-blur-sm"),
145
- children: /* @__PURE__ */ o("div", {
144
+ className: i("pointer-events-none absolute inset-0 z-[100] flex items-center justify-center backdrop-blur-sm"),
145
+ children: /* @__PURE__ */ c("div", {
146
146
  className: "flex flex-col items-center text-center",
147
147
  children: [
148
- /* @__PURE__ */ a(ie, {
148
+ /* @__PURE__ */ s(C, {
149
149
  size: 100,
150
150
  className: "text-accent-primary",
151
151
  "aria-hidden": !0,
152
- stroke: u
152
+ stroke: f
153
153
  }),
154
- /* @__PURE__ */ a("span", {
154
+ /* @__PURE__ */ s("span", {
155
155
  className: "dial-h3-text mt-5",
156
156
  children: n.dropOverlayTitle ?? "Upload files"
157
157
  }),
158
- /* @__PURE__ */ a("span", {
158
+ /* @__PURE__ */ s("span", {
159
159
  className: "dial-small-text mt-4",
160
160
  children: n.dropOverlaySubtitle ?? "Drop files here to add them to this skill"
161
161
  })
162
162
  ]
163
163
  })
164
164
  });
165
- }, ue = /* @__PURE__ */ function(e) {
165
+ }, V = /* @__PURE__ */ function(e) {
166
166
  return e.SupportingFile = "supporting-file", e.Manifest = "manifest", e;
167
- }({}), z = /* @__PURE__ */ function(e) {
167
+ }({}), H = /* @__PURE__ */ function(e) {
168
168
  return e.Valid = "valid", e.Invalid = "invalid", e;
169
- }({}), B = (e) => (e.webkitRelativePath || e.name).replace(/\\/g, "/"), V = 0, H = () => `skill-file-candidate-${++V}`, de = ({ isOpen: e, onClose: t, fileActions: r, initialFiles: s, labels: c }) => {
170
- let l = c ?? {}, [d, g] = k([]), [_, b] = k(/* @__PURE__ */ new Map()), [x, S] = k([]), [ie, ae] = k(!1), [C, w] = k(), [D, O] = k(!1), A = E(), oe = (e) => {
169
+ }({}), ue = (e) => (e.webkitRelativePath || e.name).replace(/\\/g, "/"), U = 0, W = () => `skill-file-candidate-${++U}`, de = ({ isOpen: e, onClose: t, fileActions: n, initialFiles: i, labels: a }) => {
170
+ let l = a ?? {}, [u, d] = j([]), [p, _] = j(/* @__PURE__ */ new Map()), [v, b] = j([]), [x, S] = j(!1), [C, w] = j(), [T, E] = j(!1), k = O(), A = (e) => {
171
171
  let t = e.map((e) => ({
172
- id: H(),
172
+ id: W(),
173
173
  file: e,
174
- path: B(e)
174
+ path: ue(e)
175
175
  }));
176
- w(void 0), g((e) => [...e, ...t]);
177
- }, j = (e) => {
178
- g((t) => t.filter((t) => t.id !== e));
176
+ w(void 0), d((e) => [...e, ...t]);
177
+ }, M = (e) => {
178
+ d((t) => t.filter((t) => t.id !== e));
179
179
  };
180
- T(() => {
181
- e && (g((s ?? []).map((e) => ({
182
- id: H(),
180
+ D(() => {
181
+ e && (d((i ?? []).map((e) => ({
182
+ id: W(),
183
183
  file: e,
184
- path: B(e)
185
- }))), b(/* @__PURE__ */ new Map()), S([]), w(void 0));
186
- }, [e]), T(() => {
184
+ path: ue(e)
185
+ }))), _(/* @__PURE__ */ new Map()), b([]), w(void 0));
186
+ }, [e]), D(() => {
187
187
  if (!e) return;
188
188
  let t = !1;
189
- if (d.length === 0) {
190
- b(/* @__PURE__ */ new Map()), S([]);
189
+ if (u.length === 0) {
190
+ _(/* @__PURE__ */ new Map()), b([]);
191
191
  return;
192
192
  }
193
- return ae(!0), r.validateBatch(d).then(({ results: e, batchErrors: n }) => {
194
- t || (b(new Map(e.map((e) => [e.candidateId, e]))), S(n.map((e) => e.message)));
193
+ return S(!0), n.validateBatch(u).then(({ results: e, batchErrors: n }) => {
194
+ t || (_(new Map(e.map((e) => [e.candidateId, e]))), b(n.map((e) => e.message)));
195
195
  }).finally(() => {
196
- t || ae(!1);
196
+ t || S(!1);
197
197
  }), () => {
198
198
  t = !0;
199
199
  };
200
- }, [d, e]);
201
- let M = d.some((e) => _.get(e.id)?.status === z.Invalid), N = d.length > 0 && d.every((e) => _.get(e.id)?.status === z.Invalid), P = d.length > 0 && !M && x.length === 0 && !ie && !D, se = async () => {
202
- O(!0), w(void 0);
200
+ }, [u, e]);
201
+ let oe = u.some((e) => p.get(e.id)?.status === H.Invalid), N = u.length > 0 && u.every((e) => p.get(e.id)?.status === H.Invalid), P = u.length > 0 && !oe && v.length === 0 && !x && !T, F = async () => {
202
+ E(!0), w(void 0);
203
203
  try {
204
- let { results: e, batchErrors: n } = await r.validateBatch(d), i = new Map(e.map((e) => [e.candidateId, e]));
205
- if (b(i), S(n.map((e) => e.message)), d.some((e) => i.get(e.id)?.status === z.Invalid) || n.length > 0) return;
206
- let a = await r.commitBatch(d);
204
+ let { results: e, batchErrors: r } = await n.validateBatch(u), i = new Map(e.map((e) => [e.candidateId, e]));
205
+ if (_(i), b(r.map((e) => e.message)), u.some((e) => i.get(e.id)?.status === H.Invalid) || r.length > 0) return;
206
+ let a = await n.commitBatch(u);
207
207
  if (a.error) {
208
208
  w(a.error);
209
209
  return;
210
210
  }
211
211
  t();
212
212
  } finally {
213
- O(!1);
213
+ E(!1);
214
214
  }
215
215
  };
216
- return /* @__PURE__ */ a(v, {
216
+ return /* @__PURE__ */ s(te, {
217
217
  open: e,
218
218
  header: l.uploadDialogTitle ?? "Upload files from device",
219
- size: ee.Sm,
219
+ size: ne.Sm,
220
220
  closeAriaLabel: l.uploadDialogCloseAriaLabel ?? "Close",
221
221
  onClose: t,
222
- footer: /* @__PURE__ */ o("div", {
222
+ footer: /* @__PURE__ */ c("div", {
223
223
  className: "flex min-h-[44px] items-center justify-end gap-2 px-6 py-4",
224
- children: [/* @__PURE__ */ a(m, {
224
+ children: [/* @__PURE__ */ s(ee, {
225
225
  label: l.uploadCancelLabel ?? "Cancel",
226
226
  onClick: t
227
- }), /* @__PURE__ */ a(te, {
227
+ }), /* @__PURE__ */ s(re, {
228
228
  label: l.uploadConfirmLabel ?? "Add",
229
- iconBefore: D ? /* @__PURE__ */ a(y, {
229
+ iconBefore: T ? /* @__PURE__ */ s(y, {
230
230
  size: 16,
231
231
  ariaLabel: ""
232
232
  }) : void 0,
233
- onClick: () => void se(),
233
+ onClick: () => void F(),
234
234
  disabled: !P
235
235
  })]
236
236
  }),
237
- children: /* @__PURE__ */ o("div", {
237
+ children: /* @__PURE__ */ c("div", {
238
238
  className: "flex flex-col gap-4 px-6 py-4",
239
239
  children: [
240
- /* @__PURE__ */ a(p, {
241
- label: /* @__PURE__ */ o(i, { children: [/* @__PURE__ */ a("span", {
240
+ /* @__PURE__ */ s(h, {
241
+ label: /* @__PURE__ */ c(o, { children: [/* @__PURE__ */ s("span", {
242
242
  className: "desktop:hidden",
243
243
  children: l.uploadDropZoneMobileLabel ?? "Click here to upload"
244
- }), /* @__PURE__ */ a("span", {
244
+ }), /* @__PURE__ */ s("span", {
245
245
  className: "hidden desktop:inline",
246
246
  children: l.uploadDropZoneLabel ?? "Drag and drop it or click here to upload"
247
247
  })] }),
248
248
  ariaLabel: l.uploadDropZoneAriaLabel ?? "Upload files",
249
249
  multiple: !0,
250
250
  className: N ? "border-error hover:border-error" : void 0,
251
- onChange: oe
251
+ onChange: A
252
252
  }),
253
- /* @__PURE__ */ a("span", {
253
+ /* @__PURE__ */ s("span", {
254
254
  role: "status",
255
255
  "aria-live": "polite",
256
256
  className: "sr-only",
257
- id: A,
258
- children: x.map((e) => `${l.uploadBatchErrorAriaPrefix ?? "Upload error: "}${e}`).join(" ")
257
+ id: k,
258
+ children: v.map((e) => `${l.uploadBatchErrorAriaPrefix ?? "Upload error: "}${e}`).join(" ")
259
259
  }),
260
- x.map((e) => /* @__PURE__ */ a(f, { text: e }, e)),
261
- d.length > 0 && /* @__PURE__ */ a("ul", {
260
+ v.map((e) => /* @__PURE__ */ s(m, { text: e }, e)),
261
+ u.length > 0 && /* @__PURE__ */ s("ul", {
262
262
  className: "flex flex-col gap-2",
263
- children: d.map((e) => {
264
- let t = _.get(e.id), r = t?.kind === ue.Manifest, i = t?.status === z.Invalid;
265
- return /* @__PURE__ */ o("li", {
263
+ children: u.map((e) => {
264
+ let t = p.get(e.id), n = t?.kind === V.Manifest, i = t?.status === H.Invalid;
265
+ return /* @__PURE__ */ c("li", {
266
266
  className: "flex items-center gap-2 rounded-lg border border-tertiary p-2",
267
267
  children: [
268
- /* @__PURE__ */ a(ne, {
268
+ /* @__PURE__ */ s(ie, {
269
269
  size: 20,
270
270
  "aria-hidden": !0,
271
- stroke: u
271
+ stroke: f
272
272
  }),
273
- /* @__PURE__ */ o("div", {
273
+ /* @__PURE__ */ c("div", {
274
274
  className: "flex min-w-0 flex-1 flex-col",
275
275
  children: [
276
- /* @__PURE__ */ a("span", {
276
+ /* @__PURE__ */ s("span", {
277
277
  className: "dial-small-text truncate",
278
278
  children: e.path
279
279
  }),
280
- /* @__PURE__ */ a("span", {
280
+ /* @__PURE__ */ s("span", {
281
281
  className: "dial-tiny-text text-secondary",
282
- children: n(e.file.size)
282
+ children: r(e.file.size)
283
283
  }),
284
- i && t?.error && /* @__PURE__ */ a(f, { text: t.error }),
285
- r && !i && /* @__PURE__ */ a("span", {
284
+ i && t?.error && /* @__PURE__ */ s(m, { text: t.error }),
285
+ n && !i && /* @__PURE__ */ s("span", {
286
286
  className: "dial-tiny-text text-secondary",
287
287
  children: l.uploadManifestRowNote ?? "Will replace this Skill's name, description, and instructions"
288
288
  })
289
289
  ]
290
290
  }),
291
- /* @__PURE__ */ a(h, {
292
- icon: /* @__PURE__ */ a(re, {
291
+ /* @__PURE__ */ s(g, {
292
+ icon: /* @__PURE__ */ s(ae, {
293
293
  size: 16,
294
294
  "aria-hidden": !0,
295
- stroke: u
295
+ stroke: f
296
296
  }),
297
297
  "aria-label": l.uploadRemoveCandidateLabel?.(e.path) ?? `Remove ${e.path}`,
298
- onClick: () => j(e.id)
298
+ onClick: () => M(e.id)
299
299
  })
300
300
  ]
301
301
  }, e.id);
302
302
  })
303
303
  }),
304
- C && /* @__PURE__ */ a(f, { text: C })
304
+ C && /* @__PURE__ */ s(m, { text: C })
305
305
  ]
306
306
  })
307
307
  });
308
- }, U = {
308
+ }, fe = {
309
309
  title: "_title_65glc_1",
310
310
  helperText: "_helperText_65glc_5"
311
- }, fe = C(async () => {
312
- let { MarkdownEditor: e } = await j();
311
+ }, pe = T(async () => {
312
+ let { MarkdownEditor: e } = await N();
313
313
  return { default: e };
314
- }), W = ({ initialValues: n, files: p, selectedPath: h, onSelectedPathChange: v, expandedPaths: ee, onExpandedPathsChange: x, isLoading: ne = !1, hasLoadError: ie = !1, isSubmitting: C = !1, errors: E, submitError: A, conflict: j, onReloadLatest: M, isNameReadOnly: P = !1, onDirtyChange: L, fileActions: R, supportingFileContent: ue, onSubmit: z, onCancel: B, onBack: V, backAriaLabel: H, title: W, onRetry: pe, labels: G, styles: me, dir: he, instructionsEditorTheme: ge = d.light }) => {
315
- let [K, q] = k({
316
- name: n?.name ?? "",
317
- description: n?.description ?? "",
318
- instructions: n?.instructions ?? ""
319
- }), _e = O(n), ve = _e.current !== n, ye = O(p);
320
- T(() => {
321
- _e.current = n, q({
322
- name: n?.name ?? "",
323
- description: n?.description ?? "",
324
- instructions: n?.instructions ?? ""
325
- }), ye.current = p;
326
- }, [n]);
327
- let be = (e) => JSON.stringify([...e].sort((e, t) => e.path.localeCompare(t.path))), xe = O(!1);
328
- T(() => {
329
- if (ve) return;
314
+ }), G = ({ initialValues: r, files: h, selectedPath: g, onSelectedPathChange: te, expandedPaths: ne, onExpandedPathsChange: x, isLoading: ie = !1, hasLoadError: C = !1, isSubmitting: T = !1, errors: O, submitError: M, conflict: N, onReloadLatest: P, isNameReadOnly: I = !1, onDirtyChange: z, fileActions: B, supportingFileContent: V, onSubmit: H, onCancel: ue, onBack: U, backAriaLabel: W, title: G, onRetry: me, labels: he, styles: ge, dir: _e, instructionsEditorTheme: ve = p.light }) => {
315
+ let [K, q] = j({
316
+ name: r?.name ?? "",
317
+ description: r?.description ?? "",
318
+ instructions: r?.instructions ?? ""
319
+ }), ye = a(), be = A(r), xe = be.current !== r, Se = A(h);
320
+ D(() => {
321
+ be.current = r, q({
322
+ name: r?.name ?? "",
323
+ description: r?.description ?? "",
324
+ instructions: r?.instructions ?? ""
325
+ }), Se.current = h;
326
+ }, [r]);
327
+ let Ce = (e) => JSON.stringify([...e].sort((e, t) => e.path.localeCompare(t.path))), we = A(!1);
328
+ D(() => {
329
+ if (xe) return;
330
330
  let e = {
331
- name: n?.name ?? "",
332
- description: n?.description ?? "",
333
- instructions: n?.instructions ?? ""
334
- }, t = JSON.stringify(K) !== JSON.stringify(e) || be(p) !== be(ye.current);
335
- t !== xe.current && (xe.current = t, L?.(t));
331
+ name: r?.name ?? "",
332
+ description: r?.description ?? "",
333
+ instructions: r?.instructions ?? ""
334
+ }, t = JSON.stringify(K) !== JSON.stringify(e) || Ce(h) !== Ce(Se.current);
335
+ t !== we.current && (we.current = t, z?.(t));
336
336
  }, [
337
337
  K,
338
- p,
339
- n,
340
- ve,
341
- L
338
+ h,
339
+ r,
340
+ xe,
341
+ z
342
342
  ]);
343
- let [Se, Ce] = k(F), J = h ?? Se, Y = w((e) => {
344
- Ce(e), v?.(e);
345
- }, [v]), [we, Te] = k([]), Ee = ee ?? we, De = D(() => new Set(Ee), [Ee]), Oe = w((e) => {
343
+ let [Te, Ee] = j(L), J = g ?? Te, Y = E((e) => {
344
+ Ee(e), te?.(e);
345
+ }, [te]), [De, Oe] = j([]), ke = ne ?? De, Ae = k(() => new Set(ke), [ke]), je = E((e) => {
346
346
  let t = [...e];
347
- Te(t), x?.(t);
348
- }, [x]), [X, ke] = k(!1), [Ae, je] = k(), [Me, Ne] = k(!1), { isDragActive: Pe, dropZoneHandlers: Fe } = se(w((e) => {
349
- X || (je(e), ke(!0));
350
- }, [X])), Z = G ?? {}, Q = me?.colors, Ie = me?.typography ?? {}, Le = Ie.titleClassName ?? "dial-body-semi-text", Re = Ie.helperTextClassName ?? "dial-tiny-semi-text", ze = Ie.removeIconClassName ?? "text-secondary", Be = t({
347
+ Oe(t), x?.(t);
348
+ }, [x]), [X, Me] = j(!1), [Ne, Pe] = j(), [Fe, Ie] = j(!1), { isDragActive: Le, dropZoneHandlers: Re } = se(E((e) => {
349
+ X || (Pe(e), Me(!0));
350
+ }, [X])), Z = he ?? {}, Q = ge?.colors, ze = ge?.typography ?? {}, Be = ze.titleClassName ?? "dial-body-semi-text", Ve = ze.helperTextClassName ?? "dial-tiny-semi-text", He = ze.removeIconClassName ?? "text-secondary", Ue = n({
351
351
  "--se-title-color": Q?.title,
352
352
  "--se-helper-text-color": Q?.helperText
353
- }), Ve = Q?.border ? { colors: {
353
+ }), We = Q?.border ? { colors: {
354
354
  headerBorderColor: Q.border,
355
355
  sidebarBorderColor: Q.border
356
- } } : void 0, He = D(() => ce([{
357
- path: F,
358
- name: F,
359
- kind: I.File
360
- }, ...p]), [p]), $ = D(() => p.find((e) => e.path === J), [p, J]), Ue = w((e) => {
356
+ } } : void 0, Ge = k(() => ce([{
357
+ path: L,
358
+ name: L,
359
+ kind: R.File
360
+ }, ...h]), [h]), $ = k(() => h.find((e) => e.path === J), [h, J]), Ke = E((e) => {
361
361
  Y(e.path);
362
- }, [Y]), We = w((e) => {
363
- R.onRemoveNode(e), J === e && Y(F);
362
+ }, [Y]), qe = E((e) => {
363
+ B.onRemoveNode(e), J === e && Y(L);
364
364
  }, [
365
- R,
365
+ B,
366
366
  J,
367
367
  Y
368
- ]), Ge = w((e) => e.path === "SKILL.md" ? [] : [{
368
+ ]), Je = E((e) => e.path === "SKILL.md" ? [] : [{
369
369
  key: "remove",
370
370
  label: Z.removeLabel ?? "Remove",
371
- icon: /* @__PURE__ */ a(re, {
372
- size: l.SM,
373
- className: ze,
371
+ icon: /* @__PURE__ */ s(ae, {
372
+ size: d.SM,
373
+ className: He,
374
374
  "aria-hidden": !0,
375
- stroke: u
375
+ stroke: f
376
376
  }),
377
- onClick: () => We(e.path)
377
+ onClick: () => qe(e.path)
378
378
  }], [
379
379
  Z.removeLabel,
380
- ze,
381
- We
382
- ]), Ke = /* @__PURE__ */ o("div", {
380
+ He,
381
+ qe
382
+ ]), Ye = /* @__PURE__ */ c("div", {
383
383
  className: "flex flex-col gap-2 desktop:gap-5",
384
- children: [/* @__PURE__ */ o("div", {
384
+ children: [/* @__PURE__ */ c("div", {
385
385
  className: "flex items-center justify-between",
386
- children: [/* @__PURE__ */ a("span", {
387
- className: r(U.title, Le),
386
+ children: [/* @__PURE__ */ s("span", {
387
+ className: i(fe.title, Be),
388
388
  children: Z.filesHeading ?? "Files"
389
- }), /* @__PURE__ */ a(_, {
389
+ }), /* @__PURE__ */ s(v, {
390
390
  label: Z.addUploadLabel ?? "Upload from device",
391
- iconBefore: /* @__PURE__ */ a(S, {
391
+ iconBefore: /* @__PURE__ */ s(S, {
392
392
  size: 16,
393
393
  "aria-hidden": !0,
394
- stroke: u
394
+ stroke: f
395
395
  }),
396
396
  onClick: () => {
397
- je(void 0), ke(!0);
397
+ Pe(void 0), Me(!0);
398
398
  }
399
399
  })]
400
- }), /* @__PURE__ */ a("div", {
400
+ }), /* @__PURE__ */ s("div", {
401
401
  role: "tree",
402
402
  "aria-label": Z.filesTreeAriaLabel ?? "Skill files",
403
- children: /* @__PURE__ */ a(oe, {
404
- items: He,
403
+ children: /* @__PURE__ */ s(oe, {
404
+ items: Ge,
405
405
  showFiles: !0,
406
406
  selectedPath: J,
407
- expandedPaths: De,
408
- onExpandedPathsChange: Oe,
409
- onItemClick: Ue,
410
- getContextMenuItems: Ge,
407
+ expandedPaths: Ae,
408
+ onExpandedPathsChange: je,
409
+ onItemClick: Ke,
410
+ getContextMenuItems: Je,
411
411
  rootItemPath: ""
412
412
  })
413
413
  })]
414
- }), qe = /* @__PURE__ */ o(i, { children: [/* @__PURE__ */ a(_, {
414
+ }), Xe = /* @__PURE__ */ c(o, { children: [/* @__PURE__ */ s(v, {
415
415
  label: Z.cancelLabel ?? "Cancel",
416
- onClick: B,
417
- disabled: C
418
- }), /* @__PURE__ */ a(te, {
416
+ onClick: ue,
417
+ disabled: T
418
+ }), /* @__PURE__ */ s(re, {
419
419
  label: Z.createLabel ?? "Create",
420
- iconBefore: C ? /* @__PURE__ */ a(y, {
420
+ iconBefore: T ? /* @__PURE__ */ s(y, {
421
421
  size: 16,
422
422
  ariaLabel: ""
423
423
  }) : void 0,
424
- onClick: () => z(K),
425
- disabled: C
424
+ onClick: () => H(K),
425
+ disabled: T
426
426
  })] });
427
- return ne ? /* @__PURE__ */ a("div", {
428
- dir: he,
427
+ return ie ? /* @__PURE__ */ s("div", {
428
+ dir: _e,
429
429
  className: "relative flex min-h-0 flex-1 flex-col",
430
- children: /* @__PURE__ */ a(N, {
431
- title: W,
432
- onBack: V,
433
- backAriaLabel: H,
434
- actions: qe,
430
+ children: /* @__PURE__ */ s(F, {
431
+ title: G,
432
+ onBack: U,
433
+ backAriaLabel: W,
434
+ actions: Xe,
435
435
  isSaving: !1,
436
436
  labels: { savingStatusLabel: Z.savingStatusLabel },
437
- styles: Ve,
438
- leftContent: /* @__PURE__ */ a("div", {
437
+ styles: We,
438
+ leftContent: /* @__PURE__ */ s("div", {
439
439
  role: "status",
440
440
  "aria-label": Z.loadingAriaLabel ?? "Loading skill",
441
441
  className: "flex flex-1 items-center justify-center p-8",
442
- children: /* @__PURE__ */ a(y, {})
442
+ children: /* @__PURE__ */ s(y, {})
443
443
  })
444
444
  })
445
- }) : ie ? /* @__PURE__ */ a("div", {
446
- dir: he,
445
+ }) : C ? /* @__PURE__ */ s("div", {
446
+ dir: _e,
447
447
  className: "relative flex min-h-0 flex-1 flex-col",
448
- children: /* @__PURE__ */ a(N, {
449
- title: W,
450
- onBack: V,
451
- backAriaLabel: H,
452
- actions: qe,
448
+ children: /* @__PURE__ */ s(F, {
449
+ title: G,
450
+ onBack: U,
451
+ backAriaLabel: W,
452
+ actions: Xe,
453
453
  isSaving: !1,
454
454
  labels: { savingStatusLabel: Z.savingStatusLabel },
455
- styles: Ve,
456
- leftContent: /* @__PURE__ */ o("div", {
455
+ styles: We,
456
+ leftContent: /* @__PURE__ */ c("div", {
457
457
  role: "alert",
458
458
  className: "flex flex-col items-center gap-4 p-8",
459
- children: [/* @__PURE__ */ a(f, { text: Z.loadErrorMessage ?? "Couldn't load this skill. Please try again." }), /* @__PURE__ */ a(te, {
459
+ children: [/* @__PURE__ */ s(m, { text: Z.loadErrorMessage ?? "Couldn't load this skill. Please try again." }), /* @__PURE__ */ s(re, {
460
460
  label: Z.retryLabel ?? "Retry",
461
- onClick: pe
461
+ onClick: me
462
462
  })]
463
463
  })
464
464
  })
465
- }) : /* @__PURE__ */ o("div", {
466
- dir: he,
465
+ }) : /* @__PURE__ */ c("div", {
466
+ dir: _e,
467
467
  className: "relative flex min-h-0 flex-1 flex-col",
468
- style: Be,
469
- ...Fe,
468
+ style: Ue,
469
+ ...Re,
470
470
  children: [
471
- /* @__PURE__ */ a(le, {
472
- isVisible: Pe && !X,
473
- labels: G
471
+ /* @__PURE__ */ s(le, {
472
+ isVisible: Le && !X,
473
+ labels: he
474
474
  }),
475
- /* @__PURE__ */ a(N, {
476
- title: W,
477
- onBack: V,
478
- backAriaLabel: H,
479
- actions: qe,
480
- isSaving: C,
475
+ /* @__PURE__ */ s(F, {
476
+ title: G,
477
+ onBack: U,
478
+ backAriaLabel: W,
479
+ actions: Xe,
480
+ isSaving: T,
481
481
  labels: { savingStatusLabel: Z.savingStatusLabel },
482
- styles: Ve,
483
- leftContent: /* @__PURE__ */ o(i, { children: [/* @__PURE__ */ a("div", {
482
+ styles: We,
483
+ leftContent: /* @__PURE__ */ c(o, { children: [/* @__PURE__ */ s("div", {
484
484
  className: "px-4 py-4 desktop:hidden",
485
- children: /* @__PURE__ */ a(s, {
485
+ children: /* @__PURE__ */ s(l, {
486
486
  title: Z.editingFileLabel ?? "Editing file",
487
487
  description: $?.name ?? "SKILL.md",
488
- expanded: Me,
489
- onToggle: Ne,
488
+ expanded: Fe,
489
+ onToggle: Ie,
490
490
  ariaLabel: Z.editingFileLabel ?? "Editing file",
491
- children: Ke
491
+ children: Ye
492
492
  })
493
- }), /* @__PURE__ */ a("div", {
493
+ }), /* @__PURE__ */ s("div", {
494
494
  className: "hidden px-8 py-6 desktop:block",
495
- children: Ke
495
+ children: Ye
496
496
  })] }),
497
- rightContent: /* @__PURE__ */ o("div", {
497
+ rightContent: /* @__PURE__ */ c("div", {
498
498
  className: "flex flex-1 flex-col gap-4 px-4 py-6 desktop:gap-5 desktop:px-8",
499
499
  children: [
500
- A != null && /* @__PURE__ */ a("div", {
500
+ M != null && /* @__PURE__ */ s("div", {
501
501
  role: "alert",
502
- children: /* @__PURE__ */ a(f, { text: A })
502
+ children: /* @__PURE__ */ s(m, { text: M })
503
503
  }),
504
- j != null && /* @__PURE__ */ o("div", {
504
+ N != null && /* @__PURE__ */ c("div", {
505
505
  role: "alert",
506
506
  className: "flex items-center gap-2",
507
- children: [/* @__PURE__ */ a(f, { text: j.message }), /* @__PURE__ */ a(m, {
507
+ children: [/* @__PURE__ */ s(m, { text: N.message }), /* @__PURE__ */ s(ee, {
508
508
  label: Z.reloadLatestLabel ?? "Reload latest",
509
- onClick: M
509
+ onClick: P
510
510
  })]
511
511
  }),
512
- /* @__PURE__ */ a("h2", {
513
- className: r(U.title, Le),
514
- children: J === "SKILL.md" ? F : Z.selectedFileHeading?.($?.name ?? J) ?? $?.name ?? J
512
+ /* @__PURE__ */ s("h2", {
513
+ className: i(fe.title, Be),
514
+ children: J === "SKILL.md" ? L : Z.selectedFileHeading?.($?.name ?? J) ?? $?.name ?? J
515
515
  }),
516
- J === "SKILL.md" ? /* @__PURE__ */ o(i, { children: [
517
- /* @__PURE__ */ a(g, {
516
+ J === "SKILL.md" ? /* @__PURE__ */ c(o, { children: [
517
+ /* @__PURE__ */ s(_, {
518
518
  labelProps: {
519
519
  label: Z.nameLabel ?? "Name",
520
520
  required: !0
@@ -525,12 +525,12 @@ var M = {
525
525
  name: e ?? ""
526
526
  })),
527
527
  placeholder: Z.namePlaceholder ?? "good-morning-breakfast",
528
- caption: E?.name ? void 0 : Z.nameCaption ?? "Lowercase letters and hyphens only, no spaces. We'll reformat automatically if needed.",
529
- error: E?.name,
530
- invalid: !!E?.name,
531
- disabled: P
528
+ caption: O?.name ? void 0 : Z.nameCaption ?? "Lowercase letters and hyphens only, no spaces. We'll reformat automatically if needed.",
529
+ error: O?.name,
530
+ invalid: !!O?.name,
531
+ disabled: I
532
532
  }),
533
- /* @__PURE__ */ a(b, {
533
+ /* @__PURE__ */ s(b, {
534
534
  labelProps: {
535
535
  label: Z.descriptionLabel ?? "Description",
536
536
  required: !0
@@ -541,53 +541,56 @@ var M = {
541
541
  ...t,
542
542
  description: e
543
543
  })),
544
- error: E?.description,
545
- invalid: !!E?.description
544
+ error: O?.description,
545
+ invalid: !!O?.description
546
546
  }),
547
- /* @__PURE__ */ o("div", {
547
+ /* @__PURE__ */ c("div", {
548
548
  className: "flex flex-1 flex-col gap-2",
549
549
  children: [
550
- /* @__PURE__ */ o("span", {
550
+ /* @__PURE__ */ c("span", {
551
551
  className: "flex items-center gap-0.5",
552
- children: [/* @__PURE__ */ a("span", {
553
- className: r(U.helperText, Re),
552
+ children: [/* @__PURE__ */ s("span", {
553
+ className: i(fe.helperText, Ve),
554
554
  children: Z.instructionsLabel ?? "Instructions"
555
- }), /* @__PURE__ */ a("span", {
555
+ }), /* @__PURE__ */ s("span", {
556
556
  className: "dial-tiny-text text-error",
557
557
  children: "*"
558
558
  })]
559
559
  }),
560
- /* @__PURE__ */ a(ae, {
561
- fallback: /* @__PURE__ */ a(y, { ariaLabel: Z.instructionsLoadingAriaLabel ?? "Loading" }),
562
- children: /* @__PURE__ */ a(fe, {
563
- value: K.instructions,
564
- onChange: (e) => q((t) => ({
565
- ...t,
566
- instructions: e
567
- })),
568
- className: e,
569
- theme: ge,
570
- placeholder: Z.instructionsPlaceholder ?? "Write the skill instructions in Markdown"
560
+ /* @__PURE__ */ s("div", {
561
+ ref: ye,
562
+ className: i(e, t),
563
+ children: /* @__PURE__ */ s(w, {
564
+ fallback: /* @__PURE__ */ s(y, { ariaLabel: Z.instructionsLoadingAriaLabel ?? "Loading" }),
565
+ children: /* @__PURE__ */ s(pe, {
566
+ value: K.instructions,
567
+ onChange: (e) => q((t) => ({
568
+ ...t,
569
+ instructions: e
570
+ })),
571
+ theme: ve,
572
+ placeholder: Z.instructionsPlaceholder ?? "Write the skill instructions in Markdown"
573
+ })
571
574
  })
572
575
  }),
573
- E?.instructions != null && /* @__PURE__ */ a(f, { text: E.instructions })
576
+ O?.instructions != null && /* @__PURE__ */ s(m, { text: O.instructions })
574
577
  ]
575
578
  })
576
- ] }) : $?.kind === I.File && (ue ?? /* @__PURE__ */ a(c, { text: Z.supportingFileNote ?? "This supporting file is included in the skill package as-is. Remove it from the Files panel to replace its content." }))
579
+ ] }) : $?.kind === R.File && (V ?? /* @__PURE__ */ s(u, { text: Z.supportingFileNote ?? "This supporting file is included in the skill package as-is. Remove it from the Files panel to replace its content." }))
577
580
  ]
578
581
  })
579
582
  }),
580
- /* @__PURE__ */ a(de, {
583
+ /* @__PURE__ */ s(de, {
581
584
  isOpen: X,
582
585
  onClose: () => {
583
- ke(!1), je(void 0);
586
+ Me(!1), Pe(void 0);
584
587
  },
585
- fileActions: R,
586
- initialFiles: Ae,
587
- labels: G
588
+ fileActions: B,
589
+ initialFiles: Ne,
590
+ labels: he
588
591
  })
589
592
  ]
590
593
  });
591
594
  };
592
595
  //#endregion
593
- export { W as SkillEditor, ue as SkillFileCandidateKind, I as SkillFileNodeKind, z as SkillFileValidationStatus };
596
+ export { G as SkillEditor, V as SkillFileCandidateKind, R as SkillFileNodeKind, H as SkillFileValidationStatus };
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@epam/ai-dial-skill-editor",
3
3
  "description": "Host-agnostic form for authoring a DIAL Skill, with an inline supporting-file tree",
4
- "version": "1.1.0-dev.433",
4
+ "version": "1.1.0-dev.438",
5
5
  "license": "Apache-2.0",
6
6
  "type": "module",
7
7
  "main": "./index.js",
@@ -16,8 +16,8 @@
16
16
  }
17
17
  },
18
18
  "peerDependencies": {
19
- "@epam/ai-dial-chat-shared": "1.1.0-dev.433",
20
- "@epam/ai-dial-editor-builder": "1.1.0-dev.433",
19
+ "@epam/ai-dial-chat-shared": "1.1.0-dev.438",
20
+ "@epam/ai-dial-editor-builder": "1.1.0-dev.438",
21
21
  "@epam/ai-dial-ui-kit": "^0.14.0-dev.30",
22
22
  "@epam/ai-dial-react-file-manager": "^0.2.0-dev.10",
23
23
  "@tabler/icons-react": "^3.0.0",