@epam/ai-dial-skill-editor 1.1.0-dev.184

package/components/SkillEditor/SkillEditor.d.ts

@@ -0,0 +1,5 @@
+import { FC } from 'react';
+import { SkillEditorProps } from '../../models/skill-editor-props';
+/** Host-agnostic form for authoring a DIAL Skill's manifest and supporting files. */
+export declare const SkillEditor: FC<SkillEditorProps>;
+//# sourceMappingURL=SkillEditor.d.ts.map

package/components/SkillEditor/SkillEditor.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"SkillEditor.d.ts","sourceRoot":"","sources":["../../../src/components/SkillEditor/SkillEditor.tsx"],"names":[],"mappings":"AAoBA,OAAO,EAEL,EAAE,EASH,MAAM,OAAO,CAAC;AACf,OAAO,KAAK,EACV,gBAAgB,EAGjB,MAAM,iCAAiC,CAAC;AAmBzC,qFAAqF;AACrF,eAAO,MAAM,WAAW,EAAE,EAAE,CAAC,gBAAgB,CA2b5C,CAAC"}

package/index.css

@@ -0,0 +1,2 @@
+._title_l82ak_1{color:var(--se-title-color,var(--text-primary,#161b2d))}._helperText_l82ak_5{color:var(--se-helper-text-color,var(--text-secondary,#57647a))}._headerBorder_l82ak_9{border-bottom-color:var(--se-border-color,var(--stroke-tertiary,#e0e6f0))}._sidebarBorder_l82ak_13{border-inline-end-color:var(--se-border-color,var(--stroke-tertiary,#e0e6f0))}._actionBarBorder_l82ak_17{border-top-color:var(--se-border-color,var(--stroke-tertiary,#e0e6f0))}
+/*$vite$:1*/

package/index.d.ts

@@ -0,0 +1,4 @@
+export { SkillEditor } from './components/SkillEditor/SkillEditor';
+export type { SkillEditorColors, SkillEditorConflict, SkillEditorErrors, SkillEditorFileActions, SkillEditorLabels, SkillEditorProps, SkillEditorStyles, SkillEditorTypography, SkillEditorValues, SkillFileTreeNode, } from './models/skill-editor-props';
+export { SkillFileNodeKind } from './types/skill-file-node-kind';
+//# sourceMappingURL=index.d.ts.map

package/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,EAAE,MAAM,sCAAsC,CAAC;AACnE,YAAY,EACV,iBAAiB,EACjB,mBAAmB,EACnB,iBAAiB,EACjB,sBAAsB,EACtB,iBAAiB,EACjB,gBAAgB,EAChB,iBAAiB,EACjB,qBAAqB,EACrB,iBAAiB,EACjB,iBAAiB,GAClB,MAAM,6BAA6B,CAAC;AACrC,OAAO,EAAE,iBAAiB,EAAE,MAAM,8BAA8B,CAAC"}

package/index.js

@@ -0,0 +1,338 @@
+import { buildCssVars as e, mergeClasses as t } from "@epam/ai-dial-chat-shared";
+import { DialFileNodeType as n, DialFoldersTree as r } from "@epam/ai-dial-react-file-manager";
+import { Accordion as i, CaptionText as ee, ConfirmationPopup as te, ConfirmationPopupVariant as ne, ErrorText as a, GhostButton as o, Input as re, LazyMarkdownEditor as s, NeutralButton as ie, PrimaryButton as c, Spinner as l, Textarea as ae } from "@epam/ai-dial-ui-kit";
+import { IconPlus as oe, IconTrashX as se } from "@tabler/icons-react";
+import { Suspense as ce, lazy as u, useCallback as d, useEffect as f, useId as p, useMemo as m, useRef as h, useState as g } from "react";
+import { Fragment as _, jsx as v, jsxs as y } from "react/jsx-runtime";
+//#region src/types/skill-editor-defaults.ts
+var b = "SKILL.md", x = /* @__PURE__ */ function(e) {
+	return e.File = "file", e.Folder = "folder", e;
+}({}), S = (e) => {
+	let t = e.lastIndexOf("/");
+	return t === -1 ? null : e.slice(0, t);
+}, C = (e) => {
+	let t = e.lastIndexOf("/");
+	return t === -1 ? e : e.slice(t + 1);
+}, le = (e) => {
+	let t = /* @__PURE__ */ new Map(), r = (e) => {
+		let r = t.get(e);
+		if (r) return r;
+		let i = {
+			path: e,
+			name: C(e),
+			nodeType: n.FOLDER,
+			parentPath: S(e),
+			folderId: e,
+			items: []
+		};
+		return t.set(e, i), i;
+	};
+	for (let i of e) {
+		if (i.kind === x.Folder) {
+			r(i.path);
+			continue;
+		}
+		t.set(i.path, {
+			path: i.path,
+			name: i.name,
+			nodeType: n.ITEM,
+			parentPath: S(i.path),
+			folderId: S(i.path) ?? ""
+		});
+	}
+	for (let t of [...e]) {
+		let e = S(t.path);
+		for (; e != null;) r(e), e = S(e);
+	}
+	let i = [];
+	for (let e of t.values()) {
+		if (e.parentPath == null) {
+			i.push(e);
+			continue;
+		}
+		let n = t.get(e.parentPath);
+		n ? n.items = [...n.items ?? [], e] : i.push(e);
+	}
+	return i;
+}, w = {
+	title: "_title_l82ak_1",
+	helperText: "_helperText_l82ak_5",
+	headerBorder: "_headerBorder_l82ak_9",
+	sidebarBorder: "_sidebarBorder_l82ak_13",
+	actionBarBorder: "_actionBarBorder_l82ak_17"
+}, ue = u(async () => {
+	let { MarkdownEditor: e } = await s();
+	return { default: e };
+}), T = ({ initialValues: n, files: s, selectedPath: u, onSelectedPathChange: S, expandedPaths: C, onExpandedPathsChange: T, isLoading: de = !1, hasLoadError: fe = !1, isSubmitting: E = !1, errors: D, submitError: O, conflict: k, onReloadLatest: pe, isNameReadOnly: me = !1, onDirtyChange: A, fileActions: j, headerContent: he, onSubmit: ge, onCancel: _e, onRetry: ve, labels: ye, styles: M, dir: be, instructionsEditorTheme: xe = "light" }) => {
+	let [N, P] = g({
+		name: n?.name ?? "",
+		description: n?.description ?? "",
+		instructions: n?.instructions ?? ""
+	}), F = h(s);
+	f(() => {
+		P({
+			name: n?.name ?? "",
+			description: n?.description ?? "",
+			instructions: n?.instructions ?? ""
+		}), F.current = s;
+	}, [n]);
+	let I = (e) => JSON.stringify([...e].sort((e, t) => e.path.localeCompare(t.path))), L = h(!1);
+	f(() => {
+		let e = {
+			name: n?.name ?? "",
+			description: n?.description ?? "",
+			instructions: n?.instructions ?? ""
+		}, t = JSON.stringify(N) !== JSON.stringify(e) || I(s) !== I(F.current);
+		t !== L.current && (L.current = t, A?.(t));
+	}, [
+		N,
+		s,
+		n,
+		A
+	]);
+	let [Se, Ce] = g(b), R = u ?? Se, z = d((e) => {
+		Ce(e), S?.(e);
+	}, [S]), [we, Te] = g([]), B = C ?? we, Ee = m(() => new Set(B), [B]), De = d((e) => {
+		let t = [...e];
+		Te(t), T?.(t);
+	}, [T]), [V, H] = g(null), [U, W] = g(), G = h(null), [Oe, ke] = g(!0), K = ye ?? {}, q = M?.colors, J = M?.typography ?? {}, Y = J.titleClassName ?? "dial-body-semi-text", Ae = J.helperTextClassName ?? "dial-tiny-semi-text", je = e({
+		"--se-title-color": q?.title,
+		"--se-helper-text-color": q?.helperText,
+		"--se-border-color": q?.border
+	}), Me = m(() => le([{
+		path: b,
+		name: b,
+		kind: x.File
+	}, ...s]), [s]), X = m(() => s.find((e) => e.path === R), [s, R]), Z = d((e) => {
+		z(e.path);
+	}, [z]), Ne = d((e) => e.path === "SKILL.md" ? [] : [{
+		key: "remove",
+		label: /* @__PURE__ */ v("span", {
+			className: "text-error",
+			children: K.removeLabel ?? "Remove"
+		}),
+		danger: !0,
+		icon: /* @__PURE__ */ v(se, {
+			size: 16,
+			className: "text-error",
+			"aria-hidden": !0
+		}),
+		onClick: () => H(e.path)
+	}], [K.removeLabel]), Pe = async (e) => {
+		let t = e.target.files?.[0];
+		if (e.target.value = "", !t) return;
+		let n = j.validatePath(t.name);
+		if (n) {
+			W(n);
+			return;
+		}
+		W(void 0);
+		try {
+			await j.onUploadFile(t, t.name);
+		} catch (e) {
+			W(e instanceof Error ? e.message : String(e));
+		}
+	}, Fe = p(), Ie = p(), Q = /* @__PURE__ */ y("div", {
+		className: "flex flex-col gap-2 desktop:gap-5",
+		children: [
+			/* @__PURE__ */ y("div", {
+				className: "flex items-center justify-between",
+				children: [/* @__PURE__ */ v("span", {
+					className: t(w.title, Y),
+					children: K.filesHeading ?? "Files"
+				}), /* @__PURE__ */ v(ie, {
+					label: K.addUploadLabel ?? "Upload from device",
+					iconBefore: /* @__PURE__ */ v(oe, {
+						size: 16,
+						"aria-hidden": !0
+					}),
+					onClick: () => G.current?.click()
+				})]
+			}),
+			/* @__PURE__ */ v("input", {
+				ref: G,
+				type: "file",
+				className: "hidden",
+				onChange: Pe
+			}),
+			U && /* @__PURE__ */ v(a, { text: U }),
+			/* @__PURE__ */ v("div", {
+				id: Fe,
+				role: "tree",
+				"aria-label": K.filesTreeAriaLabel ?? "Skill files",
+				children: /* @__PURE__ */ v(r, {
+					items: Me,
+					showFiles: !0,
+					selectedPath: R,
+					expandedPaths: Ee,
+					onExpandedPathsChange: De,
+					onItemClick: Z,
+					getContextMenuItems: Ne,
+					rootItemPath: ""
+				})
+			})
+		]
+	}), Le = E ? K.savingStatusLabel ?? "Saving" : "", $ = /* @__PURE__ */ y(_, { children: [/* @__PURE__ */ v(o, {
+		label: K.cancelLabel ?? "Cancel",
+		onClick: _e,
+		disabled: E
+	}), /* @__PURE__ */ v(c, {
+		label: K.createLabel ?? "Create",
+		iconBefore: E ? /* @__PURE__ */ v(l, {
+			size: 16,
+			ariaLabel: ""
+		}) : void 0,
+		onClick: () => ge(N),
+		disabled: E
+	})] });
+	return de ? /* @__PURE__ */ v("div", {
+		className: "flex h-full items-center justify-center",
+		children: /* @__PURE__ */ v(l, { ariaLabel: K.loadingAriaLabel ?? "Loading skill" })
+	}) : fe ? /* @__PURE__ */ y("div", {
+		role: "alert",
+		className: "flex flex-col items-center gap-4 p-8",
+		children: [/* @__PURE__ */ v(a, { text: K.loadErrorMessage ?? "Couldn't load this skill. Please try again." }), /* @__PURE__ */ v(c, {
+			label: K.retryLabel ?? "Retry",
+			onClick: ve
+		})]
+	}) : /* @__PURE__ */ y("div", {
+		dir: be,
+		className: "flex h-full flex-col",
+		style: je,
+		children: [
+			/* @__PURE__ */ v("span", {
+				role: "status",
+				"aria-live": "polite",
+				className: "sr-only",
+				id: Ie,
+				children: Le
+			}),
+			O && /* @__PURE__ */ v("div", {
+				role: "alert",
+				className: "px-4 pt-2",
+				children: /* @__PURE__ */ v(a, { text: O })
+			}),
+			k && /* @__PURE__ */ y("div", {
+				role: "alert",
+				className: "flex items-center gap-2 px-4 pt-2",
+				children: [/* @__PURE__ */ v(a, { text: k.message }), /* @__PURE__ */ v(o, {
+					label: K.reloadLatestLabel ?? "Reload latest",
+					onClick: pe
+				})]
+			}),
+			/* @__PURE__ */ y("div", {
+				className: t("hidden items-center justify-between gap-2 border-b px-4 py-2 desktop:flex desktop:px-8 desktop:pb-3 desktop:pt-3", w.headerBorder),
+				children: [/* @__PURE__ */ v("div", {
+					className: "flex min-w-0 flex-1 items-center gap-2",
+					children: he
+				}), /* @__PURE__ */ v("div", {
+					className: "flex shrink-0 items-center gap-2",
+					children: $
+				})]
+			}),
+			/* @__PURE__ */ y("div", {
+				className: "flex flex-1 flex-col gap-4 overflow-y-auto px-4 pb-20 desktop:flex-row desktop:gap-0 desktop:px-0 desktop:pb-0",
+				children: [
+					/* @__PURE__ */ v("div", {
+						className: "desktop:hidden",
+						children: /* @__PURE__ */ v(i, {
+							title: K.editingFileLabel ?? "Editing file",
+							description: X?.name ?? "SKILL.md",
+							expanded: Oe,
+							onToggle: ke,
+							ariaLabel: K.editingFileLabel ?? "Editing file",
+							children: Q
+						})
+					}),
+					/* @__PURE__ */ v("div", {
+						className: t("hidden border-e desktop:block desktop:w-[360px] desktop:shrink-0 desktop:px-8 desktop:py-6", w.sidebarBorder),
+						children: Q
+					}),
+					/* @__PURE__ */ y("div", {
+						className: "flex flex-1 flex-col gap-4 desktop:gap-5 desktop:px-8 desktop:py-6",
+						children: [/* @__PURE__ */ v("h2", {
+							className: t(w.title, Y),
+							children: R === "SKILL.md" ? b : K.selectedFileHeading?.(X?.name ?? R) ?? X?.name ?? R
+						}), R === "SKILL.md" ? /* @__PURE__ */ y(_, { children: [
+							/* @__PURE__ */ v(re, {
+								labelProps: {
+									label: K.nameLabel ?? "Name",
+									required: !0
+								},
+								value: N.name,
+								onChange: (e) => P((t) => ({
+									...t,
+									name: e ?? ""
+								})),
+								placeholder: K.namePlaceholder ?? "good-morning-breakfast",
+								caption: D?.name ? void 0 : K.nameCaption ?? "Lowercase letters and hyphens only, no spaces. We'll reformat automatically if needed.",
+								error: D?.name,
+								invalid: !!D?.name,
+								disabled: me
+							}),
+							/* @__PURE__ */ v(ae, {
+								labelProps: {
+									label: K.descriptionLabel ?? "Description",
+									required: !0
+								},
+								value: N.description,
+								placeholder: K.descriptionPlaceholder ?? "What this skill does and when to use it",
+								onChange: (e) => P((t) => ({
+									...t,
+									description: e
+								})),
+								error: D?.description,
+								invalid: !!D?.description
+							}),
+							/* @__PURE__ */ y("div", {
+								className: "flex flex-1 flex-col gap-2",
+								children: [
+									/* @__PURE__ */ y("span", {
+										className: "flex items-center gap-0.5",
+										children: [/* @__PURE__ */ v("span", {
+											className: t(w.helperText, Ae),
+											children: K.instructionsLabel ?? "Instructions"
+										}), /* @__PURE__ */ v("span", {
+											className: "dial-tiny-text text-error",
+											children: "*"
+										})]
+									}),
+									/* @__PURE__ */ v(ce, {
+										fallback: /* @__PURE__ */ v(l, { ariaLabel: K.instructionsLoadingAriaLabel ?? "Loading" }),
+										children: /* @__PURE__ */ v(ue, {
+											value: N.instructions,
+											onChange: (e) => P((t) => ({
+												...t,
+												instructions: e
+											})),
+											theme: xe,
+											placeholder: K.instructionsPlaceholder ?? "Write the skill instructions in Markdown"
+										})
+									}),
+									D?.instructions && /* @__PURE__ */ v(a, { text: D.instructions })
+								]
+							})
+						] }) : X?.kind !== x.Folder && /* @__PURE__ */ v(ee, { text: K.supportingFileNote ?? "This supporting file is included in the skill package as-is. Remove it from the Files panel to replace its content." })]
+					})
+				]
+			}),
+			/* @__PURE__ */ v("div", {
+				className: t("fixed inset-x-0 bottom-0 flex items-center gap-2 border-t p-3 desktop:hidden", w.actionBarBorder),
+				children: $
+			}),
+			V && /* @__PURE__ */ v(te, {
+				header: K.removeConfirmTitle ?? "Remove file",
+				description: K.removeConfirmMessage?.(V) ?? `Remove "${V}"? This cannot be undone.`,
+				confirmLabel: K.removeConfirmLabel ?? "Remove",
+				cancelLabel: K.removeCancelLabel ?? "Cancel",
+				variant: ne.Danger,
+				onConfirm: () => {
+					j.onRemoveNode(V), R === V && z("SKILL.md"), H(null);
+				},
+				onCancel: () => H(null)
+			})
+		]
+	});
+};
+//#endregion
+export { T as SkillEditor, x as SkillFileNodeKind };

package/models/skill-editor-props.d.ts

@@ -0,0 +1,221 @@
+import { ReactNode } from 'react';
+import { SkillFileNodeKind } from '../types/skill-file-node-kind';
+/**
+ * One supporting file or folder in the skill's file tree. The mandatory root
+ * `SKILL.md` manifest node is synthesised internally by `SkillEditor` and is
+ * never part of this list.
+ */
+export interface SkillFileTreeNode {
+    /** Relative path from the skill root, using `/` separators. */
+    path: string;
+    /** Display name — the final path segment. */
+    name: string;
+    /** Whether this node is a file or a folder. */
+    kind: SkillFileNodeKind;
+}
+/** The skill fields the editor form holds. */
+export interface SkillEditorValues {
+    /** Skill name, as typed by the user (host normalizes it on submit). */
+    name: string;
+    /** Short description of what the skill does. */
+    description: string;
+    /** The skill's instructions body (Markdown). */
+    instructions: string;
+}
+/**
+ * Inline validation messages, keyed by field. Resolved by the host, which owns
+ * the DIAL naming/storage contract the values must satisfy.
+ */
+export interface SkillEditorErrors {
+    /** Message shown under the Name field. */
+    name?: string;
+    /** Message shown under the Description field. */
+    description?: string;
+    /** Message shown under the Instructions editor. */
+    instructions?: string;
+}
+/**
+ * Host-owned operations on the in-memory supporting-file set. The library
+ * calls these when the user uploads a file from their device or removes an
+ * entry; it never mutates `files` itself.
+ */
+export interface SkillEditorFileActions {
+    /**
+     * Validates an uploaded file's path before it is added to the tree. Return
+     * an error message to block the addition, or `undefined` to accept it.
+     */
+    validatePath: (path: string) => string | undefined;
+    /**
+     * Called when the user picks a local file to upload as a supporting file.
+     * Resolves once the host has read and stored its content; rejects to
+     * surface an inline upload error instead of adding the node.
+     */
+    onUploadFile: (file: File, path: string) => Promise<void>;
+    /** Called after the user confirms removing a non-protected node. */
+    onRemoveNode: (path: string) => void;
+}
+/** Text overrides for `SkillEditor`. Every field has an English default. */
+export interface SkillEditorLabels {
+    /** Files pane heading. Defaults to `'Files'`. */
+    filesHeading?: string;
+    /** Accessible name of the file tree region. Defaults to `'Skill files'`. */
+    filesTreeAriaLabel?: string;
+    /**
+     * Label of the control that opens the device file picker to add a
+     * supporting file. Defaults to `'Upload from device'`.
+     */
+    addUploadLabel?: string;
+    /** Accessible label of a node's remove action. Defaults to `'Remove'`. */
+    removeLabel?: string;
+    /** Title of the remove-confirmation prompt. Defaults to `'Remove file'`. */
+    removeConfirmTitle?: string;
+    /** Builds the remove-confirmation message for a given path. Defaults to a sentence naming the path. */
+    removeConfirmMessage?: (path: string) => string;
+    /** Confirm button label in the remove-confirmation prompt. Defaults to `'Remove'`. */
+    removeConfirmLabel?: string;
+    /** Cancel button label in the remove-confirmation prompt. Defaults to `'Cancel'`. */
+    removeCancelLabel?: string;
+    /** Collapsed mobile summary label. Defaults to `'Editing file'`. */
+    editingFileLabel?: string;
+    /** Main-pane heading, given the selected node's name. Defaults to the name itself. */
+    selectedFileHeading?: (name: string) => string;
+    /** Name field label. Defaults to `'Name'`. */
+    nameLabel?: string;
+    /** Name field placeholder. Defaults to `'good-morning-breakfast'`. */
+    namePlaceholder?: string;
+    /** Name field helper text. Defaults to `"Lowercase letters and hyphens only, no spaces. We'll reformat automatically if needed."`. */
+    nameCaption?: string;
+    /** Description field label. Defaults to `'Description'`. */
+    descriptionLabel?: string;
+    /** Description field placeholder. Defaults to `'What this skill does and when to use it'`. */
+    descriptionPlaceholder?: string;
+    /** Instructions editor label. Defaults to `'Instructions'`. */
+    instructionsLabel?: string;
+    /** Instructions editor placeholder. Defaults to `'Write the skill instructions in Markdown'`. */
+    instructionsPlaceholder?: string;
+    /** Create button label. Defaults to `'Create'`. */
+    createLabel?: string;
+    /** Cancel button label. Defaults to `'Cancel'`. */
+    cancelLabel?: string;
+    /** Retry button label shown in the load-error state. Defaults to `'Retry'`. */
+    retryLabel?: string;
+    /** Message shown when the skill could not be loaded. Defaults to `"Couldn't load this skill. Please try again."`. */
+    loadErrorMessage?: string;
+    /** Status announced while a save is in flight. Defaults to `'Saving'`. */
+    savingStatusLabel?: string;
+    /** Accessible label of the top-level loading spinner shown while `isLoading` is `true`. Defaults to `'Loading skill'`. */
+    loadingAriaLabel?: string;
+    /** Accessible label of the spinner shown while the Instructions Markdown editor's chunk is loading. Defaults to `'Loading'`. */
+    instructionsLoadingAriaLabel?: string;
+    /** Note shown in the main pane when a supporting file (not `SKILL.md` or a folder) is selected. Defaults to a sentence explaining content isn't editable here. */
+    supportingFileNote?: string;
+    /** Label of the "Reload latest" button rendered next to the host-supplied `conflict.message` in the conflict state. Defaults to `'Reload latest'`. */
+    reloadLatestLabel?: string;
+}
+/**
+ * Describes a save-time conflict (e.g. a stale ETag) distinct from
+ * `submitError` (an unrecoverable submit failure). When present, `SkillEditor`
+ * renders `conflict.message` plus a "Reload latest" control that calls
+ * `onReloadLatest` — the control never clears any field itself.
+ */
+export interface SkillEditorConflict {
+    /** Host-resolved, already-translated conflict message. */
+    message: string;
+}
+/** CSS custom-property color overrides for `SkillEditor`. */
+export interface SkillEditorColors {
+    /** Color of the "Files" and selected-file section headings. Defaults to `--text-primary`. */
+    title?: string;
+    /** Color of the hand-rendered Instructions field label. Defaults to `--text-secondary`. */
+    helperText?: string;
+    /** Border color of the desktop header row, the Files sidebar divider, and the mobile sticky action bar. Defaults to `--stroke-tertiary`. */
+    border?: string;
+}
+/** Typography class overrides for `SkillEditor`. */
+export interface SkillEditorTypography {
+    /** Typography class applied to the "Files" and selected-file section headings. Defaults to `'dial-body-semi-text'`. */
+    titleClassName?: string;
+    /** Typography class applied to the hand-rendered Instructions field label. Defaults to `'dial-tiny-semi-text'`. */
+    helperTextClassName?: string;
+}
+/** Grouped style overrides for `SkillEditor`. */
+export interface SkillEditorStyles {
+    /** Color overrides, applied as CSS custom properties. */
+    colors?: SkillEditorColors;
+    /** Typography class overrides. */
+    typography?: SkillEditorTypography;
+}
+/** Props for `SkillEditor`. */
+export interface SkillEditorProps {
+    /**
+     * Values to seed the fields with. Changing this object's identity re-seeds
+     * the form, so hosts that load asynchronously should memoise it and only
+     * produce a new object once the data has arrived.
+     */
+    initialValues?: Partial<SkillEditorValues>;
+    /** Supporting files/folders, excluding the always-present root `SKILL.md` node, which the component synthesises. */
+    files: SkillFileTreeNode[];
+    /** Currently selected node path. Defaults to `'SKILL.md'` when omitted. */
+    selectedPath?: string;
+    /** Called when the selected node changes. Omit to let the component manage selection internally. */
+    onSelectedPathChange?: (path: string) => void;
+    /** Currently expanded folder paths. Omit to let the component manage expansion internally. */
+    expandedPaths?: string[];
+    /** Called when the set of expanded folder paths changes. */
+    onExpandedPathsChange?: (paths: string[]) => void;
+    /** Whether the skill being edited is still loading. Defaults to `false`. */
+    isLoading?: boolean;
+    /** Whether loading the skill failed; renders an error state with a retry instead of the form. Defaults to `false`. */
+    hasLoadError?: boolean;
+    /** Whether a save is in flight; disables submission. Defaults to `false`. */
+    isSubmitting?: boolean;
+    /** Inline validation messages to render under the fields. */
+    errors?: SkillEditorErrors;
+    /** General submit-time error (e.g. a naming conflict or a server error) rendered in a `role="alert"` region. */
+    submitError?: string;
+    /**
+     * A save-time conflict (e.g. a stale ETag), distinct from `submitError`.
+     * When present, renders `conflict.message` plus a "Reload latest" control
+     * calling `onReloadLatest`. Omit when there is no conflict.
+     */
+    conflict?: SkillEditorConflict;
+    /** Called when the conflict state's "Reload latest" control is activated. Required when `conflict` can be set. */
+    onReloadLatest?: () => void;
+    /**
+     * When `true`, the Name field renders read-only — its value is still
+     * included in submitted values unchanged. The host sets this in edit mode,
+     * since DIAL Core has no rename/move operation for a skill; the library
+     * itself has no notion of "edit mode" and infers no policy from this flag
+     * beyond disabling the field.
+     */
+    isNameReadOnly?: boolean;
+    /**
+     * Called whenever any field value or the file-tree state diverges from its
+     * most recently seeded `initialValues`/`files` (`true`), and again once it
+     * returns to exactly that seeded state (`false`).
+     */
+    onDirtyChange?: (isDirty: boolean) => void;
+    /** File-tree mutation operations. */
+    fileActions: SkillEditorFileActions;
+    /**
+     * Host-rendered content (e.g. a back button and page title) placed at the
+     * start of the desktop header row, before the Cancel/Create actions. The
+     * library renders it verbatim with no knowledge of what it contains.
+     */
+    headerContent?: ReactNode;
+    /** Called with the current values when the form is submitted. */
+    onSubmit: (values: SkillEditorValues) => void;
+    /** Called when the form is dismissed without saving. */
+    onCancel: () => void;
+    /** Called when the retry button in the load-error state is activated. */
+    onRetry?: () => void;
+    /** Text overrides. */
+    labels?: SkillEditorLabels;
+    /** Style overrides. */
+    styles?: SkillEditorStyles;
+    /** Explicit direction override. Omit to inherit from the ambient `dir` attribute. */
+    dir?: 'ltr' | 'rtl';
+    /** Theme applied to the Instructions Markdown editor, resolved by the host from its own theme state. Defaults to `'light'`. */
+    instructionsEditorTheme?: 'light' | 'dark';
+}
+//# sourceMappingURL=skill-editor-props.d.ts.map

package/models/skill-editor-props.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"skill-editor-props.d.ts","sourceRoot":"","sources":["../../src/models/skill-editor-props.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AACvC,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,+BAA+B,CAAC;AAEvE;;;;GAIG;AACH,MAAM,WAAW,iBAAiB;IAChC,+DAA+D;IAC/D,IAAI,EAAE,MAAM,CAAC;IACb,6CAA6C;IAC7C,IAAI,EAAE,MAAM,CAAC;IACb,+CAA+C;IAC/C,IAAI,EAAE,iBAAiB,CAAC;CACzB;AAED,8CAA8C;AAC9C,MAAM,WAAW,iBAAiB;IAChC,uEAAuE;IACvE,IAAI,EAAE,MAAM,CAAC;IACb,gDAAgD;IAChD,WAAW,EAAE,MAAM,CAAC;IACpB,gDAAgD;IAChD,YAAY,EAAE,MAAM,CAAC;CACtB;AAED;;;GAGG;AACH,MAAM,WAAW,iBAAiB;IAChC,0CAA0C;IAC1C,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,iDAAiD;IACjD,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,mDAAmD;IACnD,YAAY,CAAC,EAAE,MAAM,CAAC;CACvB;AAED;;;;GAIG;AACH,MAAM,WAAW,sBAAsB;IACrC;;;OAGG;IACH,YAAY,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,MAAM,GAAG,SAAS,CAAC;IACnD;;;;OAIG;IACH,YAAY,EAAE,CAAC,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,MAAM,KAAK,OAAO,CAAC,IAAI,CAAC,CAAC;IAC1D,oEAAoE;IACpE,YAAY,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;CACtC;AAED,4EAA4E;AAC5E,MAAM,WAAW,iBAAiB;IAChC,iDAAiD;IACjD,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,4EAA4E;IAC5E,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAC5B;;;OAGG;IACH,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,0EAA0E;IAC1E,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,4EAA4E;IAC5E,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAC5B,uGAAuG;IACvG,oBAAoB,CAAC,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,MAAM,CAAC;IAChD,sFAAsF;IACtF,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAC5B,qFAAqF;IACrF,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAC3B,oEAAoE;IACpE,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,sFAAsF;IACtF,mBAAmB,CAAC,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,MAAM,CAAC;IAC/C,8CAA8C;IAC9C,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,sEAAsE;IACtE,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,sIAAsI;IACtI,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,4DAA4D;IAC5D,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,8FAA8F;IAC9F,sBAAsB,CAAC,EAAE,MAAM,CAAC;IAChC,+DAA+D;IAC/D,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAC3B,iGAAiG;IACjG,uBAAuB,CAAC,EAAE,MAAM,CAAC;IACjC,mDAAmD;IACnD,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,mDAAmD;IACnD,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,+EAA+E;IAC/E,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,qHAAqH;IACrH,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,0EAA0E;IAC1E,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAC3B,0HAA0H;IAC1H,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,gIAAgI;IAChI,4BAA4B,CAAC,EAAE,MAAM,CAAC;IACtC,kKAAkK;IAClK,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAC5B,sJAAsJ;IACtJ,iBAAiB,CAAC,EAAE,MAAM,CAAC;CAC5B;AAED;;;;;GAKG;AACH,MAAM,WAAW,mBAAmB;IAClC,0DAA0D;IAC1D,OAAO,EAAE,MAAM,CAAC;CACjB;AAED,6DAA6D;AAC7D,MAAM,WAAW,iBAAiB;IAChC,6FAA6F;IAC7F,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,2FAA2F;IAC3F,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,4IAA4I;IAC5I,MAAM,CAAC,EAAE,MAAM,CAAC;CACjB;AAED,oDAAoD;AACpD,MAAM,WAAW,qBAAqB;IACpC,uHAAuH;IACvH,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,mHAAmH;IACnH,mBAAmB,CAAC,EAAE,MAAM,CAAC;CAC9B;AAED,iDAAiD;AACjD,MAAM,WAAW,iBAAiB;IAChC,yDAAyD;IACzD,MAAM,CAAC,EAAE,iBAAiB,CAAC;IAC3B,kCAAkC;IAClC,UAAU,CAAC,EAAE,qBAAqB,CAAC;CACpC;AAED,+BAA+B;AAC/B,MAAM,WAAW,gBAAgB;IAC/B;;;;OAIG;IACH,aAAa,CAAC,EAAE,OAAO,CAAC,iBAAiB,CAAC,CAAC;IAC3C,oHAAoH;IACpH,KAAK,EAAE,iBAAiB,EAAE,CAAC;IAC3B,2EAA2E;IAC3E,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,oGAAoG;IACpG,oBAAoB,CAAC,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;IAC9C,8FAA8F;IAC9F,aAAa,CAAC,EAAE,MAAM,EAAE,CAAC;IACzB,4DAA4D;IAC5D,qBAAqB,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,EAAE,KAAK,IAAI,CAAC;IAClD,4EAA4E;IAC5E,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,sHAAsH;IACtH,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,6EAA6E;IAC7E,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,6DAA6D;IAC7D,MAAM,CAAC,EAAE,iBAAiB,CAAC;IAC3B,gHAAgH;IAChH,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB;;;;OAIG;IACH,QAAQ,CAAC,EAAE,mBAAmB,CAAC;IAC/B,kHAAkH;IAClH,cAAc,CAAC,EAAE,MAAM,IAAI,CAAC;IAC5B;;;;;;OAMG;IACH,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB;;;;OAIG;IACH,aAAa,CAAC,EAAE,CAAC,OAAO,EAAE,OAAO,KAAK,IAAI,CAAC;IAC3C,qCAAqC;IACrC,WAAW,EAAE,sBAAsB,CAAC;IACpC;;;;OAIG;IACH,aAAa,CAAC,EAAE,SAAS,CAAC;IAC1B,iEAAiE;IACjE,QAAQ,EAAE,CAAC,MAAM,EAAE,iBAAiB,KAAK,IAAI,CAAC;IAC9C,wDAAwD;IACxD,QAAQ,EAAE,MAAM,IAAI,CAAC;IACrB,yEAAyE;IACzE,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,sBAAsB;IACtB,MAAM,CAAC,EAAE,iBAAiB,CAAC;IAC3B,uBAAuB;IACvB,MAAM,CAAC,EAAE,iBAAiB,CAAC;IAC3B,qFAAqF;IACrF,GAAG,CAAC,EAAE,KAAK,GAAG,KAAK,CAAC;IACpB,+HAA+H;IAC/H,uBAAuB,CAAC,EAAE,OAAO,GAAG,MAAM,CAAC;CAC5C"}

package/package.json

@@ -0,0 +1,30 @@
+{
+  "name": "@epam/ai-dial-skill-editor",
+  "description": "Host-agnostic form for authoring a DIAL Skill, with an inline supporting-file tree",
+  "version": "1.1.0-dev.184",
+  "license": "Apache-2.0",
+  "type": "module",
+  "main": "./index.js",
+  "module": "./index.js",
+  "types": "./index.d.ts",
+  "exports": {
+    "./package.json": "./package.json",
+    ".": {
+      "types": "./index.d.ts",
+      "import": "./index.js",
+      "default": "./index.js"
+    }
+  },
+  "peerDependencies": {
+    "@epam/ai-dial-chat-shared": "1.1.0-dev.184",
+    "@epam/ai-dial-ui-kit": "^0.13.0-dev.26",
+    "@epam/ai-dial-react-file-manager": "^0.1.0-dev.17",
+    "@tabler/icons-react": "^3.0.0",
+    "react": "^19.0.0"
+  },
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/epam/ai-dial-chat.git",
+    "directory": "libs/skill-editor"
+  }
+}

package/test-setup.d.ts

@@ -0,0 +1 @@
+//# sourceMappingURL=test-setup.d.ts.map

package/test-setup.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"test-setup.d.ts","sourceRoot":"","sources":["../src/test-setup.ts"],"names":[],"mappings":""}

package/types/skill-editor-defaults.d.ts

@@ -0,0 +1,3 @@
+/** Relative path of the mandatory root manifest node, always present and always first in the tree. */
+export declare const SKILL_MANIFEST_PATH = "SKILL.md";
+//# sourceMappingURL=skill-editor-defaults.d.ts.map

package/types/skill-editor-defaults.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"skill-editor-defaults.d.ts","sourceRoot":"","sources":["../../src/types/skill-editor-defaults.ts"],"names":[],"mappings":"AAAA,sGAAsG;AACtG,eAAO,MAAM,mBAAmB,aAAa,CAAC"}

package/types/skill-file-node-kind.d.ts

@@ -0,0 +1,8 @@
+/** Kind of entry in the skill's file tree. */
+export declare enum SkillFileNodeKind {
+    /** A regular file, including the protected root `SKILL.md`. */
+    File = "file",
+    /** A grouping folder that may contain other files/folders. */
+    Folder = "folder"
+}
+//# sourceMappingURL=skill-file-node-kind.d.ts.map

package/types/skill-file-node-kind.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"skill-file-node-kind.d.ts","sourceRoot":"","sources":["../../src/types/skill-file-node-kind.ts"],"names":[],"mappings":"AAAA,8CAA8C;AAC9C,oBAAY,iBAAiB;IAC3B,+DAA+D;IAC/D,IAAI,SAAS;IACb,8DAA8D;IAC9D,MAAM,WAAW;CAClB"}

package/utils/file-tree.d.ts

@@ -0,0 +1,10 @@
+import { DialFile } from '@epam/ai-dial-react-file-manager';
+import { SkillFileTreeNode } from '../models/skill-editor-props';
+/**
+ * Builds the nested `DialFile[]` tree `DialFoldersTree` expects from the flat
+ * `SkillFileTreeNode[]` list, synthesising any implicit intermediate folders
+ * (e.g. `agents/analyzer.md` implies an `agents` folder even when no explicit
+ * folder node was added for it).
+ */
+export declare const buildDialFileTree: (nodes: SkillFileTreeNode[]) => DialFile[];
+//# sourceMappingURL=file-tree.d.ts.map

package/utils/file-tree.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"file-tree.d.ts","sourceRoot":"","sources":["../../src/utils/file-tree.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,kCAAkC,CAAC;AACjE,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,8BAA8B,CAAC;AAatE;;;;;GAKG;AACH,eAAO,MAAM,iBAAiB,GAAI,OAAO,iBAAiB,EAAE,KAAG,QAAQ,EAuDtE,CAAC"}