@parallelworks/ui 0.21.0 → 0.21.1

package/dist/ai/components/agent/AgentMessageParts.js

@@ -1,4 +1,6 @@
-import { CheckIcon, ChevronRightIcon, LoaderIcon } from "../../../icons.js";
+import { FaCheck } from "../../../icons/fa/FaCheck.js";
+import { LuChevronRight } from "../../../icons/lu/LuChevronRight.js";
+import { LoaderIcon } from "../../../components/StatusIcons.js";
 import { useCssIsDark } from "../../../components/useCssIsDark.js";
 import { LogViewer } from "../../../logviewer/LogViewer.js";
 import { agentColorHex, bashExitCode, fullToolArgs, isGroupableTool, rollupSentence, summarizeToolArgs, toolHeaderFor, toolSummary } from "../../agent/toolfmt.js";
@@ -204,7 +206,7 @@ function ToolCallBlock({ part }) {
 							]
 						})]
 					}),
-					/* @__PURE__ */ jsx(ChevronRightIcon, { className: cx("w-3.5 h-3.5 mt-1 shrink-0 theme-muted-text transition-transform", expanded && "rotate-90") })
+					/* @__PURE__ */ jsx(LuChevronRight, { className: cx("w-3.5 h-3.5 mt-1 shrink-0 theme-muted-text transition-transform", expanded && "rotate-90") })
 				]
 			}),
 			!isDiff && /* @__PURE__ */ jsx("div", {
@@ -266,7 +268,7 @@ function SubagentCard({ part }) {
 						]
 					})]
 				}),
-				canExpand && /* @__PURE__ */ jsx(ChevronRightIcon, { className: cx("w-3.5 h-3.5 mt-1 shrink-0 theme-muted-text transition-transform", expanded && "rotate-90") })
+				canExpand && /* @__PURE__ */ jsx(LuChevronRight, { className: cx("w-3.5 h-3.5 mt-1 shrink-0 theme-muted-text transition-transform", expanded && "rotate-90") })
 			]
 		}), /* @__PURE__ */ jsx("div", {
 			className: cx("ml-5 mt-0.5 text-[13px]", part.status === "failed" ? "text-red-600" : "theme-muted-text"),
@@ -427,7 +429,7 @@ function ApprovalBlock({ part, onApprovalAnswer }) {
 			children: part.question
 		}), /* @__PURE__ */ jsxs("div", {
 			className: "flex items-center gap-2",
-			children: [/* @__PURE__ */ jsx(CheckIcon, { className: "w-3.5 h-3.5" }), /* @__PURE__ */ jsxs("span", { children: [t.answered, part.answer ? `: ${part.answer}` : ""] })]
+			children: [/* @__PURE__ */ jsx(FaCheck, { className: "w-3.5 h-3.5" }), /* @__PURE__ */ jsxs("span", { children: [t.answered, part.answer ? `: ${part.answer}` : ""] })]
 		})]
 	});
 	return /* @__PURE__ */ jsxs("div", {
@@ -499,7 +501,7 @@ function NoticeBlock({ part }) {
 				children: [/* @__PURE__ */ jsx("span", {
 					className: "min-w-0 flex-1 whitespace-pre-wrap",
 					children: part.text
-				}), /* @__PURE__ */ jsx(ChevronRightIcon, { className: cx("mt-0.5 h-3.5 w-3.5 shrink-0 transition-transform", expanded && "rotate-90") })]
+				}), /* @__PURE__ */ jsx(LuChevronRight, { className: cx("mt-0.5 h-3.5 w-3.5 shrink-0 transition-transform", expanded && "rotate-90") })]
 			}), expanded && /* @__PURE__ */ jsx("div", {
 				className: "ml-4 mt-1 border-l-2 theme-border pl-3 text-sm theme-muted-text",
 				children: /* @__PURE__ */ jsx(Markdown, { children: part.detail })
@@ -548,7 +550,7 @@ function ReasoningBlock({ part, isStreaming }) {
 			onClick: () => hasBody && setExpanded((v) => !v),
 			"aria-expanded": expanded,
 			className: cx("flex min-h-6 items-center gap-x-1 text-sm theme-muted-text transition-colors", hasBody && "hover:theme-text"),
-			children: [/* @__PURE__ */ jsx("span", { children: label }), hasBody && /* @__PURE__ */ jsx(ChevronRightIcon, { className: cx("w-3.5 h-3.5 transition-transform", expanded && "rotate-90") })]
+			children: [/* @__PURE__ */ jsx("span", { children: label }), hasBody && /* @__PURE__ */ jsx(LuChevronRight, { className: cx("w-3.5 h-3.5 transition-transform", expanded && "rotate-90") })]
 		}), expanded && /* @__PURE__ */ jsx("div", {
 			className: "mt-1.5",
 			children: body
@@ -684,7 +686,7 @@ function RollupGroup({ members, message }) {
 					className: "font-mono text-[13px] theme-muted-text min-w-0 truncate",
 					children: sentence
 				}),
-				/* @__PURE__ */ jsx(ChevronRightIcon, { className: cx("w-3.5 h-3.5 shrink-0 theme-muted-text transition-transform", expanded && "rotate-90") })
+				/* @__PURE__ */ jsx(LuChevronRight, { className: cx("w-3.5 h-3.5 shrink-0 theme-muted-text transition-transform", expanded && "rotate-90") })
 			]
 		}), /* @__PURE__ */ jsx("div", {
 			className: cx("ml-1.5 mt-0.5 rounded-md", expanded ? "bg-(--theme-muted-panel-bg)/40 px-2" : "hidden"),

package/dist/ai/ui/Dropdown.js

@@ -1,4 +1,4 @@
-import { ChevronDownIcon } from "../../icons.js";
+import { FaChevronDown } from "../../icons/fa/FaChevronDown.js";
 import { TOOLTIP_ID } from "../../components/Tooltip.js";
 import cx from "classnames";
 import { useCallback, useEffect, useRef, useState } from "react";
@@ -76,7 +76,7 @@ function Dropdown({ options, value, onChange, placeholder = "", disabled = false
 					className: cx("truncate", !shown && "text-(--theme-muted-text-color,#6c757d)"),
 					children: shown || placeholder
 				}),
-				/* @__PURE__ */ jsx(ChevronDownIcon, { className: "h-3 w-3 shrink-0 opacity-60" })
+				/* @__PURE__ */ jsx(FaChevronDown, { className: "h-3 w-3 shrink-0 opacity-60" })
 			]
 		}), open && createPortal(/* @__PURE__ */ jsx("ul", {
 			ref: listRef,

package/dist/ai/ui/Notice.js

@@ -1,4 +1,6 @@
-import { AlertCircleIcon, CloseIcon, InfoCircleIcon } from "../../icons.js";
+import { FiAlertCircle } from "../../icons/fi/FiAlertCircle.js";
+import { IoMdClose } from "../../icons/io/IoMdClose.js";
+import { IoInformationCircleOutline } from "../../icons/io5/IoInformationCircleOutline.js";
 import cx from "classnames";
 import { jsx, jsxs } from "react/jsx-runtime";
 //#region src/ai/ui/Notice.tsx
@@ -29,7 +31,7 @@ var cardTone = {
 /** A standing condition on the surface: a full-width bar under the header
 *  with a title, an explanation, and the one thing the reader can do about it. */
 function NoticeBar({ tone, title, children, action, onAction, testId }) {
-	const Icon = tone === "danger" || tone === "warning" ? AlertCircleIcon : InfoCircleIcon;
+	const Icon = tone === "danger" || tone === "warning" ? FiAlertCircle : IoInformationCircleOutline;
 	return /* @__PURE__ */ jsxs("div", {
 		"data-testid": testId,
 		className: cx("flex shrink-0 items-start gap-3 border-b px-6 py-3", barTone[tone]),
@@ -69,7 +71,7 @@ function NoticeCard({ tone = "neutral", children, onDismiss, dismissLabel, testI
 			"aria-label": dismissLabel,
 			title: dismissLabel,
 			className: "shrink-0 rounded p-0.5 hover:theme-hover",
-			children: /* @__PURE__ */ jsx(CloseIcon, { className: "h-3 w-3" })
+			children: /* @__PURE__ */ jsx(IoMdClose, { className: "h-3 w-3" })
 		})]
 	});
 }

package/dist/ai/ui/sidebar.js

@@ -1,4 +1,4 @@
-import { SidebarIcon } from "../../icons.js";
+import { TbLayoutSidebar } from "../../icons/tb/TbLayoutSidebar.js";
 import { ConfirmModal } from "../../components/ConfirmModal.js";
 import { focusOnMount } from "../../components/focus.js";
 import { MoreButton, rowContextMenuProps, useRowMenuActive } from "../../list/RowContextMenu.js";
@@ -31,7 +31,7 @@ function SidebarToggle({ collapsed, onToggle, openLabel, closeLabel, className }
 		"aria-label": label,
 		"aria-expanded": !collapsed,
 		className: cx("flex h-7 w-7 items-center justify-center rounded-md theme-muted-text transition-colors hover:theme-muted-panel hover:theme-text", className),
-		children: /* @__PURE__ */ jsx(SidebarIcon, { className: "h-4 w-4" })
+		children: /* @__PURE__ */ jsx(TbLayoutSidebar, { className: "h-4 w-4" })
 	});
 }
 function SidebarGroupHeading({ children, tone = "default", testId }) {

package/dist/components/Button.js

@@ -1,5 +1,6 @@
 import { useLink } from "./Provider.js";
-import { AngleRightIcon, LoaderIcon } from "../icons.js";
+import { FaAngleRight } from "../icons/fa/FaAngleRight.js";
+import { LoaderIcon } from "./StatusIcons.js";
 import cx from "classnames";
 import { forwardRef } from "react";
 import { Fragment as Fragment$1, jsx, jsxs } from "react/jsx-runtime";
@@ -57,7 +58,7 @@ function MethodButton({ icon, label, description, href, loading, disabled, class
 				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)]" })
+		loading ? /* @__PURE__ */ jsx(LoaderIcon, { className: "size-5 text-[var(--theme-muted-text-color)] shrink-0 ml-2" }) : /* @__PURE__ */ jsx(FaAngleRight, { 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", {

package/dist/components/Callout.js

@@ -1,10 +1,11 @@
-import { AlertIcon, InfoIcon } from "../icons.js";
+import { FaInfoCircle } from "../icons/fa/FaInfoCircle.js";
+import { TbAlertTriangle } from "../icons/tb/TbAlertTriangle.js";
 import cx from "classnames";
 import { jsx, jsxs } from "react/jsx-runtime";
 //#region src/components/Callout.tsx
 function CalloutIcon({ type }) {
-	if (type === "warning" || type === "error") return /* @__PURE__ */ jsx(AlertIcon, { className: "h-6 w-6 mr-4 text-lg" });
-	else return /* @__PURE__ */ jsx(InfoIcon, { className: "h-6 w-6 mr-4 text-lg" });
+	if (type === "warning" || type === "error") return /* @__PURE__ */ jsx(TbAlertTriangle, { className: "h-6 w-6 mr-4 text-lg" });
+	else return /* @__PURE__ */ jsx(FaInfoCircle, { className: "h-6 w-6 mr-4 text-lg" });
 }
 function Callout({ type, className = "", children }) {
 	return /* @__PURE__ */ jsx("div", {

package/dist/components/CollapsiblePanel.js

@@ -1,4 +1,4 @@
-import { AngleRightIcon } from "../icons.js";
+import { FaAngleRight } from "../icons/fa/FaAngleRight.js";
 import cx from "classnames";
 import React, { useCallback } from "react";
 import { Fragment as Fragment$1, jsx, jsxs } from "react/jsx-runtime";
@@ -26,7 +26,7 @@ function ControlledCollapsiblePanel({ title = "", children, open, setOpen, onCli
 					"aria-controls": contentId,
 					className: cx("flex items-center text-left cursor-pointer", !titleAction && "w-full"),
 					onClick: toggleOpen,
-					children: [/* @__PURE__ */ jsx(AngleRightIcon, { className: cx(open && "transform rotate-90", "px-1 ml-1 text-[1.25rem] transition ease-in") }), /* @__PURE__ */ jsx("span", {
+					children: [/* @__PURE__ */ jsx(FaAngleRight, { className: cx(open && "transform rotate-90", "px-1 ml-1 text-[1.25rem] transition ease-in") }), /* @__PURE__ */ jsx("span", {
 						className: "px-2 font-bold select-none",
 						children: title?.toString()
 					})]

package/dist/components/CopyToClipboard.js

@@ -1,5 +1,9 @@
 import { useNotify, useStrings } from "./Provider.js";
-import { CheckIcon, ClipboardIcon, CopyIcon, HiddenFalseIcon, HiddenTrueIcon } from "../icons.js";
+import { FaCheck } from "../icons/fa/FaCheck.js";
+import { FaEye } from "../icons/fa/FaEye.js";
+import { FaEyeSlash } from "../icons/fa/FaEyeSlash.js";
+import { FiCopy } from "../icons/fi/FiCopy.js";
+import { HiOutlineClipboardCopy } from "../icons/hi/HiOutlineClipboardCopy.js";
 import { useState } from "react";
 import { jsx, jsxs } from "react/jsx-runtime";
 //#region src/components/CopyToClipboard.tsx
@@ -28,7 +32,7 @@ function CopyToClipboard({ as = "div", text, className, children, showIcon = tru
 				}
 			}
 		},
-		children: [showIcon && /* @__PURE__ */ jsx(ClipboardIcon, {}), children]
+		children: [showIcon && /* @__PURE__ */ jsx(HiOutlineClipboardCopy, {}), children]
 	});
 }
 function CopyCodeBlock({ textToCopy, children, secret = false, isRevealed = false, onRevealToggle }) {
@@ -63,7 +67,7 @@ function CopyCodeBlock({ textToCopy, children, secret = false, isRevealed = fals
 				className: "p-2 rounded-md opacity-0 group-hover:opacity-100 transition-all duration-150",
 				"aria-label": isRevealed ? "Hide secret" : "Reveal secret",
 				title: isRevealed ? "Hide secret" : "Reveal secret",
-				children: isRevealed ? /* @__PURE__ */ jsx(HiddenFalseIcon, {}) : /* @__PURE__ */ jsx(HiddenTrueIcon, {})
+				children: isRevealed ? /* @__PURE__ */ jsx(FaEye, {}) : /* @__PURE__ */ jsx(FaEyeSlash, {})
 			}), /* @__PURE__ */ jsx("button", {
 				type: "button",
 				onClick: (e) => {
@@ -72,7 +76,7 @@ function CopyCodeBlock({ textToCopy, children, secret = false, isRevealed = fals
 				},
 				className: "p-2 rounded-md opacity-0 group-hover:opacity-100 transition-all duration-150",
 				"aria-label": copied ? "Copied" : "Copy to clipboard",
-				children: copied ? /* @__PURE__ */ jsx(CheckIcon, { className: "text-green-400" }) : /* @__PURE__ */ jsx(CopyIcon, {})
+				children: copied ? /* @__PURE__ */ jsx(FaCheck, { className: "text-green-400" }) : /* @__PURE__ */ jsx(FiCopy, {})
 			})]
 		})]
 	});

package/dist/components/CreateModal.js

@@ -1,5 +1,9 @@
 import { useStrings } from "./Provider.js";
-import { ChevronDownIcon, ChevronRightIcon, FavoriteIcon, FavoriteOutlineIcon, TooltipIcon } from "../icons.js";
+import { FaChevronDown } from "../icons/fa/FaChevronDown.js";
+import { HiQuestionMarkCircle } from "../icons/hi/HiQuestionMarkCircle.js";
+import { IoHeart } from "../icons/io5/IoHeart.js";
+import { IoHeartOutline } from "../icons/io5/IoHeartOutline.js";
+import { LuChevronRight } from "../icons/lu/LuChevronRight.js";
 import { TOOLTIP_ID } from "./Tooltip.js";
 import { AddMenu } from "./AddMenu.js";
 import { BareModal, modalPanelClasses } from "./BareModal.js";
@@ -17,7 +21,7 @@ function FieldHelp({ tooltip }) {
 		"data-tooltip-id": TOOLTIP_ID,
 		"data-tooltip-content": tooltip,
 		className: "inline-flex cursor-help text-(--theme-muted-text-color)",
-		children: /* @__PURE__ */ jsx(TooltipIcon, { className: "w-3 h-3" })
+		children: /* @__PURE__ */ jsx(HiQuestionMarkCircle, { className: "w-3 h-3" })
 	});
 }
 /** Anchors the tooltip on a non-focusable span so it opens on hover but not when focus returns to the button after its menu/toggle closes (which would leave it stuck). */
@@ -118,7 +122,7 @@ function CreateModal({ open, onClose, typeIcon, typeLabel, typeMenu, namePlaceho
 							children: [
 								typeIcon,
 								typeLabel,
-								/* @__PURE__ */ jsx(ChevronDownIcon, { className: "w-3 h-3 opacity-60" })
+								/* @__PURE__ */ jsx(FaChevronDown, { className: "w-3 h-3 opacity-60" })
 							]
 						}) : /* @__PURE__ */ jsxs("div", {
 							className: "inline-flex items-center gap-1.5 px-1.5 py-1 rounded-md bg-(--theme-muted-panel-bg) text-xs font-medium text-(--theme-muted-text-color)",
@@ -183,7 +187,7 @@ function CreateModal({ open, onClose, typeIcon, typeLabel, typeMenu, namePlaceho
 						type: "button",
 						onClick: () => setAdvancedOpen((o) => !o),
 						className: "inline-flex items-center gap-1 text-xs font-medium text-(--theme-muted-text-color) hover:text-(--theme-app) transition-colors",
-						children: [/* @__PURE__ */ jsx(ChevronRightIcon, { className: cx("w-3 h-3 transition-transform", advancedOpen && "rotate-90") }), t.advanced]
+						children: [/* @__PURE__ */ jsx(LuChevronRight, { className: cx("w-3 h-3 transition-transform", advancedOpen && "rotate-90") }), t.advanced]
 					}), advancedOpen && /* @__PURE__ */ jsx("div", {
 						className: "mt-2",
 						children: advanced
@@ -202,7 +206,7 @@ function CreateModal({ open, onClose, typeIcon, typeLabel, typeMenu, namePlaceho
 				children: /* @__PURE__ */ jsxs(PillTooltip, {
 					content: favorite ? t.favoriteHintOn : t.favoriteHintOff,
 					className: "px-2.5",
-					children: [favorite ? /* @__PURE__ */ jsx(FavoriteIcon, { className: "w-4 h-4 scale-110 transition-transform" }) : /* @__PURE__ */ jsx(FavoriteOutlineIcon, { className: "w-4 h-4 transition-transform" }), favorite ? t.favorited : t.favorite]
+					children: [favorite ? /* @__PURE__ */ jsx(IoHeart, { className: "w-4 h-4 scale-110 transition-transform" }) : /* @__PURE__ */ jsx(IoHeartOutline, { className: "w-4 h-4 transition-transform" }), favorite ? t.favorited : t.favorite]
 				})
 			}) : /* @__PURE__ */ jsx("span", {}), /* @__PURE__ */ jsxs("div", {
 				className: "flex items-center gap-2",
@@ -318,7 +322,7 @@ function collapseToggleRow(group, count, collapse) {
 		onMouseDown: (e) => e.preventDefault(),
 		onClick: () => collapse.onToggle(group),
 		className: "flex w-full items-center gap-1.5 px-3 py-1.5 text-[13px] text-(--theme-muted-text-color) hover:text-(--theme-app) cursor-pointer",
-		children: [/* @__PURE__ */ jsx(expanded ? ChevronDownIcon : ChevronRightIcon, { className: "w-3 h-3" }), collapse.label(count)]
+		children: [/* @__PURE__ */ jsx(expanded ? FaChevronDown : LuChevronRight, { className: "w-3 h-3" }), collapse.label(count)]
 	}, `toggle-${group}`);
 }
 function collapsibleCountsByGroup(options) {
@@ -445,7 +449,7 @@ function CreateModalSelect({ label, icon, value, options, onChange, disabled = f
 			className: "font-normal text-(--theme-muted-text-color)",
 			children: label
 		}), selectedLabel] }) : label,
-		/* @__PURE__ */ jsx(ChevronDownIcon, { className: "w-3 h-3 opacity-60" })
+		/* @__PURE__ */ jsx(FaChevronDown, { className: "w-3 h-3 opacity-60" })
 	] });
 	if (disabled) return /* @__PURE__ */ jsx("button", {
 		type: "button",

package/dist/components/Dropdown.js

@@ -1,5 +1,5 @@
 import { useStrings } from "./Provider.js";
-import { CaretDownIcon } from "../icons.js";
+import { FaCaretDown } from "../icons/fa/FaCaretDown.js";
 import { truncationTooltipProps } from "./Tooltip.js";
 import { DropdownCaret, flattenDisplayOptions, isCategory, toggleSetMember } from "./dropdownUtils.js";
 import { Combobox, ComboboxButton, ComboboxInput, ComboboxOption, ComboboxOptions } from "@headlessui/react";
@@ -125,7 +125,7 @@ function ToggleOption({ option, category, expanded, onToggle, ...virtualRowProps
 				e.stopPropagation();
 				onToggle(category);
 			},
-			children: [/* @__PURE__ */ jsx(CaretDownIcon, { className: cx("w-3 h-3", !expanded && "-rotate-90") }), option.label]
+			children: [/* @__PURE__ */ jsx(FaCaretDown, { className: cx("w-3 h-3", !expanded && "-rotate-90") }), option.label]
 		})
 	});
 }

package/dist/components/Filter.js

@@ -1,4 +1,4 @@
-import { FilterIcon } from "../icons.js";
+import { FaFilter } from "../icons/fa/FaFilter.js";
 import cx from "classnames";
 import { jsx, jsxs } from "react/jsx-runtime";
 //#region src/components/Filter.tsx
@@ -15,7 +15,7 @@ function Filter({ filter, setFilter, placeholder = "Filter...", pills, activePil
 				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, {})
+				children: /* @__PURE__ */ jsx(FaFilter, {})
 			})]
 		}), pills && onPillChange && /* @__PURE__ */ jsx("div", {
 			className: "flex gap-1",

package/dist/components/Indicator.js

@@ -1,35 +1,40 @@
-import { CancelIcon, FailIcon, NotRunningIcon, RunningIcon, SkipIcon, SuccessIcon } from "../icons.js";
+import { FaRegCircle } from "../icons/fa/FaRegCircle.js";
+import { HiMiniCheckCircle } from "../icons/hi2/HiMiniCheckCircle.js";
+import { HiMiniMinusCircle } from "../icons/hi2/HiMiniMinusCircle.js";
+import { HiMiniXCircle } from "../icons/hi2/HiMiniXCircle.js";
+import { ImSpinner5 } from "../icons/im/ImSpinner5.js";
+import { TiCancel } from "../icons/ti/TiCancel.js";
 import { jsx } from "react/jsx-runtime";
 //#region src/components/Indicator.tsx
 function Indicator({ status }) {
 	return /* @__PURE__ */ jsx("div", {
 		className: "h-2 flex items-center text-(--theme-panel-bg)",
-		children: status === "started" || status === "running" ? /* @__PURE__ */ jsx(RunningIcon, {
+		children: status === "started" || status === "running" ? /* @__PURE__ */ jsx(ImSpinner5, {
 			className: "rounded-full text-[#FFCF00] animate-spin",
 			"data-testid": "running-indicator"
-		}) : status === "completed" ? /* @__PURE__ */ jsx(SuccessIcon, {
+		}) : status === "completed" ? /* @__PURE__ */ jsx(HiMiniCheckCircle, {
 			className: "text-[#6FBF5A]",
 			style: { transform: "scale(1.25)" },
 			"data-testid": "completed-indicator"
-		}) : status === "failed" || status === "error" ? /* @__PURE__ */ jsx(FailIcon, {
+		}) : status === "failed" || status === "error" ? /* @__PURE__ */ jsx(HiMiniXCircle, {
 			className: "text-red-500",
 			style: { transform: "scale(1.25)" },
 			"data-testid": "failed-indicator"
-		}) : status === "skipped" || status === "skipped-failed" ? /* @__PURE__ */ jsx(SkipIcon, {
+		}) : status === "skipped" || status === "skipped-failed" ? /* @__PURE__ */ jsx(HiMiniMinusCircle, {
 			className: "text-gray-400",
 			style: { transform: "scale(1.25)" },
 			"data-testid": "skipped-indicator"
-		}) : status === "canceled" ? /* @__PURE__ */ jsx(CancelIcon, {
+		}) : status === "canceled" ? /* @__PURE__ */ jsx(TiCancel, {
 			className: "text-[#3B82F6]",
 			style: { transform: "scale(1.5)" },
 			"data-testid": "canceled-indicator"
-		}) : status === "faulted" ? /* @__PURE__ */ jsx(RunningIcon, {
+		}) : status === "faulted" ? /* @__PURE__ */ jsx(ImSpinner5, {
 			className: "rounded-full text-[#EF4444] animate-spin",
 			"data-testid": "faulted-indicator"
-		}) : status === "canceling" ? /* @__PURE__ */ jsx(RunningIcon, {
+		}) : status === "canceling" ? /* @__PURE__ */ jsx(ImSpinner5, {
 			className: "rounded-full text-[#3B82F6] animate-spin",
 			"data-testid": "canceling-indicator"
-		}) : /* @__PURE__ */ jsx(NotRunningIcon, {
+		}) : /* @__PURE__ */ jsx(FaRegCircle, {
 			className: "rounded-full text-[#AAAAAA]",
 			"data-testid": "not-running-indicator"
 		})

package/dist/components/Input.js

@@ -1,4 +1,6 @@
-import { AlertIcon, EyeIcon, EyeOffIcon } from "../icons.js";
+import { LuEye } from "../icons/lu/LuEye.js";
+import { LuEyeOff } from "../icons/lu/LuEyeOff.js";
+import { TbAlertTriangle } from "../icons/tb/TbAlertTriangle.js";
 import { RequiredMark } from "./RequiredMark.js";
 import cx from "classnames";
 import { forwardRef, useId, useState } from "react";
@@ -38,14 +40,14 @@ var Input = forwardRef(({ label, error, className = "", mono, type, required, ..
 					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" })
+					children: showPassword ? /* @__PURE__ */ jsx(LuEyeOff, { className: "w-5 h-5" }) : /* @__PURE__ */ jsx(LuEye, { 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]
+				children: [/* @__PURE__ */ jsx(TbAlertTriangle, { className: "w-4 h-4" }), error]
 			})
 		]
 	});
@@ -78,7 +80,7 @@ var Textarea = forwardRef(({ label, error, className = "", mono, required, ...pr
 				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]
+				children: [/* @__PURE__ */ jsx(TbAlertTriangle, { className: "w-4 h-4" }), error]
 			})
 		]
 	});

package/dist/components/Listbox.js

@@ -1,5 +1,5 @@
 import { useStrings } from "./Provider.js";
-import { AngleDownIcon } from "../icons.js";
+import { FaAngleDown } from "../icons/fa/FaAngleDown.js";
 import { keyedByContent } from "./keys.js";
 import { focusOnMount } from "./focus.js";
 import { Listbox, ListboxButton, ListboxOption, ListboxOptions, Transition } from "@headlessui/react";
@@ -102,7 +102,7 @@ function CustomListbox({ options = [], handleOptionSelected, type, allowSearch =
 				children: strings.select(type)
 			}), /* @__PURE__ */ jsx("span", {
 				className: "pointer-events-none absolute inset-y-0 right-0 flex items-center justify-items-center",
-				children: /* @__PURE__ */ jsx(AngleDownIcon, {
+				children: /* @__PURE__ */ jsx(FaAngleDown, {
 					className: "h-5 w-8",
 					"aria-hidden": "true"
 				})

package/dist/components/Loader.js

@@ -1,4 +1,4 @@
-import { LoaderIcon } from "../icons.js";
+import { LoaderIcon } from "./StatusIcons.js";
 import cx from "classnames";
 import { jsx, jsxs } from "react/jsx-runtime";
 //#region src/components/Loader.tsx

package/dist/components/PageHeader.js

@@ -1,5 +1,8 @@
 import { useLink, useSlots, useStrings } from "./Provider.js";
-import { AddIcon, ChevronRightIcon, EditIcon, MoreIcon } from "../icons.js";
+import { BsThreeDots } from "../icons/bs/BsThreeDots.js";
+import { FaEdit } from "../icons/fa/FaEdit.js";
+import { FaPlus } from "../icons/fa/FaPlus.js";
+import { LuChevronRight } from "../icons/lu/LuChevronRight.js";
 import { keyedByContent } from "./keys.js";
 import { TOOLTIP_ID } from "./Tooltip.js";
 import { AddMenu } from "./AddMenu.js";
@@ -18,7 +21,7 @@ var headerAddButtonClasses = "inline-flex h-[26px] shrink-0 items-center gap-1.5
 function HeaderAddButton({ to, onClick, label, word = "add", menu, disabled = false, disabledHint }) {
 	const { common } = useStrings();
 	const Link = useLink();
-	const content = /* @__PURE__ */ jsxs(Fragment$1, { children: [/* @__PURE__ */ jsx(AddIcon, { className: "w-3 h-3" }), /* @__PURE__ */ jsx("span", { children: word === "create" ? common.create : common.add })] });
+	const content = /* @__PURE__ */ jsxs(Fragment$1, { children: [/* @__PURE__ */ jsx(FaPlus, { className: "w-3 h-3" }), /* @__PURE__ */ jsx("span", { children: word === "create" ? common.create : common.add })] });
 	if (menu) return /* @__PURE__ */ jsx(AddMenu, {
 		items: menu,
 		label,
@@ -52,7 +55,7 @@ function HeaderActionMenu({ items, label = "Actions" }) {
 		items,
 		label,
 		buttonClassName: headerActionButtonClasses,
-		children: /* @__PURE__ */ jsx(MoreIcon, { className: "w-3.5 h-3.5" })
+		children: /* @__PURE__ */ jsx(BsThreeDots, { className: "w-3.5 h-3.5" })
 	});
 }
 /** The header "…" trigger for a RowMenuItem menu — same rendering (submenus,
@@ -69,7 +72,7 @@ function HeaderRowMenu({ items, label = "Actions" }) {
 			const r = e.currentTarget.getBoundingClientRect();
 			openMenu(r.left, r.bottom + 4, items);
 		},
-		children: /* @__PURE__ */ jsx(MoreIcon, { className: "w-3.5 h-3.5" })
+		children: /* @__PURE__ */ jsx(BsThreeDots, { className: "w-3.5 h-3.5" })
 	}), contextMenu] });
 }
 function HeaderEditButton({ to, onClick, label = "Edit", disabled, tooltip }) {
@@ -84,7 +87,7 @@ function HeaderEditButton({ to, onClick, label = "Edit", disabled, tooltip }) {
 		...tooltip ? {} : { title: label },
 		className: headerActionButtonClasses,
 		...tooltipProps,
-		children: /* @__PURE__ */ jsx(EditIcon, { className: "w-3 h-3" })
+		children: /* @__PURE__ */ jsx(FaEdit, { className: "w-3 h-3" })
 	});
 	return /* @__PURE__ */ jsx("button", {
 		type: "button",
@@ -94,7 +97,7 @@ function HeaderEditButton({ to, onClick, label = "Edit", disabled, tooltip }) {
 		title: tooltip ? void 0 : label,
 		className: cx(headerActionButtonClasses, disabled && "opacity-50 cursor-not-allowed hover:bg-transparent"),
 		...tooltipProps,
-		children: /* @__PURE__ */ jsx(EditIcon, { className: "w-3 h-3" })
+		children: /* @__PURE__ */ jsx(FaEdit, { className: "w-3 h-3" })
 	});
 }
 /** Renders nothing when the modern breadcrumb strip isn't mounted (classic chrome or self-headered pages). */
@@ -162,7 +165,7 @@ function PageHeader({ breadcrumbs, title, titleAction, actions, toolbar, classNa
 					}) : /* @__PURE__ */ jsx("span", {
 						className: "text-(--theme-muted-text-color) whitespace-nowrap",
 						children: crumb.label
-					}), /* @__PURE__ */ jsx(ChevronRightIcon, { className: "w-3 h-3 opacity-60 shrink-0 text-(--theme-muted-text-color)" })] }, key);
+					}), /* @__PURE__ */ jsx(LuChevronRight, { className: "w-3 h-3 opacity-60 shrink-0 text-(--theme-muted-text-color)" })] }, key);
 				})
 			}),
 			titleAction,

package/dist/components/Sort.js

@@ -1,13 +1,15 @@
 import { useStrings } from "./Provider.js";
-import { SortDownIcon, SortUnsortedIcon, SortUpIcon } from "../icons.js";
+import { TiArrowSortedDown } from "../icons/ti/TiArrowSortedDown.js";
+import { TiArrowSortedUp } from "../icons/ti/TiArrowSortedUp.js";
+import { TiArrowUnsorted } from "../icons/ti/TiArrowUnsorted.js";
 import { jsx } from "react/jsx-runtime";
 //#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 });
+		if (currentDirection === "ascending") return /* @__PURE__ */ jsx(TiArrowSortedDown, { style });
+		else if (currentDirection === "descending") return /* @__PURE__ */ jsx(TiArrowSortedUp, { style });
+	} else return /* @__PURE__ */ jsx(TiArrowUnsorted, { style });
 	return null;
 };
 function Sort({ currentlySorted, name, setCurrentDirection, setCurrentlySorted, currentDirection }) {

package/dist/components/StatusIcons.d.ts

@@ -0,0 +1,11 @@
+import type { IconBaseProps } from 'react-icons';
+interface IBaseCheckmarkProps {
+    className?: string;
+    colored?: boolean;
+}
+export declare function SuccessCheckmark({ className, colored }: IBaseCheckmarkProps): import("react").JSX.Element;
+export declare function ErrorCheckmark({ className, colored }: IBaseCheckmarkProps): import("react").JSX.Element;
+export declare function LoaderIcon({ className, ...props }: IconBaseProps & {
+    className?: string;
+}): import("react").JSX.Element;
+export {};

package/dist/components/StatusIcons.js

@@ -0,0 +1,20 @@
+import { BiError } from "../icons/bi/BiError.js";
+import { HiMiniCheckCircle } from "../icons/hi2/HiMiniCheckCircle.js";
+import { FaCircleNotch } from "../icons/fa/FaCircleNotch.js";
+import cx from "classnames";
+import { jsx } from "react/jsx-runtime";
+//#region src/components/StatusIcons.tsx
+function SuccessCheckmark({ className, colored = true }) {
+	return /* @__PURE__ */ jsx(HiMiniCheckCircle, { className: cx(colored && "text-green-500", className) });
+}
+function ErrorCheckmark({ className, colored = true }) {
+	return /* @__PURE__ */ jsx(BiError, { className: cx(colored && "text-red-400", className) });
+}
+function LoaderIcon({ className, ...props }) {
+	return /* @__PURE__ */ jsx(FaCircleNotch, {
+		className: cx("animate-spin", className),
+		...props
+	});
+}
+//#endregion
+export { ErrorCheckmark, LoaderIcon, SuccessCheckmark };

package/dist/components/Tooltip.js

@@ -1,4 +1,4 @@
-import { TooltipIcon } from "../icons.js";
+import { HiQuestionMarkCircle } from "../icons/hi/HiQuestionMarkCircle.js";
 import { keyedByContent } from "./keys.js";
 import { Fragment } from "react";
 import { jsx, jsxs } from "react/jsx-runtime";
@@ -84,14 +84,14 @@ function TooltipInfo({ text, className = "", children, place = "top", tabIndex }
 	if (children || !text) return /* @__PURE__ */ jsx("div", {
 		...anchorProps,
 		tabIndex,
-		children: children || /* @__PURE__ */ jsx(TooltipIcon, { className: "tooltip" })
+		children: children || /* @__PURE__ */ jsx(HiQuestionMarkCircle, { className: "tooltip" })
 	});
 	return /* @__PURE__ */ jsx("div", {
 		...anchorProps,
 		role: "img",
 		"aria-label": text,
 		tabIndex: tabIndex ?? 0,
-		children: /* @__PURE__ */ jsx(TooltipIcon, { className: "tooltip" })
+		children: /* @__PURE__ */ jsx(HiQuestionMarkCircle, { className: "tooltip" })
 	});
 }
 //#endregion

package/dist/components/dropdownUtils.js

@@ -1,4 +1,4 @@
-import { CaretDownIcon } from "../icons.js";
+import { FaCaretDown } from "../icons/fa/FaCaretDown.js";
 import { jsx } from "react/jsx-runtime";
 //#region src/components/dropdownUtils.tsx
 function isCategory(option) {
@@ -93,7 +93,7 @@ function flattenDisplayOptions({ options, query, expandedCategories, collapsedLa
 	return flatOptions;
 }
 function DropdownCaret() {
-	return /* @__PURE__ */ jsx(CaretDownIcon, { className: "text-neutral-400 absolute top-1/2 -translate-y-1/2 right-0 mr-3 inset-y-0 flex items-center rounded-r-md focus:outline-hidden" });
+	return /* @__PURE__ */ jsx(FaCaretDown, { className: "text-neutral-400 absolute top-1/2 -translate-y-1/2 right-0 mr-3 inset-y-0 flex items-center rounded-r-md focus:outline-hidden" });
 }
 //#endregion
 export { DropdownCaret, filterOption, flattenDisplayOptions, flattenOptions, isCategory, isOption, toggleSetMember };

package/dist/editor/FormCodePanel.js

@@ -1,5 +1,8 @@
 import { useNotify, useStrings, useWorkflowEngine } from "../components/Provider.js";
-import { CheckIcon, CopyIcon, EyeIcon, EyeOffIcon } from "../icons.js";
+import { FaCheck } from "../icons/fa/FaCheck.js";
+import { FiCopy } from "../icons/fi/FiCopy.js";
+import { LuEye } from "../icons/lu/LuEye.js";
+import { LuEyeOff } from "../icons/lu/LuEyeOff.js";
 import SwitchToggleSmall from "../components/SwitchToggleSmall.js";
 import Editor from "./Editor.js";
 import { flattenGroups, impureSetValueFromPath } from "../form/lib.js";
@@ -114,14 +117,14 @@ function FormCodePanel({ formJSON, data, mutate, height = "600px", disabled = fa
 						onClick: () => setShowHidden((prev) => !prev)
 					}), /* @__PURE__ */ jsxs("span", {
 						className: "flex items-center gap-1.5",
-						children: [showHidden ? /* @__PURE__ */ jsx(EyeIcon, {}) : /* @__PURE__ */ jsx(EyeOffIcon, {}), t.showHiddenFields]
+						children: [showHidden ? /* @__PURE__ */ jsx(LuEye, {}) : /* @__PURE__ */ jsx(LuEyeOff, {}), t.showHiddenFields]
 					})]
 				}), /* @__PURE__ */ jsxs("button", {
 					type: "button",
 					onClick: handleCopy,
 					"aria-label": copied ? t.copied : t.copy,
 					className: "ml-auto flex shrink-0 items-center gap-1.5 rounded-md border border-(--theme-border) px-2.5 py-1.5 text-sm text-(--theme-app) transition-colors duration-150 hover:bg-(--theme-hover) focus:outline-none focus-visible:ring-2 focus-visible:ring-(--theme-link)",
-					children: [copied ? /* @__PURE__ */ jsx(CheckIcon, { className: "text-green-500" }) : /* @__PURE__ */ jsx(CopyIcon, { className: "text-(--theme-muted-text-color)" }), copied ? t.copied : t.copy]
+					children: [copied ? /* @__PURE__ */ jsx(FaCheck, { className: "text-green-500" }) : /* @__PURE__ */ jsx(FiCopy, { className: "text-(--theme-muted-text-color)" }), copied ? t.copied : t.copy]
 				})]
 			}), /* @__PURE__ */ jsx("div", {
 				className: "min-h-0 flex-1",