@orangecheck/app-design 0.2.1 → 0.3.1

package/dist/components.d.ts

@@ -314,6 +314,31 @@ declare function SectionIntro({ className, align, ...props }: HTMLAttributes<HTM
     align?: 'start' | 'center';
 }): react.JSX.Element;
 
+interface PageHeroProps {
+    eyebrow?: ReactNode;
+    title: ReactNode;
+    lead?: ReactNode;
+    actions?: ReactNode;
+    art?: ReactNode;
+    meta?: ReactNode;
+    children?: ReactNode;
+    variant?: 'page' | 'document';
+    size?: 'lg' | 'xl';
+    className?: string;
+}
+declare function PageHero({ eyebrow, title, lead, actions, art, meta, children, variant, size, className, }: PageHeroProps): react.JSX.Element;
+declare function DocHeader({ eyebrow, title, lead, meta, actions, children, className, }: Pick<PageHeroProps, 'eyebrow' | 'title' | 'lead' | 'meta' | 'actions' | 'children' | 'className'>): react.JSX.Element;
+interface TocItem {
+    id: string;
+    label: ReactNode;
+}
+declare function DocLayout({ toc, header, children, className, }: {
+    toc?: TocItem[];
+    header?: ReactNode;
+    children: ReactNode;
+    className?: string;
+}): react.JSX.Element;
+
 interface StepItem {
     title: ReactNode;
     body: ReactNode;
@@ -338,9 +363,11 @@ declare function PackageCard({ items, className }: {
     items: PackageItem[];
     className?: string;
 }): react.JSX.Element;
-declare function CodeBlock({ code, caption, className, }: {
+declare function CodeBlock({ code, caption, copy, maxLines, className, }: {
     code: string;
     caption?: ReactNode;
+    copy?: boolean;
+    maxLines?: number;
     className?: string;
 }): react.JSX.Element;
 
@@ -397,13 +424,24 @@ declare function PageHeader({ eyebrow, title, description, actions, className, }
     actions?: ReactNode;
     className?: string;
 }): react.JSX.Element;
-declare function StatCard({ label, value, hint, className, }: {
+interface StatCardProps {
     label: ReactNode;
     value: ReactNode;
     hint?: ReactNode;
+    raw?: number | null;
+    className?: string;
+}
+declare function StatCard({ label, value, hint, className }: StatCardProps): react.JSX.Element;
+declare function EmptyLine({ children, className }: {
+    children: ReactNode;
     className?: string;
 }): react.JSX.Element;
-declare function StatGrid({ className, ...props }: HTMLAttributes<HTMLDivElement>): react.JSX.Element;
+interface StatGridProps extends HTMLAttributes<HTMLDivElement> {
+    columns?: 1 | 2 | 3 | 4 | 5;
+    empty?: ReactNode;
+    isEmpty?: boolean;
+}
+declare function StatGrid({ columns, empty, isEmpty, className, children, ...props }: StatGridProps): react.JSX.Element;
 interface KeyValueItem {
     label: ReactNode;
     value: ReactNode;
@@ -418,23 +456,31 @@ interface Column<T> {
     header: ReactNode;
     cell: (row: T) => ReactNode;
     align?: 'start' | 'end';
+    numeric?: boolean;
     wide?: boolean;
+    width?: string;
+    minWidth?: string;
+    truncate?: boolean;
+    primary?: boolean;
+    hideOnPhone?: boolean;
 }
-declare function DataTable<T>({ columns, rows, rowKey, empty, caption, className, }: {
+declare function DataTable<T>({ columns, rows, rowKey, empty, caption, phone, className, }: {
     columns: Column<T>[];
     rows: T[];
     rowKey: (row: T, i: number) => string;
     empty?: ReactNode;
     caption?: string;
+    phone?: 'cards' | 'scroll';
     className?: string;
 }): react.JSX.Element;
-declare function EmptyState({ title, children, action, className, }: {
+declare function EmptyState({ title, children, action, icon, className, }: {
     title: ReactNode;
     children?: ReactNode;
     action?: ReactNode;
+    icon?: ReactNode;
     className?: string;
 }): react.JSX.Element;
-type NoticeTone = 'neutral' | 'info' | 'success' | 'warning' | 'danger' | 'brand';
+type NoticeTone = 'neutral' | 'brand' | 'danger' | 'info' | 'success' | 'warning';
 declare function Notice({ tone, title, children, action, className, }: {
     tone?: NoticeTone;
     title?: ReactNode;
@@ -442,6 +488,13 @@ declare function Notice({ tone, title, children, action, className, }: {
     action?: ReactNode;
     className?: string;
 }): react.JSX.Element;
+declare function LoadingBlock({ rows, timeoutMs, onRetry, label, className, }: {
+    rows?: number;
+    timeoutMs?: number;
+    onRetry?: () => void;
+    label?: string;
+    className?: string;
+}): react.JSX.Element;
 declare function useCopy(timeoutMs?: number): {
     copied: boolean;
     copy: (text: string) => Promise<void>;
@@ -482,4 +535,4 @@ declare function ActivityList({ items, empty, className }: {
     className?: string;
 }): react.JSX.Element;
 
-export { Accent, type ActivityItem, ActivityList, CodeBlock, type Column, Container, CopyButton, DataTable, Display, type DisplayProps, EmptyState, Eyebrow, Footnote, HashChip, type KeyValueItem, KeyValueList, Lead, Notice, PackageCard, type PackageItem, PageHeader, type ProgressStep, ProgressSteps, Prose, Sats, SatsFigure, type SatsProps, type SatsTextOptions, Section, SectionIntro, type SectionProps, SplitBar, type SplitSegment, StatCard, StatGrid, StepGrid, type StepGridProps, type StepItem, type StepState, type TruthRow, type TruthStatus, TruthTable, UsdApprox, satsText, sectionVariants, useCopy };
+export { Accent, type ActivityItem, ActivityList, CodeBlock, type Column, Container, CopyButton, DataTable, Display, type DisplayProps, DocHeader, DocLayout, EmptyLine, EmptyState, Eyebrow, Footnote, HashChip, type KeyValueItem, KeyValueList, Lead, LoadingBlock, Notice, PackageCard, type PackageItem, PageHeader, PageHero, type PageHeroProps, type ProgressStep, ProgressSteps, Prose, Sats, SatsFigure, type SatsProps, type SatsTextOptions, Section, SectionIntro, type SectionProps, SplitBar, type SplitSegment, StatCard, type StatCardProps, StatGrid, type StatGridProps, StepGrid, type StepGridProps, type StepItem, type StepState, type TocItem, type TruthRow, type TruthStatus, TruthTable, UsdApprox, satsText, sectionVariants, useCopy };