import * as React from "react";
/**
 * Full section-opener page for a report pillar, in the approved Nashville PBS report geometry:
 * PBS Blue header (top 24.5%) with a Teal roman-numeral badge and the title; a 7px Teal rule and a white
 * lead card (next 25.5%) that bleeds off the left edge and stops short of the right; the photo in the
 * bottom half, cropped by one large circle so the blue field wraps its right side. Give it the page
 * height (US Letter: 1056) and it scales; the default height suits previews.
 * @dsCard components/editorial/editorial.card.html
 * @startingPoint section="Editorial" subtitle="Pillar section-divider page" viewport="700x520"
 */
export interface PillarDividerProps {
  numeral: React.ReactNode;
  title: string;
  /** Bold italic lead sentence; runs inline into `body`. */
  lead?: string;
  body?: string;
  imgSrc?: string;
  imgAlt?: string;
  /** object-position for the photo. @default "50% 50%" */
  imgPosition?: string;
  /** Badge diameter in px. @default 96 (128 on a Letter page) */
  badgeSize?: number;
  /** Title font size in px. @default 44 (52 on a Letter page) */
  titleSize?: number;
  /** Card text size in px. @default 15 (16 on a Letter page) */
  bodySize?: number;
  /** Circle radius (clip-path length). @default "93%" */
  radius?: string;
  /** Circle center, as a CSS position inside the photo band. @default "20.6% 112%" */
  at?: string;
  /** Component height. @default 560 */
  height?: number | string;
  style?: React.CSSProperties;
}
export function PillarDivider(props: PillarDividerProps): JSX.Element;