import * as React from 'react';
import { Printer } from 'lucide-react';

/**
 * Print what is on this card, and nothing else on the page.
 *
 * WHY A PATIENT NEEDS THIS AT ALL. The record follows the person, and the moment it has to reach
 * somebody who is not on Akashic - a specialist across town, a school, a form on a clipboard - it
 * has to leave the screen. Without this the choices are a phone photograph of a scrolling page or
 * printing the whole browser window, chrome, navigation and all.
 *
 * IT PRINTS THE REGION, NOT THE PAGE. `PrintableRegion` marks what to keep; the print rules in
 * index.css hide everything else. The technique is visibility rather than display, deliberately:
 * `display: none` on an ancestor would take the region down with it, and visibility lets a nested
 * region stay visible inside a hidden parent.
 *
 * NO WINDOW, NO NEW TAB, NO SERVER. `window.print()` on the page the reader is already looking at
 * means what prints is what they saw, which is the only version of this that cannot drift from the
 * screen. A rendered-server-side PDF would be a second implementation of every record view.
 */
function PrintRecord({
  label = 'Print',
  className = '',
  ...props
}: { label?: string } & React.ComponentProps<'button'>) {
  // THE BUTTON STANDARD, and it comes from the control this sits beside. In every record view the
  // neighbour is ShowFieldHistoryToggle, a plain button on the standard rather than on the Radix
  // primitive - so this was a Radix Button in a header full of .btn, which is the drift being closed
  // everywhere else. Print is a NEUTRAL act and blue-ghost is what the standard gives one; there is
  // no grey button.
  //
  // btn-blue-ghost-sm EXACTLY, with no `!` overrides. The neighbouring toggle clears its border and
  // padding with three of them; matching that would mean three more, and an override is a rule
  // winning that should have been softened instead. The visible difference is this control keeping
  // the hairline border the standard gives it. A borderless small ghost is not one of the eight and
  // adding it is not a call to make here.
  return (
    <button
      type="button"
      data-print-hidden="true"
      onClick={() => window.print()}
      className={`btn btn-blue-ghost-sm ${className}`}
      {...props}
    >
      <Printer className="size-4" aria-hidden="true"/>
      {label}
    </button>
  );
}

/**
 * The part of the page a print keeps.
 *
 * MARKED RATHER THAN INFERRED. A print stylesheet that guesses - hide the nav, hide the header -
 * is a list that goes stale the first time a surface adds a panel. Naming the region says what to
 * KEEP, so anything added around it is excluded by default rather than by remembering.
 */
function PrintableRegion({
  className,
  children,
  ...props
}: React.ComponentProps<'div'>) {
  return (
    <div data-print-region="true" className={className} {...props}>
      {children}
    </div>
  );
}

export { PrintRecord, PrintableRegion };