import './MultiSliderComposite.scss';
import { MultiSliderProps } from '../../core/types';
/**
 * MultiSliderComposite component that renders a composite multi-segment slider with customizable colors, labels, and break values.
 *
 * @param {Object} props - The properties passed to the component.
 * @param {Array<string>} props.colors - An array of color values for each segment of the slider.
 * @param {Array<string>} props.labels - An array of labels corresponding to each segment of the slider.
 * @param {Array<number>} props.breakValues - An array of break values representing the proportional sizes of each segment.
 * @param {function(Array<number>): void} props.onBreakValuesChange - Callback function called when the break values change.
 * @param {boolean} [props.pearling=false] - If true, the slider handles will not pass each other while moving.
 * @param {boolean} [props.tooltipVisible=false] - If true, tooltips will be shown when hovering over the slider.
 * @param {boolean} [props.isComposite=false] - If true, the slider tracks will be rendered using the CompositeTrack component.
 * @param {Array<Array<number>>} [props.compositeBreakValues] - An array of arrays containing break values for each composite track segment.
 *
 * @returns {JSX.Element} The rendered MultiSliderComposite component with a horizontal mixer for adjusting break values.
 *
 * @example
 * // Example usage of MultiSliderComposite
 * <MultiSliderComposite
 *    colors={['#FF0000', '#00FF00', '#0000FF']}
 *    labels={['Red', 'Green', 'Blue']}
 *    breakValues={[20, 30, 50]}
 *    onBreakValuesChange={(newValues) => console.log(newValues)}
 *    pearling={true}
 *    tooltipVisible={true}
 *    isComposite={true}
 *    compositeBreakValues={[[10, 10], [15, 15], [25, 25]]}
 * />
 */
export declare const MultiSliderComposite: (props: MultiSliderProps) => import("react/jsx-runtime").JSX.Element;
export default MultiSliderComposite;