@orangecheck/app-design 1.4.1 → 1.6.0

package/dist/components.d.mts

@@ -7,7 +7,7 @@ export { A as ApiRow, a as ApiTable, b as AppCard, c as AppCardProps, d as AppGr
 import { ExplorerKind, Network } from './format.mjs';
 import { j as ProtocolSlug } from './index-DmfyPYe5.mjs';
 import { S as Statement } from './status-badge-BJ9Sdsx8.mjs';
-export { A as AnchorState, a as AnchorStatus, b as ArtifactView, B as BlockCountdown, c as BlockHeight, C as ChosenFile, D as DropZone, F as FilterChips, d as FilterOption, e as FormSection, M as Meter, S as SectionStatus, f as StateBadge, g as StateDef, h as StateTone, T as ToolGrid, i as ToolItem, j as createStateBadge } from './tools-DFIxIj5p.mjs';
+export { A as AnchorState, a as AnchorStatus, b as ArtifactView, B as BlockCountdown, c as BlockHeight, C as ChosenFile, D as DropZone, F as FilterChips, d as FilterOption, e as FormSection, M as Meter, S as SectionStatus, f as StateBadge, g as StateDef, h as StateTone, T as ToolGrid, i as ToolItem, j as createStateBadge } from './tools-Bg1gi2HO.mjs';
 
 declare function Eyebrow({ className, onInk, ...props }: HTMLAttributes<HTMLParagraphElement> & {
     onInk?: boolean;
@@ -406,9 +406,15 @@ interface StatCardProps {
     hint?: ReactNode;
     raw?: number | null;
     size?: 'md' | 'sm';
+    delta?: {
+        value: number;
+        suffix?: string;
+        good?: 'up' | 'down';
+        label?: string;
+    };
     className?: string;
 }
-declare function StatCard({ label, value, hint, size, className }: StatCardProps): react.JSX.Element;
+declare function StatCard({ label, value, hint, size, delta, className }: StatCardProps): react.JSX.Element;
 declare function EmptyLine({ children, className }: {
     children: ReactNode;
     className?: string;
@@ -423,7 +429,10 @@ interface KeyValueItem {
     label: ReactNode;
     value: ReactNode;
     mono?: boolean;
+    note?: ReactNode;
+    tone?: ValueTone;
 }
+type ValueTone = 'good' | 'caution' | 'bad' | 'brand' | 'muted';
 declare function KeyValueList({ items, dense, className, }: {
     items: KeyValueItem[];
     dense?: boolean;
@@ -609,6 +618,84 @@ declare function ErrorPage({ code, title, detail, actions, home, protocol, art,
     className?: string;
 }): react.JSX.Element;
 
+declare function CountdownRing({ period, remaining, warnAt, size, showSeconds, className, }: {
+    period: number;
+    remaining?: number;
+    warnAt?: number;
+    size?: number;
+    showSeconds?: boolean;
+    className?: string;
+}): react.JSX.Element;
+declare function PlanCard({ name, subtitle, price, period, footnote, features, action, badge, badgeTone, highlight, className, }: {
+    name: ReactNode;
+    subtitle?: ReactNode;
+    price: ReactNode;
+    period?: ReactNode;
+    footnote?: ReactNode;
+    features?: ReactNode[];
+    action?: ReactNode;
+    badge?: ReactNode;
+    badgeTone?: 'neutral' | 'brand' | 'success' | 'muted';
+    highlight?: boolean;
+    className?: string;
+}): react.JSX.Element;
+declare function LockedPreview({ title, description, action, children, className, }: {
+    title: ReactNode;
+    description?: ReactNode;
+    action: ReactNode;
+    children?: ReactNode;
+    className?: string;
+}): react.JSX.Element;
+
+type ChartTone = 1 | 2 | 3 | 4 | 'neutral' | 'up' | 'down';
+declare function chartColor(series: number | ChartTone): string;
+interface LegendItem {
+    label: ReactNode;
+    color: ChartTone | string;
+    dashed?: boolean;
+}
+declare function ChartFrame({ legend, caption, children, className, }: {
+    legend?: LegendItem[];
+    caption?: ReactNode;
+    children: ReactNode;
+    className?: string;
+}): react.JSX.Element;
+declare function Sparkline({ values, label, tone, area, width, height, className, }: {
+    values: readonly number[];
+    label: string;
+    tone?: 'ink' | 'muted' | 'trend' | ChartTone;
+    area?: boolean;
+    width?: number;
+    height?: number;
+    className?: string;
+}): react.JSX.Element;
+interface SourceNoteProps {
+    source: ReactNode;
+    href?: string;
+    detail?: ReactNode;
+    updated?: ReactNode;
+    variant?: 'popover' | 'line';
+    className?: string;
+}
+declare function SourceNote({ source, href, detail, updated, variant, className }: SourceNoteProps): react.JSX.Element;
+declare function Panel({ title, description, actions, source, expandable, children, className, }: {
+    title: ReactNode;
+    description?: ReactNode;
+    actions?: ReactNode;
+    source?: ReactNode;
+    expandable?: boolean;
+    children: ReactNode | ((expanded: boolean) => ReactNode);
+    className?: string;
+}): react.JSX.Element;
+declare function HudCard({ eyebrow, live, title, children, footer, className, }: {
+    eyebrow?: ReactNode;
+    live?: boolean;
+    title?: ReactNode;
+    children?: ReactNode;
+    footer?: ReactNode;
+    className?: string;
+}): react.JSX.Element;
+
 declare function SectionHeading({ eyebrow, title, lead, id, onInk, level, as, align, reveal, className, }: {
     eyebrow?: ReactNode;
     title: ReactNode;
@@ -758,7 +845,10 @@ declare function TextLink({ href: written, children, external, className, }: {
 
 interface SearchResult {
     id: string;
-    href: string;
+    href?: string;
+    run?: () => void;
+    icon?: ReactNode;
+    meta?: ReactNode;
     title: ReactNode;
     section?: ReactNode;
     excerpt?: ReactNode;
@@ -774,7 +864,7 @@ declare const SearchButton: react.ForwardRefExoticComponent<{
     onClick?: () => void;
     className?: string;
 } & react.RefAttributes<HTMLButtonElement>>;
-declare function SearchDialog({ onQuery, open: openProp, onOpenChange, onSelect, button, hotkey, label, placeholder, idle, defaultQuery, debounceMs, className, }: {
+interface SearchDialogProps {
     onQuery: SearchQuery;
     open?: boolean;
     onOpenChange?: (open: boolean) => void;
@@ -787,6 +877,9 @@ declare function SearchDialog({ onQuery, open: openProp, onOpenChange, onSelect,
     defaultQuery?: string;
     debounceMs?: number;
     className?: string;
-}): react.JSX.Element;
+    browse?: boolean;
+}
+declare function SearchDialog({ onQuery, open: openProp, onOpenChange, onSelect, button, hotkey, label, placeholder, idle, defaultQuery, debounceMs, browse, className, }: SearchDialogProps): react.JSX.Element;
+declare function CommandDialog({ label, placeholder, ...props }: Omit<SearchDialogProps, 'browse' | 'button'>): react.JSX.Element;
 
-export { Accent, type ActivityItem, ActivityList, BrowserFrame, type CheckState, Closing, type Column, Container, CopyButton, type CopyButtonProps, DataTable, Display, type DisplayProps, EmptyLine, EmptyState, type Endpoint, EndpointList, ErrorBoundary, ErrorPage, Eyebrow, FactBlock, type FactRow, FactRows, Faq, FloatChip, Footnote, HashChip, type KeyValueItem, KeyValueList, Lead, type LegalBlock, LegalDocument, type LegalSource, LoadingBlock, Monogram, Notice, PackageCard, type PackageItem, PageHeader, PhoneFrame, type ProgressStep, ProgressSteps, ProofStrip, Prose, Reveal, Sats, SatsFigure, type SatsProps, type SatsTextOptions, ScrollStory, SearchButton, SearchDialog, type SearchGroup, type SearchQuery, type SearchResult, Section, SectionHeading, SectionIntro, type SectionProps, SignMessage, SplitBar, type SplitSegment, StatCard, type StatCardProps, StatGrid, type StatGridProps, StepGrid, type StepGridProps, type StepItem, type StepState, TextLink, Ticker, type TruthRow, type TruthStatus, TruthTable, UsdApprox, type VerifyCheck, VerifyReport, monogramGround, monogramLetter, satsText, sectionVariants, useCopy, useInView };
+export { Accent, type ActivityItem, ActivityList, BrowserFrame, ChartFrame, type ChartTone, type CheckState, Closing, type Column, CommandDialog, Container, CopyButton, type CopyButtonProps, CountdownRing, DataTable, Display, type DisplayProps, EmptyLine, EmptyState, type Endpoint, EndpointList, ErrorBoundary, ErrorPage, Eyebrow, FactBlock, type FactRow, FactRows, Faq, FloatChip, Footnote, HashChip, HudCard, type KeyValueItem, KeyValueList, Lead, type LegalBlock, LegalDocument, type LegalSource, type LegendItem, LoadingBlock, LockedPreview, Monogram, Notice, PackageCard, type PackageItem, PageHeader, Panel, PhoneFrame, PlanCard, type ProgressStep, ProgressSteps, ProofStrip, Prose, Reveal, Sats, SatsFigure, type SatsProps, type SatsTextOptions, ScrollStory, SearchButton, SearchDialog, type SearchDialogProps, type SearchGroup, type SearchQuery, type SearchResult, Section, SectionHeading, SectionIntro, type SectionProps, SignMessage, SourceNote, type SourceNoteProps, Sparkline, SplitBar, type SplitSegment, StatCard, type StatCardProps, StatGrid, type StatGridProps, StepGrid, type StepGridProps, type StepItem, type StepState, TextLink, Ticker, type TruthRow, type TruthStatus, TruthTable, UsdApprox, type ValueTone, type VerifyCheck, VerifyReport, chartColor, monogramGround, monogramLetter, satsText, sectionVariants, useCopy, useInView };

package/dist/components.d.ts

@@ -7,7 +7,7 @@ export { A as ApiRow, a as ApiTable, b as AppCard, c as AppCardProps, d as AppGr
 import { ExplorerKind, Network } from './format.js';
 import { j as ProtocolSlug } from './index-DmfyPYe5.js';
 import { S as Statement } from './status-badge-Bt8x3RhO.js';
-export { A as AnchorState, a as AnchorStatus, b as ArtifactView, B as BlockCountdown, c as BlockHeight, C as ChosenFile, D as DropZone, F as FilterChips, d as FilterOption, e as FormSection, M as Meter, S as SectionStatus, f as StateBadge, g as StateDef, h as StateTone, T as ToolGrid, i as ToolItem, j as createStateBadge } from './tools-BggNN5DV.js';
+export { A as AnchorState, a as AnchorStatus, b as ArtifactView, B as BlockCountdown, c as BlockHeight, C as ChosenFile, D as DropZone, F as FilterChips, d as FilterOption, e as FormSection, M as Meter, S as SectionStatus, f as StateBadge, g as StateDef, h as StateTone, T as ToolGrid, i as ToolItem, j as createStateBadge } from './tools-Bw7RhO92.js';
 
 declare function Eyebrow({ className, onInk, ...props }: HTMLAttributes<HTMLParagraphElement> & {
     onInk?: boolean;
@@ -406,9 +406,15 @@ interface StatCardProps {
     hint?: ReactNode;
     raw?: number | null;
     size?: 'md' | 'sm';
+    delta?: {
+        value: number;
+        suffix?: string;
+        good?: 'up' | 'down';
+        label?: string;
+    };
     className?: string;
 }
-declare function StatCard({ label, value, hint, size, className }: StatCardProps): react.JSX.Element;
+declare function StatCard({ label, value, hint, size, delta, className }: StatCardProps): react.JSX.Element;
 declare function EmptyLine({ children, className }: {
     children: ReactNode;
     className?: string;
@@ -423,7 +429,10 @@ interface KeyValueItem {
     label: ReactNode;
     value: ReactNode;
     mono?: boolean;
+    note?: ReactNode;
+    tone?: ValueTone;
 }
+type ValueTone = 'good' | 'caution' | 'bad' | 'brand' | 'muted';
 declare function KeyValueList({ items, dense, className, }: {
     items: KeyValueItem[];
     dense?: boolean;
@@ -609,6 +618,84 @@ declare function ErrorPage({ code, title, detail, actions, home, protocol, art,
     className?: string;
 }): react.JSX.Element;
 
+declare function CountdownRing({ period, remaining, warnAt, size, showSeconds, className, }: {
+    period: number;
+    remaining?: number;
+    warnAt?: number;
+    size?: number;
+    showSeconds?: boolean;
+    className?: string;
+}): react.JSX.Element;
+declare function PlanCard({ name, subtitle, price, period, footnote, features, action, badge, badgeTone, highlight, className, }: {
+    name: ReactNode;
+    subtitle?: ReactNode;
+    price: ReactNode;
+    period?: ReactNode;
+    footnote?: ReactNode;
+    features?: ReactNode[];
+    action?: ReactNode;
+    badge?: ReactNode;
+    badgeTone?: 'neutral' | 'brand' | 'success' | 'muted';
+    highlight?: boolean;
+    className?: string;
+}): react.JSX.Element;
+declare function LockedPreview({ title, description, action, children, className, }: {
+    title: ReactNode;
+    description?: ReactNode;
+    action: ReactNode;
+    children?: ReactNode;
+    className?: string;
+}): react.JSX.Element;
+
+type ChartTone = 1 | 2 | 3 | 4 | 'neutral' | 'up' | 'down';
+declare function chartColor(series: number | ChartTone): string;
+interface LegendItem {
+    label: ReactNode;
+    color: ChartTone | string;
+    dashed?: boolean;
+}
+declare function ChartFrame({ legend, caption, children, className, }: {
+    legend?: LegendItem[];
+    caption?: ReactNode;
+    children: ReactNode;
+    className?: string;
+}): react.JSX.Element;
+declare function Sparkline({ values, label, tone, area, width, height, className, }: {
+    values: readonly number[];
+    label: string;
+    tone?: 'ink' | 'muted' | 'trend' | ChartTone;
+    area?: boolean;
+    width?: number;
+    height?: number;
+    className?: string;
+}): react.JSX.Element;
+interface SourceNoteProps {
+    source: ReactNode;
+    href?: string;
+    detail?: ReactNode;
+    updated?: ReactNode;
+    variant?: 'popover' | 'line';
+    className?: string;
+}
+declare function SourceNote({ source, href, detail, updated, variant, className }: SourceNoteProps): react.JSX.Element;
+declare function Panel({ title, description, actions, source, expandable, children, className, }: {
+    title: ReactNode;
+    description?: ReactNode;
+    actions?: ReactNode;
+    source?: ReactNode;
+    expandable?: boolean;
+    children: ReactNode | ((expanded: boolean) => ReactNode);
+    className?: string;
+}): react.JSX.Element;
+declare function HudCard({ eyebrow, live, title, children, footer, className, }: {
+    eyebrow?: ReactNode;
+    live?: boolean;
+    title?: ReactNode;
+    children?: ReactNode;
+    footer?: ReactNode;
+    className?: string;
+}): react.JSX.Element;
+
 declare function SectionHeading({ eyebrow, title, lead, id, onInk, level, as, align, reveal, className, }: {
     eyebrow?: ReactNode;
     title: ReactNode;
@@ -758,7 +845,10 @@ declare function TextLink({ href: written, children, external, className, }: {
 
 interface SearchResult {
     id: string;
-    href: string;
+    href?: string;
+    run?: () => void;
+    icon?: ReactNode;
+    meta?: ReactNode;
     title: ReactNode;
     section?: ReactNode;
     excerpt?: ReactNode;
@@ -774,7 +864,7 @@ declare const SearchButton: react.ForwardRefExoticComponent<{
     onClick?: () => void;
     className?: string;
 } & react.RefAttributes<HTMLButtonElement>>;
-declare function SearchDialog({ onQuery, open: openProp, onOpenChange, onSelect, button, hotkey, label, placeholder, idle, defaultQuery, debounceMs, className, }: {
+interface SearchDialogProps {
     onQuery: SearchQuery;
     open?: boolean;
     onOpenChange?: (open: boolean) => void;
@@ -787,6 +877,9 @@ declare function SearchDialog({ onQuery, open: openProp, onOpenChange, onSelect,
     defaultQuery?: string;
     debounceMs?: number;
     className?: string;
-}): react.JSX.Element;
+    browse?: boolean;
+}
+declare function SearchDialog({ onQuery, open: openProp, onOpenChange, onSelect, button, hotkey, label, placeholder, idle, defaultQuery, debounceMs, browse, className, }: SearchDialogProps): react.JSX.Element;
+declare function CommandDialog({ label, placeholder, ...props }: Omit<SearchDialogProps, 'browse' | 'button'>): react.JSX.Element;
 
-export { Accent, type ActivityItem, ActivityList, BrowserFrame, type CheckState, Closing, type Column, Container, CopyButton, type CopyButtonProps, DataTable, Display, type DisplayProps, EmptyLine, EmptyState, type Endpoint, EndpointList, ErrorBoundary, ErrorPage, Eyebrow, FactBlock, type FactRow, FactRows, Faq, FloatChip, Footnote, HashChip, type KeyValueItem, KeyValueList, Lead, type LegalBlock, LegalDocument, type LegalSource, LoadingBlock, Monogram, Notice, PackageCard, type PackageItem, PageHeader, PhoneFrame, type ProgressStep, ProgressSteps, ProofStrip, Prose, Reveal, Sats, SatsFigure, type SatsProps, type SatsTextOptions, ScrollStory, SearchButton, SearchDialog, type SearchGroup, type SearchQuery, type SearchResult, Section, SectionHeading, SectionIntro, type SectionProps, SignMessage, SplitBar, type SplitSegment, StatCard, type StatCardProps, StatGrid, type StatGridProps, StepGrid, type StepGridProps, type StepItem, type StepState, TextLink, Ticker, type TruthRow, type TruthStatus, TruthTable, UsdApprox, type VerifyCheck, VerifyReport, monogramGround, monogramLetter, satsText, sectionVariants, useCopy, useInView };
+export { Accent, type ActivityItem, ActivityList, BrowserFrame, ChartFrame, type ChartTone, type CheckState, Closing, type Column, CommandDialog, Container, CopyButton, type CopyButtonProps, CountdownRing, DataTable, Display, type DisplayProps, EmptyLine, EmptyState, type Endpoint, EndpointList, ErrorBoundary, ErrorPage, Eyebrow, FactBlock, type FactRow, FactRows, Faq, FloatChip, Footnote, HashChip, HudCard, type KeyValueItem, KeyValueList, Lead, type LegalBlock, LegalDocument, type LegalSource, type LegendItem, LoadingBlock, LockedPreview, Monogram, Notice, PackageCard, type PackageItem, PageHeader, Panel, PhoneFrame, PlanCard, type ProgressStep, ProgressSteps, ProofStrip, Prose, Reveal, Sats, SatsFigure, type SatsProps, type SatsTextOptions, ScrollStory, SearchButton, SearchDialog, type SearchDialogProps, type SearchGroup, type SearchQuery, type SearchResult, Section, SectionHeading, SectionIntro, type SectionProps, SignMessage, SourceNote, type SourceNoteProps, Sparkline, SplitBar, type SplitSegment, StatCard, type StatCardProps, StatGrid, type StatGridProps, StepGrid, type StepGridProps, type StepItem, type StepState, TextLink, Ticker, type TruthRow, type TruthStatus, TruthTable, UsdApprox, type ValueTone, type VerifyCheck, VerifyReport, chartColor, monogramGround, monogramLetter, satsText, sectionVariants, useCopy, useInView };