Record sharing
A React block (a whole screen) in Beamline's Clinic app.
Records sent out of a clinic. Several visits' records and their documents (record, invoice, plan, lab result, image) are chosen separately, with how much of the history is loaded said ("25 of 37") and filters by visit status and document kind; the send panel counts what goes by kind, sends one PDF or one per document to the client on file and other recipients, and a delivery failing for one recipient is said alone with its own Send again. A visit's summary is previewed beside its sections (Summary, Documents, Plan), turned on and off for this copy without deleting anything, the page always keeping the consultation, clinician, animal and client; Email, Download, Print; an updating preview and a failed render said. An email from the record takes its recipient from the client (another address replaces the saved one only when asked), a subject, a message and files chosen as tiles, lab files folded apart; sending, failed and sent said.
Use it for
- Sending part of a long history out of a records system: a clinic's visits to a referral vet, a case file to a lawyer, inspections to an insurer.
- Previewing a generated document with optional sections before it is emailed, downloaded or printed.
- Emailing chosen files from a record to someone on file or a one-off address.
Not for
- Reading one document page by page (document-viewer).
- A general mail client or inbox (helpdesk-inbox).
Anatomy
- header: the product's mark, Share the animal's records, Share records, Visit summary or Email
- share: visit status (All, Locked, Open) and document kinds as toggles; visits with date, reason, clinician, status and a checkbox for all of their documents; each document a toggle (chosen in the selection tint); how many visits are loaded of how many, Load more; the send panel: what goes by kind with counts, One PDF or one per document, the client on file, other recipients, deliveries per recipient (delivered on a success tint, failed on a danger tint with Send again), Send
- summary: the sections as switches with what each holds and a line that turning one off deletes nothing; Email, Download, Print; the page with the clinic, title, consultation, clinician, patient and client, then the sections turned on
- email: To (from the client, with Save as the client's email when changed), Subject, Message; files as tiles with a tick when attached; lab files folded apart with how many are attached; Send with n files
States
- share: nothing chosen, some chosen, a visit partly chosen, filtered, all loaded or more to load, total unknown, sending, all delivered, one recipient failed and retried, no email on file
- summary: all sections, some off, header only, updating, render failed with Try again
- email: client's address, another address used once or saved, invalid address, labs folded or open, sending, failed, sent
- loading: shaped skeletons
- phone: one column
- right to left: mirrored
- reduced motion: through the tokens
Keyboard
- Tab through the filters, the visits, each document toggle (Enter or Space toggles), the send panel and its recipients; Enter adds a recipient
- In the summary, Space turns a section on or off
Motion
A document toggle's tint and border change in the fast duration; the page dims while it updates. Nothing runs at rest.
Props
| Prop | Type | Default | Description |
|---|---|---|---|
client (required) | { name: string; email: string | null; } | — | |
patient (required) | string | — | |
visits (required) | SharedVisit[] | — | |
totalVisits | number | null | — | How many visits the animal's history holds in all; null when not known. |
onLoadMore | (() => void) | — | |
defaultChosen | string[] | — | |
onSend | ((r: SendRequest) => Promise<Delivery[]>) | — | Send the chosen documents. Resolve with one delivery per recipient; a failed one is said alone. |
summary | VisitSummary | null | — | |
defaultSectionsOff | SummarySection[] | — | |
onRender | ((sections: SummarySection[]) => Promise<unknown>) | — | |
onDownload | ((sections: SummarySection[]) => void) | — | |
onPrint | ((sections: SummarySection[]) => void) | — | |
files | SharedDoc[] | — | Files offered in the email (the summary, the visit's documents, lab files). |
defaultFiles | string[] | — | |
onEmail | ((m: MessageDraft) => Promise<unknown>) | — | |
defaultView | "email" | "share" | "summary" | — | |
loading | boolean | — | |
product | string | — | |
className | string | — | Classes on the documented visual root; no override by default. |
ref | Ref<HTMLDivElement> | — | Receives the documented native target or imperative handle; omitted by default. |
Built from
- Alert
- Avatar
- Button
- Checkbox
- Input
- Label
- Segmented control
- Select
- Skeleton
- Spinner
- Switch
- Tag input
- Text morph
- Textarea
- Tooltip
Dependencies
lucide-react
Import
import { RecordSharing, DOC_KINDS } from "@beamline/record-sharing";Get it
Record sharing is part of Beamline UI. Install the parts you need in your React app as compiled packages or editable source. Get Beamline · Connect your agent
More in Clinic
- Appointment book: The desk's day with the appointment editor beside it. The appointment being edited is a block on the day like any other, drawn in the accent while it is…
- Book an appointment: A client books an appointment on the practice's own site: a service (length and price beside it), who gives it or anyone free, and where; a day with…
- Services and hours: A practice's services and the hours its practitioners can be booked, one relation seen from both ends. A service reads as values and changes on demand…
- Patient overview: One patient's record on a page. A search finds patients by name, chart number or birth date (recent patients when empty; same names told apart by birth…
- Patient chart: A clinic's chart for one client and their animals. The client's header (phone, email, contact preferences, the balance with what it means and as of when…
- Health questionnaire: A patient's medical history as a versioned questionnaire. Every question takes Yes, No or I don't know, and one not answered says so, never read as No; a…
- Case workspace: A patient's clinical cases and how cases work at the practice. A case shows its status, type, teeth, staff, location and start; its checklist counts…
- Care plan: A client's care plan composed beside what the client will see of it. Every field says who sees it (the care team only, or the client too) and the…
- Treatment plan: A patient's treatment plan in named phases. Each procedure shows its tooth, status and fee beside the patient's and the insurer's estimate (not known…
- Plan templates: Reusable treatment-plan templates. A template reads as words at rest and changes on demand: its name edits in place; the status its procedures start as…
- Plan acceptance: A treatment plan presented for acceptance, from both sides. The practice chooses the agreement (the account's default or this location's own) and how…
- Plan follow-up: The practice's follow-up lists, for the person who turns accepted treatment into booked chairs. Treatment plans lead with what's at stake: the value…
- Session notes and tasks: A session's note beside its follow-up tasks, each task tied to the exact words it came from: choose a task and its words light in the note or the…
- Note templates: A practitioner's note templates in one library with three ways in. My templates lists their own by kind, favourites first, each with when it was last…
- Probing chart: A periodontal probing chart. Six sites per tooth (three buccal, three lingual) across both arches as you face the patient, each depth in its cell and…
- Procedure picker: Procedures, conditions and bundles put on a patient's teeth from the chair. The mode (existing, planned, completed) is chosen before adding and each…
- Results notebook: A notebook entry's structured results. The entry's text above a bounded results table with typed columns: a sample link, numbers in their unit with their…
- Insurance claims: Insurance claims as a queue: every claim at first, in the order a person works them (rejected by the clearinghouse, denied by the payer, partly paid, not…
- Account ledger: A patient's account. All transactions or the ones needing attention, each dated with its type in a word, its amount and the running balance; entries that…
- Dispensing: Dispensing from the shelf by lot. A product is found with its stock and prices (consumables left out unless asked); the quantity is drawn across its…
- Client journal: A client's journal from both ends. The client's side is their home, built around their day: today's goals with how many are done and a mark each, done…