goobs-frontend
Version:
A comprehensive React-based libary for building modern web applications
111 lines • 4.28 kB
TypeScript
import { default as React } from 'react';
/**
* Comprehensive styling options for the ProgressBar. Shape preserved verbatim
* from the pre-migration theme module so existing callers keep compiling.
*/
export interface ProgressBarStyles {
/** Theme variant: 'light' (default), 'dark', or 'sacred'. */
theme?: 'light' | 'dark' | 'sacred';
/** Track background. */
backgroundColor?: string;
/** Track border color; composes `<borderWidth> solid <borderColor>` (no border without it). */
borderColor?: string;
/** Track border radius. */
borderRadius?: string;
/** Border width used with borderColor (default 1px); ignored without borderColor. */
borderWidth?: string;
/** Track box shadow. */
boxShadow?: string;
/** Track backdrop-filter. */
backdropFilter?: string;
/** Track background-image. */
backgroundImage?: string;
/** Fill background (determinate mode). With `striped`, the stripe gradient layers over it. */
barBackground?: string;
/** Fill border radius (determinate mode). */
barBorderRadius?: string;
/** Fill box shadow (determinate mode). */
barBoxShadow?: string;
/** Fill background-image (determinate mode). */
barBackgroundImage?: string;
/** Fill CSS filter (determinate mode). */
barFilter?: string;
/** Fill background (indeterminate mode). With `striped`, the stripe gradient layers over it. */
indeterminateBarBackground?: string;
/** Fill border radius (indeterminate mode). */
indeterminateBarBorderRadius?: string;
/** Fill box shadow (indeterminate mode). */
indeterminateBarBoxShadow?: string;
/** Fill background-image (indeterminate mode). */
indeterminateBarBackgroundImage?: string;
/** Fill CSS filter (indeterminate mode). */
indeterminateBarFilter?: string;
/** CSS animation shorthand replacing the default indeterminate sweep. */
indeterminateBarAnimation?: string;
/** Label text color. */
labelColor?: string;
/** Label font size. */
labelFontSize?: string;
/** Label font family. */
labelFontFamily?: string;
/** Label font weight. */
labelFontWeight?: string | number;
/** Label text shadow. */
labelTextShadow?: string;
/** Track width. */
width?: string;
/** Track height. */
height?: string;
/** Track padding. */
padding?: string;
/** Track margin shorthand. */
margin?: string;
/** Track top margin. */
marginTop?: string;
/** Track bottom margin. */
marginBottom?: string;
/** Track left margin. */
marginLeft?: string;
/** Track right margin. */
marginRight?: string;
/** Replaces the determinate fill transition with `all <duration> <easing>`. */
transitionDuration?: string;
/** Easing used with transitionDuration (default cubic-bezier(0.4, 0, 0.2, 1)); ignored without it. */
transitionEasing?: string;
/** Renders the disabled treatment (data-disabled) — purely visual. */
disabled?: boolean;
/** Overlays the diagonal stripe gradient on the fill. */
striped?: boolean;
/** Animates the stripes (data-animated in the CSS module). */
animated?: boolean;
/** Adds the pulsing fill animation (data-pulse in the CSS module). */
pulse?: boolean;
/** Track max-width. */
maxWidth?: string;
/** Track min-width. */
minWidth?: string;
/** Track max-height. */
maxHeight?: string;
/** Track min-height. */
minHeight?: string;
}
export interface ProgressBarProps {
/** Progress value from 0-100 for determinate mode */
value?: number;
/** Variant of the progress bar */
variant?: 'determinate' | 'indeterminate';
/** Show progress label/percentage */
showLabel?: boolean;
/** Custom label text (overrides default percentage) */
label?: string;
/** ARIA label for accessibility */
'aria-label'?: string;
/** Comprehensive styling options including theme, custom colors, and layout properties. */
styles?: ProgressBarStyles;
}
/**
* A versatile progress bar component that supports both determinate and indeterminate modes.
*/
declare const ProgressBar: React.FC<ProgressBarProps>;
export default ProgressBar;
//# sourceMappingURL=index.d.ts.map