@useloops/design-system/dist/systems/Platform/GraphBar/GraphBar.d.ts

The official React based Loops design system

import { BoxProps, ListItemProps } from '@mui/material';
import { FunctionComponent, ReactNode } from 'react';
import { IconProps } from '../../BrandCore/Icon/Icon.js';
import { CheckboxProps } from '../../WebCore/Checkbox/Checkbox.js';
import { TooltipProps } from '../../WebCore/Tooltip/Tooltip.js';
import { TypographyProps } from '../../WebCore/Typography/Typography.js';
import { StyledLinearProgressProps } from './_partials/StyledLinearProgress/StyledLinearProgress.js';
import { UnitTextProps } from './_partials/UnitText/UnitText.js';

interface GraphBarSlotProps {
    graphBar?: StyledLinearProgressProps;
    graphBarTypography?: Omit<TypographyProps, 'component' | 'variation'>;
    checkbox?: CheckboxProps;
    icon?: Omit<IconProps, 'name'>;
    emojiIcon?: BoxProps;
    tooltip?: TooltipProps;
    unitText1?: UnitTextProps;
    unitText2?: UnitTextProps;
    listItem?: ListItemProps;
}
interface GraphBarProps {
    id: string;
    label: string;
    value?: number;
    relativePercentage?: number;
    respondentCount?: number;
    tooltipContent?: ReactNode;
    icon?: ReactNode;
    hideIcon?: boolean;
    hideCheckbox?: boolean;
    hideUnitColumn1?: boolean;
    hideUnitColumn2?: boolean;
    animated?: boolean;
    checked?: boolean;
    disabled?: boolean;
    onChange?: (checked: boolean) => void;
    percentageSymbol?: boolean;
    compact?: boolean;
    slotProps?: GraphBarSlotProps;
}
declare const GraphBar: FunctionComponent<GraphBarProps>;

export { GraphBar as default };
export type { GraphBarProps, GraphBarSlotProps };