@mahatisystems/mahati-ui-components 5.1.0 → 5.2.0

package/dist/index.d.ts

@@ -0,0 +1,877 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import * as React from 'react';
+import React__default from 'react';
+import { ChartData } from 'chart.js';
+
+interface AccordionProps {
+    title: string;
+    children?: React__default.ReactNode;
+    defaultOpen?: boolean;
+    accordionTestId?: string;
+    headerTestId?: string;
+    contentTestId?: string;
+}
+declare function Accordion({ title, children, defaultOpen, accordionTestId, headerTestId, contentTestId, }: AccordionProps): react_jsx_runtime.JSX.Element;
+declare namespace Accordion {
+    var displayName: string;
+}
+
+interface IconButtonGroupProps extends React__default.HTMLAttributes<HTMLDivElement> {
+    direction?: "row" | "col";
+    gapClass?: string;
+}
+declare const IconButtonGroup: React__default.ForwardRefExoticComponent<IconButtonGroupProps & React__default.RefAttributes<HTMLDivElement>>;
+declare const ButtonBase: any;
+type ButtonWithGroup = typeof ButtonBase & {
+    IconButtonGroup: typeof IconButtonGroup;
+};
+declare const Button: ButtonWithGroup;
+
+declare const Card: any;
+
+type MahatiModalSize = "default" | "sm" | "md" | "lg" | "xl";
+type MahatiModalProps = {
+    isOpen: boolean;
+    testId?: string;
+    onOpenChange?: (open: boolean) => void;
+    onClose: () => void;
+    title?: string;
+    subtitle?: string;
+    size?: MahatiModalSize;
+    children?: React.ReactNode;
+    className?: string;
+    width?: string | number;
+    height?: string | number;
+    margin?: string | number;
+    position?: "center" | "top-left" | "top-right" | "top-center" | "bottom-left" | "bottom-right" | "bottom-center" | "center-left" | "center-right";
+    primaryAction?: {
+        label?: React.ReactNode;
+        onClick?: () => void;
+        disabled?: boolean;
+    };
+    secondaryAction?: {
+        label?: React.ReactNode;
+        onClick?: () => void;
+    };
+    headerIcon?: React.ReactNode;
+    showDivider?: boolean;
+};
+declare function Modal({ testId, isOpen, onClose, title, subtitle, children, className, width: customWidth, height, margin, primaryAction, secondaryAction, headerIcon, showDivider, position, size, }: MahatiModalProps): react_jsx_runtime.JSX.Element | null;
+declare namespace Modal {
+    var displayName: string;
+}
+
+interface FormContainerProps {
+    children: React__default.ReactNode;
+    onSubmit?: (e: React__default.FormEvent) => void;
+    className?: string;
+    style?: React__default.CSSProperties;
+    testId?: string;
+}
+declare const FormContainer: {
+    ({ children, onSubmit, style, testId, className, }: FormContainerProps): react_jsx_runtime.JSX.Element;
+    displayName: string;
+};
+
+declare const Input: any;
+
+interface CalendarDate {
+    year: number;
+    month: number;
+    day: number;
+}
+interface CalendarTime {
+    hour: number;
+    minute: number;
+    period: "AM" | "PM";
+}
+interface CalendarDateRange {
+    start: CalendarDate | null;
+    end: CalendarDate | null;
+}
+type CalendarSize = "small" | "medium" | "large" | "extra-large";
+interface CalendarProps {
+    calendartestId?: string;
+    value?: CalendarDate | null;
+    onChange?: (date: CalendarDate | null, dateString?: string) => void;
+    enableRangeSelection?: boolean;
+    rangeValue?: CalendarDateRange;
+    previewTextStyles?: React__default.CSSProperties;
+    globalTypography?: React__default.CSSProperties;
+    onRangeChange?: (range: CalendarDateRange) => void;
+    enableTimeSelection?: boolean;
+    timeValue?: CalendarTime | null;
+    onTimeChange?: (time: CalendarTime) => void;
+    showTimeFormatToggle?: boolean;
+    timeFormat?: "12h" | "24h";
+    onTimeFormatChange?: (format: "12h" | "24h") => void;
+    autoHide?: boolean;
+    showTodayButton?: boolean;
+    showClearButton?: boolean;
+    placeholder?: string;
+    className?: string;
+    disabled?: boolean;
+    onShow?: () => void;
+    onHide?: () => void;
+    icon?: React__default.ReactNode;
+    showIcon?: boolean;
+    size?: CalendarSize;
+    enableYearDropdown?: boolean;
+    showDateFormatSelector?: boolean;
+    dateFormat?: string;
+    onDateFormatChange?: (format: string) => void;
+    showTimeZoneSelector?: boolean;
+    timeZoneFormat?: string;
+    onTimeZoneFormatChange?: (format: string) => void;
+    blockDateConfig?: {
+        startDate: CalendarDate;
+        days: number;
+    };
+}
+declare const Calendar: {
+    ({ calendartestId, value, onChange, enableRangeSelection, rangeValue, onRangeChange, enableTimeSelection, timeValue, onTimeChange, showTimeFormatToggle, timeFormat, onTimeFormatChange, autoHide, showTodayButton, showClearButton, placeholder, className, disabled, onShow, onHide, icon, showIcon, size, enableYearDropdown, showDateFormatSelector, dateFormat, onDateFormatChange, showTimeZoneSelector, timeZoneFormat, onTimeZoneFormatChange, blockDateConfig, previewTextStyles, globalTypography }: CalendarProps): react_jsx_runtime.JSX.Element;
+    displayName: string;
+};
+
+type FilterValues = {
+    date: CalendarDateRange;
+    activity: string;
+    status: string;
+    keyword: string;
+};
+type FieldSize = "small" | "medium";
+interface SelectOption {
+    label: string;
+    value: string | number;
+}
+interface MahatiActivityProps {
+    value: string | number;
+    onChange: (v: string | number) => void;
+    options?: SelectOption[];
+    size?: FieldSize;
+    testId?: string;
+}
+interface MahatiStatusProps {
+    value: string | number;
+    onChange: (v: string | number) => void;
+    options?: SelectOption[];
+    size?: FieldSize;
+    testId?: string;
+}
+interface MahatiSearchProps {
+    value: string;
+    onChange: (v: string) => void;
+    placeholder?: string;
+    size?: FieldSize;
+    testId?: string;
+}
+declare const DEFAULT_ACTIVITY_OPTIONS: SelectOption[];
+declare const DEFAULT_STATUS_OPTIONS: SelectOption[];
+interface FilterProps {
+    onApply?: (filters: FilterValues) => void;
+    onReset?: () => void;
+    activityOptions?: SelectOption[];
+    statusOptions?: SelectOption[];
+    searchPlaceholder?: string;
+    testId?: string;
+}
+declare const Filter$1: {
+    ({ onApply, onReset, activityOptions, statusOptions, searchPlaceholder, testId, }: FilterProps): react_jsx_runtime.JSX.Element;
+    displayName: string;
+};
+/** ================= MAHATI ACTIVITY ================= */
+declare const MahatiActivity: {
+    ({ value, onChange, options, size, testId, }: MahatiActivityProps): react_jsx_runtime.JSX.Element;
+    displayName: string;
+};
+/** ================= MAHATI STATUS ================= */
+declare const MahatiStatus: {
+    ({ value, onChange, options, size, testId, }: MahatiStatusProps): react_jsx_runtime.JSX.Element;
+    displayName: string;
+};
+/** ================= MAHATI SEARCH ================= */
+declare const MahatiSearch: {
+    ({ value, onChange, placeholder, size, testId, }: MahatiSearchProps): react_jsx_runtime.JSX.Element;
+    displayName: string;
+};
+
+interface Tab {
+    label: string;
+    content: React__default.ReactNode;
+    icon?: React__default.ReactNode;
+}
+interface TabbedInterfaceProps {
+    tabs: Tab[];
+    variant?: "underline" | "pill" | "outline" | "filled" | "gradient" | "shadow" | "glass" | "dark";
+    testId?: string;
+    defaultActiveTab?: number;
+    onTabChange?: (index: number) => void;
+    draggableTabs?: boolean;
+    onReorderTabs?: (fromIndex: number, toIndex: number) => void;
+    orientation?: "horizontal" | "vertical";
+    verticalPosition?: "left" | "right";
+    showTabCloseIconInHeader?: boolean;
+    tabCloseIconPosition?: "left" | "right";
+    tabCloseIconContent?: React__default.ReactNode;
+    onCloseTab?: (index: number) => void;
+    tabHeaderFont?: string;
+    tabContentFont?: string;
+    sectionTitleFont?: string;
+    sectionDescriptionFont?: string;
+}
+declare const TabbedInterface: {
+    ({ tabs, variant, defaultActiveTab, onTabChange, draggableTabs, onReorderTabs, orientation, verticalPosition, showTabCloseIconInHeader, tabCloseIconPosition, tabCloseIconContent, onCloseTab, tabHeaderFont, tabContentFont, sectionTitleFont, sectionDescriptionFont, testId }: TabbedInterfaceProps): any;
+    displayName: string;
+};
+
+interface DropdownOption {
+    key: string;
+    value: string | number;
+}
+interface DropdownProps {
+    options: DropdownOption[];
+    value?: string | number;
+    onSelect: (value: string | number) => void;
+    variant?: "basic" | "outline" | "pill" | "dark" | "underline" | "shadow" | "glass" | "gradient";
+    className?: string;
+    placeholder?: string;
+    disabled?: boolean;
+    testId?: string;
+}
+declare const Dropdown: {
+    ({ options, value, onSelect, variant, className, placeholder, disabled, testId }: DropdownProps): react_jsx_runtime.JSX.Element;
+    displayName: string;
+};
+
+interface TableProps {
+    headers: {
+        label: React__default.ReactNode;
+        key: string;
+    }[];
+    data: {
+        [key: string]: unknown;
+    }[];
+    tableTestId?: string;
+    page?: number;
+    setPage?: (page: number) => void;
+    limit?: number;
+    setLimit?: (limit: number) => void;
+    totalCount?: number;
+    paginationRequired?: boolean;
+    paginationPosition?: "top-left" | "top-center" | "top-right" | "bottom-left" | "bottom-center" | "bottom-right";
+    highlightRowColor?: string;
+    actions?: (row: unknown) => React__default.ReactNode;
+    onDownloadPDF?: (data: any[], headers: any[]) => void;
+    onDownloadExcel?: (data: any[], headers: any[]) => void;
+    searchable?: boolean;
+    searchTerm?: string;
+    onSearch?: (term: string, mode?: "startsWith" | "includes") => void;
+    searchModeOptions?: ("startsWith" | "includes")[];
+    onResetSearch?: () => void;
+    summary?: "single" | "multi";
+    summaryKey?: string;
+    summaryTitleField?: string;
+    summaryColumn?: boolean;
+    summaryColumnKey?: string;
+    summaryColumnMaxLength?: number;
+    textWrapColumns?: string[];
+    textWrapMaxLength?: number;
+    textWrapColumnMaxLengths?: Record<string, number>;
+}
+declare const Table: ({ headers, data, page, setPage, limit, setLimit, totalCount, highlightRowColor, actions, paginationRequired, paginationPosition, onDownloadPDF, onDownloadExcel, searchable, searchTerm, onResetSearch, onSearch, searchModeOptions, summary, summaryKey, summaryTitleField, summaryColumn, summaryColumnKey, summaryColumnMaxLength, textWrapColumns, textWrapMaxLength, textWrapColumnMaxLengths, tableTestId, }: TableProps) => react_jsx_runtime.JSX.Element;
+
+type BaseTableProps = React__default.ComponentProps<typeof Table>;
+type BaseTabProps = React__default.ComponentProps<typeof TabbedInterface>;
+type AllowedTabProps = Omit<BaseTabProps, "tabs" | "onTabChange" | "draggableTabs" | "onReorderTabs" | "onCloseTab">;
+interface TableWithTabProps<RowType extends Record<string, any>> {
+    tableProps: Pick<BaseTableProps, "headers" | "data">;
+    tabProps?: AllowedTabProps;
+    rearrange?: boolean;
+    getRowId?: (row: RowType, index: number) => string | number;
+    renderTabContent?: (row: RowType) => React__default.ReactNode;
+    onRowOpenInTab?: (row: RowType) => void;
+    title?: string;
+    description?: string;
+    testId?: string;
+    tabLabelKey?: string;
+    sectionTitleFont?: string;
+    sectionDescriptionFont?: string;
+}
+declare function TableWithTab<RowType extends Record<string, any>>({ tableProps, tabProps, rearrange, getRowId, renderTabContent, onRowOpenInTab, title, description, tabLabelKey, sectionTitleFont, sectionDescriptionFont, testId, }: TableWithTabProps<RowType>): react_jsx_runtime.JSX.Element;
+declare namespace TableWithTab {
+    var displayName: string;
+}
+
+interface LollipopData {
+    title: string;
+    [year: string]: any;
+}
+
+interface ColumnChartYAxisConfig {
+    min: number;
+    max: number;
+    step: number;
+    labels: number[];
+}
+interface ColumnChartData {
+    title: string;
+    yAxis?: Record<string, ColumnChartYAxisConfig>;
+    [year: string]: string | Record<string, any> | undefined;
+}
+
+interface KPIChartData {
+    title: string;
+    value: string;
+    change?: number;
+    timeLabel: string;
+    timePeriod: string;
+    data: number[];
+    labels?: string[];
+    timePeriods?: string[];
+    timestamps?: string[];
+}
+
+interface GroupBarLegendItem {
+    key: string;
+    label: string;
+    color: string;
+}
+interface GroupBarChartYAxisConfig {
+    min: number;
+    max: number;
+    step: number;
+    labels: number[];
+}
+interface GroupBarChartData {
+    title: string;
+    legends?: GroupBarLegendItem[];
+    yAxis?: Record<string, GroupBarChartYAxisConfig>;
+    [year: string]: string | Record<string, any> | undefined;
+}
+
+interface StackBarLegendItem {
+    key: string;
+    label: string;
+    color: string;
+}
+interface StackBarChartYAxisConfig {
+    min: number;
+    max: number;
+    step: number;
+    labels: number[];
+}
+interface StackBarChartData {
+    title: string;
+    legends?: StackBarLegendItem[];
+    yAxis?: Record<string, StackBarChartYAxisConfig>;
+    [year: string]: string | Record<string, any> | undefined;
+}
+
+interface BulletItem {
+    name: string;
+    achieved: number;
+    target: number;
+    marker: number;
+}
+interface BulletData {
+    title: string;
+    bullets: BulletItem[];
+}
+
+interface GaugeItem {
+    name: string;
+    value: number;
+    max: number;
+}
+interface GaugeData {
+    title: string;
+    gauges: GaugeItem[];
+    [key: string]: any;
+}
+
+interface HorizontalBarData {
+    title: string;
+    xAxis?: Record<string, {
+        min: number;
+        max: number;
+        step: number;
+        labels: number[];
+    }>;
+    [year: string]: string | Record<string, any> | undefined;
+}
+
+declare const GANTT_COLORS: {
+    readonly green: "rgba(44, 160, 44, 1)";
+    readonly blue: "rgba(37, 99, 235, 1)";
+    readonly orange: "rgba(255, 127, 14, 1)";
+    readonly red: "rgba(239, 68, 68, 1)";
+    readonly purple: "rgba(147, 51, 234, 1)";
+    readonly teal: "rgba(20, 184, 166, 1)";
+    readonly pink: "rgba(236, 72, 153, 1)";
+    readonly yellow: "rgba(234, 179, 8, 1)";
+    readonly indigo: "rgba(99, 102, 241, 1)";
+    readonly emerald: "rgba(16, 185, 129, 1)";
+};
+interface GanttTask {
+    id: string;
+    name: string;
+    startDate: string;
+    endDate: string;
+    progress: number;
+    status: "In Progress" | "On Target" | "Overdue" | "Completed";
+    color: keyof typeof GANTT_COLORS;
+}
+interface GanttData {
+    title: string;
+    projectName: string;
+    tasks: GanttTask[];
+}
+
+interface HeatmapDayData {
+    date: string;
+    value: number;
+    label?: string;
+}
+interface HeatmapData {
+    year: number;
+    month: string;
+    data: HeatmapDayData[];
+    project?: string;
+}
+
+type ChartType = "pie" | "doughnut" | "line" | "area" | "bar" | "bullet" | "gauge" | "gantt" | "calendarheatmap" | "horizontalbar" | "columnchart" | "groupbar" | "lollipop" | "kpi" | "riskgauge" | "stackbar";
+interface Filter {
+    id: string;
+    label: string;
+    options: string[];
+}
+interface ChartFiltersConfig {
+    pie?: Filter[];
+    doughnut?: Filter[];
+    line?: Filter[];
+    area?: Filter[];
+    bar?: Filter[];
+    bullet?: Filter[];
+    gauge?: Filter[];
+    gantt?: Filter[];
+    heatmap?: Filter[];
+    calendarheatmap?: Filter[];
+    horizontalbar?: Filter[];
+    columnchart?: Filter[];
+    groupbar?: Filter[];
+    stackbar?: Filter[];
+    lollipop?: Filter[];
+    kpi?: Filter[];
+    riskgauge?: Filter[];
+}
+interface DetailItem {
+    label: string;
+    value: string;
+    color: string;
+    description: string;
+    status?: "In Progress" | "Overdue" | "On Target";
+}
+interface MahatiChartAnalyticsWidgetProps {
+    title: string;
+    chartTypes: ChartType[];
+    initialChartType: ChartType;
+    filters: Filter[];
+    chartFilters?: ChartFiltersConfig;
+    selectedFilters: Record<string, string>;
+    chartDataMap: Record<ChartType, ChartData<any>>;
+    bulletData?: BulletData;
+    gaugeData?: GaugeData;
+    horizontalBarData?: HorizontalBarData;
+    columnChartData?: ColumnChartData;
+    groupBarData?: GroupBarChartData;
+    stackBarData?: StackBarChartData;
+    lollipopData?: LollipopData;
+    kpiData?: Record<string, KPIChartData>;
+    riskGaugeData?: any;
+    ganttData?: Record<string, Record<string, GanttData>>;
+    heatmapData?: Record<string, HeatmapData>;
+    calendarheatmapData?: Record<string, any>;
+    onApplyFilters?: (filters: Record<string, string>) => void;
+    onChartTypeChange?: (chartType: ChartType) => void;
+    onFiltersChange: (filters: Record<string, string>) => void;
+    details: DetailItem[];
+    quickStats: {
+        totalVolume: {
+            value: string;
+            change: string;
+            description: string;
+        };
+        transactions: {
+            value: string;
+            description: string;
+        };
+    };
+    actionButtons: {
+        label: string;
+        style: "danger" | "primary" | "success" | "mahati";
+        onClick: () => void;
+    }[];
+}
+declare const MahatiChartAnalyticsWidget: {
+    ({ title, chartTypes, initialChartType, filters, chartFilters, selectedFilters, chartDataMap, bulletData, gaugeData, horizontalBarData, columnChartData, groupBarData, stackBarData, lollipopData, kpiData, riskGaugeData, ganttData, heatmapData, calendarheatmapData, onApplyFilters, quickStats, actionButtons, onChartTypeChange, onFiltersChange, details, }: MahatiChartAnalyticsWidgetProps): react_jsx_runtime.JSX.Element;
+    displayName: string;
+};
+
+interface TooltipProps {
+    text?: string | React__default.ReactNode;
+    testId?: string;
+    position?: "top" | "right" | "bottom" | "left";
+    children: React__default.ReactNode;
+    variant?: "default" | "transparent";
+    className?: string;
+    textColor?: string;
+    backgroundColor?: string;
+    image?: {
+        src: string;
+        alt?: string;
+        width?: number;
+        height?: number;
+    };
+    animation?: {
+        component: React__default.ComponentType<any>;
+        props?: any;
+        triggerDelay?: number;
+    };
+}
+declare const Tooltip: {
+    ({ text, position, children, variant, className, textColor, backgroundColor, image, testId, animation }: TooltipProps): any;
+    displayName: string;
+};
+
+type ToastType = "success" | "error" | "warning" | "notification";
+type BackgroundType = "solid" | "transparent";
+interface CustomToastStyles {
+    containerBackground?: string;
+    containerBorderRadius?: string;
+    containerBoxShadow?: string;
+    containerWidth?: string;
+    containerHeight?: string;
+    containerPaddingLeft?: string;
+    stripBackground?: string;
+    stripWidth?: string;
+    stripLeft?: string;
+    stripBorderRadius?: string;
+    titleColor?: string;
+    titleFontFamily?: string;
+    titleFontSize?: string;
+    titleFontWeight?: string;
+    titleFontStyle?: string;
+    titleLineHeight?: string;
+    messageColor?: string;
+    messageFontFamily?: string;
+    messageFontSize?: string;
+    messageFontWeight?: string;
+    messageFontStyle?: string;
+    messageLineHeight?: string;
+    messageOpacity?: string;
+    messageMarginTop?: string;
+    iconSrc?: string;
+    iconWidth?: string;
+    iconHeight?: string;
+    iconMarginRight?: string;
+    closeIconSrc?: string;
+    closeIconWidth?: string;
+    closeIconHeight?: string;
+    closeButtonOpacity?: string;
+    closeButtonMarginLeft?: string;
+}
+interface ActionButton {
+    label: string;
+    onClick: () => void;
+    variant?: 'primary' | 'secondary';
+    backgroundColor?: string;
+    textColor?: string;
+    borderColor?: string;
+    hoverBackgroundColor?: string;
+    fontSize?: string;
+    fontWeight?: string;
+    padding?: string;
+    borderRadius?: string;
+}
+interface ToastMessageProps extends React__default.HTMLAttributes<HTMLDivElement> {
+    type?: ToastType;
+    title?: string;
+    message?: string;
+    onClose?: () => void;
+    showClose?: boolean;
+    duration?: number;
+    background?: BackgroundType;
+    custom?: CustomToastStyles;
+    action?: ActionButton[];
+    testId?: string;
+}
+declare const ToastMessage: React__default.ForwardRefExoticComponent<ToastMessageProps & React__default.RefAttributes<HTMLDivElement>>;
+
+interface ConfettiExplosionProps$1 {
+    isActive: boolean;
+    particleCount?: number;
+    duration?: number;
+    colors?: string[];
+    force?: number;
+    particleSize?: number;
+    stageHeight?: number;
+    testId?: string;
+}
+declare const ConfettiExplosion: React__default.FC<ConfettiExplosionProps$1>;
+
+interface ConfettiExplosionProps {
+    isActive: boolean;
+    particleCount?: number;
+    duration?: number;
+    colors?: string[];
+    force?: number;
+    particleSize?: number;
+    stageHeight?: number;
+    testId?: string;
+}
+declare const RealisticConfetti: React__default.FC<ConfettiExplosionProps>;
+
+interface SpinnerProps {
+    size?: number;
+    borderWidth?: number;
+    borderRadius?: number | string;
+    primaryColor?: string;
+    backgroundColor?: string;
+    speed?: number;
+    testId?: string;
+}
+declare const Spinner: ({ size, borderWidth, borderRadius, primaryColor, backgroundColor, speed, testId, }: SpinnerProps) => any;
+interface CircularSpinnerProps {
+    size?: number;
+    color?: string;
+    speed?: number;
+    ringCount?: number;
+    testId?: string;
+}
+declare const CircularSpinner: ({ size, color, speed, ringCount, testId, }: CircularSpinnerProps) => any;
+interface CardOverlayLoaderProps {
+    show?: boolean;
+    spinnerSize?: number;
+    spinnerBorderWidth?: number;
+    spinnerPrimary?: string;
+    spinnerTrack?: string;
+    backdrop?: string;
+    label?: string;
+    testId?: string;
+}
+declare const CardOverlayLoader: ({ show, spinnerSize, spinnerBorderWidth, spinnerPrimary, spinnerTrack, backdrop, label, testId, }: CardOverlayLoaderProps) => any;
+interface LoadingDotsProps {
+    size?: number;
+    color?: string;
+    gap?: number;
+    speed?: number;
+    count?: number;
+    testId?: string;
+}
+declare const LoadingDots: ({ size, color, gap, speed, count, testId, }: LoadingDotsProps) => any;
+interface LoadingDotsLinearProps {
+    size?: number;
+    color?: string;
+    gap?: number;
+    speed?: number;
+    count?: number;
+    testId?: string;
+}
+declare const LoadingDotsLinear: ({ size, color, gap, speed, count, testId, }: LoadingDotsLinearProps) => any;
+interface CardWithLoadingProps {
+    loading?: boolean;
+    imageUrl?: string;
+    title?: string;
+    content?: string;
+    testId?: string;
+}
+declare const CardWithLoading: ({ loading, imageUrl, title, content, testId, }: CardWithLoadingProps) => any;
+
+declare function SearchableDropdown({ label, options, value, onChange, placeholder, testId }: any): react_jsx_runtime.JSX.Element;
+declare function MultiSelectDropdown({ label, options, values, onChange, testId }: {
+    testId?: string;
+    label?: string;
+    options: {
+        label: string;
+        value: string;
+    }[];
+    values: string[];
+    onChange: (values: string[]) => void;
+}): react_jsx_runtime.JSX.Element;
+type CascadeOption = {
+    label: string;
+    value: string;
+    children?: CascadeOption[];
+    testId?: string;
+};
+interface CascadingValue {
+    level1?: string;
+    level2?: string;
+    level3?: string;
+}
+interface CascadingDropdownProps {
+    label?: string;
+    data: CascadeOption[];
+    testId?: string;
+    value: CascadingValue;
+    onChange: (val: CascadingValue) => void;
+}
+declare function CascadingDropdown({ label, data, value, testId, onChange, }: CascadingDropdownProps): react_jsx_runtime.JSX.Element;
+type GroupedOption = {
+    label: string;
+    value: string;
+};
+type GroupedGroup = {
+    label: string;
+    options: GroupedOption[];
+};
+type GroupValue = {
+    section: string;
+    values: string[];
+} | null;
+type GroupedDropdownProps = {
+    label?: string;
+    testId?: string;
+    groups: GroupedGroup[];
+    values: GroupValue;
+    onChange: (val: GroupValue) => void;
+};
+declare function GroupedDropdown({ label, groups, values, onChange, testId }: GroupedDropdownProps): react_jsx_runtime.JSX.Element;
+interface AvatarDropdownProps {
+    label?: string;
+    string?: string;
+    placeholder?: string;
+    options: AvatarOption[];
+    value?: string;
+    testId?: string;
+    onChange: (value: string) => void;
+}
+declare function AvatarDropdown({ label, placeholder, options, value, testId, onChange, }: AvatarDropdownProps): react_jsx_runtime.JSX.Element;
+interface AvatarOption {
+    label: string;
+    value: string;
+    subtitle?: string;
+    image: string;
+}
+interface AvatarOption {
+    label: string;
+    value: string;
+    subtitle?: string;
+    image: string;
+}
+interface AvatarMultiSelectProps {
+    label?: string;
+    placeholder?: string;
+    options: AvatarOption[];
+    values: string[];
+    testId?: string;
+    onChange: (values: string[]) => void;
+}
+declare function AvatarMultiSelectDropdown({ label, placeholder, options, values, testId, onChange, }: AvatarMultiSelectProps): react_jsx_runtime.JSX.Element;
+interface AsyncDropdownProps {
+    label?: string;
+    placeholder?: string;
+    value?: string;
+    disabled?: boolean;
+    testId?: string;
+    loadOptions: (search: string) => Promise<{
+        label: string;
+        value: string;
+    }[]>;
+    onChange: (value: string) => void;
+}
+declare function AsyncDropdown({ label, placeholder, value, disabled, testId, loadOptions, onChange, }: AsyncDropdownProps): react_jsx_runtime.JSX.Element;
+
+type IconSet = {
+    play: string;
+    pause: string;
+    stop: string;
+    repeat: string;
+    skipForward: string;
+    skipBackward: string;
+    tenForward: string;
+    tenBackward: string;
+};
+declare const TexttoAudio: ({ icons }: {
+    icons?: IconSet;
+}) => react_jsx_runtime.JSX.Element;
+
+declare const MahatiLocationAccessModal: ({ isOpen, onClose, title, description, image, allowText, denyText, onAllow, onDeny, testId, }: any) => any;
+interface MahatiCameraAccessModalProps {
+    testId?: string;
+    isOpen: boolean;
+    onClose: () => void;
+    title: string;
+    description: string;
+    image?: string;
+    allowText: string;
+    denyText?: string;
+    onAllow?: (stream?: MediaStream) => void;
+    onDeny?: () => void;
+}
+declare const MahatiCameraAccessModal: ({ isOpen, onClose, title, description, image, allowText, denyText, onAllow, onDeny, testId }: MahatiCameraAccessModalProps) => any;
+declare const MahatiMicrophoneAccessModal: ({ isOpen, onClose, title, description, image, allowText, denyText, onAllow, onDeny, testId }: any) => any;
+interface MahatiPromotionModalProps {
+    isOpen: boolean;
+    onClose: () => void;
+    headerTitle: string;
+    title: string;
+    description: string;
+    ctaText: string;
+    onCtaClick?: (value?: string) => void;
+    ctaLink?: string;
+    openInNewTab?: boolean;
+    showInput?: boolean;
+    inputPlaceholder?: string;
+    testId?: string;
+}
+declare const MahatiPromotionModal: ({ isOpen, onClose, ctaLink, openInNewTab, onCtaClick, testId, ...cardProps }: MahatiPromotionModalProps) => any;
+interface MahatiPromotionModalV2Props {
+    isOpen: boolean;
+    testId?: string;
+    onClose: () => void;
+    headerTitle: string;
+    title: string;
+    description: string;
+    ctaText: string;
+    onCtaClick?: () => void;
+    ctaLink?: string;
+    openInNewTab?: boolean;
+    showBadgeImage?: boolean;
+    badgeImageSrc?: string;
+}
+declare const MahatiPromotionModalV2Modal: ({ isOpen, testId, onClose, headerTitle, title, description, ctaText, onCtaClick, ctaLink, openInNewTab, showBadgeImage, badgeImageSrc, }: MahatiPromotionModalV2Props) => any;
+interface MahatiPromotionModalV3Props {
+    isOpen: boolean;
+    onClose: () => void;
+    testId?: string;
+    title: string;
+    description: string;
+    ctaText: string;
+    onCtaClick?: () => void;
+    secondaryText?: string;
+    onSecondaryClick?: () => void;
+    imageSrc?: string;
+    ctaLink?: string;
+    openInNewTab?: boolean;
+}
+declare const MahatiPromotionModalV3Modal: ({ isOpen, testId, onClose, title, description, ctaText, onCtaClick, secondaryText, onSecondaryClick, imageSrc, ctaLink, openInNewTab, }: MahatiPromotionModalV3Props) => any;
+type BadgeType = "like" | "mention" | "follow" | "comment" | "add";
+interface MahatiNotificationCardProps {
+    title: string;
+    description?: string;
+    time?: string;
+    testId?: string;
+    iconSrc?: string;
+    avatarSrc?: string;
+    badgeIconSrc?: string;
+    badgeType?: BadgeType;
+    primaryActionText?: string;
+    onPrimaryAction?: () => void;
+    secondaryActionText?: string;
+    onSecondaryAction?: () => void;
+    onClose?: () => void;
+}
+declare const MahatiNotificationCard: ({ title, testId, description, time, iconSrc, avatarSrc, badgeIconSrc, badgeType, primaryActionText, onPrimaryAction, secondaryActionText, onSecondaryAction, onClose, }: MahatiNotificationCardProps) => react_jsx_runtime.JSX.Element;
+
+export { Accordion, type AccordionProps, type AvatarOption, type CalendarDate, type CalendarDateRange, type CalendarProps, type CalendarTime, CardOverlayLoader, CardWithLoading, CircularSpinner, DEFAULT_ACTIVITY_OPTIONS, DEFAULT_STATUS_OPTIONS, type FieldSize, Filter$1 as Filter, type FilterValues, LoadingDots, LoadingDotsLinear, MahatiActivity, type MahatiActivityProps, AsyncDropdown as MahatiAsyncDropdown, AvatarDropdown as MahatiAvatarDropdown, AvatarMultiSelectDropdown as MahatiAvatarMultiSelectDropdown, Button as MahatiButton, Calendar as MahatiCalendar, MahatiCameraAccessModal, Card as MahatiCard, CascadingDropdown as MahatiCascadingDropdown, MahatiChartAnalyticsWidget, ConfettiExplosion as MahatiConfettiExplosion, Dropdown as MahatiDropdown, FormContainer as MahatiFormContainer, GroupedDropdown as MahatiGroupedDropdown, Input as MahatiInput, MahatiLocationAccessModal, MahatiMicrophoneAccessModal, Modal as MahatiModal, MultiSelectDropdown as MahatiMultiSelectDropdown, MahatiNotificationCard, MahatiPromotionModal as MahatiPromotionModal_V1, MahatiPromotionModalV2Modal as MahatiPromotionModal_V2, MahatiPromotionModalV3Modal as MahatiPromotionModal_V3, RealisticConfetti as MahatiRealisticConfetti, MahatiSearch, type MahatiSearchProps, SearchableDropdown as MahatiSearchableDropdown, MahatiStatus, type MahatiStatusProps, TabbedInterface as MahatiTabbedInterface, Table as MahatiTable, TableWithTab as MahatiTableWithTab, TexttoAudio as MahatiTexttoAudio, ToastMessage as MahatiToastMessage, Tooltip as MahatiTooltip, type SelectOption, Spinner };