@epam/ai-dial-skill-editor 1.1.0-dev.405 → 1.1.0-dev.413

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