ds-smart-ui
Version:
Smart UI v1.0.5 — A production-ready React component library by PT Praisindo Teknologi. Covers inputs, navigation, data display, feedback, and layout with a unified design system, semantic Typography tokens, and full Storybook documentation.
28 lines (27 loc) • 1.35 kB
TypeScript
/**
* Barometer component to display a gauge-like indicator.
* It supports displaying a value, text label, and customizable order and visibility options.
* @component
* @param {Object} props - Component properties.
* @param {number} props.value - The value to display on the barometer (0-100).
* @param {string} [props.textLabel] - Optional text label to display in the center.
* @param {("asc" | "desc")} [props.order="asc"] - Order of the segments, either ascending or descending.
* @param {boolean} [props.showValue=false] - Whether to show the numeric value in the center.
* @param {string} [props.id] - Optional ID for testing purposes.
* * @returns {JSX.Element} The Barometer component.
* * @example
* * <Barometer value={75} textLabel="Performance" order="asc" showValue />
* * * <Barometer value={50} order="desc" />
* * * <Barometer value={20} textLabel="Low" showValue id="barometer-1" />
* * * This component renders a barometer gauge with a needle that moves based on the value prop.
* * * The segments are colored based on the value and order, and it can display a text label or the numeric value.
*/
interface BarometerProps {
value: number;
textLabel?: string;
order?: "asc" | "desc";
showValue?: boolean;
id?: string;
}
declare const Barometer: React.FC<BarometerProps>;
export default Barometer;