@parallelworks/ui 0.18.0 → 0.19.1

package/dist/index.js

@@ -1,600 +1,48 @@
+import { UIProvider, useNavigation, useNotify, useOptionalWorkflowEngine, usePersistedState, useProvisionCorsRules, useRunFile, useSlots, useStrings, useWorkflowEngine, useWorkflowEngineLoader } from "./components/Provider.js";
+import { GlobalTooltip, TOOLTIP_ID, TooltipInfo, formatTooltipContent, truncationTooltipProps } from "./components/Tooltip.js";
+import { AddMenu } from "./components/AddMenu.js";
+import { Avatar, avatarInitials } from "./components/Avatar.js";
+import { BareModal, modalPanelClasses } from "./components/BareModal.js";
+import { BreadcrumbProvider, useBreadcrumb, useClearBreadcrumbs, useHideBreadcrumbs, useSetBreadcrumbs, useSetDefaultBreadcrumbs } from "./components/Breadcrumbs.js";
+import { Button, MethodButton } from "./components/Button.js";
+import Callout from "./components/Callout.js";
+import { Card, CardHeader } from "./components/Card.js";
+import { ControlledCollapsiblePanel, MaybeCollapsible, UncontrolledCollapsiblePanel } from "./components/CollapsiblePanel.js";
+import { dangerButtonClasses, ghostButtonClasses, primaryButtonClasses } from "./components/ghostButton.js";
+import { ConfirmModal } from "./components/ConfirmModal.js";
+import CopyToClipboard, { CopyCodeBlock } from "./components/CopyToClipboard.js";
+import { DropdownCaret, filterOption, flattenOptions, isCategory, isOption, toggleSetMember } from "./components/dropdownUtils.js";
+import { CREATE_MODAL_SELECT_FILTER_THRESHOLD, CreateModal, CreateModalAutocompleteField, CreateModalField, CreateModalSelect, CreateModalSwitch, CreateModalTextarea } from "./components/CreateModal.js";
+import DescriptionList, { DescriptionListItem } from "./components/DescriptionList.js";
+import Dropdown from "./components/Dropdown.js";
+import EmptyState from "./components/EmptyState.js";
+import Filter from "./components/Filter.js";
+import { FilterPill } from "./components/FilterPill.js";
+import { IconButton } from "./components/IconButton.js";
+import { Indicator } from "./components/Indicator.js";
+import { RequiredMark } from "./components/RequiredMark.js";
+import { Input, Textarea } from "./components/Input.js";
+import { inputClasses } from "./components/inputClasses.js";
+import { LetterBadge } from "./components/LetterBadge.js";
+import CustomListbox from "./components/Listbox.js";
+import Loader from "./components/Loader.js";
+import Markdown from "./components/Markdown.js";
+import MultiSelectDropdown from "./components/MultiSelect.js";
+import { Overview } from "./components/Overview.js";
+import { BreadcrumbsActionButton, BreadcrumbsRightAction, BreadcrumbsTitleAction, HeaderActionMenu, HeaderAddButton, HeaderEditButton, HeaderRowMenu, PageHeader, headerActionButtonClasses } from "./components/PageHeader.js";
+import { Pagination } from "./components/Pagination.js";
+import { useRelativeTime } from "./components/relativeTime.js";
+import SectionHeader from "./components/SectionHeader.js";
+import { SettingModeOption } from "./components/SettingModeOption.js";
+import { SettingRow, SettingSection } from "./components/SettingRow.js";
+import SettingsCard from "./components/SettingsCard.js";
+import SettingsGroup from "./components/SettingsGroup.js";
+import Sort from "./components/Sort.js";
+import { StatusBadge, StatusDot, statusTextClass } from "./components/StatusBadge.js";
+import SwitchToggle from "./components/SwitchToggle.js";
+import SwitchToggleSmall from "./components/SwitchToggleSmall.js";
+import { CompactTable, Table } from "./components/Table.js";
+import { Toggle } from "./components/Toggle.js";
+import { useCssIsDark } from "./components/useCssIsDark.js";
 import { DEFAULT_PRESET, THEME_PRESETS, THEME_TOKENS, applyTheme, contrastRatio, deriveTheme, isDarkColor } from "./theme/index.js";
-import { a as usePersistedState, c as useRunFile, d as useWorkflowJsonResolver, i as useNotify, l as useSlots, n as useLink, o as useProvisionCorsRules, r as useNavigation, s as useRepoSuggestions, t as UIProvider, u as useStrings } from "./chunks/Provider-Ghua9PkN.js";
-import { C as useSetDefaultBreadcrumbs, E as avatarInitials, S as useSetBreadcrumbs, T as Avatar, a as HeaderAddButton, b as useClearBreadcrumbs, c as PageHeader, i as HeaderActionMenu, l as headerActionButtonClasses, n as BreadcrumbsRightAction, o as HeaderEditButton, r as BreadcrumbsTitleAction, s as HeaderRowMenu, t as BreadcrumbsActionButton, v as BreadcrumbProvider, w as AddMenu, x as useHideBreadcrumbs, y as useBreadcrumb } from "./chunks/PageHeader-l49p1nM9.js";
-import { AlertIcon, AngleRightIcon, EyeIcon, EyeOffIcon, FilterIcon, LoaderIcon, SortDownIcon, SortUnsortedIcon, SortUpIcon } from "./icons.js";
-import { a as CreateModalSelect, c as ConfirmModal, d as primaryButtonClasses, f as Markdown, h as Callout, i as CreateModalField, l as dangerButtonClasses, m as CopyToClipboard, n as CreateModal, o as CreateModalSwitch, p as CopyCodeBlock, r as CreateModalAutocompleteField, s as CreateModalTextarea, t as CREATE_MODAL_SELECT_FILTER_THRESHOLD, u as ghostButtonClasses } from "./chunks/CreateModal-BY6DLmur.js";
-import { a as truncationTooltipProps, i as formatTooltipContent, n as TOOLTIP_ID, r as TooltipInfo, t as GlobalTooltip } from "./chunks/Tooltip-Crxo_eU_.js";
-import { a as filterOption, c as isCategory, i as DropdownCaret, l as isOption, n as StatusDot, r as statusTextClass, s as flattenOptions, t as StatusBadge, u as toggleSetMember } from "./chunks/StatusBadge-C1Blx_cW.js";
-import { a as UncontrolledCollapsiblePanel, c as Dropdown, i as MaybeCollapsible, n as SectionHeader, o as MultiSelectDropdown, r as ControlledCollapsiblePanel, s as CustomListbox, t as SwitchToggle } from "./chunks/SwitchToggle-CHPP8uZQ.js";
-import { t as Loader } from "./chunks/Loader-BXoXTZGc.js";
-import { n as modalPanelClasses, t as BareModal } from "./chunks/BareModal-BtRiQezg.js";
-import { t as useCssIsDark } from "./chunks/useCssIsDark-DHr05dG2.js";
-import { t as Indicator } from "./chunks/Indicator-hBSIxOPK.js";
-import { t as SwitchToggleSmall } from "./chunks/SwitchToggleSmall-FcsaYSTs.js";
-import { n as Table, t as CompactTable } from "./chunks/Table-4OHjdKdO.js";
-import { t as RequiredMark } from "./chunks/RequiredMark-DfLdYbYZ.js";
-import cx from "classnames";
-import React, { forwardRef, useEffect, useId, useState } from "react";
-import { Fragment as Fragment$1, jsx, jsxs } from "react/jsx-runtime";
-import Skeleton from "react-loading-skeleton";
-import { DateTime } from "luxon";
-//#region src/components/DescriptionList.tsx
-function DescriptionListItem({ label, children, tooltip, className, ...props }) {
-	return /* @__PURE__ */ jsxs(Fragment$1, { children: [/* @__PURE__ */ jsxs("dt", {
-		className: cx("text-[13px] leading-6 col-span-1 font-normal flex gap-1", className),
-		children: [/* @__PURE__ */ jsx("span", {
-			className: "min-w-0 truncate",
-			children: label
-		}), tooltip && /* @__PURE__ */ jsx(TooltipInfo, {
-			className: "pr-2",
-			text: tooltip
-		})]
-	}), /* @__PURE__ */ jsx("dd", {
-		...props,
-		className: "flex text-[13px] leading-6 col-span-4 font-light items-center overflow-auto",
-		children
-	})] });
-}
-function DescriptionList({ children, title, separators = true, subtitle, className, wrapperClassName, vertical = false }) {
-	return /* @__PURE__ */ jsxs("div", {
-		className: cx("w-full", wrapperClassName),
-		children: [
-			title && /* @__PURE__ */ jsx("h2", {
-				className: "text-sm font-semibold w-full mb-1",
-				children: title
-			}),
-			subtitle && /* @__PURE__ */ jsx("div", {
-				className: "max-w-2xl text-sm/6 w-full",
-				children: subtitle
-			}),
-			/* @__PURE__ */ jsx("dl", {
-				className: cx("grid", separators && "*:not-last-of-type:border-b-1", vertical ? "grid-cols-1" : "grid-cols-5 gap-x-4 gap-y-0.5 *:pb-0.5", className),
-				children: Array.isArray(children) ? children.map((child, index) => /* @__PURE__ */ jsx(React.Fragment, { children: child }, index)) : children
-			})
-		]
-	});
-}
-//#endregion
-//#region src/components/EmptyState.tsx
-function EmptyState({ title, description, action, icon: Icon }) {
-	return /* @__PURE__ */ jsxs("div", {
-		className: "border-solid rounded-2xl border border-(--theme-border) theme-panel flex flex-col items-center justify-center py-12 px-6",
-		children: [
-			Icon && /* @__PURE__ */ jsx("div", {
-				className: "w-10 h-10 rounded-full bg-(--theme-muted-panel-bg) flex items-center justify-center mb-3",
-				children: /* @__PURE__ */ jsx(Icon, { className: "w-5 h-5 theme-muted-text" })
-			}),
-			/* @__PURE__ */ jsx("p", {
-				className: "text-sm font-medium mb-1",
-				children: title
-			}),
-			description && /* @__PURE__ */ jsx("p", {
-				className: "text-xs theme-muted-text text-center max-w-xs",
-				children: description
-			}),
-			action && /* @__PURE__ */ jsx("div", {
-				className: "mt-4",
-				children: action
-			})
-		]
-	});
-}
-//#endregion
-//#region src/components/Overview.tsx
-function Overview({ Icon, name, type, children, right, className, loading, iconSize = 75 }) {
-	return /* @__PURE__ */ jsxs("div", {
-		className: cx("flex items-center w-full", className),
-		children: [
-			loading ? /* @__PURE__ */ jsx(Skeleton, {
-				width: iconSize,
-				height: iconSize,
-				circle: true
-			}) : Icon,
-			/* @__PURE__ */ jsx("div", {
-				className: "flex flex-col min-w-0 flex-1",
-				children: loading ? /* @__PURE__ */ jsx(Skeleton, {
-					count: 2,
-					height: 12
-				}) : /* @__PURE__ */ jsxs(Fragment$1, { children: [
-					/* @__PURE__ */ jsx("div", {
-						className: "font-semibold text-xl tracking-tight",
-						children: name
-					}),
-					type && /* @__PURE__ */ jsx("p", { children: type }),
-					/* @__PURE__ */ jsx("div", {
-						className: "flex flex-row gap-x-2",
-						children
-					})
-				] })
-			}),
-			right && /* @__PURE__ */ jsx("div", {
-				className: "shrink-0 self-center",
-				children: right
-			})
-		]
-	});
-}
-//#endregion
-//#region src/components/relativeTime.ts
-var TICK_MS = 3e4;
-function compactRelativeMinutes(minutes, t) {
-	if (!Number.isFinite(minutes) || minutes < 1) return t.now;
-	if (minutes < 60) return t.minutes(minutes);
-	const hours = Math.floor(minutes / 60);
-	if (hours < 24) return t.hours(hours);
-	const days = Math.floor(hours / 24);
-	if (days < 365) return t.days(days);
-	return t.years(Math.floor(days / 365));
-}
-/** A clock that re-reads itself, so "5m" ages while the page sits open, with
-*  the abbreviated form a row has room for. */
-function useRelativeTime() {
-	const t = useStrings().time;
-	const [now, setNow] = useState(() => DateTime.now());
-	useEffect(() => {
-		const id = setInterval(() => setNow(DateTime.now()), TICK_MS);
-		return () => clearInterval(id);
-	}, []);
-	const compactMinutes = (minutes) => compactRelativeMinutes(minutes, t);
-	return {
-		now,
-		compactMinutes,
-		compact: (iso) => iso ? compactMinutes(Math.floor(now.diff(DateTime.fromISO(iso)).as("minutes"))) : ""
-	};
-}
-//#endregion
-//#region src/components/Button.tsx
-var Button = forwardRef(({ children, variant = "primary", size = "default", loading, icon, iconPosition = "right", fullWidth = true, className = "", disabled, ...props }, ref) => {
-	const baseClasses = "inline-flex items-center justify-center gap-2 font-semibold rounded-lg transition-all duration-200 cursor-pointer border-none mt-2 disabled:opacity-50 disabled:cursor-not-allowed";
-	const variantClasses = {
-		primary: "bg-gradient-to-br from-[var(--gradient-start,var(--theme-element))] to-[var(--gradient-mid,var(--theme-link))] text-white shadow-[0_4px_14px_0_rgba(59,130,246,0.3)] hover:enabled:-translate-y-0.5 hover:enabled:shadow-[0_6px_20px_0_rgba(59,130,246,0.4)] active:enabled:translate-y-0",
-		secondary: "bg-[var(--theme-muted-panel-bg)] text-[var(--theme-app)] border border-[var(--theme-border)] hover:enabled:bg-[var(--theme-border)]",
-		outline: "bg-transparent text-[var(--theme-app)] border border-[var(--theme-border)] hover:enabled:bg-[var(--theme-muted-panel-bg)] hover:enabled:border-[var(--theme-muted-text-color)]",
-		ghost: "bg-transparent text-[var(--theme-muted-text-color)] hover:enabled:text-[var(--theme-app)] hover:enabled:bg-[var(--theme-muted-panel-bg)]"
-	};
-	const sizeClasses = {
-		sm: "py-2 px-4 text-[0.8125rem]",
-		default: "py-3 px-5 text-sm",
-		lg: "py-4 px-6 text-base"
-	};
-	const widthClass = fullWidth ? "w-full" : "w-auto";
-	return /* @__PURE__ */ jsx("button", {
-		ref,
-		type: "button",
-		disabled: disabled || loading,
-		className: cx(baseClasses, variantClasses[variant], sizeClasses[size], widthClass, className),
-		...props,
-		children: loading ? /* @__PURE__ */ jsxs(Fragment$1, { children: [/* @__PURE__ */ jsx(LoaderIcon, { className: "size-[18px]" }), children] }) : /* @__PURE__ */ jsxs(Fragment$1, { children: [
-			icon && iconPosition === "left" && /* @__PURE__ */ jsx("span", {
-				className: "flex items-center",
-				children: icon
-			}),
-			children,
-			icon && iconPosition === "right" && /* @__PURE__ */ jsx("span", {
-				className: "flex items-center",
-				children: icon
-			})
-		] })
-	});
-});
-Button.displayName = "Button";
-function MethodButton({ icon, label, description, href, loading, disabled, className = "", ...props }) {
-	const Link = useLink();
-	const baseClasses = "flex items-center w-full p-4 bg-[var(--theme-muted-panel-bg)] border border-[var(--theme-border)] rounded-xl text-[var(--theme-app)] text-[0.9375rem] font-medium cursor-pointer transition-all duration-200 no-underline mb-3 last:mb-0 hover:bg-[var(--theme-border)] hover:border-[var(--theme-muted-text-color)] hover:-translate-y-0.5 active:translate-y-0";
-	const disabledClasses = "disabled:opacity-60 disabled:cursor-not-allowed disabled:hover:bg-[var(--ds-muted)] disabled:hover:border-[var(--ds-border)] disabled:hover:translate-y-0";
-	const content = /* @__PURE__ */ jsxs(Fragment$1, { children: [
-		icon && /* @__PURE__ */ jsx("span", {
-			className: "size-10 rounded-lg bg-gradient-to-br from-[var(--gradient-start,var(--theme-element))] to-[var(--gradient-mid,var(--theme-link))] flex items-center justify-center shrink-0 mr-4 [&_svg]:size-5 [&_svg]:text-white",
-			children: icon
-		}),
-		/* @__PURE__ */ jsxs("span", {
-			className: "flex-1 text-left",
-			children: [/* @__PURE__ */ jsx("span", {
-				className: "block font-semibold text-[var(--theme-app)]",
-				children: label
-			}), description && /* @__PURE__ */ jsx("span", {
-				className: "block text-[0.8125rem] text-[var(--theme-muted-text-color)] font-normal mt-0.5",
-				children: description
-			})]
-		}),
-		loading ? /* @__PURE__ */ jsx(LoaderIcon, { className: "size-5 text-[var(--theme-muted-text-color)] shrink-0 ml-2" }) : /* @__PURE__ */ jsx(AngleRightIcon, { className: "size-5 text-[var(--theme-muted-text-color)] shrink-0 ml-2 transition-all duration-200 group-hover:translate-x-[3px] group-hover:text-[var(--theme-app)]" })
-	] });
-	if (href) {
-		if (href.startsWith("/api/") || href.startsWith("http")) return /* @__PURE__ */ jsx("a", {
-			href,
-			className: cx("group", baseClasses, className),
-			children: content
-		});
-		return /* @__PURE__ */ jsx(Link, {
-			to: href,
-			className: cx("group", baseClasses, className),
-			children: content
-		});
-	}
-	return /* @__PURE__ */ jsx("button", {
-		type: "button",
-		className: cx("group", baseClasses, disabledClasses, className),
-		disabled: disabled || loading,
-		...props,
-		children: content
-	});
-}
-//#endregion
-//#region src/components/Card.tsx
-function Card({ children, className = "", wide, compact, interactive, authShadow }) {
-	return /* @__PURE__ */ jsx("div", {
-		className: cx("w-full bg-[var(--theme-card-bg)] backdrop-blur-xl border border-[var(--theme-border)] rounded-2xl", authShadow ? "shadow-[var(--theme-auth-shadow)]" : "shadow-[var(--theme-shadow)]", wide && "max-w-[560px] p-8", compact && "max-w-[400px] p-6", !wide && !compact && "max-w-[520px] p-10", interactive && "ds-card-interactive cursor-pointer", className),
-		children
-	});
-}
-function CardHeader({ badge, title, description, className = "", align = "center" }) {
-	return /* @__PURE__ */ jsxs("div", {
-		className: cx(align === "center" ? "text-center" : "text-left", "mb-6", className),
-		children: [
-			badge && /* @__PURE__ */ jsx("div", {
-				className: "inline-flex items-center gap-1.5 py-1.5 px-3 text-xs font-medium bg-[var(--theme-muted-panel-bg)] border border-[var(--theme-border)] rounded-full text-[var(--theme-muted-text-color)] mb-4 transition-colors duration-200",
-				children: badge
-			}),
-			/* @__PURE__ */ jsx("h1", {
-				className: "text-2xl font-bold tracking-tight text-[var(--theme-app)]",
-				style: { letterSpacing: "-0.025em" },
-				children: title
-			}),
-			description && /* @__PURE__ */ jsx("p", {
-				className: "text-[var(--theme-muted-text-color)] text-sm leading-relaxed mt-2",
-				children: description
-			})
-		]
-	});
-}
-//#endregion
-//#region src/components/Input.tsx
-var Input = forwardRef(({ label, error, className = "", mono, type, required, ...props }, ref) => {
-	const [showPassword, setShowPassword] = useState(false);
-	const isPassword = type === "password";
-	const inputType = isPassword && showPassword ? "text" : type;
-	const generatedId = useId();
-	const id = props.id ?? generatedId;
-	const errorId = `${id}-error`;
-	const describedBy = [props["aria-describedby"], error ? errorId : void 0].filter(Boolean).join(" ") || void 0;
-	const inputClasses = cx("w-full py-3 px-4 bg-[var(--theme-muted-panel-bg)] border border-[var(--theme-border)] rounded-lg text-[var(--theme-app)] text-sm transition-all duration-200 box-border", "focus:outline-none focus:border-[var(--theme-element)] focus:shadow-[0_0_0_3px_color-mix(in_srgb,var(--theme-element)_25%,transparent)]", "placeholder:text-[var(--theme-muted-text-color)]", "disabled:bg-[var(--theme-muted-panel-bg)] disabled:text-[var(--theme-muted-text-color)] disabled:cursor-not-allowed disabled:opacity-70", mono && "font-mono text-[0.8125rem]", error && "border-[#ef4444]", isPassword && "pr-11", className);
-	return /* @__PURE__ */ jsxs("div", {
-		className: "flex flex-col gap-1.5",
-		children: [
-			label && /* @__PURE__ */ jsxs("label", {
-				className: "text-[0.8125rem] font-medium text-[var(--theme-app)]",
-				htmlFor: id,
-				children: [label, required && /* @__PURE__ */ jsx(RequiredMark, {})]
-			}),
-			/* @__PURE__ */ jsxs("div", {
-				className: isPassword ? "relative w-full" : "",
-				children: [/* @__PURE__ */ jsx("input", {
-					ref,
-					type: inputType,
-					className: inputClasses,
-					...props,
-					id,
-					required,
-					"aria-invalid": error ? true : props["aria-invalid"],
-					"aria-describedby": describedBy
-				}), isPassword && /* @__PURE__ */ jsx("button", {
-					type: "button",
-					className: "absolute right-3 top-1/2 -translate-y-1/2 bg-transparent border-none text-[var(--theme-muted-text-color)] cursor-pointer p-1 transition-colors duration-200 flex items-center justify-center hover:text-[var(--theme-app)]",
-					onClick: () => setShowPassword(!showPassword),
-					tabIndex: -1,
-					"aria-label": showPassword ? "Hide password" : "Show password",
-					children: showPassword ? /* @__PURE__ */ jsx(EyeOffIcon, { className: "w-5 h-5" }) : /* @__PURE__ */ jsx(EyeIcon, { className: "w-5 h-5" })
-				})]
-			}),
-			error && /* @__PURE__ */ jsxs("span", {
-				id: errorId,
-				role: "alert",
-				className: "text-[0.8125rem] text-[#ef4444] flex items-center gap-1.5",
-				children: [/* @__PURE__ */ jsx(AlertIcon, { className: "w-4 h-4" }), error]
-			})
-		]
-	});
-});
-Input.displayName = "Input";
-var Textarea = forwardRef(({ label, error, className = "", mono, required, ...props }, ref) => {
-	const generatedId = useId();
-	const id = props.id ?? generatedId;
-	const errorId = `${id}-error`;
-	const describedBy = [props["aria-describedby"], error ? errorId : void 0].filter(Boolean).join(" ") || void 0;
-	const textareaClasses = cx("w-full py-3 px-4 bg-[var(--theme-muted-panel-bg)] border border-[var(--theme-border)] rounded-lg text-[var(--theme-app)] text-sm transition-all duration-200 box-border min-h-[140px] resize-y", "focus:outline-none focus:border-[var(--theme-element)] focus:shadow-[0_0_0_3px_color-mix(in_srgb,var(--theme-element)_25%,transparent)]", "placeholder:text-[var(--theme-muted-text-color)]", mono && "font-mono text-[0.8125rem]", error && "border-[#ef4444]", className);
-	return /* @__PURE__ */ jsxs("div", {
-		className: "flex flex-col gap-1.5",
-		children: [
-			label && /* @__PURE__ */ jsxs("label", {
-				className: "text-[0.8125rem] font-medium text-[var(--theme-app)]",
-				htmlFor: id,
-				children: [label, required && /* @__PURE__ */ jsx(RequiredMark, {})]
-			}),
-			/* @__PURE__ */ jsx("textarea", {
-				ref,
-				className: textareaClasses,
-				...props,
-				id,
-				required,
-				"aria-invalid": error ? true : props["aria-invalid"],
-				"aria-describedby": describedBy
-			}),
-			error && /* @__PURE__ */ jsxs("span", {
-				id: errorId,
-				role: "alert",
-				className: "text-[0.8125rem] text-[#ef4444] flex items-center gap-1.5",
-				children: [/* @__PURE__ */ jsx(AlertIcon, { className: "w-4 h-4" }), error]
-			})
-		]
-	});
-});
-Textarea.displayName = "Textarea";
-//#endregion
-//#region src/components/inputClasses.ts
-var inputClasses = "w-full rounded-md border theme-border bg-(--theme-input-bg) px-3 py-2 text-sm text-(--theme-panel) outline-none focus:ring-2 focus:ring-(--theme-element)";
-//#endregion
-//#region src/components/IconButton.tsx
-var IconButton = forwardRef(({ icon, label, variant = "default", size = "md", active = false, showTooltip = true, className, disabled, ...props }, ref) => {
-	const sizeClasses = {
-		sm: "w-7 h-7 [&_svg]:w-3.5 [&_svg]:h-3.5",
-		md: "w-9 h-9 [&_svg]:w-4 [&_svg]:h-4",
-		lg: "w-11 h-11 [&_svg]:w-5 [&_svg]:h-5"
-	};
-	const variantClasses = {
-		default: cx("bg-[var(--theme-muted-panel-bg)] text-[var(--theme-muted-text-color)]", "hover:bg-[var(--theme-border)] hover:text-[var(--theme-app)]", active && "bg-[var(--theme-element)]/10 text-[var(--theme-element)]"),
-		ghost: cx("bg-transparent text-[var(--theme-muted-text-color)]", "hover:bg-[var(--theme-muted-panel-bg)] hover:text-[var(--theme-app)]", active && "text-[var(--theme-element)]"),
-		primary: cx("bg-[var(--theme-element)] text-white", "hover:bg-[var(--theme-element)]/90", active && "ring-2 ring-[var(--theme-element)]/50"),
-		success: cx("bg-[#22c55e] text-white", "hover:bg-[#22c55e]/90", active && "ring-2 ring-[#22c55e]/50")
-	};
-	return /* @__PURE__ */ jsx("button", {
-		ref,
-		type: "button",
-		"aria-label": label,
-		disabled,
-		...showTooltip ? { "data-tooltip-id": TOOLTIP_ID } : {},
-		"data-tooltip-content": label,
-		"data-tooltip-delay-show": 300,
-		"data-tooltip-class-name": "!bg-[var(--theme-app)] !text-[var(--theme-app-bg)] !text-xs !py-1 !px-2 !rounded-md",
-		className: cx("inline-flex items-center justify-center rounded-lg", "transition-all duration-200 cursor-pointer", "disabled:opacity-50 disabled:cursor-not-allowed", sizeClasses[size], variantClasses[variant], className),
-		...props,
-		children: icon
-	});
-});
-IconButton.displayName = "IconButton";
-//#endregion
-//#region src/components/Toggle.tsx
-function Toggle({ checked, onChange, disabled, label }) {
-	return /* @__PURE__ */ jsxs("label", {
-		role: "none",
-		onClick: (e) => e.stopPropagation(),
-		className: cx("relative inline-flex items-center", disabled ? "cursor-not-allowed opacity-60" : "cursor-pointer"),
-		children: [/* @__PURE__ */ jsx("input", {
-			type: "checkbox",
-			className: "peer sr-only",
-			checked,
-			onChange: (e) => onChange(e.target.checked),
-			disabled,
-			"aria-label": label
-		}), /* @__PURE__ */ jsx("div", { className: "h-6 w-11 rounded-full bg-(--theme-muted-panel-bg) transition-colors peer-checked:bg-(--theme-element) peer-focus-visible:ring-2 peer-focus-visible:ring-[color-mix(in_srgb,var(--theme-element)_25%,transparent)] after:absolute after:start-[2px] after:top-[2px] after:h-5 after:w-5 after:rounded-full after:bg-white after:shadow-sm after:transition-transform after:content-[\"\"] motion-reduce:after:transition-none peer-checked:after:translate-x-5" })]
-	});
-}
-//#endregion
-//#region src/components/LetterBadge.tsx
-/** A compact letter badge ("AI", "PUB", "SSH") used as a type mark in place of
-* an icon. Size the box and text via className (e.g. "h-5 w-5 text-[8px]"). */
-function LetterBadge({ text, className }) {
-	return /* @__PURE__ */ jsx("span", {
-		className: cx("inline-flex shrink-0 items-center justify-center rounded-[3px] border theme-border font-bold leading-none tracking-tight text-(--theme-app)", className),
-		children: text
-	});
-}
-//#endregion
-//#region src/components/FilterPill.tsx
-function FilterPill({ active, onClick, children }) {
-	return /* @__PURE__ */ jsx("button", {
-		type: "button",
-		onClick,
-		className: cx("px-3 py-1.5 text-xs font-medium rounded-full border transition-all duration-200", active ? "bg-[var(--theme-panel-bg)] border-[var(--theme-border)] text-[var(--theme-panel)] shadow-sm" : "bg-transparent border-transparent text-[var(--theme-muted-text-color)] hover:text-[var(--theme-panel)] hover:bg-[var(--theme-hover)]"),
-		children
-	});
-}
-//#endregion
-//#region src/components/Filter.tsx
-function Filter({ filter, setFilter, placeholder = "Filter...", pills, activePill, onPillChange }) {
-	return /* @__PURE__ */ jsxs("div", {
-		className: "flex items-center gap-2",
-		children: [/* @__PURE__ */ jsxs("div", {
-			className: "relative flex items-center",
-			children: [/* @__PURE__ */ jsx("input", {
-				placeholder,
-				type: "text",
-				value: filter,
-				onChange: (e) => setFilter(e.target.value.toLowerCase()),
-				className: "shadow-sm focus:ring-1 block w-full pr-3 sm:text-sm theme-border rounded-md py-1.5 pl-8"
-			}), /* @__PURE__ */ jsx("div", {
-				className: "absolute inset-y-0 left-0 flex py-2.5 pl-2",
-				children: /* @__PURE__ */ jsx(FilterIcon, {})
-			})]
-		}), pills && onPillChange && /* @__PURE__ */ jsx("div", {
-			className: "flex gap-1",
-			children: pills.map((pill) => /* @__PURE__ */ jsx("button", {
-				type: "button",
-				onClick: () => onPillChange(pill.value),
-				className: cx("px-2.5 py-1 text-xs rounded-full transition-colors border", activePill === pill.value ? "bg-(--theme-element) text-(--theme-element-text) border-transparent" : "theme-border theme-text hover:theme-hover"),
-				children: pill.label
-			}, pill.value))
-		})]
-	});
-}
-//#endregion
-//#region src/components/Sort.tsx
-var SortIcon = ({ currentlySorted, currentDirection, name }) => {
-	const style = { transform: "translateY(2px)" };
-	if (currentlySorted === name) {
-		if (currentDirection === "ascending") return /* @__PURE__ */ jsx(SortDownIcon, { style });
-		else if (currentDirection === "descending") return /* @__PURE__ */ jsx(SortUpIcon, { style });
-	} else return /* @__PURE__ */ jsx(SortUnsortedIcon, { style });
-	return null;
-};
-function Sort({ currentlySorted, name, setCurrentDirection, setCurrentlySorted, currentDirection }) {
-	const t = useStrings().common;
-	const sort = (sorted, direction) => {
-		if (sorted === name) {
-			if (direction === "ascending") setCurrentDirection("descending");
-			else if (direction === "descending") {
-				setCurrentDirection("unsorted");
-				setCurrentlySorted("");
-			}
-		} else {
-			setCurrentDirection("ascending");
-			setCurrentlySorted(name);
-		}
-	};
-	return /* @__PURE__ */ jsx("div", {
-		className: "inline",
-		children: /* @__PURE__ */ jsx("button", {
-			type: "button",
-			"aria-label": t.sort,
-			onClick: () => sort(currentlySorted, currentDirection),
-			children: /* @__PURE__ */ jsx(SortIcon, {
-				currentDirection,
-				currentlySorted,
-				name
-			})
-		})
-	});
-}
-//#endregion
-//#region src/components/Pagination.tsx
-function Pagination({ endingNumber, endingTime, nextCallback, prevCallback, roundedBottom, startingNumber, startingTime, nextDisabled, prevDisabled, name, useTimeRange = false }) {
-	const t = useStrings().list;
-	return /* @__PURE__ */ jsxs("nav", {
-		className: cx(roundedBottom && "rounded-b-2xl", "theme-muted-panel flex items-center justify-between border-t theme-border  px-4 py-1 sm:px-6"),
-		"aria-label": "Pagination",
-		children: [/* @__PURE__ */ jsx("div", {
-			className: cx("hidden", (startingNumber !== void 0 && startingNumber !== null && endingNumber !== void 0 && endingNumber !== null || startingTime && endingTime) && "sm:block"),
-			children: /* @__PURE__ */ jsx("p", {
-				className: "text-sm whitespace-nowrap",
-				children: useTimeRange && startingTime && endingTime ? t.paginationShowingTimeRange(name ?? "", startingTime, endingTime) : t.paginationShowing(name ?? "", startingNumber ?? "", endingNumber ?? "")
-			})
-		}), /* @__PURE__ */ jsxs("div", {
-			className: "flex flex-1 justify-between sm:justify-end gap-x-2",
-			children: [/* @__PURE__ */ jsx("button", {
-				type: "button",
-				disabled: prevDisabled,
-				onClick: prevCallback,
-				className: cx("link text-sm", prevDisabled && "disabled"),
-				children: t.paginationPrevious
-			}), /* @__PURE__ */ jsx("button", {
-				type: "button",
-				disabled: nextDisabled,
-				onClick: nextCallback,
-				className: cx("link text-sm", nextDisabled && "disabled"),
-				children: t.paginationNext
-			})]
-		})]
-	});
-}
-//#endregion
-//#region src/components/SettingsCard.tsx
-/**
-* A settings card: an optional sentence-case section label sits above a
-* bordered panel of rows. The label carries the breathing-room rhythm between
-* cards; the rows inside provide their own dividers via SettingRow's `isFirst`.
-*/
-function SettingsCard({ title, description, action, actionAlign = "adjacent", overflowVisible, children, className }) {
-	return /* @__PURE__ */ jsxs("section", {
-		className: cx("mt-10 first:mt-0", className),
-		children: [(title || action) && /* @__PURE__ */ jsxs("div", {
-			className: "mb-3 px-0.5",
-			children: [/* @__PURE__ */ jsxs("div", {
-				className: cx("flex items-center gap-1.5", actionAlign === "right" && "justify-between"),
-				children: [title && /* @__PURE__ */ jsx("h2", {
-					className: "text-[15px] font-semibold theme-text leading-none",
-					children: title
-				}), action]
-			}), description && /* @__PURE__ */ jsx("p", {
-				className: "text-xs theme-muted-text mt-1.5 leading-snug",
-				children: description
-			})]
-		}), /* @__PURE__ */ jsx("div", {
-			className: cx("panel", overflowVisible ? "overflow-visible" : "overflow-hidden"),
-			children
-		})]
-	});
-}
-//#endregion
-//#region src/components/SettingsGroup.tsx
-function SettingsGroup({ title, children, className }) {
-	return /* @__PURE__ */ jsxs("div", {
-		className: cx("mt-8 first:mt-0", className),
-		children: [title && /* @__PURE__ */ jsx("h2", {
-			className: "text-[11px] font-semibold uppercase tracking-wider theme-muted-text mb-2 px-1",
-			children: title
-		}), /* @__PURE__ */ jsx("div", {
-			className: "panel divide-y divide-(--theme-border)",
-			children
-		})]
-	});
-}
-//#endregion
-//#region src/components/SettingRow.tsx
-function SettingRow({ label, htmlFor, helpText, children, isFirst, fill, onClick }) {
-	return /* @__PURE__ */ jsxs("div", {
-		role: "none",
-		onClick,
-		className: cx("px-5 py-5 grid grid-cols-1 gap-x-8 gap-y-2", fill ? "md:grid-cols-[200px_1fr]" : "md:grid-cols-[1fr_auto]", !isFirst && "border-t theme-border", onClick && "cursor-pointer select-none hover:theme-hover transition-colors"),
-		children: [/* @__PURE__ */ jsxs("div", {
-			className: "flex flex-col gap-y-1",
-			children: [/* @__PURE__ */ jsx("label", {
-				htmlFor,
-				className: "font-semibold theme-text leading-tight",
-				children: label
-			}), helpText && /* @__PURE__ */ jsx("div", {
-				className: "theme-muted-text text-xs leading-snug",
-				children: helpText
-			})]
-		}), /* @__PURE__ */ jsx("div", {
-			className: cx("min-w-0", !fill && "flex items-center justify-end"),
-			children
-		})]
-	});
-}
-function SettingSection({ title, isFirst }) {
-	return /* @__PURE__ */ jsx("div", {
-		className: cx("px-5 py-3 theme-muted-panel", !isFirst && "border-t theme-border"),
-		children: /* @__PURE__ */ jsx("h2", {
-			className: "font-semibold text-sm uppercase tracking-wider theme-muted-text",
-			children: title
-		})
-	});
-}
-//#endregion
-//#region src/components/SettingModeOption.tsx
-/** A labeled + described radio option row, used inside a SettingsCard to pick
-* between modes (e.g. default vs custom). Stacked rows share the card's
-* dividers via `isFirst`. */
-function SettingModeOption({ name, checked, onSelect, label, description, isFirst, disabled }) {
-	return /* @__PURE__ */ jsxs("label", {
-		className: cx("flex items-start gap-3 px-5 py-4", disabled ? "cursor-default opacity-60" : "cursor-pointer", !isFirst && "border-t theme-border"),
-		children: [/* @__PURE__ */ jsx("input", {
-			type: "radio",
-			name,
-			checked,
-			onChange: onSelect,
-			disabled,
-			className: "mt-0.5 w-4 h-4 theme-input shrink-0"
-		}), /* @__PURE__ */ jsxs("div", {
-			className: "min-w-0",
-			children: [/* @__PURE__ */ jsx("div", {
-				className: "font-semibold theme-text leading-tight",
-				children: label
-			}), /* @__PURE__ */ jsx("div", {
-				className: "theme-muted-text text-xs leading-snug mt-0.5",
-				children: description
-			})]
-		})]
-	});
-}
-//#endregion
-export { AddMenu, Avatar, BareModal, BreadcrumbProvider, BreadcrumbsActionButton, BreadcrumbsRightAction, BreadcrumbsTitleAction, Button, CREATE_MODAL_SELECT_FILTER_THRESHOLD, Callout, Card, CardHeader, CompactTable, ConfirmModal, ControlledCollapsiblePanel, CopyCodeBlock, CopyToClipboard, CreateModal, CreateModalAutocompleteField, CreateModalField, CreateModalSelect, CreateModalSwitch, CreateModalTextarea, CustomListbox, DEFAULT_PRESET, DescriptionList, DescriptionListItem, Dropdown, DropdownCaret, EmptyState, Filter, FilterPill, GlobalTooltip, HeaderActionMenu, HeaderAddButton, HeaderEditButton, HeaderRowMenu, IconButton, Indicator, Input, LetterBadge, Loader, Markdown, MaybeCollapsible, MethodButton, MultiSelectDropdown, Overview, PageHeader, Pagination, RequiredMark, SectionHeader, SettingModeOption, SettingRow, SettingSection, SettingsCard, SettingsGroup, Sort, StatusBadge, StatusDot, SwitchToggle, SwitchToggleSmall, THEME_PRESETS, THEME_TOKENS, TOOLTIP_ID, Table, Textarea, Toggle, TooltipInfo, UIProvider, UncontrolledCollapsiblePanel, applyTheme, avatarInitials, contrastRatio, dangerButtonClasses, deriveTheme, filterOption, flattenOptions, formatTooltipContent, ghostButtonClasses, headerActionButtonClasses, inputClasses, isCategory, isDarkColor, isOption, modalPanelClasses, primaryButtonClasses, statusTextClass, toggleSetMember, truncationTooltipProps, useBreadcrumb, useClearBreadcrumbs, useCssIsDark, useHideBreadcrumbs, useNavigation, useNotify, usePersistedState, useProvisionCorsRules, useRelativeTime, useRepoSuggestions, useRunFile, useSetBreadcrumbs, useSetDefaultBreadcrumbs, useSlots, useStrings, useWorkflowJsonResolver };
+export { AddMenu, Avatar, BareModal, BreadcrumbProvider, BreadcrumbsActionButton, BreadcrumbsRightAction, BreadcrumbsTitleAction, Button, CREATE_MODAL_SELECT_FILTER_THRESHOLD, Callout, Card, CardHeader, CompactTable, ConfirmModal, ControlledCollapsiblePanel, CopyCodeBlock, CopyToClipboard, CreateModal, CreateModalAutocompleteField, CreateModalField, CreateModalSelect, CreateModalSwitch, CreateModalTextarea, CustomListbox, DEFAULT_PRESET, DescriptionList, DescriptionListItem, Dropdown, DropdownCaret, EmptyState, Filter, FilterPill, GlobalTooltip, HeaderActionMenu, HeaderAddButton, HeaderEditButton, HeaderRowMenu, IconButton, Indicator, Input, LetterBadge, Loader, Markdown, MaybeCollapsible, MethodButton, MultiSelectDropdown, Overview, PageHeader, Pagination, RequiredMark, SectionHeader, SettingModeOption, SettingRow, SettingSection, SettingsCard, SettingsGroup, Sort, StatusBadge, StatusDot, SwitchToggle, SwitchToggleSmall, THEME_PRESETS, THEME_TOKENS, TOOLTIP_ID, Table, Textarea, Toggle, TooltipInfo, UIProvider, UncontrolledCollapsiblePanel, applyTheme, avatarInitials, contrastRatio, dangerButtonClasses, deriveTheme, filterOption, flattenOptions, formatTooltipContent, ghostButtonClasses, headerActionButtonClasses, inputClasses, isCategory, isDarkColor, isOption, modalPanelClasses, primaryButtonClasses, statusTextClass, toggleSetMember, truncationTooltipProps, useBreadcrumb, useClearBreadcrumbs, useCssIsDark, useHideBreadcrumbs, useNavigation, useNotify, useOptionalWorkflowEngine, usePersistedState, useProvisionCorsRules, useRelativeTime, useRunFile, useSetBreadcrumbs, useSetDefaultBreadcrumbs, useSlots, useStrings, useWorkflowEngine, useWorkflowEngineLoader };