@parallelworks/ui 0.1.0 → 0.3.0

package/dist/chunks/lib-DTgL8klR.js

@@ -0,0 +1,191 @@
+import cx from "classnames";
+import { jsx, jsxs } from "react/jsx-runtime";
+//#region src/form/FieldWrapper.tsx
+function FieldWrapper({ label, tooltipComponent, description, labelPosition = "left", spaceCompact = false, optional = false, children }) {
+	return /* @__PURE__ */ jsxs("div", {
+		className: cx("flex w-full", labelPosition === "left" ? "items-start" : "items-left flex-col"),
+		children: [/* @__PURE__ */ jsxs("div", {
+			className: cx("relative", labelPosition === "left" ? "form-label" : "form-label-top", spaceCompact && "form-label-compact"),
+			children: [
+				label,
+				!optional && /* @__PURE__ */ jsx("span", { children: "*" }),
+				tooltipComponent
+			]
+		}), /* @__PURE__ */ jsxs("div", {
+			className: "w-full",
+			children: [children, description && /* @__PURE__ */ jsx("div", {
+				className: "text-xs theme-muted-text mt-1 leading-relaxed",
+				children: description
+			})]
+		})]
+	});
+}
+//#endregion
+//#region src/form/utils/secondaryField.ts
+function findSecondaryOption(options, value) {
+	for (const candidate of options) {
+		if (!candidate || typeof candidate !== "object") continue;
+		const option = candidate;
+		if (option.value === value) return option;
+		if (Array.isArray(option.options)) {
+			const nestedOption = findSecondaryOption(option.options, value);
+			if (nestedOption) return nestedOption;
+		}
+	}
+}
+function applySecondaryField(secondaryField, secondaryValue, setFieldValue) {
+	if (secondaryField === void 0 || secondaryValue === void 0) return;
+	const fields = Array.isArray(secondaryField) ? secondaryField : [secondaryField];
+	const values = Array.isArray(secondaryValue) ? secondaryValue : [secondaryValue];
+	fields.forEach((field, index) => {
+		setFieldValue(field, values[index]);
+	});
+}
+//#endregion
+//#region src/form/lib.ts
+/**
+* Drops a schema flag the expression parser could not resolve. workflow.schema.json types
+* `optional`/`hidden`/`ignore` as ["string", "boolean"], so a flag whose expression depends
+* on something unavailable at form-render time (a list `[index]` outside a row, `needs.`,
+* `env.`, a secret `var.`) arrives as the raw `${{…}}` string. That string is truthy, which
+* inverts each flag's documented `false` default. Returning undefined lets the caller apply
+* that default instead of reading an expression it never evaluated as "yes".
+*/
+function resolvedFlag(value) {
+	return typeof value === "string" && value.includes("${{") ? void 0 : value;
+}
+function enforceOneMustBeTrue(items, options, promoteIndex) {
+	if (items.length === 0) return items;
+	const clampedIndex = Math.max(0, Math.min(promoteIndex, items.length - 1));
+	const oneMustBeTrueFields = Object.keys(options).filter((key) => typeof options[key] === "object" && options[key] !== null && "one_must_be_true" in options[key] && options[key].one_must_be_true);
+	for (const fieldKey of oneMustBeTrueFields) {
+		const fieldSchema = options[fieldKey];
+		if (typeof fieldSchema === "object" && fieldSchema && "options" in fieldSchema) {
+			const opts = fieldSchema.options;
+			const trueOption = typeof opts === "object" && opts && !Array.isArray(opts) && "onOption" in opts ? opts.onOption || true : true;
+			if (!items.some((item) => item[fieldKey] === trueOption)) items[clampedIndex][fieldKey] = trueOption;
+		}
+	}
+	return items;
+}
+function flattenGroups(schema) {
+	if (!schema) return {};
+	let flattenedFields = {};
+	Object.keys(schema).forEach((key) => {
+		if (schema[key].type === "group") {
+			const flattenedGroup = flattenGroups(schema[key].options);
+			flattenedFields = {
+				...flattenedFields,
+				...flattenedGroup
+			};
+		} else if (schema[key].type === "object") {
+			const flattenedGroup = flattenGroups(schema[key].options);
+			flattenedFields = {
+				...flattenedFields,
+				[key]: flattenedGroup
+			};
+		} else flattenedFields[key] = schema[key];
+	});
+	return flattenedFields;
+}
+/**Not a pure function. Edits 'obj' passed into function */
+function impureSetValueFromPath(obj, path, value) {
+	const pathArray = path.split(".");
+	if (pathArray.length === 1) {
+		obj[pathArray[0]] = value;
+		return;
+	}
+	let current = obj;
+	for (let i = 0; i < pathArray.length - 1; i++) {
+		const segment = pathArray[i];
+		const arrayMatch = segment.match(/^(.+)\[(\d+)\]$/);
+		if (arrayMatch) {
+			const key = arrayMatch[1];
+			const index = Number(arrayMatch[2]);
+			if (!current[key]) current[key] = [];
+			if (!current[key][index]) current[key][index] = {};
+			current = current[key][index];
+		} else {
+			if (!current[segment]) current[segment] = {};
+			current = current[segment];
+		}
+	}
+	current[pathArray[pathArray.length - 1]] = value;
+}
+function initializeValues(options, srcData = {}, ignoreDefaultStrings = false) {
+	if (!options) return;
+	const data = structuredClone(srcData);
+	return Object.keys(options).reduce((acc, field) => {
+		if (field.startsWith("$")) return acc;
+		if (options[field].type === "group") {
+			const values = initializeValues(options[field].options, data);
+			if (!values) return acc;
+			Object.keys(values).forEach((key) => {
+				acc[key] = data[key] ?? values[key];
+			});
+			return acc;
+		}
+		if (options[field].type === "step") {
+			if (options.$meta?.wizard?.flatten !== false) {
+				const values = initializeValues(options[field].options, data);
+				if (!values) return acc;
+				Object.keys(values).forEach((key) => {
+					acc[key] = data[key] ?? values[key];
+				});
+			} else acc[field] = initializeValues(options[field].options, data[field] || {});
+			return acc;
+		}
+		if (options[field].type === "object") {
+			acc[field] = initializeValues(options[field].options, data[field] || {});
+			return acc;
+		}
+		if (options[field].type === "list") {
+			if (options[field].options === "string") {
+				acc[field] = Array.isArray(data[field]) ? [...data[field]] : [];
+				return acc;
+			}
+			const arr = [];
+			if (data[field]) for (let i = 0; i < data[field].length; i++) arr.push(initializeValues(options[field].options, data[field][i] || {}));
+			acc[field] = arr;
+			return acc;
+		}
+		if (data[field] !== void 0) {
+			acc[field] = data[field];
+			if ((options[field].type === "dropdown" || options[field].type === "storage") && options[field].secondaryField && options[field].options && Array.isArray(options[field].options)) {
+				const option = findSecondaryOption(options[field].options, data[field]);
+				applySecondaryField(options[field].secondaryField, option?.secondaryValue, (secondaryField, secondaryValue) => {
+					if (!(options[field].type === "storage" && Object.prototype.hasOwnProperty.call(options, secondaryField) && srcData[secondaryField] !== void 0)) impureSetValueFromPath(acc, secondaryField, secondaryValue);
+				});
+			}
+			return acc;
+		}
+		if (options[field].type === "label") return acc;
+		if (options[field].optional && options[field].default === void 0) return acc;
+		acc[field] = "";
+		if (options[field].autoselect) acc[field] = void 0;
+		if (options[field].type === "boolean") if (options[field].options?.offOption && options[field].options?.onOption) acc[field] = options[field].options.offOption;
+		else acc[field] = false;
+		if (options[field].type === "dropdown") {
+			if (options[field].options && Array.isArray(options[field].options) && options[field].options.length > 0) acc[field] = options[field].options[0].value;
+			if (options[field].type === "dropdown" && options[field].secondaryField && options[field].options && Array.isArray(options[field].options)) {
+				const option = options[field].options.find((option) => option.value === data[field]);
+				const secondaryField = Array.isArray(options[field].secondaryField) ? options[field].secondaryField : [options[field].secondaryField];
+				const secondaryValue = Array.isArray(option?.secondaryValue) ? option?.secondaryValue : [option?.secondaryValue];
+				secondaryField.forEach((field, index) => {
+					impureSetValueFromPath(data, field, secondaryValue[index]);
+					impureSetValueFromPath(acc, field, secondaryValue[index]);
+				});
+			}
+		}
+		if (options[field].type === "multi-dropdown" || options[field].type === "checkbox-group") acc[field] = [];
+		if (options[field].default !== void 0) {
+			const dflt = options[field].default;
+			const isPwResource = typeof dflt === "string" && dflt.startsWith("pw://");
+			acc[field] = options[field].type === "string" || ignoreDefaultStrings && !isPwResource && (options[field].type === "textarea" || options[field].type === "compute-clusters" || options[field].type === "compute-resources") ? "" : dflt;
+		}
+		if (options[field].prefillDefault && options[field].default !== void 0) acc[field] = options[field].default;
+		return acc;
+	}, data);
+}
+//#endregion
+export { resolvedFlag as a, FieldWrapper as c, initializeValues as i, flattenGroups as n, applySecondaryField as o, impureSetValueFromPath as r, findSecondaryOption as s, enforceOneMustBeTrue as t };

package/dist/chunks/list-7PyDF1tz.js

@@ -0,0 +1,465 @@
+import { CheckIcon, ChevronRightIcon, ClipboardIcon, CopyIcon, ErrorIcon, IdCardIcon, KeyIcon, LinkIcon, MailIcon, MoreIcon, UserIcon } from "../icons.js";
+import { c as useStrings, i as useNotify, n as useLink } from "./Provider-DvVvScTQ.js";
+import { n as Table } from "./Table-C5z6qWjM.js";
+import cx from "classnames";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+import { useCallback, useEffect, useLayoutEffect, useRef, useState } from "react";
+import { createPortal } from "react-dom";
+//#region src/list/RowContextMenu.tsx
+/** Converts a single row action to a menu item: a `to` makes it a link, otherwise an action. */
+function toRowMenuItem(action) {
+	if (action.to) return {
+		kind: "link",
+		label: action.label,
+		icon: action.icon,
+		to: action.to,
+		destructive: action.destructive
+	};
+	return {
+		kind: "action",
+		label: action.label,
+		icon: action.icon,
+		onSelect: action.onSelect ?? (() => {}),
+		disabled: action.disabled,
+		destructive: action.destructive
+	};
+}
+/** Bridges a toolbar action (icon component, `onClick`/`href`) onto the shared
+* `RowAction` shape. Typed structurally so any toolbar action shape matching
+* these fields is assignable. */
+function toolbarActionToRowAction(action) {
+	const Icon = action.icon;
+	return {
+		key: action.key,
+		label: action.label,
+		icon: /* @__PURE__ */ jsx(Icon, {}),
+		onSelect: action.onClick,
+		to: action.href,
+		disabled: action.disabled,
+		destructive: action.key === "delete" || action.key === "destroy"
+	};
+}
+/** Assembles a row's context menu in the shared order: leading link(s) → middle
+* actions → extra items → Copy submenu → trailing (destructive) actions last. */
+function assembleRowMenu({ lead = [], actions, exclude, order, trailing = ["delete"], extra = [], copy }) {
+	const trailingSet = new Set(trailing);
+	const excludeSet = new Set(exclude);
+	let middle = actions.filter((a) => !trailingSet.has(a.key) && !excludeSet.has(a.key));
+	if (order) {
+		const byKey = new Map(middle.map((a) => [a.key, a]));
+		middle = order.map((key) => byKey.get(key)).filter((a) => a !== void 0);
+	}
+	const trailingItems = trailing.map((key) => actions.find((a) => a.key === key)).filter((a) => a !== void 0);
+	return [
+		...lead,
+		...middle.map(toRowMenuItem),
+		...extra,
+		...copy ? [copy] : [],
+		...trailingItems.map(toRowMenuItem)
+	];
+}
+function useRowMenu() {
+	const [menu, setMenu] = useState(null);
+	const onCloseRef = useRef(void 0);
+	return {
+		openMenu: useCallback((x, y, items, onClose) => {
+			if (items.length > 0) {
+				onCloseRef.current?.();
+				onCloseRef.current = onClose;
+				setMenu({
+					x,
+					y,
+					items
+				});
+			}
+		}, []),
+		contextMenu: /* @__PURE__ */ jsx(RowContextMenu, {
+			state: menu,
+			onClose: useCallback(() => {
+				onCloseRef.current?.();
+				onCloseRef.current = void 0;
+				setMenu(null);
+			}, [])
+		})
+	};
+}
+/** The full-screen menu overlay drops CSS :hover on the triggering row; wrap openMenu here to substitute a JS-driven `active` highlight. */
+function useRowMenuActive(openMenu) {
+	const [active, setActive] = useState(false);
+	return {
+		active,
+		openMenu: useCallback((x, y, items) => {
+			setActive(true);
+			openMenu(x, y, items, () => setActive(false));
+		}, [openMenu])
+	};
+}
+function rowContextMenuProps(openMenu, items) {
+	return { onContextMenu: (e) => {
+		e.preventDefault();
+		if (items.length > 0) e.stopPropagation();
+		openMenu(e.clientX, e.clientY, items);
+	} };
+}
+function RowContextMenu({ state, onClose }) {
+	const ref = useRef(null);
+	const [pos, setPos] = useState(null);
+	useLayoutEffect(() => {
+		if (!state || !ref.current) {
+			setPos(null);
+			return;
+		}
+		const { width, height } = ref.current.getBoundingClientRect();
+		const pad = 8;
+		const top = height > window.innerHeight - pad - state.y && state.y - height - pad >= 0 ? state.y - height : Math.min(state.y, window.innerHeight - height - pad);
+		setPos({
+			left: Math.max(pad, Math.min(state.x, window.innerWidth - width - pad)),
+			top: Math.max(pad, top)
+		});
+	}, [state]);
+	useEffect(() => {
+		if (!state) return;
+		const close = () => onClose();
+		const onKey = (e) => {
+			if (e.key === "Escape") onClose();
+		};
+		window.addEventListener("scroll", close, true);
+		window.addEventListener("resize", close);
+		window.addEventListener("keydown", onKey);
+		return () => {
+			window.removeEventListener("scroll", close, true);
+			window.removeEventListener("resize", close);
+			window.removeEventListener("keydown", onKey);
+		};
+	}, [state, onClose]);
+	if (!state) return null;
+	const side = (pos?.left ?? state.x) > window.innerWidth * .6 ? "left" : "right";
+	return createPortal(/* @__PURE__ */ jsx("div", {
+		className: "fixed inset-0 z-50",
+		onClick: onClose,
+		onContextMenu: (e) => {
+			e.preventDefault();
+			if (ref.current?.contains(e.target)) {
+				onClose();
+				return;
+			}
+			const { clientX, clientY } = e;
+			const overlay = e.currentTarget;
+			overlay.style.pointerEvents = "none";
+			const under = document.elementFromPoint(clientX, clientY);
+			overlay.style.pointerEvents = "";
+			onClose();
+			under?.dispatchEvent(new MouseEvent("contextmenu", {
+				bubbles: true,
+				cancelable: true,
+				clientX,
+				clientY
+			}));
+		},
+		children: /* @__PURE__ */ jsx("div", {
+			ref,
+			role: "menu",
+			className: "absolute min-w-44 rounded-lg border border-(--theme-border) bg-(--theme-panel-bg) py-1 shadow-lg backdrop-blur-xl",
+			style: {
+				left: pos?.left ?? state.x,
+				top: pos?.top ?? state.y,
+				visibility: pos ? "visible" : "hidden"
+			},
+			onClick: (e) => e.stopPropagation(),
+			children: /* @__PURE__ */ jsx(MenuItemList, {
+				items: state.items,
+				onClose,
+				side
+			})
+		})
+	}), document.body);
+}
+var MENU_ITEM_CLASSES = "flex w-full items-center gap-2.5 px-3 py-1.5 text-left text-[13px] hover:bg-(--theme-muted-panel-bg) transition-colors cursor-pointer [&>svg]:h-4 [&>svg]:w-4 [&>svg]:shrink-0";
+function MenuItemList({ items, onClose, side }) {
+	return items.map((item, i) => item.kind === "divider" ? /* @__PURE__ */ jsx("div", {
+		"aria-hidden": "true",
+		className: "my-1 h-px bg-(--theme-border)"
+	}, `divider-${i}`) : /* @__PURE__ */ jsx(MenuRow, {
+		item,
+		onClose,
+		side
+	}, `${item.label}-${i}`));
+}
+function MenuRow({ item, onClose, side }) {
+	const Link = useLink();
+	const notify = useNotify();
+	const { list: t } = useStrings();
+	const [openSub, setOpenSub] = useState(false);
+	const closeTimer = useRef(void 0);
+	if (item.kind === "submenu") {
+		const open = () => {
+			clearTimeout(closeTimer.current);
+			setOpenSub(true);
+		};
+		const close = () => {
+			closeTimer.current = setTimeout(() => setOpenSub(false), 160);
+		};
+		return /* @__PURE__ */ jsxs("div", {
+			className: "relative",
+			onMouseEnter: open,
+			onMouseLeave: close,
+			children: [/* @__PURE__ */ jsxs("div", {
+				className: cx(MENU_ITEM_CLASSES, "justify-between text-(--theme-app)"),
+				children: [/* @__PURE__ */ jsxs("span", {
+					className: "flex items-center gap-2.5",
+					children: [item.icon, item.label]
+				}), /* @__PURE__ */ jsx(ChevronRightIcon, { className: "h-3 w-3 shrink-0 opacity-60" })]
+			}), openSub && /* @__PURE__ */ jsx("div", {
+				className: cx("absolute -top-1 z-10 min-w-44 rounded-lg border border-(--theme-border) bg-(--theme-panel-bg) py-1 shadow-lg", side === "left" ? "right-full" : "left-full"),
+				children: /* @__PURE__ */ jsx(MenuItemList, {
+					items: item.items,
+					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]
+	});
+	return /* @__PURE__ */ jsxs("button", {
+		type: "button",
+		disabled: item.disabled,
+		onClick: () => {
+			if (item.copy) {
+				const { text, label } = item.copy;
+				navigator.clipboard?.writeText(text).then(() => notify.success(t.copied(label)), () => notify.error(t.couldntCopy(label)));
+			}
+			item.onSelect?.();
+			onClose();
+		},
+		className: cx(MENU_ITEM_CLASSES, item.destructive ? "text-red-500" : "text-(--theme-app)", item.disabled && "opacity-40 cursor-not-allowed hover:bg-transparent"),
+		children: [
+			item.icon,
+			item.label,
+			item.selected && /* @__PURE__ */ jsx(CheckIcon, { className: "ml-auto opacity-80" })
+		]
+	});
+}
+/** 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
+	};
+}
+/** Stays visible while active (menu open) so it doesn't vanish behind the overlay. */
+function MoreButton({ onOpen, active, className }) {
+	const { list: t } = useStrings();
+	return /* @__PURE__ */ jsx("button", {
+		type: "button",
+		"aria-label": t.moreActions,
+		onClick: (e) => {
+			e.stopPropagation();
+			const r = e.currentTarget.getBoundingClientRect();
+			onOpen(r.right, r.bottom);
+		},
+		className: cx("rounded p-1 cursor-pointer text-(--theme-muted-text-color) transition-colors hover:bg-(--theme-muted-panel-bg) hover:text-(--theme-app) focus-visible:opacity-100", active ? "opacity-100" : "opacity-0 group-hover:opacity-100", className),
+		children: /* @__PURE__ */ jsx(MoreIcon, { className: "h-4 w-4" })
+	});
+}
+//#endregion
+//#region src/list/ListTable.tsx
+var NAME_TEXT = "font-medium text-[13px] leading-tight text-(--theme-app) truncate";
+var SUBTITLE_TEXT = "text-xs leading-tight text-(--theme-muted-text-color) truncate";
+/** table-auto + horizontal scroll; the name column has a min-width floor so it can't be crushed. */
+var listTableProps = {
+	borderless: true,
+	panel: false,
+	rounded: false,
+	theadClassName: "text-(--theme-muted-text-color)",
+	tbodyClassName: "divide-y border-b border-(--theme-border) divide-(--theme-border)",
+	className: "table-auto w-full [&_td:first-child]:pl-4 [&_th:first-child]:pl-4 [&_td:last-child]:pr-4 [&_th:last-child]:pr-4"
+};
+/** Widths come only from the header row, so a windowed body cannot shift the
+*  columns as different content scrolls into view. */
+var listTableFixedProps = {
+	...listTableProps,
+	className: listTableProps.className.replace("table-auto", "table-fixed")
+};
+function NameCell({ icon, name, subtitle, href }) {
+	const Link = useLink();
+	const inner = /* @__PURE__ */ jsxs(Fragment, { children: [icon, /* @__PURE__ */ jsxs("div", {
+		className: "min-w-0",
+		children: [/* @__PURE__ */ jsx("div", {
+			className: NAME_TEXT,
+			children: name
+		}), subtitle && /* @__PURE__ */ jsx("div", {
+			className: SUBTITLE_TEXT,
+			children: subtitle
+		})]
+	})] });
+	return /* @__PURE__ */ jsx(Table.Item, {
+		className: "py-2.5",
+		children: href ? /* @__PURE__ */ jsx(Link, {
+			to: href,
+			className: "flex items-center gap-2.5 min-w-0 cursor-pointer",
+			children: inner
+		}) : /* @__PURE__ */ jsx("div", {
+			className: "flex items-center gap-2.5 min-w-0",
+			children: inner
+		})
+	});
+}
+function GroupRow({ label, count, colSpan }) {
+	return /* @__PURE__ */ jsx("tr", { children: /* @__PURE__ */ jsxs("td", {
+		colSpan,
+		className: "bg-(--theme-muted-panel-bg) py-1.5 text-xs font-medium",
+		children: [
+			/* @__PURE__ */ jsx("span", {
+				className: "text-(--theme-app)",
+				children: label
+			}),
+			/* @__PURE__ */ jsx("span", {
+				className: "mx-1.5 opacity-50",
+				children: "·"
+			}),
+			/* @__PURE__ */ jsx("span", {
+				className: "text-(--theme-muted-text-color)",
+				children: count
+			})
+		]
+	}) });
+}
+function ListError({ error, noun = "data" }) {
+	const { list: t } = useStrings();
+	const message = error && typeof error === "object" && "message" in error ? String(error.message) : void 0;
+	return /* @__PURE__ */ jsxs("div", {
+		className: "flex flex-col items-center justify-center gap-3 py-20 text-center",
+		children: [/* @__PURE__ */ jsx(ErrorIcon, { className: "h-10 w-10 text-red-400 opacity-80" }), /* @__PURE__ */ jsxs("div", {
+			className: "space-y-1",
+			children: [/* @__PURE__ */ jsx("p", {
+				className: "text-sm font-medium text-(--theme-app)",
+				children: t.couldNotLoad(noun)
+			}), message && /* @__PURE__ */ jsx("p", {
+				className: "max-w-md text-xs text-(--theme-muted-text-color)",
+				children: message
+			})]
+		})]
+	});
+}
+function ListSkeleton({ rows = 6 }) {
+	return /* @__PURE__ */ jsx("div", {
+		className: "divide-y border-b border-(--theme-border) divide-(--theme-border)",
+		children: Array.from({ length: rows }).map((_, i) => /* @__PURE__ */ jsxs("div", {
+			className: "flex items-center gap-3 px-4 py-2.5 animate-pulse",
+			children: [
+				/* @__PURE__ */ jsx("div", { className: "h-5 w-5 rounded bg-(--theme-muted-panel-bg)" }),
+				/* @__PURE__ */ jsxs("div", {
+					className: "space-y-1.5",
+					children: [/* @__PURE__ */ jsx("div", { className: "h-3 w-40 rounded bg-(--theme-muted-panel-bg)" }), /* @__PURE__ */ jsx("div", { className: "h-2.5 w-24 rounded bg-(--theme-muted-panel-bg)" })]
+				}),
+				/* @__PURE__ */ jsx("div", { className: "ml-auto h-3 w-20 rounded bg-(--theme-muted-panel-bg)" })
+			]
+		}, i))
+	});
+}
+/** Prevents the name column from being crushed under table-auto layout during horizontal overflow. */
+var NAME_MIN_WIDTH_PX = 200;
+/** Trailing cell geometry: icon-button size + gap + padding, sized to fit exactly its pinned buttons. */
+var ACTION_BUTTON_PX = 24;
+var ACTION_GAP_PX = 2;
+var ACTIONS_CELL_PAD_PX = 28;
+/** Width the trailing actions column reserves for `count` always-visible
+* buttons plus the hover `⋯` trigger. */
+function actionsColumnWidth(count) {
+	const buttons = count + 1;
+	return buttons * ACTION_BUTTON_PX + (buttons - 1) * ACTION_GAP_PX + ACTIONS_CELL_PAD_PX;
+}
+/** Shared leading selection checkbox for multi-select rows: stops the row-click
+* and suppresses shift-click text selection. Wrap in <Table.Item> for `leading`. */
+function RowSelectCheckbox({ checked, label, onToggle }) {
+	return /* @__PURE__ */ jsx("input", {
+		type: "checkbox",
+		"aria-label": label,
+		checked,
+		onChange: () => {},
+		onClick: (e) => {
+			e.stopPropagation();
+			onToggle(e);
+		},
+		onMouseDown: (e) => {
+			if (e.shiftKey) e.preventDefault();
+		},
+		className: "h-4 w-4 shrink-0 rounded border-(--theme-border) text-blue-500 focus:ring-blue-500 focus:ring-offset-0 cursor-pointer"
+	});
+}
+/** Sizes to fit pinned buttons + ⋯; below ~44rem only ⋯ remains. Pass a view's
+* chrome (structurally: showActions + actionsWidth) or actionCount. */
+function ListActionsHeader({ view, actionCount = 0, className }) {
+	if (view && !view.showActions) return null;
+	const width = view ? view.actionsWidth : actionsColumnWidth(actionCount);
+	return /* @__PURE__ */ jsx(Table.Header, {
+		caps: false,
+		style: {
+			width,
+			minWidth: width
+		},
+		className: cx("py-2 text-right @max-[43rem]:w-[52px]! @max-[43rem]:min-w-[52px]!", className),
+		children: /* @__PURE__ */ jsx("span", {
+			className: "sr-only",
+			children: "Actions"
+		})
+	});
+}
+ListActionsHeader.isTableHeader = true;
+//#endregion
+export { useRowMenu as _, NAME_MIN_WIDTH_PX as a, actionsColumnWidth as c, MoreButton as d, assembleRowMenu as f, toolbarActionToRowAction as g, toRowMenuItem as h, ListSkeleton as i, listTableFixedProps as l, rowContextMenuProps as m, ListActionsHeader as n, NameCell as o, copySubmenu as p, ListError as r, RowSelectCheckbox as s, GroupRow as t, listTableProps as u, useRowMenuActive as v };

package/dist/components/CollapsiblePanel.d.ts

@@ -0,0 +1,27 @@
+import React from 'react';
+interface IControlledCollapsiblePanelProps {
+    title?: string | React.ReactNode | ((open: boolean, setOpen: React.Dispatch<React.SetStateAction<boolean>>) => React.ReactNode);
+    children: React.ReactNode;
+    open: boolean | undefined;
+    setOpen?: React.Dispatch<React.SetStateAction<boolean>>;
+    onClick?: () => void;
+    wrapperElement?: React.ElementType;
+    shown?: boolean;
+    setShown?: (shown: boolean) => void;
+    customizedButton?: React.ReactNode;
+    className?: string;
+}
+export declare function ControlledCollapsiblePanel({ title, children, open, setOpen, onClick, wrapperElement, customizedButton, className, }: IControlledCollapsiblePanelProps): React.JSX.Element;
+export declare function UncontrolledCollapsiblePanel({ title, children, onClick, wrapperElement, initialState, className, customizedButton, }: Omit<IControlledCollapsiblePanelProps, 'setOpen' | 'open'> & {
+    initialState?: boolean;
+}): React.JSX.Element;
+type MaybeCollapsibleProps = {
+    className?: string;
+    initialState?: boolean;
+    children: React.ReactNode;
+    title?: React.ReactNode;
+    customizedButton?: React.ReactNode;
+    collapsible?: boolean;
+};
+export declare function MaybeCollapsible({ className, initialState, children, title, customizedButton, collapsible, }: MaybeCollapsibleProps): React.JSX.Element;
+export {};