@epam/ai-dial-projects 1.3.0-dev.213 → 1.3.0-dev.223

package/index.js

@@ -1,172 +1,533 @@
-import { PanelEmptyState as e, buildCssVars as t, mergeClasses as n } from "@epam/ai-dial-chat-shared";
-import { ButtonAppearance as r, ButtonDropdown as i, ButtonVariant as a, DIAL_ICON_SIZE as o, DIAL_KIT_ICON_STROKE as s, ElementSize as c, GhostButton as l, Highlight as u, MenuItemMark as d, Search as f, Spinner as p } from "@epam/ai-dial-ui-kit";
-import { IconArrowsSort as m } from "@tabler/icons-react";
-import { useMemo as h } from "react";
-import { jsx as g, jsxs as _ } from "react/jsx-runtime";
+import { MARKDOWN_EDITOR_MAX_HEIGHT_CLASS_NAME as e, MARKDOWN_EDITOR_PREVIEW_LIST_CLASS_NAME as t, PROHIBITED_CONVERSATION_NAME_CHARS_RE as n, PanelEmptyState as r, RequestStatus as i, TextRefinementField as a, buildCssVars as o, getAttachmentTypeFromMime as s, inferMimeTypeFromPath as c, mergeClasses as l, useAvailableHeightCap as ee, useTextRefinement as u } from "@epam/ai-dial-chat-shared";
+import { Button as d, ButtonAppearance as te, ButtonDropdown as ne, ButtonVariant as f, CardShell as p, DIAL_ICON_SIZE as m, DIAL_KIT_ICON_STROKE as h, ElementSize as g, ErrorText as _, FileDropzone as v, FolderPath as y, GhostButton as b, Highlight as x, Input as S, Label as re, MenuItemMark as ie, Search as ae, Spinner as oe, Textarea as C } from "@epam/ai-dial-ui-kit";
+import { IconArrowNarrowLeft as se, IconArrowsSort as ce, IconPlus as le } from "@tabler/icons-react";
+import { Suspense as ue, lazy as w, useCallback as T, useEffect as de, useId as E, useMemo as D, useRef as O, useState as k } from "react";
+import { jsx as A, jsxs as j } from "react/jsx-runtime";
+import { AttachmentCard as fe, FileDndOverlay as pe } from "@epam/ai-dial-attachment-input";
+import { BuilderFormContainer as me } from "@epam/ai-dial-builder-form";
+import { LazyMarkdownEditor as M } from "@epam/ai-dial-ui-kit/editors";
 //#region src/types/projects-sort-key.ts
-var v = /* @__PURE__ */ function(e) {
+var N = /* @__PURE__ */ function(e) {
 	return e.Newest = "newest", e.Oldest = "oldest", e.NameAsc = "name-asc", e;
-}({}), y = (e, t) => {
+}({}), he = (e, t) => {
 	let n = t.trim().toLocaleLowerCase();
 	return n ? e.filter((e) => e.name.toLocaleLowerCase().includes(n)) : e;
-}, b = (e, t, n) => {
+}, ge = (e, t, n) => {
 	let r = new Intl.Collator(n, {
 		sensitivity: "base",
 		numeric: !0
 	}), i = (e, t) => r.compare(e.name, t.name);
-	if (t === v.NameAsc) return [...e].sort(i);
-	let a = t === v.Oldest ? 1 : -1;
+	if (t === N.NameAsc) return [...e].sort(i);
+	let a = t === N.Oldest ? 1 : -1;
 	return [...e].sort((e, t) => e.updatedAt == null && t.updatedAt == null ? i(e, t) : e.updatedAt == null ? 1 : t.updatedAt == null ? -1 : (e.updatedAt - t.updatedAt) * a || i(e, t));
-}, x = {
-	card: "_card_1w3yq_1",
-	title: "_title_1w3yq_6",
-	badge: "_badge_1w3yq_10",
-	meta: "_meta_1w3yq_15"
-}, S = ({ project: e, searchQuery: t, sourceLabel: r, formatUpdatedAt: i, titleClassName: a, badgeClassName: o, metaClassName: s }) => /* @__PURE__ */ _("li", {
-	className: n("flex min-w-0 flex-col gap-2 rounded-lg border p-4", x.card),
-	children: [/* @__PURE__ */ g(u, {
-		text: e.name,
-		query: t,
-		maxLines: 2,
-		className: n("min-w-0 break-words", a, x.title)
-	}), /* @__PURE__ */ _("div", {
-		className: "flex min-w-0 flex-wrap items-center gap-2",
-		children: [/* @__PURE__ */ g("span", {
-			className: n("w-fit shrink-0 rounded px-2 py-0.5", o, x.badge),
-			children: r
-		}), e.updatedAt != null && /* @__PURE__ */ g("time", {
-			dateTime: new Date(e.updatedAt).toISOString(),
-			className: n("min-w-0", s, x.meta),
-			children: i(e.updatedAt)
+}, P = {
+	card: "_card_1b611_1",
+	title: "_title_1b611_5",
+	footer: "_footer_1b611_9",
+	path: "_path_1b611_13"
+}, F = (e, t) => [e, ...(t ?? "").split("/").filter((e) => e.length > 0)], I = ({ project: e, searchQuery: t, sourceLabel: n, folderPathLabel: r, titleClassName: i, pathLabelClassName: a, pathLeafClassName: o }) => /* @__PURE__ */ A("li", {
+	className: "flex min-w-0",
+	children: /* @__PURE__ */ j(p, {
+		"aria-label": e.name,
+		className: l("flex w-full min-w-0 flex-col gap-3", P.card),
+		children: [/* @__PURE__ */ A(x, {
+			text: e.name,
+			query: t,
+			maxLines: 1,
+			className: l("min-w-0", i, P.title)
+		}), /* @__PURE__ */ A(y, {
+			segments: F(n, e.parentPath),
+			ariaLabel: r,
+			labelClassName: l(a, P.path),
+			leafClassName: l(o, P.path),
+			className: l("mt-auto pt-3", P.footer)
 		})]
-	})]
-}), C = {
+	})
+}), L = {
 	container: "_container_4rer8_1",
 	subtitle: "_subtitle_4rer8_5",
 	sortButton: "_sortButton_4rer8_9"
-}, w = ({ projects: u, isLoading: v = !1, hasError: x = !1, incompleteSources: w = [], onRetry: T, searchQuery: E, onSearchQueryChange: D, sortKey: O, onSortKeyChange: k, formatUpdatedAt: A, labels: j, locale: M, styles: N }) => {
-	let { colors: P, typography: F } = N ?? {}, I = F?.titleClassName ?? "dial-h1-text", L = F?.subtitleClassName ?? "dial-body-text", R = F?.cardTitleClassName ?? "dial-body-semi-text", z = F?.badgeClassName ?? "dial-tiny-semi-text", B = F?.metaClassName ?? "dial-small-text", V = t({
-		"--pr-bg": P?.background,
-		"--pr-subtitle-text": P?.subtitleText,
-		"--pr-sort-text": P?.sortButtonText,
-		"--pr-card-bg": P?.cardBackground,
-		"--pr-card-border": P?.cardBorder,
-		"--pr-card-title-text": P?.cardTitleText,
-		"--pr-badge-bg": P?.badgeBackground,
-		"--pr-badge-text": P?.badgeText,
-		"--pr-meta-text": P?.metaText
-	}), H = E.trim(), U = w.length > 0, W = U && u.length === 0, G = h(() => b(y(u, E), O, M), [
+}, R = ({ projects: e, isLoading: t = !1, hasError: n = !1, incompleteSources: i = [], onRetry: a, onCreateProject: s, searchQuery: c, onSearchQueryChange: ee, sortKey: u, onSortKeyChange: p, labels: _, locale: v, styles: y }) => {
+	let { colors: x, typography: S } = y ?? {}, re = S?.titleClassName ?? "dial-h1-text", C = S?.subtitleClassName ?? "dial-body-text", se = S?.cardTitleClassName ?? "dial-body-semi-text", ue = S?.pathLabelClassName ?? "dial-tiny-text", w = S?.pathLeafClassName ?? "dial-tiny-semi-text", T = o({
+		"--pr-bg": x?.background,
+		"--pr-subtitle-text": x?.subtitleText,
+		"--pr-sort-text": x?.sortButtonText,
+		"--pr-card-bg": x?.cardBackground,
+		"--pr-card-title-text": x?.cardTitleText,
+		"--pr-card-divider": x?.cardDivider,
+		"--pr-path-text": x?.pathText
+	}), de = c.trim(), E = i.length > 0, O = E && e.length === 0, k = D(() => ge(he(e, c), u, v), [
+		e,
+		c,
 		u,
-		E,
-		O,
-		M
-	]), K = j.sortOptions.find((e) => e.value === O)?.label ?? j.sortLabel, q = h(() => j.sortOptions.map((e) => ({
+		v
+	]), fe = _.sortOptions.find((e) => e.value === u)?.label ?? _.sortLabel, pe = D(() => _.sortOptions.map((e) => ({
 		key: e.value,
 		label: e.label,
-		mark: d.Check,
-		checked: e.value === O,
-		onClick: () => k(e.value)
+		mark: ie.Check,
+		checked: e.value === u,
+		onClick: () => p(e.value)
 	})), [
-		j.sortOptions,
-		O,
-		k
-	]), J = (e) => {
-		D(e ?? "");
-	}, Y = () => {
-		if (!v) return x ? j.errorLabel : U ? j.incompleteLabel : u.length === 0 ? j.emptyStateLabel : G.length === 0 ? j.noResultsLabel : j.resultCountLabel(G.length);
-	}, X = () => v ? /* @__PURE__ */ g(p, {}) : x || W ? /* @__PURE__ */ _("div", {
+		_.sortOptions,
+		u,
+		p
+	]), me = (e) => {
+		ee(e ?? "");
+	}, M = () => {
+		if (!t) return n ? _.errorLabel : E ? _.incompleteLabel : e.length === 0 ? _.emptyStateLabel : k.length === 0 ? _.noResultsLabel : _.resultCountLabel(k.length);
+	}, N = () => s ? /* @__PURE__ */ A(d, {
+		label: _.createProjectLabel,
+		variant: f.Primary,
+		iconBefore: /* @__PURE__ */ A(le, {
+			size: m.SM,
+			stroke: h,
+			"aria-hidden": !0
+		}),
+		onClick: s,
+		className: "shrink-0"
+	}) : void 0, P = () => t ? /* @__PURE__ */ A(oe, {}) : n || O ? /* @__PURE__ */ j("div", {
 		className: "flex flex-col items-center gap-3",
-		children: [/* @__PURE__ */ g("p", {
-			className: n(L, C.subtitle),
-			children: x ? j.errorLabel : j.incompleteLabel
-		}), /* @__PURE__ */ g(l, {
-			label: j.retryLabel,
-			onClick: T
+		children: [/* @__PURE__ */ A("p", {
+			className: l(C, L.subtitle),
+			children: n ? _.errorLabel : _.incompleteLabel
+		}), /* @__PURE__ */ A(b, {
+			label: _.retryLabel,
+			onClick: a
 		})]
-	}) : u.length === 0 ? /* @__PURE__ */ g(e, {
-		label: j.emptyStateLabel,
-		description: j.emptyStateDescription
-	}) : G.length === 0 ? /* @__PURE__ */ g(e, { label: j.noResultsLabel }) : /* @__PURE__ */ g("ul", {
-		className: "m-0 grid w-full min-w-0 list-none grid-cols-1 gap-4 p-0 desktop:grid-cols-[repeat(auto-fill,minmax(280px,1fr))]",
-		children: G.map((e) => /* @__PURE__ */ g(S, {
+	}) : e.length === 0 ? /* @__PURE__ */ A(r, {
+		label: _.emptyStateLabel,
+		description: _.emptyStateDescription,
+		action: N()
+	}) : k.length === 0 ? /* @__PURE__ */ A(r, { label: _.noResultsLabel }) : /* @__PURE__ */ A("ul", {
+		className: "m-0 grid w-full max-w-[1116px] min-w-0 list-none grid-cols-1 gap-5 p-0 desktop:grid-cols-3",
+		children: k.map((e) => /* @__PURE__ */ A(I, {
 			project: e,
-			searchQuery: H,
-			sourceLabel: j.sourceLabels[e.source],
-			formatUpdatedAt: A,
-			titleClassName: R,
-			badgeClassName: z,
-			metaClassName: B
+			searchQuery: de,
+			sourceLabel: _.sourceLabels[e.source],
+			folderPathLabel: _.folderPathLabel,
+			titleClassName: se,
+			pathLabelClassName: ue,
+			pathLeafClassName: w
 		}, e.id))
-	}), Z = v || x || G.length === 0;
-	return /* @__PURE__ */ _("div", {
-		style: V,
-		className: n("flex h-full w-full min-w-0 flex-col gap-4 overflow-y-auto px-4 py-4 desktop:gap-6 desktop:px-8", C.container),
+	}), F = t || n || k.length === 0;
+	return /* @__PURE__ */ j("div", {
+		style: T,
+		className: l("flex h-full w-full min-w-0 flex-col gap-4 overflow-y-auto px-4 py-4 desktop:gap-6 desktop:px-8", L.container),
 		children: [
-			/* @__PURE__ */ _("div", {
-				className: "min-w-0",
-				children: [/* @__PURE__ */ g("h1", {
-					className: n("break-words", I),
-					children: j.title
-				}), /* @__PURE__ */ g("p", {
-					className: n("mt-1", L, C.subtitle),
-					children: j.subtitle
-				})]
+			/* @__PURE__ */ j("div", {
+				className: "flex min-w-0 items-start justify-between gap-3",
+				children: [/* @__PURE__ */ j("div", {
+					className: "min-w-0",
+					children: [/* @__PURE__ */ A("h1", {
+						className: l("break-words", re),
+						children: _.title
+					}), /* @__PURE__ */ A("p", {
+						className: l("mt-1", C, L.subtitle),
+						children: _.subtitle
+					})]
+				}), N()]
 			}),
-			/* @__PURE__ */ _("div", {
+			/* @__PURE__ */ j("div", {
 				className: "flex flex-col gap-3 desktop:flex-row desktop:items-center",
-				children: [/* @__PURE__ */ g("div", {
+				children: [/* @__PURE__ */ A("div", {
 					role: "search",
 					className: "min-w-0 flex-1",
-					children: /* @__PURE__ */ g(f, {
-						value: E,
-						onChange: J,
-						placeholder: j.searchPlaceholder,
-						clearLabel: j.clearSearchLabel,
-						"aria-label": j.searchAriaLabel,
-						size: c.Large
+					children: /* @__PURE__ */ A(ae, {
+						value: c,
+						onChange: me,
+						placeholder: _.searchPlaceholder,
+						clearLabel: _.clearSearchLabel,
+						"aria-label": _.searchAriaLabel,
+						size: g.Large
 					})
-				}), j.sortOptions.length > 0 && /* @__PURE__ */ g("div", {
+				}), _.sortOptions.length > 0 && /* @__PURE__ */ A("div", {
 					role: "group",
-					"aria-label": j.sortLabel,
+					"aria-label": _.sortLabel,
 					className: "shrink-0",
-					children: /* @__PURE__ */ g(i, {
-						items: q,
-						label: K,
-						variant: a.Primary,
-						appearance: r.Ghost,
-						iconBefore: /* @__PURE__ */ g(m, {
-							size: o.SM,
+					children: /* @__PURE__ */ A(ne, {
+						items: pe,
+						label: fe,
+						variant: f.Primary,
+						appearance: te.Ghost,
+						iconBefore: /* @__PURE__ */ A(ce, {
+							size: m.SM,
 							"aria-hidden": !0,
-							stroke: s
+							stroke: h
 						}),
-						className: C.sortButton
+						className: L.sortButton
 					})
 				})]
 			}),
-			/* @__PURE__ */ g("span", {
+			/* @__PURE__ */ A("span", {
 				role: "status",
 				"aria-live": "polite",
 				className: "sr-only",
-				children: Y()
+				children: M()
 			}),
-			U && !v && !x && !W && /* @__PURE__ */ _("div", {
+			E && !t && !n && !O && /* @__PURE__ */ j("div", {
 				className: "flex flex-wrap items-center gap-3",
-				children: [/* @__PURE__ */ g("p", {
-					className: n(L, C.subtitle),
-					children: j.incompleteLabel
-				}), /* @__PURE__ */ g(l, {
-					label: j.retryLabel,
-					onClick: T
+				children: [/* @__PURE__ */ A("p", {
+					className: l(C, L.subtitle),
+					children: _.incompleteLabel
+				}), /* @__PURE__ */ A(b, {
+					label: _.retryLabel,
+					onClick: a
 				})]
 			}),
-			/* @__PURE__ */ g("div", {
-				className: n("flex w-full min-w-0 flex-1 flex-col", Z && "items-center justify-center"),
-				children: X()
+			/* @__PURE__ */ A("div", {
+				className: l("flex w-full min-w-0 flex-1 flex-col", F && "items-center justify-center"),
+				children: P()
 			})
 		]
 	});
-}, T = /* @__PURE__ */ function(e) {
+}, z = /* @__PURE__ */ function(e) {
 	return e.Personal = "personal", e.Shared = "shared", e.Organization = "organization", e;
-}({});
+}({}), B = (e) => !!e.dataTransfer?.types.includes("Files"), _e = (e) => {
+	let [t, n] = k(!1), r = O(0);
+	return {
+		isDragActive: t,
+		handlers: {
+			onDragEnter: T((e) => {
+				B(e) && (e.preventDefault(), r.current += 1, n(!0));
+			}, []),
+			onDragLeave: T((e) => {
+				B(e) && (--r.current, r.current <= 0 && (r.current = 0, n(!1)));
+			}, []),
+			onDragOver: T((e) => {
+				B(e) && e.preventDefault();
+			}, []),
+			onDrop: T((t) => {
+				if (!B(t)) return;
+				t.preventDefault(), r.current = 0, n(!1);
+				let i = Array.from(t.dataTransfer?.files ?? []);
+				i.length > 0 && e(i);
+			}, [e])
+		}
+	};
+}, V = /* @__PURE__ */ function(e) {
+	return e.UnsupportedType = "unsupported-type", e.TooLarge = "too-large", e.CapacityExceeded = "capacity-exceeded", e.Duplicate = "duplicate", e.InvalidName = "invalid-name", e;
+}({}), H = /* @__PURE__ */ function(e) {
+	return e.Required = "required", e.InvalidCharacters = "invalid-characters", e.Reserved = "reserved", e.TooLong = "too-long", e;
+}({}), ve = 255, U = new RegExp(n.source, "u"), ye = /[\p{Cc}‎‏‪-‮⁦-⁩]/u, be = /* @__PURE__ */ new Set([
+	".",
+	"..",
+	"v",
+	"files",
+	".dial-resource",
+	".dial-folder"
+]), xe = (e) => new TextEncoder().encode(e).length, Se = (e) => {
+	let t = e.trim();
+	return t.length === 0 ? H.Required : xe(t) > 255 ? H.TooLong : U.test(t) || ye.test(t) ? H.InvalidCharacters : be.has(t) ? H.Reserved : null;
+}, W = (e) => {
+	let t = e.lastIndexOf(".");
+	return t > 0 ? e.slice(t + 1).toLowerCase() : "";
+}, Ce = (e) => e.reduce((e, t) => e + t.file.size, 0), G = 0, we = () => (G += 1, `project-context-${Date.now()}-${G}`), Te = (e) => {
+	let t = e.type || c(e.name) || "application/octet-stream";
+	return {
+		id: we(),
+		name: e.name,
+		contentType: t,
+		type: s(t),
+		status: i.Idle,
+		file: e
+	};
+}, K = (e, t, n, r) => Se(e.name) != null || e.name.trim() !== e.name ? V.InvalidName : r.allowedExtensions.includes(W(e.name)) ? t.has(e.name) ? V.Duplicate : e.size > r.maxFileBytes ? V.TooLarge : n + e.size > r.maxTotalBytes ? V.CapacityExceeded : null : V.UnsupportedType, Ee = (e, t, n) => {
+	let r = new Set(t.map((e) => e.name)), i = Ce(t), a = [], o = [];
+	for (let t of e) {
+		let e = K(t, r, i, n);
+		e == null ? (r.add(t.name), i += t.size, a.push(Te(t))) : o.push({
+			name: t.name,
+			reason: e
+		});
+	}
+	return {
+		accepted: a,
+		rejected: o
+	};
+}, q = (e, t) => t <= 0 ? 100 : Math.min(100, Math.max(0, Math.round(e / t * 100))), J = {
+	track: "_track_15unh_1",
+	fill: "_fill_15unh_5",
+	text: "_text_15unh_9"
+}, De = ({ usedBytes: e, maxBytes: t, ariaLabel: n, formatLabel: r, textClassName: i = "dial-tiny-text" }) => {
+	if (e <= 0) return null;
+	let a = q(e, t), o = r(a);
+	return /* @__PURE__ */ j("div", {
+		className: "flex flex-col gap-1",
+		children: [/* @__PURE__ */ A("div", {
+			role: "meter",
+			"aria-label": n,
+			"aria-valuemin": 0,
+			"aria-valuemax": t,
+			"aria-valuenow": Math.min(e, t),
+			"aria-valuetext": o,
+			className: l("h-1 w-full overflow-hidden rounded-full", J.track),
+			children: /* @__PURE__ */ A("div", {
+				className: l("h-full rounded-full", J.fill),
+				style: { width: `${a}%` }
+			})
+		}), /* @__PURE__ */ A("span", {
+			"aria-hidden": !0,
+			className: l(i, J.text),
+			children: o
+		})]
+	});
+}, Oe = {
+	formColumn: "_formColumn_16edi_1",
+	helper: "_helper_16edi_10"
+}, ke = w(async () => ({ default: (await M()).MarkdownEditor })), Ae = "device", je = "file-manager", Y = ({ values: n, errors: r, onFieldChange: i, contextFiles: s, onContextFilesChange: c, allowedExtensions: d, maxFileBytes: p, maxTotalBytes: g, onPickFromFileManager: y, onRefineDescription: b, onRefineInstructions: x, onBack: ie, onCancel: ae, onSubmit: ce, isSubmitting: w = !1, labels: M, markdownEditorTheme: N, className: he, styles: ge }) => {
+	let P = E(), F = E(), I = E(), L = E(), R = E(), z = O(null), B = O(null), V = ee(), [H, ve] = k(!1), [U, ye] = k([]), [be, xe] = k(""), W = O(void 0), G = T((e) => e ? async (t, n) => {
+		if (W.current && !W.current.aborted) throw new DOMException("Busy", "AbortError");
+		W.current = n;
+		try {
+			return await e(t, n);
+		} finally {
+			W.current === n && (W.current = void 0);
+		}
+	} : void 0, []), we = D(() => G(b), [G, b]), Te = D(() => G(x), [G, x]), K = u({
+		value: n.description,
+		onChange: (e) => i("description", e),
+		onRefine: we,
+		disabled: w
+	}), q = u({
+		value: n.instructions,
+		onChange: (e) => i("instructions", e),
+		onRefine: Te,
+		disabled: w
+	}), J = K.isPending || q.isPending, Y = Se(n.name), X = r.name ?? (H && Y != null ? M.nameErrors[Y] : void 0), Me = Y != null || w || J;
+	de(() => {
+		r.name && z.current?.focus();
+	}, [r.name]);
+	let Ne = D(() => Ce(s), [s]), Pe = D(() => d.map((e) => `.${e}`).join(","), [d]), Z = (e) => {
+		if (e.length === 0) return;
+		let { accepted: t, rejected: n } = Ee(e, s, {
+			allowedExtensions: d,
+			maxFileBytes: p,
+			maxTotalBytes: g
+		});
+		ye(n), t.length > 0 && c([...s, ...t]), xe([t.length > 0 ? M.filesAddedStatus(t.length) : "", ...n.map(({ name: e, reason: t }) => M.fileRejections[t](e))].filter(Boolean).join(" "));
+	}, { isDragActive: Fe, handlers: Ie } = _e(Z), Le = (e) => {
+		let t = s.find((t) => t.id === e);
+		c(s.filter((t) => t.id !== e)), ye([]), t && xe(M.fileRemovedStatus(t.name));
+	}, Re = (e) => {
+		Z(Array.from(e.target.files ?? [])), e.target.value = "";
+	}, ze = async () => {
+		if (y) try {
+			let e = await y();
+			e && Z(e);
+		} catch {}
+	}, Be = [{
+		key: Ae,
+		label: M.addFromDeviceLabel,
+		onClick: () => B.current?.click()
+	}, ...y ? [{
+		key: je,
+		label: M.addFromFileManagerLabel,
+		onClick: () => void ze()
+	}] : []], Ve = () => {
+		!Me && (!W.current || W.current.aborted) && ce();
+	}, { colors: Q, typography: He } = ge ?? {}, Ue = He?.titleClassName ?? "dial-h1-text", $ = He?.labelClassName ?? "dial-body-semi-text", We = He?.helperClassName ?? "dial-tiny-text", Ge = o({
+		"--pcf-helper-text": Q?.helperText,
+		"--pcf-meter-track": Q?.meterTrack,
+		"--pcf-meter-fill": Q?.meterFill
+	}), Ke = M.refinement, qe = r.context, Je = !!qe;
+	return /* @__PURE__ */ j("div", {
+		className: l("relative flex h-full min-h-0 w-full", he),
+		...Ie,
+		children: [
+			/* @__PURE__ */ A(pe, {
+				isVisible: Fe,
+				labels: {
+					title: M.dropOverlayTitle,
+					subtitle: M.dropOverlaySubtitle
+				}
+			}),
+			/* @__PURE__ */ A(me, {
+				labels: {
+					title: M.title,
+					backButtonLabel: M.backLabel,
+					cancelButtonLabel: M.cancelLabel,
+					submitButtonLabel: M.createLabel,
+					submittingLabel: M.submittingLabel ?? M.createLabel
+				},
+				onBack: ie,
+				onCancel: ae,
+				onSubmit: Ve,
+				isCancelDisabled: w,
+				isSubmitDisabled: Me,
+				isSubmitting: w,
+				backIcon: /* @__PURE__ */ A(se, {
+					size: m.LG,
+					stroke: h,
+					"aria-hidden": !0,
+					className: "rtl:scale-x-[-1]"
+				}),
+				styles: {
+					colors: { background: Q?.background },
+					header: {
+						colors: { borderColor: Q?.headerBorder },
+						typography: { fontClassName: Ue }
+					},
+					cssVars: Ge
+				},
+				children: /* @__PURE__ */ j("div", {
+					className: l("mx-auto flex w-full max-w-[996px] min-w-0 flex-col gap-5 py-6", Oe.formColumn),
+					children: [
+						/* @__PURE__ */ j("div", {
+							className: "flex flex-col gap-1",
+							children: [/* @__PURE__ */ A(S, {
+								id: P,
+								inputRef: z,
+								value: n.name,
+								onChange: (e) => i("name", e ?? ""),
+								onBlur: () => ve(!0),
+								placeholder: M.namePlaceholder,
+								labelProps: {
+									label: M.nameLabel,
+									required: !0
+								},
+								required: !0,
+								"aria-required": !0,
+								invalid: !!X,
+								"aria-invalid": !!X,
+								"aria-describedby": X ? F : void 0
+							}), X && /* @__PURE__ */ A(_, {
+								id: F,
+								role: r.name ? "alert" : void 0,
+								className: We,
+								text: X
+							})]
+						}),
+						/* @__PURE__ */ A(a, {
+							isEnabled: !!b,
+							fieldId: I,
+							label: M.descriptionLabel,
+							labelClassName: $,
+							labels: Ke,
+							refinement: K,
+							disabled: w || J,
+							children: /* @__PURE__ */ A(C, {
+								id: I,
+								value: n.description,
+								onChange: (e) => {
+									K.reset(), i("description", e);
+								},
+								placeholder: M.descriptionPlaceholder,
+								labelProps: b ? void 0 : { label: M.descriptionLabel }
+							})
+						}),
+						/* @__PURE__ */ A(a, {
+							isEnabled: !!x,
+							fieldId: L,
+							label: M.instructionsLabel,
+							labelClassName: $,
+							labels: Ke,
+							refinement: q,
+							disabled: w || J,
+							children: /* @__PURE__ */ j("div", {
+								className: "flex flex-1 flex-col gap-1",
+								children: [!x && /* @__PURE__ */ A(re, {
+									htmlFor: L,
+									className: $,
+									label: M.instructionsLabel
+								}), /* @__PURE__ */ A("div", {
+									ref: V,
+									className: l("w-full", e, t),
+									children: /* @__PURE__ */ A(ue, {
+										fallback: /* @__PURE__ */ A(oe, {}),
+										children: /* @__PURE__ */ A(ke, {
+											id: L,
+											value: n.instructions,
+											onChange: (e) => {
+												q.reset(), i("instructions", e);
+											},
+											height: 360,
+											theme: N,
+											placeholder: M.instructionsPlaceholder
+										})
+									})
+								})]
+							})
+						}),
+						/* @__PURE__ */ j("section", {
+							"aria-labelledby": R,
+							className: "flex flex-col gap-3",
+							children: [
+								/* @__PURE__ */ j("div", {
+									className: "flex min-w-0 items-center justify-between gap-2",
+									children: [/* @__PURE__ */ A("h2", {
+										id: R,
+										className: $,
+										children: M.contextLabel
+									}), /* @__PURE__ */ A(ne, {
+										items: Be,
+										label: M.addLabel,
+										variant: f.Primary,
+										appearance: te.Ghost,
+										disabled: w,
+										iconBefore: /* @__PURE__ */ A(le, {
+											size: m.SM,
+											stroke: h,
+											"aria-hidden": !0
+										})
+									})]
+								}),
+								/* @__PURE__ */ A("input", {
+									ref: B,
+									type: "file",
+									multiple: !0,
+									accept: Pe,
+									tabIndex: -1,
+									"aria-hidden": !0,
+									className: "sr-only",
+									onChange: Re
+								}),
+								/* @__PURE__ */ A(v, {
+									label: M.dropZoneLabel,
+									description: M.dropZoneHint,
+									accept: Pe,
+									multiple: !0,
+									disabled: w,
+									onChange: Z,
+									onReject: Z
+								}),
+								(U.length > 0 || Je) && /* @__PURE__ */ j("ul", {
+									className: l("flex flex-col gap-1", We, Oe.helper),
+									children: [U.map(({ name: e, reason: t }) => /* @__PURE__ */ A("li", { children: M.fileRejections[t](e) }, `${t}:${e}`)), Je && /* @__PURE__ */ A("li", {
+										role: "alert",
+										children: qe
+									})]
+								}),
+								s.length > 0 && /* @__PURE__ */ A("ul", {
+									className: "flex min-w-0 flex-wrap gap-2",
+									children: s.map((e) => /* @__PURE__ */ A("li", {
+										className: "min-w-0",
+										children: /* @__PURE__ */ A(fe, {
+											attachment: e,
+											onRemove: Le,
+											labels: { removeLabel: M.removeFileLabel(e.name) }
+										})
+									}, e.id))
+								}),
+								/* @__PURE__ */ A(De, {
+									usedBytes: Ne,
+									maxBytes: g,
+									ariaLabel: M.capacityMeterLabel,
+									formatLabel: M.capacityLabel,
+									textClassName: We
+								})
+							]
+						})
+					]
+				})
+			}),
+			/* @__PURE__ */ A("span", {
+				role: "status",
+				"aria-live": "polite",
+				className: "sr-only",
+				children: w ? M.creatingStatus : be
+			})
+		]
+	});
+};
 //#endregion
-export { T as ProjectSource, w as Projects, v as ProjectsSortKey };
+export { V as ContextFileRejection, ve as PROJECT_NAME_MAX_BYTES, Y as ProjectCreateForm, H as ProjectNameError, z as ProjectSource, R as Projects, N as ProjectsSortKey, Ee as checkContextFiles, Ce as getContextFilesSize, Se as validateProjectName };