@mindbill/react 0.4.0 → 0.6.0

package/README.md

@@ -1,11 +1,28 @@
 # @mindbill/react
 
-React wrappers for the secure `@mindbill/embed` custom elements. See the repository's [10-minute quickstart](https://github.com/incidentfox/mindbill-widgets#add-mindbill-billing-in-10-minutes).
+Native React billing components plus wrappers for MindBill's secure hosted workflows. See the repository's [10-minute quickstart](https://github.com/incidentfox/mindbill-widgets#add-mindbill-billing-in-10-minutes).
 
 Published on npm as [`@mindbill/react`](https://www.npmjs.com/package/@mindbill/react). Install it with `npm install @mindbill/react @mindbill/embed` or your preferred package manager.
 
+Use `BillReviewForm` when billing should feel like part of your product. Your server loads and mutates the review model with a short-lived MindBill session; the component remains controlled and never receives a Partner API key.
+
 ```tsx
-import { HostedBillReview } from "@mindbill/react";
+import { BillReviewForm } from "@mindbill/react";
+
+<BillReviewForm
+  data={billReview}
+  appearance={{ accentColor: "#32a9d6", textColor: "#203743" }}
+  onSave={(input) => api.patch("/billing/review", input)}
+  onSubmit={(input, route) => api.post("/billing/submit", { input, route })}
+  onAddAttachment={(file, documentType, description) =>
+    api.upload("/billing/attachments", { file, documentType, description })
+  }
+  onRemoveAttachment={(attachmentId) =>
+    api.delete(`/billing/attachments/${attachmentId}`)
+  }
+/>
 ```
 
-Create the short-lived embed session on your server; never send a Partner API key to React/browser code.
+Use `BillStatusSummary` for the compact lifecycle surface. `HostedBillReview` and `HostedBillTimeline` remain available when a hosted flow is a better fit.
+
+Never send a Partner API key or long-lived credential to React/browser code.

package/dist/index.d.ts

@@ -2,6 +2,158 @@ import { MindBillAppearance, MindBillEventDetail, MindBillErrorDetail } from '@m
 export { MindBillAppearance, MindBillErrorDetail, MindBillEventDetail } from '@mindbill/embed';
 import { CSSProperties, ReactElement } from 'react';
 
+type BillReviewDocumentType = "final_report" | "letter_of_attestation" | "proof_of_service" | "form_122" | "return_to_work_voucher" | "w9" | "medical_records" | "appeal" | "other";
+type BillReviewBillingProvider = {
+    id?: string;
+    name: string;
+    taxId: string;
+    npi: string;
+    billType: "Professional" | "Institutional";
+    phone?: string;
+    billingStreet?: string;
+    billingCity?: string;
+    billingState?: string;
+    billingZip?: string;
+};
+type BillReviewClinician = {
+    id?: string;
+    name: string;
+    specialty: string;
+    npi: string;
+    taxonomy?: string;
+    licenseNumber?: string;
+    licenseState?: string;
+    signaturePng?: string;
+    signatureKey?: string;
+    isQME?: boolean;
+    isAME?: boolean;
+    email?: string;
+    active?: boolean;
+};
+type BillReviewLocation = {
+    id?: string;
+    billingProviderId?: string;
+    name: string;
+    nickname?: string;
+    street: string;
+    city: string;
+    state: string;
+    zip: string;
+    county?: string;
+    posCode?: string;
+    isPrimary?: boolean;
+    active?: boolean;
+};
+type BillReviewLineItem = {
+    id?: string;
+    code: string;
+    modifiers: string[];
+    units: number;
+    charge: number;
+    feeSchedule?: number;
+};
+type BillReviewAttachment = {
+    id: string;
+    filename: string;
+    description?: string | null;
+    documentType: string;
+    reportType?: string | null;
+    source?: string;
+    addedAt?: string;
+    contentUrl?: string;
+};
+type BillReviewData = {
+    bill: {
+        id: string;
+        billNumber: string | number;
+        status: string;
+        transmissionState?: string;
+        dos: string;
+        dosEnd?: string | null;
+        placeOfServiceId?: string;
+        authorizationNumber?: string | null;
+        billingProviderId?: string;
+        renderingProviderId?: string;
+        billingSnapshot?: {
+            billingProvider?: BillReviewBillingProvider;
+            renderingProvider?: BillReviewClinician;
+            placeOfService?: BillReviewLocation;
+        } | null;
+        lineItems: BillReviewLineItem[];
+        attachments: BillReviewAttachment[];
+        totalCharge: number;
+        totalPaid: number;
+        balanceDue: number;
+    };
+    patient: {
+        name: string;
+        dob?: string;
+    };
+    injury: {
+        claimNumber?: string;
+        employer?: string;
+        doi?: string;
+        claimsAdminId?: string;
+    };
+    options?: {
+        billingProviders?: BillReviewBillingProvider[];
+        renderingProviders?: BillReviewClinician[];
+        locations?: BillReviewLocation[];
+    };
+};
+type BillReviewSaveInput = {
+    dos: string;
+    dosEnd?: string | null;
+    authorizationNumber?: string | null;
+    billingProviderId?: string;
+    billingProvider?: Omit<BillReviewBillingProvider, "id">;
+    renderingProviderId?: string;
+    renderingProvider?: Omit<BillReviewClinician, "id">;
+    placeOfServiceId?: string;
+    placeOfService?: Omit<BillReviewLocation, "id">;
+    lineItems: Array<{
+        id?: string;
+        code: string;
+        modifiers: string[];
+        units: number;
+    }>;
+};
+type BillSubmissionRoute = "ebill" | "fax" | "mail" | "email";
+type BillReviewFormProps = {
+    data: BillReviewData;
+    onSave: (input: BillReviewSaveInput) => Promise<BillReviewData | void>;
+    onSubmit: (input: BillReviewSaveInput, route: BillSubmissionRoute) => Promise<void>;
+    onAddAttachment: (file: File, documentType: BillReviewDocumentType, description?: string) => Promise<void>;
+    onRemoveAttachment: (attachmentId: string) => Promise<void>;
+    onOpenAttachment?: (attachment: BillReviewAttachment) => void;
+    className?: string;
+    style?: CSSProperties;
+    appearance?: MindBillAppearance;
+    disabled?: boolean;
+};
+type BillReviewDraft = {
+    dos: string;
+    dosEnd: string;
+    authorizationNumber: string;
+    billingProvider: BillReviewBillingProvider;
+    clinician: BillReviewClinician;
+    location: BillReviewLocation;
+    lineItems: BillReviewLineItem[];
+};
+declare function buildBillReviewSaveInput(draft: BillReviewDraft): BillReviewSaveInput;
+declare function BillReviewForm({ data, onSave, onSubmit, onAddAttachment, onRemoveAttachment, onOpenAttachment, className, style, appearance, disabled, }: BillReviewFormProps): ReactElement;
+type BillStatusSummaryProps = {
+    status: string;
+    submittedAt?: string | null;
+    totalCharge: number;
+    totalPaid: number;
+    balanceDue: number;
+    className?: string;
+    style?: CSSProperties;
+    appearance?: MindBillAppearance;
+};
+declare function BillStatusSummary({ status, submittedAt, totalCharge, totalPaid, balanceDue, className, style, appearance }: BillStatusSummaryProps): ReactElement;
+
 type MindBillWidgetProps = {
     sessionToken: string;
     embedUrl: string;
@@ -22,4 +174,4 @@ declare const HostedBillFromReport: typeof MindBillBillFromReport;
 declare const HostedCollections: typeof MindBillCollections;
 declare const HostedOnboarding: typeof MindBillOnboarding;
 
-export { HostedBillFromReport, HostedBillReview, HostedBillTimeline, HostedCollections, HostedOnboarding, MindBillBillFromReport, MindBillBillReview, MindBillBillTimeline, MindBillCollections, MindBillOnboarding, type MindBillWidgetProps };
+export { type BillReviewAttachment, type BillReviewBillingProvider, type BillReviewClinician, type BillReviewData, type BillReviewDocumentType, type BillReviewDraft, BillReviewForm, type BillReviewFormProps, type BillReviewLineItem, type BillReviewLocation, type BillReviewSaveInput, BillStatusSummary, type BillStatusSummaryProps, type BillSubmissionRoute, HostedBillFromReport, HostedBillReview, HostedBillTimeline, HostedCollections, HostedOnboarding, MindBillBillFromReport, MindBillBillReview, MindBillBillTimeline, MindBillCollections, MindBillOnboarding, type MindBillWidgetProps, buildBillReviewSaveInput };

package/dist/index.js

@@ -2,11 +2,424 @@
 
 // src/index.tsx
 import "@mindbill/embed";
-import { createElement, useEffect, useRef } from "react";
+import { createElement, useEffect as useEffect2, useRef } from "react";
+
+// src/native-bill-review.tsx
+import { useEffect, useId, useMemo, useState } from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+var EMPTY_BILLING_PROVIDER = {
+  name: "",
+  taxId: "",
+  npi: "",
+  billType: "Professional"
+};
+var EMPTY_CLINICIAN = {
+  name: "",
+  specialty: "",
+  npi: ""
+};
+var EMPTY_LOCATION = {
+  name: "",
+  street: "",
+  city: "",
+  state: "",
+  zip: "",
+  posCode: "11"
+};
+var DOCUMENT_LABELS = {
+  final_report: "Final medical-legal report",
+  letter_of_attestation: "Letter of attestation",
+  proof_of_service: "Proof of service",
+  form_122: "DWC Form 122",
+  return_to_work_voucher: "Return-to-work voucher",
+  w9: "W-9",
+  medical_records: "Medical records",
+  appeal: "Appeal or review support",
+  other: "Other supporting document"
+};
+function withoutId(value) {
+  const result = { ...value };
+  delete result.id;
+  return result;
+}
+function toDraft(data) {
+  const snapshot = data.bill.billingSnapshot;
+  return {
+    dos: data.bill.dos || "",
+    dosEnd: data.bill.dosEnd || "",
+    authorizationNumber: data.bill.authorizationNumber || "",
+    billingProvider: {
+      ...EMPTY_BILLING_PROVIDER,
+      ...snapshot?.billingProvider ?? {}
+    },
+    clinician: { ...EMPTY_CLINICIAN, ...snapshot?.renderingProvider ?? {} },
+    location: { ...EMPTY_LOCATION, ...snapshot?.placeOfService ?? {} },
+    lineItems: data.bill.lineItems.map((line) => ({ ...line }))
+  };
+}
+function buildBillReviewSaveInput(draft) {
+  return {
+    dos: draft.dos,
+    dosEnd: draft.dosEnd || null,
+    authorizationNumber: draft.authorizationNumber.trim() || null,
+    ...draft.billingProvider.id ? { billingProviderId: draft.billingProvider.id } : {},
+    billingProvider: withoutId(draft.billingProvider),
+    ...draft.clinician.id ? { renderingProviderId: draft.clinician.id } : {},
+    renderingProvider: withoutId(draft.clinician),
+    ...draft.location.id ? { placeOfServiceId: draft.location.id } : {},
+    placeOfService: withoutId(draft.location),
+    lineItems: draft.lineItems.map(({ id, code, modifiers, units }) => ({
+      ...id ? { id } : {},
+      code: code.trim().toUpperCase(),
+      modifiers,
+      units
+    }))
+  };
+}
+function money(value) {
+  return new Intl.NumberFormat("en-US", {
+    style: "currency",
+    currency: "USD"
+  }).format(value);
+}
+function appearanceStyle(appearance, style) {
+  return {
+    ...appearance?.accentColor ? { "--mb-accent": appearance.accentColor } : {},
+    ...appearance?.textColor ? { "--mb-text": appearance.textColor } : {},
+    ...appearance?.mutedColor ? { "--mb-muted": appearance.mutedColor } : {},
+    ...appearance?.borderColor ? { "--mb-border": appearance.borderColor } : {},
+    ...appearance?.backgroundColor ? { "--mb-soft": appearance.backgroundColor } : {},
+    ...appearance?.surfaceColor ? { "--mb-surface": appearance.surfaceColor } : {},
+    ...appearance?.fontFamily ? { "--mb-font": appearance.fontFamily } : {},
+    ...style
+  };
+}
+function Field({
+  label,
+  value,
+  onChange,
+  type = "text",
+  optional,
+  required
+}) {
+  return /* @__PURE__ */ jsxs("label", { className: "mb-native-field", children: [
+    /* @__PURE__ */ jsxs("span", { children: [
+      label,
+      " ",
+      optional ? /* @__PURE__ */ jsx("small", { children: "Optional" }) : null
+    ] }),
+    /* @__PURE__ */ jsx(
+      "input",
+      {
+        type,
+        value,
+        required,
+        onChange: (event) => onChange(event.target.value)
+      }
+    )
+  ] });
+}
+function BillReviewForm({
+  data,
+  onSave,
+  onSubmit,
+  onAddAttachment,
+  onRemoveAttachment,
+  onOpenAttachment,
+  className,
+  style,
+  appearance,
+  disabled = false
+}) {
+  const [draft, setDraft] = useState(() => toDraft(data));
+  const [route, setRoute] = useState("ebill");
+  const [file, setFile] = useState(null);
+  const [documentType, setDocumentType] = useState("other");
+  const [busy, setBusy] = useState("");
+  const [error, setError] = useState("");
+  const [notice, setNotice] = useState("");
+  const routeName = useId();
+  const editable = data.bill.status === "incomplete" && !disabled;
+  useEffect(() => setDraft(toDraft(data)), [data]);
+  const canSubmit = useMemo(
+    () => Boolean(
+      draft.dos && draft.billingProvider.name.trim() && draft.billingProvider.taxId.trim() && draft.billingProvider.npi.trim() && draft.clinician.name.trim() && draft.clinician.npi.trim() && draft.location.name.trim() && draft.location.street.trim() && draft.location.city.trim() && draft.location.state.trim() && draft.location.zip.trim() && draft.lineItems.length && draft.lineItems.every((line) => line.code.trim() && line.units > 0)
+    ),
+    [draft]
+  );
+  const updateBillingProvider = (key, value) => setDraft((current) => ({
+    ...current,
+    billingProvider: { ...current.billingProvider, [key]: value }
+  }));
+  const updateClinician = (key, value) => setDraft((current) => ({
+    ...current,
+    clinician: { ...current.clinician, [key]: value }
+  }));
+  const updateLocation = (key, value) => setDraft((current) => ({
+    ...current,
+    location: { ...current.location, [key]: value }
+  }));
+  async function run(action, task) {
+    setBusy(action);
+    setError("");
+    setNotice("");
+    try {
+      await task();
+      setNotice(action === "save" ? "Changes saved." : "Bill submitted.");
+    } catch (cause) {
+      setError(
+        cause instanceof Error ? cause.message : "MindBill could not complete this request."
+      );
+    } finally {
+      setBusy("");
+    }
+  }
+  const handleSave = (event) => {
+    event.preventDefault();
+    void run("save", async () => {
+      const updated = await onSave(buildBillReviewSaveInput(draft));
+      if (updated) setDraft(toDraft(updated));
+    });
+  };
+  const handleSubmit = () => run("submit", () => onSubmit(buildBillReviewSaveInput(draft), route));
+  const attach = async () => {
+    if (!file) return;
+    setBusy("attachment");
+    setError("");
+    try {
+      await onAddAttachment(file, documentType, DOCUMENT_LABELS[documentType]);
+      setFile(null);
+      setDocumentType("other");
+      setNotice("Document added to the payer packet.");
+    } catch (cause) {
+      setError(cause instanceof Error ? cause.message : "Document could not be attached.");
+    } finally {
+      setBusy("");
+    }
+  };
+  const sectionClass = "mb-native-section";
+  return /* @__PURE__ */ jsxs(
+    "form",
+    {
+      className: ["mb-native-review", className].filter(Boolean).join(" "),
+      style: appearanceStyle(appearance, style),
+      onSubmit: handleSave,
+      children: [
+        /* @__PURE__ */ jsx("style", { children: NATIVE_BILL_REVIEW_STYLES }),
+        /* @__PURE__ */ jsxs("header", { className: "mb-native-heading", children: [
+          /* @__PURE__ */ jsxs("div", { children: [
+            /* @__PURE__ */ jsx("span", { className: "mb-native-eyebrow", children: "Billing review" }),
+            /* @__PURE__ */ jsxs("h2", { children: [
+              "Bill #",
+              data.bill.billNumber
+            ] }),
+            /* @__PURE__ */ jsx("p", { children: "Review the prefilled claim and payer packet, then submit." })
+          ] }),
+          /* @__PURE__ */ jsxs("div", { className: "mb-native-total", children: [
+            /* @__PURE__ */ jsx("span", { children: data.bill.status }),
+            /* @__PURE__ */ jsx("strong", { children: money(data.bill.totalCharge) })
+          ] })
+        ] }),
+        /* @__PURE__ */ jsxs("dl", { className: "mb-native-summary", children: [
+          /* @__PURE__ */ jsxs("div", { children: [
+            /* @__PURE__ */ jsx("dt", { children: "Patient" }),
+            /* @__PURE__ */ jsx("dd", { children: data.patient.name || "\u2014" })
+          ] }),
+          /* @__PURE__ */ jsxs("div", { children: [
+            /* @__PURE__ */ jsx("dt", { children: "Claim" }),
+            /* @__PURE__ */ jsx("dd", { children: data.injury.claimNumber || "\u2014" })
+          ] }),
+          /* @__PURE__ */ jsxs("div", { children: [
+            /* @__PURE__ */ jsx("dt", { children: "Employer" }),
+            /* @__PURE__ */ jsx("dd", { children: data.injury.employer || "\u2014" })
+          ] }),
+          /* @__PURE__ */ jsxs("div", { children: [
+            /* @__PURE__ */ jsx("dt", { children: "Date of injury" }),
+            /* @__PURE__ */ jsx("dd", { children: data.injury.doi || "\u2014" })
+          ] })
+        ] }),
+        /* @__PURE__ */ jsxs("section", { className: sectionClass, children: [
+          /* @__PURE__ */ jsx("div", { className: "mb-native-section-head", children: /* @__PURE__ */ jsxs("div", { children: [
+            /* @__PURE__ */ jsx("h3", { children: "Claim and service" }),
+            /* @__PURE__ */ jsx("p", { children: "These values print on the bill." })
+          ] }) }),
+          /* @__PURE__ */ jsxs("div", { className: "mb-native-grid three", children: [
+            /* @__PURE__ */ jsx(Field, { label: "Date of service", type: "date", required: true, value: draft.dos, onChange: (dos) => setDraft((current) => ({ ...current, dos })) }),
+            /* @__PURE__ */ jsx(Field, { label: "End date", type: "date", optional: true, value: draft.dosEnd, onChange: (dosEnd) => setDraft((current) => ({ ...current, dosEnd })) }),
+            /* @__PURE__ */ jsx(Field, { label: "Authorization number", optional: true, value: draft.authorizationNumber, onChange: (authorizationNumber) => setDraft((current) => ({ ...current, authorizationNumber })) })
+          ] })
+        ] }),
+        /* @__PURE__ */ jsxs("section", { className: sectionClass, children: [
+          /* @__PURE__ */ jsxs("div", { className: "mb-native-section-head", children: [
+            /* @__PURE__ */ jsxs("div", { children: [
+              /* @__PURE__ */ jsx("h3", { children: "Billing practice" }),
+              /* @__PURE__ */ jsx("p", { children: "Payee identity and billing address for this claim." })
+            ] }),
+            /* @__PURE__ */ jsx("span", { children: "Prefilled" })
+          ] }),
+          /* @__PURE__ */ jsxs("div", { className: "mb-native-grid three", children: [
+            /* @__PURE__ */ jsx(Field, { label: "Practice name", required: true, value: draft.billingProvider.name, onChange: (value) => updateBillingProvider("name", value) }),
+            /* @__PURE__ */ jsx(Field, { label: "Tax ID", required: true, value: draft.billingProvider.taxId, onChange: (value) => updateBillingProvider("taxId", value) }),
+            /* @__PURE__ */ jsx(Field, { label: "Group NPI", required: true, value: draft.billingProvider.npi, onChange: (value) => updateBillingProvider("npi", value) }),
+            /* @__PURE__ */ jsx(Field, { label: "Phone", optional: true, value: draft.billingProvider.phone || "", onChange: (value) => updateBillingProvider("phone", value) }),
+            /* @__PURE__ */ jsx(Field, { label: "Billing street", required: true, value: draft.billingProvider.billingStreet || "", onChange: (value) => updateBillingProvider("billingStreet", value) }),
+            /* @__PURE__ */ jsx(Field, { label: "City", required: true, value: draft.billingProvider.billingCity || "", onChange: (value) => updateBillingProvider("billingCity", value) }),
+            /* @__PURE__ */ jsx(Field, { label: "State", required: true, value: draft.billingProvider.billingState || "", onChange: (value) => updateBillingProvider("billingState", value) }),
+            /* @__PURE__ */ jsx(Field, { label: "ZIP", required: true, value: draft.billingProvider.billingZip || "", onChange: (value) => updateBillingProvider("billingZip", value) })
+          ] })
+        ] }),
+        /* @__PURE__ */ jsxs("section", { className: sectionClass, children: [
+          /* @__PURE__ */ jsxs("div", { className: "mb-native-section-head", children: [
+            /* @__PURE__ */ jsxs("div", { children: [
+              /* @__PURE__ */ jsx("h3", { children: "Clinician" }),
+              /* @__PURE__ */ jsx("p", { children: "Provider identity printed on the claim." })
+            ] }),
+            /* @__PURE__ */ jsx("span", { children: "Prefilled" })
+          ] }),
+          /* @__PURE__ */ jsxs("div", { className: "mb-native-grid three", children: [
+            /* @__PURE__ */ jsx(Field, { label: "Clinician name", required: true, value: draft.clinician.name, onChange: (value) => updateClinician("name", value) }),
+            /* @__PURE__ */ jsx(Field, { label: "Specialty", value: draft.clinician.specialty, onChange: (value) => updateClinician("specialty", value) }),
+            /* @__PURE__ */ jsx(Field, { label: "NPI", required: true, value: draft.clinician.npi, onChange: (value) => updateClinician("npi", value) }),
+            /* @__PURE__ */ jsx(Field, { label: "Taxonomy", optional: true, value: draft.clinician.taxonomy || "", onChange: (value) => updateClinician("taxonomy", value) }),
+            /* @__PURE__ */ jsx(Field, { label: "License number", optional: true, value: draft.clinician.licenseNumber || "", onChange: (value) => updateClinician("licenseNumber", value) }),
+            /* @__PURE__ */ jsx(Field, { label: "License state", optional: true, value: draft.clinician.licenseState || "", onChange: (value) => updateClinician("licenseState", value) })
+          ] })
+        ] }),
+        /* @__PURE__ */ jsxs("section", { className: sectionClass, children: [
+          /* @__PURE__ */ jsxs("div", { className: "mb-native-section-head", children: [
+            /* @__PURE__ */ jsxs("div", { children: [
+              /* @__PURE__ */ jsx("h3", { children: "Service location" }),
+              /* @__PURE__ */ jsx("p", { children: "The exact place of service for this bill." })
+            ] }),
+            /* @__PURE__ */ jsx("span", { children: "Prefilled" })
+          ] }),
+          /* @__PURE__ */ jsxs("div", { className: "mb-native-grid three", children: [
+            /* @__PURE__ */ jsx(Field, { label: "Location name", required: true, value: draft.location.name, onChange: (value) => updateLocation("name", value) }),
+            /* @__PURE__ */ jsx(Field, { label: "Street", required: true, value: draft.location.street, onChange: (value) => updateLocation("street", value) }),
+            /* @__PURE__ */ jsx(Field, { label: "City", required: true, value: draft.location.city, onChange: (value) => updateLocation("city", value) }),
+            /* @__PURE__ */ jsx(Field, { label: "State", required: true, value: draft.location.state, onChange: (value) => updateLocation("state", value) }),
+            /* @__PURE__ */ jsx(Field, { label: "ZIP", required: true, value: draft.location.zip, onChange: (value) => updateLocation("zip", value) }),
+            /* @__PURE__ */ jsx(Field, { label: "Place of service code", required: true, value: draft.location.posCode || "11", onChange: (value) => updateLocation("posCode", value) })
+          ] })
+        ] }),
+        /* @__PURE__ */ jsxs("section", { className: sectionClass, children: [
+          /* @__PURE__ */ jsxs("div", { className: "mb-native-section-head", children: [
+            /* @__PURE__ */ jsxs("div", { children: [
+              /* @__PURE__ */ jsx("h3", { children: "Procedure lines" }),
+              /* @__PURE__ */ jsx("p", { children: "MindBill recalculates the allowed amount when changes are saved." })
+            ] }),
+            /* @__PURE__ */ jsx("button", { type: "button", className: "mb-native-button quiet", disabled: !editable, onClick: () => setDraft((current) => ({ ...current, lineItems: [...current.lineItems, { code: "", modifiers: [], units: 1, charge: 0 }] })), children: "+ Add line" })
+          ] }),
+          /* @__PURE__ */ jsx("div", { className: "mb-native-lines", children: draft.lineItems.map((line, index) => /* @__PURE__ */ jsxs("div", { className: "mb-native-line", children: [
+            /* @__PURE__ */ jsx(Field, { label: "Procedure", required: true, value: line.code, onChange: (value) => setDraft((current) => ({ ...current, lineItems: current.lineItems.map((item, itemIndex) => itemIndex === index ? { ...item, code: value } : item) })) }),
+            /* @__PURE__ */ jsx(Field, { label: "Modifiers", value: line.modifiers.join(", "), onChange: (value) => setDraft((current) => ({ ...current, lineItems: current.lineItems.map((item, itemIndex) => itemIndex === index ? { ...item, modifiers: value.split(",").map((part) => part.trim()).filter(Boolean) } : item) })) }),
+            /* @__PURE__ */ jsxs("label", { className: "mb-native-field", children: [
+              /* @__PURE__ */ jsx("span", { children: "Units" }),
+              /* @__PURE__ */ jsx("input", { type: "number", min: "1", required: true, value: line.units, onChange: (event) => setDraft((current) => ({ ...current, lineItems: current.lineItems.map((item, itemIndex) => itemIndex === index ? { ...item, units: Number(event.target.value) } : item) })) })
+            ] }),
+            /* @__PURE__ */ jsxs("div", { className: "mb-native-allowed", children: [
+              /* @__PURE__ */ jsx("span", { children: "Allowed" }),
+              /* @__PURE__ */ jsx("strong", { children: money(line.charge) })
+            ] }),
+            /* @__PURE__ */ jsx("button", { type: "button", className: "mb-native-remove", "aria-label": `Remove ${line.code || "procedure"}`, disabled: !editable || draft.lineItems.length === 1, onClick: () => setDraft((current) => ({ ...current, lineItems: current.lineItems.filter((_, itemIndex) => itemIndex !== index) })), children: "\xD7" })
+          ] }, line.id || index)) })
+        ] }),
+        /* @__PURE__ */ jsxs("section", { className: sectionClass, children: [
+          /* @__PURE__ */ jsxs("div", { className: "mb-native-section-head", children: [
+            /* @__PURE__ */ jsxs("div", { children: [
+              /* @__PURE__ */ jsx("h3", { children: "Payer billing packet" }),
+              /* @__PURE__ */ jsx("p", { children: "Review exactly what will be sent with this bill." })
+            ] }),
+            /* @__PURE__ */ jsxs("span", { children: [
+              data.bill.attachments.length,
+              " files"
+            ] })
+          ] }),
+          /* @__PURE__ */ jsxs("div", { className: "mb-native-note", children: [
+            /* @__PURE__ */ jsx("strong", { children: "Separate from attorney report service." }),
+            " Final reports, proof of service, and required billing forms may be preselected. Medical records are never silently attached."
+          ] }),
+          /* @__PURE__ */ jsx("ul", { className: "mb-native-documents", children: data.bill.attachments.map((attachment) => /* @__PURE__ */ jsxs("li", { children: [
+            /* @__PURE__ */ jsx("span", { className: "mb-native-file", children: "PDF" }),
+            /* @__PURE__ */ jsxs("div", { children: [
+              /* @__PURE__ */ jsx("strong", { children: attachment.filename }),
+              /* @__PURE__ */ jsx("span", { children: DOCUMENT_LABELS[attachment.documentType] || attachment.description || "Supporting document" })
+            ] }),
+            onOpenAttachment ? /* @__PURE__ */ jsx("button", { type: "button", className: "mb-native-button quiet", onClick: () => onOpenAttachment(attachment), children: "View" }) : null,
+            /* @__PURE__ */ jsx("button", { type: "button", className: "mb-native-remove", disabled: !editable || busy === "attachment", "aria-label": `Remove ${attachment.filename}`, onClick: () => void onRemoveAttachment(attachment.id).catch((cause) => setError(cause instanceof Error ? cause.message : "Document could not be removed.")), children: "\xD7" })
+          ] }, attachment.id)) }),
+          /* @__PURE__ */ jsxs("div", { className: "mb-native-attach", children: [
+            /* @__PURE__ */ jsxs("div", { children: [
+              /* @__PURE__ */ jsx("strong", { children: "Add supporting PDF" }),
+              /* @__PURE__ */ jsx("span", { children: "Choose any additional document intentionally. Up to 25 MB." })
+            ] }),
+            /* @__PURE__ */ jsx("select", { "aria-label": "Document type", value: documentType, disabled: !editable, onChange: (event) => setDocumentType(event.target.value), children: Object.entries(DOCUMENT_LABELS).map(([value, label]) => /* @__PURE__ */ jsx("option", { value, children: label }, value)) }),
+            /* @__PURE__ */ jsx("input", { "aria-label": "Choose supporting PDF", type: "file", accept: "application/pdf,.pdf", disabled: !editable, onChange: (event) => setFile(event.target.files?.[0] || null) }),
+            /* @__PURE__ */ jsx("button", { className: "mb-native-button secondary", type: "button", disabled: !editable || !file || busy === "attachment", onClick: () => void attach(), children: busy === "attachment" ? "Attaching\u2026" : "Attach document" })
+          ] })
+        ] }),
+        /* @__PURE__ */ jsxs("section", { className: "mb-native-submit", children: [
+          /* @__PURE__ */ jsxs("div", { children: [
+            /* @__PURE__ */ jsx("span", { className: "mb-native-eyebrow", children: "Delivery" }),
+            /* @__PURE__ */ jsx("h3", { children: "Submit this bill" }),
+            /* @__PURE__ */ jsx("p", { children: "MindBill will send the claim and own status, payment, denial, and resubmission." })
+          ] }),
+          /* @__PURE__ */ jsxs("fieldset", { children: [
+            /* @__PURE__ */ jsx("legend", { children: "Send via" }),
+            ["ebill", "fax", "mail", "email"].map((value) => /* @__PURE__ */ jsxs("label", { children: [
+              /* @__PURE__ */ jsx("input", { type: "radio", name: routeName, value, checked: route === value, onChange: () => setRoute(value) }),
+              value === "ebill" ? "E-bill" : value.charAt(0).toUpperCase() + value.slice(1)
+            ] }, value))
+          ] }),
+          error ? /* @__PURE__ */ jsx("div", { className: "mb-native-message error", role: "alert", children: error }) : null,
+          notice ? /* @__PURE__ */ jsx("div", { className: "mb-native-message success", role: "status", children: notice }) : null,
+          /* @__PURE__ */ jsxs("div", { className: "mb-native-actions", children: [
+            /* @__PURE__ */ jsx("button", { className: "mb-native-button secondary", type: "submit", disabled: !editable || busy !== "", children: busy === "save" ? "Saving\u2026" : "Save changes" }),
+            /* @__PURE__ */ jsx("button", { className: "mb-native-button primary", type: "button", disabled: !editable || !canSubmit || busy !== "", onClick: () => void handleSubmit(), children: busy === "submit" ? "Submitting\u2026" : "Submit bill" })
+          ] })
+        ] })
+      ]
+    }
+  );
+}
+function BillStatusSummary({ status, submittedAt, totalCharge, totalPaid, balanceDue, className, style, appearance }) {
+  return /* @__PURE__ */ jsxs("section", { className: ["mb-native-status", className].filter(Boolean).join(" "), style: appearanceStyle(appearance, style), children: [
+    /* @__PURE__ */ jsx("style", { children: NATIVE_BILL_REVIEW_STYLES }),
+    /* @__PURE__ */ jsxs("div", { children: [
+      /* @__PURE__ */ jsx("span", { className: "mb-native-eyebrow", children: "Bill status" }),
+      /* @__PURE__ */ jsx("h3", { children: status.replaceAll("_", " ") }),
+      submittedAt ? /* @__PURE__ */ jsxs("p", { children: [
+        "Submitted ",
+        new Date(submittedAt).toLocaleDateString()
+      ] }) : null
+    ] }),
+    /* @__PURE__ */ jsxs("dl", { children: [
+      /* @__PURE__ */ jsxs("div", { children: [
+        /* @__PURE__ */ jsx("dt", { children: "Charged" }),
+        /* @__PURE__ */ jsx("dd", { children: money(totalCharge) })
+      ] }),
+      /* @__PURE__ */ jsxs("div", { children: [
+        /* @__PURE__ */ jsx("dt", { children: "Paid" }),
+        /* @__PURE__ */ jsx("dd", { children: money(totalPaid) })
+      ] }),
+      /* @__PURE__ */ jsxs("div", { children: [
+        /* @__PURE__ */ jsx("dt", { children: "Balance" }),
+        /* @__PURE__ */ jsx("dd", { children: money(balanceDue) })
+      ] })
+    ] })
+  ] });
+}
+var NATIVE_BILL_REVIEW_STYLES = `
+.mb-native-review,.mb-native-status{font-family:var(--mb-font,Inter,ui-sans-serif,system-ui,sans-serif)}
+.mb-native-review,.mb-native-status{--mb-accent:#238dbd;--mb-accent-dark:#176f98;--mb-text:#203743;--mb-muted:#657982;--mb-border:#dbe6ea;--mb-soft:#f3f8fa;--mb-surface:#fff;color:var(--mb-text);font:14px/1.45 Inter,ui-sans-serif,system-ui,sans-serif}.mb-native-review *,.mb-native-status *{box-sizing:border-box}.mb-native-review{display:grid;gap:16px}.mb-native-heading{display:flex;align-items:flex-end;justify-content:space-between;gap:24px;padding:6px 2px}.mb-native-heading h2,.mb-native-section h3,.mb-native-submit h3,.mb-native-status h3{margin:3px 0 2px;line-height:1.2}.mb-native-heading h2{font-size:25px}.mb-native-heading p,.mb-native-section p,.mb-native-submit p,.mb-native-status p{margin:0;color:var(--mb-muted)}.mb-native-eyebrow{color:#59727d;font-size:11px;font-weight:800;letter-spacing:.14em;text-transform:uppercase}.mb-native-total{display:flex;align-items:center;gap:18px}.mb-native-total span,.mb-native-section-head>span{border-radius:999px;background:var(--mb-soft);color:#58717c;font-size:11px;font-weight:800;padding:6px 10px;text-transform:capitalize}.mb-native-total strong{font-size:24px}.mb-native-summary{display:grid;grid-template-columns:repeat(4,1fr);margin:0;border:1px solid var(--mb-border);border-radius:12px;background:var(--mb-surface);overflow:hidden}.mb-native-summary div{padding:17px 20px;border-right:1px solid var(--mb-border)}.mb-native-summary div:last-child{border:0}.mb-native-summary dt,.mb-native-allowed span{color:#647982;font-size:10px;font-weight:800;letter-spacing:.12em;text-transform:uppercase}.mb-native-summary dd{margin:5px 0 0;font-weight:750}.mb-native-section{padding:20px;border:1px solid var(--mb-border);border-radius:14px;background:var(--mb-surface);box-shadow:0 8px 24px rgba(28,58,72,.04)}.mb-native-section-head{display:flex;align-items:start;justify-content:space-between;gap:16px;margin-bottom:17px}.mb-native-section h3,.mb-native-submit h3,.mb-native-status h3{font-size:19px}.mb-native-grid{display:grid;gap:14px}.mb-native-grid.three{grid-template-columns:repeat(3,minmax(0,1fr))}.mb-native-field{display:grid;gap:6px;min-width:0;color:var(--mb-text);font-size:12px;font-weight:750}.mb-native-field small{color:var(--mb-muted);font-size:inherit;font-weight:500}.mb-native-field input,.mb-native-attach select,.mb-native-attach input{width:100%;min-height:43px;border:1px solid var(--mb-border);border-radius:8px;background:#fff;color:var(--mb-text);font:inherit;padding:10px 12px}.mb-native-field input:focus,.mb-native-attach select:focus,.mb-native-attach input:focus{border-color:var(--mb-accent);box-shadow:0 0 0 3px color-mix(in srgb,var(--mb-accent) 14%,transparent);outline:0}.mb-native-lines{display:grid;gap:10px}.mb-native-line{display:grid;grid-template-columns:1.1fr 1.1fr 110px 120px 28px;align-items:end;gap:12px;padding:13px;background:var(--mb-soft);border:1px solid #e3edf0;border-radius:10px}.mb-native-allowed{display:grid;gap:5px;padding:0 8px 11px;text-align:right}.mb-native-allowed strong{font-size:16px}.mb-native-remove{border:0;background:transparent;color:#667d86;cursor:pointer;font-size:20px;padding:7px}.mb-native-note{padding:13px 15px;border:1px solid #bdd9e4;border-radius:9px;background:#f2f9fc;color:#526d78}.mb-native-note strong{color:var(--mb-text);margin-right:12px}.mb-native-documents{list-style:none;margin:14px 0;padding:0}.mb-native-documents li{display:grid;grid-template-columns:42px 1fr auto 28px;align-items:center;gap:12px;padding:12px 4px;border-bottom:1px solid var(--mb-border)}.mb-native-documents li>div{display:grid}.mb-native-documents li span{color:var(--mb-muted);font-size:12px}.mb-native-file{display:grid;place-items:center;width:40px;height:40px;border-radius:8px;background:#eaf5f9;color:var(--mb-accent)!important;font-size:11px!important;font-weight:850}.mb-native-attach{display:grid;grid-template-columns:1fr 230px minmax(220px,1fr) auto;align-items:end;gap:12px;padding:15px;border-radius:10px;background:var(--mb-soft)}.mb-native-attach>div{display:grid;gap:3px}.mb-native-attach span{color:var(--mb-muted);font-size:12px}.mb-native-button{min-height:40px;border:1px solid var(--mb-border);border-radius:8px;background:#fff;color:var(--mb-text);cursor:pointer;font:inherit;font-weight:750;padding:9px 14px}.mb-native-button.primary{border-color:var(--mb-accent);background:var(--mb-accent);color:#fff}.mb-native-button.primary:hover{background:var(--mb-accent-dark)}.mb-native-button.secondary{background:#fff}.mb-native-button.quiet{min-height:auto;background:var(--mb-soft);padding:7px 11px}.mb-native-button:disabled,.mb-native-remove:disabled{cursor:not-allowed;opacity:.5}.mb-native-submit{display:grid;grid-template-columns:1fr auto;align-items:end;gap:18px;padding:22px;border:1px solid #bcd8e2;border-radius:14px;background:linear-gradient(135deg,#f3fafc,#eaf6fa)}.mb-native-submit fieldset{display:flex;gap:6px;margin:0;padding:0;border:0}.mb-native-submit legend{position:absolute;width:1px;height:1px;overflow:hidden}.mb-native-submit fieldset label{display:flex;align-items:center;gap:6px;padding:9px 11px;border:1px solid #c9dce3;border-radius:8px;background:#fff;font-weight:700}.mb-native-actions{display:flex;justify-content:flex-end;gap:10px;grid-column:1/-1}.mb-native-message{grid-column:1/-1;padding:10px 12px;border-radius:8px}.mb-native-message.error{background:#fff0ef;color:#9d3029}.mb-native-message.success{background:#edf9f2;color:#217449}.mb-native-status{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:20px;border:1px solid var(--mb-border);border-radius:12px;background:#fff}.mb-native-status h3{text-transform:capitalize}.mb-native-status dl{display:flex;margin:0}.mb-native-status dl div{min-width:110px;padding:0 18px;border-left:1px solid var(--mb-border)}.mb-native-status dt{color:var(--mb-muted);font-size:11px}.mb-native-status dd{margin:4px 0 0;font-size:17px;font-weight:800}@media(max-width:900px){.mb-native-grid.three{grid-template-columns:repeat(2,minmax(0,1fr))}.mb-native-summary{grid-template-columns:repeat(2,1fr)}.mb-native-summary div:nth-child(2){border-right:0}.mb-native-summary div:nth-child(-n+2){border-bottom:1px solid var(--mb-border)}.mb-native-line{grid-template-columns:1fr 1fr 90px}.mb-native-allowed{align-self:center}.mb-native-attach{grid-template-columns:1fr 1fr}.mb-native-submit{grid-template-columns:1fr}.mb-native-submit fieldset,.mb-native-actions{grid-column:1}.mb-native-actions{justify-content:start}}@media(max-width:620px){.mb-native-heading,.mb-native-total,.mb-native-status{align-items:start;flex-direction:column}.mb-native-grid.three,.mb-native-summary,.mb-native-line,.mb-native-attach{grid-template-columns:1fr}.mb-native-summary div,.mb-native-summary div:nth-child(2){border-right:0;border-bottom:1px solid var(--mb-border)}.mb-native-line{align-items:stretch}.mb-native-allowed{text-align:left}.mb-native-submit fieldset{display:grid;grid-template-columns:1fr 1fr}.mb-native-status dl{width:100%}.mb-native-status dl div{min-width:0;flex:1;padding:0 10px}.mb-native-status dl div:first-child{padding-left:0;border-left:0}}
+.mb-native-review,.mb-native-status{font-family:var(--mb-font,Inter,ui-sans-serif,system-ui,sans-serif)}
+`;
+
+// src/index.tsx
 function widget(tagName, props) {
   const ref = useRef(null);
   const { onMindBill, onMindBillError } = props;
-  useEffect(() => {
+  useEffect2(() => {
     const element = ref.current;
     if (!element) return;
     const handleEvent = (event) => onMindBill?.(event);
@@ -24,6 +437,13 @@ function widget(tagName, props) {
     "embed-url": props.embedUrl,
     theme: props.appearance?.theme,
     "accent-color": props.appearance?.accentColor,
+    "background-color": props.appearance?.backgroundColor,
+    "surface-color": props.appearance?.surfaceColor,
+    "text-color": props.appearance?.textColor,
+    "muted-color": props.appearance?.mutedColor,
+    "border-color": props.appearance?.borderColor,
+    "font-family": props.appearance?.fontFamily,
+    "border-radius": props.appearance?.borderRadius,
     locale: props.appearance?.locale,
     class: props.className,
     style: props.style
@@ -50,6 +470,8 @@ var HostedBillFromReport = MindBillBillFromReport;
 var HostedCollections = MindBillCollections;
 var HostedOnboarding = MindBillOnboarding;
 export {
+  BillReviewForm,
+  BillStatusSummary,
   HostedBillFromReport,
   HostedBillReview,
   HostedBillTimeline,
@@ -59,6 +481,7 @@ export {
   MindBillBillReview,
   MindBillBillTimeline,
   MindBillCollections,
-  MindBillOnboarding
+  MindBillOnboarding,
+  buildBillReviewSaveInput
 };
 //# sourceMappingURL=index.js.map

package/dist/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/index.tsx"],"sourcesContent":["\"use client\";\n\nimport \"@mindbill/embed\";\nimport type { CSSProperties, ReactElement } from \"react\";\nimport { createElement, useEffect, useRef } from \"react\";\nimport type {\n  MindBillAppearance,\n  MindBillErrorDetail,\n  MindBillEventDetail,\n} from \"@mindbill/embed\";\n\nexport type MindBillWidgetProps = {\n  sessionToken: string;\n  embedUrl: string;\n  appearance?: MindBillAppearance;\n  className?: string;\n  style?: CSSProperties;\n  onMindBill?: (event: CustomEvent<MindBillEventDetail>) => void;\n  onMindBillError?: (event: CustomEvent<MindBillErrorDetail>) => void;\n};\n\nfunction widget(tagName: string, props: MindBillWidgetProps): ReactElement {\n  const ref = useRef<HTMLElement | null>(null);\n  const { onMindBill, onMindBillError } = props;\n  useEffect(() => {\n    const element = ref.current;\n    if (!element) return;\n    const handleEvent = (event: Event) =>\n      onMindBill?.(event as CustomEvent<MindBillEventDetail>);\n    const handleError = (event: Event) =>\n      onMindBillError?.(event as CustomEvent<MindBillErrorDetail>);\n    element.addEventListener(\"mindbill\", handleEvent);\n    element.addEventListener(\"mindbill-error\", handleError);\n    return () => {\n      element.removeEventListener(\"mindbill\", handleEvent);\n      element.removeEventListener(\"mindbill-error\", handleError);\n    };\n  }, [onMindBill, onMindBillError]);\n\n  return createElement(tagName, {\n    ref,\n    \"session-token\": props.sessionToken,\n    \"embed-url\": props.embedUrl,\n    theme: props.appearance?.theme,\n    \"accent-color\": props.appearance?.accentColor,\n    locale: props.appearance?.locale,\n    class: props.className,\n    style: props.style,\n  });\n}\n\nexport function MindBillBillTimeline(props: MindBillWidgetProps): ReactElement {\n  return widget(\"mindbill-bill-timeline\", props);\n}\nexport function MindBillBillReview(props: MindBillWidgetProps): ReactElement {\n  return widget(\"mindbill-bill-review\", props);\n}\nexport function MindBillBillFromReport(\n  props: MindBillWidgetProps,\n): ReactElement {\n  return widget(\"mindbill-bill-from-report\", props);\n}\nexport function MindBillCollections(props: MindBillWidgetProps): ReactElement {\n  return widget(\"mindbill-collections\", props);\n}\nexport function MindBillOnboarding(props: MindBillWidgetProps): ReactElement {\n  return widget(\"mindbill-onboarding\", props);\n}\n\nexport const HostedBillTimeline = MindBillBillTimeline;\nexport const HostedBillReview = MindBillBillReview;\nexport const HostedBillFromReport = MindBillBillFromReport;\nexport const HostedCollections = MindBillCollections;\nexport const HostedOnboarding = MindBillOnboarding;\n\nexport type {\n  MindBillAppearance,\n  MindBillErrorDetail,\n  MindBillEventDetail,\n} from \"@mindbill/embed\";\n"],"mappings":";;;AAEA,OAAO;AAEP,SAAS,eAAe,WAAW,cAAc;AAiBjD,SAAS,OAAO,SAAiB,OAA0C;AACzE,QAAM,MAAM,OAA2B,IAAI;AAC3C,QAAM,EAAE,YAAY,gBAAgB,IAAI;AACxC,YAAU,MAAM;AACd,UAAM,UAAU,IAAI;AACpB,QAAI,CAAC,QAAS;AACd,UAAM,cAAc,CAAC,UACnB,aAAa,KAAyC;AACxD,UAAM,cAAc,CAAC,UACnB,kBAAkB,KAAyC;AAC7D,YAAQ,iBAAiB,YAAY,WAAW;AAChD,YAAQ,iBAAiB,kBAAkB,WAAW;AACtD,WAAO,MAAM;AACX,cAAQ,oBAAoB,YAAY,WAAW;AACnD,cAAQ,oBAAoB,kBAAkB,WAAW;AAAA,IAC3D;AAAA,EACF,GAAG,CAAC,YAAY,eAAe,CAAC;AAEhC,SAAO,cAAc,SAAS;AAAA,IAC5B;AAAA,IACA,iBAAiB,MAAM;AAAA,IACvB,aAAa,MAAM;AAAA,IACnB,OAAO,MAAM,YAAY;AAAA,IACzB,gBAAgB,MAAM,YAAY;AAAA,IAClC,QAAQ,MAAM,YAAY;AAAA,IAC1B,OAAO,MAAM;AAAA,IACb,OAAO,MAAM;AAAA,EACf,CAAC;AACH;AAEO,SAAS,qBAAqB,OAA0C;AAC7E,SAAO,OAAO,0BAA0B,KAAK;AAC/C;AACO,SAAS,mBAAmB,OAA0C;AAC3E,SAAO,OAAO,wBAAwB,KAAK;AAC7C;AACO,SAAS,uBACd,OACc;AACd,SAAO,OAAO,6BAA6B,KAAK;AAClD;AACO,SAAS,oBAAoB,OAA0C;AAC5E,SAAO,OAAO,wBAAwB,KAAK;AAC7C;AACO,SAAS,mBAAmB,OAA0C;AAC3E,SAAO,OAAO,uBAAuB,KAAK;AAC5C;AAEO,IAAM,qBAAqB;AAC3B,IAAM,mBAAmB;AACzB,IAAM,uBAAuB;AAC7B,IAAM,oBAAoB;AAC1B,IAAM,mBAAmB;","names":[]}
+{"version":3,"sources":["../src/index.tsx","../src/native-bill-review.tsx"],"sourcesContent":["\"use client\";\n\nimport \"@mindbill/embed\";\nimport type { CSSProperties, ReactElement } from \"react\";\nimport { createElement, useEffect, useRef } from \"react\";\nimport type {\n  MindBillAppearance,\n  MindBillErrorDetail,\n  MindBillEventDetail,\n} from \"@mindbill/embed\";\n\nexport type MindBillWidgetProps = {\n  sessionToken: string;\n  embedUrl: string;\n  appearance?: MindBillAppearance;\n  className?: string;\n  style?: CSSProperties;\n  onMindBill?: (event: CustomEvent<MindBillEventDetail>) => void;\n  onMindBillError?: (event: CustomEvent<MindBillErrorDetail>) => void;\n};\n\nfunction widget(tagName: string, props: MindBillWidgetProps): ReactElement {\n  const ref = useRef<HTMLElement | null>(null);\n  const { onMindBill, onMindBillError } = props;\n  useEffect(() => {\n    const element = ref.current;\n    if (!element) return;\n    const handleEvent = (event: Event) =>\n      onMindBill?.(event as CustomEvent<MindBillEventDetail>);\n    const handleError = (event: Event) =>\n      onMindBillError?.(event as CustomEvent<MindBillErrorDetail>);\n    element.addEventListener(\"mindbill\", handleEvent);\n    element.addEventListener(\"mindbill-error\", handleError);\n    return () => {\n      element.removeEventListener(\"mindbill\", handleEvent);\n      element.removeEventListener(\"mindbill-error\", handleError);\n    };\n  }, [onMindBill, onMindBillError]);\n\n  return createElement(tagName, {\n    ref,\n    \"session-token\": props.sessionToken,\n    \"embed-url\": props.embedUrl,\n    theme: props.appearance?.theme,\n    \"accent-color\": props.appearance?.accentColor,\n    \"background-color\": props.appearance?.backgroundColor,\n    \"surface-color\": props.appearance?.surfaceColor,\n    \"text-color\": props.appearance?.textColor,\n    \"muted-color\": props.appearance?.mutedColor,\n    \"border-color\": props.appearance?.borderColor,\n    \"font-family\": props.appearance?.fontFamily,\n    \"border-radius\": props.appearance?.borderRadius,\n    locale: props.appearance?.locale,\n    class: props.className,\n    style: props.style,\n  });\n}\n\nexport function MindBillBillTimeline(props: MindBillWidgetProps): ReactElement {\n  return widget(\"mindbill-bill-timeline\", props);\n}\nexport function MindBillBillReview(props: MindBillWidgetProps): ReactElement {\n  return widget(\"mindbill-bill-review\", props);\n}\nexport function MindBillBillFromReport(\n  props: MindBillWidgetProps,\n): ReactElement {\n  return widget(\"mindbill-bill-from-report\", props);\n}\nexport function MindBillCollections(props: MindBillWidgetProps): ReactElement {\n  return widget(\"mindbill-collections\", props);\n}\nexport function MindBillOnboarding(props: MindBillWidgetProps): ReactElement {\n  return widget(\"mindbill-onboarding\", props);\n}\n\nexport const HostedBillTimeline = MindBillBillTimeline;\nexport const HostedBillReview = MindBillBillReview;\nexport const HostedBillFromReport = MindBillBillFromReport;\nexport const HostedCollections = MindBillCollections;\nexport const HostedOnboarding = MindBillOnboarding;\n\nexport type {\n  MindBillAppearance,\n  MindBillErrorDetail,\n  MindBillEventDetail,\n} from \"@mindbill/embed\";\n\nexport {\n  BillReviewForm,\n  BillStatusSummary,\n  buildBillReviewSaveInput,\n} from \"./native-bill-review\";\nexport type {\n  BillReviewAttachment,\n  BillReviewBillingProvider,\n  BillReviewClinician,\n  BillReviewData,\n  BillReviewDocumentType,\n  BillReviewDraft,\n  BillReviewFormProps,\n  BillReviewLineItem,\n  BillReviewLocation,\n  BillReviewSaveInput,\n  BillStatusSummaryProps,\n  BillSubmissionRoute,\n} from \"./native-bill-review\";\n","\"use client\";\n\nimport type { MindBillAppearance } from \"@mindbill/embed\";\nimport type { CSSProperties, FormEvent, ReactElement } from \"react\";\nimport { useEffect, useId, useMemo, useState } from \"react\";\n\nexport type BillReviewDocumentType =\n  | \"final_report\"\n  | \"letter_of_attestation\"\n  | \"proof_of_service\"\n  | \"form_122\"\n  | \"return_to_work_voucher\"\n  | \"w9\"\n  | \"medical_records\"\n  | \"appeal\"\n  | \"other\";\n\nexport type BillReviewBillingProvider = {\n  id?: string;\n  name: string;\n  taxId: string;\n  npi: string;\n  billType: \"Professional\" | \"Institutional\";\n  phone?: string;\n  billingStreet?: string;\n  billingCity?: string;\n  billingState?: string;\n  billingZip?: string;\n};\n\nexport type BillReviewClinician = {\n  id?: string;\n  name: string;\n  specialty: string;\n  npi: string;\n  taxonomy?: string;\n  licenseNumber?: string;\n  licenseState?: string;\n  signaturePng?: string;\n  signatureKey?: string;\n  isQME?: boolean;\n  isAME?: boolean;\n  email?: string;\n  active?: boolean;\n};\n\nexport type BillReviewLocation = {\n  id?: string;\n  billingProviderId?: string;\n  name: string;\n  nickname?: string;\n  street: string;\n  city: string;\n  state: string;\n  zip: string;\n  county?: string;\n  posCode?: string;\n  isPrimary?: boolean;\n  active?: boolean;\n};\n\nexport type BillReviewLineItem = {\n  id?: string;\n  code: string;\n  modifiers: string[];\n  units: number;\n  charge: number;\n  feeSchedule?: number;\n};\n\nexport type BillReviewAttachment = {\n  id: string;\n  filename: string;\n  description?: string | null;\n  documentType: string;\n  reportType?: string | null;\n  source?: string;\n  addedAt?: string;\n  contentUrl?: string;\n};\n\nexport type BillReviewData = {\n  bill: {\n    id: string;\n    billNumber: string | number;\n    status: string;\n    transmissionState?: string;\n    dos: string;\n    dosEnd?: string | null;\n    placeOfServiceId?: string;\n    authorizationNumber?: string | null;\n    billingProviderId?: string;\n    renderingProviderId?: string;\n    billingSnapshot?: {\n      billingProvider?: BillReviewBillingProvider;\n      renderingProvider?: BillReviewClinician;\n      placeOfService?: BillReviewLocation;\n    } | null;\n    lineItems: BillReviewLineItem[];\n    attachments: BillReviewAttachment[];\n    totalCharge: number;\n    totalPaid: number;\n    balanceDue: number;\n  };\n  patient: { name: string; dob?: string };\n  injury: {\n    claimNumber?: string;\n    employer?: string;\n    doi?: string;\n    claimsAdminId?: string;\n  };\n  options?: {\n    billingProviders?: BillReviewBillingProvider[];\n    renderingProviders?: BillReviewClinician[];\n    locations?: BillReviewLocation[];\n  };\n};\n\nexport type BillReviewSaveInput = {\n  dos: string;\n  dosEnd?: string | null;\n  authorizationNumber?: string | null;\n  billingProviderId?: string;\n  billingProvider?: Omit<BillReviewBillingProvider, \"id\">;\n  renderingProviderId?: string;\n  renderingProvider?: Omit<BillReviewClinician, \"id\">;\n  placeOfServiceId?: string;\n  placeOfService?: Omit<BillReviewLocation, \"id\">;\n  lineItems: Array<{\n    id?: string;\n    code: string;\n    modifiers: string[];\n    units: number;\n  }>;\n};\n\nexport type BillSubmissionRoute = \"ebill\" | \"fax\" | \"mail\" | \"email\";\n\nexport type BillReviewFormProps = {\n  data: BillReviewData;\n  onSave: (input: BillReviewSaveInput) => Promise<BillReviewData | void>;\n  onSubmit: (\n    input: BillReviewSaveInput,\n    route: BillSubmissionRoute,\n  ) => Promise<void>;\n  onAddAttachment: (\n    file: File,\n    documentType: BillReviewDocumentType,\n    description?: string,\n  ) => Promise<void>;\n  onRemoveAttachment: (attachmentId: string) => Promise<void>;\n  onOpenAttachment?: (attachment: BillReviewAttachment) => void;\n  className?: string;\n  style?: CSSProperties;\n  appearance?: MindBillAppearance;\n  disabled?: boolean;\n};\n\nexport type BillReviewDraft = {\n  dos: string;\n  dosEnd: string;\n  authorizationNumber: string;\n  billingProvider: BillReviewBillingProvider;\n  clinician: BillReviewClinician;\n  location: BillReviewLocation;\n  lineItems: BillReviewLineItem[];\n};\n\nconst EMPTY_BILLING_PROVIDER: BillReviewBillingProvider = {\n  name: \"\",\n  taxId: \"\",\n  npi: \"\",\n  billType: \"Professional\",\n};\nconst EMPTY_CLINICIAN: BillReviewClinician = {\n  name: \"\",\n  specialty: \"\",\n  npi: \"\",\n};\nconst EMPTY_LOCATION: BillReviewLocation = {\n  name: \"\",\n  street: \"\",\n  city: \"\",\n  state: \"\",\n  zip: \"\",\n  posCode: \"11\",\n};\n\nconst DOCUMENT_LABELS: Record<BillReviewDocumentType, string> = {\n  final_report: \"Final medical-legal report\",\n  letter_of_attestation: \"Letter of attestation\",\n  proof_of_service: \"Proof of service\",\n  form_122: \"DWC Form 122\",\n  return_to_work_voucher: \"Return-to-work voucher\",\n  w9: \"W-9\",\n  medical_records: \"Medical records\",\n  appeal: \"Appeal or review support\",\n  other: \"Other supporting document\",\n};\n\nfunction withoutId<T extends { id?: string }>(value: T): Omit<T, \"id\"> {\n  const result = { ...value };\n  delete result.id;\n  return result;\n}\n\nfunction toDraft(data: BillReviewData): BillReviewDraft {\n  const snapshot = data.bill.billingSnapshot;\n  return {\n    dos: data.bill.dos || \"\",\n    dosEnd: data.bill.dosEnd || \"\",\n    authorizationNumber: data.bill.authorizationNumber || \"\",\n    billingProvider: {\n      ...EMPTY_BILLING_PROVIDER,\n      ...(snapshot?.billingProvider ?? {}),\n    },\n    clinician: { ...EMPTY_CLINICIAN, ...(snapshot?.renderingProvider ?? {}) },\n    location: { ...EMPTY_LOCATION, ...(snapshot?.placeOfService ?? {}) },\n    lineItems: data.bill.lineItems.map((line) => ({ ...line })),\n  };\n}\n\nexport function buildBillReviewSaveInput(\n  draft: BillReviewDraft,\n): BillReviewSaveInput {\n  return {\n    dos: draft.dos,\n    dosEnd: draft.dosEnd || null,\n    authorizationNumber: draft.authorizationNumber.trim() || null,\n    ...(draft.billingProvider.id\n      ? { billingProviderId: draft.billingProvider.id }\n      : {}),\n    billingProvider: withoutId(draft.billingProvider),\n    ...(draft.clinician.id\n      ? { renderingProviderId: draft.clinician.id }\n      : {}),\n    renderingProvider: withoutId(draft.clinician),\n    ...(draft.location.id ? { placeOfServiceId: draft.location.id } : {}),\n    placeOfService: withoutId(draft.location),\n    lineItems: draft.lineItems.map(({ id, code, modifiers, units }) => ({\n      ...(id ? { id } : {}),\n      code: code.trim().toUpperCase(),\n      modifiers,\n      units,\n    })),\n  };\n}\n\nfunction money(value: number): string {\n  return new Intl.NumberFormat(\"en-US\", {\n    style: \"currency\",\n    currency: \"USD\",\n  }).format(value);\n}\n\nfunction appearanceStyle(\n  appearance: MindBillAppearance | undefined,\n  style: CSSProperties | undefined,\n): CSSProperties {\n  return {\n    ...(appearance?.accentColor\n      ? { \"--mb-accent\": appearance.accentColor }\n      : {}),\n    ...(appearance?.textColor ? { \"--mb-text\": appearance.textColor } : {}),\n    ...(appearance?.mutedColor\n      ? { \"--mb-muted\": appearance.mutedColor }\n      : {}),\n    ...(appearance?.borderColor\n      ? { \"--mb-border\": appearance.borderColor }\n      : {}),\n    ...(appearance?.backgroundColor\n      ? { \"--mb-soft\": appearance.backgroundColor }\n      : {}),\n    ...(appearance?.surfaceColor\n      ? { \"--mb-surface\": appearance.surfaceColor }\n      : {}),\n    ...(appearance?.fontFamily\n      ? { \"--mb-font\": appearance.fontFamily }\n      : {}),\n    ...style,\n  } as CSSProperties;\n}\n\nfunction Field({\n  label,\n  value,\n  onChange,\n  type = \"text\",\n  optional,\n  required,\n}: {\n  label: string;\n  value: string;\n  onChange: (value: string) => void;\n  type?: string;\n  optional?: boolean;\n  required?: boolean;\n}): ReactElement {\n  return (\n    <label className=\"mb-native-field\">\n      <span>\n        {label} {optional ? <small>Optional</small> : null}\n      </span>\n      <input\n        type={type}\n        value={value}\n        required={required}\n        onChange={(event) => onChange(event.target.value)}\n      />\n    </label>\n  );\n}\n\nexport function BillReviewForm({\n  data,\n  onSave,\n  onSubmit,\n  onAddAttachment,\n  onRemoveAttachment,\n  onOpenAttachment,\n  className,\n  style,\n  appearance,\n  disabled = false,\n}: BillReviewFormProps): ReactElement {\n  const [draft, setDraft] = useState(() => toDraft(data));\n  const [route, setRoute] = useState<BillSubmissionRoute>(\"ebill\");\n  const [file, setFile] = useState<File | null>(null);\n  const [documentType, setDocumentType] =\n    useState<BillReviewDocumentType>(\"other\");\n  const [busy, setBusy] = useState<\"save\" | \"submit\" | \"attachment\" | \"\">(\"\");\n  const [error, setError] = useState(\"\");\n  const [notice, setNotice] = useState(\"\");\n  const routeName = useId();\n  const editable = data.bill.status === \"incomplete\" && !disabled;\n\n  useEffect(() => setDraft(toDraft(data)), [data]);\n\n  const canSubmit = useMemo(\n    () =>\n      Boolean(\n        draft.dos &&\n          draft.billingProvider.name.trim() &&\n          draft.billingProvider.taxId.trim() &&\n          draft.billingProvider.npi.trim() &&\n          draft.clinician.name.trim() &&\n          draft.clinician.npi.trim() &&\n          draft.location.name.trim() &&\n          draft.location.street.trim() &&\n          draft.location.city.trim() &&\n          draft.location.state.trim() &&\n          draft.location.zip.trim() &&\n          draft.lineItems.length &&\n          draft.lineItems.every((line) => line.code.trim() && line.units > 0),\n      ),\n    [draft],\n  );\n\n  const updateBillingProvider = <K extends keyof BillReviewBillingProvider>(\n    key: K,\n    value: BillReviewBillingProvider[K],\n  ) =>\n    setDraft((current) => ({\n      ...current,\n      billingProvider: { ...current.billingProvider, [key]: value },\n    }));\n  const updateClinician = <K extends keyof BillReviewClinician>(\n    key: K,\n    value: BillReviewClinician[K],\n  ) =>\n    setDraft((current) => ({\n      ...current,\n      clinician: { ...current.clinician, [key]: value },\n    }));\n  const updateLocation = <K extends keyof BillReviewLocation>(\n    key: K,\n    value: BillReviewLocation[K],\n  ) =>\n    setDraft((current) => ({\n      ...current,\n      location: { ...current.location, [key]: value },\n    }));\n\n  async function run(action: \"save\" | \"submit\", task: () => Promise<void>) {\n    setBusy(action);\n    setError(\"\");\n    setNotice(\"\");\n    try {\n      await task();\n      setNotice(action === \"save\" ? \"Changes saved.\" : \"Bill submitted.\");\n    } catch (cause) {\n      setError(\n        cause instanceof Error ? cause.message : \"MindBill could not complete this request.\",\n      );\n    } finally {\n      setBusy(\"\");\n    }\n  }\n\n  const handleSave = (event: FormEvent) => {\n    event.preventDefault();\n    void run(\"save\", async () => {\n      const updated = await onSave(buildBillReviewSaveInput(draft));\n      if (updated) setDraft(toDraft(updated));\n    });\n  };\n\n  const handleSubmit = () =>\n    run(\"submit\", () => onSubmit(buildBillReviewSaveInput(draft), route));\n\n  const attach = async () => {\n    if (!file) return;\n    setBusy(\"attachment\");\n    setError(\"\");\n    try {\n      await onAddAttachment(file, documentType, DOCUMENT_LABELS[documentType]);\n      setFile(null);\n      setDocumentType(\"other\");\n      setNotice(\"Document added to the payer packet.\");\n    } catch (cause) {\n      setError(cause instanceof Error ? cause.message : \"Document could not be attached.\");\n    } finally {\n      setBusy(\"\");\n    }\n  };\n\n  const sectionClass = \"mb-native-section\";\n  return (\n    <form\n      className={[\"mb-native-review\", className].filter(Boolean).join(\" \")}\n      style={appearanceStyle(appearance, style)}\n      onSubmit={handleSave}\n    >\n      <style>{NATIVE_BILL_REVIEW_STYLES}</style>\n      <header className=\"mb-native-heading\">\n        <div>\n          <span className=\"mb-native-eyebrow\">Billing review</span>\n          <h2>Bill #{data.bill.billNumber}</h2>\n          <p>Review the prefilled claim and payer packet, then submit.</p>\n        </div>\n        <div className=\"mb-native-total\">\n          <span>{data.bill.status}</span>\n          <strong>{money(data.bill.totalCharge)}</strong>\n        </div>\n      </header>\n\n      <dl className=\"mb-native-summary\">\n        <div><dt>Patient</dt><dd>{data.patient.name || \"—\"}</dd></div>\n        <div><dt>Claim</dt><dd>{data.injury.claimNumber || \"—\"}</dd></div>\n        <div><dt>Employer</dt><dd>{data.injury.employer || \"—\"}</dd></div>\n        <div><dt>Date of injury</dt><dd>{data.injury.doi || \"—\"}</dd></div>\n      </dl>\n\n      <section className={sectionClass}>\n        <div className=\"mb-native-section-head\"><div><h3>Claim and service</h3><p>These values print on the bill.</p></div></div>\n        <div className=\"mb-native-grid three\">\n          <Field label=\"Date of service\" type=\"date\" required value={draft.dos} onChange={(dos) => setDraft((current) => ({ ...current, dos }))} />\n          <Field label=\"End date\" type=\"date\" optional value={draft.dosEnd} onChange={(dosEnd) => setDraft((current) => ({ ...current, dosEnd }))} />\n          <Field label=\"Authorization number\" optional value={draft.authorizationNumber} onChange={(authorizationNumber) => setDraft((current) => ({ ...current, authorizationNumber }))} />\n        </div>\n      </section>\n\n      <section className={sectionClass}>\n        <div className=\"mb-native-section-head\"><div><h3>Billing practice</h3><p>Payee identity and billing address for this claim.</p></div><span>Prefilled</span></div>\n        <div className=\"mb-native-grid three\">\n          <Field label=\"Practice name\" required value={draft.billingProvider.name} onChange={(value) => updateBillingProvider(\"name\", value)} />\n          <Field label=\"Tax ID\" required value={draft.billingProvider.taxId} onChange={(value) => updateBillingProvider(\"taxId\", value)} />\n          <Field label=\"Group NPI\" required value={draft.billingProvider.npi} onChange={(value) => updateBillingProvider(\"npi\", value)} />\n          <Field label=\"Phone\" optional value={draft.billingProvider.phone || \"\"} onChange={(value) => updateBillingProvider(\"phone\", value)} />\n          <Field label=\"Billing street\" required value={draft.billingProvider.billingStreet || \"\"} onChange={(value) => updateBillingProvider(\"billingStreet\", value)} />\n          <Field label=\"City\" required value={draft.billingProvider.billingCity || \"\"} onChange={(value) => updateBillingProvider(\"billingCity\", value)} />\n          <Field label=\"State\" required value={draft.billingProvider.billingState || \"\"} onChange={(value) => updateBillingProvider(\"billingState\", value)} />\n          <Field label=\"ZIP\" required value={draft.billingProvider.billingZip || \"\"} onChange={(value) => updateBillingProvider(\"billingZip\", value)} />\n        </div>\n      </section>\n\n      <section className={sectionClass}>\n        <div className=\"mb-native-section-head\"><div><h3>Clinician</h3><p>Provider identity printed on the claim.</p></div><span>Prefilled</span></div>\n        <div className=\"mb-native-grid three\">\n          <Field label=\"Clinician name\" required value={draft.clinician.name} onChange={(value) => updateClinician(\"name\", value)} />\n          <Field label=\"Specialty\" value={draft.clinician.specialty} onChange={(value) => updateClinician(\"specialty\", value)} />\n          <Field label=\"NPI\" required value={draft.clinician.npi} onChange={(value) => updateClinician(\"npi\", value)} />\n          <Field label=\"Taxonomy\" optional value={draft.clinician.taxonomy || \"\"} onChange={(value) => updateClinician(\"taxonomy\", value)} />\n          <Field label=\"License number\" optional value={draft.clinician.licenseNumber || \"\"} onChange={(value) => updateClinician(\"licenseNumber\", value)} />\n          <Field label=\"License state\" optional value={draft.clinician.licenseState || \"\"} onChange={(value) => updateClinician(\"licenseState\", value)} />\n        </div>\n      </section>\n\n      <section className={sectionClass}>\n        <div className=\"mb-native-section-head\"><div><h3>Service location</h3><p>The exact place of service for this bill.</p></div><span>Prefilled</span></div>\n        <div className=\"mb-native-grid three\">\n          <Field label=\"Location name\" required value={draft.location.name} onChange={(value) => updateLocation(\"name\", value)} />\n          <Field label=\"Street\" required value={draft.location.street} onChange={(value) => updateLocation(\"street\", value)} />\n          <Field label=\"City\" required value={draft.location.city} onChange={(value) => updateLocation(\"city\", value)} />\n          <Field label=\"State\" required value={draft.location.state} onChange={(value) => updateLocation(\"state\", value)} />\n          <Field label=\"ZIP\" required value={draft.location.zip} onChange={(value) => updateLocation(\"zip\", value)} />\n          <Field label=\"Place of service code\" required value={draft.location.posCode || \"11\"} onChange={(value) => updateLocation(\"posCode\", value)} />\n        </div>\n      </section>\n\n      <section className={sectionClass}>\n        <div className=\"mb-native-section-head\"><div><h3>Procedure lines</h3><p>MindBill recalculates the allowed amount when changes are saved.</p></div><button type=\"button\" className=\"mb-native-button quiet\" disabled={!editable} onClick={() => setDraft((current) => ({ ...current, lineItems: [...current.lineItems, { code: \"\", modifiers: [], units: 1, charge: 0 }] }))}>+ Add line</button></div>\n        <div className=\"mb-native-lines\">\n          {draft.lineItems.map((line, index) => (\n            <div className=\"mb-native-line\" key={line.id || index}>\n              <Field label=\"Procedure\" required value={line.code} onChange={(value) => setDraft((current) => ({ ...current, lineItems: current.lineItems.map((item, itemIndex) => itemIndex === index ? { ...item, code: value } : item) }))} />\n              <Field label=\"Modifiers\" value={line.modifiers.join(\", \")} onChange={(value) => setDraft((current) => ({ ...current, lineItems: current.lineItems.map((item, itemIndex) => itemIndex === index ? { ...item, modifiers: value.split(\",\").map((part) => part.trim()).filter(Boolean) } : item) }))} />\n              <label className=\"mb-native-field\"><span>Units</span><input type=\"number\" min=\"1\" required value={line.units} onChange={(event) => setDraft((current) => ({ ...current, lineItems: current.lineItems.map((item, itemIndex) => itemIndex === index ? { ...item, units: Number(event.target.value) } : item) }))} /></label>\n              <div className=\"mb-native-allowed\"><span>Allowed</span><strong>{money(line.charge)}</strong></div>\n              <button type=\"button\" className=\"mb-native-remove\" aria-label={`Remove ${line.code || \"procedure\"}`} disabled={!editable || draft.lineItems.length === 1} onClick={() => setDraft((current) => ({ ...current, lineItems: current.lineItems.filter((_, itemIndex) => itemIndex !== index) }))}>×</button>\n            </div>\n          ))}\n        </div>\n      </section>\n\n      <section className={sectionClass}>\n        <div className=\"mb-native-section-head\"><div><h3>Payer billing packet</h3><p>Review exactly what will be sent with this bill.</p></div><span>{data.bill.attachments.length} files</span></div>\n        <div className=\"mb-native-note\"><strong>Separate from attorney report service.</strong> Final reports, proof of service, and required billing forms may be preselected. Medical records are never silently attached.</div>\n        <ul className=\"mb-native-documents\">\n          {data.bill.attachments.map((attachment) => (\n            <li key={attachment.id}>\n              <span className=\"mb-native-file\">PDF</span>\n              <div><strong>{attachment.filename}</strong><span>{DOCUMENT_LABELS[attachment.documentType as BillReviewDocumentType] || attachment.description || \"Supporting document\"}</span></div>\n              {onOpenAttachment ? <button type=\"button\" className=\"mb-native-button quiet\" onClick={() => onOpenAttachment(attachment)}>View</button> : null}\n              <button type=\"button\" className=\"mb-native-remove\" disabled={!editable || busy === \"attachment\"} aria-label={`Remove ${attachment.filename}`} onClick={() => void onRemoveAttachment(attachment.id).catch((cause) => setError(cause instanceof Error ? cause.message : \"Document could not be removed.\"))}>×</button>\n            </li>\n          ))}\n        </ul>\n        <div className=\"mb-native-attach\">\n          <div><strong>Add supporting PDF</strong><span>Choose any additional document intentionally. Up to 25 MB.</span></div>\n          <select aria-label=\"Document type\" value={documentType} disabled={!editable} onChange={(event) => setDocumentType(event.target.value as BillReviewDocumentType)}>{Object.entries(DOCUMENT_LABELS).map(([value, label]) => <option key={value} value={value}>{label}</option>)}</select>\n          <input aria-label=\"Choose supporting PDF\" type=\"file\" accept=\"application/pdf,.pdf\" disabled={!editable} onChange={(event) => setFile(event.target.files?.[0] || null)} />\n          <button className=\"mb-native-button secondary\" type=\"button\" disabled={!editable || !file || busy === \"attachment\"} onClick={() => void attach()}>{busy === \"attachment\" ? \"Attaching…\" : \"Attach document\"}</button>\n        </div>\n      </section>\n\n      <section className=\"mb-native-submit\">\n        <div><span className=\"mb-native-eyebrow\">Delivery</span><h3>Submit this bill</h3><p>MindBill will send the claim and own status, payment, denial, and resubmission.</p></div>\n        <fieldset><legend>Send via</legend>{([\"ebill\", \"fax\", \"mail\", \"email\"] as const).map((value) => <label key={value}><input type=\"radio\" name={routeName} value={value} checked={route === value} onChange={() => setRoute(value)} />{value === \"ebill\" ? \"E-bill\" : value.charAt(0).toUpperCase() + value.slice(1)}</label>)}</fieldset>\n        {error ? <div className=\"mb-native-message error\" role=\"alert\">{error}</div> : null}\n        {notice ? <div className=\"mb-native-message success\" role=\"status\">{notice}</div> : null}\n        <div className=\"mb-native-actions\">\n          <button className=\"mb-native-button secondary\" type=\"submit\" disabled={!editable || busy !== \"\"}>{busy === \"save\" ? \"Saving…\" : \"Save changes\"}</button>\n          <button className=\"mb-native-button primary\" type=\"button\" disabled={!editable || !canSubmit || busy !== \"\"} onClick={() => void handleSubmit()}>{busy === \"submit\" ? \"Submitting…\" : \"Submit bill\"}</button>\n        </div>\n      </section>\n    </form>\n  );\n}\n\nexport type BillStatusSummaryProps = {\n  status: string;\n  submittedAt?: string | null;\n  totalCharge: number;\n  totalPaid: number;\n  balanceDue: number;\n  className?: string;\n  style?: CSSProperties;\n  appearance?: MindBillAppearance;\n};\n\nexport function BillStatusSummary({ status, submittedAt, totalCharge, totalPaid, balanceDue, className, style, appearance }: BillStatusSummaryProps): ReactElement {\n  return <section className={[\"mb-native-status\", className].filter(Boolean).join(\" \")} style={appearanceStyle(appearance, style)}>\n    <style>{NATIVE_BILL_REVIEW_STYLES}</style>\n    <div><span className=\"mb-native-eyebrow\">Bill status</span><h3>{status.replaceAll(\"_\", \" \")}</h3>{submittedAt ? <p>Submitted {new Date(submittedAt).toLocaleDateString()}</p> : null}</div>\n    <dl><div><dt>Charged</dt><dd>{money(totalCharge)}</dd></div><div><dt>Paid</dt><dd>{money(totalPaid)}</dd></div><div><dt>Balance</dt><dd>{money(balanceDue)}</dd></div></dl>\n  </section>;\n}\n\nconst NATIVE_BILL_REVIEW_STYLES = `\n.mb-native-review,.mb-native-status{font-family:var(--mb-font,Inter,ui-sans-serif,system-ui,sans-serif)}\n.mb-native-review,.mb-native-status{--mb-accent:#238dbd;--mb-accent-dark:#176f98;--mb-text:#203743;--mb-muted:#657982;--mb-border:#dbe6ea;--mb-soft:#f3f8fa;--mb-surface:#fff;color:var(--mb-text);font:14px/1.45 Inter,ui-sans-serif,system-ui,sans-serif}.mb-native-review *,.mb-native-status *{box-sizing:border-box}.mb-native-review{display:grid;gap:16px}.mb-native-heading{display:flex;align-items:flex-end;justify-content:space-between;gap:24px;padding:6px 2px}.mb-native-heading h2,.mb-native-section h3,.mb-native-submit h3,.mb-native-status h3{margin:3px 0 2px;line-height:1.2}.mb-native-heading h2{font-size:25px}.mb-native-heading p,.mb-native-section p,.mb-native-submit p,.mb-native-status p{margin:0;color:var(--mb-muted)}.mb-native-eyebrow{color:#59727d;font-size:11px;font-weight:800;letter-spacing:.14em;text-transform:uppercase}.mb-native-total{display:flex;align-items:center;gap:18px}.mb-native-total span,.mb-native-section-head>span{border-radius:999px;background:var(--mb-soft);color:#58717c;font-size:11px;font-weight:800;padding:6px 10px;text-transform:capitalize}.mb-native-total strong{font-size:24px}.mb-native-summary{display:grid;grid-template-columns:repeat(4,1fr);margin:0;border:1px solid var(--mb-border);border-radius:12px;background:var(--mb-surface);overflow:hidden}.mb-native-summary div{padding:17px 20px;border-right:1px solid var(--mb-border)}.mb-native-summary div:last-child{border:0}.mb-native-summary dt,.mb-native-allowed span{color:#647982;font-size:10px;font-weight:800;letter-spacing:.12em;text-transform:uppercase}.mb-native-summary dd{margin:5px 0 0;font-weight:750}.mb-native-section{padding:20px;border:1px solid var(--mb-border);border-radius:14px;background:var(--mb-surface);box-shadow:0 8px 24px rgba(28,58,72,.04)}.mb-native-section-head{display:flex;align-items:start;justify-content:space-between;gap:16px;margin-bottom:17px}.mb-native-section h3,.mb-native-submit h3,.mb-native-status h3{font-size:19px}.mb-native-grid{display:grid;gap:14px}.mb-native-grid.three{grid-template-columns:repeat(3,minmax(0,1fr))}.mb-native-field{display:grid;gap:6px;min-width:0;color:var(--mb-text);font-size:12px;font-weight:750}.mb-native-field small{color:var(--mb-muted);font-size:inherit;font-weight:500}.mb-native-field input,.mb-native-attach select,.mb-native-attach input{width:100%;min-height:43px;border:1px solid var(--mb-border);border-radius:8px;background:#fff;color:var(--mb-text);font:inherit;padding:10px 12px}.mb-native-field input:focus,.mb-native-attach select:focus,.mb-native-attach input:focus{border-color:var(--mb-accent);box-shadow:0 0 0 3px color-mix(in srgb,var(--mb-accent) 14%,transparent);outline:0}.mb-native-lines{display:grid;gap:10px}.mb-native-line{display:grid;grid-template-columns:1.1fr 1.1fr 110px 120px 28px;align-items:end;gap:12px;padding:13px;background:var(--mb-soft);border:1px solid #e3edf0;border-radius:10px}.mb-native-allowed{display:grid;gap:5px;padding:0 8px 11px;text-align:right}.mb-native-allowed strong{font-size:16px}.mb-native-remove{border:0;background:transparent;color:#667d86;cursor:pointer;font-size:20px;padding:7px}.mb-native-note{padding:13px 15px;border:1px solid #bdd9e4;border-radius:9px;background:#f2f9fc;color:#526d78}.mb-native-note strong{color:var(--mb-text);margin-right:12px}.mb-native-documents{list-style:none;margin:14px 0;padding:0}.mb-native-documents li{display:grid;grid-template-columns:42px 1fr auto 28px;align-items:center;gap:12px;padding:12px 4px;border-bottom:1px solid var(--mb-border)}.mb-native-documents li>div{display:grid}.mb-native-documents li span{color:var(--mb-muted);font-size:12px}.mb-native-file{display:grid;place-items:center;width:40px;height:40px;border-radius:8px;background:#eaf5f9;color:var(--mb-accent)!important;font-size:11px!important;font-weight:850}.mb-native-attach{display:grid;grid-template-columns:1fr 230px minmax(220px,1fr) auto;align-items:end;gap:12px;padding:15px;border-radius:10px;background:var(--mb-soft)}.mb-native-attach>div{display:grid;gap:3px}.mb-native-attach span{color:var(--mb-muted);font-size:12px}.mb-native-button{min-height:40px;border:1px solid var(--mb-border);border-radius:8px;background:#fff;color:var(--mb-text);cursor:pointer;font:inherit;font-weight:750;padding:9px 14px}.mb-native-button.primary{border-color:var(--mb-accent);background:var(--mb-accent);color:#fff}.mb-native-button.primary:hover{background:var(--mb-accent-dark)}.mb-native-button.secondary{background:#fff}.mb-native-button.quiet{min-height:auto;background:var(--mb-soft);padding:7px 11px}.mb-native-button:disabled,.mb-native-remove:disabled{cursor:not-allowed;opacity:.5}.mb-native-submit{display:grid;grid-template-columns:1fr auto;align-items:end;gap:18px;padding:22px;border:1px solid #bcd8e2;border-radius:14px;background:linear-gradient(135deg,#f3fafc,#eaf6fa)}.mb-native-submit fieldset{display:flex;gap:6px;margin:0;padding:0;border:0}.mb-native-submit legend{position:absolute;width:1px;height:1px;overflow:hidden}.mb-native-submit fieldset label{display:flex;align-items:center;gap:6px;padding:9px 11px;border:1px solid #c9dce3;border-radius:8px;background:#fff;font-weight:700}.mb-native-actions{display:flex;justify-content:flex-end;gap:10px;grid-column:1/-1}.mb-native-message{grid-column:1/-1;padding:10px 12px;border-radius:8px}.mb-native-message.error{background:#fff0ef;color:#9d3029}.mb-native-message.success{background:#edf9f2;color:#217449}.mb-native-status{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:20px;border:1px solid var(--mb-border);border-radius:12px;background:#fff}.mb-native-status h3{text-transform:capitalize}.mb-native-status dl{display:flex;margin:0}.mb-native-status dl div{min-width:110px;padding:0 18px;border-left:1px solid var(--mb-border)}.mb-native-status dt{color:var(--mb-muted);font-size:11px}.mb-native-status dd{margin:4px 0 0;font-size:17px;font-weight:800}@media(max-width:900px){.mb-native-grid.three{grid-template-columns:repeat(2,minmax(0,1fr))}.mb-native-summary{grid-template-columns:repeat(2,1fr)}.mb-native-summary div:nth-child(2){border-right:0}.mb-native-summary div:nth-child(-n+2){border-bottom:1px solid var(--mb-border)}.mb-native-line{grid-template-columns:1fr 1fr 90px}.mb-native-allowed{align-self:center}.mb-native-attach{grid-template-columns:1fr 1fr}.mb-native-submit{grid-template-columns:1fr}.mb-native-submit fieldset,.mb-native-actions{grid-column:1}.mb-native-actions{justify-content:start}}@media(max-width:620px){.mb-native-heading,.mb-native-total,.mb-native-status{align-items:start;flex-direction:column}.mb-native-grid.three,.mb-native-summary,.mb-native-line,.mb-native-attach{grid-template-columns:1fr}.mb-native-summary div,.mb-native-summary div:nth-child(2){border-right:0;border-bottom:1px solid var(--mb-border)}.mb-native-line{align-items:stretch}.mb-native-allowed{text-align:left}.mb-native-submit fieldset{display:grid;grid-template-columns:1fr 1fr}.mb-native-status dl{width:100%}.mb-native-status dl div{min-width:0;flex:1;padding:0 10px}.mb-native-status dl div:first-child{padding-left:0;border-left:0}}\n.mb-native-review,.mb-native-status{font-family:var(--mb-font,Inter,ui-sans-serif,system-ui,sans-serif)}\n`;\n"],"mappings":"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","names":["useEffect","useEffect"]}

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@mindbill/react",
-  "version": "0.4.0",
-  "description": "React components for MindBill hosted billing workflows",
+  "version": "0.6.0",
+  "description": "Native React components and hosted workflows for MindBill billing",
   "type": "module",
   "main": "./dist/index.js",
   "module": "./dist/index.js",
@@ -20,7 +20,7 @@
     "react": ">=18"
   },
   "dependencies": {
-    "@mindbill/embed": "^0.4.0"
+    "@mindbill/embed": "^0.5.0"
   },
   "keywords": [
     "mindbill",