@tapizlabs/ui 0.1.6 → 0.2.3

package/dist/index.d.ts

@@ -67,7 +67,6 @@ declare const UserCheck: ({ size, className, style }: IconProps) => react.JSX.El
 declare const Hash: ({ size, className, style }: IconProps) => react.JSX.Element;
 declare const LogOut: ({ size, className, style }: IconProps) => react.JSX.Element;
 
-declare const Alert: ({ size, className, style }: IconProps) => react.JSX.Element;
 declare const Info: ({ size, className, style }: IconProps) => react.JSX.Element;
 declare const CheckCircle: ({ size, className, style }: IconProps) => react.JSX.Element;
 declare const Ban: ({ size, className, style }: IconProps) => react.JSX.Element;
@@ -175,9 +174,13 @@ declare const Icons: {
     externalLink: react.JSX.Element;
 };
 
-type Variant$1 = "primary" | "secondary" | "danger" | "ghost" | "success" | "warning" | "info" | "muted-primary" | "outline-primary" | "outline-secondary" | "outline-danger" | "outline-success" | "link";
+interface BaseProps {
+    className?: string;
+}
+
+type Variant$1 = "primary" | "secondary" | "danger" | "ghost" | "success" | "warning" | "info" | "muted-primary" | "outline-primary" | "outline-secondary" | "outline-danger" | "outline-success" | "brutal" | "link";
 type Size = "xs" | "sm" | "md" | "lg" | "xl";
-interface ButtonProps {
+interface ButtonProps extends BaseProps {
     children?: ReactNode;
     onClick?: (e: MouseEvent<HTMLButtonElement>) => void;
     disabled?: boolean;
@@ -186,7 +189,6 @@ interface ButtonProps {
     size?: Size;
     icon?: ButtonIcon;
     iconRight?: ButtonIcon;
-    className?: string;
     type?: "button" | "submit" | "reset";
     title?: string;
     fullWidth?: boolean;
@@ -265,9 +267,8 @@ interface ToastProviderProps {
 declare function ToastProvider({ children }: ToastProviderProps): react.JSX.Element;
 declare function useToast(): ToastContextValue;
 
-interface FormErrorProps {
+interface FormErrorProps extends BaseProps {
     message: string | null | undefined;
-    className?: string;
 }
 declare function FormError({ message, className }: FormErrorProps): react.JSX.Element | null;
 
@@ -334,22 +335,23 @@ interface TooltipProps {
 }
 declare function Tooltip({ text, children, position, align, width, wFull }: TooltipProps): react.JSX.Element;
 
-interface CardProps {
+type CardVariant = "surface" | "raised" | "outlined" | "brutal" | "glass";
+type CardPadding = "none" | "sm" | "md" | "lg";
+interface CardProps extends BaseProps {
     children: ReactNode;
-    className?: string;
     hover?: boolean;
     style?: CSSProperties;
+    variant?: CardVariant;
+    padding?: CardPadding;
 }
-interface CardSectionProps {
+interface CardSectionProps extends BaseProps {
     children: ReactNode;
-    className?: string;
 }
-declare function Card({ children, className, hover, style }: CardProps): react.JSX.Element;
+declare function Card({ children, className, hover, style, variant, padding, }: CardProps): react.JSX.Element;
 declare function CardHeader({ children, className }: CardSectionProps): react.JSX.Element;
 declare function CardBody({ children, className }: CardSectionProps): react.JSX.Element;
 
-interface SkeletonProps {
-    className?: string;
+interface SkeletonProps extends BaseProps {
 }
 declare function Skeleton({ className }: SkeletonProps): react.JSX.Element;
 
@@ -366,11 +368,10 @@ declare function SkeletonTable({ rows, cols }: {
 }): react.JSX.Element;
 declare function SkeletonPageHeader(): react.JSX.Element;
 
-type Variant = "default" | "success" | "warning" | "danger" | "muted";
-interface BadgeProps {
+type Variant = "default" | "success" | "warning" | "danger" | "info" | "muted";
+interface BadgeProps extends BaseProps {
     children: ReactNode;
     variant?: Variant;
-    className?: string;
 }
 declare function Badge({ children, variant, className }: BadgeProps): react.JSX.Element;
 
@@ -386,32 +387,61 @@ declare function ErrorState({ title, error, }: {
     error: Error | null;
 }): react.JSX.Element;
 
-interface StructuredInfoBannerProps {
+interface StructuredInfoBannerProps extends BaseProps {
     title: string;
     description: string;
     text?: never;
     variant?: never;
-    className?: string;
 }
-interface InlineInfoBannerProps {
+interface InlineInfoBannerProps extends BaseProps {
     text: string;
     variant?: "info" | "warn" | "lock";
-    className?: string;
     title?: never;
     description?: never;
 }
 type InfoBannerProps = StructuredInfoBannerProps | InlineInfoBannerProps;
 declare function InfoBanner(props: InfoBannerProps): react.JSX.Element;
 
-interface PageHeaderProps {
+interface PageHeaderProps extends BaseProps {
     title: string;
     subtitle?: string;
+    description?: ReactNode;
     action?: ReactNode;
+    actions?: ReactNode;
     icon?: ReactNode;
     banner?: ReactNode;
-    className?: string;
+    breadcrumbs?: ReactNode;
+    meta?: ReactNode;
+    variant?: "default" | "enterprise" | "brutal";
 }
-declare function PageHeader({ title, subtitle, action, icon, banner, className }: PageHeaderProps): react.JSX.Element;
+declare function PageHeader({ title, subtitle, description, action, actions, icon, banner, breadcrumbs, meta, className, variant, }: PageHeaderProps): react.JSX.Element;
+
+type MetricTrendTone = "positive" | "negative" | "neutral" | "warning";
+interface MetricCardProps extends BaseProps {
+    label: ReactNode;
+    value: ReactNode;
+    description?: ReactNode;
+    icon?: ReactNode;
+    trend?: ReactNode;
+    trendTone?: MetricTrendTone;
+    variant?: "surface" | "raised" | "brutal";
+}
+declare function MetricCard({ label, value, description, icon, trend, trendTone, className, variant, }: MetricCardProps): react.JSX.Element;
+
+interface StatGridProps extends BaseProps {
+    children: ReactNode;
+    minColumnWidth?: string;
+}
+declare function StatGrid({ children, className, minColumnWidth }: StatGridProps): react.JSX.Element;
+
+interface SectionCardProps extends BaseProps {
+    title?: ReactNode;
+    eyebrow?: ReactNode;
+    description?: ReactNode;
+    action?: ReactNode;
+    children: ReactNode;
+}
+declare function SectionCard({ title, eyebrow, description, action, children, className }: SectionCardProps): react.JSX.Element;
 
 interface SearchInputProps extends Omit<InputHTMLAttributes<HTMLInputElement>, "value" | "onChange"> {
     value: string;
@@ -450,17 +480,15 @@ interface PaginationProps {
 }
 declare function Pagination({ page, totalPages, onChange, totalItems, pageSize, labels }: PaginationProps): react.JSX.Element | null;
 
-interface SectionTitleProps {
+interface SectionTitleProps extends BaseProps {
     children: ReactNode;
-    className?: string;
 }
 declare function SectionTitle({ children, className }: SectionTitleProps): react.JSX.Element;
 
-type StatusBadgeVariant = "default" | "active" | "inactive" | "warning" | "success" | "danger" | "pending";
-interface StatusBadgeProps {
+type StatusBadgeVariant = "default" | "active" | "inactive" | "warning" | "success" | "danger" | "info" | "pending";
+interface StatusBadgeProps extends BaseProps {
     label: ReactNode;
     variant?: StatusBadgeVariant;
-    className?: string;
 }
 declare function StatusBadge({ label, variant, className }: StatusBadgeProps): react.JSX.Element;
 
@@ -525,6 +553,8 @@ interface ServerSort {
     onSort: (field: string) => void;
 }
 
+type DataTableDensity = "compact" | "comfortable" | "spacious";
+type DataTableVariant = "default" | "enterprise" | "brutal";
 interface DataTableProps<T> {
     data: T[];
     columns: Column<T>[];
@@ -560,6 +590,15 @@ interface DataTableProps<T> {
      *   each row to a card via this function (keyed by `rowKey(row)`).
      */
     mobileCard?: (row: T) => ReactNode;
+    /** Visual density of header and cells. Defaults to comfortable. */
+    density?: DataTableDensity;
+    /** Enterprise adds stronger surface treatment; brutal adds 2px border + hard shadow. */
+    variant?: DataTableVariant;
+    /** Makes the table header sticky inside the scroll container. */
+    stickyHeader?: boolean;
+    /** Applies token-based zebra striping. Defaults to true. */
+    striped?: boolean;
+    className?: string;
 }
 /**
  * Generic, accessible, client-sortable table.
@@ -572,6 +611,818 @@ interface DataTableProps<T> {
  * - Optional `rowActions`, `serverSort`, `footer`, and `mobileCard` props are
  *   all additive — existing usages continue to work with zero changes.
  */
-declare function DataTable<T>({ data, columns, rowKey, isLoading, emptyState, onRowClick, loadingRows, rowActions, serverSort, footer, mobileCard, }: DataTableProps<T>): react.JSX.Element;
+declare function DataTable<T>({ data, columns, rowKey, isLoading, emptyState, onRowClick, loadingRows, rowActions, serverSort, footer, mobileCard, density, variant, stickyHeader, striped, className, }: DataTableProps<T>): react.JSX.Element;
+
+interface MarketingShellProps extends BaseProps {
+    children: ReactNode;
+    grid?: boolean;
+    noise?: boolean;
+}
+declare function MarketingShell({ children, className, grid, noise }: MarketingShellProps): react.JSX.Element;
+
+interface HeroFrameProps extends BaseProps {
+    eyebrow?: ReactNode;
+    title: ReactNode;
+    description?: ReactNode;
+    actions?: ReactNode;
+    visual?: ReactNode;
+    meta?: ReactNode;
+}
+declare function HeroFrame({ eyebrow, title, description, actions, visual, meta, className }: HeroFrameProps): react.JSX.Element;
+
+interface FeatureCardProps extends BaseProps {
+    title: ReactNode;
+    description?: ReactNode;
+    icon?: ReactNode;
+    eyebrow?: ReactNode;
+    children?: ReactNode;
+    variant?: "surface" | "brutal" | "raised";
+}
+declare function FeatureCard({ title, description, icon, eyebrow, children, className, variant }: FeatureCardProps): react.JSX.Element;
+
+interface FeatureGridProps extends BaseProps {
+    children: ReactNode;
+}
+declare function FeatureGrid({ children, className }: FeatureGridProps): react.JSX.Element;
+
+interface CTASectionProps extends BaseProps {
+    eyebrow?: ReactNode;
+    title: ReactNode;
+    description?: ReactNode;
+    actions?: ReactNode;
+}
+declare function CTASection({ eyebrow, title, description, actions, className }: CTASectionProps): react.JSX.Element;
+
+interface MockupFrameProps extends BaseProps {
+    children: ReactNode;
+    title?: ReactNode;
+    toolbar?: ReactNode;
+}
+declare function MockupFrame({ children, title, toolbar, className }: MockupFrameProps): react.JSX.Element;
+
+interface ComparisonTableRow {
+    feature: ReactNode;
+    included: ReactNode;
+    alternative?: ReactNode;
+}
+interface ComparisonTableProps extends BaseProps {
+    rows: ComparisonTableRow[];
+    featureHeader?: ReactNode;
+    includedHeader?: ReactNode;
+    alternativeHeader?: ReactNode;
+}
+declare function ComparisonTable({ rows, featureHeader, includedHeader, alternativeHeader, className }: ComparisonTableProps): react.JSX.Element;
+
+interface AppShellProps extends BaseProps {
+    sidebar?: ReactNode;
+    topbar?: ReactNode;
+    children: ReactNode;
+    aside?: ReactNode;
+    contentClassName?: string;
+    variant?: "default" | "grid" | "noise";
+}
+declare function AppShell({ sidebar, topbar, children, aside, className, contentClassName, variant }: AppShellProps): react.JSX.Element;
+
+interface SplitPaneProps extends BaseProps {
+    primary: ReactNode;
+    secondary: ReactNode;
+    ratio?: "50/50" | "60/40" | "70/30";
+    reverseOnMobile?: boolean;
+}
+declare function SplitPane({ primary, secondary, ratio, reverseOnMobile, className }: SplitPaneProps): react.JSX.Element;
+
+interface StackProps extends BaseProps {
+    children: ReactNode;
+    gap?: "xs" | "sm" | "md" | "lg" | "xl";
+    direction?: "vertical" | "horizontal";
+    align?: "start" | "center" | "end" | "stretch";
+    justify?: "start" | "center" | "between" | "end";
+    wrap?: boolean;
+}
+declare function Stack({ children, gap, direction, align, justify, wrap, className }: StackProps): react.JSX.Element;
+
+interface ClusterProps extends BaseProps {
+    children: ReactNode;
+    gap?: "xs" | "sm" | "md" | "lg";
+    align?: "start" | "center" | "end";
+    justify?: "start" | "center" | "between" | "end";
+}
+declare function Cluster({ children, gap, align, justify, className }: ClusterProps): react.JSX.Element;
+
+interface BreadcrumbItem {
+    label: ReactNode;
+    href?: string;
+    current?: boolean;
+}
+interface BreadcrumbsProps extends BaseProps {
+    items: BreadcrumbItem[];
+    separator?: ReactNode;
+}
+declare function Breadcrumbs({ items, separator, className }: BreadcrumbsProps): react.JSX.Element;
+
+interface SidebarNavItem {
+    label: ReactNode;
+    href?: string;
+    icon?: ReactNode;
+    badge?: ReactNode;
+    active?: boolean;
+    disabled?: boolean;
+    onClick?: () => void;
+}
+interface SidebarNavGroup {
+    label?: ReactNode;
+    items: SidebarNavItem[];
+}
+interface SidebarNavProps extends BaseProps {
+    groups: SidebarNavGroup[];
+    header?: ReactNode;
+    footer?: ReactNode;
+}
+declare function SidebarNav({ groups, header, footer, className }: SidebarNavProps): react.JSX.Element;
+
+interface TopNavLink {
+    label: ReactNode;
+    href?: string;
+    active?: boolean;
+    onClick?: () => void;
+}
+interface TopNavProps extends BaseProps {
+    brand?: ReactNode;
+    links?: TopNavLink[];
+    actions?: ReactNode;
+    sticky?: boolean;
+}
+declare function TopNav({ brand, links, actions, className, sticky }: TopNavProps): react.JSX.Element;
+
+interface TabItem {
+    id: string;
+    label: ReactNode;
+    content: ReactNode;
+    badge?: ReactNode;
+    disabled?: boolean;
+}
+interface TabsProps extends BaseProps {
+    items: TabItem[];
+    activeId: string;
+    onChange?: (id: string) => void;
+    variant?: "line" | "boxed" | "brutal";
+}
+declare function Tabs({ items, activeId, onChange, className, variant }: TabsProps): react.JSX.Element;
+
+interface AccordionItem {
+    id: string;
+    title: ReactNode;
+    content: ReactNode;
+    meta?: ReactNode;
+    disabled?: boolean;
+}
+interface AccordionProps extends BaseProps {
+    items: AccordionItem[];
+    openIds?: string[];
+    onToggle?: (id: string) => void;
+    allowMultiple?: boolean;
+}
+declare function Accordion({ items, openIds, onToggle, className }: AccordionProps): react.JSX.Element;
+
+interface StepItem {
+    id: string;
+    label: ReactNode;
+    description?: ReactNode;
+    status?: "complete" | "current" | "upcoming" | "error";
+}
+interface StepperProps extends BaseProps {
+    steps: StepItem[];
+    orientation?: "horizontal" | "vertical";
+}
+declare function Stepper({ steps, orientation, className }: StepperProps): react.JSX.Element;
+
+interface DrawerProps extends BaseProps {
+    open: boolean;
+    onClose?: () => void;
+    title?: ReactNode;
+    description?: ReactNode;
+    children: ReactNode;
+    footer?: ReactNode;
+    side?: "left" | "right";
+}
+declare function Drawer({ open, onClose, title, description, children, footer, side, className }: DrawerProps): react.JSX.Element | null;
+
+interface PopoverProps extends BaseProps {
+    trigger: ReactNode;
+    children: ReactNode;
+    open?: boolean;
+    align?: "start" | "end";
+}
+declare function Popover({ trigger, children, open, align, className }: PopoverProps): react.JSX.Element;
+
+interface CommandItem {
+    id: string;
+    label: ReactNode;
+    description?: ReactNode;
+    icon?: ReactNode;
+    shortcut?: ReactNode;
+    disabled?: boolean;
+    onSelect?: () => void;
+}
+interface CommandGroup {
+    label?: ReactNode;
+    items: CommandItem[];
+}
+interface CommandMenuProps {
+    open: boolean;
+    onClose?: () => void;
+    query?: string;
+    onQueryChange?: (value: string) => void;
+    groups: CommandGroup[];
+    placeholder?: string;
+    empty?: ReactNode;
+}
+declare function CommandMenu({ open, onClose, query, onQueryChange, groups, placeholder, empty }: CommandMenuProps): react.JSX.Element | null;
+
+interface FormFieldProps extends BaseProps {
+    label?: ReactNode;
+    hint?: ReactNode;
+    error?: ReactNode;
+    required?: boolean;
+    htmlFor?: string;
+    children: ReactNode;
+}
+declare function FormField({ label, hint, error, required, htmlFor, children, className }: FormFieldProps): react.JSX.Element;
+
+interface SwitchProps extends BaseProps {
+    checked?: boolean;
+    onChange?: (checked: boolean) => void;
+    disabled?: boolean;
+    label?: ReactNode;
+    description?: ReactNode;
+}
+declare function Switch({ checked, onChange, disabled, label, description, className }: SwitchProps): react.JSX.Element;
+
+interface ToggleOption {
+    value: string;
+    label: ReactNode;
+    disabled?: boolean;
+}
+interface ToggleGroupProps extends BaseProps {
+    options: ToggleOption[];
+    value?: string;
+    onChange?: (value: string) => void;
+    fullWidth?: boolean;
+}
+declare function ToggleGroup({ options, value, onChange, className, fullWidth }: ToggleGroupProps): react.JSX.Element;
+
+interface InputGroupProps extends BaseProps {
+    prefix?: ReactNode;
+    suffix?: ReactNode;
+    children: ReactNode;
+}
+declare function InputGroup({ prefix, suffix, children, className }: InputGroupProps): react.JSX.Element;
+
+type AlertTone = "info" | "success" | "warning" | "danger" | "neutral";
+interface AlertProps extends BaseProps {
+    tone?: AlertTone;
+    title?: ReactNode;
+    children?: ReactNode;
+    icon?: ReactNode;
+    actions?: ReactNode;
+}
+declare function Alert({ tone, title, children, icon, actions, className }: AlertProps): react.JSX.Element;
+
+interface ProgressProps extends BaseProps {
+    value: number;
+    max?: number;
+    label?: string;
+    showValue?: boolean;
+    tone?: "accent" | "success" | "warning" | "danger";
+}
+declare function Progress({ value, max, label, showValue, tone, className }: ProgressProps): react.JSX.Element;
+
+interface AvatarProps extends BaseProps {
+    src?: string;
+    name?: string;
+    size?: "xs" | "sm" | "md" | "lg";
+}
+declare function Avatar({ src, name, size, className }: AvatarProps): react.JSX.Element;
+
+interface KbdProps extends BaseProps {
+    children: ReactNode;
+}
+declare function Kbd({ children, className }: KbdProps): react.JSX.Element;
+
+interface TimelineItem {
+    id: string;
+    title: ReactNode;
+    description?: ReactNode;
+    time?: ReactNode;
+    icon?: ReactNode;
+    tone?: "neutral" | "info" | "success" | "warning" | "danger";
+}
+interface TimelineProps extends BaseProps {
+    items: TimelineItem[];
+}
+declare function Timeline({ items, className }: TimelineProps): react.JSX.Element;
+
+interface KeyValueItem {
+    keyLabel: ReactNode;
+    value: ReactNode;
+    description?: ReactNode;
+}
+interface KeyValueListProps extends BaseProps {
+    items: KeyValueItem[];
+    density?: "compact" | "normal";
+}
+declare function KeyValueList({ items, className, density }: KeyValueListProps): react.JSX.Element;
+
+interface CodeBlockProps extends BaseProps {
+    children: ReactNode;
+    language?: string;
+    title?: ReactNode;
+    actions?: ReactNode;
+}
+declare function CodeBlock({ children, language, title, actions, className }: CodeBlockProps): react.JSX.Element;
+
+interface LogoCloudItem {
+    name: string;
+    logo?: ReactNode;
+}
+interface LogoCloudProps extends BaseProps {
+    title?: ReactNode;
+    items: LogoCloudItem[];
+}
+declare function LogoCloud({ title, items, className }: LogoCloudProps): react.JSX.Element;
+
+interface TestimonialCardProps extends BaseProps {
+    quote: ReactNode;
+    author: string;
+    role?: ReactNode;
+    avatarSrc?: string;
+    variant?: "surface" | "brutal";
+}
+declare function TestimonialCard({ quote, author, role, avatarSrc, className, variant }: TestimonialCardProps): react.JSX.Element;
+
+interface PricingCardProps extends BaseProps {
+    name: ReactNode;
+    price: ReactNode;
+    description?: ReactNode;
+    features?: ReactNode[];
+    cta?: ReactNode;
+    highlighted?: boolean;
+}
+declare function PricingCard({ name, price, description, features, cta, highlighted, className }: PricingCardProps): react.JSX.Element;
+
+interface StatsBandItem {
+    value: ReactNode;
+    label: ReactNode;
+    description?: ReactNode;
+}
+interface StatsBandProps extends BaseProps {
+    items: StatsBandItem[];
+}
+declare function StatsBand({ items, className }: StatsBandProps): react.JSX.Element;
+
+type TapizFrameworkPreset = "enterprise" | "brutal" | "dashboard" | "marketing" | "compact";
+interface TapizPresetDefinition {
+    shell: string;
+    card: string;
+    button: "primary" | "secondary" | "brutal";
+    density: "compact" | "comfortable" | "spacious";
+}
+declare const tapizFrameworkPresets: Record<TapizFrameworkPreset, TapizPresetDefinition>;
+
+type ContainerSize = "sm" | "md" | "lg" | "xl" | "full";
+interface ContainerProps extends BaseProps {
+    children: ReactNode;
+    size?: ContainerSize;
+    padded?: boolean;
+    style?: CSSProperties;
+}
+declare function Container({ children, size, padded, className, style }: ContainerProps): react.JSX.Element;
+
+type SurfaceVariant = "canvas" | "surface" | "raised" | "muted" | "brutal" | "inverse";
+type SurfacePadding = "none" | "sm" | "md" | "lg" | "xl";
+interface SurfaceProps extends BaseProps {
+    children: ReactNode;
+    variant?: SurfaceVariant;
+    padding?: SurfacePadding;
+    bordered?: boolean;
+    style?: CSSProperties;
+}
+declare function Surface({ children, variant, padding, bordered, className, style }: SurfaceProps): react.JSX.Element;
+
+interface DividerProps extends BaseProps {
+    orientation?: "horizontal" | "vertical";
+    label?: string;
+}
+declare function Divider({ orientation, label, className }: DividerProps): react.JSX.Element;
+
+interface ResponsiveGridProps extends BaseProps {
+    children: ReactNode;
+    min?: string;
+    gap?: "sm" | "md" | "lg" | "xl";
+    style?: CSSProperties;
+}
+declare function ResponsiveGrid({ children, min, gap, className, style }: ResponsiveGridProps): react.JSX.Element;
+
+interface SparklineProps extends BaseProps {
+    values: number[];
+    width?: number;
+    height?: number;
+    label?: string;
+    style?: CSSProperties;
+}
+declare function Sparkline({ values, width, height, label, className, style }: SparklineProps): react.JSX.Element;
+
+interface BarListItem {
+    label: ReactNode;
+    value: number;
+    detail?: ReactNode;
+}
+interface BarListProps extends BaseProps {
+    items: BarListItem[];
+    max?: number;
+    valueFormatter?: (value: number) => ReactNode;
+}
+declare function BarList({ items, max, valueFormatter, className }: BarListProps): react.JSX.Element;
+
+interface DonutMetricProps extends BaseProps {
+    value: number;
+    max?: number;
+    label?: ReactNode;
+    caption?: ReactNode;
+    size?: number;
+}
+declare function DonutMetric({ value, max, label, caption, size, className }: DonutMetricProps): react.JSX.Element;
+
+interface FilterChipProps extends BaseProps {
+    children: ReactNode;
+    active?: boolean;
+    onRemove?: () => void;
+}
+declare function FilterChip({ children, active, onRemove, className }: FilterChipProps): react.JSX.Element;
+
+interface DataToolbarProps extends BaseProps {
+    title?: ReactNode;
+    description?: ReactNode;
+    search?: ReactNode;
+    filters?: ReactNode;
+    actions?: ReactNode;
+}
+declare function DataToolbar({ title, description, search, filters, actions, className }: DataToolbarProps): react.JSX.Element;
+
+interface ResourceCardProps extends BaseProps {
+    title: ReactNode;
+    description?: ReactNode;
+    eyebrow?: ReactNode;
+    icon?: ReactNode;
+    meta?: ReactNode;
+    status?: ReactNode;
+    actions?: ReactNode;
+    href?: string;
+}
+declare function ResourceCard({ title, description, eyebrow, icon, meta, status, actions, href, className }: ResourceCardProps): react.JSX.Element;
+
+type IntegrationStatus = "connected" | "disconnected" | "syncing" | "error";
+interface IntegrationCardProps extends BaseProps {
+    name: ReactNode;
+    description?: ReactNode;
+    logo?: ReactNode;
+    status?: IntegrationStatus;
+    lastSync?: ReactNode;
+    actions?: ReactNode;
+}
+declare function IntegrationCard({ name, description, logo, status, lastSync, actions, className }: IntegrationCardProps): react.JSX.Element;
+
+type HealthTone = "operational" | "degraded" | "outage" | "unknown";
+interface HealthIndicatorProps extends BaseProps {
+    tone?: HealthTone;
+    label?: ReactNode;
+    detail?: ReactNode;
+}
+declare function HealthIndicator({ tone, label, detail, className }: HealthIndicatorProps): react.JSX.Element;
+
+interface AuditLogItem {
+    actor: string;
+    action: ReactNode;
+    timestamp: ReactNode;
+    detail?: ReactNode;
+    initials?: string;
+}
+interface AuditLogProps extends BaseProps {
+    items: AuditLogItem[];
+}
+declare function AuditLog({ items, className }: AuditLogProps): react.JSX.Element;
+
+interface KanbanCardItem {
+    id: string;
+    title: ReactNode;
+    description?: ReactNode;
+    meta?: ReactNode;
+    tone?: "default" | "accent" | "success" | "warning" | "danger";
+}
+interface KanbanColumn {
+    id: string;
+    title: ReactNode;
+    description?: ReactNode;
+    items: KanbanCardItem[];
+}
+interface KanbanBoardProps extends BaseProps {
+    columns: KanbanColumn[];
+}
+declare function KanbanBoard({ columns, className }: KanbanBoardProps): react.JSX.Element;
+
+interface AccessMatrixRole {
+    key: string;
+    label: ReactNode;
+}
+interface AccessMatrixPermission {
+    key: string;
+    label: ReactNode;
+    description?: ReactNode;
+    roles: Record<string, boolean>;
+}
+interface AccessMatrixProps extends BaseProps {
+    roles: AccessMatrixRole[];
+    permissions: AccessMatrixPermission[];
+}
+declare function AccessMatrix({ roles, permissions, className }: AccessMatrixProps): react.JSX.Element;
+
+interface CalendarGridDay {
+    date: ReactNode;
+    label?: ReactNode;
+    muted?: boolean;
+    selected?: boolean;
+    events?: ReactNode[];
+}
+interface CalendarGridProps extends BaseProps {
+    days: CalendarGridDay[];
+    weekdays?: ReactNode[];
+}
+declare function CalendarGrid({ days, weekdays, className }: CalendarGridProps): react.JSX.Element;
+
+interface SliderProps extends Omit<InputHTMLAttributes<HTMLInputElement>, "type"> {
+    label?: string;
+    valueLabel?: string;
+}
+declare function Slider({ label, valueLabel, className, ...props }: SliderProps): react.JSX.Element;
+
+interface FileDropzoneProps extends Omit<InputHTMLAttributes<HTMLInputElement>, "type" | "title"> {
+    title?: ReactNode;
+    description?: ReactNode;
+    actionLabel?: ReactNode;
+}
+declare function FileDropzone({ title, description, actionLabel, className, ...props }: FileDropzoneProps): react.JSX.Element;
+
+interface PasswordInputProps extends Omit<InputHTMLAttributes<HTMLInputElement>, "type"> {
+    revealLabel?: ReactNode;
+}
+declare function PasswordInput({ revealLabel, className, ...props }: PasswordInputProps): react.JSX.Element;
+
+interface TextareaCounterProps extends TextareaHTMLAttributes<HTMLTextAreaElement> {
+    maxLength: number;
+    value?: string;
+}
+declare function TextareaCounter({ maxLength, value, className, ...props }: TextareaCounterProps): react.JSX.Element;
+
+type CalloutTone = "info" | "success" | "warning" | "danger" | "neutral";
+interface CalloutProps extends BaseProps {
+    title?: ReactNode;
+    children?: ReactNode;
+    tone?: CalloutTone;
+    icon?: ReactNode;
+    actions?: ReactNode;
+}
+declare function Callout({ title, children, tone, icon, actions, className }: CalloutProps): react.JSX.Element;
+
+interface LoadingOverlayProps extends BaseProps {
+    visible?: boolean;
+    label?: ReactNode;
+    children: ReactNode;
+}
+declare function LoadingOverlay({ visible, label, children, className }: LoadingOverlayProps): react.JSX.Element;
+
+interface NotificationItem {
+    id: string;
+    title: ReactNode;
+    description?: ReactNode;
+    time?: ReactNode;
+    unread?: boolean;
+    action?: ReactNode;
+}
+interface NotificationListProps extends BaseProps {
+    items: NotificationItem[];
+}
+declare function NotificationList({ items, className }: NotificationListProps): react.JSX.Element;
+
+interface MasonryGridProps extends BaseProps {
+    children: ReactNode;
+    columns?: 2 | 3 | 4;
+    gap?: "sm" | "md" | "lg";
+    style?: CSSProperties;
+}
+declare function MasonryGrid({ children, columns, gap, className, style }: MasonryGridProps): react.JSX.Element;
+
+interface PageRailItem {
+    label: ReactNode;
+    href?: string;
+    active?: boolean;
+    meta?: ReactNode;
+}
+interface PageRailProps extends BaseProps {
+    title?: ReactNode;
+    items: PageRailItem[];
+    actions?: ReactNode;
+    style?: CSSProperties;
+}
+declare function PageRail({ title, items, actions, className, style }: PageRailProps): react.JSX.Element;
+
+interface StickyBarProps extends BaseProps {
+    children: ReactNode;
+    position?: "top" | "bottom";
+    style?: CSSProperties;
+}
+declare function StickyBar({ children, position, className, style }: StickyBarProps): react.JSX.Element;
+
+interface ComboboxOption {
+    value: string;
+    label: ReactNode;
+    description?: ReactNode;
+}
+interface ComboboxProps extends Omit<SelectHTMLAttributes<HTMLSelectElement>, "children"> {
+    options: ComboboxOption[];
+    placeholder?: string;
+    invalid?: boolean;
+}
+declare function Combobox({ options, placeholder, invalid, className, ...props }: ComboboxProps): react.JSX.Element;
+
+interface DateRangePickerProps extends BaseProps {
+    startLabel?: string;
+    endLabel?: string;
+    startProps?: InputHTMLAttributes<HTMLInputElement>;
+    endProps?: InputHTMLAttributes<HTMLInputElement>;
+}
+declare function DateRangePicker({ startLabel, endLabel, startProps, endProps, className }: DateRangePickerProps): react.JSX.Element;
+
+interface ColorSwatchOption {
+    value: string;
+    label: ReactNode;
+    color: string;
+}
+interface ColorSwatchPickerProps extends BaseProps {
+    options: ColorSwatchOption[];
+    value?: string;
+    onChange?: (value: string) => void;
+}
+declare function ColorSwatchPicker({ options, value, onChange, className }: ColorSwatchPickerProps): react.JSX.Element;
+
+interface RatingInputProps extends BaseProps {
+    value?: number;
+    max?: number;
+    icon?: ReactNode;
+    onChange?: (value: number) => void;
+    label?: string;
+}
+declare function RatingInput({ value, max, icon, onChange, label, className }: RatingInputProps): react.JSX.Element;
+
+interface ScoreRingProps extends BaseProps {
+    value: number;
+    max?: number;
+    label?: ReactNode;
+    size?: number;
+}
+declare function ScoreRing({ value, max, label, size, className }: ScoreRingProps): react.JSX.Element;
+
+interface HeatmapCell {
+    value: number;
+    label?: ReactNode;
+    title?: string;
+}
+interface HeatmapGridProps extends BaseProps {
+    cells: HeatmapCell[];
+    columns?: number;
+    max?: number;
+}
+declare function HeatmapGrid({ cells, columns, max, className }: HeatmapGridProps): react.JSX.Element;
+
+interface FunnelStep {
+    label: ReactNode;
+    value: number;
+    meta?: ReactNode;
+}
+interface FunnelChartProps extends BaseProps {
+    steps: FunnelStep[];
+}
+declare function FunnelChart({ steps, className }: FunnelChartProps): react.JSX.Element;
+
+interface ComparisonMeterProps extends BaseProps {
+    leftLabel: ReactNode;
+    rightLabel: ReactNode;
+    value: number;
+}
+declare function ComparisonMeter({ leftLabel, rightLabel, value, className }: ComparisonMeterProps): react.JSX.Element;
+
+interface ActivityFeedItem {
+    actor: string;
+    action: ReactNode;
+    time?: ReactNode;
+    avatarUrl?: string;
+    meta?: ReactNode;
+}
+interface ActivityFeedProps extends BaseProps {
+    items: ActivityFeedItem[];
+}
+declare function ActivityFeed({ items, className }: ActivityFeedProps): react.JSX.Element;
+
+interface InboxItem {
+    title: ReactNode;
+    sender?: ReactNode;
+    snippet?: ReactNode;
+    time?: ReactNode;
+    unread?: boolean;
+    tag?: ReactNode;
+}
+interface InboxListProps extends BaseProps {
+    items: InboxItem[];
+}
+declare function InboxList({ items, className }: InboxListProps): react.JSX.Element;
+
+interface ApprovalItem {
+    title: ReactNode;
+    requester?: ReactNode;
+    description?: ReactNode;
+    priority?: "low" | "medium" | "high";
+}
+interface ApprovalQueueProps extends BaseProps {
+    items: ApprovalItem[];
+    onApprove?: (index: number) => void;
+    onReject?: (index: number) => void;
+}
+declare function ApprovalQueue({ items, onApprove, onReject, className }: ApprovalQueueProps): react.JSX.Element;
+
+interface SLAStatusProps extends BaseProps {
+    label: ReactNode;
+    value: number;
+    target?: number;
+}
+declare function SLAStatus({ label, value, target, className }: SLAStatusProps): react.JSX.Element;
+
+interface FeatureFlag {
+    key: string;
+    name: ReactNode;
+    description?: ReactNode;
+    enabled?: boolean;
+    rollout?: ReactNode;
+}
+interface FeatureFlagTableProps extends BaseProps {
+    flags: FeatureFlag[];
+    onToggle?: (key: string, enabled: boolean) => void;
+}
+declare function FeatureFlagTable({ flags, onToggle, className }: FeatureFlagTableProps): react.JSX.Element;
+
+interface PlanUsageItem {
+    label: ReactNode;
+    used: number;
+    limit: number;
+}
+interface PlanUsageProps extends BaseProps {
+    title?: ReactNode;
+    items: PlanUsageItem[];
+}
+declare function PlanUsage({ title, items, className }: PlanUsageProps): react.JSX.Element;
+
+interface AnnouncementBarProps extends BaseProps {
+    children: ReactNode;
+    action?: ReactNode;
+}
+declare function AnnouncementBar({ children, action, className }: AnnouncementBarProps): react.JSX.Element;
+
+interface FAQItem {
+    question: ReactNode;
+    answer: ReactNode;
+}
+interface FAQSectionProps extends BaseProps {
+    title?: ReactNode;
+    description?: ReactNode;
+    items: FAQItem[];
+}
+declare function FAQSection({ title, description, items, className }: FAQSectionProps): react.JSX.Element;
+
+interface RoadmapItem {
+    title: ReactNode;
+    description?: ReactNode;
+    status?: ReactNode;
+    quarter?: ReactNode;
+}
+interface RoadmapListProps extends BaseProps {
+    items: RoadmapItem[];
+}
+declare function RoadmapList({ items, className }: RoadmapListProps): react.JSX.Element;
+
+type InlineStatusTone = "neutral" | "success" | "warning" | "danger" | "info";
+interface InlineStatusProps extends BaseProps {
+    tone?: InlineStatusTone;
+    children: ReactNode;
+    pulse?: boolean;
+}
+declare function InlineStatus({ tone, children, pulse, className }: InlineStatusProps): react.JSX.Element;
 
-export { ActionMenu, type ActionMenuItem, type ActionMenuProps, Activity, ActivityMenu, Alert, AppleIcon, ArrowLeft, ArrowRight, Badge, Ban, BarChart, BaseModal, type BaseModalProps, Bell, Book, Button, type ButtonProps, Calendar, CalendarMonth, CalendarWeek, Card, CardBody, CardHeader, type CardProps, type CardSectionProps, Check, CheckCircle, CheckSquare, Checkbox, type CheckboxProps, ChevronDown, ChevronLeft, ChevronRight, ChevronUp, Clipboard, Clock, type Column, type ColumnAlign, Compare, ConfirmDialog, type ConfirmDialogProps, Copy, Cpu, CreditCard, DataTable, type DataTableProps, Database, DefaultErrorFallback, Download, Edit, EmptyState, type EmptyStateProps, ErrorBoundary, ErrorState, ExternalLink, Eye, EyeOff, Faculty, FieldHint, type FieldHintProps, FieldLabel, type FieldLabelProps, FileText, FileUpload, FingerprintIcon, FormError, type FormErrorProps, FormIcon, FormulaIcon, Gear, Globe, GooglePlayIcon, GraduationCap, Grid, GridBg, HardDrive, Hash, HelpCircle, History, Home, Icons, Image, Info, InfoBanner, type InfoBannerProps, Input, type InputProps, Intersect, Layers, LockIcon, LogOut, LogoMark, Mail, Megaphone, Menu, Monitor, Moon, NavAnalytics, NavQrAttendance, NavScoresheet, NavSecurity, NumberIcon, OfficeHours, PageHeader, type PageHeaderProps, PageSpinner, Pagination, type PaginationLabels, type PaginationProps, Pdf, Plus, Printer, QrCode, RadioButton, type RadioButtonProps, Refresh, RefreshCw, Repeat, Report, RotateCcw, Scan, Search, SearchInput, type SearchInputProps, SectionIcons, SectionTitle, type SectionTitleProps, Select, type SelectProps, Server, type ServerSort, Shield, Skeleton, SkeletonBanner, SkeletonCard, SkeletonKpiCard, SkeletonPageHeader, type SkeletonProps, SkeletonTable, Smartphone, type SortDirection, type SortState, Spinner, type SpinnerProps, Spotlight, Star, StatusBadge, type StatusBadgeProps, type StatusBadgeVariant, Sun, Table, Tablet, TextIcon, Textarea, type TextareaProps, Toast, type ToastProps, ToastProvider, type ToastProviderProps, type ToastState, Tooltip, type TooltipProps, Trash, Trophy, TwoFAIcon, University, User, UserCheck, UserCog, UserMinus, UserPlus, Users, X, Zap, useToast };
+export { AccessMatrix, type AccessMatrixPermission, type AccessMatrixProps, type AccessMatrixRole, Accordion, type AccordionItem, type AccordionProps, ActionMenu, type ActionMenuItem, type ActionMenuProps, Activity, ActivityFeed, type ActivityFeedItem, type ActivityFeedProps, ActivityMenu, Alert, type AlertProps, type AlertTone, AnnouncementBar, type AnnouncementBarProps, AppShell, type AppShellProps, AppleIcon, type ApprovalItem, ApprovalQueue, type ApprovalQueueProps, ArrowLeft, ArrowRight, AuditLog, type AuditLogItem, type AuditLogProps, Avatar, type AvatarProps, Badge, Ban, BarChart, BarList, type BarListItem, type BarListProps, BaseModal, type BaseModalProps, type BaseProps, Bell, Book, type BreadcrumbItem, Breadcrumbs, type BreadcrumbsProps, Button, type ButtonProps, CTASection, type CTASectionProps, Calendar, CalendarGrid, type CalendarGridDay, type CalendarGridProps, CalendarMonth, CalendarWeek, Callout, type CalloutProps, type CalloutTone, Card, CardBody, CardHeader, type CardPadding, type CardProps, type CardSectionProps, type CardVariant, Check, CheckCircle, CheckSquare, Checkbox, type CheckboxProps, ChevronDown, ChevronLeft, ChevronRight, ChevronUp, Clipboard, Clock, Cluster, type ClusterProps, CodeBlock, type CodeBlockProps, type ColorSwatchOption, ColorSwatchPicker, type ColorSwatchPickerProps, type Column, type ColumnAlign, Combobox, type ComboboxOption, type ComboboxProps, type CommandGroup, type CommandItem, CommandMenu, type CommandMenuProps, Compare, ComparisonMeter, type ComparisonMeterProps, ComparisonTable, type ComparisonTableProps, type ComparisonTableRow, ConfirmDialog, type ConfirmDialogProps, Container, type ContainerProps, type ContainerSize, Copy, Cpu, CreditCard, DataTable, type DataTableDensity, type DataTableProps, type DataTableVariant, DataToolbar, type DataToolbarProps, Database, DateRangePicker, type DateRangePickerProps, DefaultErrorFallback, Divider, type DividerProps, DonutMetric, type DonutMetricProps, Download, Drawer, type DrawerProps, Edit, EmptyState, type EmptyStateProps, ErrorBoundary, ErrorState, ExternalLink, Eye, EyeOff, type FAQItem, FAQSection, type FAQSectionProps, Faculty, FeatureCard, type FeatureCardProps, type FeatureFlag, FeatureFlagTable, type FeatureFlagTableProps, FeatureGrid, type FeatureGridProps, FieldHint, type FieldHintProps, FieldLabel, type FieldLabelProps, FileDropzone, type FileDropzoneProps, FileText, FileUpload, FilterChip, type FilterChipProps, FingerprintIcon, FormError, type FormErrorProps, FormField, type FormFieldProps, FormIcon, FormulaIcon, FunnelChart, type FunnelChartProps, type FunnelStep, Gear, Globe, GooglePlayIcon, GraduationCap, Grid, GridBg, HardDrive, Hash, HealthIndicator, type HealthIndicatorProps, type HealthTone, type HeatmapCell, HeatmapGrid, type HeatmapGridProps, HelpCircle, HeroFrame, type HeroFrameProps, History, Home, Icons, Image, type InboxItem, InboxList, type InboxListProps, Info, InfoBanner, type InfoBannerProps, InlineStatus, type InlineStatusProps, type InlineStatusTone, Input, InputGroup, type InputGroupProps, type InputProps, IntegrationCard, type IntegrationCardProps, type IntegrationStatus, Intersect, KanbanBoard, type KanbanBoardProps, type KanbanCardItem, type KanbanColumn, Kbd, type KbdProps, type KeyValueItem, KeyValueList, type KeyValueListProps, Layers, LoadingOverlay, type LoadingOverlayProps, LockIcon, LogOut, LogoCloud, type LogoCloudItem, type LogoCloudProps, LogoMark, Mail, MarketingShell, type MarketingShellProps, MasonryGrid, type MasonryGridProps, Megaphone, Menu, MetricCard, type MetricCardProps, type MetricTrendTone, MockupFrame, type MockupFrameProps, Monitor, Moon, NavAnalytics, NavQrAttendance, NavScoresheet, NavSecurity, type NotificationItem, NotificationList, type NotificationListProps, NumberIcon, OfficeHours, PageHeader, type PageHeaderProps, PageRail, type PageRailItem, type PageRailProps, PageSpinner, Pagination, type PaginationLabels, type PaginationProps, PasswordInput, type PasswordInputProps, Pdf, PlanUsage, type PlanUsageItem, type PlanUsageProps, Plus, Popover, type PopoverProps, PricingCard, type PricingCardProps, Printer, Progress, type ProgressProps, QrCode, RadioButton, type RadioButtonProps, RatingInput, type RatingInputProps, Refresh, RefreshCw, Repeat, Report, ResourceCard, type ResourceCardProps, ResponsiveGrid, type ResponsiveGridProps, type RoadmapItem, RoadmapList, type RoadmapListProps, RotateCcw, SLAStatus, type SLAStatusProps, Scan, ScoreRing, type ScoreRingProps, Search, SearchInput, type SearchInputProps, SectionCard, type SectionCardProps, SectionIcons, SectionTitle, type SectionTitleProps, Select, type SelectProps, Server, type ServerSort, Shield, SidebarNav, type SidebarNavGroup, type SidebarNavItem, type SidebarNavProps, Skeleton, SkeletonBanner, SkeletonCard, SkeletonKpiCard, SkeletonPageHeader, type SkeletonProps, SkeletonTable, Slider, type SliderProps, Smartphone, type SortDirection, type SortState, Sparkline, type SparklineProps, Spinner, type SpinnerProps, SplitPane, type SplitPaneProps, Spotlight, Stack, type StackProps, Star, StatGrid, type StatGridProps, StatsBand, type StatsBandItem, type StatsBandProps, StatusBadge, type StatusBadgeProps, type StatusBadgeVariant, type StepItem, Stepper, type StepperProps, StickyBar, type StickyBarProps, Sun, Surface, type SurfacePadding, type SurfaceProps, type SurfaceVariant, Switch, type SwitchProps, type TabItem, Table, Tablet, Tabs, type TabsProps, type TapizFrameworkPreset, type TapizPresetDefinition, TestimonialCard, type TestimonialCardProps, TextIcon, Textarea, TextareaCounter, type TextareaCounterProps, type TextareaProps, Timeline, type TimelineItem, type TimelineProps, Toast, type ToastProps, ToastProvider, type ToastProviderProps, type ToastState, ToggleGroup, type ToggleGroupProps, type ToggleOption, Tooltip, type TooltipProps, TopNav, type TopNavLink, type TopNavProps, Trash, Trophy, TwoFAIcon, University, User, UserCheck, UserCog, UserMinus, UserPlus, Users, X, Zap, tapizFrameworkPresets, useToast };