@parallelworks/ui 0.17.0 → 0.18.0

package/dist/chunks/{PageHeader-MxuOs9cH.js → PageHeader-l49p1nM9.js}

@@ -1,13 +1,65 @@
+import { i as useNotify, l as useSlots, n as useLink, u as useStrings } from "./Provider-Ghua9PkN.js";
 import { AddIcon, CheckIcon, ChevronRightIcon, ClipboardIcon, CopyIcon, EditIcon, IdCardIcon, KeyIcon, LinkIcon, MailIcon, MoreIcon, UserIcon } from "../icons.js";
-import { i as useNotify, l as useSlots, n as useLink, u as useStrings } from "./Provider-DHmZ3v9i.js";
-import { n as TOOLTIP_ID } from "./Tooltip-n9w7Tkt1.js";
+import { n as TOOLTIP_ID } from "./Tooltip-Crxo_eU_.js";
 import cx from "classnames";
-import { Fragment, jsx, jsxs } from "react/jsx-runtime";
-import React, { Fragment as Fragment$1, createContext, useCallback, useContext, useEffect, useLayoutEffect, useRef, useState } from "react";
+import React, { Fragment, createContext, useCallback, useContext, useEffect, useLayoutEffect, useRef, useState } from "react";
+import { Fragment as Fragment$1, jsx, jsxs } from "react/jsx-runtime";
 import { createPortal } from "react-dom";
 import { Menu, MenuButton, MenuItem, MenuItems } from "@headlessui/react";
+//#region src/components/Avatar.tsx
+var SIZE_CLASSES = {
+	sm: "w-6 h-6 text-xs",
+	md: "w-8 h-8 text-sm",
+	lg: "w-10 h-10 text-base",
+	xl: "w-12 h-12 text-lg",
+	"2xl": "w-16 h-16 text-xl"
+};
+var STATUS_CLASSES = {
+	online: "bg-green-500",
+	offline: "bg-(--theme-muted-text-color)",
+	busy: "bg-red-500",
+	away: "bg-yellow-500"
+};
+/** Up to two initials: the first and last word of a name split on spaces and dots. */
+function avatarInitials(name) {
+	const parts = (name ?? "").split(/[\s.]+/).filter(Boolean);
+	if (parts.length >= 2) return (parts[0][0] + parts[parts.length - 1][0]).toUpperCase();
+	return parts[0]?.[0]?.toUpperCase() || "?";
+}
+function Avatar({ src, name, size = "md", status, className }) {
+	const strings = useStrings();
+	const [erroredUrl, setErroredUrl] = useState(null);
+	const showImage = !!src && erroredUrl !== src;
+	return /* @__PURE__ */ jsxs("div", {
+		className: cx("relative inline-flex", className),
+		children: [showImage ? /* @__PURE__ */ jsx("img", {
+			src,
+			alt: name || strings.common.userAvatar,
+			onError: () => setErroredUrl(src),
+			className: cx("rounded-full object-cover", SIZE_CLASSES[size])
+		}) : /* @__PURE__ */ jsx("div", {
+			className: cx("rounded-full flex items-center justify-center font-medium", "bg-gradient-to-br from-[var(--gradient-start,var(--theme-element))] to-[var(--gradient-mid,var(--theme-link))] text-white", SIZE_CLASSES[size]),
+			children: avatarInitials(name)
+		}), status && /* @__PURE__ */ jsx("span", {
+			"data-testid": "online-indicator",
+			className: cx("absolute bottom-0 right-0 block rounded-full ring-2 ring-(--theme-app-bg)", STATUS_CLASSES[status], size === "sm" ? "w-1.5 h-1.5" : "w-2.5 h-2.5")
+		})]
+	});
+}
+//#endregion
 //#region src/components/AddMenu.tsx
 var addMenuItemClasses = "flex w-full items-center gap-2 px-3 py-1.5 text-[13px] text-(--theme-app) data-[focus]:bg-(--theme-muted-panel-bg) cursor-pointer";
+function itemButtonProps(item) {
+	if (!item.disabled) return { onClick: item.onSelect };
+	return {
+		"aria-disabled": true,
+		...item.hint ? {
+			"aria-label": `${item.label}. ${item.hint}`,
+			"data-tooltip-id": TOOLTIP_ID,
+			"data-tooltip-content": item.hint
+		} : {}
+	};
+}
 function AddMenu({ items, label, buttonClassName, zClassName = "z-50", children }) {
 	const Link = useLink();
 	return /* @__PURE__ */ jsxs(Menu, { children: [/* @__PURE__ */ jsx(MenuButton, {
@@ -18,17 +70,19 @@ function AddMenu({ items, label, buttonClassName, zClassName = "z-50", children
 	}), /* @__PURE__ */ jsx(MenuItems, {
 		anchor: "bottom start",
 		className: cx("mt-1 min-w-52 rounded-lg border border-(--theme-border) bg-(--theme-app-bg) py-1 shadow-lg focus:outline-none", zClassName),
-		children: items.map((item) => /* @__PURE__ */ jsxs(Fragment$1, { children: [item.separatorAbove && /* @__PURE__ */ jsx("div", { className: "my-1 border-t border-(--theme-border)" }), /* @__PURE__ */ jsx(MenuItem, { children: item.to && !item.disabled ? /* @__PURE__ */ jsxs(Link, {
-			to: item.to,
-			className: addMenuItemClasses,
-			children: [item.icon, item.label]
-		}) : /* @__PURE__ */ jsxs("button", {
-			type: "button",
-			onClick: item.onSelect,
-			disabled: item.disabled,
-			className: cx(addMenuItemClasses, item.disabled && "opacity-50 cursor-not-allowed"),
-			children: [item.icon, item.label]
-		}) })] }, item.label))
+		children: items.map((item) => /* @__PURE__ */ jsxs(Fragment, { children: [item.separatorAbove && /* @__PURE__ */ jsx("div", { className: "my-1 border-t border-(--theme-border)" }), /* @__PURE__ */ jsx(MenuItem, {
+			disabled: item.disabled ?? false,
+			children: item.to && !item.disabled ? /* @__PURE__ */ jsxs(Link, {
+				to: item.to,
+				className: addMenuItemClasses,
+				children: [item.icon, item.label]
+			}) : /* @__PURE__ */ jsxs("button", {
+				type: "button",
+				...itemButtonProps(item),
+				className: cx(addMenuItemClasses, item.disabled && "opacity-50 cursor-not-allowed"),
+				children: [item.icon, item.label]
+			})
+		})] }, item.label))
 	})] });
 }
 //#endregion
@@ -338,12 +392,21 @@ function MenuRow({ item, onClose, side }) {
 			})]
 		});
 	}
-	if (item.kind === "link") return /* @__PURE__ */ jsxs(Link, {
-		to: item.to,
-		onClick: onClose,
-		className: cx(MENU_ITEM_CLASSES, item.destructive ? "text-red-500" : "text-(--theme-app)"),
-		children: [item.icon, item.label]
-	});
+	if (item.kind === "link") {
+		const className = cx(MENU_ITEM_CLASSES, item.destructive ? "text-red-500" : "text-(--theme-app)");
+		if (item.reloadDocument) return /* @__PURE__ */ jsxs("a", {
+			href: item.to,
+			onClick: onClose,
+			className,
+			children: [item.icon, item.label]
+		});
+		return /* @__PURE__ */ jsxs(Link, {
+			to: item.to,
+			onClick: onClose,
+			className,
+			children: [item.icon, item.label]
+		});
+	}
 	return /* @__PURE__ */ jsxs("button", {
 		type: "button",
 		disabled: item.disabled && !item.tooltip,
@@ -369,62 +432,62 @@ function MenuRow({ item, onClose, side }) {
 		]
 	});
 }
-/** Builds the Copy submenu entries for whichever fields a row has, in stable
-* order. The menu itself performs the copy and notifies; `t` is an optional
-* host translator for the field labels (falls back to the provider defaults'
-* English). */
-function copySubmenu({ name, nameLabel, email, username, uid, id, url, extra, t }) {
-	const items = [
-		{
-			label: nameLabel ?? (t ? t("rowContextMenu.labelName") : "name"),
-			value: name,
-			icon: /* @__PURE__ */ jsx(CopyIcon, {})
-		},
-		{
-			label: t ? t("rowContextMenu.labelEmail") : "email",
-			value: email,
-			icon: /* @__PURE__ */ jsx(MailIcon, {})
-		},
-		{
-			label: t ? t("rowContextMenu.labelUsername") : "username",
-			value: username,
-			icon: /* @__PURE__ */ jsx(UserIcon, {})
-		},
-		{
-			label: t ? t("rowContextMenu.labelUid") : "UID",
-			value: uid === null || uid === void 0 ? null : String(uid),
-			icon: /* @__PURE__ */ jsx(KeyIcon, {})
-		},
-		{
-			label: t ? t("rowContextMenu.labelId") : "ID",
-			value: id,
-			icon: /* @__PURE__ */ jsx(IdCardIcon, {})
-		},
-		{
-			label: t ? t("rowContextMenu.labelUrl") : "URL",
-			value: url,
-			icon: /* @__PURE__ */ jsx(LinkIcon, {})
-		},
-		...(extra ?? []).map((e) => ({
-			label: e.label,
-			value: e.value,
-			icon: e.icon ?? /* @__PURE__ */ jsx(CopyIcon, {})
-		}))
-	].filter((f) => f.value).map((f) => ({
-		kind: "action",
-		label: t ? t("rowContextMenu.copy", { label: f.label }) : `Copy ${f.label}`,
-		icon: f.icon,
-		copy: {
-			text: f.value,
-			label: f.label
-		}
-	}));
-	return {
-		kind: "submenu",
-		label: t ? t("common.copy") : "Copy",
-		icon: /* @__PURE__ */ jsx(ClipboardIcon, {}),
-		items
-	};
+/** Returns a builder for the Copy submenu, labeled from the provider's strings. */
+function useCopySubmenu() {
+	const { list: t } = useStrings();
+	return useCallback(({ name, nameLabel, email, username, uid, id, url, extra }) => {
+		const items = [
+			{
+				label: nameLabel ?? t.labelName,
+				value: name,
+				icon: /* @__PURE__ */ jsx(CopyIcon, {})
+			},
+			{
+				label: t.labelEmail,
+				value: email,
+				icon: /* @__PURE__ */ jsx(MailIcon, {})
+			},
+			{
+				label: t.labelUsername,
+				value: username,
+				icon: /* @__PURE__ */ jsx(UserIcon, {})
+			},
+			{
+				label: t.labelUid,
+				value: uid === null || uid === void 0 ? null : String(uid),
+				icon: /* @__PURE__ */ jsx(KeyIcon, {})
+			},
+			{
+				label: t.labelId,
+				value: id,
+				icon: /* @__PURE__ */ jsx(IdCardIcon, {})
+			},
+			{
+				label: t.labelUrl,
+				value: url,
+				icon: /* @__PURE__ */ jsx(LinkIcon, {})
+			},
+			...(extra ?? []).map((e) => ({
+				label: e.label,
+				value: e.value,
+				icon: e.icon ?? /* @__PURE__ */ jsx(CopyIcon, {})
+			}))
+		].filter((f) => f.value).map((f) => ({
+			kind: "action",
+			label: t.copy(f.label),
+			icon: f.icon,
+			copy: {
+				text: f.value,
+				label: f.label
+			}
+		}));
+		return {
+			kind: "submenu",
+			label: t.copyMenu,
+			icon: /* @__PURE__ */ jsx(ClipboardIcon, {}),
+			items
+		};
+	}, [t]);
 }
 /** Stays visible while active (menu open) so it doesn't vanish behind the overlay. */
 function MoreButton({ onOpen, active, className }) {
@@ -451,7 +514,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, { 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(AddIcon, { className: "w-3 h-3" }), /* @__PURE__ */ jsx("span", { children: word === "create" ? common.create : common.add })] });
 	if (menu) return /* @__PURE__ */ jsx(AddMenu, {
 		items: menu,
 		label,
@@ -493,7 +556,7 @@ function HeaderActionMenu({ items, label = "Actions" }) {
 function HeaderRowMenu({ items, label = "Actions" }) {
 	const { openMenu, contextMenu } = useRowMenu();
 	if (items.length === 0) return null;
-	return /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsx("button", {
+	return /* @__PURE__ */ jsxs(Fragment$1, { children: [/* @__PURE__ */ jsx("button", {
 		type: "button",
 		"aria-label": label,
 		title: label,
@@ -548,7 +611,7 @@ function BreadcrumbsActionButton({ icon: Icon, label, ariaLabel, to, onClick, di
 		"data-tooltip-id": TOOLTIP_ID,
 		"data-tooltip-content": tooltip
 	} : {};
-	const content = /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsx(Icon, { className: "w-3 h-3" }), label] });
+	const content = /* @__PURE__ */ jsxs(Fragment$1, { children: [/* @__PURE__ */ jsx(Icon, { className: "w-3 h-3" }), label] });
 	if (to && !disabled) return /* @__PURE__ */ jsx(Link, {
 		to,
 		className: breadcrumbsActionClasses,
@@ -588,7 +651,7 @@ function PageHeader({ breadcrumbs, title, titleAction, actions, toolbar, classNa
 						className: "m-0 text-[13px] font-medium leading-none text-(--theme-app) truncate",
 						children: crumb.label
 					}, `${crumb.label}-${idx}`);
-					return /* @__PURE__ */ jsxs(Fragment$1, { children: [crumb.href ? /* @__PURE__ */ jsx(Link, {
+					return /* @__PURE__ */ jsxs(Fragment, { children: [crumb.href ? /* @__PURE__ */ jsx(Link, {
 						to: crumb.href,
 						className: "text-(--theme-muted-text-color) hover:text-(--theme-app) transition-colors cursor-pointer whitespace-nowrap",
 						children: crumb.label
@@ -624,4 +687,4 @@ function PageHeader({ breadcrumbs, title, titleAction, actions, toolbar, classNa
 	});
 }
 //#endregion
-export { useSetDefaultBreadcrumbs as C, useSetBreadcrumbs as S, useRowMenuActive as _, HeaderAddButton as a, useClearBreadcrumbs as b, PageHeader as c, assembleRowMenu as d, copySubmenu as f, useRowMenu as g, toolbarActionToRowAction as h, HeaderActionMenu as i, headerActionButtonClasses as l, toRowMenuItem as m, BreadcrumbsRightAction as n, HeaderEditButton as o, rowContextMenuProps as p, BreadcrumbsTitleAction as r, HeaderRowMenu as s, BreadcrumbsActionButton as t, MoreButton as u, BreadcrumbProvider as v, AddMenu as w, useHideBreadcrumbs as x, useBreadcrumb as y };
+export { useSetDefaultBreadcrumbs as C, avatarInitials as E, useSetBreadcrumbs as S, Avatar as T, useRowMenuActive as _, HeaderAddButton as a, useClearBreadcrumbs as b, PageHeader as c, assembleRowMenu as d, rowContextMenuProps as f, useRowMenu as g, useCopySubmenu as h, HeaderActionMenu as i, headerActionButtonClasses as l, toolbarActionToRowAction as m, BreadcrumbsRightAction as n, HeaderEditButton as o, toRowMenuItem as p, BreadcrumbsTitleAction as r, HeaderRowMenu as s, BreadcrumbsActionButton as t, MoreButton as u, BreadcrumbProvider as v, AddMenu as w, useHideBreadcrumbs as x, useBreadcrumb as y };

package/dist/chunks/{Provider-DHmZ3v9i.js → Provider-Ghua9PkN.js}

@@ -1,6 +1,6 @@
-import { Fragment, jsx, jsxs } from "react/jsx-runtime";
 import { createContext, useContext, useMemo } from "react";
 import { useLocalStorage } from "usehooks-ts";
+import { Fragment as Fragment$1, jsx, jsxs } from "react/jsx-runtime";
 //#region src/components/Provider.tsx
 var DefaultLink = ({ to, onClick, className, children, ...rest }) => /* @__PURE__ */ jsx("a", {
 	href: to,
@@ -58,7 +58,8 @@ var DEFAULTS = {
 			showHiddenFieldsHint: "Includes fields hidden by default because they're specific to each resource, such as name and group.",
 			jsonHasErrors: "JSON has errors, please fix before saving",
 			remove: "Remove",
-			sort: "Sort"
+			sort: "Sort",
+			userAvatar: "User avatar"
 		},
 		dropdown: {
 			select: (type) => `Select ${type}`,
@@ -332,6 +333,7 @@ var DEFAULTS = {
 			years: (n) => `${n}y`
 		},
 		list: {
+			copyMenu: "Copy",
 			copy: (label) => `Copy ${label}`,
 			copied: (label) => `Copied ${label}`,
 			couldntCopy: (label) => `Couldn't copy ${label}`,
@@ -367,7 +369,7 @@ var DEFAULTS = {
 			perPage: "Per page",
 			paginationPrevious: "Previous",
 			paginationNext: "Next",
-			paginationShowing: (name, start, end) => /* @__PURE__ */ jsxs(Fragment, { children: [
+			paginationShowing: (name, start, end) => /* @__PURE__ */ jsxs(Fragment$1, { children: [
 				"Showing ",
 				name,
 				" ",
@@ -382,7 +384,7 @@ var DEFAULTS = {
 					children: end
 				})
 			] }),
-			paginationShowingTimeRange: (name, startTime, endTime) => /* @__PURE__ */ jsxs(Fragment, { children: [
+			paginationShowingTimeRange: (name, startTime, endTime) => /* @__PURE__ */ jsxs(Fragment$1, { children: [
 				"Showing ",
 				name,
 				" from ",

package/dist/chunks/{SwitchToggle-BRQoEwLZ.js → SwitchToggle-CHPP8uZQ.js}

@@ -1,10 +1,10 @@
+import { u as useStrings } from "./Provider-Ghua9PkN.js";
 import { AngleDownIcon, AngleRightIcon, CaretDownIcon } from "../icons.js";
-import { u as useStrings } from "./Provider-DHmZ3v9i.js";
-import { a as truncationTooltipProps, n as TOOLTIP_ID } from "./Tooltip-n9w7Tkt1.js";
+import { a as truncationTooltipProps, n as TOOLTIP_ID } from "./Tooltip-Crxo_eU_.js";
 import { a as filterOption, c as isCategory, i as DropdownCaret, l as isOption, o as flattenDisplayOptions, s as flattenOptions, u as toggleSetMember } from "./StatusBadge-C1Blx_cW.js";
 import cx from "classnames";
-import { Fragment, jsx, jsxs } from "react/jsx-runtime";
 import React, { useCallback, useEffect, useMemo, useRef, useState } from "react";
+import { Fragment as Fragment$1, jsx, jsxs } from "react/jsx-runtime";
 import { createPortal } from "react-dom";
 import { Combobox, ComboboxButton, ComboboxInput, ComboboxOption, ComboboxOptions, Listbox, ListboxButton, ListboxOption, ListboxOptions, Switch, Transition } from "@headlessui/react";
 import deepEqual from "fast-deep-equal";
@@ -131,7 +131,7 @@ function ToggleOption({ option, category, expanded, onToggle, ...virtualRowProps
 		})
 	});
 }
-function DropdownHelper({ wrapperClassName = "w-full", className, textBoxClassName = "w-full", options = [], onChange, onActiveChange, value, id, ariaLabel, "aria-describedby": describedBy, required, disabled = false, placeholder = "", loading = false, allowCustomValue = false, customValueLabel = "Use", collapsedLabel = defaultCollapsedLabel, portalEl }) {
+function DropdownHelper({ wrapperClassName = "w-full", className, textBoxClassName = "w-full", options = [], onChange, onActiveChange, value, id, ariaLabel, "aria-describedby": describedBy, required, disabled = false, placeholder = "", loading = false, allowCustomValue = false, customValueLabel = "Use", collapsedLabel = defaultCollapsedLabel, portalEl, compact = false }) {
 	const DEBOUNCE_MS = 500;
 	const t = useStrings().dropdown;
 	const [query, setQuery] = useState("");
@@ -253,11 +253,11 @@ function DropdownHelper({ wrapperClassName = "w-full", className, textBoxClassNa
 		allowCustomValue,
 		customValueLabel
 	]);
-	const comboOptions = /* @__PURE__ */ jsx(Fragment, { children: /* @__PURE__ */ jsx(ComboboxOptions, {
+	const comboOptions = /* @__PURE__ */ jsx(Fragment$1, { children: /* @__PURE__ */ jsx(ComboboxOptions, {
 		modal: false,
 		ref: setPopperElement,
 		style: styles["popper"],
-		className: "bg-(--theme-input-bg) border-(--theme-border) text-(--theme-app) max-h-60! empty:invisible border overflow-auto rounded-md shadow-lg focus:outline-hidden sm:text-sm z-9999 data-[popper-reference-hidden=true]:invisible data-[popper-reference-hidden=true]:pointer-events-none",
+		className: cx("bg-(--theme-input-bg) border-(--theme-border) text-(--theme-app) max-h-60! empty:invisible border overflow-auto rounded-md shadow-lg focus:outline-hidden z-9999 data-[popper-reference-hidden=true]:invisible data-[popper-reference-hidden=true]:pointer-events-none", compact ? "text-xs" : "sm:text-sm"),
 		...attributes["popper"],
 		children: ({ option }) => {
 			const optionLabel = typeof option === "string" ? option : option.label;
@@ -274,7 +274,7 @@ function DropdownHelper({ wrapperClassName = "w-full", className, textBoxClassNa
 			return /* @__PURE__ */ jsx(ComboboxOption, {
 				"data-testid": "combobox-option",
 				value: option,
-				className: cx("w-full group relative flex", optionDescription ? "min-h-10 py-2" : "h-10", isCategoryRow ? "text-[14px] font-bold pl-1 items-center" : "data-disabled:text-(--theme-muted-text-color) data-disabled:bg-(--theme-muted-panel-bg) data-disabled:cursor-not-allowed cursor-pointer items-center pr-9 pl-3 leading-5 data-focus:bg-(--theme-muted-panel-bg) data-focus:text-(--theme-app) data-focus:outline-hidden", "data-selected:border-l-2 data-selected:border-(--theme-link) data-selected:bg-(--theme-muted-panel-bg) data-selected:text-(--theme-app)", isPinned && "border-t border-(--theme-border) font-medium"),
+				className: cx("w-full group relative flex", optionDescription ? "min-h-10 py-2" : compact ? "h-8" : "h-10", isCategoryRow ? "text-[14px] font-bold pl-1 items-center" : "data-disabled:text-(--theme-muted-text-color) data-disabled:bg-(--theme-muted-panel-bg) data-disabled:cursor-not-allowed cursor-pointer items-center pr-9 pl-3 leading-5 data-focus:bg-(--theme-muted-panel-bg) data-focus:text-(--theme-app) data-focus:outline-hidden", "data-selected:border-l-2 data-selected:border-(--theme-link) data-selected:bg-(--theme-muted-panel-bg) data-selected:text-(--theme-app)", isPinned && "border-t border-(--theme-border) font-medium"),
 				children: /* @__PURE__ */ jsx(OptionContent, {
 					label: optionLabel,
 					description: optionDescription,
@@ -302,7 +302,7 @@ function DropdownHelper({ wrapperClassName = "w-full", className, textBoxClassNa
 				disabled: (option) => Boolean(option.disabled)
 			},
 			disabled,
-			children: ({ activeOption, open }) => /* @__PURE__ */ jsxs(Fragment, { children: [
+			children: ({ activeOption, open }) => /* @__PURE__ */ jsxs(Fragment$1, { children: [
 				onActiveChange && /* @__PURE__ */ jsx(ActiveWatcher, {
 					active: activeOption,
 					onChange: onActiveChange
@@ -456,7 +456,7 @@ function CustomListbox({ options = [], handleOptionSelected, type, allowSearch =
 			leaveFrom: "opacity-100",
 			leaveTo: "opacity-0",
 			children: optionsElement || null
-		}) : /* @__PURE__ */ jsx(Fragment, { children: controlledOpen && optionsElement })]
+		}) : /* @__PURE__ */ jsx(Fragment$1, { children: controlledOpen && optionsElement })]
 	});
 }
 //#endregion
@@ -534,7 +534,7 @@ function MultiSelectDropdown({ options, value, onChange, id, "aria-labelledby":
 					children: loading ? /* @__PURE__ */ jsx("span", {
 						className: "theme-muted-text",
 						children: strings.loading
-					}) : selectedOptions.length > 0 ? /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsx("span", {
+					}) : selectedOptions.length > 0 ? /* @__PURE__ */ jsxs(Fragment$1, { children: [/* @__PURE__ */ jsx("span", {
 						className: "min-w-0 truncate",
 						children: display.label
 					}), display.overflow > 0 && /* @__PURE__ */ jsxs("span", {
@@ -630,7 +630,7 @@ function ControlledCollapsiblePanel({ title = "", children, open, setOpen, onCli
 	}, [setOpen, onClick]);
 	const contentId = React.useId();
 	const Wrapper = wrapperElement ? wrapperElement : React.Fragment;
-	return React.isValidElement(title) ? /* @__PURE__ */ jsxs(Fragment, { children: [title, /* @__PURE__ */ jsx(Wrapper, { children: /* @__PURE__ */ jsx(AnimateHeight, {
+	return React.isValidElement(title) ? /* @__PURE__ */ jsxs(Fragment$1, { children: [title, /* @__PURE__ */ jsx(Wrapper, { children: /* @__PURE__ */ jsx(AnimateHeight, {
 		duration: 300,
 		height: open ? "auto" : 0,
 		children

package/dist/chunks/{Table-C6JdFFiJ.js → Table-4OHjdKdO.js}

@@ -1,8 +1,8 @@
-import { u as useStrings } from "./Provider-DHmZ3v9i.js";
+import { u as useStrings } from "./Provider-Ghua9PkN.js";
 import { t as Loader } from "./Loader-BXoXTZGc.js";
 import cx from "classnames";
-import { jsx, jsxs } from "react/jsx-runtime";
 import React from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
 //#region src/components/Table.tsx
 function Item({ wrap = false, children, className, colspan = 1, ...tdProps }) {
 	const yPadding = className?.includes("py-") ? "" : "py-4";

package/dist/chunks/{Tooltip-n9w7Tkt1.js → Tooltip-Crxo_eU_.js}

@@ -1,6 +1,6 @@
 import { TooltipIcon } from "../icons.js";
+import { Fragment } from "react";
 import { jsx, jsxs } from "react/jsx-runtime";
-import { Fragment as Fragment$1 } from "react";
 import { Tooltip } from "react-tooltip";
 //#region src/components/Tooltip.tsx
 var TOOLTIP_ID = "global-tooltip";
@@ -39,12 +39,12 @@ function formatLine(line) {
 function formatTooltipContent(content) {
 	if (typeof content !== "string") return content || null;
 	if (!content) return null;
-	return content.split(/<br\s*\/?>|\n/i).map((line, idx) => /* @__PURE__ */ jsxs(Fragment$1, { children: [idx > 0 && /* @__PURE__ */ jsx("br", {}), formatLine(line)] }, idx));
+	return content.split(/<br\s*\/?>|\n/i).map((line, idx) => /* @__PURE__ */ jsxs(Fragment, { children: [idx > 0 && /* @__PURE__ */ jsx("br", {}), formatLine(line)] }, idx));
 }
 function KbdShortcut({ keys }) {
 	return /* @__PURE__ */ jsx("span", {
 		className: "inline-flex items-center gap-1 align-middle",
-		children: keys.split("+").map((part) => part.trim()).filter(Boolean).map((part, idx) => /* @__PURE__ */ jsxs(Fragment$1, { children: [idx > 0 && /* @__PURE__ */ jsx("span", {
+		children: keys.split("+").map((part) => part.trim()).filter(Boolean).map((part, idx) => /* @__PURE__ */ jsxs(Fragment, { children: [idx > 0 && /* @__PURE__ */ jsx("span", {
 			className: "opacity-60 text-[11px]",
 			children: "+"
 		}), /* @__PURE__ */ jsx("kbd", {

package/dist/chunks/{editor-mNznodJN.js → editor-9_uVtUyy.js}

@@ -1,15 +1,15 @@
+import { i as useNotify, u as useStrings } from "./Provider-Ghua9PkN.js";
 import { CheckIcon, CopyIcon, EyeIcon, EyeOffIcon } from "../icons.js";
-import { i as useNotify, u as useStrings } from "./Provider-DHmZ3v9i.js";
 import { t as Loader } from "./Loader-BXoXTZGc.js";
 import { t as SwitchToggleSmall } from "./SwitchToggleSmall-FcsaYSTs.js";
-import { c as FieldWrapper, n as flattenGroups, r as impureSetValueFromPath } from "./lib-CUTRDpa6.js";
+import { i as impureSetValueFromPath, r as flattenGroups, t as FieldWrapper } from "./FieldWrapper-Bef01EWO.js";
 import cx from "classnames";
-import { jsx, jsxs } from "react/jsx-runtime";
 import { Suspense, lazy, useId, useMemo, useRef, useState } from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
 import { convertToDynamicForm, parseStringsOfObj, parseStringsOfObjReady } from "@parallelworks/workflow-parser";
 import { useField, useFormikContext } from "formik";
 //#region src/editor/Editor.tsx
-var MonacoEditor = lazy(() => import("./Monaco-DVyIpyv4.js"));
+var MonacoEditor = lazy(() => import("./Monaco-C1POOdVv.js"));
 function Editor({ ...props }) {
 	return /* @__PURE__ */ jsx(Suspense, {
 		fallback: /* @__PURE__ */ jsx(Loader, { text: "Loading editor..." }),