@lax-wp/design-system/dist/components/data-display/status-color-mapping/StatusColorMapping.d.ts

A comprehensive React + TypeScript design system built with Vite, providing reusable UI components for the LAX web portal applications. Features a complete set of form components, data display elements, and interactive controls with full TypeScript suppor

/**
 * Available status color options for the StatusColorMapping component
 */
export type StatusColor = "blue" | "green" | "yellow" | "orange" | "red" | "navy" | "grey" | "purple" | "teal" | "peach";
/**
 * Props for the StatusColorMapping component
 */
export interface StatusColorMappingProps {
    /** The status color variant to apply */
    status?: StatusColor;
    /** The text content to display */
    children: string;
    /** Additional CSS classes for the wrapper */
    className?: string;
    /** Whether to use small size variant */
    size?: "small" | "medium" | "large";
    /** Custom aria-label for accessibility */
    "aria-label"?: string;
}
/**
 * StatusColorMapping component displays text with status-based color styling
 *
 * @example
 * ```tsx
 * <StatusColorMapping status="green">Active</StatusColorMapping>
 * <StatusColorMapping status="red" size="small">Error</StatusColorMapping>
 * ```
 */
export declare const StatusColorMapping: import("react").ForwardRefExoticComponent<StatusColorMappingProps & import("react").RefAttributes<HTMLSpanElement>>;