@parallelworks/ui 0.12.0 → 0.13.0

package/dist/form/lib.d.ts

@@ -9,7 +9,7 @@ import type { DynamicFormSchema } from './types/fieldTypes.js';
  */
 export declare function resolvedFlag<T>(value: T): T | undefined;
 export declare function enforceOneMustBeTrue(items: Array<Record<string, unknown>>, options: DynamicFormSchema, promoteIndex: number): Array<Record<string, unknown>>;
-export declare function flattenGroups(schema: Record<string, any>): Record<string, any>;
+export declare function flattenGroups(schema: unknown): Record<string, unknown>;
 /**Not a pure function. Edits 'obj' passed into function */
-export declare function impureSetValueFromPath(obj: Record<string, any>, path: string, value: unknown): void;
-export declare function initializeValues(options: Record<string, any> | undefined, srcData?: Record<string, any>, ignoreDefaultStrings?: boolean): Record<string, any> | undefined;
+export declare function impureSetValueFromPath(obj: Record<string, unknown>, path: string, value: unknown): void;
+export declare function initializeValues(options: unknown, srcData?: object, ignoreDefaultStrings?: boolean): Record<string, unknown> | undefined;

package/dist/form/types/fieldComponentTypes.d.ts

@@ -18,9 +18,9 @@ export interface FieldComponentProps<TField extends FieldBase = FieldBase, TValu
     missingFields: string[];
     values: Record<string, unknown>;
     setFormDirty: TSetFormDirty;
-    onChange?: (val: unknown) => void;
+    onChange?: ((val: unknown) => void) | undefined;
     disabled: boolean;
-    computeOn?: boolean;
+    computeOn?: boolean | undefined;
     spaceCompact?: boolean;
     tooltipComponent?: React.ReactNode;
     workflowForm?: boolean;

package/dist/form/useParsedOpts.d.ts

@@ -2,4 +2,4 @@ import { type WorkflowVariables } from '@parallelworks/workflow-parser';
 /**
  * useMemo won't work here — Formik values changes on every keystroke, so this hook extracts which inputs.* keys the schema references and re-parses only when those change. Defaults `userVars`/`secretKeys` to empty — callers in React scope should pass them from `useUserVars()` so the parser leaves `${{ var.SECRET }}` literal during template eval (otherwise the recursive substitution turns `"https://${{ var.PAT }}@host/"` into `"https://@host/"`).
  */
-export declare function useParsedOpts(rawOptions: Record<string, any>, values: Record<string, any>, organizationVariables: WorkflowVariables | undefined, userVars?: Record<string, string>, secretKeys?: string[]): Record<string, any>;
+export declare function useParsedOpts<T extends object = Record<string, unknown>>(rawOptions: T, values: Record<string, unknown>, organizationVariables: WorkflowVariables | undefined, userVars?: Record<string, string>, secretKeys?: string[]): T;

package/dist/form/utils/getParentValue.d.ts

@@ -1 +1,3 @@
-export declare function getParentValue(index: number | undefined, targetField: any, values: object, dependentPath: string, field: any): unknown;
+export declare function getParentValue(index: number | undefined, targetField: unknown, values: object, dependentPath: string, field: {
+    depends_on?: string | undefined;
+}): unknown;

package/dist/form/utils/getValueUsingPath.d.ts

@@ -1 +1 @@
-export declare function getValueUsingPath(obj: Record<string, any>, path: string): any | undefined;
+export declare function getValueUsingPath(obj: unknown, path: string): unknown;

package/dist/form/utils/pwResolver.d.ts

@@ -1,9 +1,9 @@
 interface OptionWithValue {
     value: {
-        name?: string;
-        user?: string;
-        namespace?: string;
-        type?: string;
+        name?: string | undefined;
+        user?: string | undefined;
+        namespace?: string | undefined;
+        type?: string | null | undefined;
     } | undefined;
 }
 interface OptionCategory {

package/dist/icons.d.ts

@@ -1,4 +1,4 @@
-import type React from 'react';
+import type { IconBaseProps } from 'react-icons';
 import { BiError as ErrorIcon } from 'react-icons/bi';
 import { BsZoomIn as ChartZoomIcon, BsLayers as InfrastructureLayersIcon, BsCurrencyDollar as MoneyIcon } from 'react-icons/bs';
 import { FaInfoCircle as InfoIcon } from 'react-icons/fa';
@@ -32,8 +32,8 @@ interface IBaseCheckmarkProps {
     className?: string;
     colored?: boolean;
 }
-export declare function SuccessCheckmark({ className, colored, }: IBaseCheckmarkProps): React.JSX.Element;
-export declare function ErrorCheckmark({ className, colored, }: IBaseCheckmarkProps): React.JSX.Element;
-export declare function LoaderIcon({ className, ...props }: React.SVGProps<SVGSVGElement> & {
+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;
-}): React.JSX.Element;
+}): import("react").JSX.Element;

package/dist/index.d.ts

@@ -29,10 +29,11 @@ export { default as SwitchToggleSmall } from './components/SwitchToggleSmall.js'
 export { StatusBadge, StatusDot } from './components/StatusBadge.js';
 export { default as SwitchToggle } from './components/SwitchToggle.js';
 export { CompactTable, Table } from './components/Table.js';
-export { formatTooltipContent, GlobalTooltip, TOOLTIP_ID, TooltipInfo, } from './components/Tooltip.js';
+export { formatTooltipContent, GlobalTooltip, TOOLTIP_ID, TooltipInfo, truncationTooltipProps, } from './components/Tooltip.js';
 export { Button, MethodButton } from './components/Button.js';
 export { Card, CardHeader } from './components/Card.js';
 export { Input, Textarea } from './components/Input.js';
+export { RequiredMark } from './components/RequiredMark.js';
 export { inputClasses } from './components/inputClasses.js';
 export { IconButton } from './components/IconButton.js';
 export { Toggle } from './components/Toggle.js';
@@ -45,5 +46,5 @@ export { default as SettingsCard } from './components/SettingsCard.js';
 export { default as SettingsGroup } from './components/SettingsGroup.js';
 export { SettingRow, SettingSection } from './components/SettingRow.js';
 export { SettingModeOption } from './components/SettingModeOption.js';
-export { BreadcrumbProvider, useBreadcrumb, useClearBreadcrumbs, useHideBreadcrumbs, useSetBreadcrumbs, type IBreadcrumbItem, } from './components/Breadcrumbs.js';
+export { BreadcrumbProvider, useBreadcrumb, useClearBreadcrumbs, useHideBreadcrumbs, useSetBreadcrumbs, useSetDefaultBreadcrumbs, type IBreadcrumbItem, } from './components/Breadcrumbs.js';
 export { BreadcrumbsActionButton, BreadcrumbsRightAction, BreadcrumbsTitleAction, HeaderActionMenu, HeaderAddButton, HeaderEditButton, HeaderRowMenu, PageHeader, type PageHeaderBreadcrumb, type PageHeaderCrumb, } from './components/PageHeader.js';

package/dist/index.js

@@ -1,20 +1,21 @@
 import { DEFAULT_PRESET, THEME_PRESETS, THEME_TOKENS, applyTheme, contrastRatio, deriveTheme, isDarkColor } from "./theme/index.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-g6c-9-6N.js";
-import { a as useProvisionCorsRules, c as useStrings, i as useNotify, l as useWorkflowJsonResolver, n as useLink, o as useRunFile, r as useNavigation, s as useSlots, t as UIProvider } from "./chunks/Provider-CfFV-vc5.js";
-import { i as formatTooltipContent, n as TOOLTIP_ID, r as TooltipInfo, t as GlobalTooltip } from "./chunks/Tooltip-WgbiC_nd.js";
-import { c as isOption, i as filterOption, l as toggleSetMember, n as StatusDot, o as flattenOptions, r as DropdownCaret, s as isCategory, t as StatusBadge } from "./chunks/StatusBadge-P6C2tv7Z.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-DcPCXkqL.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-k_e1dI8c.js";
+import { a as useProvisionCorsRules, c as useStrings, i as useNotify, l as useWorkflowJsonResolver, n as useLink, o as useRunFile, r as useNavigation, s as useSlots, t as UIProvider } from "./chunks/Provider-CbFVFB7O.js";
+import { a as truncationTooltipProps, i as formatTooltipContent, n as TOOLTIP_ID, r as TooltipInfo, t as GlobalTooltip } from "./chunks/Tooltip-n9w7Tkt1.js";
+import { c as isOption, i as filterOption, l as toggleSetMember, n as StatusDot, o as flattenOptions, r as DropdownCaret, s as isCategory, t as StatusBadge } from "./chunks/StatusBadge-RRUI78iS.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-DbW0Q__L.js";
 import { t as Loader } from "./chunks/Loader-BXoXTZGc.js";
-import { n as modalPanelClasses, t as BareModal } from "./chunks/BareModal-DBa84JZO.js";
-import { S as AddMenu, _ as BreadcrumbProvider, a as HeaderAddButton, b as useHideBreadcrumbs, c as PageHeader, i as HeaderActionMenu, n as BreadcrumbsRightAction, o as HeaderEditButton, r as BreadcrumbsTitleAction, s as HeaderRowMenu, t as BreadcrumbsActionButton, v as useBreadcrumb, x as useSetBreadcrumbs, y as useClearBreadcrumbs } from "./chunks/PageHeader-dyoL44ue.js";
+import { n as modalPanelClasses, t as BareModal } from "./chunks/BareModal-BqroLbZ5.js";
+import { C as AddMenu, S as useSetDefaultBreadcrumbs, _ as BreadcrumbProvider, a as HeaderAddButton, b as useHideBreadcrumbs, c as PageHeader, i as HeaderActionMenu, n as BreadcrumbsRightAction, o as HeaderEditButton, r as BreadcrumbsTitleAction, s as HeaderRowMenu, t as BreadcrumbsActionButton, v as useBreadcrumb, x as useSetBreadcrumbs, y as useClearBreadcrumbs } from "./chunks/PageHeader-FhtphHGc.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-ByziK93x.js";
+import { n as Table, t as CompactTable } from "./chunks/Table-CutP1bRt.js";
+import { t as RequiredMark } from "./chunks/RequiredMark-DfLdYbYZ.js";
 import cx from "classnames";
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";
-import React, { forwardRef, useState } from "react";
+import React, { forwardRef, useId, useState } from "react";
 import Skeleton from "react-loading-skeleton";
 //#region src/components/DescriptionList.tsx
 function DescriptionListItem({ label, children, tooltip, className, ...props }) {
@@ -130,6 +131,7 @@ var Button = forwardRef(({ children, variant = "primary", size = "default", load
 	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,
@@ -180,6 +182,7 @@ function MethodButton({ icon, label, description, href, className = "", ...props
 		});
 	}
 	return /* @__PURE__ */ jsx("button", {
+		type: "button",
 		className: cx("group", baseClasses, className),
 		...props,
 		children: content
@@ -215,18 +218,22 @@ function CardHeader({ badge, title, description, className = "", align = "center
 }
 //#endregion
 //#region src/components/Input.tsx
-var Input = forwardRef(({ label, error, className = "", mono, type, ...props }, ref) => {
+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__ */ jsx("label", {
+			label && /* @__PURE__ */ jsxs("label", {
 				className: "text-[0.8125rem] font-medium text-[var(--theme-app)]",
-				htmlFor: props.id || props.name,
-				children: label
+				htmlFor: id,
+				children: [label, required && /* @__PURE__ */ jsx(RequiredMark, {})]
 			}),
 			/* @__PURE__ */ jsxs("div", {
 				className: isPassword ? "relative w-full" : "",
@@ -234,7 +241,11 @@ var Input = forwardRef(({ label, error, className = "", mono, type, ...props },
 					ref,
 					type: inputType,
 					className: inputClasses,
-					...props
+					...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)]",
@@ -245,6 +256,8 @@ var Input = forwardRef(({ label, error, className = "", mono, type, ...props },
 				})]
 			}),
 			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]
 			})
@@ -252,22 +265,32 @@ var Input = forwardRef(({ label, error, className = "", mono, type, ...props },
 	});
 });
 Input.displayName = "Input";
-var Textarea = forwardRef(({ label, error, className = "", mono, ...props }, ref) => {
+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__ */ jsx("label", {
+			label && /* @__PURE__ */ jsxs("label", {
 				className: "text-[0.8125rem] font-medium text-[var(--theme-app)]",
-				htmlFor: props.id || props.name,
-				children: label
+				htmlFor: id,
+				children: [label, required && /* @__PURE__ */ jsx(RequiredMark, {})]
 			}),
 			/* @__PURE__ */ jsx("textarea", {
 				ref,
 				className: textareaClasses,
-				...props
+				...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]
 			})
@@ -297,7 +320,7 @@ var IconButton = forwardRef(({ icon, label, variant = "default", size = "md", ac
 		type: "button",
 		"aria-label": label,
 		disabled,
-		"data-tooltip-id": showTooltip ? TOOLTIP_ID : void 0,
+		...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",
@@ -311,6 +334,7 @@ IconButton.displayName = "IconButton";
 //#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", {
@@ -382,6 +406,7 @@ var SortIcon = ({ currentlySorted, currentDirection, name }) => {
 	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");
@@ -397,6 +422,8 @@ function Sort({ currentlySorted, name, setCurrentDirection, setCurrentlySorted,
 	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,
@@ -422,11 +449,13 @@ function Pagination({ endingNumber, endingTime, nextCallback, prevCallback, roun
 		}), /* @__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"),
@@ -481,6 +510,7 @@ function SettingsGroup({ title, children, className }) {
 //#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", {
@@ -536,4 +566,4 @@ function SettingModeOption({ name, checked, onSelect, label, description, isFirs
 	});
 }
 //#endregion
-export { AddMenu, 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, SectionHeader, SettingModeOption, SettingRow, SettingSection, SettingsCard, SettingsGroup, Sort, StatusBadge, StatusDot, SwitchToggle, SwitchToggleSmall, THEME_PRESETS, THEME_TOKENS, TOOLTIP_ID, Table, Textarea, Toggle, TooltipInfo, UIProvider, UncontrolledCollapsiblePanel, applyTheme, contrastRatio, dangerButtonClasses, deriveTheme, filterOption, flattenOptions, formatTooltipContent, ghostButtonClasses, inputClasses, isCategory, isDarkColor, isOption, modalPanelClasses, primaryButtonClasses, toggleSetMember, useBreadcrumb, useClearBreadcrumbs, useCssIsDark, useHideBreadcrumbs, useNavigation, useNotify, useProvisionCorsRules, useRunFile, useSetBreadcrumbs, useSlots, useStrings, useWorkflowJsonResolver };
+export { AddMenu, 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, contrastRatio, dangerButtonClasses, deriveTheme, filterOption, flattenOptions, formatTooltipContent, ghostButtonClasses, inputClasses, isCategory, isDarkColor, isOption, modalPanelClasses, primaryButtonClasses, toggleSetMember, truncationTooltipProps, useBreadcrumb, useClearBreadcrumbs, useCssIsDark, useHideBreadcrumbs, useNavigation, useNotify, useProvisionCorsRules, useRunFile, useSetBreadcrumbs, useSetDefaultBreadcrumbs, useSlots, useStrings, useWorkflowJsonResolver };

package/dist/list/ActionToolbar.d.ts

@@ -5,11 +5,11 @@ export interface ToolbarAction {
         className?: string;
     }>;
     iconClassName?: string;
-    onClick?: () => void;
-    href?: string;
-    disabled?: boolean;
+    onClick?: (() => void) | undefined;
+    href?: string | undefined;
+    disabled?: boolean | undefined;
     enabledTooltip?: string;
-    disabledTooltip?: string;
+    disabledTooltip?: string | undefined;
     hidden?: boolean;
 }
 /** A pre-rendered element (e.g. a button component that owns its modal). */

package/dist/list/ListPage.d.ts

@@ -37,20 +37,20 @@ export interface PinnedRowAction {
     label: string;
     icon: ReactNode;
     onSelect: () => void;
-    disabled?: boolean;
+    disabled?: boolean | undefined;
 }
 export declare function ListRow({ href, items, goTo, openMenu, pinnedActions, selected, selectionActive, onRowSelect, leading, className, children, }: {
     href: string | null;
     items: RowMenuItem[];
     goTo: (to: string) => void;
     openMenu: OpenMenu;
-    pinnedActions?: PinnedRowAction[];
+    pinnedActions?: PinnedRowAction[] | undefined;
     className?: string;
     /** Tints the whole row to mark it as part of a multi-selection. */
     selected?: boolean;
     /** When multi-selection is active, plain row click toggles selection instead of navigating. */
     selectionActive?: boolean;
-    onRowSelect?: (e: ReactMouseEvent) => void;
+    onRowSelect?: ((e: ReactMouseEvent) => void) | undefined;
     /** Non-column cell rendered before the column cells; kept out of `children` so they stay aligned with `columns`. */
     leading?: ReactNode;
     children: ReactNode;

package/dist/list/ListTable.d.ts

@@ -21,7 +21,7 @@ export declare const listTableFixedProps: {
 export declare function NameCell({ icon, name, subtitle, href, }: {
     icon: ReactNode;
     name: string;
-    subtitle?: string;
+    subtitle?: string | undefined;
     href: string | null;
 }): import("react").JSX.Element;
 export declare function GroupRow({ label, count, colSpan, }: {

package/dist/list/RowContextMenu.d.ts

@@ -4,14 +4,14 @@ export type RowMenuItem = {
     label: string;
     to: string;
     icon?: ReactNode;
-    destructive?: boolean;
+    destructive?: boolean | undefined;
 } | {
     kind: 'action';
     label: string;
-    onSelect?: () => void;
+    onSelect?: (() => void) | undefined;
     icon?: ReactNode;
-    destructive?: boolean;
-    disabled?: boolean;
+    destructive?: boolean | undefined;
+    disabled?: boolean | undefined;
     /** Trailing checkmark, e.g. the active option in a radio-style submenu. */
     selected?: boolean;
     /** Declarative clipboard copy: the menu performs it and notifies, so
@@ -35,10 +35,10 @@ export interface RowAction {
     key: string;
     label: string;
     icon: ReactNode;
-    onSelect?: () => void;
-    to?: string;
-    disabled?: boolean;
-    destructive?: boolean;
+    onSelect?: (() => void) | undefined;
+    to?: string | undefined;
+    disabled?: boolean | undefined;
+    destructive?: boolean | undefined;
 }
 /** Converts a single row action to a menu item: a `to` makes it a link, otherwise an action. */
 export declare function toRowMenuItem(action: RowAction): RowMenuItem;
@@ -51,9 +51,9 @@ export declare function toolbarActionToRowAction(action: {
     icon: ComponentType<{
         className?: string;
     }>;
-    onClick?: () => void;
-    href?: string;
-    disabled?: boolean;
+    onClick?: (() => void) | undefined;
+    href?: string | undefined;
+    disabled?: boolean | undefined;
 }): RowAction;
 /** Assembles a row's context menu in the shared order: leading link(s) → middle
  * actions → extra items → Copy submenu → trailing (destructive) actions last. */
@@ -71,7 +71,7 @@ export declare function assembleRowMenu({ lead, actions, exclude, order, trailin
     /** Items inserted after the middle actions and before Copy, e.g. a marketplace link. */
     extra?: RowMenuItem[];
     /** The Copy submenu from `copySubmenu(...)`. */
-    copy?: RowMenuItem;
+    copy?: RowMenuItem | undefined;
 }): RowMenuItem[];
 export declare function useRowMenu(zClassName?: string): {
     openMenu: OpenMenu;
@@ -90,19 +90,19 @@ export declare function rowContextMenuProps(openMenu: OpenMenu, items: RowMenuIt
  * host translator for the field labels (falls back to the provider defaults'
  * English). */
 export declare function copySubmenu({ name, nameLabel, email, username, uid, id, url, extra, t, }: {
-    name?: string | null;
+    name?: string | null | undefined;
     /** Overrides the "name" label (raw, pre-translated) for entities whose primary field isn't a name, e.g. "domain". */
     nameLabel?: string;
-    email?: string | null;
-    username?: string | null;
-    uid?: string | number | null;
-    id?: string | null;
-    url?: string | null;
+    email?: string | null | undefined;
+    username?: string | null | undefined;
+    uid?: string | number | null | undefined;
+    id?: string | null | undefined;
+    url?: string | null | undefined;
     extra?: {
         label: string;
-        value?: string | null;
+        value?: string | null | undefined;
         icon?: ReactNode;
-    }[];
+    }[] | undefined;
     t?: (key: string, values?: Record<string, string | number>) => string;
 }): RowMenuItem;
 /** Stays visible while active (menu open) so it doesn't vanish behind the overlay. */

package/dist/list/index.js

@@ -1,3 +1,3 @@
-import { d as copySubmenu, f as rowContextMenuProps, g as useRowMenuActive, h as useRowMenu, l as MoreButton, m as toolbarActionToRowAction, p as toRowMenuItem, u as assembleRowMenu } from "../chunks/PageHeader-dyoL44ue.js";
-import { A as ActionToolbar, C as ListSkeleton, D as actionsColumnWidth, E as RowSelectCheckbox, M as stickyTabsClasses, N as stickyTabsUnderHeaderClasses, O as listTableFixedProps, P as stickyToolbarClasses, S as ListError, T as NameCell, _ as ListRow, a as ListCount, b as GroupRow, c as ListDisplayMenu, d as isTextEntryContext, f as DEFAULT_ORDER, g as ListPage, h as ListColumns, i as ListPager, j as ToolbarButton, k as listTableProps, l as ListFilterMenu, m as useListView, n as useHoverCard, o as ListSearchControl, p as FAVORITE_ORDER, r as LIST_PAGE_SIZES, s as useListSearch, t as HoverCardSurface, u as listControlButtonClasses, v as ListRowActionsProvider, w as NAME_MIN_WIDTH_PX, x as ListActionsHeader, y as useListNavigate } from "../chunks/list-CWVR3dfZ.js";
+import { d as copySubmenu, f as rowContextMenuProps, g as useRowMenuActive, h as useRowMenu, l as MoreButton, m as toolbarActionToRowAction, p as toRowMenuItem, u as assembleRowMenu } from "../chunks/PageHeader-FhtphHGc.js";
+import { A as ActionToolbar, C as ListSkeleton, D as actionsColumnWidth, E as RowSelectCheckbox, M as stickyTabsClasses, N as stickyTabsUnderHeaderClasses, O as listTableFixedProps, P as stickyToolbarClasses, S as ListError, T as NameCell, _ as ListRow, a as ListCount, b as GroupRow, c as ListDisplayMenu, d as isTextEntryContext, f as DEFAULT_ORDER, g as ListPage, h as ListColumns, i as ListPager, j as ToolbarButton, k as listTableProps, l as ListFilterMenu, m as useListView, n as useHoverCard, o as ListSearchControl, p as FAVORITE_ORDER, r as LIST_PAGE_SIZES, s as useListSearch, t as HoverCardSurface, u as listControlButtonClasses, v as ListRowActionsProvider, w as NAME_MIN_WIDTH_PX, x as ListActionsHeader, y as useListNavigate } from "../chunks/list-3jZW8rmM.js";
 export { ActionToolbar, DEFAULT_ORDER, FAVORITE_ORDER, GroupRow, HoverCardSurface, LIST_PAGE_SIZES, ListActionsHeader, ListColumns, ListCount, ListDisplayMenu, ListError, ListFilterMenu, ListPage, ListPager, ListRow, ListRowActionsProvider, ListSearchControl, ListSkeleton, MoreButton, NAME_MIN_WIDTH_PX, NameCell, RowSelectCheckbox, ToolbarButton, actionsColumnWidth, assembleRowMenu, copySubmenu, isTextEntryContext, listControlButtonClasses, listTableFixedProps, listTableProps, rowContextMenuProps, stickyTabsClasses, stickyTabsUnderHeaderClasses, stickyToolbarClasses, toRowMenuItem, toolbarActionToRowAction, useHoverCard, useListNavigate, useListSearch, useListView, useRowMenu, useRowMenuActive };

package/dist/logviewer/index.js

@@ -1,6 +1,6 @@
 import { ArrowDownIcon, ArrowUpIcon, CheckIcon, ChevronDownIcon, ChevronRightIcon, ClockIcon, CopyIcon, DownloadIcon, ExpandIcon, ShrinkIcon, XIcon } from "../icons.js";
-import { c as useStrings, i as useNotify } from "../chunks/Provider-CfFV-vc5.js";
-import { r as TooltipInfo } from "../chunks/Tooltip-WgbiC_nd.js";
+import { c as useStrings, i as useNotify } from "../chunks/Provider-CbFVFB7O.js";
+import { r as TooltipInfo } from "../chunks/Tooltip-n9w7Tkt1.js";
 import cx from "classnames";
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";
 import { Fragment as Fragment$1, memo, useCallback, useEffect, useLayoutEffect, useMemo, useRef, useState } from "react";
@@ -37,19 +37,34 @@ var LogLine = memo(function LogLine({ index, segments, lineNumbers, isSelected,
 		});
 		return null;
 	}, [command?.type, annotationLabels]);
+	const groupToggle = command?.type === "group" && onGroupToggle ? () => {
+		if (window.getSelection()?.isCollapsed === false) return;
+		onGroupToggle(index);
+	} : null;
+	const groupToggleProps = groupToggle ? {
+		role: "button",
+		tabIndex: 0,
+		"aria-expanded": !isGroupCollapsed,
+		onClick: groupToggle,
+		onKeyDown: (e) => {
+			if (e.target !== e.currentTarget) return;
+			if (e.key === "Enter" || e.key === " ") {
+				e.preventDefault();
+				groupToggle();
+			}
+		}
+	} : void 0;
 	return /* @__PURE__ */ jsxs("div", {
 		"data-line-number": index + 1,
+		...groupToggleProps,
 		className: cx("flex items-start text-sm font-mono group", isSelected ? "bg-(--theme-link)/15" : "hover:bg-(--theme-hover)", "text-(--theme-app)", command?.type === "error" && "bg-red-500/10", command?.type === "warning" && "bg-yellow-500/10", command?.type === "notice" && "bg-blue-500/10", command?.type === "debug" && "opacity-60", command?.type === "group" && "bg-(--theme-hover) cursor-pointer"),
 		style: {
 			minHeight: `${lineHeight}px`,
 			lineHeight: `${lineHeight}px`,
 			paddingLeft: groupDepth > 0 ? `${groupDepth * 16}px` : void 0
 		},
-		onClick: command?.type === "group" && onGroupToggle ? () => {
-			if (window.getSelection()?.isCollapsed === false) return;
-			onGroupToggle(index);
-		} : void 0,
-		children: [lineNumbers && /* @__PURE__ */ jsx("span", {
+		children: [lineNumbers && /* @__PURE__ */ jsx("button", {
+			type: "button",
 			onClick: (e) => {
 				e.stopPropagation();
 				onLineClick(index + 1, e);
@@ -537,6 +552,7 @@ function LogViewer({ log, height = "unset", width, roundedBottom = false, lineNu
 										children: [copied ? /* @__PURE__ */ jsx(CheckIcon, { className: "text-green-500" }) : /* @__PURE__ */ jsx(CopyIcon, {}), /* @__PURE__ */ jsx("span", { children: copied ? tCommon.copied : t.copyLines(selectedLines.size) })]
 									}), /* @__PURE__ */ jsx("button", {
 										type: "button",
+										"aria-label": t.clearSelection,
 										className: "absolute -top-1.5 -right-1.5 btn-neutral rounded-full p-1 border transition-colors shadow-sm cursor-pointer z-10",
 										onClick: () => setSelectedLines(/* @__PURE__ */ new Set()),
 										title: t.clearSelection,
@@ -661,6 +677,7 @@ function LogViewer({ log, height = "unset", width, roundedBottom = false, lineNu
 			}),
 			/* @__PURE__ */ jsxs("div", {
 				"data-testid": "logviewer",
+				role: "none",
 				className: cx(roundedBottom && "rounded-b-lg", "w-full overflow-x-auto", !inline && "h-full grow overflow-y-auto", !inline && "bg-(--theme-muted-panel-bg)", contentClassName),
 				style: inline ? void 0 : {
 					overflowY: "auto",

package/dist/styles/theme.css

@@ -14,15 +14,15 @@
   --theme-panel-bg: #ffffff;
   --theme-panel: #000000;
   --theme-muted-panel-bg: #f8f9fa;
-  --theme-muted-panel-color: #6c757d;
-  --theme-muted-text-color: #6c757d;
+  --theme-muted-panel-color: #5f6b76;
+  --theme-muted-text-color: #5f6b76;
   --theme-border: #d1d5db;
   --theme-element: #06354f;
   --theme-element-text: #ffffff;
   --theme-element-hover: #053047;
   --theme-hover: #f3f4f6;
   --theme-hover-text: #000000;
-  --theme-link: #428bca;
+  --theme-link: #2f6fa8;
   --theme-input-bg: #f9fafb;
   --theme-input: #3b82f6;
   --theme-input-disabled-bg: #f3f4f6;
@@ -67,11 +67,11 @@
 
 @utility theme-muted-panel {
   background-color: var(--theme-muted-panel-bg, #f8f9fa);
-  color: var(--theme-muted-panel-color, #6c757d);
+  color: var(--theme-muted-panel-color, #5f6b76);
 }
 
 @utility theme-muted-text {
-  color: var(--theme-muted-text-color, #6c757d);
+  color: var(--theme-muted-text-color, #5f6b76);
 }
 
 @utility theme-text {
@@ -117,7 +117,7 @@
 }
 
 .tooltip {
-  color: var(--theme-muted-text-color, #6c757d);
+  color: var(--theme-muted-text-color, #5f6b76);
 }
 .tooltip:hover {
   color: var(--theme-app, #000000);