@homebound/beam 3.93.0 → 3.94.0

package/dist/index.js

@@ -25180,11 +25180,88 @@ function HbSpinnerProvider({
   return /* @__PURE__ */ jsx200(HbLoadingSpinnerContext.Provider, { value: state, children });
 }
 
+// src/components/InlineFeedbackBanner.tsx
+import { trussProps as trussProps113, maybeCssVar as maybeCssVar55 } from "@homebound/truss/runtime";
+import { jsx as jsx201, jsxs as jsxs100 } from "react/jsx-runtime";
+function InlineFeedbackBanner(props) {
+  const {
+    type,
+    tagText,
+    description,
+    actions = []
+  } = props;
+  const {
+    icon,
+    tagType,
+    borderColor,
+    fallbackTagText
+  } = typeStyles2[type];
+  const tid = useTestIds(props, "inlineFeedbackBanner");
+  const tagProps = tagText ? {
+    type: tagType,
+    icon,
+    text: tagText
+  } : {
+    type: tagType,
+    icon,
+    text: fallbackTagText,
+    iconOnly: true
+  };
+  return /* @__PURE__ */ jsxs100("div", { ...trussProps113({
+    display: "df",
+    alignItems: "ais",
+    gap: "gap1",
+    width: "w100",
+    paddingTop: "pt1",
+    paddingBottom: "pb1",
+    paddingRight: "pr1",
+    paddingLeft: "pl1",
+    borderRadius: "br4",
+    fontWeight: "fw4",
+    fontSize: "fz_12px",
+    lineHeight: "lh_16px",
+    backgroundColor: ["bgColor_var", {
+      "--backgroundColor": "var(--b-surface)"
+    }],
+    borderStyle: "bss",
+    borderWidth: "bw1",
+    borderColor: ["bc_var", {
+      "--borderColor": maybeCssVar55(borderColor)
+    }],
+    boxShadow: "bshBasic"
+  }), ...tid, children: [
+    /* @__PURE__ */ jsx201("span", { className: "df fs0", children: /* @__PURE__ */ jsx201(Tag, { ...tagProps, ...tid.tag }) }),
+    /* @__PURE__ */ jsx201("span", { ...trussProps113({
+      flexGrow: "fg1",
+      minWidth: "mw0",
+      color: ["color_var", {
+        "--color": "var(--b-on-surface)"
+      }]
+    }), ...tid.description, children: description }),
+    actions.length > 0 && /* @__PURE__ */ jsx201("div", { className: "df aic gap_1_5 fs0", children: actions.map((action) => /* @__PURE__ */ jsx201(Button, { ...action, variant: "text" }, `${action.label}`)) })
+  ] });
+}
+var typeStyles2 = {
+  error: {
+    icon: "xCircle",
+    tagType: "error",
+    borderColor: "--b-danger" /* Danger */,
+    fallbackTagText: "Error"
+  },
+  // Warning has no semantic border token
+  warning: {
+    icon: "error",
+    tagType: "warning",
+    borderColor: "rgba(194, 65, 12, 1)" /* Orange700 */,
+    fallbackTagText: "Warning"
+  }
+};
+
 // src/components/JumpLink.tsx
 import { useRef as useRef59 } from "react";
 import { mergeProps as mergeProps30, useFocusRing as useFocusRing16, useHover as useHover19, useLink } from "react-aria";
-import { trussProps as trussProps113 } from "@homebound/truss/runtime";
-import { jsx as jsx201 } from "react/jsx-runtime";
+import { trussProps as trussProps114 } from "@homebound/truss/runtime";
+import { jsx as jsx202 } from "react/jsx-runtime";
 function JumpLink(props) {
   const {
     label,
@@ -25226,14 +25303,14 @@ function JumpLink(props) {
       });
     }
   }
-  return /* @__PURE__ */ jsx201("a", { ref, ...mergeProps30(linkProps, focusProps, hoverProps), ...tid, ...trussProps113({
+  return /* @__PURE__ */ jsx202("a", { ref, ...mergeProps30(linkProps, focusProps, hoverProps), ...tid, ...trussProps114({
     ...jumpLinkStyles.baseStyles,
     ...active && jumpLinkStyles.activeStyles,
     ...isHovered && !disabled && jumpLinkStyles.hoverStyles,
     ...isFocusVisible && jumpLinkStyles.focusStyles,
     ...disabled && jumpLinkStyles.disabledStyles,
     ...disabled && active && jumpLinkStyles.disabledActiveStyles
-  }), children: /* @__PURE__ */ jsx201("span", { className: "oh d_negwebkit_box wbo_vertical to_ellipsis wlc_2", children: label }) });
+  }), children: /* @__PURE__ */ jsx202("span", { className: "oh d_negwebkit_box wbo_vertical to_ellipsis wlc_2", children: label }) });
 }
 var jumpLinkStyles = {
   baseStyles: {
@@ -25283,8 +25360,8 @@ var jumpLinkStyles = {
 // src/components/MaxLines.tsx
 import { useLayoutEffect as useLayoutEffect9, useResizeObserver as useResizeObserver8 } from "@react-aria/utils";
 import { useCallback as useCallback33, useEffect as useEffect33, useRef as useRef60, useState as useState52 } from "react";
-import { trussProps as trussProps114, maybeCssVar as maybeCssVar55 } from "@homebound/truss/runtime";
-import { jsx as jsx202, jsxs as jsxs100 } from "react/jsx-runtime";
+import { trussProps as trussProps115, maybeCssVar as maybeCssVar56 } from "@homebound/truss/runtime";
+import { jsx as jsx203, jsxs as jsxs101 } from "react/jsx-runtime";
 function MaxLines({
   maxLines,
   children
@@ -25307,11 +25384,11 @@ function MaxLines({
     ref: elRef,
     onResize
   });
-  return /* @__PURE__ */ jsxs100("div", { children: [
-    /* @__PURE__ */ jsx202("div", { ref: elRef, ...trussProps114({
+  return /* @__PURE__ */ jsxs101("div", { children: [
+    /* @__PURE__ */ jsx203("div", { ref: elRef, ...trussProps115({
       ...!expanded ? {
         WebkitLineClamp: ["lineClamp_var", {
-          "--WebkitLineClamp": maybeCssVar55(maxLines)
+          "--WebkitLineClamp": maybeCssVar56(maxLines)
         }],
         overflow: "oh",
         display: "d_negwebkit_box",
@@ -25319,7 +25396,7 @@ function MaxLines({
         textOverflow: "to_ellipsis"
       } : {}
     }), children }),
-    hasMore && /* @__PURE__ */ jsx202("button", { className: "db fw4 fz_14px lh_20px", onClick: () => setExpanded((prev) => !prev), children: expanded ? "Show Less" : "Show More" })
+    hasMore && /* @__PURE__ */ jsx203("button", { className: "db fw4 fz_14px lh_20px", onClick: () => setExpanded((prev) => !prev), children: expanded ? "Show Less" : "Show More" })
   ] });
 }
 
@@ -25334,8 +25411,8 @@ import { useCallback as useCallback35, useEffect as useEffect34, useMemo as useM
 // src/components/AppNav/AppNavGroupTrigger.tsx
 import { useMemo as useMemo50, useRef as useRef61 } from "react";
 import { mergeProps as mergeProps31, useButton as useButton11, useFocusRing as useFocusRing17, useHover as useHover20 } from "react-aria";
-import { trussProps as trussProps115, mergeProps as mergeProps_14 } from "@homebound/truss/runtime";
-import { jsx as jsx203, jsxs as jsxs101 } from "react/jsx-runtime";
+import { trussProps as trussProps116, mergeProps as mergeProps_14 } from "@homebound/truss/runtime";
+import { jsx as jsx204, jsxs as jsxs102 } from "react/jsx-runtime";
 function AppNavGroupTrigger(props) {
   const {
     label,
@@ -25367,7 +25444,7 @@ function AppNavGroupTrigger(props) {
     hoverStyles: hoverStyles4,
     pressedStyles: pressedStyles2
   } = useMemo50(() => getNavLinkStyles("side"), []);
-  return /* @__PURE__ */ jsxs101("button", { type: "button", ...mergeProps31(buttonProps, focusProps, hoverProps, tid.trigger, {
+  return /* @__PURE__ */ jsxs102("button", { type: "button", ...mergeProps31(buttonProps, focusProps, hoverProps, tid.trigger, {
     ref,
     "aria-expanded": expanded,
     "aria-controls": navGroupId,
@@ -25385,7 +25462,7 @@ function AppNavGroupTrigger(props) {
     })
   }), children: [
     label,
-    /* @__PURE__ */ jsx203("div", { ...trussProps115({
+    /* @__PURE__ */ jsx204("div", { ...trussProps116({
       ...{
         display: "df",
         alignItems: "aic",
@@ -25395,7 +25472,7 @@ function AppNavGroupTrigger(props) {
       ...props.expanded ? {
         transform: "transform_rotate_180deg"
       } : {}
-    }), children: /* @__PURE__ */ jsx203(Icon, { icon: "chevronDown" }) })
+    }), children: /* @__PURE__ */ jsx204(Icon, { icon: "chevronDown" }) })
   ] });
 }
 
@@ -25538,8 +25615,8 @@ function useAppNavGroupExpanded(linkGroup) {
 }
 
 // src/components/AppNav/AppNavGroup.tsx
-import { trussProps as trussProps116, maybeCssVar as maybeCssVar56 } from "@homebound/truss/runtime";
-import { Fragment as Fragment45, jsx as jsx204, jsxs as jsxs102 } from "react/jsx-runtime";
+import { trussProps as trussProps117, maybeCssVar as maybeCssVar57 } from "@homebound/truss/runtime";
+import { Fragment as Fragment45, jsx as jsx205, jsxs as jsxs103 } from "react/jsx-runtime";
 var __maybeInc26 = (inc) => {
   return typeof inc === "string" ? inc : `calc(var(--t-spacing) * ${inc})`;
 };
@@ -25550,9 +25627,9 @@ function AppNavGroupView(props) {
   } = props;
   const tid = useTestIds(props, "linkGroup");
   if (panelCollapsed) {
-    return /* @__PURE__ */ jsx204(Fragment45, { children: appNavLinkGroupLinks(linkGroup).map((link) => /* @__PURE__ */ jsx204(NavLink, { variant: "side", ...link, iconOnly: !!link.icon, ...tid[`link_${camelCase5(link.label)}`] }, link.label)) });
+    return /* @__PURE__ */ jsx205(Fragment45, { children: appNavLinkGroupLinks(linkGroup).map((link) => /* @__PURE__ */ jsx205(NavLink, { variant: "side", ...link, iconOnly: !!link.icon, ...tid[`link_${camelCase5(link.label)}`] }, link.label)) });
   }
-  return /* @__PURE__ */ jsx204(AppNavGroupDisclosure, { ...props });
+  return /* @__PURE__ */ jsx205(AppNavGroupDisclosure, { ...props });
 }
 function AppNavGroupDisclosure(props) {
   const {
@@ -25581,27 +25658,27 @@ function AppNavGroupDisclosure(props) {
     ref: contentRef,
     onResize
   });
-  return /* @__PURE__ */ jsxs102("div", { className: "df fdc", ...tid, children: [
-    /* @__PURE__ */ jsx204(AppNavGroupTrigger, { label: linkGroup.label, navGroupId, expanded, active: linkGroupHasActiveLink(linkGroup), onClick: onToggle, ...tid }),
-    /* @__PURE__ */ jsx204("div", { id: navGroupId, role: "region", "aria-hidden": !expanded, ...trussProps116({
+  return /* @__PURE__ */ jsxs103("div", { className: "df fdc", ...tid, children: [
+    /* @__PURE__ */ jsx205(AppNavGroupTrigger, { label: linkGroup.label, navGroupId, expanded, active: linkGroupHasActiveLink(linkGroup), onClick: onToggle, ...tid }),
+    /* @__PURE__ */ jsx205("div", { id: navGroupId, role: "region", "aria-hidden": !expanded, ...trussProps117({
       overflow: "oh",
       transition: "transitionHeight",
       height: ["h_var", {
-        "--height": maybeCssVar56(__maybeInc26(contentHeight))
+        "--height": maybeCssVar57(__maybeInc26(contentHeight))
       }]
     }), ...tid.panel, ...!expanded ? {
       inert: "true"
-    } : {}, children: /* @__PURE__ */ jsx204("div", { ref: setContentEl, className: "df fdc", children: /* @__PURE__ */ jsx204(AppNavItems, { items: linkGroup.items, panelCollapsed: false, nested: true, ...tid }) }) })
+    } : {}, children: /* @__PURE__ */ jsx205("div", { ref: setContentEl, className: "df fdc", children: /* @__PURE__ */ jsx205(AppNavItems, { items: linkGroup.items, panelCollapsed: false, nested: true, ...tid }) }) })
   ] });
 }
 
 // src/components/AppNav/AppNavGroupMenu.tsx
-import { jsx as jsx205 } from "react/jsx-runtime";
+import { jsx as jsx206 } from "react/jsx-runtime";
 function AppNavGroupMenu({
   linkGroup,
   ...tid
 }) {
-  return /* @__PURE__ */ jsx205(
+  return /* @__PURE__ */ jsx206(
     ButtonMenu,
     {
       trigger: {
@@ -25617,8 +25694,8 @@ function AppNavGroupMenu({
 }
 
 // src/components/AppNav/AppNavSectionView.tsx
-import { trussProps as trussProps117 } from "@homebound/truss/runtime";
-import { jsx as jsx206, jsxs as jsxs103 } from "react/jsx-runtime";
+import { trussProps as trussProps118 } from "@homebound/truss/runtime";
+import { jsx as jsx207, jsxs as jsxs104 } from "react/jsx-runtime";
 function AppNavSectionView(props) {
   const {
     section,
@@ -25644,7 +25721,7 @@ function AppNavSectionView(props) {
       "--borderColor": "var(--b-surface-separator)"
     }]
   };
-  return /* @__PURE__ */ jsxs103("div", { ...trussProps117({
+  return /* @__PURE__ */ jsxs104("div", { ...trussProps118({
     ...{
       display: "df",
       flexDirection: "fdc",
@@ -25652,7 +25729,7 @@ function AppNavSectionView(props) {
     },
     ...showDivider ? dividerStyles : {}
   }), ...tid, children: [
-    section.label && !panelCollapsed && variant !== "global" && /* @__PURE__ */ jsx206("div", { ...trussProps117({
+    section.label && !panelCollapsed && variant !== "global" && /* @__PURE__ */ jsx207("div", { ...trussProps118({
       fontWeight: "fw6",
       fontSize: "fz_10px",
       lineHeight: "lh_14px",
@@ -25665,18 +25742,18 @@ function AppNavSectionView(props) {
       paddingBottom: "pb1",
       textTransform: "ttu"
     }), ...tid.label, children: section.label }),
-    /* @__PURE__ */ jsx206(AppNavItems, { ...scopeProps, items: section.items, variant, panelCollapsed, nested })
+    /* @__PURE__ */ jsx207(AppNavItems, { ...scopeProps, items: section.items, variant, panelCollapsed, nested })
   ] });
 }
 
 // src/components/AppNav/AppNavItems.tsx
-import { Fragment as Fragment46, jsx as jsx207 } from "react/jsx-runtime";
+import { Fragment as Fragment46, jsx as jsx208 } from "react/jsx-runtime";
 function AppNavItems(props) {
   const { items, variant = "side", panelCollapsed = false, nested = false } = props;
   const tid = useTestIds(props, "appNav");
-  return /* @__PURE__ */ jsx207(Fragment46, { children: items.map((item, idx) => {
+  return /* @__PURE__ */ jsx208(Fragment46, { children: items.map((item, idx) => {
     if (isAppNavLink(item)) {
-      return /* @__PURE__ */ jsx207(
+      return /* @__PURE__ */ jsx208(
         NavLink,
         {
           variant,
@@ -25689,7 +25766,7 @@ function AppNavItems(props) {
       );
     }
     if (isAppNavGroup(item)) {
-      return variant === "global" ? /* @__PURE__ */ jsx207(AppNavGroupMenu, { linkGroup: item, ...tid.linkGroup }, appNavItemKey(item)) : /* @__PURE__ */ jsx207(
+      return variant === "global" ? /* @__PURE__ */ jsx208(AppNavGroupMenu, { linkGroup: item, ...tid.linkGroup }, appNavItemKey(item)) : /* @__PURE__ */ jsx208(
         AppNavGroupView,
         {
           linkGroup: item,
@@ -25700,7 +25777,7 @@ function AppNavItems(props) {
       );
     }
     if (isAppNavSection(item)) {
-      return /* @__PURE__ */ jsx207(
+      return /* @__PURE__ */ jsx208(
         AppNavSectionView,
         {
           section: item,
@@ -25726,12 +25803,12 @@ import { useLocation } from "react-router-dom";
 
 // src/layouts/NavbarLayout/MobileSubNavContext.tsx
 import { createContext as createContext14, useContext as useContext26, useLayoutEffect as useLayoutEffect10, useMemo as useMemo52, useState as useState55 } from "react";
-import { jsx as jsx208 } from "react/jsx-runtime";
+import { jsx as jsx209 } from "react/jsx-runtime";
 var MobileSubNavContext = createContext14(void 0);
 function MobileSubNavProvider(props) {
   const [mobileSubNav, setMobileSubNav] = useState55(null);
   const value = useMemo52(() => ({ mobileSubNav, setMobileSubNav }), [mobileSubNav]);
-  return /* @__PURE__ */ jsx208(MobileSubNavContext.Provider, { value, children: props.children });
+  return /* @__PURE__ */ jsx209(MobileSubNavContext.Provider, { value, children: props.children });
 }
 function useMobileSubNav() {
   return useContext26(MobileSubNavContext)?.mobileSubNav ?? null;
@@ -25753,8 +25830,8 @@ function useRegisterMobileSubNav(content) {
 }
 
 // src/components/Navbar/NavbarMobileMenu.tsx
-import { trussProps as trussProps118, mergeProps as mergeProps32, maybeCssVar as maybeCssVar57 } from "@homebound/truss/runtime";
-import { Fragment as Fragment47, jsx as jsx209, jsxs as jsxs104 } from "react/jsx-runtime";
+import { trussProps as trussProps119, mergeProps as mergeProps32, maybeCssVar as maybeCssVar58 } from "@homebound/truss/runtime";
+import { Fragment as Fragment47, jsx as jsx210, jsxs as jsxs105 } from "react/jsx-runtime";
 function NavbarMobileMenu(props) {
   const {
     items
@@ -25774,8 +25851,8 @@ function NavbarMobileMenu(props) {
   useEffect35(() => {
     close();
   }, [pathname, search]);
-  return /* @__PURE__ */ jsxs104(Fragment47, { children: [
-    /* @__PURE__ */ jsx209(IconButton, { icon: isOpen ? "menuClose" : "menu", color: "--b-on-surface-muted" /* OnSurfaceMuted */, label: isOpen ? "Close navigation" : "Open navigation", onClick: () => {
+  return /* @__PURE__ */ jsxs105(Fragment47, { children: [
+    /* @__PURE__ */ jsx210(IconButton, { icon: isOpen ? "menuClose" : "menu", color: "--b-on-surface-muted" /* OnSurfaceMuted */, label: isOpen ? "Close navigation" : "Open navigation", onClick: () => {
       if (isOpen) {
         close();
         return;
@@ -25785,7 +25862,7 @@ function NavbarMobileMenu(props) {
     }, ...tid.mobileMenu }),
     createPortal7(
       /* AnimatePresence keeps the drawer mounted through its slide/fade-out before unmounting.*/
-      /* @__PURE__ */ jsx209(AnimatePresence6, { children: isOpen && /* @__PURE__ */ jsx209(NavbarMobileDrawer, { items, mobileSubNav, level, onLevelChange: setLevel, onClose: close, tid }) }),
+      /* @__PURE__ */ jsx210(AnimatePresence6, { children: isOpen && /* @__PURE__ */ jsx210(NavbarMobileDrawer, { items, mobileSubNav, level, onLevelChange: setLevel, onClose: close, tid }) }),
       document.body
     )
   ] });
@@ -25803,14 +25880,14 @@ function NavbarMobileDrawer({
     top: bannerHeightPx
   };
   const showSubLevel = mobileSubNav != null && level === "sub";
-  return /* @__PURE__ */ jsxs104(Fragment47, { children: [
-    /* @__PURE__ */ jsx209(motion6.div, { ...mergeProps32(void 0, overlayTopStyle, {
+  return /* @__PURE__ */ jsxs105(Fragment47, { children: [
+    /* @__PURE__ */ jsx210(motion6.div, { ...mergeProps32(void 0, overlayTopStyle, {
       position: "fixed",
       right: "right0",
       bottom: "bottom0",
       left: "left0",
       zIndex: ["z_var", {
-        "--zIndex": maybeCssVar57(zIndices.navbarMobileMenuScrim)
+        "--zIndex": maybeCssVar58(zIndices.navbarMobileMenuScrim)
       }],
       backgroundColor: ["bgColor_var", {
         "--backgroundColor": "var(--b-scrim)"
@@ -25825,7 +25902,7 @@ function NavbarMobileDrawer({
       ease: "linear",
       duration: 0.2
     }, onClick: onClose, ...tid.mobileMenuScrim }, "navbarMobileMenuScrim"),
-    /* @__PURE__ */ jsx209(FocusScope5, { autoFocus: true, contain: true, restoreFocus: true, children: /* @__PURE__ */ jsxs104(motion6.aside, { role: "dialog", "aria-modal": "true", "aria-label": "Navigation", ...mergeProps32(void 0, overlayTopStyle, {
+    /* @__PURE__ */ jsx210(FocusScope5, { autoFocus: true, contain: true, restoreFocus: true, children: /* @__PURE__ */ jsxs105(motion6.aside, { role: "dialog", "aria-modal": "true", "aria-label": "Navigation", ...mergeProps32(void 0, overlayTopStyle, {
       position: "fixed",
       bottom: "bottom0",
       left: "left0",
@@ -25835,7 +25912,7 @@ function NavbarMobileDrawer({
       width: "w_260px",
       overflow: "oh",
       zIndex: ["z_var", {
-        "--zIndex": maybeCssVar57(zIndices.navbarMobileMenu)
+        "--zIndex": maybeCssVar58(zIndices.navbarMobileMenu)
       }],
       backgroundColor: ["bgColor_var", {
         "--backgroundColor": "var(--b-surface)"
@@ -25850,7 +25927,7 @@ function NavbarMobileDrawer({
       ease: "linear",
       duration: 0.2
     }, onClick: (e) => e.stopPropagation(), ...tid.mobileMenuDrawer, children: [
-      /* @__PURE__ */ jsxs104("div", { ...trussProps118({
+      /* @__PURE__ */ jsxs105("div", { ...trussProps119({
         ...{
           display: "df",
           alignItems: "aic",
@@ -25866,13 +25943,13 @@ function NavbarMobileDrawer({
         },
         ...pageContentPaddingX
       }), children: [
-        /* @__PURE__ */ jsx209("div", { className: "mw0", children: showSubLevel && /* @__PURE__ */ jsx209(Button, { label: "Main Menu", icon: "chevronLeft", variant: "quaternary", size: "sm", onClick: () => onLevelChange("global"), ...tid.mobileMenuMainMenu }) }),
-        /* @__PURE__ */ jsx209(IconButton, { icon: "x", color: "--b-on-surface-muted" /* OnSurfaceMuted */, label: "Close navigation", onClick: onClose, ...tid.mobileMenuClose })
+        /* @__PURE__ */ jsx210("div", { className: "mw0", children: showSubLevel && /* @__PURE__ */ jsx210(Button, { label: "Main Menu", icon: "chevronLeft", variant: "quaternary", size: "sm", onClick: () => onLevelChange("global"), ...tid.mobileMenuMainMenu }) }),
+        /* @__PURE__ */ jsx210(IconButton, { icon: "x", color: "--b-on-surface-muted" /* OnSurfaceMuted */, label: "Close navigation", onClick: onClose, ...tid.mobileMenuClose })
       ] }),
-      /* @__PURE__ */ jsx209("div", { className: "fg1 mh0 oh relative", children: /* @__PURE__ */ jsx209(AnimatePresence6, { initial: false, children: /* @__PURE__ */ jsxs104(
+      /* @__PURE__ */ jsx210("div", { className: "fg1 mh0 oh relative", children: /* @__PURE__ */ jsx210(AnimatePresence6, { initial: false, children: /* @__PURE__ */ jsxs105(
         motion6.nav,
         {
-          ...trussProps118({
+          ...trussProps119({
             ...{
               position: "absolute",
               top: "top0",
@@ -25909,7 +25986,7 @@ function NavbarMobileDrawer({
           ...tid.mobileMenuPanel,
           children: [
             showSubLevel && mobileSubNav?.top,
-            /* @__PURE__ */ jsx209(AppNavItems, { items: showSubLevel && mobileSubNav ? mobileSubNav.items : items, panelCollapsed: false, ...tid }),
+            /* @__PURE__ */ jsx210(AppNavItems, { items: showSubLevel && mobileSubNav ? mobileSubNav.items : items, panelCollapsed: false, ...tid }),
             showSubLevel && mobileSubNav?.footer
           ]
         },
@@ -25920,8 +25997,8 @@ function NavbarMobileDrawer({
 }
 
 // src/components/Navbar/Navbar.tsx
-import { trussProps as trussProps119 } from "@homebound/truss/runtime";
-import { jsx as jsx210, jsxs as jsxs105 } from "react/jsx-runtime";
+import { trussProps as trussProps120 } from "@homebound/truss/runtime";
+import { jsx as jsx211, jsxs as jsxs106 } from "react/jsx-runtime";
 function Navbar(props) {
   const {
     brand,
@@ -25940,7 +26017,7 @@ function Navbar(props) {
     overflows
   } = useContentOverflow(!sm);
   const showMobile = sm || overflows;
-  return /* @__PURE__ */ jsx210(ContrastScope, { children: /* @__PURE__ */ jsxs105("nav", { ...trussProps119({
+  return /* @__PURE__ */ jsx211(ContrastScope, { children: /* @__PURE__ */ jsxs106("nav", { ...trussProps120({
     ...{
       backgroundColor: ["bgColor_var", {
         "--backgroundColor": "var(--b-surface-raised)"
@@ -25956,10 +26033,10 @@ function Navbar(props) {
     },
     ...headerContentPaddingX(showMobile)
   }), ...tid, children: [
-    /* @__PURE__ */ jsxs105("div", { className: "df aic gap3 fg1 mw0", children: [
-      /* @__PURE__ */ jsxs105("div", { className: "df aic fs0 gap2", children: [
-        showMobile && /* @__PURE__ */ jsx210(NavbarMobileMenu, { items, ...tid }),
-        /* @__PURE__ */ jsx210("div", { ...trussProps119({
+    /* @__PURE__ */ jsxs106("div", { className: "df aic gap3 fg1 mw0", children: [
+      /* @__PURE__ */ jsxs106("div", { className: "df aic fs0 gap2", children: [
+        showMobile && /* @__PURE__ */ jsx211(NavbarMobileMenu, { items, ...tid }),
+        /* @__PURE__ */ jsx211("div", { ...trussProps120({
           flexShrink: "fs0",
           ...hideBrandOnMobile && showMobile ? {
             display: "dn"
@@ -25968,7 +26045,7 @@ function Navbar(props) {
       ] }),
       !sm && // Stays mounted while overflowing (hidden) so the items remain measurable and the bar
       // can expand again as space frees up.
-      /* @__PURE__ */ jsx210("div", { ref: containerRef, ...trussProps119({
+      /* @__PURE__ */ jsx211("div", { ref: containerRef, ...trussProps120({
         display: "df",
         alignItems: "aic",
         flexGrow: "fg1",
@@ -25977,11 +26054,11 @@ function Navbar(props) {
         ...overflows ? {
           visibility: "visibility_hidden"
         } : {}
-      }), ...tid.items, children: /* @__PURE__ */ jsx210("div", { ref: contentRef, className: "df aic gap2 width_max_content", children: /* @__PURE__ */ jsx210(AppNavItems, { variant: "global", items, ...tid }) }) })
+      }), ...tid.items, children: /* @__PURE__ */ jsx211("div", { ref: contentRef, className: "df aic gap2 width_max_content", children: /* @__PURE__ */ jsx211(AppNavItems, { variant: "global", items, ...tid }) }) })
     ] }),
-    /* @__PURE__ */ jsxs105("div", { className: "df aic gap1", children: [
-      rightSlot && /* @__PURE__ */ jsx210("div", { className: "df aic gap1", ...tid.rightSlot, children: rightSlot }),
-      user && /* @__PURE__ */ jsx210(NavbarUserMenu, { user, ...tid.userMenu })
+    /* @__PURE__ */ jsxs106("div", { className: "df aic gap1", children: [
+      rightSlot && /* @__PURE__ */ jsx211("div", { className: "df aic gap1", ...tid.rightSlot, children: rightSlot }),
+      user && /* @__PURE__ */ jsx211(NavbarUserMenu, { user, ...tid.userMenu })
     ] })
   ] }) });
 }
@@ -25989,7 +26066,7 @@ function NavbarUserMenu({
   user,
   ...tid
 }) {
-  return /* @__PURE__ */ jsx210("div", { className: "df aic fs0 ml1", children: /* @__PURE__ */ jsx210(ButtonMenu, { items: user.menuItems, persistentItems: user.persistentItems, trigger: {
+  return /* @__PURE__ */ jsx211("div", { className: "df aic fs0 ml1", children: /* @__PURE__ */ jsx211(ButtonMenu, { items: user.menuItems, persistentItems: user.persistentItems, trigger: {
     src: user.picture,
     name: user.name,
     size: "sm",
@@ -25998,8 +26075,8 @@ function NavbarUserMenu({
 }
 
 // src/components/Pagination.tsx
-import { trussProps as trussProps120 } from "@homebound/truss/runtime";
-import { jsx as jsx211, jsxs as jsxs106 } from "react/jsx-runtime";
+import { trussProps as trussProps121 } from "@homebound/truss/runtime";
+import { jsx as jsx212, jsxs as jsxs107 } from "react/jsx-runtime";
 var defaultPage = {
   offset: 0,
   limit: 100
@@ -26031,7 +26108,7 @@ function Pagination(props) {
     }
   }
   const tid = useTestIds(props, "pagination");
-  return /* @__PURE__ */ jsxs106("div", { ...trussProps120({
+  return /* @__PURE__ */ jsxs107("div", { ...trussProps121({
     display: "df",
     borderColor: ["bc_var", {
       "--borderColor": "var(--b-surface-separator)"
@@ -26048,24 +26125,24 @@ function Pagination(props) {
     paddingRight: "pr2",
     paddingTop: "pt2"
   }), ...tid, children: [
-    /* @__PURE__ */ jsx211("div", { className: "df mta mba mr2", ...tid.pageSizeLabel, children: "Page size:" }),
-    /* @__PURE__ */ jsx211("div", { className: "w_78px", children: /* @__PURE__ */ jsx211(SelectField, { compact: true, label: "Page Size", labelStyle: "hidden", options: pageOptions, value: pageSize, onSelect: (val) => set({
+    /* @__PURE__ */ jsx212("div", { className: "df mta mba mr2", ...tid.pageSizeLabel, children: "Page size:" }),
+    /* @__PURE__ */ jsx212("div", { className: "w_78px", children: /* @__PURE__ */ jsx212(SelectField, { compact: true, label: "Page Size", labelStyle: "hidden", options: pageOptions, value: pageSize, onSelect: (val) => set({
       pageNumber: 1,
       pageSize: val
     }), autoSort: false, ...tid.pageSize }) }),
-    /* @__PURE__ */ jsxs106("div", { className: "mla mta mba df", children: [
-      /* @__PURE__ */ jsxs106("div", { className: "df mta mba mr2", ...tid.pageInfoLabel, children: [
+    /* @__PURE__ */ jsxs107("div", { className: "mla mta mba df", children: [
+      /* @__PURE__ */ jsxs107("div", { className: "df mta mba mr2", ...tid.pageInfoLabel, children: [
         first,
         " ",
         showLast ? `- ${last}` : "",
         " of ",
         totalCount
       ] }),
-      /* @__PURE__ */ jsx211(IconButton, { icon: "chevronLeft", color: hasPrevPage ? "--b-text-link-default" /* TextLinkDefault */ : "--b-surface-separator" /* SurfaceSeparator */, onClick: () => set({
+      /* @__PURE__ */ jsx212(IconButton, { icon: "chevronLeft", color: hasPrevPage ? "--b-text-link-default" /* TextLinkDefault */ : "--b-surface-separator" /* SurfaceSeparator */, onClick: () => set({
         pageNumber: pageNumber - 1,
         pageSize
       }), disabled: !hasPrevPage, ...tid.previousIcon }),
-      /* @__PURE__ */ jsx211(IconButton, { icon: "chevronRight", color: hasNextPage ? "--b-text-link-default" /* TextLinkDefault */ : "--b-surface-separator" /* SurfaceSeparator */, onClick: () => set({
+      /* @__PURE__ */ jsx212(IconButton, { icon: "chevronRight", color: hasNextPage ? "--b-text-link-default" /* TextLinkDefault */ : "--b-surface-separator" /* SurfaceSeparator */, onClick: () => set({
         pageNumber: pageNumber + 1,
         pageSize
       }), disabled: !hasNextPage, ...tid.nextIcon })
@@ -26089,8 +26166,8 @@ function toPageNumberSize(page) {
 // src/components/ScrollShadows.tsx
 import { useResizeObserver as useResizeObserver10 } from "@react-aria/utils";
 import { useCallback as useCallback36, useMemo as useMemo53, useRef as useRef62, useState as useState57 } from "react";
-import { trussProps as trussProps121, maybeCssVar as maybeCssVar58 } from "@homebound/truss/runtime";
-import { jsx as jsx212, jsxs as jsxs107 } from "react/jsx-runtime";
+import { trussProps as trussProps122, maybeCssVar as maybeCssVar59 } from "@homebound/truss/runtime";
+import { jsx as jsx213, jsxs as jsxs108 } from "react/jsx-runtime";
 function ScrollShadows(props) {
   const {
     children,
@@ -26114,7 +26191,7 @@ function ScrollShadows(props) {
     const commonStyles = {
       position: "absolute",
       zIndex: ["z_var", {
-        "--zIndex": maybeCssVar58(zIndices.scrollShadow)
+        "--zIndex": maybeCssVar59(zIndices.scrollShadow)
       }],
       pointerEvents: "pointerEvents_none"
     };
@@ -26147,7 +26224,7 @@ function ScrollShadows(props) {
       ...startShadowStyles2,
       ...{
         background: ["background_var", {
-          "--background": maybeCssVar58(startGradient)
+          "--background": maybeCssVar59(startGradient)
         }]
       }
     }, {
@@ -26155,7 +26232,7 @@ function ScrollShadows(props) {
       ...endShadowStyles2,
       ...{
         background: ["background_var", {
-          "--background": maybeCssVar58(endGradient)
+          "--background": maybeCssVar59(endGradient)
         }]
       }
     }];
@@ -26180,10 +26257,10 @@ function ScrollShadows(props) {
     ref: scrollRef,
     onResize
   });
-  return /* @__PURE__ */ jsxs107("div", { ...trussProps121({
+  return /* @__PURE__ */ jsxs108("div", { ...trussProps122({
     display: "df",
     flexDirection: ["fd_var", {
-      "--flexDirection": maybeCssVar58(!horizontal ? "column" : "row")
+      "--flexDirection": maybeCssVar59(!horizontal ? "column" : "row")
     }],
     position: "relative",
     overflow: "oh",
@@ -26196,23 +26273,23 @@ function ScrollShadows(props) {
       width: width2
     }
   }), ...tid, children: [
-    /* @__PURE__ */ jsx212("div", { ...trussProps121({
+    /* @__PURE__ */ jsx213("div", { ...trussProps122({
       ...startShadowStyles,
       ...{
         opacity: ["o_var", {
-          "--opacity": maybeCssVar58(showStartShadow ? 1 : 0)
+          "--opacity": maybeCssVar59(showStartShadow ? 1 : 0)
         }]
       }
     }), "data-chromatic": "ignore" }),
-    /* @__PURE__ */ jsx212("div", { ...trussProps121({
+    /* @__PURE__ */ jsx213("div", { ...trussProps122({
       ...endShadowStyles,
       ...{
         opacity: ["o_var", {
-          "--opacity": maybeCssVar58(showEndShadow ? 1 : 0)
+          "--opacity": maybeCssVar59(showEndShadow ? 1 : 0)
         }]
       }
     }), "data-chromatic": "ignore" }),
-    /* @__PURE__ */ jsx212("div", { ...trussProps121({
+    /* @__PURE__ */ jsx213("div", { ...trussProps122({
       ...xss,
       ...{
         overflow: "oa",
@@ -26233,7 +26310,7 @@ import {
   useRef as useRef63,
   useState as useState58
 } from "react";
-import { jsx as jsx213 } from "react/jsx-runtime";
+import { jsx as jsx214 } from "react/jsx-runtime";
 var SIDE_NAV_LAYOUT_STATE_STORAGE_KEY = "beam.sideNavLayout.navState";
 function loadStoredNavState() {
   try {
@@ -26281,7 +26358,7 @@ function SideNavLayoutProvider(props) {
     });
   }, []);
   const value = useMemo54(() => ({ navState, setNavState }), [navState, setNavState]);
-  return /* @__PURE__ */ jsx213(SideNavLayoutContext.Provider, { value, children: props.children });
+  return /* @__PURE__ */ jsx214(SideNavLayoutContext.Provider, { value, children: props.children });
 }
 function useSideNavLayoutContext() {
   return useContext27(SideNavLayoutContext) ?? { navState: "expanded", setNavState: () => {
@@ -26292,8 +26369,8 @@ function useHasSideNavLayoutProvider() {
 }
 
 // src/components/SideNav/SideNav.tsx
-import { trussProps as trussProps122 } from "@homebound/truss/runtime";
-import { jsx as jsx214, jsxs as jsxs108 } from "react/jsx-runtime";
+import { trussProps as trussProps123 } from "@homebound/truss/runtime";
+import { jsx as jsx215, jsxs as jsxs109 } from "react/jsx-runtime";
 function SideNav(props) {
   const {
     top,
@@ -26306,8 +26383,8 @@ function SideNav(props) {
   const tid = useTestIds(props, "sideNav");
   const panelCollapsed = navState === "collapse";
   const hideOnCollapse = panelCollapsed && !allItemsHaveIcons(items);
-  return /* @__PURE__ */ jsxs108("nav", { className: "df fdc h100 fs0", ...tid, children: [
-    top !== void 0 && /* @__PURE__ */ jsx214("div", { ...trussProps122({
+  return /* @__PURE__ */ jsxs109("nav", { className: "df fdc h100 fs0", ...tid, children: [
+    top !== void 0 && /* @__PURE__ */ jsx215("div", { ...trussProps123({
       flexShrink: "fs0",
       paddingLeft: "pl2",
       paddingRight: "pr2",
@@ -26318,7 +26395,7 @@ function SideNav(props) {
         paddingBottom: "pb4"
       } : {}
     }), ...tid.top, children: top }),
-    /* @__PURE__ */ jsx214("div", { ...trussProps122({
+    /* @__PURE__ */ jsx215("div", { ...trussProps123({
       flexGrow: "fg1",
       overflowY: "oya",
       display: "df",
@@ -26330,8 +26407,8 @@ function SideNav(props) {
       ...top === void 0 ? {
         paddingTop: "pt5"
       } : {}
-    }), ...tid.items, children: !hideOnCollapse && /* @__PURE__ */ jsx214(AppNavItems, { items, panelCollapsed }) }),
-    footer !== void 0 && /* @__PURE__ */ jsx214("div", { ...trussProps122({
+    }), ...tid.items, children: !hideOnCollapse && /* @__PURE__ */ jsx215(AppNavItems, { items, panelCollapsed }) }),
+    footer !== void 0 && /* @__PURE__ */ jsx215("div", { ...trussProps123({
       flexShrink: "fs0",
       paddingLeft: "pl2",
       paddingRight: "pr2",
@@ -26408,8 +26485,8 @@ var snackbarId = 1;
 // src/components/Stepper.tsx
 import { useRef as useRef64 } from "react";
 import { useButton as useButton12, useFocusRing as useFocusRing18, useHover as useHover21 } from "react-aria";
-import { trussProps as trussProps123, maybeCssVar as maybeCssVar59 } from "@homebound/truss/runtime";
-import { jsx as jsx215, jsxs as jsxs109 } from "react/jsx-runtime";
+import { trussProps as trussProps124, maybeCssVar as maybeCssVar60 } from "@homebound/truss/runtime";
+import { jsx as jsx216, jsxs as jsxs110 } from "react/jsx-runtime";
 import { createElement as createElement6 } from "react";
 var __maybeInc27 = (inc) => {
   return typeof inc === "string" ? inc : `calc(var(--t-spacing) * ${inc})`;
@@ -26428,8 +26505,8 @@ function Stepper(props) {
   const maxStepWidth = 200;
   const minStepWidth = 100;
   const gap = 8;
-  return /* @__PURE__ */ jsxs109("nav", { "aria-label": "steps", className: "df fdc w100", ...tid, children: [
-    /* @__PURE__ */ jsx215("ol", { ...trussProps123({
+  return /* @__PURE__ */ jsxs110("nav", { "aria-label": "steps", className: "df fdc w100", ...tid, children: [
+    /* @__PURE__ */ jsx216("ol", { ...trussProps124({
       padding: "p_0",
       margin: "m_0",
       listStyle: "lis_none",
@@ -26439,7 +26516,7 @@ function Stepper(props) {
       }]
     }), children: steps.map((step) => {
       const isCurrent = currentStep === step.value;
-      return /* @__PURE__ */ createElement6("li", { ...trussProps123({
+      return /* @__PURE__ */ createElement6("li", { ...trussProps124({
         display: "df",
         flexGrow: "fg1",
         flexDirection: "fdc",
@@ -26449,9 +26526,9 @@ function Stepper(props) {
         minWidth: ["mw_var", {
           "--minWidth": `${minStepWidth}px`
         }]
-      }), key: step.label, "aria-current": isCurrent, ...tid.step }, /* @__PURE__ */ jsx215(StepButton, { ...step, onClick: () => onChange(step.value), isCurrent, ...tid.stepButton }));
+      }), key: step.label, "aria-current": isCurrent, ...tid.step }, /* @__PURE__ */ jsx216(StepButton, { ...step, onClick: () => onChange(step.value), isCurrent, ...tid.stepButton }));
     }) }),
-    /* @__PURE__ */ jsx215("div", { ...trussProps123({
+    /* @__PURE__ */ jsx216("div", { ...trussProps124({
       marginTop: "mt1",
       backgroundColor: ["bgColor_var", {
         "--backgroundColor": "var(--b-field-border-default)"
@@ -26464,14 +26541,14 @@ function Stepper(props) {
         "--minWidth": `${steps.length * minStepWidth + (steps.length - 1) * gap}px`
       }],
       width: "w100"
-    }), children: /* @__PURE__ */ jsx215("div", { ...trussProps123({
+    }), children: /* @__PURE__ */ jsx216("div", { ...trussProps124({
       backgroundColor: ["bgColor_var", {
         "--backgroundColor": "var(--b-primary)"
       }],
       transition: "transition_width_200ms",
       height: "h100",
       width: ["w_var", {
-        "--width": maybeCssVar59(__maybeInc27(`${(lastCompletedStep + 1) / steps.length * 100}%`))
+        "--width": maybeCssVar60(__maybeInc27(`${(lastCompletedStep + 1) / steps.length * 100}%`))
       }]
     }) }) })
   ] });
@@ -26507,7 +26584,7 @@ function StepButton(props) {
     boxShadow: "bshFocus"
   };
   const tid = useTestIds(props, "stepButton");
-  return /* @__PURE__ */ jsxs109("button", { ref, ...buttonProps, ...focusProps, ...hoverProps, ...trussProps123({
+  return /* @__PURE__ */ jsxs110("button", { ref, ...buttonProps, ...focusProps, ...hoverProps, ...trussProps124({
     ...{
       fontWeight: "fw6",
       fontSize: "fz_14px",
@@ -26568,7 +26645,7 @@ function StepButton(props) {
     } : {},
     ...isFocusVisible ? focusRingStyles2 : {}
   }), ...tid[defaultTestId(label)], children: [
-    /* @__PURE__ */ jsx215("span", { className: "fs0 mr_4px", children: /* @__PURE__ */ jsx215(StepIcon, { state, isHovered, isPressed, isCurrent }) }),
+    /* @__PURE__ */ jsx216("span", { className: "fs0 mr_4px", children: /* @__PURE__ */ jsx216(StepIcon, { state, isHovered, isPressed, isCurrent }) }),
     label
   ] });
 }
@@ -26579,12 +26656,12 @@ function StepIcon({
   isCurrent = false
 }) {
   if (state === "error") {
-    return /* @__PURE__ */ jsx215(Icon, { icon: "errorCircle" });
+    return /* @__PURE__ */ jsx216(Icon, { icon: "errorCircle" });
   }
   if (state === "complete") {
-    return /* @__PURE__ */ jsx215(Icon, { icon: "check" });
+    return /* @__PURE__ */ jsx216(Icon, { icon: "check" });
   }
-  return /* @__PURE__ */ jsx215("div", { className: "w_24px h_24px df aic jcc", children: /* @__PURE__ */ jsx215("div", { ...trussProps123({
+  return /* @__PURE__ */ jsx216("div", { className: "w_24px h_24px df aic jcc", children: /* @__PURE__ */ jsx216("div", { ...trussProps124({
     width: "w_10px",
     height: "h_10px",
     borderStyle: "bss",
@@ -26600,8 +26677,8 @@ function StepIcon({
 // src/components/StepperTabs/StepperTab.tsx
 import { useRef as useRef65 } from "react";
 import { mergeProps as mergeProps33, useButton as useButton13, useFocusRing as useFocusRing19, useHover as useHover22, VisuallyHidden as VisuallyHidden10 } from "react-aria";
-import { trussProps as trussProps124 } from "@homebound/truss/runtime";
-import { Fragment as Fragment48, jsx as jsx216, jsxs as jsxs110 } from "react/jsx-runtime";
+import { trussProps as trussProps125 } from "@homebound/truss/runtime";
+import { Fragment as Fragment48, jsx as jsx217, jsxs as jsxs111 } from "react/jsx-runtime";
 function StepperTab(props) {
   const {
     label,
@@ -26632,7 +26709,7 @@ function StepperTab(props) {
   const isHovered = __storyState?.hovered ?? isHoveredFromEvents;
   const isFocusVisible = __storyState?.focusVisible ?? isFocusVisibleFromEvents;
   const tid = useTestIds(props, "stepperTab");
-  return /* @__PURE__ */ jsxs110("button", { ref, ...mergeProps33(buttonProps, focusProps, hoverProps), "aria-label": label, ...trussProps124({
+  return /* @__PURE__ */ jsxs111("button", { ref, ...mergeProps33(buttonProps, focusProps, hoverProps), "aria-label": label, ...trussProps125({
     ...stepperTabStyles.baseStyles,
     ...getStateStyles(active, completed),
     ...isHovered && !disabled ? stepperTabStyles.hoverStyles : {},
@@ -26640,10 +26717,10 @@ function StepperTab(props) {
     ...disabled ? stepperTabStyles.disabledStyles : {},
     ...isFocusVisible ? stepperTabStyles.focusRingStyles : {}
   }), ...tid[defaultTestId(value)], children: [
-    !collapsed && /* @__PURE__ */ jsxs110(Fragment48, { children: [
-      /* @__PURE__ */ jsxs110("span", { className: "dg jic mw0", children: [
-        /* @__PURE__ */ jsx216("span", { className: "fw6 fz_14px lh_20px visibility_hidden gridArea_1_1 oh d_negwebkit_box wbo_vertical to_ellipsis wlc_1 wordBreak_break_all", "aria-hidden": true, children: label }),
-        /* @__PURE__ */ jsx216("span", { ...trussProps124({
+    !collapsed && /* @__PURE__ */ jsxs111(Fragment48, { children: [
+      /* @__PURE__ */ jsxs111("span", { className: "dg jic mw0", children: [
+        /* @__PURE__ */ jsx217("span", { className: "fw6 fz_14px lh_20px visibility_hidden gridArea_1_1 oh d_negwebkit_box wbo_vertical to_ellipsis wlc_1 wordBreak_break_all", "aria-hidden": true, children: label }),
+        /* @__PURE__ */ jsx217("span", { ...trussProps125({
           gridArea: "gridArea_1_1",
           overflow: "oh",
           display: "d_negwebkit_box",
@@ -26658,7 +26735,7 @@ function StepperTab(props) {
           } : {}
         }), children: label })
       ] }),
-      /* @__PURE__ */ jsx216("span", { ...trussProps124({
+      /* @__PURE__ */ jsx217("span", { ...trussProps125({
         flexShrink: "fs0",
         marginLeft: "ml1",
         transition: "transitionAll",
@@ -26668,10 +26745,10 @@ function StepperTab(props) {
           opacity: "o100",
           transform: "transform_scale_1_translateY_0"
         } : {}
-      }), children: /* @__PURE__ */ jsx216(Icon, { icon: "check", inc: 2.5, ...tid.check }) })
+      }), children: /* @__PURE__ */ jsx217(Icon, { icon: "check", inc: 2.5, ...tid.check }) })
     ] }),
-    /* @__PURE__ */ jsx216("span", { "aria-hidden": true, ...trussProps124(getIndicatorStyles(active, completed, disabled)), ...tid.indicator }),
-    /* @__PURE__ */ jsx216(VisuallyHidden10, { children: completed ? "Complete" : "Not Complete" })
+    /* @__PURE__ */ jsx217("span", { "aria-hidden": true, ...trussProps125(getIndicatorStyles(active, completed, disabled)), ...tid.indicator }),
+    /* @__PURE__ */ jsx217(VisuallyHidden10, { children: completed ? "Complete" : "Not Complete" })
   ] });
 }
 function getStateStyles(active, completed) {
@@ -26752,8 +26829,8 @@ var stepperTabStyles = {
 };
 
 // src/components/StepperTabs/StepperTabs.tsx
-import { trussProps as trussProps125 } from "@homebound/truss/runtime";
-import { jsx as jsx217 } from "react/jsx-runtime";
+import { trussProps as trussProps126 } from "@homebound/truss/runtime";
+import { jsx as jsx218 } from "react/jsx-runtime";
 import { createElement as createElement7 } from "react";
 function StepperTabs(props) {
   const {
@@ -26769,7 +26846,7 @@ function StepperTabs(props) {
   const collapsed = isMobile || !!forceCollapsed;
   const capWidth = steps.length <= 3;
   const currentStepIndex = Math.max(0, steps.findIndex((step) => step.value === currentStep));
-  return /* @__PURE__ */ jsx217("nav", { "aria-label": "steps", className: "w100", ...tid, children: /* @__PURE__ */ jsx217("ol", { ...trussProps125({
+  return /* @__PURE__ */ jsx218("nav", { "aria-label": "steps", className: "w100", ...tid, children: /* @__PURE__ */ jsx218("ol", { ...trussProps126({
     padding: "p_0",
     margin: "m_0",
     listStyle: "lis_none",
@@ -26784,7 +26861,7 @@ function StepperTabs(props) {
   }), children: steps.map((step, idx) => {
     const isCurrent = idx === currentStepIndex;
     const isCompleted = idx < currentStepIndex;
-    return /* @__PURE__ */ createElement7("li", { ...trussProps125({
+    return /* @__PURE__ */ createElement7("li", { ...trussProps126({
       display: "df",
       flexGrow: "fg1",
       flexBasis: "fb_0",
@@ -26796,7 +26873,7 @@ function StepperTabs(props) {
           "--maxWidth": `${maxStepWidthPx}px`
         }]
       } : {}
-    }), key: step.value, "aria-current": isCurrent, ...tid.step }, /* @__PURE__ */ jsx217(StepperTab, { label: step.label, value: step.value, active: isCurrent, completed: isCompleted, disabled: step.disabled, collapsed, onClick: onChange, ...tid.tab }));
+    }), key: step.value, "aria-current": isCurrent, ...tid.step }, /* @__PURE__ */ jsx218(StepperTab, { label: step.label, value: step.value, active: isCurrent, completed: isCompleted, disabled: step.disabled, collapsed, onClick: onChange, ...tid.tab }));
   }) }) });
 }
 var maxStepWidthPx = 280;
@@ -26804,8 +26881,8 @@ var gapPx = 6;
 
 // src/components/SuperDrawer/components/SuperDrawerHeader.tsx
 import { createPortal as createPortal8 } from "react-dom";
-import { trussProps as trussProps126 } from "@homebound/truss/runtime";
-import { jsx as jsx218, jsxs as jsxs111 } from "react/jsx-runtime";
+import { trussProps as trussProps127 } from "@homebound/truss/runtime";
+import { jsx as jsx219, jsxs as jsxs112 } from "react/jsx-runtime";
 function SuperDrawerHeader(props) {
   const {
     hideControls
@@ -26822,20 +26899,20 @@ function SuperDrawerHeader(props) {
   const currentContent = contentStack.current[contentStack.current.length - 1]?.opts;
   const isDetail = currentContent !== firstContent;
   const tid = useTestIds({}, "superDrawerHeader");
-  return createPortal8(/* @__PURE__ */ jsxs111("div", { className: "df aic jcsb gap3", ...tid, children: [
-    isStructuredProps(props) ? /* @__PURE__ */ jsxs111("div", { className: "df jcsb aic gap2 fg1", children: [
-      /* @__PURE__ */ jsxs111("div", { className: "fg1 df aic gap2", children: [
-        /* @__PURE__ */ jsx218("h1", { className: "fw6 fz_30px lh_36px", children: props.title }),
+  return createPortal8(/* @__PURE__ */ jsxs112("div", { className: "df aic jcsb gap3", ...tid, children: [
+    isStructuredProps(props) ? /* @__PURE__ */ jsxs112("div", { className: "df jcsb aic gap2 fg1", children: [
+      /* @__PURE__ */ jsxs112("div", { className: "fg1 df aic gap2", children: [
+        /* @__PURE__ */ jsx219("h1", { className: "fw6 fz_30px lh_36px", children: props.title }),
         props.left
       ] }),
-      props.right && /* @__PURE__ */ jsx218("div", { className: "fs0", children: props.right })
-    ] }) : /* @__PURE__ */ jsx218("div", { className: "fg1", children: props.children }),
-    !hideControls && /* @__PURE__ */ jsx218("div", { ...trussProps126({
+      props.right && /* @__PURE__ */ jsx219("div", { className: "fs0", children: props.right })
+    ] }) : /* @__PURE__ */ jsx219("div", { className: "fg1", children: props.children }),
+    !hideControls && /* @__PURE__ */ jsx219("div", { ...trussProps127({
       flexShrink: "fs0",
       ...isDetail ? {
         visibility: "vh"
       } : {}
-    }), children: /* @__PURE__ */ jsx218(ButtonGroup, { buttons: [{
+    }), children: /* @__PURE__ */ jsx219(ButtonGroup, { buttons: [{
       icon: "chevronLeft",
       onClick: () => onPrevClick && onPrevClick(),
       disabled: !onPrevClick
@@ -26855,7 +26932,7 @@ import { motion as motion7 } from "framer-motion";
 
 // src/components/SuperDrawer/useSuperDrawer.tsx
 import { useMemo as useMemo55 } from "react";
-import { jsx as jsx219 } from "react/jsx-runtime";
+import { jsx as jsx220 } from "react/jsx-runtime";
 function useSuperDrawer() {
   const {
     drawerContentStack: contentStack,
@@ -26867,7 +26944,7 @@ function useSuperDrawer() {
   function canCloseDrawerDetails(i, doChange) {
     for (const canCloseDrawerDetail of canCloseDetailsChecks.current[i] ?? []) {
       if (!canClose(canCloseDrawerDetail)) {
-        openModal({ content: /* @__PURE__ */ jsx219(ConfirmCloseModal, { onClose: doChange, ...canCloseDrawerDetail }) });
+        openModal({ content: /* @__PURE__ */ jsx220(ConfirmCloseModal, { onClose: doChange, ...canCloseDrawerDetail }) });
         return false;
       }
     }
@@ -26887,7 +26964,7 @@ function useSuperDrawer() {
     for (const canCloseDrawer of canCloseChecks.current) {
       if (!canClose(canCloseDrawer)) {
         openModal({
-          content: /* @__PURE__ */ jsx219(ConfirmCloseModal, { onClose: doChange, ...canCloseDrawer })
+          content: /* @__PURE__ */ jsx220(ConfirmCloseModal, { onClose: doChange, ...canCloseDrawer })
         });
         return;
       }
@@ -26982,8 +27059,8 @@ function canClose(canCloseCheck) {
 }
 
 // src/components/SuperDrawer/SuperDrawerContent.tsx
-import { trussProps as trussProps127, mergeProps as mergeProps34 } from "@homebound/truss/runtime";
-import { Fragment as Fragment49, jsx as jsx220, jsxs as jsxs112 } from "react/jsx-runtime";
+import { trussProps as trussProps128, mergeProps as mergeProps34 } from "@homebound/truss/runtime";
+import { Fragment as Fragment49, jsx as jsx221, jsxs as jsxs113 } from "react/jsx-runtime";
 var SuperDrawerContent = ({
   children,
   banner,
@@ -27004,20 +27081,20 @@ var SuperDrawerContent = ({
   } = firstContent ?? {};
   function wrapWithMotionAndMaybeBack(children2) {
     if (kind === "open") {
-      return /* @__PURE__ */ jsxs112(motion7.div, { className: "pt3 pb3 pr3 pl3 fg1 oa", children: [
-        banner && /* @__PURE__ */ jsx220("div", { className: "ml_neg3 mr_neg3 mt_neg3 mb3", children: banner }),
+      return /* @__PURE__ */ jsxs113(motion7.div, { className: "pt3 pb3 pr3 pl3 fg1 oa", children: [
+        banner && /* @__PURE__ */ jsx221("div", { className: "ml_neg3 mr_neg3 mt_neg3 mb3", children: banner }),
         children2
       ] }, "content");
     } else if (kind === "detail") {
-      return /* @__PURE__ */ jsxs112(motion7.div, { className: "pl3 pr3 pt2 pb3 fg1", animate: {
+      return /* @__PURE__ */ jsxs113(motion7.div, { className: "pl3 pr3 pt2 pb3 fg1", animate: {
         overflow: "auto"
       }, transition: {
         overflow: {
           delay: 0.3
         }
       }, children: [
-        /* @__PURE__ */ jsx220(Button, { label: "Back", icon: "chevronLeft", variant: "tertiary", onClick: closeDrawerDetail }),
-        /* @__PURE__ */ jsx220(motion7.div, { initial: {
+        /* @__PURE__ */ jsx221(Button, { label: "Back", icon: "chevronLeft", variant: "tertiary", onClick: closeDrawerDetail }),
+        /* @__PURE__ */ jsx221(motion7.div, { initial: {
           x: width2,
           opacity: 0
         }, animate: {
@@ -27035,7 +27112,7 @@ var SuperDrawerContent = ({
         }, className: "pt2", children: children2 })
       ] }, "content");
     } else {
-      return /* @__PURE__ */ jsx220(motion7.div, { ...mergeProps34(void 0, {
+      return /* @__PURE__ */ jsx221(motion7.div, { ...mergeProps34(void 0, {
         overflow: "auto"
       }, {
         paddingTop: "pt3",
@@ -27046,9 +27123,9 @@ var SuperDrawerContent = ({
       }) }, "content");
     }
   }
-  return /* @__PURE__ */ jsxs112(Fragment49, { children: [
+  return /* @__PURE__ */ jsxs113(Fragment49, { children: [
     wrapWithMotionAndMaybeBack(children),
-    actions && /* @__PURE__ */ jsx220("footer", { ...trussProps127({
+    actions && /* @__PURE__ */ jsx221("footer", { ...trussProps128({
       borderTopStyle: "bts_solid",
       borderTopWidth: "btw_1px",
       borderColor: ["bc_var", {
@@ -27061,7 +27138,7 @@ var SuperDrawerContent = ({
       display: "df",
       alignItems: "aic",
       justifyContent: "jcfe"
-    }), children: /* @__PURE__ */ jsx220("div", { className: "df gap1", children: actions.map((buttonProps, i) => /* @__PURE__ */ jsx220(Button, { ...buttonProps }, i)) }) })
+    }), children: /* @__PURE__ */ jsx221("div", { className: "df gap1", children: actions.map((buttonProps, i) => /* @__PURE__ */ jsx221(Button, { ...buttonProps }, i)) }) })
   ] });
 };
 
@@ -27121,15 +27198,15 @@ import { useEffect as useEffect38, useMemo as useMemo56, useRef as useRef66, use
 import { mergeProps as mergeProps35, useFocusRing as useFocusRing20, useHover as useHover23 } from "react-aria";
 import { matchPath } from "react-router";
 import { Link as Link7, useLocation as useLocation2 } from "react-router-dom";
-import { trussProps as trussProps128, maybeCssVar as maybeCssVar60 } from "@homebound/truss/runtime";
-import { Fragment as Fragment50, jsx as jsx221, jsxs as jsxs113 } from "react/jsx-runtime";
+import { trussProps as trussProps129, maybeCssVar as maybeCssVar61 } from "@homebound/truss/runtime";
+import { Fragment as Fragment50, jsx as jsx222, jsxs as jsxs114 } from "react/jsx-runtime";
 function TabsWithContent(props) {
   const styles = hideTabs(props) ? {} : {
     paddingTop: "pt3"
   };
-  return /* @__PURE__ */ jsxs113(Fragment50, { children: [
-    /* @__PURE__ */ jsx221(Tabs, { ...props }),
-    /* @__PURE__ */ jsx221(TabContent, { ...props, contentXss: {
+  return /* @__PURE__ */ jsxs114(Fragment50, { children: [
+    /* @__PURE__ */ jsx222(Tabs, { ...props }),
+    /* @__PURE__ */ jsx222(TabContent, { ...props, contentXss: {
       ...styles,
       ...props.contentXss
     } })
@@ -27154,7 +27231,7 @@ function TabContent(props) {
   return (
     // Using FullBleed to allow the tab's bgColor to extend to the edges of the <ScrollableContent /> element.
     // Omit the padding from `FullBleed` if the caller passes in the `paddingLeft/Right` styles.
-    /* @__PURE__ */ jsx221(FullBleed, { omitPadding: omitFullBleedPadding, children: /* @__PURE__ */ jsx221("div", { "aria-labelledby": `${uniqueValue}-tab`, id: `${uniqueValue}-tabPanel`, role: "tabpanel", tabIndex: 0, ...tid.panel, ...trussProps128(contentXss), children: selectedTab.render() }) })
+    /* @__PURE__ */ jsx222(FullBleed, { omitPadding: omitFullBleedPadding, children: /* @__PURE__ */ jsx222("div", { "aria-labelledby": `${uniqueValue}-tab`, id: `${uniqueValue}-tabPanel`, role: "tabpanel", tabIndex: 0, ...tid.panel, ...trussProps129(contentXss), children: selectedTab.render() }) })
   );
 }
 function Tabs(props) {
@@ -27196,7 +27273,7 @@ function Tabs(props) {
       setActive(selected);
     }
   }
-  return /* @__PURE__ */ jsxs113("div", { ...trussProps128({
+  return /* @__PURE__ */ jsxs114("div", { ...trussProps129({
     ...{
       display: "df",
       alignItems: "aic",
@@ -27214,11 +27291,11 @@ function Tabs(props) {
       }
     } : {}
   }), children: [
-    !hideTabs(props) && /* @__PURE__ */ jsx221("div", { ref, className: "dif gap1 asfe", "aria-label": ariaLabel, role: "tablist", ...tid, children: tabs.map((tab) => {
+    !hideTabs(props) && /* @__PURE__ */ jsx222("div", { ref, className: "dif gap1 asfe", "aria-label": ariaLabel, role: "tablist", ...tid, children: tabs.map((tab) => {
       const uniqueValue = uniqueTabValue(tab);
-      return /* @__PURE__ */ jsx221(TabImpl, { active: active === uniqueValue, focusProps, isFocusVisible, onClick, onKeyUp, onBlur, tab, ...tid[defaultTestId(uniqueValue)] }, uniqueValue);
+      return /* @__PURE__ */ jsx222(TabImpl, { active: active === uniqueValue, focusProps, isFocusVisible, onClick, onKeyUp, onBlur, tab, ...tid[defaultTestId(uniqueValue)] }, uniqueValue);
     }) }),
-    right && /* @__PURE__ */ jsx221("div", { className: "mla df aic gap1 pb1", children: right })
+    right && /* @__PURE__ */ jsx222("div", { className: "mla df aic gap1 pb1", children: right })
   ] });
 }
 function TabImpl(props) {
@@ -27264,7 +27341,7 @@ function TabImpl(props) {
     role: "tab",
     tabIndex: active ? 0 : -1,
     ...others,
-    ...trussProps128({
+    ...trussProps129({
       ...baseStyles4,
       // Only tints the label while the tab is unselected; selected keeps its own darker treatment.
       ...aiMode && aiStyles,
@@ -27282,18 +27359,18 @@ function TabImpl(props) {
       onClick: () => onClick(tab.value)
     }
   });
-  const decoration = aiMode ? /* @__PURE__ */ jsx221(AiBadge, {}) : icon ? /* @__PURE__ */ jsx221(Icon, { icon }) : endAdornment;
-  const tabLabel = /* @__PURE__ */ jsxs113(Fragment50, { children: [
+  const decoration = aiMode ? /* @__PURE__ */ jsx222(AiBadge, {}) : icon ? /* @__PURE__ */ jsx222(Icon, { icon }) : endAdornment;
+  const tabLabel = /* @__PURE__ */ jsxs114(Fragment50, { children: [
     label,
-    decoration && /* @__PURE__ */ jsx221("span", { className: "ml1 df aic", children: decoration })
+    decoration && /* @__PURE__ */ jsx222("span", { className: "ml1 df aic", children: decoration })
   ] });
   return isDisabled ? maybeTooltip({
     title: resolveTooltip(disabled),
     placement: "top",
-    children: /* @__PURE__ */ jsx221("div", { ...tabProps, children: tabLabel })
-  }) : isRouteTab(tab) ? /* @__PURE__ */ jsx221(Link7, { ...mergeProps35(tabProps, interactiveProps, {
+    children: /* @__PURE__ */ jsx222("div", { ...tabProps, children: tabLabel })
+  }) : isRouteTab(tab) ? /* @__PURE__ */ jsx222(Link7, { ...mergeProps35(tabProps, interactiveProps, {
     className: "navLink"
-  }), to: tab.href, children: tabLabel }) : /* @__PURE__ */ jsx221("button", { ...{
+  }), to: tab.href, children: tabLabel }) : /* @__PURE__ */ jsx222("button", { ...{
     ...tabProps,
     ...interactiveProps
   }, children: tabLabel });
@@ -27304,7 +27381,7 @@ function getTabStyles() {
   const borderBottomStyles = {
     borderBottomStyle: "bbs_solid",
     borderBottomWidth: ["borderBottomWidth_var", {
-      "--borderBottomWidth": maybeCssVar60(`${borderBottomWidthPx}px`)
+      "--borderBottomWidth": maybeCssVar61(`${borderBottomWidthPx}px`)
     }],
     paddingBottom: ["pb_var", {
       "--paddingBottom": `${verticalPaddingPx - borderBottomWidthPx}px`
@@ -27357,7 +27434,7 @@ function getTabStyles() {
     // The AI label tint is part of the brand ramp rather than a semantic token, same as the sparkle's gradient.
     aiStyles: {
       color: ["color_var", {
-        "--color": maybeCssVar60("rgba(109, 40, 217, 1)" /* Purple700 */)
+        "--color": maybeCssVar61("rgba(109, 40, 217, 1)" /* Purple700 */)
       }]
     },
     focusRingStyles: {
@@ -27407,7 +27484,7 @@ function hideTabs(props) {
 }
 
 // src/components/TagGroup.tsx
-import { jsx as jsx222, jsxs as jsxs114 } from "react/jsx-runtime";
+import { jsx as jsx223, jsxs as jsxs115 } from "react/jsx-runtime";
 function TagGroup(props) {
   const {
     tags,
@@ -27415,9 +27492,9 @@ function TagGroup(props) {
     ...otherProps
   } = props;
   const tid = useTestIds(otherProps, "tagGroup");
-  return /* @__PURE__ */ jsxs114("div", { ...tid, className: "df aic fww gap1", children: [
-    tags.map((tag) => /* @__PURE__ */ jsx222(Tag, { ...tag, variant: "secondary" }, tag.text)),
-    onEdit && /* @__PURE__ */ jsx222("span", { className: "ml1 fw4 fz_14px lh_20px", children: /* @__PURE__ */ jsx222(Button, { label: "Edit", variant: "text", onClick: onEdit, ...tid.edit }) })
+  return /* @__PURE__ */ jsxs115("div", { ...tid, className: "df aic fww gap1", children: [
+    tags.map((tag) => /* @__PURE__ */ jsx223(Tag, { ...tag, variant: "secondary" }, tag.text)),
+    onEdit && /* @__PURE__ */ jsx223("span", { className: "ml1 fw4 fz_14px lh_20px", children: /* @__PURE__ */ jsx223(Button, { label: "Edit", variant: "text", onClick: onEdit, ...tid.edit }) })
   ] });
 }
 
@@ -27430,15 +27507,15 @@ function useToast() {
 }
 
 // src/layouts/SideNavLayout/SideNavLayout.tsx
-import { trussProps as trussProps129, mergeProps as mergeProps36, maybeCssVar as maybeCssVar61 } from "@homebound/truss/runtime";
-import { jsx as jsx223, jsxs as jsxs115 } from "react/jsx-runtime";
+import { trussProps as trussProps130, mergeProps as mergeProps36, maybeCssVar as maybeCssVar62 } from "@homebound/truss/runtime";
+import { jsx as jsx224, jsxs as jsxs116 } from "react/jsx-runtime";
 var __maybeInc28 = (inc) => {
   return typeof inc === "string" ? inc : `calc(var(--t-spacing) * ${inc})`;
 };
 function SideNavLayout(props) {
   const hasProvider = useHasSideNavLayoutProvider();
-  if (hasProvider) return /* @__PURE__ */ jsx223(SideNavLayoutContent, { ...props });
-  return /* @__PURE__ */ jsx223(SideNavLayoutProvider, { children: /* @__PURE__ */ jsx223(SideNavLayoutContent, { ...props }) });
+  if (hasProvider) return /* @__PURE__ */ jsx224(SideNavLayoutContent, { ...props });
+  return /* @__PURE__ */ jsx224(SideNavLayoutProvider, { children: /* @__PURE__ */ jsx224(SideNavLayoutContent, { ...props }) });
 }
 function SideNavLayoutContent(props) {
   const {
@@ -27461,7 +27538,7 @@ function SideNavLayoutContent(props) {
   const railOffsetPx = !showRail ? 0 : !bp.mdAndUp || collapsed ? railCollapsedWidthPx : railWidthPx;
   const navTop = bannerAndNavbarChromeTop();
   const railViewportHeight = `calc(var(${beamLayoutViewportHeightVar}, 100vh) - var(${beamEnvironmentBannerLayoutHeightVar}, 0px) - var(${beamNavbarLayoutHeightVar}, 0px))`;
-  const rail = showRail && /* @__PURE__ */ jsxs115("div", { ...trussProps129({
+  const rail = showRail && /* @__PURE__ */ jsxs116("div", { ...trussProps130({
     ...{
       display: "df",
       flexDirection: "fdc",
@@ -27485,14 +27562,14 @@ function SideNavLayoutContent(props) {
       position: "sticky",
       left: "left0",
       zIndex: ["z_var", {
-        "--zIndex": maybeCssVar61(zIndices.sideNav)
+        "--zIndex": maybeCssVar62(zIndices.sideNav)
       }],
       top: ["top_var", {
-        "--top": maybeCssVar61(__maybeInc28(navTop))
+        "--top": maybeCssVar62(__maybeInc28(navTop))
       }],
       alignSelf: "asfs",
       height: ["h_var", {
-        "--height": maybeCssVar61(__maybeInc28(railViewportHeight))
+        "--height": maybeCssVar62(__maybeInc28(railViewportHeight))
       }],
       width: ["w_var", {
         "--width": `${collapsed ? railCollapsedWidthPx : railWidthPx}px`
@@ -27502,11 +27579,11 @@ function SideNavLayoutContent(props) {
         position: "fixed",
         left: "left0",
         top: ["top_var", {
-          "--top": maybeCssVar61(__maybeInc28(navTop))
+          "--top": maybeCssVar62(__maybeInc28(navTop))
         }],
         bottom: "bottom0",
         zIndex: ["z_var", {
-          "--zIndex": maybeCssVar61(zIndices.sideNav)
+          "--zIndex": maybeCssVar62(zIndices.sideNav)
         }]
       },
       ...collapsed ? {
@@ -27518,18 +27595,18 @@ function SideNavLayoutContent(props) {
       }
     }
   }), ...tid.sideNav, children: [
-    showCollapseToggle && /* @__PURE__ */ jsx223("div", { className: "absolute right2 top2 z2", children: /* @__PURE__ */ jsx223(IconButton, { icon: collapsed ? "menuOpen" : "menuClose", label: collapsed ? "Expand navigation" : "Collapse navigation", onClick: () => setNavState(collapsed ? "expanded" : "collapse"), ...tid.toggle }) }),
-    /* @__PURE__ */ jsx223("div", { className: "fg1 mh0 df fdc", ...tid.sideNavContent, children: /* @__PURE__ */ jsx223(SideNav, { ...sideNav }) })
+    showCollapseToggle && /* @__PURE__ */ jsx224("div", { className: "absolute right2 top2 z2", children: /* @__PURE__ */ jsx224(IconButton, { icon: collapsed ? "menuOpen" : "menuClose", label: collapsed ? "Expand navigation" : "Collapse navigation", onClick: () => setNavState(collapsed ? "expanded" : "collapse"), ...tid.toggle }) }),
+    /* @__PURE__ */ jsx224("div", { className: "fg1 mh0 df fdc", ...tid.sideNavContent, children: /* @__PURE__ */ jsx224(SideNav, { ...sideNav }) })
   ] });
-  return /* @__PURE__ */ jsx223(DocumentScrollLayoutProvider, { children: /* @__PURE__ */ jsxs115("div", { ...mergeProps36(void 0, {
+  return /* @__PURE__ */ jsx224(DocumentScrollLayoutProvider, { children: /* @__PURE__ */ jsxs116("div", { ...mergeProps36(void 0, {
     [beamSideNavLayoutWidthVar]: `${railOffsetPx}px`
   }, {
     display: "df",
     flexDirection: "fdr",
     width: "w100"
   }), ...tid, children: [
-    contrastRail ? /* @__PURE__ */ jsx223(ContrastScope, { children: rail }) : rail,
-    /* @__PURE__ */ jsx223("div", { ...trussProps129({
+    contrastRail ? /* @__PURE__ */ jsx224(ContrastScope, { children: rail }) : rail,
+    /* @__PURE__ */ jsx224("div", { ...trussProps130({
       display: "df",
       flexDirection: "fdc",
       flexGrow: "fg1",
@@ -27545,8 +27622,8 @@ function SideNavLayoutContent(props) {
 }
 
 // src/layouts/CenteredLayout/CenteredLayout.tsx
-import { mergeProps as mergeProps37, maybeCssVar as maybeCssVar62 } from "@homebound/truss/runtime";
-import { jsx as jsx224 } from "react/jsx-runtime";
+import { mergeProps as mergeProps37, maybeCssVar as maybeCssVar63 } from "@homebound/truss/runtime";
+import { jsx as jsx225 } from "react/jsx-runtime";
 var __maybeInc29 = (inc) => {
   return typeof inc === "string" ? inc : `calc(var(--t-spacing) * ${inc})`;
 };
@@ -27559,7 +27636,7 @@ function CenteredLayout(props) {
   const {
     mdAndUp
   } = useBreakpoint();
-  return /* @__PURE__ */ jsx224("div", { ...mergeProps37(void 0, {
+  return /* @__PURE__ */ jsx225("div", { ...mergeProps37(void 0, {
     // layoutContainer descendants (e.g. ContentHeader) read this to inset sticky horizontal chrome within the shell padding.
     [beamLayoutContentPaddingXVar]: mdAndUp ? mdAndUpContentPaddingX : smContentPaddingX
   }, {
@@ -27587,16 +27664,16 @@ var smContentPaddingX = "12px";
 var mdAndUpContentPaddingX = pageContentPaddingXValue;
 var centeredPaddingX = {
   paddingLeft: ["px_var mdandup_pl3", {
-    "--paddingLeft": maybeCssVar62(__maybeInc29(smContentPaddingX))
+    "--paddingLeft": maybeCssVar63(__maybeInc29(smContentPaddingX))
   }],
   paddingRight: ["px_var mdandup_pr3", {
-    "--paddingRight": maybeCssVar62(__maybeInc29(smContentPaddingX))
+    "--paddingRight": maybeCssVar63(__maybeInc29(smContentPaddingX))
   }]
 };
 
 // src/layouts/EnvironmentBannerLayout/EnvironmentBannerLayout.tsx
-import { trussProps as trussProps130, mergeProps as mergeProps38, maybeCssVar as maybeCssVar63 } from "@homebound/truss/runtime";
-import { jsx as jsx225, jsxs as jsxs116 } from "react/jsx-runtime";
+import { trussProps as trussProps131, mergeProps as mergeProps38, maybeCssVar as maybeCssVar64 } from "@homebound/truss/runtime";
+import { jsx as jsx226, jsxs as jsxs117 } from "react/jsx-runtime";
 var __maybeInc30 = (inc) => {
   return typeof inc === "string" ? inc : `calc(var(--t-spacing) * ${inc})`;
 };
@@ -27612,35 +27689,35 @@ function EnvironmentBannerLayout(props) {
     [beamEnvironmentBannerLayoutHeightVar]: `${bannerHeightPx}px`
   };
   const innerWidth = `var(${beamLayoutViewportWidthVar}, 100vw)`;
-  return /* @__PURE__ */ jsx225(DocumentScrollLayoutProvider, { children: /* @__PURE__ */ jsx225(EnvironmentBannerLayoutHeightProvider, { value: bannerHeightPx, children: /* @__PURE__ */ jsxs116("div", { ...mergeProps38(void 0, style, {
+  return /* @__PURE__ */ jsx226(DocumentScrollLayoutProvider, { children: /* @__PURE__ */ jsx226(EnvironmentBannerLayoutHeightProvider, { value: bannerHeightPx, children: /* @__PURE__ */ jsxs117("div", { ...mergeProps38(void 0, style, {
     display: "df",
     flexDirection: "fdc",
     width: "wfc",
     minWidth: "mw100"
   }), ...tid, children: [
-    showBanner && environmentBanner && /* @__PURE__ */ jsx225("div", { ...mergeProps38(void 0, {
+    showBanner && environmentBanner && /* @__PURE__ */ jsx226("div", { ...mergeProps38(void 0, {
       height: environmentBannerSizePx
     }, {
       flexShrink: "fs0",
       width: "w100"
-    }), children: /* @__PURE__ */ jsx225("div", { ...trussProps130({
+    }), children: /* @__PURE__ */ jsx226("div", { ...trussProps131({
       position: "fixed",
       top: "top0",
       left: "left0",
       zIndex: ["z_var", {
-        "--zIndex": maybeCssVar63(zIndices.environmentBanner)
+        "--zIndex": maybeCssVar64(zIndices.environmentBanner)
       }],
       width: ["w_var", {
-        "--width": maybeCssVar63(__maybeInc30(innerWidth))
+        "--width": maybeCssVar64(__maybeInc30(innerWidth))
       }]
-    }), ...tid.bannerSticky, children: /* @__PURE__ */ jsx225(EnvironmentBanner, { ...environmentBanner, ...tid.environmentBanner }) }) }),
+    }), ...tid.bannerSticky, children: /* @__PURE__ */ jsx226(EnvironmentBanner, { ...environmentBanner, ...tid.environmentBanner }) }) }),
     children
   ] }) }) });
 }
 
 // src/layouts/FormSectionLayout/FormSectionLayout.tsx
-import { trussProps as trussProps131 } from "@homebound/truss/runtime";
-import { jsx as jsx226, jsxs as jsxs117 } from "react/jsx-runtime";
+import { trussProps as trussProps132 } from "@homebound/truss/runtime";
+import { jsx as jsx227, jsxs as jsxs118 } from "react/jsx-runtime";
 function FormSectionLayout(props) {
   const {
     title,
@@ -27652,7 +27729,7 @@ function FormSectionLayout(props) {
     aiMode = false
   } = props;
   const tid = useTestIds(props, "formSectionLayout");
-  const content = /* @__PURE__ */ jsxs117("div", { ...trussProps131({
+  const content = /* @__PURE__ */ jsxs118("div", { ...trussProps132({
     display: "df",
     flexDirection: "fdc",
     gap: "gap8",
@@ -27663,18 +27740,18 @@ function FormSectionLayout(props) {
       paddingLeft: "pl3"
     } : {}
   }), children: [
-    /* @__PURE__ */ jsxs117("div", { className: "df fdc gap3", children: [
-      /* @__PURE__ */ jsx226(ContentHeader, { ...tid, title, description, actions, withAutoSave, level: 2, aiMode }),
+    /* @__PURE__ */ jsxs118("div", { className: "df fdc gap3", children: [
+      /* @__PURE__ */ jsx227(ContentHeader, { ...tid, title, description, actions, withAutoSave, level: 2, aiMode }),
       initialFields
     ] }),
-    sections && /* @__PURE__ */ jsx226("div", { className: "df fdc gap8", children: sections.map((section, i) => /* @__PURE__ */ jsx226(FormSection, { ...section }, defaultTestId(section.title) || i)) })
+    sections && /* @__PURE__ */ jsx227("div", { className: "df fdc gap8", children: sections.map((section, i) => /* @__PURE__ */ jsx227(FormSection, { ...section }, defaultTestId(section.title) || i)) })
   ] });
-  return /* @__PURE__ */ jsx226(CenteredLayout, { size: "sm", children: aiMode ? /* @__PURE__ */ jsx226(AiCard, { size: "lg", ...tid, children: content }) : content });
+  return /* @__PURE__ */ jsx227(CenteredLayout, { size: "sm", children: aiMode ? /* @__PURE__ */ jsx227(AiCard, { size: "lg", ...tid, children: content }) : content });
 }
 
 // src/layouts/NavbarLayout/NavbarLayout.tsx
 import { useMemo as useMemo57, useRef as useRef68 } from "react";
-import { mergeProps as mergeProps39, maybeCssVar as maybeCssVar64 } from "@homebound/truss/runtime";
+import { mergeProps as mergeProps39, maybeCssVar as maybeCssVar65 } from "@homebound/truss/runtime";
 
 // src/layouts/useAutoHideOnScroll.ts
 import { useLayoutEffect as useLayoutEffect11, useRef as useRef67, useState as useState60 } from "react";
@@ -27785,17 +27862,17 @@ function useMeasuredHeight(ref, enabled) {
 
 // src/layouts/NavbarLayout/NavbarLayoutHeightContext.tsx
 import { createContext as createContext16, useContext as useContext28 } from "react";
-import { jsx as jsx227 } from "react/jsx-runtime";
+import { jsx as jsx228 } from "react/jsx-runtime";
 var NavbarLayoutHeightContext = createContext16(0);
 function NavbarLayoutHeightProvider({ value, children }) {
-  return /* @__PURE__ */ jsx227(NavbarLayoutHeightContext.Provider, { value, children });
+  return /* @__PURE__ */ jsx228(NavbarLayoutHeightContext.Provider, { value, children });
 }
 function useNavbarLayoutHeight() {
   return useContext28(NavbarLayoutHeightContext);
 }
 
 // src/layouts/NavbarLayout/NavbarLayout.tsx
-import { jsx as jsx228, jsxs as jsxs118 } from "react/jsx-runtime";
+import { jsx as jsx229, jsxs as jsxs119 } from "react/jsx-runtime";
 var __maybeInc31 = (inc) => {
   return typeof inc === "string" ? inc : `calc(var(--t-spacing) * ${inc})`;
 };
@@ -27824,10 +27901,10 @@ function NavbarLayout(props) {
       position: "sticky",
       left: "left0",
       zIndex: ["z_var", {
-        "--zIndex": maybeCssVar64(zIndices.navbar)
+        "--zIndex": maybeCssVar65(zIndices.navbar)
       }],
       width: ["w_var", {
-        "--width": maybeCssVar64(__maybeInc31(innerWidth))
+        "--width": maybeCssVar65(__maybeInc31(innerWidth))
       }]
     }
   ) : (
@@ -27836,10 +27913,10 @@ function NavbarLayout(props) {
       position: "fixed",
       left: "left0",
       zIndex: ["z_var", {
-        "--zIndex": maybeCssVar64(zIndices.navbar)
+        "--zIndex": maybeCssVar65(zIndices.navbar)
       }],
       width: ["w_var", {
-        "--width": maybeCssVar64(__maybeInc31(innerWidth))
+        "--width": maybeCssVar65(__maybeInc31(innerWidth))
       }],
       transition: "transitionTop"
     }
@@ -27848,20 +27925,20 @@ function NavbarLayout(props) {
   const innerStyle = autoHideState !== "static" ? {
     top: autoHideState === "revealed" ? bannerTop : `calc(${bannerTop} - ${navHeight}px)`
   } : void 0;
-  const navbarEl = useMemo57(() => /* @__PURE__ */ jsx228(Navbar, { ...navbar }), [navbar]);
-  return /* @__PURE__ */ jsx228(DocumentScrollLayoutProvider, { children: /* @__PURE__ */ jsx228(NavbarLayoutHeightProvider, { value: navbarOffsetPx, children: /* @__PURE__ */ jsx228(MobileSubNavProvider, { children: /* @__PURE__ */ jsxs118("div", { ...mergeProps39(void 0, cssVars, {
+  const navbarEl = useMemo57(() => /* @__PURE__ */ jsx229(Navbar, { ...navbar }), [navbar]);
+  return /* @__PURE__ */ jsx229(DocumentScrollLayoutProvider, { children: /* @__PURE__ */ jsx229(NavbarLayoutHeightProvider, { value: navbarOffsetPx, children: /* @__PURE__ */ jsx229(MobileSubNavProvider, { children: /* @__PURE__ */ jsxs119("div", { ...mergeProps39(void 0, cssVars, {
     display: "df",
     flexDirection: "fdc",
     width: "wfc",
     minWidth: "mw100"
   }), ...tid, children: [
-    /* @__PURE__ */ jsx228("div", { ref: spacerRef, ...mergeProps39(void 0, {
+    /* @__PURE__ */ jsx229("div", { ref: spacerRef, ...mergeProps39(void 0, {
       height: navHeight
     }, {
       flexShrink: "fs0",
       width: "w100"
-    }), children: /* @__PURE__ */ jsx228("div", { ref: navMetricsRef, ...mergeProps39(void 0, innerStyle, innerCss), ...tid.navbar, children: navbarEl }) }),
-    /* @__PURE__ */ jsx228("div", { className: "df fdc mh0 mw100 w100", ...tid.body, children })
+    }), children: /* @__PURE__ */ jsx229("div", { ref: navMetricsRef, ...mergeProps39(void 0, innerStyle, innerCss), ...tid.navbar, children: navbarEl }) }),
+    /* @__PURE__ */ jsx229("div", { className: "df fdc mh0 mw100 w100", ...tid.body, children })
   ] }) }) }) });
 }
 
@@ -27869,8 +27946,8 @@ function NavbarLayout(props) {
 import { useCallback as useCallback41, useMemo as useMemo58, useRef as useRef69 } from "react";
 
 // src/components/Headers/BaseHeader.tsx
-import { trussProps as trussProps132 } from "@homebound/truss/runtime";
-import { jsx as jsx229, jsxs as jsxs119 } from "react/jsx-runtime";
+import { trussProps as trussProps133 } from "@homebound/truss/runtime";
+import { jsx as jsx230, jsxs as jsxs120 } from "react/jsx-runtime";
 function BaseHeader(props) {
   const {
     title,
@@ -27882,7 +27959,7 @@ function BaseHeader(props) {
   } = props;
   const tid = useTestIds(otherProps, "header");
   useDocumentTitle(title, documentTitleSuffix);
-  return /* @__PURE__ */ jsxs119("header", { ...tid, ...trussProps132({
+  return /* @__PURE__ */ jsxs120("header", { ...tid, ...trussProps133({
     display: "df",
     flexDirection: "fdc",
     paddingTop: "pt3",
@@ -27896,7 +27973,7 @@ function BaseHeader(props) {
       "--backgroundColor": "var(--b-surface)"
     }]
   }), children: [
-    /* @__PURE__ */ jsxs119("div", { ...trussProps132({
+    /* @__PURE__ */ jsxs120("div", { ...trussProps133({
       ...{
         display: "df",
         justifyContent: "jcsb",
@@ -27910,9 +27987,9 @@ function BaseHeader(props) {
         } : {}
       }
     }), children: [
-      /* @__PURE__ */ jsxs119("div", { className: "mw0", children: [
-        breadcrumbs && /* @__PURE__ */ jsx229(Breadcrumbs, { ...breadcrumbs }),
-        /* @__PURE__ */ jsx229("h1", { ...tid.title, ...trussProps132({
+      /* @__PURE__ */ jsxs120("div", { className: "mw0", children: [
+        breadcrumbs && /* @__PURE__ */ jsx230(Breadcrumbs, { ...breadcrumbs }),
+        /* @__PURE__ */ jsx230("h1", { ...tid.title, ...trussProps133({
           fontWeight: "fw6",
           fontSize: "fz_20px",
           lineHeight: "lh_28px",
@@ -27921,22 +27998,22 @@ function BaseHeader(props) {
           }]
         }), children: title })
       ] }),
-      /* @__PURE__ */ jsx229("div", { className: "fs0", children: rightSlot })
+      /* @__PURE__ */ jsx230("div", { className: "fs0", children: rightSlot })
     ] }),
     bottomSlot
   ] });
 }
 
 // src/components/Headers/PageHeader.tsx
-import { trussProps as trussProps133 } from "@homebound/truss/runtime";
-import { jsx as jsx230 } from "react/jsx-runtime";
+import { trussProps as trussProps134 } from "@homebound/truss/runtime";
+import { jsx as jsx231 } from "react/jsx-runtime";
 function PageHeader2(props) {
   const {
     tabs,
     ...otherProps
   } = props;
   const tid = useTestIds(otherProps, "header");
-  return /* @__PURE__ */ jsx230(BaseHeader, { ...otherProps, bottomSlot: tabs && /* @__PURE__ */ jsx230("div", { ...trussProps133(pageContentPaddingX), children: /* @__PURE__ */ jsx230(Tabs, { ...tabs, ...tid.tabs }) }) });
+  return /* @__PURE__ */ jsx231(BaseHeader, { ...otherProps, bottomSlot: tabs && /* @__PURE__ */ jsx231("div", { ...trussProps134(pageContentPaddingX), children: /* @__PURE__ */ jsx231(Tabs, { ...tabs, ...tid.tabs }) }) });
 }
 
 // src/layouts/useBannerAndNavbarHeight.ts
@@ -27945,8 +28022,8 @@ function useBannerAndNavbarHeight() {
 }
 
 // src/layouts/PageHeaderLayout/PageHeaderLayout.tsx
-import { mergeProps as mergeProps40, maybeCssVar as maybeCssVar65 } from "@homebound/truss/runtime";
-import { jsx as jsx231, jsxs as jsxs120 } from "react/jsx-runtime";
+import { mergeProps as mergeProps40, maybeCssVar as maybeCssVar66 } from "@homebound/truss/runtime";
+import { jsx as jsx232, jsxs as jsxs121 } from "react/jsx-runtime";
 var __maybeInc32 = (inc) => {
   return typeof inc === "string" ? inc : `calc(var(--t-spacing) * ${inc})`;
 };
@@ -27977,49 +28054,49 @@ function PageHeaderLayout(props) {
   const innerCss = autoHideState === "static" ? {
     position: "sticky",
     left: ["left_var", {
-      "--left": maybeCssVar65(__maybeInc32(headerLeft))
+      "--left": maybeCssVar66(__maybeInc32(headerLeft))
     }],
     width: ["w_var", {
-      "--width": maybeCssVar65(__maybeInc32(headerWidth))
+      "--width": maybeCssVar66(__maybeInc32(headerWidth))
     }],
     zIndex: ["z_var", {
-      "--zIndex": maybeCssVar65(zIndices.pageStickyHeader)
+      "--zIndex": maybeCssVar66(zIndices.pageStickyHeader)
     }]
   } : {
     position: "fixed",
     left: ["left_var", {
-      "--left": maybeCssVar65(__maybeInc32(headerLeft))
+      "--left": maybeCssVar66(__maybeInc32(headerLeft))
     }],
     width: ["w_var", {
-      "--width": maybeCssVar65(__maybeInc32(headerWidth))
+      "--width": maybeCssVar66(__maybeInc32(headerWidth))
     }],
     zIndex: ["z_var", {
-      "--zIndex": maybeCssVar65(zIndices.pageStickyHeader)
+      "--zIndex": maybeCssVar66(zIndices.pageStickyHeader)
     }],
     transition: "transitionTop"
   };
   const innerStyle = autoHideState !== "static" ? {
     top: autoHideState === "revealed" ? outerTop : `calc(${outerTop} - ${headerHeight}px)`
   } : void 0;
-  const pageHeaderEl = useMemo58(() => /* @__PURE__ */ jsx231(PageHeader2, { ...pageHeader }), [pageHeader]);
-  return /* @__PURE__ */ jsx231(DocumentScrollLayoutProvider, { children: /* @__PURE__ */ jsxs120("div", { ...mergeProps40(void 0, cssVars, {
+  const pageHeaderEl = useMemo58(() => /* @__PURE__ */ jsx232(PageHeader2, { ...pageHeader }), [pageHeader]);
+  return /* @__PURE__ */ jsx232(DocumentScrollLayoutProvider, { children: /* @__PURE__ */ jsxs121("div", { ...mergeProps40(void 0, cssVars, {
     display: "df",
     flexDirection: "fdc",
     width: "w100"
   }), ...tid, children: [
-    /* @__PURE__ */ jsx231("div", { ref: spacerRef, ...mergeProps40(void 0, {
+    /* @__PURE__ */ jsx232("div", { ref: spacerRef, ...mergeProps40(void 0, {
       height: headerHeight
     }, {
       flexShrink: "fs0",
       width: "w100"
-    }), children: /* @__PURE__ */ jsx231("div", { ref: headerMetricsRef, ...mergeProps40(void 0, innerStyle, innerCss), ...tid.pageHeader, children: pageHeaderEl }) }),
-    /* @__PURE__ */ jsx231("div", { className: "df fdc fg1 mh0 w100", ...tid.body, children })
+    }), children: /* @__PURE__ */ jsx232("div", { ref: headerMetricsRef, ...mergeProps40(void 0, innerStyle, innerCss), ...tid.pageHeader, children: pageHeaderEl }) }),
+    /* @__PURE__ */ jsx232("div", { className: "df fdc fg1 mh0 w100", ...tid.body, children })
   ] }) });
 }
 
 // src/layouts/Workflow/JumpLinksRail.tsx
-import { trussProps as trussProps134, maybeCssVar as maybeCssVar66 } from "@homebound/truss/runtime";
-import { jsx as jsx232 } from "react/jsx-runtime";
+import { trussProps as trussProps135, maybeCssVar as maybeCssVar67 } from "@homebound/truss/runtime";
+import { jsx as jsx233 } from "react/jsx-runtime";
 var __maybeInc33 = (inc) => {
   return typeof inc === "string" ? inc : `calc(var(--t-spacing) * ${inc})`;
 };
@@ -28030,7 +28107,7 @@ function JumpLinksRail(props) {
     activeId
   } = props;
   const tid = useTestIds(props, "jumpLinks");
-  return /* @__PURE__ */ jsx232("nav", { ...trussProps134({
+  return /* @__PURE__ */ jsx233("nav", { ...trussProps135({
     display: "df",
     flexDirection: "fdc",
     flexShrink: "fs0",
@@ -28040,9 +28117,9 @@ function JumpLinksRail(props) {
     position: "sticky",
     alignSelf: "asfs",
     top: ["top_var", {
-      "--top": maybeCssVar66(__maybeInc33(stickyNavAndHeaderOffset()))
+      "--top": maybeCssVar67(__maybeInc33(stickyNavAndHeaderOffset()))
     }]
-  }), ...tid, children: links.map((link) => /* @__PURE__ */ jsx232(JumpLink, { label: link.label, href: `#${link.id}`, active: link.id === activeId, ...tid.link }, link.id)) });
+  }), ...tid, children: links.map((link) => /* @__PURE__ */ jsx233(JumpLink, { label: link.label, href: `#${link.id}`, active: link.id === activeId, ...tid.link }, link.id)) });
 }
 
 // src/layouts/Workflow/useActiveJumpLink.ts
@@ -28078,15 +28155,15 @@ function useActiveJumpLink(sectionIds) {
 import { useLayoutEffect as useLayoutEffect14, useRef as useRef71 } from "react";
 
 // src/components/Headers/WorkflowHeader.tsx
-import { jsx as jsx233 } from "react/jsx-runtime";
+import { jsx as jsx234 } from "react/jsx-runtime";
 function WorkflowHeader(props) {
   const { stepperTabs, ...otherProps } = props;
   const tid = useTestIds(otherProps, "header");
-  return /* @__PURE__ */ jsx233(
+  return /* @__PURE__ */ jsx234(
     BaseHeader,
     {
       ...otherProps,
-      bottomSlot: stepperTabs ? /* @__PURE__ */ jsx233(StepperTabs, { ...stepperTabs, ...tid.stepperTabs }) : void 0
+      bottomSlot: stepperTabs ? /* @__PURE__ */ jsx234(StepperTabs, { ...stepperTabs, ...tid.stepperTabs }) : void 0
     }
   );
 }
@@ -28094,7 +28171,7 @@ function WorkflowHeader(props) {
 // src/layouts/Workflow/useUnsavedChangesGuard.tsx
 import { useEffect as useEffect39, useRef as useRef70 } from "react";
 import { useBlocker } from "react-router-dom";
-import { jsx as jsx234 } from "react/jsx-runtime";
+import { jsx as jsx235 } from "react/jsx-runtime";
 function useUnsavedChangesGuard(options) {
   const { isDirty, onCancel } = options;
   const { openModal } = useModal();
@@ -28117,7 +28194,7 @@ function useUnsavedChangesGuard(options) {
     }
     openModal({
       allowClosing: false,
-      content: /* @__PURE__ */ jsx234(ConfirmCloseModal, { onClose: () => onCancel(e) })
+      content: /* @__PURE__ */ jsx235(ConfirmCloseModal, { onClose: () => onCancel(e) })
     });
   };
   const navigationBlocker = blocker.state === "blocked" ? { proceed: () => blocker.proceed?.(), cancelNavigation: () => blocker.reset?.() } : void 0;
@@ -28129,7 +28206,7 @@ function UnsavedChangesNavigationModal(props) {
   useEffect39(() => {
     openModal({
       allowClosing: false,
-      content: /* @__PURE__ */ jsx234(ConfirmCloseModal, { title: "Leave page?", onClose: proceed, onContinue: cancelNavigation })
+      content: /* @__PURE__ */ jsx235(ConfirmCloseModal, { title: "Leave page?", onClose: proceed, onContinue: cancelNavigation })
     });
     return () => closeModal();
   }, []);
@@ -28137,7 +28214,7 @@ function UnsavedChangesNavigationModal(props) {
 }
 
 // src/layouts/Workflow/WorkflowActions.tsx
-import { jsx as jsx235, jsxs as jsxs121 } from "react/jsx-runtime";
+import { jsx as jsx236, jsxs as jsxs122 } from "react/jsx-runtime";
 function WorkflowActions(props) {
   const {
     onCancel,
@@ -28155,12 +28232,12 @@ function WorkflowActions(props) {
     sm: isMobile
   } = useBreakpoint();
   const primaryVariant = aiMode ? "ai" : "primary";
-  return /* @__PURE__ */ jsxs121("div", { className: "df aic jcsb sm_w100", children: [
-    /* @__PURE__ */ jsx235("div", { className: "df aic", children: !isFirstStep && isMobile && onBack && /* @__PURE__ */ jsx235(IconButton, { icon: "arrowBack", label: "Back", onClick: onBack }) }),
-    /* @__PURE__ */ jsxs121("div", { className: "df aic gap1", children: [
-      /* @__PURE__ */ jsx235(Button, { label: "Cancel", variant: "quaternary", onClick: onCancel }),
-      onSaveAndExit && /* @__PURE__ */ jsx235(Button, { label: "Save & Exit", variant: "secondary", onClick: onSaveAndExit }),
-      isLastStep ? /* @__PURE__ */ jsx235(Button, { label: completeLabel, variant: primaryVariant, onClick: onComplete, disabled: primaryDisabled }) : /* @__PURE__ */ jsx235(Button, { label: "Continue", variant: primaryVariant, onClick: async () => {
+  return /* @__PURE__ */ jsxs122("div", { className: "df aic jcsb sm_w100", children: [
+    /* @__PURE__ */ jsx236("div", { className: "df aic", children: !isFirstStep && isMobile && onBack && /* @__PURE__ */ jsx236(IconButton, { icon: "arrowBack", label: "Back", onClick: onBack }) }),
+    /* @__PURE__ */ jsxs122("div", { className: "df aic gap1", children: [
+      /* @__PURE__ */ jsx236(Button, { label: "Cancel", variant: "quaternary", onClick: onCancel }),
+      onSaveAndExit && /* @__PURE__ */ jsx236(Button, { label: "Save & Exit", variant: "secondary", onClick: onSaveAndExit }),
+      isLastStep ? /* @__PURE__ */ jsx236(Button, { label: completeLabel, variant: primaryVariant, onClick: onComplete, disabled: primaryDisabled }) : /* @__PURE__ */ jsx236(Button, { label: "Continue", variant: primaryVariant, onClick: async () => {
         await onContinue?.();
       }, disabled: primaryDisabled })
     ] })
@@ -28168,8 +28245,8 @@ function WorkflowActions(props) {
 }
 
 // src/layouts/Workflow/WorkflowPageLayout.tsx
-import { trussProps as trussProps135, mergeProps as mergeProps41, maybeCssVar as maybeCssVar67 } from "@homebound/truss/runtime";
-import { jsx as jsx236, jsxs as jsxs122 } from "react/jsx-runtime";
+import { trussProps as trussProps136, mergeProps as mergeProps41, maybeCssVar as maybeCssVar68 } from "@homebound/truss/runtime";
+import { jsx as jsx237, jsxs as jsxs123 } from "react/jsx-runtime";
 var __maybeInc34 = (inc) => {
   return typeof inc === "string" ? inc : `calc(var(--t-spacing) * ${inc})`;
 };
@@ -28197,7 +28274,7 @@ function WorkflowPageLayout(props) {
     isDirty,
     onCancel
   });
-  const actions = /* @__PURE__ */ jsx236(WorkflowActions, { ...actionProps, aiMode, onCancel: onCancelClick });
+  const actions = /* @__PURE__ */ jsx237(WorkflowActions, { ...actionProps, aiMode, onCancel: onCancelClick });
   const headerMetricsRef = useRef71(null);
   const headerHeight = useMeasuredHeight(headerMetricsRef, true);
   const headerWidth = documentScrollChromeWidth();
@@ -28218,26 +28295,26 @@ function WorkflowPageLayout(props) {
       }
     };
   }, [showFooter]);
-  return /* @__PURE__ */ jsxs122(DocumentScrollLayoutProvider, { children: [
-    /* @__PURE__ */ jsxs122("div", { ...mergeProps41(void 0, cssVars, {
+  return /* @__PURE__ */ jsxs123(DocumentScrollLayoutProvider, { children: [
+    /* @__PURE__ */ jsxs123("div", { ...mergeProps41(void 0, cssVars, {
       display: "df",
       flexDirection: "fdc",
       width: "w100"
     }), ...tid, children: [
-      /* @__PURE__ */ jsx236("div", { ref: headerMetricsRef, ...trussProps135({
+      /* @__PURE__ */ jsx237("div", { ref: headerMetricsRef, ...trussProps136({
         position: "sticky",
         left: "left0",
         width: ["w_var", {
-          "--width": maybeCssVar67(__maybeInc34(headerWidth))
+          "--width": maybeCssVar68(__maybeInc34(headerWidth))
         }],
         zIndex: ["z_var", {
-          "--zIndex": maybeCssVar67(zIndices.pageStickyHeader)
+          "--zIndex": maybeCssVar68(zIndices.pageStickyHeader)
         }],
         top: ["top_var", {
-          "--top": maybeCssVar67(__maybeInc34(outerTop))
+          "--top": maybeCssVar68(__maybeInc34(outerTop))
         }]
-      }), ...tid.header, children: /* @__PURE__ */ jsx236(WorkflowHeader, { title, documentTitleSuffix, breadcrumbs, rightSlot: isMobile ? void 0 : actions, stepperTabs }) }),
-      /* @__PURE__ */ jsx236("div", { ...trussProps135({
+      }), ...tid.header, children: /* @__PURE__ */ jsx237(WorkflowHeader, { title, documentTitleSuffix, breadcrumbs, rightSlot: isMobile ? void 0 : actions, stepperTabs }) }),
+      /* @__PURE__ */ jsx237("div", { ...trussProps136({
         ...{
           display: "df",
           flexDirection: "fdc",
@@ -28249,28 +28326,28 @@ function WorkflowPageLayout(props) {
         ...aiMode && {
           backgroundImage: "aiBackground",
           minHeight: ["mh_var", {
-            "--minHeight": maybeCssVar67(documentScrollBodyMinHeight())
+            "--minHeight": maybeCssVar68(documentScrollBodyMinHeight())
           }]
         }
       }), ...tid.body, children }),
-      showFooter && /* @__PURE__ */ jsx236("div", { ...trussProps135({
+      showFooter && /* @__PURE__ */ jsx237("div", { ...trussProps136({
         flexShrink: "fs0",
         width: "w100",
         height: ["h_var", {
           "--height": `${mobileFooterHeightPx}px`
         }]
-      }), children: /* @__PURE__ */ jsx236("div", { ...trussProps135({
+      }), children: /* @__PURE__ */ jsx237("div", { ...trussProps136({
         ...{
           position: "fixed",
           bottom: "bottom0",
           width: ["w_var", {
-            "--width": maybeCssVar67(__maybeInc34(headerWidth))
+            "--width": maybeCssVar68(__maybeInc34(headerWidth))
           }],
           height: ["h_var", {
             "--height": `${mobileFooterHeightPx}px`
           }],
           zIndex: ["z_var", {
-            "--zIndex": maybeCssVar67(zIndices.pageStickyFooter)
+            "--zIndex": maybeCssVar68(zIndices.pageStickyFooter)
           }],
           display: "df",
           alignItems: "aic",
@@ -28288,12 +28365,12 @@ function WorkflowPageLayout(props) {
         ...pageContentPaddingX
       }), ...tid.footer, children: actions }) })
     ] }),
-    navigationBlocker && /* @__PURE__ */ jsx236(UnsavedChangesNavigationModal, { ...navigationBlocker })
+    navigationBlocker && /* @__PURE__ */ jsx237(UnsavedChangesNavigationModal, { ...navigationBlocker })
   ] });
 }
 
 // src/layouts/Workflow/FocusedFormLayout.tsx
-import { jsx as jsx237, jsxs as jsxs123 } from "react/jsx-runtime";
+import { jsx as jsx238, jsxs as jsxs124 } from "react/jsx-runtime";
 function FocusedFormLayout(props) {
   const {
     onCancel,
@@ -28320,15 +28397,15 @@ function FocusedFormLayout(props) {
   });
   const activeId = useActiveJumpLink(jumpLinks.map((link) => link.id));
   const showRail = withJumpLinks && jumpLinks.length >= 2 && !isMobile;
-  return /* @__PURE__ */ jsx237(WorkflowPageLayout, { ...tid, ...headerProps, aiMode, isDirty, onCancel, onSaveAndExit, completeLabel, onComplete, primaryDisabled: !isValid, children: /* @__PURE__ */ jsxs123("div", { className: "df w100", children: [
-    showRail && /* @__PURE__ */ jsx237(JumpLinksRail, { links: jumpLinks, activeId, ...tid.jumpLinks }),
-    /* @__PURE__ */ jsx237("div", { className: "fg1 mw0 mb4", children: /* @__PURE__ */ jsx237(FormSectionLayout, { ...form, aiMode }) })
+  return /* @__PURE__ */ jsx238(WorkflowPageLayout, { ...tid, ...headerProps, aiMode, isDirty, onCancel, onSaveAndExit, completeLabel, onComplete, primaryDisabled: !isValid, children: /* @__PURE__ */ jsxs124("div", { className: "df w100", children: [
+    showRail && /* @__PURE__ */ jsx238(JumpLinksRail, { links: jumpLinks, activeId, ...tid.jumpLinks }),
+    /* @__PURE__ */ jsx238("div", { className: "fg1 mw0 mb4", children: /* @__PURE__ */ jsx238(FormSectionLayout, { ...form, aiMode }) })
   ] }) });
 }
 
 // src/layouts/Workflow/StepperLayout.tsx
 import { useState as useState63 } from "react";
-import { jsx as jsx238 } from "react/jsx-runtime";
+import { jsx as jsx239 } from "react/jsx-runtime";
 function StepperLayout(props) {
   const { steps, defaultStep, onCancel, completeLabel, onComplete, onSaveAndExit, isDirty, aiMode, ...headerProps } = props;
   const stepTabs = steps.map((step) => ({ ...step, value: defaultTestId(step.label) }));
@@ -28338,7 +28415,7 @@ function StepperLayout(props) {
   const isFirstStep = currentIndex <= 0;
   const isLastStep = currentIndex >= stepTabs.length - 1;
   const activeStep = stepTabs[currentIndex];
-  return /* @__PURE__ */ jsx238(
+  return /* @__PURE__ */ jsx239(
     WorkflowPageLayout,
     {
       ...tid,
@@ -28482,6 +28559,7 @@ export {
   Icon,
   IconButton,
   Icons,
+  InlineFeedbackBanner,
   JumpLink,
   KEPT_GROUP,
   Loader,