@mindbill/react 0.44.1 → 0.45.0

package/README.md

@@ -95,6 +95,24 @@ import { BillReadOnlyForm } from "@mindbill/react";
 
 `ConnectedBillLifecycle` composes this component with the Details / Bill history switch, so most partners should not assemble these pieces themselves.
 
+`ConnectedBillingWorkspace` is the complete task, search, procedure,
+productivity, and bill-detail experience. It measures the space remaining in
+the browser viewport and owns vertical scrolling, so dashboard shells cannot
+trap content below the fold. Hosts can still give it an explicit height:
+
+```tsx
+<main style={{ height: "100dvh", minHeight: 0 }}>
+  <ConnectedBillingWorkspace
+    sessionEndpoint="/api/mindbill/session"
+    onCreateBill={() => router.push("/billing/new")}
+  />
+</main>
+```
+
+For flex or grid shells, setting `min-height: 0` on the workspace's ancestors
+remains a useful layout default. An explicit `height` or `maxHeight` in the
+component's `style` prop continues to take precedence.
+
 `BillRejectionNotice` is also exported for custom lifecycle layouts. It presents every API-provided rejection issue in order, keeps technical acknowledgement codes alongside the actionable descriptions, and shows when the bill was sent and rejected. The connected lifecycle includes it automatically whenever the current state is `rejected`.
 
 ```tsx
@@ -344,7 +362,15 @@ attempt's latest acknowledgement or payment state — for example `277 Reject`
 or `Payment in 30 working days` — plus delivery, sent date, and the relevant
 reject/effective date. `billSubmissionsRibbonFromHistory` derives those chips
 from one unified history across every attempt. In `ConnectedBillLifecycle`, a
-chip click opens that shared history and highlights the selected submission.
+chip click keeps the Details tab open and shows that transmission's receipt,
+delivery, sent date, and status. The immutable bill detail remains below it;
+the complete cross-attempt audit trail is available only through the explicit
+Bill history tab.
+
+The connected lifecycle also renders server-owned bill notes and an **Add note**
+control. Custom compositions can call `useBillLifecycle({ billId }).addNote({
+note, actorName })`; note activity is shared with other authorized partner and
+MindBill users.
 
 `ReportBillStatusDialog` records the outcome of a payment-status phone call to the Claims Administrator / Bill Review vendor: payer contacts, the host-rendered submission receipt (for example a `BillHistoryTable`), and the five standard reported statuses (`REPORT_BILL_STATUS_OPTIONS`). The host posts the resulting `ReportBillStatusInput` through its own lifecycle action call.
 

package/dist/index.d.ts

@@ -1144,6 +1144,7 @@ type UseBillLifecycleResult = {
     openAttachment: (attachment: Pick<BillReviewAttachment, "id">) => Promise<void>;
     openEor: (document: BillEorDocument) => Promise<void>;
     downloadPacket: () => Promise<void>;
+    addNote: BillLifecycleClient["addNote"];
     closeBill: BillLifecycleClient["closeBill"];
     reopenBill: BillLifecycleClient["reopenBill"];
     postPayment: BillLifecycleClient["postPayment"];

package/dist/index.js

@@ -2,7 +2,7 @@
 
 // src/index.tsx
 import "@mindbill/embed";
-import { createElement, useEffect as useEffect12, useRef as useRef7 } from "react";
+import { createElement, useEffect as useEffect12, useRef as useRef8 } from "react";
 
 // src/appearance.ts
 var mindBillThemePresets = {
@@ -3972,12 +3972,12 @@ function billSubmissionsRibbonFromHistory(history, attempts = []) {
 var css7 = `
 .mbsr{display:flex;gap:10px;overflow-x:auto;padding-bottom:4px;color:var(--mb-text);font-family:var(--mb-font);font-size:13px}
 .mbsr *{box-sizing:border-box}
-.mbsr-chip{flex:0 0 auto;display:grid;gap:7px;min-width:180px;max-width:280px;padding:11px 13px;border:1px solid var(--mb-border);border-radius:var(--mb-control-radius);background:var(--mb-surface);color:inherit;font:inherit;text-align:left;text-decoration:none;cursor:pointer}
+.mbsr-chip{flex:0 0 240px;display:grid;gap:7px;width:240px;min-width:min(240px,85vw);max-width:280px;padding:11px 13px;border:1px solid var(--mb-border);border-radius:var(--mb-control-radius);background:var(--mb-surface);color:inherit;font:inherit;text-align:left;text-decoration:none;cursor:pointer}
 .mbsr-chip:hover{border-color:var(--mb-accent)}
 .mbsr-chip[data-active=true]{border-color:var(--mb-accent);background:color-mix(in srgb,var(--mb-accent) 7%,var(--mb-surface));box-shadow:0 0 0 1px var(--mb-accent) inset}
-.mbsr-top{display:flex;align-items:center;gap:8px;min-width:0}
-.mbsr-label{font-size:13.5px;font-weight:760;line-height:1.3;overflow-wrap:anywhere}
-.mbsr-badge{flex:0 0 auto;padding:2px 8px;border:1px solid color-mix(in srgb,var(--mb-muted) 45%,var(--mb-border));border-radius:999px;background:var(--mb-soft);font-size:11px;font-weight:700;white-space:nowrap}
+.mbsr-top{display:grid;grid-template-columns:minmax(0,1fr);gap:6px;min-width:0}
+.mbsr-label{min-width:0;font-size:13.5px;font-weight:760;line-height:1.3;overflow-wrap:normal;word-break:normal}
+.mbsr-badge{justify-self:start;max-width:100%;padding:2px 8px;border:1px solid color-mix(in srgb,var(--mb-muted) 45%,var(--mb-border));border-radius:999px;background:var(--mb-soft);font-size:11px;font-weight:700;white-space:normal}
 .mbsr-badge[data-tone=success]{border-color:color-mix(in srgb,#23876f 52%,var(--mb-border));background:color-mix(in srgb,#23876f 11%,var(--mb-surface));color:#176452}
 .mbsr-badge[data-tone=warning]{border-color:color-mix(in srgb,var(--mb-warning) 55%,var(--mb-border));background:color-mix(in srgb,var(--mb-warning) 12%,var(--mb-surface))}
 .mbsr-badge[data-tone=danger]{border-color:color-mix(in srgb,var(--mb-danger) 45%,var(--mb-border));background:color-mix(in srgb,var(--mb-danger) 9%,var(--mb-surface));color:var(--mb-danger)}
@@ -5568,16 +5568,16 @@ var SECOND_REVIEW_REASON_TEMPLATES = [
   }
 ];
 var css10 = `
-.mbsr{display:grid;gap:18px;color:var(--mb-text);font-family:var(--mb-font)}
-.mbsr *{box-sizing:border-box}.mbsr h3{margin:0;font-size:22px}.mbsr p{margin:4px 0 0;color:var(--mb-muted)}
-.mbsr-deadline{padding:12px 14px;border-radius:var(--mb-control-radius);background:color-mix(in srgb,var(--mb-warning) 10%,var(--mb-surface));color:var(--mb-text)!important}
-.mbsr-template,.mbsr-field{display:grid;gap:6px}.mbsr-label{font-size:13px;font-weight:720}.mbsr-select,.mbsr-textarea{width:100%;padding:10px 12px;border:1px solid var(--mb-border);border-radius:var(--mb-control-radius);background:var(--mb-input);color:var(--mb-text);font:inherit}.mbsr-textarea{min-height:86px;resize:vertical}.mbsr-select:focus,.mbsr-textarea:focus{outline:3px solid color-mix(in srgb,var(--mb-accent) 20%,transparent);border-color:var(--mb-accent)}
-.mbsr-lines{display:grid;gap:10px}.mbsr-line{display:grid;gap:12px;padding:14px;border:1px solid var(--mb-border);border-radius:var(--mb-control-radius);background:var(--mb-surface)}.mbsr-line[data-selected=true]{border-color:color-mix(in srgb,var(--mb-accent) 65%,var(--mb-border));background:color-mix(in srgb,var(--mb-accent) 4%,var(--mb-surface))}.mbsr-line-head{display:flex;align-items:center;justify-content:space-between;gap:12px}.mbsr-check{display:flex;align-items:center;gap:9px;font-weight:750}.mbsr-check input{width:18px;height:18px;accent-color:var(--mb-accent)}.mbsr-metrics{display:flex;gap:14px;color:var(--mb-muted);font-size:12px}.mbsr-auth{display:flex;align-items:center;flex-wrap:wrap;gap:8px;font-size:13px}.mbsr-auth strong{margin-right:4px}.mbsr-auth label{display:flex;align-items:center;gap:5px}.mbsr-auth input{accent-color:var(--mb-accent)}
-.mbsr-packet{display:grid;gap:10px;padding:0;border:0}.mbsr-packet legend{margin-bottom:8px;font-weight:750}.mbsr-document{display:flex;align-items:center;gap:10px;padding:10px 0;border-top:1px solid var(--mb-border)}.mbsr-document input{width:18px;height:18px;accent-color:var(--mb-accent)}.mbsr-document span{display:grid;min-width:0;flex:1}.mbsr-document small{color:var(--mb-muted)}.mbsr-link{border:0;background:transparent;color:var(--mb-accent);font:inherit;font-weight:700;cursor:pointer}
-.mbsr-upload{display:grid;place-items:center;min-height:82px;padding:16px;border:1px dashed color-mix(in srgb,var(--mb-accent) 55%,var(--mb-border));border-radius:var(--mb-control-radius);background:color-mix(in srgb,var(--mb-accent) 3%,var(--mb-surface));cursor:pointer}.mbsr-upload input{position:absolute;width:1px;height:1px;opacity:0}.mbsr-upload strong{color:var(--mb-accent)}
-.mbsr-uploaded{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:9px 11px;border:1px solid var(--mb-border);border-radius:var(--mb-control-radius)}
-.mbsr-error{padding:10px 12px;border-radius:var(--mb-control-radius);background:color-mix(in srgb,var(--mb-danger) 10%,transparent);color:var(--mb-danger);font-size:13px}.mbsr-actions{display:flex;justify-content:flex-end;gap:10px}.mbsr-button{min-height:42px;padding:9px 16px;border-radius:var(--mb-control-radius);font:inherit;font-weight:740;cursor:pointer}.mbsr-button.secondary{border:1px solid var(--mb-border);background:var(--mb-surface);color:var(--mb-text)}.mbsr-button.primary{border:0;background:var(--mb-accent);color:var(--mb-accent-contrast)}.mbsr-button:disabled{opacity:.55;cursor:not-allowed}
-@media(max-width:680px){.mbsr-line-head{align-items:flex-start;flex-direction:column}.mbsr-metrics{flex-wrap:wrap}}
+.mb-second-review{display:grid;gap:18px;padding:22px;color:var(--mb-text);font-family:var(--mb-font);background:var(--mb-surface);border:1px solid var(--mb-border);border-radius:var(--mb-radius);box-shadow:var(--mb-shadow)}
+.mb-second-review *{box-sizing:border-box}.mb-second-review h3{margin:0;font-size:22px}.mb-second-review p{margin:4px 0 0;color:var(--mb-muted)}
+.mb-second-review-deadline{padding:12px 14px;border-radius:var(--mb-control-radius);background:color-mix(in srgb,var(--mb-warning) 10%,var(--mb-surface));color:var(--mb-text)!important}
+.mb-second-review-template,.mb-second-review-field{display:grid;gap:6px}.mb-second-review-label{font-size:13px;font-weight:720}.mb-second-review-select,.mb-second-review-textarea{width:100%;padding:10px 12px;border:1px solid var(--mb-border);border-radius:var(--mb-control-radius);background:var(--mb-input);color:var(--mb-text);font:inherit}.mb-second-review-textarea{min-height:86px;resize:vertical}.mb-second-review-select:focus,.mb-second-review-textarea:focus{outline:3px solid color-mix(in srgb,var(--mb-accent) 20%,transparent);border-color:var(--mb-accent)}
+.mb-second-review-lines{display:grid;gap:10px}.mb-second-review-line{display:grid;gap:12px;padding:14px;border:1px solid var(--mb-border);border-radius:var(--mb-control-radius);background:var(--mb-surface)}.mb-second-review-line[data-selected=true]{border-color:color-mix(in srgb,var(--mb-accent) 65%,var(--mb-border));background:color-mix(in srgb,var(--mb-accent) 4%,var(--mb-surface))}.mb-second-review-line-head{display:flex;align-items:center;justify-content:space-between;gap:12px}.mb-second-review-check{display:flex;align-items:center;gap:9px;font-weight:750}.mb-second-review-check input{width:18px;height:18px;accent-color:var(--mb-accent)}.mb-second-review-metrics{display:flex;gap:14px;color:var(--mb-muted);font-size:12px}.mb-second-review-auth{display:flex;align-items:center;flex-wrap:wrap;gap:8px;font-size:13px}.mb-second-review-auth strong{margin-right:4px}.mb-second-review-auth label{display:flex;align-items:center;gap:5px}.mb-second-review-auth input{accent-color:var(--mb-accent)}
+.mb-second-review-packet{display:grid;gap:10px;padding:0;border:0}.mb-second-review-packet legend{margin-bottom:8px;font-weight:750}.mb-second-review-document{display:flex;align-items:center;gap:10px;padding:10px 0;border-top:1px solid var(--mb-border)}.mb-second-review-document input{width:18px;height:18px;accent-color:var(--mb-accent)}.mb-second-review-document span{display:grid;min-width:0;flex:1}.mb-second-review-document small{color:var(--mb-muted)}.mb-second-review-link{border:0;background:transparent;color:var(--mb-accent);font:inherit;font-weight:700;cursor:pointer}
+.mb-second-review-upload{display:grid;place-items:center;min-height:82px;padding:16px;border:1px dashed color-mix(in srgb,var(--mb-accent) 55%,var(--mb-border));border-radius:var(--mb-control-radius);background:color-mix(in srgb,var(--mb-accent) 3%,var(--mb-surface));cursor:pointer}.mb-second-review-upload input{position:absolute;width:1px;height:1px;opacity:0}.mb-second-review-upload strong{color:var(--mb-accent)}
+.mb-second-review-uploaded{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:9px 11px;border:1px solid var(--mb-border);border-radius:var(--mb-control-radius)}
+.mb-second-review-error{padding:10px 12px;border-radius:var(--mb-control-radius);background:color-mix(in srgb,var(--mb-danger) 10%,transparent);color:var(--mb-danger);font-size:13px}.mb-second-review-actions{display:flex;justify-content:flex-end;gap:10px}.mb-second-review-button{min-height:42px;padding:9px 16px;border-radius:var(--mb-control-radius);font:inherit;font-weight:740;cursor:pointer}.mb-second-review-button.secondary{border:1px solid var(--mb-border);background:var(--mb-surface);color:var(--mb-text)}.mb-second-review-button.primary{border:0;background:var(--mb-accent);color:var(--mb-accent-contrast)}.mb-second-review-button:disabled{opacity:.55;cursor:not-allowed}
+@media(max-width:680px){.mb-second-review{padding:16px}.mb-second-review-line-head{align-items:flex-start;flex-direction:column}.mb-second-review-metrics{flex-wrap:wrap}}
 `;
 function money5(value) {
   return new Intl.NumberFormat("en-US", { style: "currency", currency: "USD" }).format(value);
@@ -5691,14 +5691,14 @@ function SecondReviewForm({
   };
   return /* @__PURE__ */ jsxs14(Fragment12, { children: [
     /* @__PURE__ */ jsx14("style", { children: css10 }),
-    /* @__PURE__ */ jsxs14("section", { className: "mbsr", children: [
+    /* @__PURE__ */ jsxs14("section", { className: "mb-second-review", children: [
       /* @__PURE__ */ jsxs14("div", { children: [
         /* @__PURE__ */ jsx14("h3", { children: "Submit Second Review" }),
         /* @__PURE__ */ jsx14("p", { children: "Select each disputed service and explain why it should be reconsidered." })
       ] }),
-      /* @__PURE__ */ jsxs14("label", { className: "mbsr-template", children: [
-        /* @__PURE__ */ jsx14("span", { className: "mbsr-label", children: "Apply a saved reason to selected lines" }),
-        /* @__PURE__ */ jsxs14("select", { className: "mbsr-select", defaultValue: "", onChange: (event) => {
+      /* @__PURE__ */ jsxs14("label", { className: "mb-second-review-template", children: [
+        /* @__PURE__ */ jsx14("span", { className: "mb-second-review-label", children: "Apply a saved reason to selected lines" }),
+        /* @__PURE__ */ jsxs14("select", { className: "mb-second-review-select", defaultValue: "", onChange: (event) => {
           applyTemplate(event.target.value);
           event.target.value = "";
         }, children: [
@@ -5706,19 +5706,19 @@ function SecondReviewForm({
           SECOND_REVIEW_REASON_TEMPLATES.map((template) => /* @__PURE__ */ jsx14("option", { value: template.value, children: template.label }, template.label))
         ] })
       ] }),
-      /* @__PURE__ */ jsxs14("section", { className: "mbsr-lines", "aria-label": "Service lines in dispute", children: [
+      /* @__PURE__ */ jsxs14("section", { className: "mb-second-review-lines", "aria-label": "Service lines in dispute", children: [
         selectableLines.map((line) => {
           const draft = lines[line.id];
-          return /* @__PURE__ */ jsxs14("article", { className: "mbsr-line", "data-selected": draft?.selected, children: [
-            /* @__PURE__ */ jsxs14("div", { className: "mbsr-line-head", children: [
-              /* @__PURE__ */ jsxs14("label", { className: "mbsr-check", children: [
+          return /* @__PURE__ */ jsxs14("article", { className: "mb-second-review-line", "data-selected": draft?.selected, children: [
+            /* @__PURE__ */ jsxs14("div", { className: "mb-second-review-line-head", children: [
+              /* @__PURE__ */ jsxs14("label", { className: "mb-second-review-check", children: [
                 /* @__PURE__ */ jsx14("input", { type: "checkbox", checked: Boolean(draft?.selected), onChange: (event) => patchLine(line.id, { selected: event.target.checked }) }),
                 /* @__PURE__ */ jsxs14("span", { children: [
                   line.code,
                   line.modifiers.length ? `-${line.modifiers.join("-")}` : ""
                 ] })
               ] }),
-              /* @__PURE__ */ jsxs14("span", { className: "mbsr-metrics", children: [
+              /* @__PURE__ */ jsxs14("span", { className: "mb-second-review-metrics", children: [
                 /* @__PURE__ */ jsxs14("span", { children: [
                   line.units,
                   " unit",
@@ -5728,11 +5728,11 @@ function SecondReviewForm({
               ] })
             ] }),
             draft?.selected ? /* @__PURE__ */ jsxs14(Fragment12, { children: [
-              /* @__PURE__ */ jsxs14("label", { className: "mbsr-field", children: [
-                /* @__PURE__ */ jsx14("span", { className: "mbsr-label", children: "Reason for requesting Second Review" }),
-                /* @__PURE__ */ jsx14("textarea", { className: "mbsr-textarea", required: true, value: draft.reason, onChange: (event) => patchLine(line.id, { reason: event.target.value }) })
+              /* @__PURE__ */ jsxs14("label", { className: "mb-second-review-field", children: [
+                /* @__PURE__ */ jsx14("span", { className: "mb-second-review-label", children: "Reason for requesting Second Review" }),
+                /* @__PURE__ */ jsx14("textarea", { className: "mb-second-review-textarea", required: true, value: draft.reason, onChange: (event) => patchLine(line.id, { reason: event.target.value }) })
               ] }),
-              /* @__PURE__ */ jsxs14("div", { className: "mbsr-auth", role: "radiogroup", "aria-label": `Service or good ${line.code} authorized`, children: [
+              /* @__PURE__ */ jsxs14("div", { className: "mb-second-review-auth", role: "radiogroup", "aria-label": `Service or good ${line.code} authorized`, children: [
                 /* @__PURE__ */ jsx14("strong", { children: "Service/Good Authorized?" }),
                 [["yes", "Yes"], ["no", "No"], ["", "Not specified"]].map(([value, label]) => /* @__PURE__ */ jsxs14("label", { children: [
                   /* @__PURE__ */ jsx14("input", { type: "radio", name: `authorized-${line.id}`, checked: draft.serviceAuthorized === value, onChange: () => patchLine(line.id, { serviceAuthorized: value }) }),
@@ -5742,34 +5742,34 @@ function SecondReviewForm({
             ] }) : null
           ] }, line.id);
         }),
-        !selectableLines.length ? /* @__PURE__ */ jsx14("div", { className: "mbsr-error", children: "This bill has no stable service-line identifiers. Refresh the bill before submitting a Second Review." }) : null
+        !selectableLines.length ? /* @__PURE__ */ jsx14("div", { className: "mb-second-review-error", children: "This bill has no stable service-line identifiers. Refresh the bill before submitting a Second Review." }) : null
       ] }),
-      /* @__PURE__ */ jsxs14("fieldset", { className: "mbsr-packet", children: [
+      /* @__PURE__ */ jsxs14("fieldset", { className: "mb-second-review-packet", children: [
         /* @__PURE__ */ jsx14("legend", { children: "Supporting packet" }),
-        data.bill.attachments.map((attachment) => /* @__PURE__ */ jsxs14("label", { className: "mbsr-document", children: [
+        data.bill.attachments.map((attachment) => /* @__PURE__ */ jsxs14("label", { className: "mb-second-review-document", children: [
           /* @__PURE__ */ jsx14("input", { type: "checkbox", checked: attachmentIds.includes(attachment.id), onChange: (event) => setAttachmentIds((current) => event.target.checked ? [...current, attachment.id] : current.filter((id) => id !== attachment.id)) }),
           /* @__PURE__ */ jsxs14("span", { children: [
             /* @__PURE__ */ jsx14("strong", { children: attachment.filename }),
             /* @__PURE__ */ jsx14("small", { children: attachment.description || attachment.documentType })
           ] }),
-          /* @__PURE__ */ jsx14("button", { className: "mbsr-link", type: "button", onClick: () => void openAttachment(attachment).catch(() => void 0), children: "View" })
+          /* @__PURE__ */ jsx14("button", { className: "mb-second-review-link", type: "button", onClick: () => void openAttachment(attachment).catch(() => void 0), children: "View" })
         ] }, attachment.id)),
-        /* @__PURE__ */ jsxs14("label", { className: "mbsr-upload", children: [
+        /* @__PURE__ */ jsxs14("label", { className: "mb-second-review-upload", children: [
           /* @__PURE__ */ jsx14("input", { type: "file", accept: "application/pdf,.pdf", multiple: true, onChange: addUploads }),
           /* @__PURE__ */ jsxs14("span", { children: [
             /* @__PURE__ */ jsx14("strong", { children: "Choose one or more PDF files" }),
             " to attach"
           ] })
         ] }),
-        uploads.map((upload, index) => /* @__PURE__ */ jsxs14("div", { className: "mbsr-uploaded", children: [
+        uploads.map((upload, index) => /* @__PURE__ */ jsxs14("div", { className: "mb-second-review-uploaded", children: [
           /* @__PURE__ */ jsx14("span", { children: upload.file.name }),
-          /* @__PURE__ */ jsx14("button", { className: "mbsr-link", type: "button", onClick: () => setUploads((current) => current.filter((_, itemIndex) => itemIndex !== index)), children: "Remove" })
+          /* @__PURE__ */ jsx14("button", { className: "mb-second-review-link", type: "button", onClick: () => setUploads((current) => current.filter((_, itemIndex) => itemIndex !== index)), children: "Remove" })
         ] }, `${upload.file.name}-${index}`))
       ] }),
-      formError || error?.message ? /* @__PURE__ */ jsx14("div", { className: "mbsr-error", role: "alert", children: formError || error?.message }) : null,
-      /* @__PURE__ */ jsxs14("div", { className: "mbsr-actions", children: [
-        /* @__PURE__ */ jsx14("button", { className: "mbsr-button secondary", type: "button", disabled: submitting || preparing, onClick: onCancel, children: "Cancel" }),
-        /* @__PURE__ */ jsx14("button", { className: "mbsr-button primary", type: "button", disabled: submitting || preparing || !selected.length || invalidReason, onClick: () => void continueToDelivery(), children: preparing ? "Preparing\u2026" : "Continue to delivery" })
+      formError || error?.message ? /* @__PURE__ */ jsx14("div", { className: "mb-second-review-error", role: "alert", children: formError || error?.message }) : null,
+      /* @__PURE__ */ jsxs14("div", { className: "mb-second-review-actions", children: [
+        /* @__PURE__ */ jsx14("button", { className: "mb-second-review-button secondary", type: "button", disabled: submitting || preparing, onClick: onCancel, children: "Cancel" }),
+        /* @__PURE__ */ jsx14("button", { className: "mb-second-review-button primary", type: "button", disabled: submitting || preparing || !selected.length || invalidReason, onClick: () => void continueToDelivery(), children: preparing ? "Preparing\u2026" : "Continue to delivery" })
       ] })
     ] }),
     delivery ? /* @__PURE__ */ jsx14(SendRouteDialog, { title: "Confirm Second Review delivery", delivery, submitting: submitting || preparing, error: formError || error?.message || null, onCancel: () => setDelivery(null), onConfirm: (route) => void submit(route) }) : null
@@ -5925,6 +5925,7 @@ function useBillLifecycle({
     openAttachment,
     openEor,
     downloadPacket,
+    addNote: (input) => mutate(() => client.addNote(input)),
     closeBill: (input) => mutate(() => client.closeBill(input)),
     reopenBill: (input) => mutate(() => client.reopenBill(input)),
     postPayment: (input) => mutate(() => client.postPayment(input)),
@@ -6175,6 +6176,7 @@ function ConnectedBillLifecycle({ appearance, actorName, claimsAdministratorHint
   const [selectedSubmissionId, setSelectedSubmissionId] = useState12();
   const [panel, setPanel] = useState12("");
   const [notice, setNotice] = useState12("");
+  const [note, setNote] = useState12("");
   const [reason, setReason] = useState12("");
   const [correctionError, setCorrectionError] = useState12("");
   const [newBillError, setNewBillError] = useState12("");
@@ -6228,6 +6230,17 @@ function ConnectedBillLifecycle({ appearance, actorName, claimsAdministratorHint
     } catch {
     }
   };
+  const addNote = async () => {
+    const value = note.trim();
+    if (!value) return;
+    setNotice("");
+    try {
+      await lifecycle.addNote({ note: value, ...actor });
+      setNote("");
+      setNotice("Note added.");
+    } catch {
+    }
+  };
   const submitCorrection = async (value) => {
     setNotice("");
     setCorrectionError("");
@@ -6318,7 +6331,8 @@ function ConnectedBillLifecycle({ appearance, actorName, claimsAdministratorHint
   const mappedRibbonItems = data.history ? billSubmissionsRibbonFromHistory(data.history, data.attempts) : [];
   const activeSubmissionId = selectedSubmissionId ?? mappedRibbonItems.find((item) => item.active)?.id ?? mappedRibbonItems[mappedRibbonItems.length - 1]?.id;
   const ribbonItems = mappedRibbonItems.map((item) => ({ ...item, active: item.id === activeSubmissionId }));
-  const selectedHistoryEntryId = ribbonItems.find((item) => item.id === activeSubmissionId)?.historyEntryId;
+  const selectedAttempt = data.attempts?.find((attempt) => attempt.id === activeSubmissionId);
+  const billNotes = (data.history ?? []).filter((entry) => entry.kind === "note").slice().reverse();
   const statusContacts = reportBillStatusContacts(data.delivery);
   const receiptEntries = (data.history ?? []).filter((entry) => entry.kind === "submission" || entry.kind === "ack");
   const reviewDeadline = secondReviewDeadline(data.eors);
@@ -6326,7 +6340,7 @@ function ConnectedBillLifecycle({ appearance, actorName, claimsAdministratorHint
     /* @__PURE__ */ jsx15("style", { children: CONNECTED_LIFECYCLE_STYLES }),
     ribbonItems.length >= 2 ? /* @__PURE__ */ jsx15(BillSubmissionsRibbon, { items: ribbonItems, onSelect: (item) => {
       setSelectedSubmissionId(item.id);
-      setTab("history");
+      setTab("details");
     }, ...appearance ? { appearance } : {} }) : null,
     data.lifecycle.state.toLowerCase() === "rejected" && data.rejection ? /* @__PURE__ */ jsx15(BillRejectionNotice, { rejection: data.rejection, submittedAt: data.lifecycle.submittedAt ?? null, ...appearance ? { appearance } : {} }) : /* @__PURE__ */ jsx15(BillLifecycleProgress, { state: data.lifecycle.state, nativeStatus: data.lifecycle.nativeStatus, submittedAt: data.lifecycle.submittedAt ?? null, agingDays: data.lifecycle.agingDays ?? null, ...appearance ? { appearance } : {} }),
     /* @__PURE__ */ jsxs15("header", { className: "mb-lifecycle-head", children: [
@@ -6348,6 +6362,40 @@ function ConnectedBillLifecycle({ appearance, actorName, claimsAdministratorHint
       /* @__PURE__ */ jsx15("button", { type: "button", role: "tab", "aria-selected": tab === "history", onClick: () => setTab("history"), children: "Bill history" })
     ] }),
     tab === "details" ? /* @__PURE__ */ jsxs15("div", { className: "mb-lifecycle-tabpanel", role: "tabpanel", children: [
+      selectedAttempt && ribbonItems.length >= 2 ? /* @__PURE__ */ jsxs15("section", { className: "mb-lifecycle-attempt-detail", "aria-label": "Selected submission detail", children: [
+        /* @__PURE__ */ jsxs15("header", { children: [
+          /* @__PURE__ */ jsxs15("div", { children: [
+            /* @__PURE__ */ jsx15("span", { children: "Selected submission" }),
+            /* @__PURE__ */ jsx15("h3", { children: selectedAttempt.label })
+          ] }),
+          /* @__PURE__ */ jsx15("strong", { children: selectedAttempt.isCurrent ? "Current" : "Previous" })
+        ] }),
+        /* @__PURE__ */ jsxs15("dl", { children: [
+          /* @__PURE__ */ jsxs15("div", { children: [
+            /* @__PURE__ */ jsx15("dt", { children: "Bill" }),
+            /* @__PURE__ */ jsxs15("dd", { children: [
+              "#",
+              selectedAttempt.billNumber || data.bill.billNumber
+            ] })
+          ] }),
+          /* @__PURE__ */ jsxs15("div", { children: [
+            /* @__PURE__ */ jsx15("dt", { children: "Delivery" }),
+            /* @__PURE__ */ jsx15("dd", { children: selectedAttempt.deliveryLabel || "\u2014" })
+          ] }),
+          /* @__PURE__ */ jsxs15("div", { children: [
+            /* @__PURE__ */ jsx15("dt", { children: "Sent" }),
+            /* @__PURE__ */ jsx15("dd", { children: selectedAttempt.sentAt ? new Date(selectedAttempt.sentAt).toLocaleString() : "\u2014" })
+          ] }),
+          /* @__PURE__ */ jsxs15("div", { children: [
+            /* @__PURE__ */ jsx15("dt", { children: "Status" }),
+            /* @__PURE__ */ jsx15("dd", { children: selectedAttempt.ackLabel || selectedAttempt.status || "Submitted" })
+          ] }),
+          selectedAttempt.complianceLabel ? /* @__PURE__ */ jsxs15("div", { children: [
+            /* @__PURE__ */ jsx15("dt", { children: selectedAttempt.complianceLabel }),
+            /* @__PURE__ */ jsx15("dd", { children: selectedAttempt.complianceAt ? new Date(selectedAttempt.complianceAt).toLocaleDateString() : "\u2014" })
+          ] }) : null
+        ] })
+      ] }) : null,
       data.eors.length || data.payments.length || ["processed", "denied", "partially_paid"].includes(data.lifecycle.state) ? /* @__PURE__ */ jsx15(BillExplanationOfReview, { remittance: data.remittance, eors: data.eors, payments: data.payments, submittedAt: data.lifecycle.submittedAt ?? null, onOpenEor: lifecycle.openEor, ...appearance ? { appearance } : {} }) : null,
       showSandboxControls ? /* @__PURE__ */ jsxs15("section", { className: "mb-lifecycle-simulator", "aria-label": "Sandbox lifecycle simulator", children: [
         /* @__PURE__ */ jsxs15("div", { children: [
@@ -6360,8 +6408,35 @@ function ConnectedBillLifecycle({ appearance, actorName, claimsAdministratorHint
           /* @__PURE__ */ jsx15("span", { children: scenario.detail })
         ] }, scenario.id)) }) : /* @__PURE__ */ jsx15("p", { className: "mb-lifecycle-simulator-idle", children: "No simulated payer transition is needed at this stage. Use the bill action below to continue." })
       ] }) : null,
-      /* @__PURE__ */ jsx15(BillReadOnlyForm, { data, onOpenAttachment: lifecycle.openAttachment, ...appearance ? { appearance } : {} })
-    ] }) : /* @__PURE__ */ jsx15("div", { className: "mb-lifecycle-tabpanel", role: "tabpanel", children: data.history?.length ? /* @__PURE__ */ jsx15(BillHistoryTable, { entries: data.history, ...selectedHistoryEntryId ? { selectedEntryId: selectedHistoryEntryId } : {}, onOpenDocument: lifecycle.openAttachment, ...appearance ? { appearance } : {} }) : /* @__PURE__ */ jsx15(BillActivityTimeline, { events: data.activity, ...appearance ? { appearance } : {} }) }),
+      /* @__PURE__ */ jsx15(BillReadOnlyForm, { data, onOpenAttachment: lifecycle.openAttachment, ...appearance ? { appearance } : {} }),
+      /* @__PURE__ */ jsxs15("section", { className: "mb-lifecycle-notes", "aria-label": "Bill notes", children: [
+        /* @__PURE__ */ jsxs15("header", { children: [
+          /* @__PURE__ */ jsxs15("div", { children: [
+            /* @__PURE__ */ jsx15("h3", { children: "Bill notes" }),
+            /* @__PURE__ */ jsx15("p", { children: "Shared with everyone working this bill through the Partner API." })
+          ] }),
+          /* @__PURE__ */ jsx15("span", { children: billNotes.length })
+        ] }),
+        billNotes.length ? /* @__PURE__ */ jsx15("ol", { children: billNotes.map((entry) => /* @__PURE__ */ jsxs15("li", { children: [
+          /* @__PURE__ */ jsx15("p", { children: entry.summary }),
+          /* @__PURE__ */ jsxs15("small", { children: [
+            entry.actor || "System",
+            " \xB7 ",
+            usDate(entry.date)
+          ] })
+        ] }, entry.id)) }) : /* @__PURE__ */ jsx15("p", { className: "mb-lifecycle-notes-empty", children: "No notes yet." }),
+        /* @__PURE__ */ jsxs15("form", { onSubmit: (event) => {
+          event.preventDefault();
+          void addNote();
+        }, children: [
+          /* @__PURE__ */ jsxs15("label", { children: [
+            /* @__PURE__ */ jsx15("span", { children: "Add a note" }),
+            /* @__PURE__ */ jsx15("textarea", { value: note, maxLength: 2e3, placeholder: "Add context for the billing team\u2026", onChange: (event) => setNote(event.target.value) })
+          ] }),
+          /* @__PURE__ */ jsx15("button", { type: "submit", className: "mb-lifecycle-button primary", disabled: lifecycle.isMutating || !note.trim(), children: lifecycle.isMutating ? "Adding\u2026" : "Add note" })
+        ] })
+      ] })
+    ] }) : /* @__PURE__ */ jsx15("div", { className: "mb-lifecycle-tabpanel", role: "tabpanel", children: data.history?.length ? /* @__PURE__ */ jsx15(BillHistoryTable, { entries: data.history, onOpenDocument: lifecycle.openAttachment, ...appearance ? { appearance } : {} }) : /* @__PURE__ */ jsx15(BillActivityTimeline, { events: data.activity, ...appearance ? { appearance } : {} }) }),
     viewEor || actions.length ? /* @__PURE__ */ jsxs15("aside", { className: "mb-lifecycle-actions-sheet", "aria-label": "Bill actions", children: [
       viewEor && data.eors[0] ? /* @__PURE__ */ jsx15("button", { type: "button", className: "mb-lifecycle-button secondary", onClick: () => void lifecycle.openEor(data.eors[0]).catch(() => void 0), children: viewEor.label }) : null,
       actions.map((action) => /* @__PURE__ */ jsx15("button", { type: "button", className: action.primary ? "mb-lifecycle-button primary" : "mb-lifecycle-button secondary", onClick: () => {
@@ -6591,19 +6666,23 @@ function ConnectedBillLifecycle({ appearance, actorName, claimsAdministratorHint
   ] });
 }
 var CONNECTED_LIFECYCLE_STYLES = `
+.mb-lifecycle-attempt-detail{display:grid;gap:15px;padding:18px;border:1px solid color-mix(in srgb,var(--mb-accent) 38%,var(--mb-border));border-radius:var(--mb-radius,14px);background:color-mix(in srgb,var(--mb-accent) 5%,var(--mb-surface))}.mb-lifecycle-attempt-detail>header{display:flex;align-items:flex-start;justify-content:space-between;gap:16px}.mb-lifecycle-attempt-detail>header span{color:var(--mb-accent);font-size:.72rem;font-weight:850;letter-spacing:.08em;text-transform:uppercase}.mb-lifecycle-attempt-detail h3{margin:3px 0 0;font-size:1.08rem}.mb-lifecycle-attempt-detail>header>strong{padding:4px 9px;border:1px solid color-mix(in srgb,var(--mb-accent) 35%,var(--mb-border));border-radius:999px;background:var(--mb-surface);color:var(--mb-accent);font-size:.75rem}.mb-lifecycle-attempt-detail dl{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin:0}.mb-lifecycle-attempt-detail dl>div{display:grid;gap:2px;min-width:0}.mb-lifecycle-attempt-detail dt{color:var(--mb-muted);font-size:.7rem;font-weight:800;letter-spacing:.06em;text-transform:uppercase}.mb-lifecycle-attempt-detail dd{min-width:0;margin:0;font-weight:700;overflow-wrap:anywhere}
+.mb-lifecycle-notes{display:grid;gap:14px;padding:20px;border:1px solid var(--mb-border);border-radius:var(--mb-radius,14px);background:var(--mb-surface)}.mb-lifecycle-notes>header{display:flex;align-items:center;justify-content:space-between;gap:16px}.mb-lifecycle-notes h3{margin:0;font-size:1.08rem}.mb-lifecycle-notes header p{margin:3px 0 0;color:var(--mb-muted)}.mb-lifecycle-notes>header>span{display:grid;place-items:center;min-width:28px;height:28px;border-radius:999px;background:var(--mb-soft);font-weight:750}.mb-lifecycle-notes ol{display:grid;gap:9px;margin:0;padding:0;list-style:none}.mb-lifecycle-notes li{padding:11px 13px;border-left:3px solid color-mix(in srgb,var(--mb-accent) 52%,var(--mb-border));border-radius:0 8px 8px 0;background:var(--mb-soft)}.mb-lifecycle-notes li p{margin:0;white-space:pre-wrap}.mb-lifecycle-notes li small{display:block;margin-top:4px;color:var(--mb-muted)}.mb-lifecycle-notes-empty{margin:0;color:var(--mb-muted)}.mb-lifecycle-notes form{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:end;gap:10px}.mb-lifecycle-notes label{display:grid;gap:6px;font-size:.82rem;font-weight:750}.mb-lifecycle-notes textarea{width:100%;min-height:76px;padding:10px 12px;border:1px solid var(--mb-border);border-radius:var(--mb-control-radius,8px);background:var(--mb-input,#fff);color:var(--mb-text);font:inherit;resize:vertical}
 .mb-lifecycle-simulator{display:grid;gap:14px;padding:18px;border:1px solid #b8dadd;border-radius:var(--mb-radius,14px);background:#f2fbfb}.mb-lifecycle-simulator>div:first-child>span{color:var(--mb-accent);font-size:.72rem;font-weight:850;letter-spacing:.09em;text-transform:uppercase}.mb-lifecycle-simulator h3{margin:3px 0 0;font-size:1.05rem}.mb-lifecycle-simulator p{margin:4px 0 0;color:var(--mb-muted)}.mb-lifecycle-simulator-actions{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:10px}.mb-lifecycle-simulator-actions button{min-height:76px;border:1px solid #a9cccf;border-radius:10px;background:var(--mb-surface);color:var(--mb-text);cursor:pointer;padding:12px 14px;text-align:left;font:inherit}.mb-lifecycle-simulator-actions button:hover{border-color:var(--mb-accent);box-shadow:0 3px 14px rgba(23,108,112,.1)}.mb-lifecycle-simulator-actions button:disabled{cursor:not-allowed;opacity:.55}.mb-lifecycle-simulator-actions button strong,.mb-lifecycle-simulator-actions button span{display:block}.mb-lifecycle-simulator-actions button span{margin-top:3px;color:var(--mb-muted);font-size:.83rem}.mb-lifecycle-simulator-idle{padding:10px 12px;border-radius:8px;background:rgba(255,255,255,.72)}
 .mb-connected-lifecycle{--mb-accent:#176c70;--mb-text:#17282d;--mb-muted:#607176;--mb-border:#d7e0df;--mb-soft:#f4f7f6;--mb-surface:#fff;display:grid;gap:18px;color:var(--mb-text);font:14px/1.45 var(--mb-font,Inter,ui-sans-serif,system-ui,sans-serif)}.mb-connected-lifecycle *{box-sizing:border-box}.mb-lifecycle-head{display:flex;align-items:center;justify-content:space-between;gap:20px}.mb-lifecycle-title{display:flex;align-items:center;flex-wrap:wrap;gap:10px}.mb-lifecycle-title h2{margin:0;font-size:1.7rem}.mb-lifecycle-head p{margin:3px 0 0;color:var(--mb-muted)}.mb-lifecycle-tabs{display:grid;grid-template-columns:1fr 1fr;border:1px solid var(--mb-border);border-radius:12px;background:var(--mb-surface);padding:6px}.mb-lifecycle-tabs button{min-height:46px;border:0;border-radius:8px;background:transparent;color:var(--mb-muted);font:inherit;font-size:1rem;font-weight:750;cursor:pointer}.mb-lifecycle-tabs button[aria-selected=true]{background:var(--mb-accent);color:white}.mb-lifecycle-tabpanel{display:grid;gap:18px}.mb-lifecycle-button{min-height:40px;border:1px solid var(--mb-border);border-radius:var(--mb-control-radius,8px);background:var(--mb-input,#fff);color:var(--mb-text);cursor:pointer;font:inherit;font-weight:750;padding:9px 14px}.mb-lifecycle-button.primary{border-color:var(--mb-accent);background:var(--mb-accent);color:var(--mb-accent-contrast,#fff)}.mb-lifecycle-button:disabled{cursor:not-allowed;opacity:.5}.mb-lifecycle-actions-sheet{position:sticky;bottom:12px;z-index:24;display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:9px;padding:10px;border:1px solid var(--mb-border);border-radius:12px;background:color-mix(in srgb,var(--mb-surface) 94%,transparent);box-shadow:0 10px 34px rgba(18,35,43,.16);backdrop-filter:blur(12px)}.mb-lifecycle-card,.mb-lifecycle-panel{padding:20px;border:1px solid var(--mb-border);border-radius:var(--mb-radius,14px);background:var(--mb-surface)}.mb-lifecycle-card header{display:flex;align-items:center;justify-content:space-between;gap:20px}.mb-lifecycle-card h3,.mb-lifecycle-panel h3{margin:0;font-size:1.08rem}.mb-lifecycle-card p,.mb-lifecycle-panel p{margin:3px 0 0;color:var(--mb-muted)}.mb-lifecycle-card header>span{display:grid;place-items:center;min-width:28px;height:28px;border-radius:999px;background:var(--mb-soft);font-weight:750}.mb-lifecycle-documents{list-style:none;margin:14px 0 0;padding:0}.mb-lifecycle-documents li{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:12px 0;border-top:1px solid var(--mb-border)}.mb-lifecycle-documents li>div{display:grid;gap:3px;min-width:0}.mb-lifecycle-documents li span{color:var(--mb-muted);font-size:.85rem}.mb-lifecycle-dialog-backdrop{position:fixed;z-index:2147483000;inset:0;display:grid;place-items:center;padding:20px;background:rgba(18,35,43,.56);backdrop-filter:blur(3px)}.mb-lifecycle-dialog{position:relative;width:min(760px,100%);max-height:calc(100dvh - 40px);overflow:auto;outline:0}.mb-lifecycle-dialog-close{position:absolute;z-index:1;top:12px;right:12px;width:44px;height:44px;border:1px solid var(--mb-border);border-radius:10px;background:var(--mb-surface);color:var(--mb-text);cursor:pointer;font:24px/1 inherit}.mb-lifecycle-panel{display:grid;gap:17px;padding-top:24px;box-shadow:0 24px 70px rgba(18,35,43,.22)}.mb-lifecycle-panel label{display:grid;gap:6px;font-size:.85rem;font-weight:750}.mb-lifecycle-panel label small{color:var(--mb-muted);font-weight:500}.mb-lifecycle-panel input,.mb-lifecycle-panel select,.mb-lifecycle-panel textarea{width:100%;min-height:44px;border:1px solid var(--mb-border);border-radius:var(--mb-control-radius,8px);background:var(--mb-input,#fff);color:var(--mb-text);font:inherit;padding:10px 12px}.mb-lifecycle-panel textarea{min-height:100px;resize:vertical}.mb-lifecycle-fields{display:grid;gap:13px}.mb-lifecycle-fields.two{grid-template-columns:repeat(2,minmax(0,1fr))}.mb-lifecycle-fields .full{grid-column:1/-1}.mb-lifecycle-panel-actions{display:flex;justify-content:flex-end;gap:8px}.mb-lifecycle-packet{display:grid;gap:0;margin:0;padding:0;border:0}.mb-lifecycle-packet legend{margin-bottom:7px;font-size:.85rem;font-weight:800}.mb-lifecycle-packet>label{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:10px;padding:10px 2px;border-top:1px solid var(--mb-border)}.mb-lifecycle-packet>label>input{width:16px;min-height:16px}.mb-lifecycle-packet>label>span{display:grid}.mb-lifecycle-packet button{border:0;background:transparent;color:var(--mb-accent);cursor:pointer;font:inherit}.mb-lifecycle-message,.mb-lifecycle-error,.mb-lifecycle-loading{padding:12px 14px;border-radius:9px}.mb-lifecycle-message.success{background:#edf9f2;color:#217449}.mb-lifecycle-message.error,.mb-lifecycle-error{background:#fff0ef;color:#9d3029}.mb-lifecycle-error{display:flex;align-items:center;gap:12px}.mb-lifecycle-error span{flex:1}.mb-lifecycle-error button{border:1px solid currentColor;border-radius:7px;background:transparent;color:inherit;padding:7px 10px}
 .mb-lifecycle-dialog.wide{width:min(1280px,100%)}.mb-lifecycle-correction{display:grid;gap:16px;padding:22px;border-radius:var(--mb-radius,14px);background:var(--mb-surface);box-shadow:0 24px 70px rgba(18,35,43,.22)}.mb-lifecycle-correction>header{display:flex;align-items:flex-start;justify-content:space-between;gap:18px;padding-right:56px}.mb-lifecycle-correction h3{margin:0;font-size:1.2rem}.mb-lifecycle-correction header p{margin:4px 0 0;color:var(--mb-muted)}.mb-lifecycle-live-warning,.mb-lifecycle-correction-reason,.mb-lifecycle-correction-contact{display:grid;gap:4px;padding:13px 15px;border-radius:10px}.mb-lifecycle-live-warning{border-left:4px solid #b97716;background:#fff8e8;color:#6f470e}.mb-lifecycle-correction-reason{grid-template-columns:max-content minmax(0,1fr);align-items:start;column-gap:18px;row-gap:10px;border-left:4px solid #c5443f;background:#fff2f1;color:#812d29}.mb-lifecycle-correction-reason-code,.mb-lifecycle-correction-reason-description{display:grid;gap:4px}.mb-lifecycle-correction-reason-code>span,.mb-lifecycle-correction-reason-description>span,.mb-lifecycle-correction-reason-code small>span{color:#9b514d;font-size:.7rem;font-weight:850;letter-spacing:.07em;text-transform:uppercase}.mb-lifecycle-correction-reason code{width:max-content;border:1px solid #e8b4b0;border-radius:6px;background:rgba(255,255,255,.66);color:#812d29;font:750 .84rem/1.35 ui-monospace,SFMono-Regular,Menlo,monospace;padding:3px 7px}.mb-lifecycle-correction-reason-code small{display:grid;gap:1px;margin-top:3px;color:#9b514d;font:500 .72rem/1.35 ui-monospace,SFMono-Regular,Menlo,monospace}.mb-lifecycle-correction-reason-description strong{font-size:.94rem}.mb-lifecycle-correction-reason>ul{grid-column:1/-1;display:grid;gap:5px;margin:0;padding:8px 0 0 18px;border-top:1px solid #ecc7c4}.mb-lifecycle-correction-reason li{padding-left:3px}.mb-lifecycle-correction-reason li code{margin-right:7px}.mb-lifecycle-correction-contact{border:1px solid color-mix(in srgb,var(--mb-accent) 35%,var(--mb-border));background:color-mix(in srgb,var(--mb-accent) 7%,var(--mb-surface))}.mb-lifecycle-correction-contact dl{display:grid;gap:10px;margin:8px 0 0}.mb-lifecycle-correction-contact dl>div{display:grid;grid-template-columns:68px minmax(0,1fr);gap:10px}.mb-lifecycle-correction-contact dt{padding-top:2px;color:var(--mb-muted);font-size:.78rem;font-weight:800;text-transform:uppercase}.mb-lifecycle-correction-contact dd{min-width:0;margin:0;overflow-wrap:anywhere}.mb-lifecycle-correction-contact dd ul{display:grid;gap:4px;margin:0;padding:0;list-style:none}.mb-lifecycle-correction-contact dd li{min-width:0}.mb-lifecycle-correction-contact a{color:var(--mb-accent);text-underline-offset:2px}.mb-lifecycle-correction-note{display:grid;gap:6px;font-size:.85rem;font-weight:750}.mb-lifecycle-correction-note textarea{min-height:76px;border:1px solid var(--mb-border);border-radius:var(--mb-control-radius,8px);background:var(--mb-input,#fff);color:var(--mb-text);font:inherit;padding:10px 12px;resize:vertical}
 .mb-payment-total{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 14px;border-radius:9px;background:var(--mb-soft)}.mb-payment-total strong{font-size:1.12rem}
 .mb-lifecycle-deadline-hint{margin:0;padding:10px 12px;border-radius:9px;background:color-mix(in srgb,var(--mb-warning,#8a5c17) 10%,var(--mb-surface));color:var(--mb-warning,#8a5c17);font-size:.85rem}
-@media(max-width:700px){.mb-lifecycle-head,.mb-lifecycle-card header{align-items:stretch;flex-direction:column}.mb-lifecycle-head>.mb-lifecycle-button{width:100%}.mb-lifecycle-actions-sheet{bottom:calc(var(--mb-host-bottom-offset,72px) + env(safe-area-inset-bottom) + 8px);grid-template-columns:repeat(2,minmax(0,1fr))}.mb-lifecycle-actions-sheet .mb-lifecycle-button:last-child:nth-child(odd){grid-column:1/-1}.mb-lifecycle-fields.two{grid-template-columns:1fr}.mb-lifecycle-fields .full{grid-column:auto}.mb-lifecycle-dialog-backdrop{align-items:end;padding:0}.mb-lifecycle-dialog{max-height:calc(100dvh - 12px)}.mb-lifecycle-dialog .mb-lifecycle-panel,.mb-lifecycle-correction{border-radius:18px 18px 0 0}.mb-lifecycle-correction{padding:18px 12px calc(18px + env(safe-area-inset-bottom))}.mb-lifecycle-correction>header{align-items:stretch;flex-direction:column;padding-right:56px}.mb-lifecycle-correction-reason{grid-template-columns:1fr}.mb-lifecycle-correction-reason>ul{grid-column:auto}.mb-lifecycle-correction-contact dl>div{grid-template-columns:1fr;gap:2px}.mb-lifecycle-tabs button{font-size:.9rem}.mb-lifecycle-title h2{font-size:1.4rem}}
+@media(max-width:700px){.mb-lifecycle-attempt-detail dl{grid-template-columns:repeat(2,minmax(0,1fr))}.mb-lifecycle-notes form{grid-template-columns:1fr}.mb-lifecycle-notes form button{width:100%}.mb-lifecycle-head,.mb-lifecycle-card header{align-items:stretch;flex-direction:column}.mb-lifecycle-head>.mb-lifecycle-button{width:100%}.mb-lifecycle-actions-sheet{bottom:calc(var(--mb-host-bottom-offset,72px) + env(safe-area-inset-bottom) + 8px);grid-template-columns:repeat(2,minmax(0,1fr))}.mb-lifecycle-actions-sheet .mb-lifecycle-button:last-child:nth-child(odd){grid-column:1/-1}.mb-lifecycle-fields.two{grid-template-columns:1fr}.mb-lifecycle-fields .full{grid-column:auto}.mb-lifecycle-dialog-backdrop{align-items:end;padding:0}.mb-lifecycle-dialog{max-height:calc(100dvh - 12px)}.mb-lifecycle-dialog .mb-lifecycle-panel,.mb-lifecycle-correction{border-radius:18px 18px 0 0}.mb-lifecycle-correction{padding:18px 12px calc(18px + env(safe-area-inset-bottom))}.mb-lifecycle-correction>header{align-items:stretch;flex-direction:column;padding-right:56px}.mb-lifecycle-correction-reason{grid-template-columns:1fr}.mb-lifecycle-correction-reason>ul{grid-column:auto}.mb-lifecycle-correction-contact dl>div{grid-template-columns:1fr;gap:2px}.mb-lifecycle-tabs button{font-size:.9rem}.mb-lifecycle-title h2{font-size:1.4rem}}
 `;
 
 // src/connected-billing-workspace.tsx
 import {
   useCallback as useCallback5,
   useEffect as useEffect11,
+  useLayoutEffect,
   useMemo as useMemo10,
+  useRef as useRef7,
   useState as useState13
 } from "react";
 
@@ -6735,6 +6814,7 @@ function createBillingOperationsClient({
 import { Fragment as Fragment14, jsx as jsx16, jsxs as jsxs16 } from "react/jsx-runtime";
 var css11 = `
 .mbow{color:var(--mb-text);font:14px/1.45 var(--mb-font);background:var(--mb-soft);border-radius:var(--mb-radius);padding:20px}.mbow *{box-sizing:border-box}.mbow h2,.mbow h3,.mbow p{margin:0}.mbow a{color:var(--mb-accent)}
+.mbow-workspace{width:100%;height:100%;max-height:var(--mbow-available-height,100dvh);min-height:0;overflow:auto;overscroll-behavior:contain;scrollbar-gutter:stable}
 .mbow-head{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;margin-bottom:18px}.mbow-head h2{font-size:24px;line-height:1.2}.mbow-sub{color:var(--mb-muted);margin-top:4px!important}.mbow-actions{display:flex;gap:8px;flex-wrap:wrap}
 .mbow-button,.mbow-input,.mbow-select{min-height:38px;border:1px solid var(--mb-border);border-radius:var(--mb-control-radius);background:var(--mb-input);color:var(--mb-text);font:inherit}.mbow-button{padding:7px 12px;cursor:pointer;font-weight:650}.mbow-button:hover{border-color:var(--mb-accent)}.mbow-button.primary{background:var(--mb-accent);border-color:var(--mb-accent);color:var(--mb-accent-contrast)}.mbow-button:disabled{opacity:.55;cursor:not-allowed}.mbow-input,.mbow-select{padding:7px 10px}.mbow-input{min-width:260px;flex:1}
 .mbow-tabs{display:flex;gap:4px;border-bottom:1px solid var(--mb-border);margin-bottom:18px;overflow:auto}.mbow-tab{border:0;border-bottom:3px solid transparent;background:transparent;color:var(--mb-muted);padding:10px 13px;font:inherit;font-weight:700;white-space:nowrap;cursor:pointer}.mbow-tab.active{color:var(--mb-text);border-bottom-color:var(--mb-accent)}
@@ -6759,12 +6839,40 @@ function defaultRange(days = 29) {
   const iso = (date2) => date2.toISOString().slice(0, 10);
   return { from: iso(from), to: iso(to) };
 }
-function Surface({ appearance, className = "", style, children }) {
-  return /* @__PURE__ */ jsxs16("div", { className: `mbow ${className}`.trim(), style: mindBillAppearanceStyle(appearance, style), children: [
+function Surface({ appearance, className = "", style, children, surfaceRef }) {
+  return /* @__PURE__ */ jsxs16("div", { ref: surfaceRef, className: `mbow ${className}`.trim(), style: mindBillAppearanceStyle(appearance, style), children: [
     /* @__PURE__ */ jsx16("style", { children: css11 }),
     children
   ] });
 }
+function useAvailableViewportHeight() {
+  const workspaceRef = useRef7(null);
+  const [availableHeight, setAvailableHeight] = useState13(null);
+  useLayoutEffect(() => {
+    const element = workspaceRef.current;
+    if (!element || typeof window === "undefined") return;
+    let frame = 0;
+    const update = () => {
+      window.cancelAnimationFrame(frame);
+      frame = window.requestAnimationFrame(() => {
+        const viewportHeight = window.visualViewport?.height ?? window.innerHeight;
+        const top = Math.max(0, element.getBoundingClientRect().top);
+        setAvailableHeight(Math.max(240, viewportHeight - top - 16));
+      });
+    };
+    update();
+    window.addEventListener("resize", update);
+    window.addEventListener("scroll", update, true);
+    window.visualViewport?.addEventListener("resize", update);
+    return () => {
+      window.cancelAnimationFrame(frame);
+      window.removeEventListener("resize", update);
+      window.removeEventListener("scroll", update, true);
+      window.visualViewport?.removeEventListener("resize", update);
+    };
+  }, []);
+  return { workspaceRef, availableHeight };
+}
 function useClient(options) {
   return useMemo10(() => createBillingOperationsClient(options), [options.apiBaseUrl, options.fetch, options.getSession, options.sessionEndpoint]);
 }
@@ -7089,7 +7197,11 @@ function ConnectedBillingWorkspace({ appearance, className, style, initialView =
   const [view, setView] = useState13(initialView);
   const [billQuery, setBillQuery] = useState13({ status: "all" });
   const [selectedBillId, setSelectedBillId] = useState13(null);
-  if (selectedBillId) return /* @__PURE__ */ jsxs16(Surface, { appearance, className, style, children: [
+  const { workspaceRef, availableHeight } = useAvailableViewportHeight();
+  const workspaceClassName = ["mbow-workspace", className].filter(Boolean).join(" ");
+  const hasExplicitHeight = style?.height != null || style?.maxHeight != null;
+  const workspaceStyle = availableHeight == null || hasExplicitHeight ? style : { ...style, maxHeight: availableHeight };
+  if (selectedBillId) return /* @__PURE__ */ jsxs16(Surface, { surfaceRef: workspaceRef, appearance, className: workspaceClassName, style: workspaceStyle, children: [
     /* @__PURE__ */ jsx16("button", { className: "mbow-button mbow-back", type: "button", onClick: () => setSelectedBillId(null), children: "\u2190 Back to bills" }),
     /* @__PURE__ */ jsx16(ConnectedBillLifecycle, { billId: selectedBillId, ...options, ...appearance ? { appearance } : {} })
   ] });
@@ -7098,7 +7210,7 @@ function ConnectedBillingWorkspace({ appearance, className, style, initialView =
     setSelectedBillId(null);
   };
   const appearanceProps = appearance ? { appearance } : {};
-  return /* @__PURE__ */ jsxs16(Surface, { appearance, className, style, children: [
+  return /* @__PURE__ */ jsxs16(Surface, { surfaceRef: workspaceRef, appearance, className: workspaceClassName, style: workspaceStyle, children: [
     /* @__PURE__ */ jsxs16("div", { className: "mbow-head", children: [
       /* @__PURE__ */ jsxs16("div", { children: [
         /* @__PURE__ */ jsx16("h2", { children: "Billing" }),
@@ -7116,7 +7228,7 @@ function ConnectedBillingWorkspace({ appearance, className, style, initialView =
 
 // src/index.tsx
 function widget(tagName, props) {
-  const ref = useRef7(null);
+  const ref = useRef8(null);
   const { onMindBill, onMindBillError } = props;
   useEffect12(() => {
     const element = ref.current;