@epam/ai-dial-scheduled-tasks 1.1.0-dev.134 → 1.1.0-dev.138

package/index.js

@@ -1,14 +1,14 @@
 import { MDMessageViewer as e, PanelEmptyState as t, buildCssVars as n, mergeClasses as r } from "@epam/ai-dial-chat-shared";
 import { SearchBar as i } from "@epam/ai-dial-kit";
-import { ButtonAppearance as a, ButtonDropdown as o, ButtonVariant as s, Calendar as c, CalendarMode as l, CardShell as u, DIAL_ICON_SIZE as d, Dropdown as f, FolderPath as p, GhostButton as m, GhostIconButton as h, Highlight as g, IconButton as _, Input as v, LazyMarkdownEditor as y, NeutralButton as b, NumberInput as x, PrimaryButton as S, Select as C, Skeleton as w, SkeletonVariant as T, Spinner as E, Textarea as D } from "@epam/ai-dial-ui-kit";
-import { IconAlertTriangle as O, IconArrowLeft as ee, IconCalendarTime as k, IconCircleCheck as A, IconCircleX as j, IconDotsVertical as M, IconEdit as N, IconPencilMinus as P, IconPlayerPlay as F, IconPlus as I, IconTrash as te } from "@tabler/icons-react";
-import { Suspense as L, lazy as R, useEffect as ne, useMemo as z, useRef as re } from "react";
-import { Fragment as B, jsx as V, jsxs as H } from "react/jsx-runtime";
-import { BuilderFormContainer as U } from "@epam/ai-dial-builder-form";
+import { ButtonAppearance as a, ButtonDropdown as o, ButtonVariant as s, Calendar as c, CalendarMode as l, CardShell as u, DIAL_ICON_SIZE as d, FolderPath as f, GhostButton as p, GhostIconButton as m, Highlight as h, Input as g, LazyMarkdownEditor as _, NeutralButton as v, NumberInput as y, PrimaryButton as b, Select as x, Skeleton as S, SkeletonVariant as C, Spinner as w, Textarea as T } from "@epam/ai-dial-ui-kit";
+import { IconAlertTriangle as E, IconArrowLeft as D, IconCalendarTime as O, IconCircleCheck as k, IconCircleX as A, IconPencilMinus as j, IconPlus as ee } from "@tabler/icons-react";
+import { Suspense as M, lazy as N, useEffect as P, useMemo as te, useRef as F } from "react";
+import { Fragment as I, jsx as L, jsxs as R } from "react/jsx-runtime";
+import { BuilderFormContainer as z } from "@epam/ai-dial-builder-form";
 //#region src/models/scheduled-task-item.ts
-var W = /* @__PURE__ */ function(e) {
+var B = /* @__PURE__ */ function(e) {
 	return e.Shared = "shared", e.MyTasks = "myTasks", e;
-}({}), G = {
+}({}), V = {
 	title: "_title_1xv9i_1",
 	description: "_description_1xv9i_5",
 	schedulePill: "_schedulePill_1xv9i_9",
@@ -17,284 +17,229 @@ var W = /* @__PURE__ */ function(e) {
 	locationLeaf: "_locationLeaf_1xv9i_22",
 	newBadge: "_newBadge_1xv9i_26",
 	locationDivider: "_locationDivider_1xv9i_31"
-}, K = ({ item: e, searchQuery: t = "", onEdit: i, onRunNow: a, onDelete: o, onCardClick: s, labels: c, styles: l, className: m }) => {
-	let h = c?.newBadgeLabel ?? "NEW", v = c?.actionsLabel ?? "More actions", y = c?.editActionLabel ?? "Edit", b = c?.runNowActionLabel ?? "Run now", x = c?.deleteActionLabel ?? "Delete", { colors: S, typography: C } = l ?? {}, w = C?.titleClassName ?? "dial-body-semi-text", T = C?.descriptionClassName ?? "dial-small-text", E = C?.scheduleLabelClassName ?? "dial-tiny-text", D = C?.locationLabelClassName ?? "dial-tiny-text", O = C?.locationLeafClassName ?? "dial-tiny-semi-text", ee = C?.newBadgeClassName ?? "dial-tiny-semi-text", k = n({
-		"--stc-title-text": S?.titleText,
-		"--stc-desc-text": S?.descriptionText,
-		"--stc-pill-bg": S?.schedulePillBackground,
-		"--stc-pill-border": S?.schedulePillBorder,
-		"--stc-schedule-label-text": S?.scheduleLabelText,
-		"--stc-location-label-text": S?.locationLabelText,
-		"--stc-location-leaf-text": S?.locationLeafText,
-		"--stc-new-badge-bg": S?.newBadgeBackground,
-		"--stc-new-badge-text": S?.newBadgeText,
-		"--stc-location-divider-border": S?.locationDividerBorder
-	}), A = [];
-	i && A.push({
-		key: "edit",
-		label: y,
-		icon: /* @__PURE__ */ V(N, {
-			size: d.SM,
-			"aria-hidden": !0
-		}),
-		onClick: ({ domEvent: t }) => {
-			t.stopPropagation(), i(e.id);
-		}
-	}), a && A.push({
-		key: "runNow",
-		label: b,
-		icon: /* @__PURE__ */ V(F, {
-			size: d.SM,
-			"aria-hidden": !0
-		}),
-		onClick: ({ domEvent: t }) => {
-			t.stopPropagation(), a(e.id);
-		}
-	}), o && A.push({
-		key: "delete",
-		label: x,
-		icon: /* @__PURE__ */ V(te, {
-			size: d.SM,
-			"aria-hidden": !0
-		}),
-		danger: !0,
-		onClick: ({ domEvent: t }) => {
-			t.stopPropagation(), o(e.id);
-		}
-	});
-	let j = s ? {
+}, H = ({ item: e, searchQuery: t = "", onCardClick: i, labels: a, styles: o, className: s }) => {
+	let c = a?.newBadgeLabel ?? "NEW", { colors: l, typography: d } = o ?? {}, p = d?.titleClassName ?? "dial-body-semi-text", m = d?.descriptionClassName ?? "dial-small-text", g = d?.scheduleLabelClassName ?? "dial-tiny-text", _ = d?.locationLabelClassName ?? "dial-tiny-text", v = d?.locationLeafClassName ?? "dial-tiny-semi-text", y = d?.newBadgeClassName ?? "dial-tiny-semi-text", b = n({
+		"--stc-title-text": l?.titleText,
+		"--stc-desc-text": l?.descriptionText,
+		"--stc-pill-bg": l?.schedulePillBackground,
+		"--stc-pill-border": l?.schedulePillBorder,
+		"--stc-schedule-label-text": l?.scheduleLabelText,
+		"--stc-location-label-text": l?.locationLabelText,
+		"--stc-location-leaf-text": l?.locationLeafText,
+		"--stc-new-badge-bg": l?.newBadgeBackground,
+		"--stc-new-badge-text": l?.newBadgeText,
+		"--stc-location-divider-border": l?.locationDividerBorder
+	}), x = i ? {
 		tabIndex: 0,
-		onClick: () => s(e.id),
+		onClick: () => i(e.id),
 		onKeyDown: (t) => {
-			(t.key === "Enter" || t.key === " ") && (t.preventDefault(), s(e.id));
+			(t.key === "Enter" || t.key === " ") && (t.preventDefault(), i(e.id));
 		}
 	} : {};
-	return /* @__PURE__ */ H(u, {
-		role: s ? "button" : "group",
+	return /* @__PURE__ */ R(u, {
+		role: i ? "button" : "group",
 		"aria-label": e.displayName,
-		style: k,
-		className: r("h-[232px]", s && "cursor-pointer", m),
-		...j,
+		style: b,
+		className: r("h-[232px]", i && "cursor-pointer", s),
+		...x,
 		children: [
-			/* @__PURE__ */ H("div", {
-				className: "flex shrink-0 items-start justify-between gap-2",
-				children: [/* @__PURE__ */ H("div", {
-					className: "flex min-w-0 flex-1 items-center gap-2",
-					children: [/* @__PURE__ */ V(g, {
-						text: e.displayName,
-						query: t,
-						maxLines: 1,
-						className: r(w, G.title)
-					}), e.isNew && /* @__PURE__ */ V("span", {
-						className: r("shrink-0 rounded-full px-2 py-0.5", ee, G.newBadge),
-						children: h
-					})]
-				}), A.length > 0 && /* @__PURE__ */ V(f, {
-					items: A,
-					matchReferenceWidth: !1,
-					placement: "bottom-end",
-					children: /* @__PURE__ */ V(_, {
-						icon: /* @__PURE__ */ V(M, {
-							size: d.SM,
-							"aria-hidden": !0
-						}),
-						"aria-label": v,
-						className: "shrink-0",
-						onClick: (e) => e.stopPropagation()
-					})
+			/* @__PURE__ */ R("div", {
+				className: "flex min-w-0 shrink-0 items-center gap-2",
+				children: [/* @__PURE__ */ L(h, {
+					text: e.displayName,
+					query: t,
+					maxLines: 1,
+					className: r(p, V.title)
+				}), e.isNew && /* @__PURE__ */ L("span", {
+					className: r("shrink-0 rounded-full px-2 py-0.5", y, V.newBadge),
+					children: c
 				})]
 			}),
-			e.descriptionPreview && /* @__PURE__ */ V("p", {
-				className: r("line-clamp-4 min-h-0 flex-1 overflow-hidden !leading-[22px]", T, G.description),
+			e.descriptionPreview && /* @__PURE__ */ L("p", {
+				className: r("line-clamp-4 min-h-0 flex-1 overflow-hidden !leading-[22px]", m, V.description),
 				children: e.descriptionPreview
 			}),
-			/* @__PURE__ */ H("div", {
+			/* @__PURE__ */ R("div", {
 				className: "mt-auto flex shrink-0 flex-col gap-3",
-				children: [/* @__PURE__ */ V("div", {
+				children: [/* @__PURE__ */ L("div", {
 					className: "flex min-h-[28px] items-center",
-					children: /* @__PURE__ */ V("span", {
-						className: r("inline-block rounded-lg border px-2 py-1", G.schedulePill, E, G.scheduleLabel),
+					children: /* @__PURE__ */ L("span", {
+						className: r("inline-block rounded-lg border px-2 py-1", V.schedulePill, g, V.scheduleLabel),
 						children: e.scheduleLabel
 					})
-				}), e.locationSegments && e.locationSegments.length > 0 && /* @__PURE__ */ V(p, {
+				}), e.locationSegments && e.locationSegments.length > 0 && /* @__PURE__ */ L(f, {
 					segments: e.locationSegments,
-					labelClassName: r(D, G.locationLabel),
-					leafClassName: r(O, G.locationLeaf),
-					className: r("pt-3", G.locationDivider)
+					labelClassName: r(_, V.locationLabel),
+					leafClassName: r(v, V.locationLeaf),
+					className: r("pt-3", V.locationDivider)
 				})]
 			})
 		]
 	});
-}, q = { card: "_card_1a43j_1" }, ie = [
+}, ne = { card: "_card_1a43j_1" }, re = [
 	"100%",
 	"100%",
 	"61%"
-], ae = "var(--stcs-skeleton-bg)", oe = ({ styles: e }) => /* @__PURE__ */ H(u, {
+], U = "var(--stcs-skeleton-bg)", W = ({ styles: e }) => /* @__PURE__ */ R(u, {
 	"aria-hidden": !0,
 	style: n({ "--stcs-skeleton-bg": e?.colors?.skeletonColor }),
-	className: r("h-[232px]", q.card),
+	className: r("h-[232px]", ne.card),
 	children: [
-		/* @__PURE__ */ V(w, {
-			variant: T.Rectangular,
+		/* @__PURE__ */ L(S, {
+			variant: C.Rectangular,
 			width: "60%",
 			height: "20px",
-			color: ae,
+			color: U,
 			className: "shrink-0"
 		}),
-		/* @__PURE__ */ V("div", {
+		/* @__PURE__ */ L("div", {
 			className: "flex min-h-0 flex-1 flex-col gap-3 overflow-hidden",
-			children: ie.map((e, t) => /* @__PURE__ */ V(w, {
-				variant: T.Rectangular,
+			children: re.map((e, t) => /* @__PURE__ */ L(S, {
+				variant: C.Rectangular,
 				width: e,
 				height: "16px",
-				color: ae
+				color: U
 			}, t))
 		}),
-		/* @__PURE__ */ V(w, {
-			variant: T.Rectangular,
+		/* @__PURE__ */ L(S, {
+			variant: C.Rectangular,
 			width: "110px",
 			height: "28px",
-			color: ae,
+			color: U,
 			className: "shrink-0 rounded-lg"
 		})
 	]
-}), se = ({ items: e, searchQuery: t, onEdit: n, onRunNow: r, onDelete: i, onCardClick: a, labels: o, cardStyles: s, trailingSkeletonCount: c = 0, skeletonStyles: l }) => /* @__PURE__ */ H("div", {
+}), ie = ({ items: e, searchQuery: t, onCardClick: n, labels: r, cardStyles: i, trailingSkeletonCount: a = 0, skeletonStyles: o }) => /* @__PURE__ */ R("div", {
 	className: "grid grid-cols-1 gap-5 desktop:grid-cols-3",
-	children: [e.map((e) => /* @__PURE__ */ V(K, {
+	children: [e.map((e) => /* @__PURE__ */ L(H, {
 		item: e,
 		searchQuery: t,
-		onEdit: n,
-		onRunNow: r,
-		onDelete: i,
-		onCardClick: a,
-		labels: o,
-		styles: s
-	}, e.id)), Array.from({ length: c }, (e, t) => /* @__PURE__ */ V(oe, { styles: l }, `skeleton-${t}`))]
-}), ce = { countBadge: "_countBadge_4bnxj_1" }, le = ({ title: e, count: t, children: i, styles: a }) => {
+		onCardClick: n,
+		labels: r,
+		styles: i
+	}, e.id)), Array.from({ length: a }, (e, t) => /* @__PURE__ */ L(W, { styles: o }, `skeleton-${t}`))]
+}), ae = { countBadge: "_countBadge_4bnxj_1" }, oe = ({ title: e, count: t, children: i, styles: a }) => {
 	let o = a?.typography?.titleClassName ?? "dial-small-semi-text", s = a?.typography?.countBadgeClassName ?? "dial-tiny-text", c = n({
 		"--sts-badge-bg": a?.colors?.countBadgeBackground,
 		"--sts-badge-text": a?.colors?.countBadgeText
 	});
-	return /* @__PURE__ */ H("section", {
+	return /* @__PURE__ */ R("section", {
 		...e ? { "aria-label": e } : {},
 		style: c,
 		className: "flex flex-col gap-3",
-		children: [e && /* @__PURE__ */ H("div", {
+		children: [e && /* @__PURE__ */ R("div", {
 			className: "flex items-center gap-2 rtl:flex-row-reverse",
-			children: [/* @__PURE__ */ V("h2", {
+			children: [/* @__PURE__ */ L("h2", {
 				className: o,
 				children: e
-			}), /* @__PURE__ */ V("span", {
-				className: r("rounded-full px-2 py-0.5", s, ce.countBadge),
+			}), /* @__PURE__ */ L("span", {
+				className: r("rounded-full px-2 py-0.5", s, ae.countBadge),
 				children: t
 			})]
 		}), i]
 	});
-}, J = {
+}, G = {
 	container: "_container_r5sk9_1",
 	subtitle: "_subtitle_r5sk9_5",
 	sortButton: "_sortButton_r5sk9_9"
-}, ue = [W.Shared, W.MyTasks], de = (e, t, n, r, i, a) => {
+}, se = [B.Shared, B.MyTasks], ce = (e, t, n, r, i, a) => {
 	if (!e) return t ? a.loadingMoreLabel : n ? a.errorLabel : r > 0 ? `${r}` : i ? a.noResultsLabel : a.emptyStateLabel;
-}, fe = (e) => {
+}, K = (e) => {
 	if (!e || e === document.body) return null;
 	let { overflow: t, overflowY: n } = getComputedStyle(e);
-	return t === "auto" || t === "scroll" || n === "auto" || n === "scroll" ? e : fe(e.parentElement);
-}, pe = ({ labels: e, onCreateClick: c, searchQuery: l, onSearchQueryChange: u, sortKey: f, onSortChange: p, items: h, isLoading: g = !1, error: _, onRetry: v, hasMore: y = !1, isLoadingMore: b = !1, skeletonCount: x = 6, onLoadMore: C, onEdit: w, onRunNow: T, onDelete: D, onCardClick: O, styles: ee }) => {
-	let { colors: A, typography: j, emptyStateIconSize: M = 48 } = ee ?? {}, N = j?.titleClassName ?? "dial-h1-text", P = j?.subtitleClassName ?? "dial-body-text", F = n({
-		"--st-bg": A?.background,
-		"--st-subtitle-text": A?.subtitleText,
-		"--st-sort-text": A?.sortButtonText
-	}), te = e.sortOptions.find((e) => e.key === f)?.label ?? "", L = z(() => {
-		let t = { [W.Shared]: e.sharedSectionTitle };
-		return ue.map((e) => ({
+	return t === "auto" || t === "scroll" || n === "auto" || n === "scroll" ? e : K(e.parentElement);
+}, le = ({ labels: e, onCreateClick: c, searchQuery: l, onSearchQueryChange: u, sortKey: f, onSortChange: m, items: h, isLoading: g = !1, error: _, onRetry: v, hasMore: y = !1, isLoadingMore: x = !1, skeletonCount: S = 6, onLoadMore: C, onCardClick: T, styles: E }) => {
+	let { colors: D, typography: k, emptyStateIconSize: A = 48 } = E ?? {}, j = k?.titleClassName ?? "dial-h1-text", M = k?.subtitleClassName ?? "dial-body-text", N = n({
+		"--st-bg": D?.background,
+		"--st-subtitle-text": D?.subtitleText,
+		"--st-sort-text": D?.sortButtonText
+	}), I = e.sortOptions.find((e) => e.key === f)?.label ?? "", z = te(() => {
+		let t = { [B.Shared]: e.sharedSectionTitle };
+		return se.map((e) => ({
 			key: e,
 			title: t[e],
 			items: h.filter((t) => t.sectionKey === e)
 		})).filter((e) => e.items.length > 0);
-	}, [h, e.sharedSectionTitle]), R = de(g, b, !!_, h.length, l.trim().length > 0, e), B = re(null);
-	ne(() => {
-		let e = B.current;
+	}, [h, e.sharedSectionTitle]), V = ce(g, x, !!_, h.length, l.trim().length > 0, e), H = F(null);
+	P(() => {
+		let e = H.current;
 		if (!e || !C) return;
-		let t = fe(e.parentElement);
+		let t = K(e.parentElement);
 		if (!t) return;
 		let n = () => {
-			if (b || g || !y) return;
+			if (x || g || !y) return;
 			let n = t.getBoundingClientRect(), r = e.getBoundingClientRect();
 			r.top < n.bottom && r.bottom > n.top && C();
 		};
 		return t.addEventListener("scroll", n, { passive: !0 }), n(), () => t.removeEventListener("scroll", n);
 	}, [
 		y,
-		b,
+		x,
 		g,
 		C
 	]);
-	let U = () => {
-		if (g) return /* @__PURE__ */ V(E, {});
-		if (_) return /* @__PURE__ */ H("div", {
+	let ne = () => {
+		if (g) return /* @__PURE__ */ L(w, {});
+		if (_) return /* @__PURE__ */ R("div", {
 			className: "flex flex-col items-center gap-3",
-			children: [/* @__PURE__ */ V("p", {
-				className: r(P, J.subtitle),
+			children: [/* @__PURE__ */ L("p", {
+				className: r(M, G.subtitle),
 				children: e.errorLabel
-			}), /* @__PURE__ */ V(m, {
+			}), /* @__PURE__ */ L(p, {
 				label: e.retryLabel,
 				onClick: v
 			})]
 		});
-		if (h.length === 0) return l.trim() ? /* @__PURE__ */ V("p", {
-			className: r(P, J.subtitle),
+		if (h.length === 0) return l.trim() ? /* @__PURE__ */ L("p", {
+			className: r(M, G.subtitle),
 			children: e.noResultsLabel
-		}) : /* @__PURE__ */ V(t, {
-			icon: /* @__PURE__ */ V(k, {
+		}) : /* @__PURE__ */ L(t, {
+			icon: /* @__PURE__ */ L(O, {
 				"aria-hidden": !0,
-				size: M,
+				size: A,
 				stroke: 1
 			}),
 			label: e.emptyStateLabel
 		});
-		let n = L.length - 1;
-		return /* @__PURE__ */ H("div", {
+		let n = z.length - 1;
+		return /* @__PURE__ */ R("div", {
 			className: "flex w-full flex-col gap-6",
-			children: [L.map((t, r) => /* @__PURE__ */ V(le, {
+			children: [z.map((t, r) => /* @__PURE__ */ L(oe, {
 				title: t.title,
 				count: t.items.length,
-				children: /* @__PURE__ */ V(se, {
+				children: /* @__PURE__ */ L(ie, {
 					items: t.items,
 					searchQuery: l,
-					onEdit: w,
-					onRunNow: T,
-					onDelete: D,
-					onCardClick: O,
+					onCardClick: T,
 					labels: e.cardLabels,
-					trailingSkeletonCount: b && r === n ? x : 0,
-					skeletonStyles: { colors: { skeletonColor: A?.skeletonColor } }
+					trailingSkeletonCount: x && r === n ? S : 0,
+					skeletonStyles: { colors: { skeletonColor: D?.skeletonColor } }
 				})
-			}, t.key)), /* @__PURE__ */ V("div", {
-				ref: B,
+			}, t.key)), /* @__PURE__ */ L("div", {
+				ref: H,
 				"aria-hidden": !0,
 				className: "h-px w-full"
 			})]
 		});
-	}, G = g || !!_ || h.length === 0;
-	return /* @__PURE__ */ H("div", {
-		style: F,
-		className: r("flex h-full w-full flex-col gap-6 overflow-y-auto px-8 py-4", J.container),
+	}, re = g || !!_ || h.length === 0;
+	return /* @__PURE__ */ R("div", {
+		style: N,
+		className: r("flex h-full w-full flex-col gap-6 overflow-y-auto px-8 py-4", G.container),
 		children: [
-			/* @__PURE__ */ H("div", {
+			/* @__PURE__ */ R("div", {
 				className: "flex items-start justify-between gap-4",
-				children: [/* @__PURE__ */ H("div", {
+				children: [/* @__PURE__ */ R("div", {
 					className: "min-w-0 gap-2",
-					children: [/* @__PURE__ */ V("h1", {
-						className: r("truncate", N),
+					children: [/* @__PURE__ */ L("h1", {
+						className: r("truncate", j),
 						children: e.title
-					}), /* @__PURE__ */ V("p", {
-						className: r("mt-1", P, J.subtitle),
+					}), /* @__PURE__ */ L("p", {
+						className: r("mt-1", M, G.subtitle),
 						children: e.subtitle
 					})]
-				}), /* @__PURE__ */ V(S, {
+				}), /* @__PURE__ */ L(b, {
 					label: e.createButtonLabel,
-					iconBefore: /* @__PURE__ */ V(I, {
+					iconBefore: /* @__PURE__ */ L(ee, {
 						size: d.SM,
 						"aria-hidden": !0
 					}),
@@ -302,11 +247,11 @@ var W = /* @__PURE__ */ function(e) {
 					className: "shrink-0"
 				})]
 			}),
-			/* @__PURE__ */ H("div", {
+			/* @__PURE__ */ R("div", {
 				className: "flex flex-wrap items-center gap-3",
-				children: [/* @__PURE__ */ V("div", {
+				children: [/* @__PURE__ */ L("div", {
 					className: "flex-1",
-					children: /* @__PURE__ */ V(i, {
+					children: /* @__PURE__ */ L(i, {
 						value: l,
 						onChange: u,
 						labels: {
@@ -322,61 +267,61 @@ var W = /* @__PURE__ */ function(e) {
 							clearButtonClassName: "size-11 desktop:size-auto"
 						}
 					})
-				}), e.sortOptions.length > 0 && /* @__PURE__ */ V(o, {
-					label: te,
+				}), e.sortOptions.length > 0 && /* @__PURE__ */ L(o, {
+					label: I,
 					variant: s.Primary,
 					appearance: a.Ghost,
 					items: e.sortOptions.map((e) => ({
 						...e,
-						onClick: () => p(e.key)
+						onClick: () => m(e.key)
 					}))
 				})]
 			}),
-			/* @__PURE__ */ V("span", {
+			/* @__PURE__ */ L("span", {
 				role: "status",
 				"aria-live": "polite",
 				className: "sr-only",
-				children: R
+				children: V
 			}),
-			/* @__PURE__ */ V("div", {
-				className: r("mx-auto flex size-full w-full max-w-[1180px] flex-col", G && "items-center justify-center"),
-				children: U()
+			/* @__PURE__ */ L("div", {
+				className: r("mx-auto flex size-full w-full max-w-[1180px] flex-col", re && "items-center justify-center"),
+				children: ne()
 			})
 		]
 	});
-}, me = /* @__PURE__ */ function(e) {
+}, ue = /* @__PURE__ */ function(e) {
 	return e.FirstToRun = "firstToRun", e.LastToRun = "lastToRun", e.Newest = "newest", e.NameAZ = "nameAZ", e;
-}({}), he = 500, Y = /* @__PURE__ */ function(e) {
+}({}), de = 500, q = /* @__PURE__ */ function(e) {
 	return e.OneTime = "oneTime", e.Hourly = "hourly", e.Daily = "daily", e.Weekly = "weekly", e.Monthly = "monthly", e;
-}({}), X = (e) => String(e).padStart(2, "0"), ge = (e) => e ? new Date(e) : null, _e = (e) => {
+}({}), J = (e) => String(e).padStart(2, "0"), fe = (e) => e ? new Date(e) : null, pe = (e) => {
 	if (e == null) return "";
 	let t = e instanceof Date ? e : new Date(e);
-	return Number.isNaN(t.getTime()) ? "" : `${t.getFullYear()}-${X(t.getMonth() + 1)}-${X(t.getDate())}T${X(t.getHours())}:${X(t.getMinutes())}`;
-}, ve = (e) => {
+	return Number.isNaN(t.getTime()) ? "" : `${t.getFullYear()}-${J(t.getMonth() + 1)}-${J(t.getDate())}T${J(t.getHours())}:${J(t.getMinutes())}`;
+}, me = (e) => {
 	if (!e) return null;
 	let [t, n, r] = e.split("-").map(Number);
 	return new Date(t, n - 1, r);
-}, ye = (e) => {
+}, he = (e) => {
 	if (e == null) return "";
 	let t = e instanceof Date ? e : new Date(e);
-	return Number.isNaN(t.getTime()) ? "" : `${t.getFullYear()}-${X(t.getMonth() + 1)}-${X(t.getDate())}`;
-}, be = (e) => {
+	return Number.isNaN(t.getTime()) ? "" : `${t.getFullYear()}-${J(t.getMonth() + 1)}-${J(t.getDate())}`;
+}, ge = (e) => {
 	let t = Number(e);
 	return e && Number.isFinite(t) ? String(t + 1) : null;
-}, xe = (e) => {
+}, _e = (e) => {
 	let t = typeof e == "string" ? Number(e) : NaN;
 	return Number.isFinite(t) ? String(t - 1) : "";
-}, Z = {
+}, Y = {
 	detailsColumn: "_detailsColumn_1mg3v_1",
 	sectionSubtitle: "_sectionSubtitle_1mg3v_5",
 	instructionsError: "_instructionsError_1mg3v_9"
-}, Se = (e) => `${e} *`, Ce = R(async () => ({ default: (await y()).MarkdownEditor })), we = ({ labels: e, values: t, errors: i, modelOptions: a, onFieldChange: o, onBack: s, onCancel: u, onSubmit: d, isSubmitting: f = !1, markdownEditorTheme: p, styles: m }) => {
-	let { colors: h, typography: g } = m ?? {}, _ = g?.titleClassName ?? "dial-h1-text", y = g?.sectionTitleClassName ?? "dial-body-semi-text", b = g?.sectionSubtitleClassName ?? "dial-tiny-text", S = g?.instructionsLabelClassName ?? "dial-body-semi-text mb-1", w = g?.instructionsErrorClassName ?? "dial-small-text", T = n({
+}, X = (e) => `${e} *`, ve = N(async () => ({ default: (await _()).MarkdownEditor })), ye = ({ labels: e, values: t, errors: i, modelOptions: a, onFieldChange: o, onBack: s, onCancel: u, onSubmit: d, isSubmitting: f = !1, markdownEditorTheme: p, styles: m }) => {
+	let { colors: h, typography: _ } = m ?? {}, v = _?.titleClassName ?? "dial-h1-text", b = _?.sectionTitleClassName ?? "dial-body-semi-text", S = _?.sectionSubtitleClassName ?? "dial-tiny-text", C = _?.instructionsLabelClassName ?? "dial-body-semi-text mb-1", E = _?.instructionsErrorClassName ?? "dial-small-text", D = n({
 		"--stcf-details-border": h?.detailsColumnBorder,
 		"--stcf-subtitle-text": h?.sectionSubtitleText,
 		"--stcf-error-text": h?.instructionsErrorText
 	}), O = f || !t.displayName.trim() || !t.modelId || !t.prompt.trim();
-	return /* @__PURE__ */ V(U, {
+	return /* @__PURE__ */ L(z, {
 		labels: {
 			title: e.pageTitle,
 			backButtonLabel: e.backButtonLabel,
@@ -392,26 +337,26 @@ var W = /* @__PURE__ */ function(e) {
 			colors: { background: h?.background },
 			header: {
 				colors: { borderColor: h?.headerBorder },
-				typography: { fontClassName: _ }
+				typography: { fontClassName: v }
 			},
-			cssVars: T
+			cssVars: D
 		},
-		left: /* @__PURE__ */ H("div", {
+		left: /* @__PURE__ */ R("div", {
 			role: "group",
 			"aria-label": e.detailsSectionTitle,
-			className: r("flex flex-1 flex-col gap-5 border-e px-8 py-6", Z.detailsColumn),
+			className: r("flex flex-1 flex-col gap-5 border-e px-8 py-6", Y.detailsColumn),
 			children: [
-				/* @__PURE__ */ H("div", {
+				/* @__PURE__ */ R("div", {
 					className: "flex flex-col gap-1",
-					children: [/* @__PURE__ */ V("h2", {
-						className: y,
+					children: [/* @__PURE__ */ L("h2", {
+						className: b,
 						children: e.detailsSectionTitle
-					}), /* @__PURE__ */ V("p", {
-						className: r(b, Z.sectionSubtitle),
+					}), /* @__PURE__ */ L("p", {
+						className: r(S, Y.sectionSubtitle),
 						children: e.detailsSectionSubtitle
 					})]
 				}),
-				/* @__PURE__ */ V(v, {
+				/* @__PURE__ */ L(g, {
 					id: "scheduled-task-display-name",
 					value: t.displayName,
 					onChange: (e) => o("displayName", e ?? ""),
@@ -422,7 +367,7 @@ var W = /* @__PURE__ */ function(e) {
 					invalid: !!i.displayName,
 					error: i.displayName
 				}),
-				/* @__PURE__ */ V(D, {
+				/* @__PURE__ */ L(T, {
 					id: "scheduled-task-description",
 					value: t.description ?? "",
 					onChange: (e) => o("description", e),
@@ -432,7 +377,7 @@ var W = /* @__PURE__ */ function(e) {
 					error: i.description,
 					caption: t.description ? `${t.description.length}/500` : void 0
 				}),
-				/* @__PURE__ */ V(C, {
+				/* @__PURE__ */ L(x, {
 					labelProps: {
 						label: e.modelOrAgentLabel,
 						required: !0
@@ -446,10 +391,10 @@ var W = /* @__PURE__ */ function(e) {
 						label: e.label
 					}))
 				}),
-				/* @__PURE__ */ H("div", {
+				/* @__PURE__ */ R("div", {
 					className: "flex flex-col gap-3",
 					children: [
-						/* @__PURE__ */ V(C, {
+						/* @__PURE__ */ L(x, {
 							labelProps: { label: e.repeatLabel },
 							value: t.repeat,
 							onChange: (e) => o("repeat", e),
@@ -458,50 +403,50 @@ var W = /* @__PURE__ */ function(e) {
 								label: e.label
 							}))
 						}),
-						t.repeat === Y.OneTime && /* @__PURE__ */ H("div", {
+						t.repeat === q.OneTime && /* @__PURE__ */ R("div", {
 							className: "flex flex-col gap-1",
-							children: [/* @__PURE__ */ V(c, {
+							children: [/* @__PURE__ */ L(c, {
 								id: "scheduled-task-run-at",
 								mode: l.DateTime,
-								value: ge(t.runAt),
-								onChange: (e) => o("runAt", _e(e)),
-								label: Se(e.runAtLabel),
+								value: fe(t.runAt),
+								onChange: (e) => o("runAt", pe(e)),
+								label: X(e.runAtLabel),
 								invalid: !!i.runAt
-							}), i.runAt && /* @__PURE__ */ V("p", {
-								className: r(w, Z.instructionsError),
+							}), i.runAt && /* @__PURE__ */ L("p", {
+								className: r(E, Y.instructionsError),
 								children: i.runAt
 							})]
 						}),
-						t.repeat !== Y.OneTime && /* @__PURE__ */ H(B, { children: [
-							t.repeat !== Y.Hourly && /* @__PURE__ */ H("div", {
+						t.repeat !== q.OneTime && /* @__PURE__ */ R(I, { children: [
+							t.repeat !== q.Hourly && /* @__PURE__ */ R("div", {
 								className: "flex flex-col gap-1",
-								children: [/* @__PURE__ */ V(c, {
+								children: [/* @__PURE__ */ L(c, {
 									id: "scheduled-task-time",
 									mode: l.Time,
 									value: t.time,
 									onChange: (e) => o("time", typeof e == "string" ? e : ""),
-									label: Se(e.timeLabel),
+									label: X(e.timeLabel),
 									invalid: !!i.time
-								}), i.time && /* @__PURE__ */ V("p", {
-									className: r(w, Z.instructionsError),
+								}), i.time && /* @__PURE__ */ L("p", {
+									className: r(E, Y.instructionsError),
 									children: i.time
 								})]
 							}),
-							t.repeat === Y.Weekly && /* @__PURE__ */ H("div", {
+							t.repeat === q.Weekly && /* @__PURE__ */ R("div", {
 								className: "flex flex-col gap-1",
-								children: [/* @__PURE__ */ V(c, {
+								children: [/* @__PURE__ */ L(c, {
 									id: "scheduled-task-day-of-week",
 									mode: l.Weekday,
-									value: be(t.dayOfWeek),
-									onChange: (e) => o("dayOfWeek", xe(e)),
-									label: Se(e.dayOfWeekLabel),
+									value: ge(t.dayOfWeek),
+									onChange: (e) => o("dayOfWeek", _e(e)),
+									label: X(e.dayOfWeekLabel),
 									invalid: !!i.dayOfWeek
-								}), i.dayOfWeek && /* @__PURE__ */ V("p", {
-									className: r(w, Z.instructionsError),
+								}), i.dayOfWeek && /* @__PURE__ */ L("p", {
+									className: r(E, Y.instructionsError),
 									children: i.dayOfWeek
 								})]
 							}),
-							t.repeat === Y.Monthly && /* @__PURE__ */ V(v, {
+							t.repeat === q.Monthly && /* @__PURE__ */ L(g, {
 								id: "scheduled-task-day-of-month",
 								value: t.dayOfMonth ?? "",
 								onChange: (e) => o("dayOfMonth", e ?? ""),
@@ -512,7 +457,7 @@ var W = /* @__PURE__ */ function(e) {
 								invalid: !!i.dayOfMonth,
 								error: i.dayOfMonth
 							}),
-							t.repeat === Y.Hourly && /* @__PURE__ */ V(x, {
+							t.repeat === q.Hourly && /* @__PURE__ */ L(y, {
 								id: "scheduled-task-minute",
 								integer: !0,
 								min: 0,
@@ -526,34 +471,34 @@ var W = /* @__PURE__ */ function(e) {
 								invalid: !!i.minute,
 								error: i.minute
 							}),
-							/* @__PURE__ */ H("div", {
+							/* @__PURE__ */ R("div", {
 								className: "flex flex-col gap-3 desktop:flex-row",
-								children: [/* @__PURE__ */ H("div", {
+								children: [/* @__PURE__ */ R("div", {
 									className: "flex flex-1 flex-col gap-1",
-									children: [/* @__PURE__ */ V(c, {
+									children: [/* @__PURE__ */ L(c, {
 										id: "scheduled-task-start-date",
 										mode: l.Date,
-										value: ve(t.startDate),
-										onChange: (e) => o("startDate", ye(e)),
+										value: me(t.startDate),
+										onChange: (e) => o("startDate", he(e)),
 										label: e.startDateLabel,
 										placeholder: e.startDatePlaceholder,
 										invalid: !!i.startDate
-									}), i.startDate && /* @__PURE__ */ V("p", {
-										className: r(w, Z.instructionsError),
+									}), i.startDate && /* @__PURE__ */ L("p", {
+										className: r(E, Y.instructionsError),
 										children: i.startDate
 									})]
-								}), /* @__PURE__ */ H("div", {
+								}), /* @__PURE__ */ R("div", {
 									className: "flex flex-1 flex-col gap-1",
-									children: [/* @__PURE__ */ V(c, {
+									children: [/* @__PURE__ */ L(c, {
 										id: "scheduled-task-end-date",
 										mode: l.Date,
-										value: ve(t.endDate),
-										onChange: (e) => o("endDate", ye(e)),
+										value: me(t.endDate),
+										onChange: (e) => o("endDate", he(e)),
 										label: e.endDateLabel,
 										placeholder: e.endDatePlaceholder,
 										invalid: !!i.endDate
-									}), i.endDate && /* @__PURE__ */ V("p", {
-										className: r(w, Z.instructionsError),
+									}), i.endDate && /* @__PURE__ */ L("p", {
+										className: r(E, Y.instructionsError),
 										children: i.endDate
 									})]
 								})]
@@ -563,169 +508,208 @@ var W = /* @__PURE__ */ function(e) {
 				})
 			]
 		}),
-		children: /* @__PURE__ */ H("div", {
+		children: /* @__PURE__ */ R("div", {
 			role: "group",
 			"aria-label": e.configurationSectionTitle,
 			className: "flex flex-1 flex-col gap-5 px-8 py-6",
-			children: [/* @__PURE__ */ H("div", {
+			children: [/* @__PURE__ */ R("div", {
 				className: "flex flex-col gap-1",
-				children: [/* @__PURE__ */ V("h2", {
-					className: y,
+				children: [/* @__PURE__ */ L("h2", {
+					className: b,
 					children: e.configurationSectionTitle
-				}), /* @__PURE__ */ V("p", {
-					className: r(b, Z.sectionSubtitle),
+				}), /* @__PURE__ */ L("p", {
+					className: r(S, Y.sectionSubtitle),
 					children: e.configurationSectionSubtitle
 				})]
-			}), /* @__PURE__ */ H("div", {
+			}), /* @__PURE__ */ R("div", {
 				role: "group",
 				"aria-label": e.instructionsLabel,
 				className: "flex flex-1 flex-col gap-1",
 				children: [
-					/* @__PURE__ */ V("span", {
-						className: S,
+					/* @__PURE__ */ L("span", {
+						className: C,
 						children: e.instructionsLabel
 					}),
-					/* @__PURE__ */ V(L, {
-						fallback: /* @__PURE__ */ V(E, {}),
-						children: /* @__PURE__ */ V(Ce, {
+					/* @__PURE__ */ L(M, {
+						fallback: /* @__PURE__ */ L(w, {}),
+						children: /* @__PURE__ */ L(ve, {
 							value: t.prompt,
 							onChange: (e) => o("prompt", e),
 							height: 480,
 							theme: p
 						})
 					}),
-					i.prompt && /* @__PURE__ */ V("p", {
-						className: r(w, Z.instructionsError),
+					i.prompt && /* @__PURE__ */ L("p", {
+						className: r(E, Y.instructionsError),
 						children: i.prompt
 					})
 				]
 			})]
 		})
 	});
-}, Q = /* @__PURE__ */ function(e) {
+}, Z = /* @__PURE__ */ function(e) {
 	return e.Success = "success", e.Error = "error", e.InProgress = "inProgress", e.Missed = "missed", e;
-}({}), $ = {
-	container: "_container_1ci42_1",
-	header: "_header_1ci42_5",
-	detailsColumn: "_detailsColumn_1ci42_9",
-	subtitleText: "_subtitleText_1ci42_13",
-	successIcon: "_successIcon_1ci42_17",
-	errorIcon: "_errorIcon_1ci42_21",
-	missedIcon: "_missedIcon_1ci42_25",
-	historyCard: "_historyCard_1ci42_29"
-}, Te = (e) => {
-	if (!e || e === document.body) return null;
-	let { overflow: t, overflowY: n } = getComputedStyle(e);
-	return t === "auto" || t === "scroll" || n === "auto" || n === "scroll" ? e : Te(e.parentElement);
-}, Ee = ({ status: e }) => {
+}({}), Q = {
+	subtitleText: "_subtitleText_8bk8k_1",
+	successIcon: "_successIcon_8bk8k_5",
+	errorIcon: "_errorIcon_8bk8k_9",
+	missedIcon: "_missedIcon_8bk8k_13",
+	currentRun: "_currentRun_8bk8k_17"
+}, be = ({ status: e }) => {
 	switch (e) {
-		case Q.Success: return /* @__PURE__ */ V(A, {
+		case Z.Success: return /* @__PURE__ */ L(k, {
 			size: d.SM,
-			className: $.successIcon,
+			className: Q.successIcon,
 			"aria-hidden": !0
 		});
-		case Q.Error: return /* @__PURE__ */ V(j, {
+		case Z.Error: return /* @__PURE__ */ L(A, {
 			size: d.SM,
-			className: $.errorIcon,
+			className: Q.errorIcon,
 			"aria-hidden": !0
 		});
-		case Q.InProgress: return /* @__PURE__ */ V("span", {
+		case Z.InProgress: return /* @__PURE__ */ L("span", {
 			"aria-hidden": !0,
-			children: /* @__PURE__ */ V(E, { size: d.SM })
+			children: /* @__PURE__ */ L(w, { size: d.SM })
 		});
-		case Q.Missed: return /* @__PURE__ */ V(O, {
+		case Z.Missed: return /* @__PURE__ */ L(E, {
 			size: d.SM,
-			className: $.missedIcon,
+			className: Q.missedIcon,
 			"aria-hidden": !0
 		});
 		default: return null;
 	}
-}, De = ({ labels: t, onBack: i, onEdit: a, displayName: o, isLoading: s = !1, error: c, onRetry: l, description: u, modelLabel: f, repeatsLabel: p, activeWindowLabel: g, nextRunLabel: _, instructionsMarkdown: v, renderInstructions: y, runs: x, runsIsLoading: S = !1, runsIsLoadingMore: C = !1, runsSkeletonCount: D = 6, runsError: O, onRunsRetry: k, runsHasMore: A = !1, onRunsLoadMore: j, onRunClick: M, styles: N }) => {
-	let { colors: F, typography: I } = N ?? {}, te = I?.titleClassName ?? "dial-h1-text", L = I?.sectionTitleClassName ?? "dial-body-semi-text", R = I?.fieldLabelClassName ?? "dial-tiny-text", z = I?.fieldValueClassName ?? "dial-body-text", B = I?.runTimestampClassName ?? "dial-small-text", U = n({
-		"--stdv-bg": F?.background,
-		"--stdv-header-border": F?.headerBorder,
-		"--stdv-details-border": F?.detailsColumnBorder,
-		"--stdv-subtitle-text": F?.subtitleText,
-		"--stdv-success-icon": F?.successIconColor,
-		"--stdv-error-icon": F?.errorIconColor,
-		"--stdv-missed-icon": F?.missedIconColor,
-		"--stdv-history-bg": F?.historyCardBackground
-	}), W = re(null);
-	ne(() => {
-		let e = W.current;
-		if (!e || !j) return;
-		let t = Te(e.parentElement);
-		if (!t) return;
-		let n = () => {
-			if (C || S || !A) return;
-			let n = t.getBoundingClientRect(), r = e.getBoundingClientRect();
-			r.top < n.bottom && r.bottom > n.top && j();
-		};
-		return t.addEventListener("scroll", n, { passive: !0 }), n(), () => t.removeEventListener("scroll", n);
-	}, [
-		A,
-		C,
-		S,
-		j
-	]);
-	let G = (t) => y ? y(t) : /* @__PURE__ */ V(e, { content: t }), K = (e) => {
-		let n = `${t.runStatusLabels[e.status]} ${e.timestampLabel}`, i = !!M;
-		return /* @__PURE__ */ H("li", {
-			...i ? {
+}, xe = ({ items: e, isLoading: t = !1, isLoadingMore: i = !1, skeletonCount: a = 6, error: o, onRetry: s, currentRunId: c, onRunClick: l, labels: u, footer: d, styles: f }) => {
+	let { colors: m, typography: h } = f ?? {}, g = h?.runTimestampClassName ?? "dial-small-text", _ = h?.subtitleClassName ?? "dial-body-text", v = n({
+		"--strhl-success-icon": m?.successIconColor,
+		"--strhl-error-icon": m?.errorIconColor,
+		"--strhl-missed-icon": m?.missedIconColor,
+		"--strhl-subtitle-text": m?.subtitleTextColor,
+		"--strhl-current-run-bg": m?.currentRunBackground
+	}), y = (e) => {
+		let t = u.runStatusLabels[e.status], n = e.id === c, i = n && u.currentRunLabel ? `${t} ${e.timestampLabel} — ${u.currentRunLabel}` : `${t} ${e.timestampLabel}`, a = !!l;
+		return /* @__PURE__ */ R("li", {
+			...a ? {
 				role: "button",
 				tabIndex: 0,
-				onClick: () => M?.(e.id),
+				onClick: () => l?.(e.id),
 				onKeyDown: (t) => {
-					(t.key === "Enter" || t.key === " ") && (t.preventDefault(), M?.(e.id));
+					(t.key === "Enter" || t.key === " ") && (t.preventDefault(), l?.(e.id));
 				}
 			} : {},
-			"aria-label": n,
-			className: r("flex h-8 items-center justify-between gap-2 rounded-full pe-2 ps-5", i && "cursor-pointer"),
-			children: [/* @__PURE__ */ V("span", {
-				className: r(B, "truncate"),
+			"aria-label": i,
+			"aria-current": n ? "true" : void 0,
+			className: r("flex h-8 items-center justify-between gap-2 rounded-full pe-2 ps-5", n && Q.currentRun, a && "cursor-pointer"),
+			children: [/* @__PURE__ */ L("span", {
+				className: r(g, "truncate"),
 				children: e.timestampLabel
-			}), /* @__PURE__ */ V("span", {
+			}), /* @__PURE__ */ L("span", {
 				className: "flex h-8 w-14 shrink-0 items-center justify-end",
-				children: /* @__PURE__ */ V(Ee, { status: e.status })
+				children: /* @__PURE__ */ L(be, { status: e.status })
 			})]
 		}, e.id);
-	}, q = (e) => Array.from({ length: e }, (e, t) => /* @__PURE__ */ H("li", {
+	}, b = (e) => Array.from({ length: e }, (e, t) => /* @__PURE__ */ R("li", {
 		"aria-hidden": "true",
 		className: "flex h-8 items-center justify-between gap-2 pe-2 ps-5",
-		children: [/* @__PURE__ */ V(w, {
-			variant: T.Rectangular,
+		children: [/* @__PURE__ */ L(S, {
+			variant: C.Rectangular,
 			width: "160px",
 			height: "16px"
-		}), /* @__PURE__ */ V(w, {
-			variant: T.Rectangular,
+		}), /* @__PURE__ */ L(S, {
+			variant: C.Rectangular,
 			width: "16px",
 			height: "16px",
 			className: "shrink-0 rounded-full"
 		})]
 	}, `history-skeleton-${t}`));
-	return /* @__PURE__ */ H("div", {
-		style: U,
+	return t && e.length === 0 ? /* @__PURE__ */ L("ul", {
+		style: v,
+		"aria-label": u.historyTitle,
+		children: b(a)
+	}) : o && e.length === 0 ? /* @__PURE__ */ R("div", {
+		style: v,
+		className: "flex flex-col items-start gap-3",
+		children: [/* @__PURE__ */ L("p", {
+			role: "alert",
+			className: r(_, Q.subtitleText),
+			children: u.errorLabel
+		}), /* @__PURE__ */ L(p, {
+			label: u.retryLabel,
+			onClick: s
+		})]
+	}) : e.length === 0 ? /* @__PURE__ */ L("p", {
+		role: "status",
+		style: v,
+		className: r(_, Q.subtitleText),
+		children: u.emptyLabel
+	}) : /* @__PURE__ */ R("ul", {
+		style: v,
+		"aria-label": u.historyTitle,
+		children: [
+			e.map(y),
+			i && b(a),
+			o ? /* @__PURE__ */ R("li", {
+				className: "flex flex-col items-start gap-3 px-5 py-2",
+				children: [/* @__PURE__ */ L("p", {
+					role: "alert",
+					className: r(_, Q.subtitleText),
+					children: u.errorLabel
+				}), /* @__PURE__ */ L(p, {
+					label: u.retryLabel,
+					onClick: s
+				})]
+			}) : d
+		]
+	});
+}, $ = {
+	container: "_container_1ci42_1",
+	header: "_header_1ci42_5",
+	detailsColumn: "_detailsColumn_1ci42_9",
+	subtitleText: "_subtitleText_1ci42_13",
+	successIcon: "_successIcon_1ci42_17",
+	errorIcon: "_errorIcon_1ci42_21",
+	missedIcon: "_missedIcon_1ci42_25",
+	historyCard: "_historyCard_1ci42_29"
+}, Se = ({ labels: t, onBack: i, onEdit: a, displayName: o, isLoading: s = !1, error: c, onRetry: l, description: u, modelLabel: f, repeatsLabel: h, activeWindowLabel: g, nextRunLabel: _, instructionsMarkdown: y, renderInstructions: b, runs: x, runsIsLoading: S = !1, runsIsLoadingMore: C = !1, runsSkeletonCount: T = 6, runsError: E, onRunsRetry: O, runsHasMore: k = !1, onRunsLoadMore: A, onRunClick: ee, styles: M }) => {
+	let { colors: N, typography: P } = M ?? {}, te = P?.titleClassName ?? "dial-h1-text", F = P?.sectionTitleClassName ?? "dial-body-semi-text", I = P?.fieldLabelClassName ?? "dial-tiny-text", z = P?.fieldValueClassName ?? "dial-body-text", B = P?.runTimestampClassName ?? "dial-small-text", V = n({
+		"--stdv-bg": N?.background,
+		"--stdv-header-border": N?.headerBorder,
+		"--stdv-details-border": N?.detailsColumnBorder,
+		"--stdv-subtitle-text": N?.subtitleText,
+		"--stdv-success-icon": N?.successIconColor,
+		"--stdv-error-icon": N?.errorIconColor,
+		"--stdv-missed-icon": N?.missedIconColor,
+		"--stdv-history-bg": N?.historyCardBackground
+	}), H = A && k && t.historyShowMoreLabel ? /* @__PURE__ */ L("li", {
+		className: r("sticky bottom-0 z-10 rounded-b-xl px-6 pb-5 pt-2", $.historyCard),
+		children: /* @__PURE__ */ L(p, {
+			label: t.historyShowMoreLabel,
+			onClick: A,
+			disabled: C
+		})
+	}) : void 0;
+	return /* @__PURE__ */ R("div", {
+		style: V,
 		className: r("flex h-full w-full flex-col overflow-y-auto", $.container),
 		children: [
-			/* @__PURE__ */ H("div", {
+			/* @__PURE__ */ R("div", {
 				className: r("flex h-16 shrink-0 items-center justify-between gap-2 border-b px-8", $.header),
-				children: [/* @__PURE__ */ H("div", {
+				children: [/* @__PURE__ */ R("div", {
 					className: "flex min-w-0 items-center gap-2",
-					children: [/* @__PURE__ */ V(h, {
-						icon: /* @__PURE__ */ V(ee, {
+					children: [/* @__PURE__ */ L(m, {
+						icon: /* @__PURE__ */ L(D, {
 							size: d.LG,
 							className: "rtl:scale-x-[-1]",
 							"aria-hidden": !0
 						}),
 						"aria-label": t.backAriaLabel,
 						onClick: i
-					}), /* @__PURE__ */ V("h1", {
+					}), /* @__PURE__ */ L("h1", {
 						className: r("truncate", te),
 						children: o
 					})]
-				}), a && /* @__PURE__ */ V(b, {
+				}), a && /* @__PURE__ */ L(v, {
 					label: t.editButtonLabel,
-					iconBefore: /* @__PURE__ */ V(P, {
+					iconBefore: /* @__PURE__ */ L(j, {
 						size: d.SM,
 						"aria-hidden": !0
 					}),
@@ -733,142 +717,166 @@ var W = /* @__PURE__ */ function(e) {
 					className: "shrink-0"
 				})]
 			}),
-			s && /* @__PURE__ */ V("div", {
+			s && /* @__PURE__ */ L("div", {
 				className: "flex flex-1 items-center justify-center",
-				children: /* @__PURE__ */ V(E, {})
+				children: /* @__PURE__ */ L(w, {})
 			}),
-			!s && c && /* @__PURE__ */ H("div", {
+			!s && c && /* @__PURE__ */ R("div", {
 				className: "flex flex-1 flex-col items-center justify-center gap-3",
-				children: [/* @__PURE__ */ V("p", {
+				children: [/* @__PURE__ */ L("p", {
 					className: r(z, $.subtitleText),
 					children: t.errorLabel
-				}), /* @__PURE__ */ V(m, {
+				}), /* @__PURE__ */ L(p, {
 					label: t.retryLabel,
 					onClick: l
 				})]
 			}),
-			!s && !c && /* @__PURE__ */ H("div", {
+			!s && !c && /* @__PURE__ */ R("div", {
 				className: "flex flex-1 flex-col desktop:flex-row",
 				children: [
-					/* @__PURE__ */ H("div", {
+					/* @__PURE__ */ R("div", {
 						role: "group",
 						"aria-label": t.detailsTitle,
 						className: r("flex w-full flex-col gap-5 border-e px-8 py-6 desktop:w-[360px] desktop:shrink-0", $.detailsColumn),
 						children: [
-							/* @__PURE__ */ V("h2", {
-								className: L,
+							/* @__PURE__ */ L("h2", {
+								className: F,
 								children: t.detailsTitle
 							}),
-							u && /* @__PURE__ */ H("div", {
+							u && /* @__PURE__ */ R("div", {
 								className: "flex flex-col gap-1",
-								children: [/* @__PURE__ */ V("span", {
-									className: R,
+								children: [/* @__PURE__ */ L("span", {
+									className: I,
 									children: t.descriptionLabel
-								}), /* @__PURE__ */ V("p", {
+								}), /* @__PURE__ */ L("p", {
 									className: z,
 									children: u
 								})]
 							}),
-							f && /* @__PURE__ */ H("div", {
+							f && /* @__PURE__ */ R("div", {
 								className: "flex flex-col gap-1",
-								children: [/* @__PURE__ */ V("span", {
-									className: R,
+								children: [/* @__PURE__ */ L("span", {
+									className: I,
 									children: t.modelLabel
-								}), /* @__PURE__ */ V("p", {
+								}), /* @__PURE__ */ L("p", {
 									className: z,
 									children: f
 								})]
 							}),
-							p && /* @__PURE__ */ H("div", {
+							h && /* @__PURE__ */ R("div", {
 								className: "flex flex-col gap-1",
-								children: [/* @__PURE__ */ V("span", {
-									className: R,
+								children: [/* @__PURE__ */ L("span", {
+									className: I,
 									children: t.repeatsLabel
-								}), /* @__PURE__ */ V("p", {
+								}), /* @__PURE__ */ L("p", {
 									className: z,
-									children: p
+									children: h
 								})]
 							}),
-							g && /* @__PURE__ */ H("div", {
+							g && /* @__PURE__ */ R("div", {
 								className: "flex flex-col gap-1",
-								children: [/* @__PURE__ */ V("span", {
-									className: R,
+								children: [/* @__PURE__ */ L("span", {
+									className: I,
 									children: t.activeWindowLabel
-								}), /* @__PURE__ */ V("p", {
+								}), /* @__PURE__ */ L("p", {
 									className: z,
 									children: g
 								})]
 							})
 						]
 					}),
-					/* @__PURE__ */ H("div", {
+					/* @__PURE__ */ R("div", {
 						className: "flex w-full min-w-0 flex-1 flex-col gap-5 px-8 py-6",
-						children: [/* @__PURE__ */ V("h2", {
-							className: L,
+						children: [/* @__PURE__ */ L("h2", {
+							className: F,
 							children: t.configurationTitle
-						}), /* @__PURE__ */ H("div", {
+						}), /* @__PURE__ */ R("div", {
 							role: "group",
 							"aria-label": t.instructionsLabel,
 							className: "flex flex-col gap-1",
-							children: [/* @__PURE__ */ V("span", {
-								className: R,
+							children: [/* @__PURE__ */ L("span", {
+								className: I,
 								children: t.instructionsLabel
-							}), v && G(v)]
+							}), y && ((t) => b ? b(t) : /* @__PURE__ */ L(e, { content: t }))(y)]
 						})]
 					}),
-					/* @__PURE__ */ V("div", {
+					/* @__PURE__ */ L("div", {
 						className: "flex w-full justify-center p-6 desktop:w-auto desktop:items-start",
-						children: /* @__PURE__ */ H("div", {
-							className: r("flex w-full flex-col gap-4 overflow-y-auto rounded-xl px-6 py-5 shadow-md desktop:max-h-[70vh] desktop:w-[360px]", $.historyCard),
-							children: [
-								/* @__PURE__ */ V("h2", {
-									className: L,
-									children: t.historyTitle
-								}),
-								_ && /* @__PURE__ */ V("p", {
-									className: r(B, $.subtitleText),
-									children: _
-								}),
-								t.historyLoadingMoreLabel && /* @__PURE__ */ V("span", {
-									role: "status",
-									"aria-live": "polite",
-									className: "sr-only",
-									children: C ? t.historyLoadingMoreLabel : ""
-								}),
-								S && x.length === 0 ? /* @__PURE__ */ V("ul", {
-									"aria-label": t.historyTitle,
-									children: q(D)
-								}) : O ? /* @__PURE__ */ H("div", {
-									className: "flex flex-col items-start gap-3",
-									children: [/* @__PURE__ */ V("p", {
-										className: r(z, $.subtitleText),
-										children: t.historyErrorLabel
-									}), /* @__PURE__ */ V(m, {
-										label: t.historyRetryLabel,
-										onClick: k
-									})]
-								}) : x.length === 0 ? /* @__PURE__ */ V("p", {
-									className: r(z, $.subtitleText),
-									children: t.historyEmptyLabel
-								}) : /* @__PURE__ */ H("ul", {
-									"aria-label": t.historyTitle,
-									children: [
-										x.map(K),
-										C && q(D),
-										/* @__PURE__ */ V("li", {
-											ref: W,
-											"aria-hidden": !0,
-											className: "h-px w-full"
-										})
-									]
+						children: /* @__PURE__ */ R("div", {
+							className: r("flex max-h-[70vh] w-full flex-col overflow-y-auto rounded-xl shadow-md desktop:w-[360px]", $.historyCard),
+							children: [/* @__PURE__ */ R("div", {
+								className: r("sticky top-0 z-10 flex flex-col gap-1 rounded-t-xl px-6 pb-2 pt-5", $.historyCard),
+								children: [
+									/* @__PURE__ */ L("h2", {
+										className: F,
+										children: t.historyTitle
+									}),
+									_ && /* @__PURE__ */ L("p", {
+										className: r(B, $.subtitleText),
+										children: _
+									}),
+									t.historyLoadingMoreLabel && /* @__PURE__ */ L("span", {
+										role: "status",
+										"aria-live": "polite",
+										className: "sr-only",
+										children: C ? t.historyLoadingMoreLabel : ""
+									})
+								]
+							}), /* @__PURE__ */ L("div", {
+								className: "flex flex-1 flex-col gap-4 px-6 pb-2",
+								children: /* @__PURE__ */ L(xe, {
+									items: x,
+									isLoading: S,
+									isLoadingMore: C,
+									skeletonCount: T,
+									error: E,
+									onRetry: O,
+									onRunClick: ee,
+									labels: {
+										historyTitle: t.historyTitle,
+										emptyLabel: t.historyEmptyLabel,
+										errorLabel: t.historyErrorLabel,
+										retryLabel: t.historyRetryLabel,
+										runStatusLabels: t.runStatusLabels
+									},
+									footer: H,
+									styles: {
+										typography: { runTimestampClassName: B },
+										colors: {
+											successIconColor: N?.successIconColor,
+											errorIconColor: N?.errorIconColor,
+											missedIconColor: N?.missedIconColor
+										}
+									}
 								})
-							]
+							})]
 						})
 					})
 				]
 			})
 		]
 	});
+}, Ce = ({ modelLabel: t, instructionsLabel: n, modelDisplayName: r, instructionsMarkdown: i, renderInstructions: a, styles: o }) => {
+	let s = o?.typography?.fieldLabelClassName ?? "dial-tiny-text", c = o?.typography?.fieldValueClassName ?? "dial-body-text";
+	return /* @__PURE__ */ R("div", {
+		className: "flex flex-col gap-3",
+		children: [r && /* @__PURE__ */ R("div", {
+			className: "flex flex-col gap-2",
+			children: [/* @__PURE__ */ L("span", {
+				className: s,
+				children: t
+			}), /* @__PURE__ */ L("p", {
+				className: c,
+				children: r
+			})]
+		}), i && /* @__PURE__ */ R("div", {
+			className: "flex flex-col gap-2",
+			children: [/* @__PURE__ */ L("span", {
+				className: s,
+				children: n
+			}), ((t) => a ? a(t) : /* @__PURE__ */ L(e, { content: t }))(i)]
+		})]
+	});
 };
 //#endregion
-export { he as DESCRIPTION_MAX_LENGTH, K as ScheduledTaskCard, se as ScheduledTaskCardGrid, oe as ScheduledTaskCardSkeleton, we as ScheduledTaskCreateForm, De as ScheduledTaskDetailView, Y as ScheduledTaskRepeat, Q as ScheduledTaskRunStatus, le as ScheduledTaskSection, W as ScheduledTaskSectionKey, pe as ScheduledTasks, me as ScheduledTasksSortKey };
+export { de as DESCRIPTION_MAX_LENGTH, H as ScheduledTaskCard, ie as ScheduledTaskCardGrid, W as ScheduledTaskCardSkeleton, ye as ScheduledTaskCreateForm, Se as ScheduledTaskDetailView, Ce as ScheduledTaskDetailsSummary, q as ScheduledTaskRepeat, xe as ScheduledTaskRunHistoryList, Z as ScheduledTaskRunStatus, oe as ScheduledTaskSection, B as ScheduledTaskSectionKey, le as ScheduledTasks, ue as ScheduledTasksSortKey };