@undp/design-system-react/dist/index.d.ts

React based design system for UNDP

import * as AccordionPrimitive from '@radix-ui/react-accordion';
import * as CheckboxPrimitive from '@radix-ui/react-checkbox';
import { ClassProp } from 'class-variance-authority/types';
import { ClassValue } from 'clsx';
import { Components } from 'react-markdown';
import { createFilter } from 'react-select';
import { default as default_2 } from 'react';
import { default as default_3 } from 'rc-slider';
import * as DropdownMenuPrimitive from '@radix-ui/react-dropdown-menu';
import * as HoverCardPrimitive from '@radix-ui/react-hover-card';
import { JSX } from 'react/jsx-runtime';
import * as LabelPrimitive from '@radix-ui/react-label';
import * as PopoverPrimitive from '@radix-ui/react-popover';
import { Props } from 'react-select';
import * as RadioGroupPrimitive from '@radix-ui/react-radio-group';
import * as React_2 from 'react';
import { ReactNode } from 'react';
import * as SeparatorPrimitive from '@radix-ui/react-separator';
import * as SwitchPrimitives from '@radix-ui/react-switch';
import * as TabsPrimitive from '@radix-ui/react-tabs';
import * as ToastPrimitives from '@radix-ui/react-toast';
import * as TooltipPrimitive from '@radix-ui/react-tooltip';
import { VariantProps } from 'class-variance-authority';

export declare function A({ children, className, ...props }: LinkProps): JSX.Element;

export declare const Accordion: default_2.ForwardRefExoticComponent<AccordionProps & default_2.RefAttributes<HTMLDivElement>>;

export declare const AccordionContent: default_2.ForwardRefExoticComponent<Omit<AccordionPrimitive.AccordionContentProps & default_2.RefAttributes<HTMLDivElement>, "ref"> & default_2.RefAttributes<HTMLDivElement>>;

export declare const AccordionItem: default_2.ForwardRefExoticComponent<Omit<AccordionPrimitive.AccordionItemProps & default_2.RefAttributes<HTMLDivElement>, "ref"> & default_2.RefAttributes<HTMLDivElement>>;

declare type AccordionProps = default_2.ComponentPropsWithoutRef<typeof AccordionPrimitive.Root> & VariantProps<typeof accordionVariants>;

export declare const AccordionTrigger: default_2.ForwardRefExoticComponent<Omit<AccordionPrimitive.AccordionTriggerProps & default_2.RefAttributes<HTMLButtonElement>, "ref"> & default_2.RefAttributes<HTMLButtonElement>>;

declare const accordionVariants: (props?: ({
    variant?: "primary" | "secondary" | "tertiary" | "quaternary" | null | undefined;
} & ClassProp) | undefined) => string;

export declare function Badge({ className, rounded, variant, size, ...props }: BadgeProps): JSX.Element;

declare interface BadgeProps extends default_2.HTMLAttributes<HTMLDivElement>, VariantProps<typeof badgeVariants> {
}

declare const badgeVariants: (props?: ({
    variant?: "light-gray" | "gray" | "dark-gray" | "blue" | "yellow" | "green" | "red" | "azure" | "outline" | "custom" | null | undefined;
    rounded?: "none" | "xs" | "sm" | "full" | null | undefined;
    size?: "base" | "xs" | "sm" | "lg" | "xl" | null | undefined;
} & ClassProp) | undefined) => string;

export declare const Banner: default_2.ForwardRefExoticComponent<default_2.HTMLAttributes<HTMLDivElement> & VariantProps<(props?: ({
    backgroundColor?: "gray" | "dark-gray" | "blue" | "yellow" | "green" | "red" | "azure" | "custom" | "transparent" | "white" | "black" | null | undefined;
    padding?: "base" | "none" | "xs" | "sm" | "lg" | "xl" | "2xs" | "2xl" | "3xl" | null | undefined;
} & ClassProp) | undefined) => string> & VariantProps<(props?: ({
    bodyMaxWidth?: "base" | "xs" | "sm" | "full" | "lg" | "xl" | null | undefined;
    bodyGap?: "base" | "none" | "xs" | "sm" | "lg" | "xl" | "2xs" | "2xl" | "3xl" | null | undefined;
} & ClassProp) | undefined) => string> & VariantProps<(props?: ({
    sidebarWidth?: "base" | "sm" | "full" | "lg" | null | undefined;
} & ClassProp) | undefined) => string> & default_2.RefAttributes<HTMLDivElement>>;

export declare const BannerBody: default_2.ForwardRefExoticComponent<default_2.HTMLAttributes<HTMLDivElement> & default_2.RefAttributes<HTMLDivElement>>;

export declare const BannerBodyContent: default_2.ForwardRefExoticComponent<default_2.HTMLAttributes<HTMLDivElement> & default_2.RefAttributes<HTMLDivElement>>;

export declare const BannerBodySidebar: default_2.ForwardRefExoticComponent<default_2.HTMLAttributes<HTMLDivElement> & default_2.RefAttributes<HTMLDivElement>>;

export declare function Blockquote({ children, className, marginBottom, ...props }: BlockquoteProps & VariantProps<typeof headingVariant>): JSX.Element;

declare interface BlockquoteProps extends default_2.HTMLAttributes<HTMLQuoteElement> {
    className?: string;
}

export declare const Breadcrumb: default_2.ForwardRefExoticComponent<Omit<default_2.DetailedHTMLProps<default_2.HTMLAttributes<HTMLElement>, HTMLElement>, "ref"> & default_2.RefAttributes<HTMLElement>>;

export declare function BreadcrumbEllipsis({ className, ...props }: default_2.ComponentProps<'span'>): JSX.Element;

export declare namespace BreadcrumbEllipsis {
    var displayName: string;
}

export declare const BreadcrumbItem: default_2.ForwardRefExoticComponent<Omit<default_2.DetailedHTMLProps<default_2.LiHTMLAttributes<HTMLLIElement>, HTMLLIElement>, "ref"> & default_2.RefAttributes<HTMLLIElement>>;

export declare const BreadcrumbLink: default_2.ForwardRefExoticComponent<Omit<default_2.DetailedHTMLProps<default_2.AnchorHTMLAttributes<HTMLAnchorElement>, HTMLAnchorElement>, "ref"> & default_2.RefAttributes<HTMLAnchorElement>>;

export declare const BreadcrumbList: default_2.ForwardRefExoticComponent<Omit<default_2.DetailedHTMLProps<default_2.OlHTMLAttributes<HTMLOListElement>, HTMLOListElement>, "ref"> & default_2.RefAttributes<HTMLOListElement>>;

export declare const BreadcrumbPage: default_2.ForwardRefExoticComponent<Omit<default_2.DetailedHTMLProps<default_2.HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, "ref"> & default_2.RefAttributes<HTMLSpanElement>>;

export declare function BreadcrumbSeparator(): JSX.Element;

export declare namespace BreadcrumbSeparator {
    var displayName: string;
}

export declare const Button: default_2.ForwardRefExoticComponent<ButtonProps & default_2.RefAttributes<HTMLButtonElement>>;

declare interface ButtonProps extends default_2.ButtonHTMLAttributes<HTMLButtonElement>, VariantProps<typeof buttonVariants> {
}

declare const buttonVariants: (props?: ({
    variant?: "primary" | "secondary" | "tertiary" | "link" | "outline" | "primary-without-icon" | "secondary-without-icon" | "link-without-icon" | "icon" | null | undefined;
    size?: "base" | "xs" | "sm" | "xl" | null | undefined;
    padding?: "base" | "none" | "sm" | null | undefined;
} & ClassProp) | undefined) => string;

export declare const Card: React_2.ForwardRefExoticComponent<CardProps & React_2.RefAttributes<HTMLDivElement>>;

export declare const CardDescription: React_2.ForwardRefExoticComponent<React_2.HTMLAttributes<HTMLHeadingElement> & React_2.RefAttributes<HTMLHeadingElement>>;

export declare const CardFooter: React_2.ForwardRefExoticComponent<React_2.HTMLAttributes<HTMLDivElement> & React_2.RefAttributes<HTMLDivElement>>;

export declare const CardHeader: React_2.ForwardRefExoticComponent<CardProps & React_2.RefAttributes<HTMLDivElement>>;

export declare const CardImage: React_2.ForwardRefExoticComponent<CardImageProps & React_2.RefAttributes<HTMLImageElement>>;

declare interface CardImageProps extends React_2.HTMLAttributes<HTMLImageElement> {
    src: string;
    alt?: string;
}

declare interface CardProps extends React_2.HTMLAttributes<HTMLDivElement>, VariantProps<typeof cardVariants> {
    border?: boolean;
}

declare interface CardProps_2 extends React_2.HTMLAttributes<HTMLDivElement>, VariantProps<typeof cardVariants_2> {
    border?: boolean;
}

declare interface CardProps_3 extends default_2.HTMLAttributes<HTMLDivElement>, VariantProps<typeof cardVariants_3> {
    vizStyle?: default_2.CSSProperties;
    slides: {
        content: ReactNode;
        viz: ReactNode;
    }[];
    contentStyle?: default_2.CSSProperties;
    contentClassName?: string;
    vizClassName?: string;
    slideNo?: boolean;
}

export declare const CardTag: React_2.ForwardRefExoticComponent<React_2.HTMLAttributes<HTMLHeadingElement> & React_2.RefAttributes<HTMLHeadingElement>>;

export declare const CardTitle: React_2.ForwardRefExoticComponent<React_2.HTMLAttributes<HTMLHeadingElement> & React_2.RefAttributes<HTMLHeadingElement>>;

declare const cardVariants: (props?: ({
    variant?: "with-image" | "without-image" | null | undefined;
    backgroundColor?: "gray" | "dark-gray" | "blue" | "yellow" | "green" | "red" | "azure" | "custom" | "transparent" | "white" | "black" | null | undefined;
    size?: "base" | "xs" | "sm" | "full" | "lg" | "xl" | null | undefined;
} & ClassProp) | undefined) => string;

declare const cardVariants_2: (props?: ({
    imageWidth?: "base" | "xs" | "sm" | "lg" | "xl" | "zero" | null | undefined;
} & ClassProp) | undefined) => string;

declare const cardVariants_3: (props?: ({
    vizWidth?: "base" | "xs" | "sm" | "full" | "lg" | "xl" | null | undefined;
} & ClassProp) | undefined) => string;

export declare const Carousel: default_2.ForwardRefExoticComponent<default_2.HTMLAttributes<HTMLDivElement> & default_2.RefAttributes<HTMLDivElement>>;

export declare const CarouselCard: default_2.ForwardRefExoticComponent<default_2.HTMLAttributes<HTMLDivElement> & VariantProps<(props?: ({
    size?: "base" | "xs" | "sm" | "full" | "lg" | "xl" | null | undefined;
} & ClassProp) | undefined) => string> & default_2.RefAttributes<HTMLDivElement>>;

export declare const Checkbox: default_2.ForwardRefExoticComponent<Omit<CheckboxPrimitive.CheckboxProps & default_2.RefAttributes<HTMLButtonElement>, "ref"> & VariantProps<(props?: ({
    color?: "blue" | "red" | "custom" | "black" | null | undefined;
    variant?: "light" | "normal" | null | undefined;
} & ClassProp) | undefined) => string> & {
    label?: string;
    labelClassName?: string;
    checkBoxClassName?: string;
    checkIconClassName?: string;
} & default_2.RefAttributes<HTMLButtonElement>>;

export declare const CheckboxGroup: default_2.ForwardRefExoticComponent<CheckboxGroupProps & default_2.RefAttributes<HTMLDivElement>>;

export declare const CheckboxGroupItem: default_2.ForwardRefExoticComponent<CheckboxGroupItemProps & default_2.RefAttributes<HTMLButtonElement>>;

declare interface CheckboxGroupItemProps extends Omit<default_2.ComponentPropsWithoutRef<typeof CheckboxPrimitive.Root>, 'value'> {
    label?: string;
    labelClassName?: string;
    checkBoxClassName?: string;
    checkIconClassName?: string;
    value: string;
}

declare interface CheckboxGroupProps extends Omit<default_2.HTMLAttributes<HTMLDivElement>, 'onValueChange'> {
    defaultValue?: string[];
    value?: string[];
    onValueChange?: (value: string[]) => void;
    color?: 'blue' | 'red' | 'black' | 'custom' | undefined;
    variant?: 'light' | 'normal' | undefined;
}

export declare function Cite({ children, className, marginBottom, ...props }: HeadingProps & VariantProps<typeof headingVariant>): JSX.Element;

export declare function cn(...inputs: ClassValue[]): string;

export declare function Code({ children, className, ...props }: HeadingProps): JSX.Element;

export declare const Container: default_2.ForwardRefExoticComponent<default_2.HTMLAttributes<HTMLDivElement> & VariantProps<(props?: ({
    backgroundColor?: "gray" | "dark-gray" | "blue" | "yellow" | "green" | "red" | "azure" | "custom" | "transparent" | "white" | "black" | null | undefined;
    layout?: "default" | "flex" | null | undefined;
    width?: "base" | "xs" | "sm" | "full" | "lg" | "xl" | null | undefined;
    padding?: "base" | "none" | "xs" | "sm" | "lg" | "xl" | "2xs" | "2xl" | "3xl" | null | undefined;
    gap?: "base" | "none" | "xs" | "sm" | "lg" | "xl" | "2xs" | "2xl" | "3xl" | null | undefined;
} & ClassProp) | undefined) => string> & default_2.RefAttributes<HTMLDivElement>>;

export { createFilter }

export declare const DropdownMenu: default_2.FC<DropdownMenuPrimitive.DropdownMenuProps>;

export declare const DropdownMenuContent: default_2.ForwardRefExoticComponent<Omit<DropdownMenuPrimitive.DropdownMenuContentProps & default_2.RefAttributes<HTMLDivElement>, "ref"> & default_2.RefAttributes<HTMLDivElement>>;

export declare const DropdownMenuGroup: default_2.ForwardRefExoticComponent<DropdownMenuPrimitive.DropdownMenuGroupProps & default_2.RefAttributes<HTMLDivElement>>;

export declare const DropdownMenuItem: default_2.ForwardRefExoticComponent<Omit<DropdownMenuPrimitive.DropdownMenuItemProps & default_2.RefAttributes<HTMLDivElement>, "ref"> & {
    inset?: boolean;
} & default_2.RefAttributes<HTMLDivElement>>;

export declare const DropdownMenuLabel: default_2.ForwardRefExoticComponent<Omit<DropdownMenuPrimitive.DropdownMenuLabelProps & default_2.RefAttributes<HTMLDivElement>, "ref"> & {
    inset?: boolean;
} & default_2.RefAttributes<HTMLDivElement>>;

export declare const DropdownMenuPortal: default_2.FC<DropdownMenuPrimitive.DropdownMenuPortalProps>;

export declare const DropdownMenuSeparator: default_2.ForwardRefExoticComponent<Omit<DropdownMenuPrimitive.DropdownMenuSeparatorProps & default_2.RefAttributes<HTMLDivElement>, "ref"> & default_2.RefAttributes<HTMLDivElement>>;

export declare const DropdownMenuSub: default_2.FC<DropdownMenuPrimitive.DropdownMenuSubProps>;

export declare const DropdownMenuSubContent: default_2.ForwardRefExoticComponent<Omit<DropdownMenuPrimitive.DropdownMenuSubContentProps & default_2.RefAttributes<HTMLDivElement>, "ref"> & default_2.RefAttributes<HTMLDivElement>>;

export declare const DropdownMenuSubTrigger: default_2.ForwardRefExoticComponent<Omit<DropdownMenuPrimitive.DropdownMenuSubTriggerProps & default_2.RefAttributes<HTMLDivElement>, "ref"> & {
    inset?: boolean;
} & default_2.RefAttributes<HTMLDivElement>>;

export declare const DropdownMenuTrigger: default_2.ForwardRefExoticComponent<Omit<DropdownMenuPrimitive.DropdownMenuTriggerProps & default_2.RefAttributes<HTMLButtonElement>, "ref"> & default_2.RefAttributes<HTMLButtonElement>>;

export declare function DropdownSelect({ className, variant, size, truncateLabel, placeholder, maxTagCount, isDisabled, ...props }: SelectPropsDataType): JSX.Element;

export declare function FileUpload({ onFileChange, children, ...props }: Props_2): JSX.Element;

export declare function Footer({ className, children, ...props }: FooterProps): JSX.Element;

export declare function FooterCopyrightUnit({ className, children, ...props }: FooterCopyrightUnitProps): JSX.Element;

declare interface FooterCopyrightUnitProps extends default_2.HTMLAttributes<HTMLElement> {
    children?: default_2.ReactNode;
    className?: string;
}

export declare function FooterLogoUnit({ className, link, children, ...props }: FooterLogoUnitProps): JSX.Element;

declare interface FooterLogoUnitProps extends default_2.HTMLAttributes<HTMLElement> {
    className?: string;
    link?: string;
    children?: default_2.ReactNode;
}

export declare function FooterMainNavUnit({ className, children, ...props }: FooterMainNavUnitProps): JSX.Element;

declare interface FooterMainNavUnitProps extends default_2.HTMLAttributes<HTMLElement> {
    children?: default_2.ReactNode;
    className?: string;
}

declare interface FooterProps extends default_2.HTMLAttributes<HTMLElement> {
    className?: string;
    children?: default_2.ReactNode;
}

export declare function H1({ children, className, marginBottom, size, ...props }: HeadingProps & VariantProps<typeof heading1Variant>): JSX.Element;

export declare function H2({ children, className, marginBottom, ...props }: HeadingProps & VariantProps<typeof headingVariant>): JSX.Element;

export declare function H3({ children, className, marginBottom, ...props }: HeadingProps & VariantProps<typeof headingVariant>): JSX.Element;

export declare function H4({ children, className, marginBottom, ...props }: HeadingProps & VariantProps<typeof headingVariant>): JSX.Element;

export declare function H5({ children, className, marginBottom, ...props }: HeadingProps & VariantProps<typeof headingVariant>): JSX.Element;

export declare function H6({ children, className, marginBottom, ...props }: HeadingProps & VariantProps<typeof headingVariant>): JSX.Element;

export declare function Header({ className, children, ...props }: HeaderProps): JSX.Element;

export declare function HeaderActions({ className, children, ...props }: HeaderActionsProps): JSX.Element;

declare interface HeaderActionsProps extends default_2.HTMLAttributes<HTMLElement> {
    children?: default_2.ReactNode;
    className?: string;
}

export declare function HeaderLogoUnit({ className, siteName, siteSubName, hyperlink, ...props }: HeaderLogoUnitProps): JSX.Element;

declare interface HeaderLogoUnitProps extends default_2.HTMLAttributes<HTMLElement> {
    className?: string;
    siteSubName?: string;
    siteName: string;
    hyperlink?: string;
}

export declare function HeaderMainNavUnit({ className, children, ...props }: HeaderMainNavUnitProps): JSX.Element;

declare interface HeaderMainNavUnitProps extends default_2.HTMLAttributes<HTMLElement> {
    children?: default_2.ReactNode;
    className?: string;
}

export declare function HeaderMenuUnit({ className, children, ...props }: HeaderMenuUnitProps): JSX.Element;

declare interface HeaderMenuUnitProps extends default_2.HTMLAttributes<HTMLElement> {
    children?: default_2.ReactNode;
    className?: string;
}

declare interface HeaderProps extends default_2.HTMLAttributes<HTMLElement> {
    className?: string;
    children?: default_2.ReactNode;
}

declare const heading1Variant: (props?: ({
    marginBottom?: "base" | "none" | "xs" | "sm" | "lg" | "xl" | "2xs" | "base-responsive" | null | undefined;
    size?: "base" | "sm" | null | undefined;
} & ClassProp) | undefined) => string;

declare interface HeadingProps extends default_2.HTMLAttributes<HTMLHeadingElement> {
    className?: string;
}

declare const headingVariant: (props?: ({
    marginBottom?: "base" | "none" | "xs" | "sm" | "lg" | "xl" | "2xs" | "base-responsive" | null | undefined;
} & ClassProp) | undefined) => string;

export declare const HoverCard: default_2.FC<HoverCardPrimitive.HoverCardProps>;

export declare const HoverCardContent: default_2.ForwardRefExoticComponent<Omit<HoverCardPrimitive.HoverCardContentProps & default_2.RefAttributes<HTMLDivElement>, "ref"> & default_2.RefAttributes<HTMLDivElement>>;

export declare const HoverCardTrigger: default_2.ForwardRefExoticComponent<Omit<HoverCardPrimitive.HoverCardTriggerProps & default_2.RefAttributes<HTMLAnchorElement>, "ref"> & default_2.RefAttributes<HTMLAnchorElement>>;

export declare const Input: default_2.ForwardRefExoticComponent<default_2.InputHTMLAttributes<HTMLInputElement> & VariantProps<(props?: ({
    variant?: "light" | "normal" | null | undefined;
    inputSize?: "base" | "sm" | null | undefined;
} & ClassProp) | undefined) => string> & default_2.RefAttributes<HTMLInputElement>>;

export declare const Label: default_2.ForwardRefExoticComponent<Omit<LabelPrimitive.LabelProps & default_2.RefAttributes<HTMLLabelElement>, "ref"> & default_2.RefAttributes<HTMLLabelElement>>;

export declare function LanguageSwitcher(props: LanguageSwitcherProps): JSX.Element;

declare interface LanguageSwitcherProps {
    options: {
        label: string;
        id: string;
    }[];
    defaultValue: string;
    value?: string;
    onValueChange?: (_d: string) => void;
}

export declare const Li: default_2.ForwardRefExoticComponent<Omit<default_2.DetailedHTMLProps<default_2.LiHTMLAttributes<HTMLLIElement>, HTMLLIElement>, "ref"> & default_2.RefAttributes<HTMLLIElement>>;

declare interface LinkProps extends default_2.AnchorHTMLAttributes<HTMLAnchorElement> {
    className?: string;
}

declare const loaderVariants: (props?: ({
    variant?: "blue" | "red" | "custom" | "black" | null | undefined;
    size?: "base" | "sm" | "lg" | null | undefined;
} & ClassProp) | undefined) => string;

export declare function MarkdownRenderer({ classNames, text, components }: Props_4): JSX.Element;

export declare function Modal(props: ModalProps): JSX.Element;

declare interface ModalProps {
    title?: string;
    description?: string;
    children?: default_2.ReactNode;
    footer?: default_2.ReactNode;
    open?: boolean;
    onClose?: () => void;
    className?: string;
    showCloseButton?: boolean;
    titleClassName?: string;
    footerClassName?: string;
    descriptionClassName?: string;
}

export declare const Ol: default_2.ForwardRefExoticComponent<Omit<default_2.DetailedHTMLProps<default_2.OlHTMLAttributes<HTMLOListElement>, HTMLOListElement>, "ref"> & default_2.RefAttributes<HTMLOListElement>>;

declare interface OptionDataType {
    label: React.ReactNode;
    value: string;
}

export declare function P({ children, className, size, leading, marginBottom, ...props }: ParagraphProps & VariantProps<typeof paragraphVariant>): JSX.Element;

export declare const PageHeader: React_2.ForwardRefExoticComponent<PageHeaderProps & React_2.RefAttributes<HTMLDivElement>>;

export declare const PageHeaderContent: React_2.ForwardRefExoticComponent<React_2.HTMLAttributes<HTMLDivElement> & React_2.RefAttributes<HTMLDivElement>>;

export declare const PageHeaderHead: React_2.ForwardRefExoticComponent<React_2.HTMLAttributes<HTMLDivElement> & React_2.RefAttributes<HTMLDivElement>>;

declare interface PageHeaderProps extends React_2.HTMLAttributes<HTMLDivElement> {
    backgroundImage?: string;
    minHeight?: boolean;
    contentMode?: 'light' | 'dark';
}

export declare const PageWideCard: React_2.ForwardRefExoticComponent<CardProps_2 & React_2.RefAttributes<HTMLDivElement>>;

export declare const PageWideCardContainer: React_2.ForwardRefExoticComponent<CardProps_2 & React_2.RefAttributes<HTMLDivElement>>;

export declare const PageWideCardContent: React_2.ForwardRefExoticComponent<CardProps_2 & React_2.RefAttributes<HTMLDivElement>>;

export declare const PageWideCardDescription: React_2.ForwardRefExoticComponent<React_2.HTMLAttributes<HTMLHeadingElement> & React_2.RefAttributes<HTMLHeadingElement>>;

export declare const PageWideCardFooter: React_2.ForwardRefExoticComponent<React_2.HTMLAttributes<HTMLDivElement> & React_2.RefAttributes<HTMLDivElement>>;

export declare const PageWideCardHeader: React_2.ForwardRefExoticComponent<CardProps_2 & React_2.RefAttributes<HTMLDivElement>>;

export declare const PageWideCardImage: React_2.ForwardRefExoticComponent<PageWideCardImageProps & React_2.RefAttributes<HTMLImageElement>>;

declare interface PageWideCardImageProps extends React_2.HTMLAttributes<HTMLImageElement> {
    src: string;
    alt?: string;
}

export declare const PageWideCardTag: React_2.ForwardRefExoticComponent<React_2.HTMLAttributes<HTMLHeadingElement> & React_2.RefAttributes<HTMLHeadingElement>>;

export declare const PageWideCardTitle: React_2.ForwardRefExoticComponent<React_2.HTMLAttributes<HTMLHeadingElement> & React_2.RefAttributes<HTMLHeadingElement>>;

export declare function Pagination(props: PaginationProps): JSX.Element;

declare interface PaginationProps {
    defaultPage?: number;
    total: number;
    pageSize: number;
    onChange: (page: number) => void;
    className?: string;
}

declare interface ParagraphProps extends default_2.HTMLAttributes<HTMLParagraphElement> {
    className?: string;
}

declare const paragraphVariant: (props?: ({
    size?: "base" | "xs" | "sm" | "lg" | "xl" | "base-responsive" | null | undefined;
    leading?: "base" | "none" | "xs" | "sm" | "lg" | "xl" | null | undefined;
    marginBottom?: "base" | "none" | "xs" | "sm" | "lg" | "xl" | "2xs" | "3xs" | null | undefined;
} & ClassProp) | undefined) => string;

export declare const Popover: default_2.FC<PopoverPrimitive.PopoverProps>;

export declare const PopoverAnchor: default_2.ForwardRefExoticComponent<PopoverPrimitive.PopoverAnchorProps & default_2.RefAttributes<HTMLDivElement>>;

export declare const PopoverContent: default_2.ForwardRefExoticComponent<Omit<PopoverPrimitive.PopoverContentProps & default_2.RefAttributes<HTMLDivElement>, "ref"> & default_2.RefAttributes<HTMLDivElement>>;

export declare const PopoverTrigger: default_2.ForwardRefExoticComponent<PopoverPrimitive.PopoverTriggerProps & default_2.RefAttributes<HTMLButtonElement>>;

declare interface Props_2 extends default_2.InputHTMLAttributes<HTMLInputElement> {
    onFileChange?: (_d: File[]) => void;
}

declare interface Props_3 {
    variant?: 'blue' | 'white';
    width?: number;
    className?: string;
}

declare interface Props_4 {
    classNames?: {
        h1?: string;
        h2?: string;
        h3?: string;
        h4?: string;
        h5?: string;
        h6?: string;
        cite?: string;
        code?: string;
        blockquote?: string;
        p?: string;
        a?: string;
        ul?: string;
        ol?: string;
        li?: string;
        hr?: string;
        pre?: string;
        table?: string;
        thead?: string;
        td?: string;
        tr?: string;
        tbody?: string;
        th?: string;
    };
    components?: Components;
    text?: string;
}

declare interface Props_5 extends default_2.HTMLAttributes<HTMLDivElement> {
    sdgList?: number[];
    barClassName?: string;
}

declare interface Props_6 {
    sdg: '1' | '2' | '3' | '4' | '5' | '6' | '7' | '8' | '9' | '10' | '11' | '12' | '13' | '14' | '15' | '16' | '17' | 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17;
    size?: number;
    background: boolean;
}

declare interface Props_7 {
    options: OptionDataType[];
    defaultValue?: string;
    value?: string;
    onValueChange?: (d: string) => void;
    className?: string;
    buttonClassName?: string;
    activeButtonClassName?: string;
    size?: 'sm' | 'base';
    variant?: 'light' | 'normal';
    color?: 'blue' | 'red' | 'black' | 'custom';
}

export declare const RadioGroup: default_2.ForwardRefExoticComponent<Omit<RadioGroupPrimitive.RadioGroupProps & default_2.RefAttributes<HTMLDivElement>, "ref"> & {
    color?: "blue" | "red" | "black" | "custom" | null | undefined;
    variant?: "light" | "normal" | null | undefined;
} & default_2.RefAttributes<HTMLDivElement>>;

export declare const RadioGroupItem: default_2.ForwardRefExoticComponent<Omit<RadioGroupPrimitive.RadioGroupItemProps & default_2.RefAttributes<HTMLButtonElement>, "ref"> & {
    label: string;
    radioClassName?: string;
    labelClassName?: string;
} & default_2.RefAttributes<HTMLButtonElement>>;

export declare function SdgBorder({ sdgList, barClassName, ...props }: Props_5): JSX.Element;

export declare function SDGIcons(props: Props_6): JSX.Element;

export declare const Search: default_2.ForwardRefExoticComponent<Omit<default_2.ClassAttributes<HTMLInputElement> & default_2.InputHTMLAttributes<HTMLInputElement> & {
    inputVariant?: "light" | "normal";
    inputClassName?: string;
    buttonClassName?: string;
    buttonVariant?: "tertiary" | "icon";
    showSearchButton?: boolean;
    searchOnlyOnClick?: boolean;
    buttonChildren?: default_2.ReactNode;
    inputSize?: "sm" | "base";
    onSearch?: (d?: string) => void;
}, "ref"> & default_2.RefAttributes<HTMLInputElement>>;

export declare function SegmentedControl(props: Props_7): JSX.Element;

declare interface SelectPropsDataType extends Props {
    truncateLabel?: boolean;
    variant?: 'light' | 'normal';
    size?: 'sm' | 'base';
    maxTagCount?: number;
}

export declare const Separator: default_2.ForwardRefExoticComponent<Omit<SeparatorPrimitive.SeparatorProps & default_2.RefAttributes<HTMLDivElement>, "ref"> & {
    variant?: "dark" | "light";
} & default_2.RefAttributes<HTMLDivElement>>;

export declare const Sidebar: default_2.ForwardRefExoticComponent<SidebarProps & default_2.RefAttributes<HTMLDivElement>>;

export declare const SidebarItem: default_2.ForwardRefExoticComponent<SidebarItemProps & default_2.RefAttributes<HTMLDivElement>>;

declare interface SidebarItemProps extends default_2.HTMLAttributes<HTMLDivElement> {
    value?: string;
}

declare interface SidebarProps extends Omit<default_2.HTMLAttributes<HTMLDivElement>, 'onChange'>, VariantProps<typeof sidebarVariants> {
    defaultValue?: string;
    activeValue?: string;
    activeItemClass?: string;
    hoverItemClass?: string;
    onValueChange?: (value: string) => void;
}

declare const sidebarVariants: (props?: ({
    variant?: "border" | "background" | "noEffect" | null | undefined;
} & ClassProp) | undefined) => string;

declare interface SliderProps extends default_2.ComponentPropsWithoutRef<typeof default_3> {
    trackClassName?: string;
    className?: string;
    sliderClassName?: string;
    railClassName?: string;
    handleClassName?: string;
    showHandleValue?: boolean;
    variant?: 'blue' | 'red' | 'black' | 'custom' | null | undefined;
}

export declare function SliderUI(sliderProps: SliderProps): JSX.Element;

export declare const Spacer: default_2.ForwardRefExoticComponent<default_2.HTMLAttributes<HTMLDivElement> & VariantProps<(props?: ({
    size?: "base" | "xs" | "sm" | "lg" | "xl" | "2xl" | "3xl" | "4xl" | "5xl" | "6xl" | "7xl" | "8xl" | "9xl" | null | undefined;
} & ClassProp) | undefined) => string> & default_2.RefAttributes<HTMLDivElement>>;

export declare function Spinner({ size, variant, show, children, className }: SpinnerContentProps): JSX.Element;

declare interface SpinnerContentProps extends VariantProps<typeof loaderVariants> {
    show?: boolean;
    className?: string;
    variant?: 'blue' | 'red' | 'black' | 'custom' | null | undefined;
    size?: 'sm' | 'base' | 'lg';
    children?: default_2.ReactNode;
}

export declare function Stepper({ className, steps, currentStep, unfinishedStepsClassName, finishedStepsClassName, activeStepsClassName, ...props }: StepperProps): JSX.Element;

declare interface StepperProps extends default_2.HTMLAttributes<HTMLOListElement> {
    className?: string;
    unfinishedStepsClassName?: string;
    finishedStepsClassName?: string;
    activeStepsClassName?: string;
    steps: {
        title: string;
        description?: string;
    }[];
    currentStep?: number;
}

export declare const Switch: default_2.ForwardRefExoticComponent<Omit<SwitchPrimitives.SwitchProps & default_2.RefAttributes<HTMLButtonElement>, "ref"> & VariantProps<(props?: ({
    color?: "blue" | "red" | "custom" | "black" | null | undefined;
    size?: "small" | "normal" | null | undefined;
} & ClassProp) | undefined) => string> & {
    showValue?: boolean;
    showIcon?: boolean;
    values?: [string, string];
} & default_2.RefAttributes<HTMLButtonElement>>;

export declare function Table({ className, ...props }: React_2.ComponentProps<'table'>): JSX.Element;

export declare function TableBody({ className, ...props }: React_2.ComponentProps<'tbody'>): JSX.Element;

export declare function TableCaption({ className, ...props }: React_2.ComponentProps<'caption'>): JSX.Element;

export declare function TableCell({ className, ...props }: React_2.ComponentProps<'td'>): JSX.Element;

export declare function TableHead({ className, ...props }: React_2.ComponentProps<'th'>): JSX.Element;

export declare function TableHeader({ className, ...props }: React_2.ComponentProps<'thead'>): JSX.Element;

export declare function TableRow({ className, ...props }: React_2.ComponentProps<'tr'>): JSX.Element;

export declare const Tabs: default_2.ForwardRefExoticComponent<Omit<TabsPrimitive.TabsProps & default_2.RefAttributes<HTMLDivElement>, "ref"> & {
    color: "blue" | "red" | "black" | "custom" | undefined;
} & default_2.RefAttributes<HTMLDivElement>>;

export declare const TabsContent: default_2.ForwardRefExoticComponent<Omit<TabsPrimitive.TabsContentProps & default_2.RefAttributes<HTMLDivElement>, "ref"> & default_2.RefAttributes<HTMLDivElement>>;

export declare const TabsList: default_2.ForwardRefExoticComponent<Omit<TabsPrimitive.TabsListProps & default_2.RefAttributes<HTMLDivElement>, "ref"> & default_2.RefAttributes<HTMLDivElement>>;

export declare const TabsTrigger: default_2.ForwardRefExoticComponent<Omit<TabsPrimitive.TabsTriggerProps & default_2.RefAttributes<HTMLButtonElement>, "ref"> & default_2.RefAttributes<HTMLButtonElement>>;

export declare const Textarea: default_2.ForwardRefExoticComponent<default_2.TextareaHTMLAttributes<HTMLTextAreaElement> & VariantProps<(props?: ({
    variant?: "light" | "normal" | null | undefined;
} & ClassProp) | undefined) => string> & default_2.RefAttributes<HTMLTextAreaElement>>;

declare type Toast = Omit<ToasterToast, 'id'>;

export declare function toast({ ...props }: Toast): {
    id: string;
    dismiss: () => void;
    update: (props: ToasterToast) => void;
};

declare const Toast_2: default_2.ForwardRefExoticComponent<Omit<ToastPrimitives.ToastProps & default_2.RefAttributes<HTMLLIElement>, "ref"> & VariantProps<(props?: ({
    variant?: "default" | "success" | "warning" | "destructive" | null | undefined;
} & ClassProp) | undefined) => string> & default_2.RefAttributes<HTMLLIElement>>;

declare const ToastAction: default_2.ForwardRefExoticComponent<Omit<ToastPrimitives.ToastActionProps & default_2.RefAttributes<HTMLButtonElement>, "ref"> & default_2.RefAttributes<HTMLButtonElement>>;

declare type ToastActionElement = default_2.ReactElement<typeof ToastAction>;

export declare function Toaster(): JSX.Element;

declare type ToasterToast = ToastProps & {
    id: string;
    title?: default_2.ReactNode;
    description?: default_2.ReactNode;
    action?: ToastActionElement;
};

declare type ToastProps = default_2.ComponentPropsWithoutRef<typeof Toast_2>;

export declare const Tooltip: default_2.FC<TooltipPrimitive.TooltipProps>;

export declare const TooltipContent: default_2.ForwardRefExoticComponent<Omit<TooltipPrimitive.TooltipContentProps & default_2.RefAttributes<HTMLDivElement>, "ref"> & default_2.RefAttributes<HTMLDivElement>>;

export declare const TooltipProvider: default_2.FC<TooltipPrimitive.TooltipProviderProps>;

export declare const TooltipTrigger: default_2.ForwardRefExoticComponent<TooltipPrimitive.TooltipTriggerProps & default_2.RefAttributes<HTMLButtonElement>>;

export declare const Ul: default_2.ForwardRefExoticComponent<Omit<default_2.DetailedHTMLProps<default_2.HTMLAttributes<HTMLUListElement>, HTMLUListElement>, "ref"> & default_2.RefAttributes<HTMLUListElement>>;

export declare function UNDPLogo(props: Props_3): JSX.Element;

export declare function useToast(): {
    toast: typeof toast;
    dismiss: (toastId?: string) => void;
    toasts: ToasterToast[];
};

export declare const VisualizationWidget: default_2.ForwardRefExoticComponent<default_2.HTMLAttributes<HTMLDivElement> & default_2.RefAttributes<HTMLDivElement>>;

export declare const VisualizationWidgetBody: default_2.ForwardRefExoticComponent<default_2.HTMLAttributes<HTMLDivElement> & default_2.RefAttributes<HTMLDivElement>>;

export declare const VisualizationWidgetBodyContent: default_2.ForwardRefExoticComponent<default_2.HTMLAttributes<HTMLDivElement> & default_2.RefAttributes<HTMLDivElement>>;

export declare const VisualizationWidgetBodySidebar: default_2.ForwardRefExoticComponent<default_2.HTMLAttributes<HTMLDivElement> & default_2.RefAttributes<HTMLDivElement>>;

export declare const VisualizationWidgetHeader: default_2.ForwardRefExoticComponent<VisualizationWidgetHeaderProps & default_2.RefAttributes<HTMLDivElement>>;

export declare const VisualizationWidgetHeaderItem: default_2.ForwardRefExoticComponent<VisualizationWidgetHeaderItemProps & default_2.RefAttributes<HTMLButtonElement>>;

declare interface VisualizationWidgetHeaderItemProps extends default_2.ButtonHTMLAttributes<HTMLButtonElement> {
    value: string;
}

declare interface VisualizationWidgetHeaderProps extends Omit<default_2.HTMLAttributes<HTMLDivElement>, 'onChange'> {
    defaultValue?: string;
    activeItemClass?: string;
    hoverItemClass?: string;
    onChange?: (value: string) => void;
}

export declare const VizCarousel: default_2.ForwardRefExoticComponent<CardProps_3 & default_2.RefAttributes<HTMLDivElement>>;

export { }