@peerbots/core 0.2.5 → 1.0.0

package/dist/index.d.mts

@@ -1,51 +1,56 @@
-import * as _base_ui_react from '@base-ui/react';
-import { Button as Button$1, Dialog as Dialog$1, Field as Field$1 } from '@base-ui/react';
-import * as React$1 from 'react';
+import { ClassValue } from 'clsx';
+import * as React from 'react';
 import React__default, { ReactNode, HTMLAttributes } from 'react';
 import * as react_jsx_runtime from 'react/jsx-runtime';
-import { ClassValue } from 'clsx';
+import * as _base_ui_react from '@base-ui/react';
+import { Button as Button$1, Field as Field$1, Dialog as Dialog$1, Popover as Popover$1 } from '@base-ui/react';
 import { Separator as Separator$1 } from '@base-ui/react/separator';
 
-interface ButtonProps extends React__default.ButtonHTMLAttributes<HTMLButtonElement> {
-    variant?: "primary" | "secondary" | "danger" | "ghost" | "ghostly-danger";
-    size?: "sm" | "md" | "lg";
-    isLoading?: boolean;
-    leftIcon?: React__default.ReactNode;
-    rightIcon?: React__default.ReactNode;
-    render?: Button$1.Props["render"];
-    nativeButton?: boolean;
-    isIconOnly?: boolean;
-}
-declare const Button: React__default.ForwardRefExoticComponent<ButtonProps & React__default.RefAttributes<HTMLButtonElement>>;
-
-interface InputProps extends React__default.InputHTMLAttributes<HTMLInputElement> {
-    leftIcon?: React__default.ReactNode;
-    rightIcon?: React__default.ReactNode;
-}
-declare const Input: React__default.ForwardRefExoticComponent<InputProps & React__default.RefAttributes<HTMLInputElement>>;
+/**
+ * Canonical Peerbots Brand Palette
+ */
+type BrandColor = "teal" | "pink" | "darkteal" | "darkblue" | "olive" | "dark" | "light" | "white";
+/**
+ * Semantic Action & Status Intents
+ */
+type IntentColor = "primary" | "neutral" | "success" | "warning" | "danger" | "info";
+/**
+ * Composite Color Token for UI Components
+ */
+type ComponentColor = IntentColor | BrandColor;
+/**
+ * Visual Fill Style / Treatment
+ */
+type FillVariant = "solid" | "soft" | "outline" | "ghost" | "link";
+/**
+ * Surface & Container Styles (Cards, Dialogs, Panels)
+ */
+type SurfaceVariant = "surface" | "outline" | "glass" | "flat";
+/**
+ * Standard Sizing Scale
+ */
+type ComponentSize = "xs" | "sm" | "md" | "lg" | "xl";
+/**
+ * Standard Geometric Border Radii
+ */
+type ComponentRadius = "none" | "sm" | "md" | "lg" | "2xl" | "pill";
 
-interface SelectOption {
-    label: string;
-    value: string | number;
-}
-interface SelectProps {
-    options: (string | SelectOption)[];
-    value?: string | number;
-    defaultValue?: string | number;
-    onChange?: (value: string | number | null, event: Event) => void;
-    disabled?: boolean;
-    placeholder?: string;
-    className?: string;
-    id?: string;
-    onFocus?: React__default.FocusEventHandler<HTMLButtonElement>;
-}
-declare const Select: React__default.ForwardRefExoticComponent<SelectProps & React__default.RefAttributes<HTMLButtonElement>>;
+declare function cn(...inputs: ClassValue[]): string;
 
 interface HeadingProps extends React__default.HTMLAttributes<HTMLHeadingElement> {
+    /** Semantic HTML heading level (h1 - h6) */
     level?: 1 | 2 | 3 | 4 | 5 | 6;
+    /** Visual heading scale override (defaults to level) */
+    size?: 1 | 2 | 3 | 4 | 5 | 6;
+    /** Palette color or gradient text fill */
+    color?: BrandColor | "gradient" | "default";
+    /** Legacy variant prop (alias for color) */
+    variant?: BrandColor | "gradient" | "default";
+    /** Font weight */
+    weight?: "normal" | "medium" | "semibold" | "bold";
     children?: React__default.ReactNode;
 }
-declare const Heading: ({ level, className, children, ...props }: HeadingProps) => React__default.DetailedReactHTMLElement<{
+declare const Heading: ({ level, size, color, variant, weight, className, children, ...props }: HeadingProps) => React__default.DetailedReactHTMLElement<{
     defaultChecked?: boolean | undefined;
     defaultValue?: string | number | readonly string[] | undefined;
     suppressContentEditableWarning?: boolean | undefined;
@@ -83,7 +88,6 @@ declare const Heading: ({ level, className, children, ...props }: HeadingProps)
     vocab?: string | undefined;
     autoCorrect?: string | undefined;
     autoSave?: string | undefined;
-    color?: string | undefined;
     itemProp?: string | undefined;
     itemScope?: boolean | undefined;
     itemType?: string | undefined;
@@ -327,14 +331,21 @@ declare const Heading: ({ level, className, children, ...props }: HeadingProps)
     className: string;
 }, HTMLElement>;
 interface TextProps extends React__default.HTMLAttributes<HTMLElement> {
-    variant?: "default" | "muted" | "error" | "small";
+    /** HTML rendering tag */
     as?: React__default.ElementType;
+    /** Typography scale */
+    size?: ComponentSize | "lead";
+    /** Text color / intent */
+    color?: ComponentColor | "muted" | "error" | "success" | "default";
+    /** Legacy variant prop for convenience / backward compatibility */
+    variant?: "default" | "muted" | "small" | "large" | "lead" | "error" | "success";
+    /** Font weight */
+    weight?: "normal" | "medium" | "semibold" | "bold";
+    /** Text alignment */
+    align?: "left" | "center" | "right";
     children?: React__default.ReactNode;
 }
-declare const Text: ({ variant, as: Component, className, children, ...props }: TextProps) => React__default.ReactElement<any, string | React__default.JSXElementConstructor<any>>;
-declare const TypographyList: ({ args }: {
-    args: Record<string, unknown>;
-}) => react_jsx_runtime.JSX.Element;
+declare const Text: ({ as: Component, size, color, variant, weight, align, className, children, ...props }: TextProps) => React__default.ReactElement<any, string | React__default.JSXElementConstructor<any>>;
 
 /**
  * Raw path data for icons, useful for non-React contexts (like PixiJS Graphics.svg)
@@ -393,6 +404,9 @@ declare const iconPaths: {
     export: string;
     home: string;
     play: string;
+    star: string;
+    shield: string;
+    chat: string;
 };
 /**
  * Icons that are complex React nodes
@@ -400,8 +414,31 @@ declare const iconPaths: {
 declare const complexIcons: {
     readonly eye: react_jsx_runtime.JSX.Element;
     readonly google: react_jsx_runtime.JSX.Element;
+    readonly face: react_jsx_runtime.JSX.Element;
+    readonly mic: react_jsx_runtime.JSX.Element;
+    readonly brain: react_jsx_runtime.JSX.Element;
+    readonly user: react_jsx_runtime.JSX.Element;
+    readonly users: react_jsx_runtime.JSX.Element;
+    readonly globe: react_jsx_runtime.JSX.Element;
+    readonly devices: react_jsx_runtime.JSX.Element;
+    readonly volume: react_jsx_runtime.JSX.Element;
+    readonly sliders: react_jsx_runtime.JSX.Element;
+    readonly joystick: react_jsx_runtime.JSX.Element;
+    readonly book: react_jsx_runtime.JSX.Element;
+    readonly store: react_jsx_runtime.JSX.Element;
+    readonly award: react_jsx_runtime.JSX.Element;
+    readonly headset: react_jsx_runtime.JSX.Element;
+    readonly layout: react_jsx_runtime.JSX.Element;
+    readonly video: react_jsx_runtime.JSX.Element;
+    readonly facebook: react_jsx_runtime.JSX.Element;
+    readonly instagram: react_jsx_runtime.JSX.Element;
+    readonly linkedin: react_jsx_runtime.JSX.Element;
+    readonly twitter: react_jsx_runtime.JSX.Element;
+    readonly youtube: react_jsx_runtime.JSX.Element;
+    readonly bluesky: react_jsx_runtime.JSX.Element;
+    readonly github: react_jsx_runtime.JSX.Element;
 };
-type IconName = keyof typeof iconPaths | keyof typeof complexIcons;
+type IconName = keyof typeof iconPaths | keyof typeof complexIcons | "smile" | "avatar" | "voice" | "audio" | "speech" | "expert" | "profile" | "world" | "language" | "screen" | "laptop" | "sound" | "speaker" | "tune" | "adjust" | "message" | "team" | "group" | "motion" | "gamepad" | "curriculum" | "learning" | "education" | "marketplace" | "security" | "privacy" | "badge" | "certificate" | "support" | "help" | "x-brand" | "bsky";
 
 interface IconProps extends React__default.SVGProps<SVGSVGElement> {
     size?: "sm" | "md" | "lg" | "xl";
@@ -409,7 +446,124 @@ interface IconProps extends React__default.SVGProps<SVGSVGElement> {
 }
 declare const Icon: React__default.ForwardRefExoticComponent<Omit<IconProps, "ref"> & React__default.RefAttributes<SVGSVGElement>>;
 
-interface SliderProps {
+interface SocialLinkItem {
+    name: string;
+    url: string;
+    ariaLabel?: string;
+    icon?: IconName;
+}
+declare const DEFAULT_PEERBOTS_SOCIAL_LINKS: SocialLinkItem[];
+interface SocialLinksProps {
+    className?: string;
+    links?: SocialLinkItem[];
+    size?: "sm" | "md" | "lg";
+    variant?: "default" | "white" | "teal" | "dark" | "muted";
+}
+declare const SocialLinks: React__default.FC<SocialLinksProps>;
+
+interface CodeBlockProps {
+    /** The code string to display */
+    code: string;
+    /** Programming language for syntax/badge (e.g. bash, tsx, json) */
+    language?: string;
+    /** Optional file name displayed in the window header */
+    fileName?: string;
+    /** Whether to show line numbers */
+    showLineNumbers?: boolean;
+    /** Style variant: 'default' (clean block) or 'window' (macOS window with colored dots) */
+    variant?: "default" | "window" | "flat";
+    /** Whether to show the copy button */
+    showCopyButton?: boolean;
+    className?: string;
+}
+declare const CodeBlock: React__default.FC<CodeBlockProps>;
+
+interface AnchorProps extends React.AnchorHTMLAttributes<HTMLAnchorElement> {
+    /**
+     * Palette color or semantic intent.
+     * @default "default"
+     */
+    color?: ComponentColor | "muted" | "default";
+    /**
+     * Underline text decoration control.
+     * @default "hover"
+     */
+    underline?: "hover" | "always" | "none";
+    /**
+     * Interaction style variant.
+     * @default "default"
+     */
+    variant?: "default" | "ghost";
+    /** Polymorphic component wrapper (e.g. react-router Link, Next.js Link) */
+    as?: React.ElementType;
+    /** Custom render prop */
+    render?: (props: React.AnchorHTMLAttributes<HTMLAnchorElement>) => React.ReactElement;
+}
+type LinkProps = AnchorProps;
+declare const Anchor: React.ForwardRefExoticComponent<AnchorProps & React.RefAttributes<HTMLAnchorElement>>;
+declare const Link: React.ForwardRefExoticComponent<AnchorProps & React.RefAttributes<HTMLAnchorElement>>;
+
+type ButtonVariant = FillVariant | "primary" | "secondary" | "danger" | "ghostly-danger" | "marketing-teal" | "marketing-pink" | "teal" | "pink";
+interface ButtonProps extends React__default.ButtonHTMLAttributes<HTMLButtonElement | HTMLAnchorElement> {
+    /**
+     * Visual fill style / treatment or legacy variant.
+     * @default "solid"
+     */
+    variant?: ButtonVariant;
+    /**
+     * Palette color or semantic intent.
+     * @default "primary"
+     */
+    color?: ComponentColor;
+    /**
+     * Button scale / padding.
+     * @default "md"
+     */
+    size?: ComponentSize;
+    /**
+     * Border radius geometry.
+     * @default "md" (rounded-xl)
+     */
+    radius?: ComponentRadius;
+    /** Loading spinner indicator state */
+    isLoading?: boolean;
+    /** Icon placed before children */
+    leftIcon?: React__default.ReactNode;
+    /** Icon placed after children */
+    rightIcon?: React__default.ReactNode;
+    render?: Button$1.Props["render"];
+    nativeButton?: boolean;
+    isIconOnly?: boolean;
+    href?: string;
+    target?: string;
+    rel?: string;
+}
+declare const Button: React__default.ForwardRefExoticComponent<ButtonProps & React__default.RefAttributes<HTMLAnchorElement | HTMLButtonElement>>;
+
+interface InputProps extends React__default.InputHTMLAttributes<HTMLInputElement> {
+    leftIcon?: React__default.ReactNode;
+    rightIcon?: React__default.ReactNode;
+}
+declare const Input: React__default.ForwardRefExoticComponent<InputProps & React__default.RefAttributes<HTMLInputElement>>;
+
+interface SelectOption {
+    label: string;
+    value: string | number;
+}
+interface SelectProps extends React__default.AriaAttributes {
+    options: (string | SelectOption)[];
+    value?: string | number;
+    defaultValue?: string | number;
+    onChange?: (value: string | number | null, event: Event) => void;
+    disabled?: boolean;
+    placeholder?: string;
+    className?: string;
+    id?: string;
+    onFocus?: React__default.FocusEventHandler<HTMLButtonElement>;
+}
+declare const Select: React__default.ForwardRefExoticComponent<SelectProps & React__default.RefAttributes<HTMLButtonElement>>;
+
+interface SliderProps extends React__default.AriaAttributes {
     min?: number;
     max?: number;
     step?: number;
@@ -423,7 +577,7 @@ interface SliderProps {
 }
 declare const Slider: React__default.ForwardRefExoticComponent<SliderProps & React__default.RefAttributes<HTMLDivElement>>;
 
-interface SliderWithNumberFieldProps {
+interface SliderWithNumberFieldProps extends React__default.AriaAttributes {
     min?: number;
     max?: number;
     step?: number;
@@ -433,47 +587,10 @@ interface SliderWithNumberFieldProps {
     onChange?: (value: number, event: Event) => void;
     className?: string;
     inputWidth?: string;
+    showButtons?: boolean;
 }
 declare const SliderWithNumberField: React__default.ForwardRefExoticComponent<SliderWithNumberFieldProps & React__default.RefAttributes<HTMLDivElement>>;
 
-interface TooltipProps {
-    content: React__default.ReactNode;
-    children: React__default.ReactNode;
-    className?: string;
-    delay?: "normal" | "slow";
-}
-declare function Tooltip({ content, children, className, delay, }: TooltipProps): react_jsx_runtime.JSX.Element;
-interface HelperTooltipProps {
-    content: React__default.ReactNode;
-    className?: string;
-}
-declare function HelperTooltip({ content, className }: HelperTooltipProps): react_jsx_runtime.JSX.Element;
-
-declare function cn(...inputs: ClassValue[]): string;
-
-interface DialogProps {
-    open?: boolean;
-    onOpenChange?: (open: boolean, event?: Event) => void;
-    trigger?: React__default.ReactNode;
-    children: React__default.ReactNode;
-    className?: string;
-}
-declare function Dialog({ open, onOpenChange, trigger, children, className, }: DialogProps): react_jsx_runtime.JSX.Element;
-declare const DialogTitle: (props: React__default.ComponentProps<typeof Dialog$1.Title>) => react_jsx_runtime.JSX.Element;
-declare const DialogDescription: (props: React__default.ComponentProps<typeof Dialog$1.Description>) => react_jsx_runtime.JSX.Element;
-declare const DialogClose: (props: React__default.ComponentProps<typeof Dialog$1.Close>) => react_jsx_runtime.JSX.Element;
-
-interface PopoverProps {
-    trigger: React__default.ReactNode;
-    children: React__default.ReactNode;
-    side?: "top" | "right" | "bottom" | "left";
-    align?: "start" | "center" | "end";
-    className?: string;
-    open?: boolean;
-    onOpenChange?: (open: boolean) => void;
-}
-declare function Popover({ trigger, children, side, align, className, open, onOpenChange, }: PopoverProps): react_jsx_runtime.JSX.Element;
-
 interface DropdownProps {
     trigger: React__default.ReactNode;
     children: React__default.ReactNode;
@@ -484,18 +601,6 @@ declare function Dropdown({ trigger, children, align, className, }: DropdownProp
 declare const DropdownItem: React__default.ForwardRefExoticComponent<Omit<Omit<_base_ui_react.ContextMenuItemProps, "ref"> & React__default.RefAttributes<HTMLElement>, "ref"> & React__default.RefAttributes<HTMLDivElement>>;
 declare const DropdownSeparator: React__default.ForwardRefExoticComponent<Omit<Omit<_base_ui_react.SeparatorProps, "ref"> & React__default.RefAttributes<HTMLDivElement>, "ref"> & React__default.RefAttributes<HTMLDivElement>>;
 
-interface CollapsibleProps {
-    title: React__default.ReactNode;
-    children: React__default.ReactNode;
-    /** The variant of the trigger button */
-    variant?: ButtonProps["variant"];
-    /** The size of the trigger button */
-    size?: ButtonProps["size"];
-    defaultOpen?: boolean;
-    className?: string;
-}
-declare function Collapsible({ title, children, variant, size, defaultOpen, className, }: CollapsibleProps): react_jsx_runtime.JSX.Element;
-
 interface SwitchProps extends React__default.AriaAttributes {
     checked?: boolean;
     defaultChecked?: boolean;
@@ -514,17 +619,6 @@ interface LabelProps extends React__default.LabelHTMLAttributes<HTMLLabelElement
 }
 declare function Label({ children, tooltip, className, ...props }: LabelProps): react_jsx_runtime.JSX.Element;
 
-interface BasePanelProps {
-    title: string;
-    children: ReactNode;
-    onClose?: () => void;
-    className?: string;
-    headerClassName?: string;
-    headingLevel?: 1 | 2 | 3 | 4 | 5 | 6;
-    setPanel: (panel: string) => void;
-}
-declare function BasePanel({ title, children, onClose, className, headerClassName, headingLevel, setPanel }: BasePanelProps): react_jsx_runtime.JSX.Element;
-
 interface TabRadioOption<T extends string> {
     value: T;
     label: ReactNode;
@@ -540,7 +634,7 @@ interface TabRadioProps<T extends string> {
 }
 declare function TabRadio<T extends string>({ options, value, onChange, className, variant, "aria-label": ariaLabel, }: TabRadioProps<T>): react_jsx_runtime.JSX.Element;
 
-interface NumberFieldProps {
+interface NumberFieldProps extends React__default.AriaAttributes {
     value?: number | null;
     defaultValue?: number;
     min?: number;
@@ -572,15 +666,150 @@ interface FieldProps extends Field$1.Root.Props {
  */
 declare const Field: React__default.ForwardRefExoticComponent<Omit<FieldProps, "ref"> & React__default.RefAttributes<HTMLDivElement>>;
 
-type AnchorProps = React$1.AnchorHTMLAttributes<HTMLAnchorElement>;
-declare const Anchor: React$1.ForwardRefExoticComponent<AnchorProps & React$1.RefAttributes<HTMLAnchorElement>>;
-
 type TextAreaProps = React__default.TextareaHTMLAttributes<HTMLTextAreaElement>;
 declare const TextArea: React__default.ForwardRefExoticComponent<TextAreaProps & React__default.RefAttributes<HTMLTextAreaElement>>;
 
 type CheckboxProps = React__default.InputHTMLAttributes<HTMLInputElement>;
 declare const Checkbox: React__default.ForwardRefExoticComponent<CheckboxProps & React__default.RefAttributes<HTMLButtonElement>>;
 
+type PeerbotsColor = "Light Blue" | "Blue" | "Green" | "Red" | "Purple" | "Pink" | "Yellow" | "Orange" | "Grey" | "Black" | "White";
+declare const PEERBOTS_COLOR_MAP: Record<PeerbotsColor, string>;
+declare const PEERBOTS_FONT_COLOR_MAP: Record<PeerbotsColor, string>;
+interface PeerbotsColorSelectorProps {
+    selectedColor?: PeerbotsColor | string;
+    onColorSelect: (color: PeerbotsColor) => void;
+    colors?: PeerbotsColor[];
+    size?: "sm" | "md" | "lg";
+    className?: string;
+    ariaLabelPrefix?: string;
+}
+declare function PeerbotsColorSelector({ selectedColor, onColorSelect, colors, size, className, ariaLabelPrefix, }: PeerbotsColorSelectorProps): react_jsx_runtime.JSX.Element;
+
+interface ChipOption<T = string> {
+    value: T;
+    label: React__default.ReactNode;
+    badge?: React__default.ReactNode;
+    disabled?: boolean;
+    icon?: React__default.ReactNode;
+}
+interface ChipGroupProps<T = string> {
+    /** Array of selectable chip options */
+    options: ChipOption<T>[];
+    /** Controlled single selected value */
+    value?: T;
+    /** Uncontrolled initial single selected value */
+    defaultValue?: T;
+    /** Callback fired when single selection changes */
+    onChange?: (value: T) => void;
+    /** Enable multiple selection mode */
+    multiple?: boolean;
+    /** Controlled array of selected values (for multi mode) */
+    values?: T[];
+    /** Uncontrolled initial array of selected values (for multi mode) */
+    defaultValues?: T[];
+    /** Callback fired when multiple selection changes */
+    onMultipleChange?: (values: T[]) => void;
+    /** Color theme */
+    color?: ComponentColor;
+    /** Visual fill style */
+    variant?: "solid" | "soft" | "outline";
+    /** Size scale */
+    size?: ComponentSize;
+    /** Border radius scale */
+    radius?: ComponentRadius;
+    /** Enable horizontal scrollable rail */
+    scrollable?: boolean;
+    className?: string;
+    id?: string;
+    name?: string;
+}
+declare function ChipGroup<T = string>({ options, value: controlledValue, defaultValue, onChange, multiple, values: controlledValues, defaultValues, onMultipleChange, color, variant, size, radius, scrollable, className, id, name, }: ChipGroupProps<T>): react_jsx_runtime.JSX.Element;
+
+interface CardProps extends React__default.HTMLAttributes<HTMLElement> {
+    children: React__default.ReactNode;
+    /**
+     * Surface treatment / fill style.
+     * @default "surface"
+     */
+    variant?: SurfaceVariant | "default" | "elevated";
+    /**
+     * Background color tinting.
+     * @default "default"
+     */
+    color?: "default" | "teal" | "pink";
+    /**
+     * Card padding scale.
+     * @default "md"
+     */
+    padding?: "none" | ComponentSize;
+    /**
+     * Border radius scale.
+     * @default "2xl"
+     */
+    radius?: ComponentRadius;
+    /** Whether the card shows interactive hover elevation */
+    hoverable?: boolean;
+    id?: string;
+    as?: React__default.ElementType;
+    href?: string;
+    target?: string;
+    rel?: string;
+}
+declare const Card: React__default.ForwardRefExoticComponent<CardProps & React__default.RefAttributes<HTMLElement>>;
+
+interface AccordionItem {
+    id?: string;
+    question?: React__default.ReactNode;
+    title?: React__default.ReactNode;
+    answer?: React__default.ReactNode;
+    content?: React__default.ReactNode;
+    description?: React__default.ReactNode;
+    bodyHtml?: string;
+    isOpenDefault?: boolean;
+}
+interface AccordionProps {
+    /** List of accordion items for multi-item list mode */
+    items?: AccordionItem[];
+    /** Allow multiple items to be opened simultaneously */
+    allowMultiple?: boolean;
+    /** Visual style variant */
+    variant?: "default" | "bordered" | "flat";
+    /** Single-item mode: title for the disclosure */
+    title?: React__default.ReactNode;
+    /** Single-item mode: content/children for the disclosure */
+    children?: React__default.ReactNode;
+    /** Single-item mode: default open state */
+    defaultOpen?: boolean;
+    /** Controlled open state for single-item mode */
+    isOpen?: boolean;
+    /** Controlled toggle callback for single-item mode */
+    onToggle?: (open: boolean) => void;
+    className?: string;
+    headerClassName?: string;
+    contentClassName?: string;
+}
+declare const Accordion: React__default.FC<AccordionProps>;
+
+interface CollapsibleProps {
+    title: React__default.ReactNode;
+    children: React__default.ReactNode;
+    /** The variant of the trigger or panel */
+    variant?: ButtonProps["variant"] | "default" | "bordered" | "flat";
+    /** The size of the trigger button */
+    size?: ButtonProps["size"];
+    defaultOpen?: boolean;
+    isOpen?: boolean;
+    onToggle?: (open: boolean) => void;
+    className?: string;
+}
+declare function Collapsible({ title, children, variant, defaultOpen, isOpen: controlledIsOpen, onToggle, className, }: CollapsibleProps): react_jsx_runtime.JSX.Element;
+
+interface SeparatorProps extends React.ComponentPropsWithoutRef<typeof Separator$1> {
+    orientation?: "horizontal" | "vertical";
+    className?: string;
+}
+declare const Separator: React.ForwardRefExoticComponent<SeparatorProps & React.RefAttributes<HTMLDivElement>>;
+
 interface SettingsPanelProps {
     /** The title of the section */
     title?: ReactNode;
@@ -599,21 +828,217 @@ interface SettingsPanelProps {
 }
 /**
  * A standardized panel for settings sections.
- * Provides a consistent look with white background, shadow, and rounded corners.
+ * Built on top of Card and Collapsible for design system consistency.
  */
 declare function SettingsPanel({ title, children, className, contentClassName, collapsible, defaultOpen, headingLevel, }: SettingsPanelProps): react_jsx_runtime.JSX.Element;
 
-interface SeparatorProps extends React$1.ComponentPropsWithoutRef<typeof Separator$1> {
-    orientation?: "horizontal" | "vertical";
+interface AvatarProps extends React__default.HTMLAttributes<HTMLDivElement> {
+    /** Image source URL. */
+    src?: string | null;
+    /** Full name of the user, maker, or robot. Used to generate initials and accessible label. */
+    name?: string;
+    /** Accessible alt text for the avatar image. Defaults to `name` or `"Avatar"`. */
+    alt?: string;
+    /** Size variant. Defaults to `"md"`. */
+    size?: "xs" | "sm" | "md" | "lg" | "xl";
+    /** Shape of the avatar. Defaults to `"circle"`. */
+    shape?: "circle" | "rounded";
+    /** Custom fallback icon if no image or initials are available. */
+    fallbackIcon?: React__default.ReactNode;
+}
+declare const Avatar: React__default.ForwardRefExoticComponent<AvatarProps & React__default.RefAttributes<HTMLDivElement>>;
+
+interface DropzoneProps {
+    /** Accepted MIME types or extensions (e.g. `"image/*"`, `"video/*"`, `".zip"`). */
+    accept?: string;
+    /** Maximum file size allowed in Megabytes (MB). */
+    maxSizeMB?: number;
+    /** Whether the dropzone is disabled. */
+    disabled?: boolean;
+    /**
+     * Optional controlled URL or data URL of an uploaded file to display in preview mode.
+     * If not provided, Dropzone will automatically generate and display a preview for selected images/videos.
+     */
+    previewUrl?: string | null;
+    /** Optional controlled File object. */
+    value?: File | null;
+    /** Whether to automatically show a preview when an image/video is selected. Default is `true`. */
+    showPreview?: boolean;
+    /** How to render the preview. Default is `"auto"`. */
+    previewType?: "image" | "video" | "auto";
+    /** Main callout title. Default is `"Click or drag file to upload"`. */
+    title?: React__default.ReactNode;
+    /** Subtitle or requirement text. Default is `"Supported formats: PNG, JPG, WEBP, MP4"`. */
+    subtitle?: React__default.ReactNode;
+    /** Custom icon for the dropzone idle state. */
+    icon?: React__default.ReactNode;
+    /** Callback fired when a valid file is dropped or selected. */
+    onFileSelect?: (file: File) => void;
+    /** Callback fired when the active file/preview is cleared. */
+    onFileRemove?: () => void;
+    /** Callback fired when a file exceeds size limit or validation fails. */
+    onError?: (errorMessage: string) => void;
+    /** Optional custom CSS classes for the root dropzone container. */
+    className?: string;
+    id?: string;
+    name?: string;
+}
+declare const Dropzone: React__default.ForwardRefExoticComponent<DropzoneProps & React__default.RefAttributes<HTMLDivElement>>;
+
+interface FileUploadProps {
+    /** Accepted file types (e.g. `"image/*"`, `".pdf"`, `"audio/*"`). */
+    accept?: string;
+    /** Whether multiple files can be selected. */
+    multiple?: boolean;
+    /** Whether the input is disabled. */
+    disabled?: boolean;
+    /** Maximum allowable file size in bytes. */
+    maxSizeBytes?: number;
+    /** Text displayed inside the trigger button. Default is `"Choose File"`. */
+    buttonText?: React__default.ReactNode;
+    /** Button style variant. Default is `"secondary"`. */
+    buttonVariant?: ButtonProps["variant"];
+    /** Button size. Default is `"md"`. */
+    buttonSize?: ButtonProps["size"];
+    /** Icon shown inside the button. Default is `<Icon name="arrowUpTray" />`. */
+    buttonIcon?: React__default.ReactNode;
+    /** Text shown when no file has been chosen. Default is `"No file chosen"`. */
+    placeholder?: string;
+    /** Whether to show a clear/remove button when files are selected. Default is `true`. */
+    clearable?: boolean;
+    /** Controlled file(s) value. */
+    value?: File | File[] | null;
+    /** Callback fired when file selection changes. */
+    onChange?: (files: File | File[] | null) => void;
+    /** Callback fired when a file exceeds size limit or validation fails. */
+    onError?: (errorMessage: string) => void;
+    /** Optional custom CSS classes. */
+    className?: string;
+    id?: string;
+    name?: string;
+}
+declare const FileUpload: React__default.ForwardRefExoticComponent<FileUploadProps & React__default.RefAttributes<HTMLDivElement>>;
+
+interface TooltipProps {
+    content: React__default.ReactNode;
+    children: React__default.ReactNode;
     className?: string;
+    delay?: "normal" | "slow";
 }
-declare const Separator: React$1.ForwardRefExoticComponent<SeparatorProps & React$1.RefAttributes<HTMLDivElement>>;
+declare function Tooltip({ content, children, className, delay, }: TooltipProps): react_jsx_runtime.JSX.Element;
+interface HelperTooltipProps {
+    content: React__default.ReactNode;
+    className?: string;
+}
+declare function HelperTooltip({ content, className }: HelperTooltipProps): react_jsx_runtime.JSX.Element;
+
+interface DialogProps {
+    open?: boolean;
+    onOpenChange?: (open: boolean, event?: Event) => void;
+    trigger?: React__default.ReactNode;
+    children: React__default.ReactNode;
+    className?: string;
+}
+declare function Dialog({ open, onOpenChange, trigger, children, className, }: DialogProps): react_jsx_runtime.JSX.Element;
+declare const DialogTitle: (props: React__default.ComponentProps<typeof Dialog$1.Title>) => react_jsx_runtime.JSX.Element;
+declare const DialogDescription: (props: React__default.ComponentProps<typeof Dialog$1.Description>) => react_jsx_runtime.JSX.Element;
+declare const DialogClose: (props: React__default.ComponentProps<typeof Dialog$1.Close>) => react_jsx_runtime.JSX.Element;
+
+interface PopoverProps {
+    /** The element that triggers the popover when clicked */
+    trigger: React__default.ReactNode;
+    /** Popover body content */
+    children: React__default.ReactNode;
+    /** Optional header title */
+    title?: React__default.ReactNode;
+    /** Controlled open state */
+    open?: boolean;
+    /** Initial open state in uncontrolled mode */
+    defaultOpen?: boolean;
+    /** Callback fired when open state changes */
+    onOpenChange?: (open: boolean) => void;
+    /** Side where the popover appears */
+    side?: "top" | "bottom" | "left" | "right";
+    /** Alignment relative to the trigger */
+    align?: "start" | "center" | "end";
+    /** Distance from the trigger in pixels */
+    sideOffset?: number;
+    /** Surface visual variant */
+    variant?: SurfaceVariant | "default";
+    /** Whether to show a close button in the header */
+    showCloseButton?: boolean;
+    /** Whether to display a pointing arrow */
+    showArrow?: boolean;
+    className?: string;
+}
+declare function Popover({ trigger, children, title, open, defaultOpen, onOpenChange, side, align, sideOffset, variant, showCloseButton, showArrow, className, }: PopoverProps): react_jsx_runtime.JSX.Element;
+declare const PopoverTitle: (props: React__default.ComponentProps<typeof Popover$1.Title>) => react_jsx_runtime.JSX.Element;
+declare const PopoverDescription: (props: React__default.ComponentProps<typeof Popover$1.Description>) => react_jsx_runtime.JSX.Element;
+declare const PopoverClose: (props: React__default.ComponentProps<typeof Popover$1.Close>) => react_jsx_runtime.JSX.Element;
 
 interface SkeletonProps extends HTMLAttributes<HTMLDivElement> {
     className?: string;
 }
 declare function Skeleton({ className, ...props }: SkeletonProps): react_jsx_runtime.JSX.Element;
 
+type AlertLevel = "Error" | "Warning" | "Success" | "Info";
+type AlertColor = "danger" | "warning" | "success" | "info" | "neutral";
+interface AlertAction {
+    name: string;
+    callback: () => void;
+}
+interface AlertUIProps {
+    /** Alert semantic color */
+    color?: AlertColor;
+    /** Legacy level prop for backward compatibility */
+    level?: AlertLevel;
+    /** Visual style variant */
+    variant?: "soft" | "outline" | "solid";
+    /** Optional alert title */
+    title?: React__default.ReactNode;
+    /** Alert message body */
+    message?: React__default.ReactNode;
+    /** Children as alternative to message */
+    children?: React__default.ReactNode;
+    /** Optional action button */
+    action?: AlertAction;
+    /** Callback fired when alert is dismissed */
+    onClose?: () => void;
+    /** Border radius scale */
+    radius?: ComponentRadius;
+    className?: string;
+}
+declare function Alert({ color, level, variant, title, message, children, action, onClose, radius, className, }: AlertUIProps): react_jsx_runtime.JSX.Element | null;
+
+interface EmptyStateAction {
+    label: React__default.ReactNode;
+    onClick?: () => void;
+    render?: React__default.ReactElement;
+    variant?: FillVariant;
+    color?: ComponentColor;
+    icon?: IconProps["name"] | React__default.ReactNode;
+}
+interface EmptyStateProps {
+    title: React__default.ReactNode;
+    description?: React__default.ReactNode;
+    icon?: IconProps["name"] | React__default.ReactNode;
+    primaryAction?: EmptyStateAction;
+    secondaryAction?: EmptyStateAction;
+    children?: React__default.ReactNode;
+    className?: string;
+}
+declare function EmptyState({ title, description, icon, primaryAction, secondaryAction, children, className, }: EmptyStateProps): react_jsx_runtime.JSX.Element;
+
+interface SpinnerProps extends React__default.HTMLAttributes<HTMLDivElement> {
+    /** Size variant of the spinner */
+    size?: ComponentSize;
+    /** Color theme of the spinner */
+    color?: BrandColor | "primary" | "neutral";
+    /** Screen-reader accessible label */
+    label?: string;
+}
+declare const Spinner: React__default.ForwardRefExoticComponent<SpinnerProps & React__default.RefAttributes<HTMLDivElement>>;
+
 type AuthFormMode = "signing up" | "signing in" | "resetting password";
 interface AuthFormUIProps {
     mode: AuthFormMode;
@@ -624,23 +1049,11 @@ interface AuthFormUIProps {
         message: string;
     };
     onGoogleSignIn?: () => void;
-    title?: React.ReactNode;
-    description?: React.ReactNode;
+    title?: React__default.ReactNode;
+    description?: React__default.ReactNode;
 }
 declare function AuthFormUI({ mode, onModeChange, formAction, actionState, onGoogleSignIn, title, description, }: AuthFormUIProps): react_jsx_runtime.JSX.Element;
 
-type AlertLevel = "Error" | "Warning" | "Success" | "Info";
-interface AlertAction {
-    name: string;
-    callback: () => void;
-}
-interface AlertUIProps {
-    level: AlertLevel;
-    message: React.ReactNode;
-    action?: AlertAction;
-}
-declare function Alert({ level, message, action }: AlertUIProps): react_jsx_runtime.JSX.Element;
-
 interface TabItem {
     id: string;
     label: string;
@@ -656,6 +1069,77 @@ interface TabSelectionProps {
 }
 declare function TabSelection({ tabs, activeTabId, onTabClick, onAddClick, className, }: TabSelectionProps): react_jsx_runtime.JSX.Element;
 
+interface SearchInputProps extends Omit<InputProps, "leftIcon" | "rightIcon"> {
+    onSearch?: (query: string) => void;
+    onClear?: () => void;
+    showClearButton?: boolean;
+}
+declare const SearchInput: React__default.ForwardRefExoticComponent<SearchInputProps & React__default.RefAttributes<HTMLInputElement>>;
+
+interface CopyButtonProps extends Omit<ButtonProps, "onClick"> {
+    /** The text value to copy to the clipboard. */
+    value: string;
+    /** Label displayed before copying. Default is `"Copy"`. Pass `null` or use `isIconOnly` for icon-only. */
+    label?: React__default.ReactNode;
+    /** Label displayed after copying. Default is `"Copied!"`. */
+    successLabel?: React__default.ReactNode;
+    /** Duration in milliseconds for the success state. Default is `2000`. */
+    timeout?: number;
+    /** Callback fired after successfully copying to clipboard. */
+    onCopied?: (value: string) => void;
+    /** Callback fired if copying fails. */
+    onCopyError?: (error: Error) => void;
+    /** Custom icon shown in default state. */
+    copyIcon?: React__default.ReactNode;
+    /** Custom icon shown in copied state. */
+    successIcon?: React__default.ReactNode;
+    /** Whether to show icons. Default is `true`. */
+    showIcon?: boolean;
+}
+declare const CopyButton: React__default.ForwardRefExoticComponent<CopyButtonProps & React__default.RefAttributes<HTMLButtonElement>>;
+
+interface UseClipboardOptions {
+    /**
+     * Duration in milliseconds for the `copied` state to remain `true`.
+     * @default 2000
+     */
+    timeout?: number;
+    /** Callback fired after successfully copying to clipboard. */
+    onSuccess?: (text: string) => void;
+    /** Callback fired if copying fails. */
+    onError?: (error: Error) => void;
+}
+declare function useClipboard(options?: UseClipboardOptions): {
+    copy: (text: string) => Promise<boolean>;
+    copied: boolean;
+    error: Error | null;
+};
+
+type StepStatus = "complete" | "current" | "upcoming" | "disabled";
+interface StepItem {
+    id: string;
+    title: React__default.ReactNode;
+    description?: React__default.ReactNode;
+    status?: StepStatus;
+    icon?: React__default.ReactNode;
+}
+interface StepperProps {
+    /** Array of sequential steps */
+    steps: StepItem[];
+    /** Controlled currently active step id */
+    activeStepId?: string;
+    /** Callback fired when a step is clicked */
+    onStepClick?: (stepId: string) => void;
+    /** Layout orientation */
+    orientation?: "horizontal" | "vertical" | "chips";
+    /** Brand color theme */
+    color?: ComponentColor;
+    /** Size scale */
+    size?: ComponentSize;
+    className?: string;
+}
+declare function Stepper({ steps, activeStepId, onStepClick, orientation, color, size, className, }: StepperProps): react_jsx_runtime.JSX.Element;
+
 interface SEOProps {
     title: string;
     description?: string;
@@ -701,4 +1185,32 @@ interface DistributionHistogramProps {
 }
 declare function DistributionHistogram({ data, alt, label, average, referenceLineValue, referenceLineLabel, chartWidth, chartHeight, }: DistributionHistogramProps): react_jsx_runtime.JSX.Element | null;
 
-export { Alert, type AlertAction, type AlertLevel, type AlertUIProps, Anchor, type AnchorProps, type AuthFormMode, AuthFormUI, type AuthFormUIProps, BasePanel, type BasePanelProps, Button, type ButtonProps, Checkbox, type CheckboxProps, Collapsible, type CollapsibleProps, Dialog, DialogClose, DialogDescription, type DialogProps, DialogTitle, DistributionBarChart, type DistributionBarChartProps, type DistributionBarData, DistributionHistogram, type DistributionHistogramData, type DistributionHistogramProps, Dropdown, DropdownItem, type DropdownProps, DropdownSeparator, Field, type FieldProps, Heading, HelperTooltip, type HelperTooltipProps, Icon, type IconName, type IconProps, Input, type InputProps, Label, type LabelProps, NumberField, type NumberFieldProps, Popover, type PopoverProps, SEO, Select, type SelectOption, type SelectProps, Separator, type SeparatorProps, SettingsPanel, type SettingsPanelProps, Skeleton, type SkeletonProps, Slider, type SliderProps, SliderWithNumberField, type SliderWithNumberFieldProps, Switch, type SwitchProps, type TabItem, TabRadio, type TabRadioOption, type TabRadioProps, TabSelection, type TabSelectionProps, Text, TextArea, type TextAreaProps, Tooltip, type TooltipProps, TypographyList, cn, iconPaths };
+interface LineGraphPoint {
+    x: number;
+    y: number;
+}
+interface LineGraphHighlightPoint extends LineGraphPoint {
+    color?: string;
+    label?: string;
+}
+interface LineGraphProps {
+    data: LineGraphPoint[];
+    highlightPoints?: LineGraphHighlightPoint[];
+    minX?: number;
+    maxX?: number;
+    minY?: number;
+    maxY?: number;
+    width?: number | string;
+    height?: number;
+    strokeColor?: string;
+    strokeWidth?: number;
+    fillColor?: string;
+    showGrid?: boolean;
+    showAxisLabels?: boolean;
+    xUnit?: string;
+    padding?: number;
+    className?: string;
+}
+declare function LineGraph({ data, highlightPoints, minX, maxX, minY, maxY, width, height, strokeColor, strokeWidth, fillColor, showGrid, showAxisLabels, xUnit, padding, className, }: LineGraphProps): react_jsx_runtime.JSX.Element;
+
+export { Accordion, type AccordionItem, type AccordionProps, Alert, type AlertAction, type AlertColor, type AlertLevel, type AlertUIProps, Anchor, type AnchorProps, type AuthFormMode, AuthFormUI, type AuthFormUIProps, Avatar, type AvatarProps, type BrandColor, Button, type ButtonProps, type ButtonVariant, Card, type CardProps, Checkbox, type CheckboxProps, ChipGroup, type ChipGroupProps, type ChipOption, CodeBlock, type CodeBlockProps, Collapsible, type CollapsibleProps, type ComponentColor, type ComponentRadius, type ComponentSize, CopyButton, type CopyButtonProps, DEFAULT_PEERBOTS_SOCIAL_LINKS, Dialog, DialogClose, DialogDescription, type DialogProps, DialogTitle, DistributionBarChart, type DistributionBarChartProps, type DistributionBarData, DistributionHistogram, type DistributionHistogramData, type DistributionHistogramProps, Dropdown, DropdownItem, type DropdownProps, DropdownSeparator, Dropzone, type DropzoneProps, EmptyState, type EmptyStateAction, type EmptyStateProps, Field, type FieldProps, FileUpload, type FileUploadProps, type FillVariant, Heading, type HeadingProps, HelperTooltip, type HelperTooltipProps, Icon, type IconName, type IconProps, Input, type InputProps, type IntentColor, Label, type LabelProps, LineGraph, type LineGraphPoint, type LineGraphProps, Link, type LinkProps, NumberField, type NumberFieldProps, PEERBOTS_COLOR_MAP, PEERBOTS_FONT_COLOR_MAP, type PeerbotsColor, PeerbotsColorSelector, type PeerbotsColorSelectorProps, Popover, PopoverClose, PopoverDescription, type PopoverProps, PopoverTitle, SEO, SearchInput, type SearchInputProps, Select, type SelectOption, type SelectProps, Separator, type SeparatorProps, SettingsPanel, type SettingsPanelProps, Skeleton, type SkeletonProps, Slider, type SliderProps, SliderWithNumberField, type SliderWithNumberFieldProps, type SocialLinkItem, SocialLinks, type SocialLinksProps, Spinner, type SpinnerProps, type StepItem, type StepStatus, Stepper, type StepperProps, type SurfaceVariant, Switch, type SwitchProps, type TabItem, TabRadio, type TabRadioOption, type TabRadioProps, TabSelection, type TabSelectionProps, Text, TextArea, type TextAreaProps, type TextProps, Tooltip, type TooltipProps, type UseClipboardOptions, cn, iconPaths, useClipboard };