2023-09-11 17:28:04 +08:00
|
|
|
import React from 'react';
|
2022-06-21 10:24:52 +08:00
|
|
|
import classNames from 'classnames';
|
2022-05-07 14:31:54 +08:00
|
|
|
import type { SliderProps as RcSliderProps } from 'rc-slider';
|
|
|
|
import RcSlider from 'rc-slider';
|
2024-04-22 10:26:14 +08:00
|
|
|
import type { SliderProps, SliderRef } from 'rc-slider/lib/Slider';
|
|
|
|
import raf from 'rc-util/lib/raf';
|
2023-09-11 17:28:04 +08:00
|
|
|
|
2024-07-18 19:19:02 +08:00
|
|
|
import type { GetProp } from '../_util/type';
|
2023-09-11 17:28:04 +08:00
|
|
|
import { devUseWarning } from '../_util/warning';
|
2022-06-21 10:24:52 +08:00
|
|
|
import { ConfigContext } from '../config-provider';
|
2023-06-24 14:20:56 +08:00
|
|
|
import DisabledContext from '../config-provider/DisabledContext';
|
2023-10-07 12:14:30 +08:00
|
|
|
import type { AbstractTooltipProps, TooltipPlacement } from '../tooltip';
|
2020-01-06 20:09:12 +08:00
|
|
|
import SliderTooltip from './SliderTooltip';
|
2022-03-14 19:12:10 +08:00
|
|
|
import useStyle from './style';
|
2024-07-29 16:38:50 +08:00
|
|
|
import SliderInternalContext from './Context';
|
2024-04-22 10:26:14 +08:00
|
|
|
import useRafLock from './useRafLock';
|
2016-08-10 09:46:56 +08:00
|
|
|
|
2022-03-01 14:48:41 +08:00
|
|
|
export type SliderMarks = RcSliderProps['marks'];
|
2016-08-10 09:46:56 +08:00
|
|
|
|
2018-12-05 19:12:18 +08:00
|
|
|
interface HandleGeneratorInfo {
|
2020-06-15 17:50:36 +08:00
|
|
|
value?: number;
|
2020-09-24 18:14:22 +08:00
|
|
|
dragging?: boolean;
|
2018-12-05 19:12:18 +08:00
|
|
|
index: number;
|
2018-12-07 20:02:01 +08:00
|
|
|
}
|
2019-11-30 18:10:48 +08:00
|
|
|
|
|
|
|
export type HandleGeneratorFn = (config: {
|
|
|
|
tooltipPrefixCls?: string;
|
|
|
|
prefixCls?: string;
|
|
|
|
info: HandleGeneratorInfo;
|
2020-09-24 18:14:22 +08:00
|
|
|
}) => React.ReactElement;
|
2017-11-21 14:53:25 +08:00
|
|
|
|
2023-11-03 16:30:04 +08:00
|
|
|
export type Formatter = ((value?: number) => React.ReactNode) | null;
|
2022-09-06 21:46:49 +08:00
|
|
|
|
2023-10-07 12:14:30 +08:00
|
|
|
export interface SliderTooltipProps extends AbstractTooltipProps {
|
2022-08-17 15:47:22 +08:00
|
|
|
prefixCls?: string;
|
|
|
|
open?: boolean;
|
|
|
|
placement?: TooltipPlacement;
|
|
|
|
getPopupContainer?: (triggerNode: HTMLElement) => HTMLElement;
|
2023-11-03 16:30:04 +08:00
|
|
|
formatter?: Formatter;
|
2023-07-25 16:39:54 +08:00
|
|
|
autoAdjustOverflow?: boolean;
|
2022-08-17 15:47:22 +08:00
|
|
|
}
|
|
|
|
|
2020-07-01 23:29:28 +08:00
|
|
|
export interface SliderBaseProps {
|
2017-02-17 11:59:30 +08:00
|
|
|
prefixCls?: string;
|
2019-11-13 14:34:10 +08:00
|
|
|
reverse?: boolean;
|
2016-08-10 09:46:56 +08:00
|
|
|
min?: number;
|
|
|
|
max?: number;
|
2020-10-02 22:15:12 +08:00
|
|
|
step?: null | number;
|
2016-08-10 09:46:56 +08:00
|
|
|
marks?: SliderMarks;
|
|
|
|
dots?: boolean;
|
|
|
|
included?: boolean;
|
|
|
|
disabled?: boolean;
|
2023-02-03 15:16:27 +08:00
|
|
|
keyboard?: boolean;
|
2017-01-05 12:05:24 +08:00
|
|
|
vertical?: boolean;
|
2017-09-10 02:32:00 +08:00
|
|
|
className?: string;
|
2023-01-20 11:03:50 +08:00
|
|
|
rootClassName?: string;
|
2017-09-10 02:32:00 +08:00
|
|
|
id?: string;
|
2018-11-13 22:55:17 +08:00
|
|
|
style?: React.CSSProperties;
|
2022-08-17 15:47:22 +08:00
|
|
|
tooltip?: SliderTooltipProps;
|
2020-10-02 22:16:18 +08:00
|
|
|
autoFocus?: boolean;
|
2022-09-06 21:46:49 +08:00
|
|
|
|
2023-09-22 14:19:53 +08:00
|
|
|
styles?: RcSliderProps['styles'];
|
|
|
|
classNames?: RcSliderProps['classNames'];
|
2023-11-03 21:50:49 +08:00
|
|
|
onFocus?: React.FocusEventHandler<HTMLDivElement>;
|
|
|
|
onBlur?: React.FocusEventHandler<HTMLDivElement>;
|
2023-09-22 14:19:53 +08:00
|
|
|
|
2022-09-06 21:46:49 +08:00
|
|
|
// Deprecated
|
|
|
|
/** @deprecated `tooltipPrefixCls` is deprecated. Please use `tooltip.prefixCls` instead. */
|
|
|
|
tooltipPrefixCls?: string;
|
|
|
|
/** @deprecated `tipFormatter` is deprecated. Please use `tooltip.formatter` instead. */
|
2023-11-03 16:30:04 +08:00
|
|
|
tipFormatter?: Formatter;
|
2022-09-06 21:46:49 +08:00
|
|
|
/** @deprecated `tooltipVisible` is deprecated. Please use `tooltip.open` instead. */
|
|
|
|
tooltipVisible?: boolean;
|
|
|
|
/**
|
|
|
|
* @deprecated `getTooltipPopupContainer` is deprecated. Please use `tooltip.getPopupContainer`
|
|
|
|
* instead.
|
|
|
|
*/
|
|
|
|
getTooltipPopupContainer?: (triggerNode: HTMLElement) => HTMLElement;
|
|
|
|
/** @deprecated `tooltipPlacement` is deprecated. Please use `tooltip.placement` instead. */
|
|
|
|
tooltipPlacement?: TooltipPlacement;
|
2016-08-10 09:46:56 +08:00
|
|
|
}
|
|
|
|
|
2020-07-01 23:29:28 +08:00
|
|
|
export interface SliderSingleProps extends SliderBaseProps {
|
|
|
|
range?: false;
|
|
|
|
value?: number;
|
|
|
|
defaultValue?: number;
|
|
|
|
onChange?: (value: number) => void;
|
2023-11-30 13:37:46 +08:00
|
|
|
/** @deprecated Please use `onChangeComplete` instead */
|
2020-07-01 23:29:28 +08:00
|
|
|
onAfterChange?: (value: number) => void;
|
2023-11-30 13:37:46 +08:00
|
|
|
onChangeComplete?: (value: number) => void;
|
2023-09-22 14:19:53 +08:00
|
|
|
/** @deprecated Please use `styles.handle` instead */
|
2020-10-09 09:37:26 +08:00
|
|
|
handleStyle?: React.CSSProperties;
|
2023-09-22 14:19:53 +08:00
|
|
|
/** @deprecated Please use `styles.track` instead */
|
2020-10-09 09:37:26 +08:00
|
|
|
trackStyle?: React.CSSProperties;
|
2023-09-22 14:19:53 +08:00
|
|
|
/** @deprecated Please use `styles.rail` instead */
|
2023-02-07 09:55:20 +08:00
|
|
|
railStyle?: React.CSSProperties;
|
2020-07-01 23:29:28 +08:00
|
|
|
}
|
|
|
|
|
|
|
|
export interface SliderRangeProps extends SliderBaseProps {
|
2020-12-29 15:59:13 +08:00
|
|
|
range: true | SliderRange;
|
2023-09-22 14:19:53 +08:00
|
|
|
value?: number[];
|
|
|
|
defaultValue?: number[];
|
|
|
|
onChange?: (value: number[]) => void;
|
2023-11-30 13:37:46 +08:00
|
|
|
/** @deprecated Please use `onChangeComplete` instead */
|
2023-09-22 14:19:53 +08:00
|
|
|
onAfterChange?: (value: number[]) => void;
|
2023-11-30 13:37:46 +08:00
|
|
|
onChangeComplete?: (value: number[]) => void;
|
2023-09-22 14:19:53 +08:00
|
|
|
/** @deprecated Please use `styles.handle` instead */
|
2020-10-09 09:37:26 +08:00
|
|
|
handleStyle?: React.CSSProperties[];
|
2023-09-22 14:19:53 +08:00
|
|
|
/** @deprecated Please use `styles.track` instead */
|
2020-10-09 09:37:26 +08:00
|
|
|
trackStyle?: React.CSSProperties[];
|
2023-09-22 14:19:53 +08:00
|
|
|
/** @deprecated Please use `styles.rail` instead */
|
2023-02-07 09:55:20 +08:00
|
|
|
railStyle?: React.CSSProperties;
|
2020-07-01 23:29:28 +08:00
|
|
|
}
|
|
|
|
|
2024-07-18 19:19:02 +08:00
|
|
|
type SliderRange = Exclude<GetProp<RcSliderProps, 'range'>, boolean>;
|
2020-12-29 15:59:13 +08:00
|
|
|
|
2022-08-17 15:47:22 +08:00
|
|
|
export type Opens = { [index: number]: boolean };
|
2016-03-29 14:01:10 +08:00
|
|
|
|
2023-11-03 16:30:04 +08:00
|
|
|
function getTipFormatter(tipFormatter?: Formatter, legacyTipFormatter?: Formatter) {
|
|
|
|
if (tipFormatter || tipFormatter === null) {
|
|
|
|
return tipFormatter;
|
|
|
|
}
|
|
|
|
if (legacyTipFormatter || legacyTipFormatter === null) {
|
|
|
|
return legacyTipFormatter;
|
|
|
|
}
|
|
|
|
return (val?: number) => (typeof val === 'number' ? val.toString() : '');
|
|
|
|
}
|
|
|
|
|
2023-05-17 10:06:44 +08:00
|
|
|
const Slider = React.forwardRef<SliderRef, SliderSingleProps | SliderRangeProps>((props, ref) => {
|
|
|
|
const {
|
|
|
|
prefixCls: customizePrefixCls,
|
|
|
|
range,
|
|
|
|
className,
|
|
|
|
rootClassName,
|
2023-06-25 17:28:00 +08:00
|
|
|
style,
|
2023-06-24 14:20:56 +08:00
|
|
|
disabled,
|
2023-05-17 10:06:44 +08:00
|
|
|
// Deprecated Props
|
|
|
|
tooltipPrefixCls: legacyTooltipPrefixCls,
|
|
|
|
tipFormatter: legacyTipFormatter,
|
|
|
|
tooltipVisible: legacyTooltipVisible,
|
|
|
|
getTooltipPopupContainer: legacyGetTooltipPopupContainer,
|
|
|
|
tooltipPlacement: legacyTooltipPlacement,
|
2024-04-22 10:26:14 +08:00
|
|
|
tooltip = {},
|
|
|
|
onChangeComplete,
|
2023-05-17 10:06:44 +08:00
|
|
|
...restProps
|
|
|
|
} = props;
|
|
|
|
|
2024-04-22 10:26:14 +08:00
|
|
|
const { vertical } = props;
|
|
|
|
|
2024-07-29 16:38:50 +08:00
|
|
|
const {
|
|
|
|
direction: contextDirection,
|
|
|
|
slider,
|
|
|
|
getPrefixCls,
|
|
|
|
getPopupContainer,
|
|
|
|
} = React.useContext(ConfigContext);
|
2023-06-24 14:20:56 +08:00
|
|
|
const contextDisabled = React.useContext(DisabledContext);
|
|
|
|
const mergedDisabled = disabled ?? contextDisabled;
|
2023-05-17 10:06:44 +08:00
|
|
|
|
2024-07-29 16:38:50 +08:00
|
|
|
// ============================= Context ==============================
|
|
|
|
const { handleRender: contextHandleRender, direction: internalContextDirection } =
|
|
|
|
React.useContext(SliderInternalContext);
|
|
|
|
|
|
|
|
const mergedDirection = internalContextDirection || contextDirection;
|
|
|
|
const isRTL = mergedDirection === 'rtl';
|
|
|
|
|
2024-04-22 10:26:14 +08:00
|
|
|
// =============================== Open ===============================
|
|
|
|
const [hoverOpen, setHoverOpen] = useRafLock();
|
|
|
|
const [focusOpen, setFocusOpen] = useRafLock();
|
|
|
|
|
|
|
|
const tooltipProps: SliderTooltipProps = {
|
|
|
|
...tooltip,
|
|
|
|
};
|
|
|
|
const {
|
|
|
|
open: tooltipOpen,
|
|
|
|
placement: tooltipPlacement,
|
|
|
|
getPopupContainer: getTooltipPopupContainer,
|
|
|
|
prefixCls: customizeTooltipPrefixCls,
|
|
|
|
formatter: tipFormatter,
|
|
|
|
} = tooltipProps;
|
|
|
|
|
|
|
|
const lockOpen = tooltipOpen ?? legacyTooltipVisible;
|
2024-04-30 13:48:31 +08:00
|
|
|
const activeOpen = (hoverOpen || focusOpen) && lockOpen !== false;
|
2024-04-22 10:26:14 +08:00
|
|
|
|
|
|
|
const mergedTipFormatter = getTipFormatter(tipFormatter, legacyTipFormatter);
|
|
|
|
|
|
|
|
// ============================= Change ==============================
|
|
|
|
const [dragging, setDragging] = useRafLock();
|
|
|
|
|
|
|
|
const onInternalChangeComplete: RcSliderProps['onChangeComplete'] = (nextValues) => {
|
|
|
|
onChangeComplete?.(nextValues as any);
|
|
|
|
setDragging(false);
|
2023-05-17 10:06:44 +08:00
|
|
|
};
|
|
|
|
|
2024-04-22 10:26:14 +08:00
|
|
|
// ============================ Placement ============================
|
|
|
|
const getTooltipPlacement = (placement?: TooltipPlacement, vert?: boolean) => {
|
2023-05-17 10:06:44 +08:00
|
|
|
if (placement) {
|
|
|
|
return placement;
|
|
|
|
}
|
2024-04-22 10:26:14 +08:00
|
|
|
if (!vert) {
|
2023-05-17 10:06:44 +08:00
|
|
|
return 'top';
|
|
|
|
}
|
2024-07-29 16:38:50 +08:00
|
|
|
return isRTL ? 'left' : 'right';
|
2023-05-17 10:06:44 +08:00
|
|
|
};
|
|
|
|
|
2024-04-22 10:26:14 +08:00
|
|
|
// ============================== Style ===============================
|
2023-05-17 10:06:44 +08:00
|
|
|
const prefixCls = getPrefixCls('slider', customizePrefixCls);
|
|
|
|
|
2023-12-14 14:58:53 +08:00
|
|
|
const [wrapCSSVar, hashId, cssVarCls] = useStyle(prefixCls);
|
2023-05-17 10:06:44 +08:00
|
|
|
|
|
|
|
const cls = classNames(
|
|
|
|
className,
|
2023-06-25 17:28:00 +08:00
|
|
|
slider?.className,
|
2023-05-17 10:06:44 +08:00
|
|
|
rootClassName,
|
|
|
|
{
|
2024-07-29 16:38:50 +08:00
|
|
|
[`${prefixCls}-rtl`]: isRTL,
|
2024-04-22 10:26:14 +08:00
|
|
|
[`${prefixCls}-lock`]: dragging,
|
2023-05-17 10:06:44 +08:00
|
|
|
},
|
|
|
|
hashId,
|
2023-12-14 14:58:53 +08:00
|
|
|
cssVarCls,
|
2023-05-17 10:06:44 +08:00
|
|
|
);
|
|
|
|
|
|
|
|
// make reverse default on rtl direction
|
2024-07-29 16:38:50 +08:00
|
|
|
if (isRTL && !restProps.vertical) {
|
2023-05-17 10:06:44 +08:00
|
|
|
restProps.reverse = !restProps.reverse;
|
|
|
|
}
|
|
|
|
|
2024-04-22 10:26:14 +08:00
|
|
|
// ============================= Warning ==============================
|
2023-05-17 10:06:44 +08:00
|
|
|
// Warning for deprecated usage
|
|
|
|
if (process.env.NODE_ENV !== 'production') {
|
2023-09-13 22:07:33 +08:00
|
|
|
const warning = devUseWarning('Slider');
|
2023-09-11 17:28:04 +08:00
|
|
|
|
2023-05-17 10:06:44 +08:00
|
|
|
[
|
|
|
|
['tooltipPrefixCls', 'prefixCls'],
|
|
|
|
['getTooltipPopupContainer', 'getPopupContainer'],
|
|
|
|
['tipFormatter', 'formatter'],
|
|
|
|
['tooltipPlacement', 'placement'],
|
|
|
|
['tooltipVisible', 'open'],
|
|
|
|
].forEach(([deprecatedName, newName]) => {
|
2023-09-13 22:07:33 +08:00
|
|
|
warning.deprecated(!(deprecatedName in props), deprecatedName, `tooltip.${newName}`);
|
2023-05-17 10:06:44 +08:00
|
|
|
});
|
|
|
|
}
|
2022-03-14 19:12:10 +08:00
|
|
|
|
2024-04-22 10:26:14 +08:00
|
|
|
// ============================== Handle ==============================
|
2020-12-29 15:59:13 +08:00
|
|
|
|
2024-04-22 10:26:14 +08:00
|
|
|
React.useEffect(() => {
|
|
|
|
const onMouseUp = () => {
|
|
|
|
// Delay for 1 frame to make the click to enable hide tooltip
|
|
|
|
// even when the handle is focused
|
|
|
|
raf(() => {
|
|
|
|
setFocusOpen(false);
|
|
|
|
}, 1);
|
|
|
|
};
|
|
|
|
document.addEventListener('mouseup', onMouseUp);
|
2021-01-30 19:39:02 +08:00
|
|
|
|
2024-04-22 10:26:14 +08:00
|
|
|
return () => {
|
|
|
|
document.removeEventListener('mouseup', onMouseUp);
|
2023-05-17 10:06:44 +08:00
|
|
|
};
|
2024-04-22 10:26:14 +08:00
|
|
|
}, []);
|
|
|
|
|
2024-07-18 19:19:02 +08:00
|
|
|
const useActiveTooltipHandle = range && !lockOpen;
|
2024-04-22 10:26:14 +08:00
|
|
|
|
2024-07-29 16:38:50 +08:00
|
|
|
const handleRender: RcSliderProps['handleRender'] =
|
|
|
|
contextHandleRender ||
|
|
|
|
((node, info) => {
|
|
|
|
const { index } = info;
|
|
|
|
|
|
|
|
const nodeProps = node.props;
|
|
|
|
|
|
|
|
function proxyEvent(
|
2024-10-08 17:56:12 +08:00
|
|
|
eventName: keyof React.DOMAttributes<HTMLElement>,
|
2024-07-29 16:38:50 +08:00
|
|
|
event: React.SyntheticEvent,
|
|
|
|
triggerRestPropsEvent?: boolean,
|
|
|
|
) {
|
|
|
|
if (triggerRestPropsEvent) {
|
|
|
|
(restProps as any)[eventName]?.(event);
|
|
|
|
}
|
|
|
|
|
|
|
|
(nodeProps as any)[eventName]?.(event);
|
|
|
|
}
|
|
|
|
|
|
|
|
const passedProps: typeof nodeProps = {
|
|
|
|
...nodeProps,
|
|
|
|
onMouseEnter: (e) => {
|
|
|
|
setHoverOpen(true);
|
|
|
|
proxyEvent('onMouseEnter', e);
|
|
|
|
},
|
|
|
|
onMouseLeave: (e) => {
|
|
|
|
setHoverOpen(false);
|
|
|
|
proxyEvent('onMouseLeave', e);
|
|
|
|
},
|
|
|
|
onMouseDown: (e) => {
|
|
|
|
setFocusOpen(true);
|
|
|
|
setDragging(true);
|
|
|
|
proxyEvent('onMouseDown', e);
|
|
|
|
},
|
|
|
|
onFocus: (e) => {
|
|
|
|
setFocusOpen(true);
|
|
|
|
restProps.onFocus?.(e);
|
|
|
|
proxyEvent('onFocus', e, true);
|
|
|
|
},
|
|
|
|
onBlur: (e) => {
|
|
|
|
setFocusOpen(false);
|
|
|
|
restProps.onBlur?.(e);
|
|
|
|
proxyEvent('onBlur', e, true);
|
|
|
|
},
|
|
|
|
};
|
|
|
|
|
|
|
|
const cloneNode = React.cloneElement(node, passedProps);
|
|
|
|
|
|
|
|
const open = (!!lockOpen || activeOpen) && mergedTipFormatter !== null;
|
|
|
|
|
|
|
|
// Wrap on handle with Tooltip when is single mode or multiple with all show tooltip
|
|
|
|
if (!useActiveTooltipHandle) {
|
|
|
|
return (
|
|
|
|
<SliderTooltip
|
|
|
|
{...tooltipProps}
|
|
|
|
prefixCls={getPrefixCls('tooltip', customizeTooltipPrefixCls ?? legacyTooltipPrefixCls)}
|
|
|
|
title={mergedTipFormatter ? mergedTipFormatter(info.value) : ''}
|
|
|
|
open={open}
|
|
|
|
placement={getTooltipPlacement(tooltipPlacement ?? legacyTooltipPlacement, vertical)}
|
|
|
|
key={index}
|
|
|
|
overlayClassName={`${prefixCls}-tooltip`}
|
|
|
|
getPopupContainer={
|
|
|
|
getTooltipPopupContainer || legacyGetTooltipPopupContainer || getPopupContainer
|
|
|
|
}
|
|
|
|
>
|
|
|
|
{cloneNode}
|
|
|
|
</SliderTooltip>
|
|
|
|
);
|
|
|
|
}
|
|
|
|
|
|
|
|
return cloneNode;
|
|
|
|
});
|
2023-05-17 10:06:44 +08:00
|
|
|
|
2024-04-22 10:26:14 +08:00
|
|
|
// ========================== Active Handle ===========================
|
|
|
|
const activeHandleRender: SliderProps['activeHandleRender'] = useActiveTooltipHandle
|
|
|
|
? (handle, info) => {
|
|
|
|
const cloneNode = React.cloneElement(handle, {
|
|
|
|
style: {
|
|
|
|
...handle.props.style,
|
|
|
|
visibility: 'hidden',
|
|
|
|
},
|
|
|
|
});
|
|
|
|
|
|
|
|
return (
|
|
|
|
<SliderTooltip
|
|
|
|
{...tooltipProps}
|
|
|
|
prefixCls={getPrefixCls('tooltip', customizeTooltipPrefixCls ?? legacyTooltipPrefixCls)}
|
|
|
|
title={mergedTipFormatter ? mergedTipFormatter(info.value) : ''}
|
2024-04-29 10:37:11 +08:00
|
|
|
open={mergedTipFormatter !== null && activeOpen}
|
2024-04-22 10:26:14 +08:00
|
|
|
placement={getTooltipPlacement(tooltipPlacement ?? legacyTooltipPlacement, vertical)}
|
|
|
|
key="tooltip"
|
|
|
|
overlayClassName={`${prefixCls}-tooltip`}
|
|
|
|
getPopupContainer={
|
|
|
|
getTooltipPopupContainer || legacyGetTooltipPopupContainer || getPopupContainer
|
|
|
|
}
|
2024-07-18 19:19:02 +08:00
|
|
|
draggingDelete={info.draggingDelete}
|
2024-04-22 10:26:14 +08:00
|
|
|
>
|
|
|
|
{cloneNode}
|
|
|
|
</SliderTooltip>
|
|
|
|
);
|
|
|
|
}
|
|
|
|
: undefined;
|
|
|
|
|
|
|
|
// ============================== Render ==============================
|
2023-06-25 17:28:00 +08:00
|
|
|
const mergedStyle: React.CSSProperties = { ...slider?.style, ...style };
|
|
|
|
|
2023-11-14 15:59:23 +08:00
|
|
|
return wrapCSSVar(
|
2024-04-01 15:49:45 +08:00
|
|
|
// @ts-ignore
|
2023-05-17 10:06:44 +08:00
|
|
|
<RcSlider
|
|
|
|
{...restProps}
|
|
|
|
step={restProps.step}
|
2024-07-18 19:19:02 +08:00
|
|
|
range={range}
|
2023-05-17 10:06:44 +08:00
|
|
|
className={cls}
|
2023-06-25 17:28:00 +08:00
|
|
|
style={mergedStyle}
|
2023-06-24 14:20:56 +08:00
|
|
|
disabled={mergedDisabled}
|
2023-05-17 10:06:44 +08:00
|
|
|
ref={ref}
|
|
|
|
prefixCls={prefixCls}
|
|
|
|
handleRender={handleRender}
|
2024-04-22 10:26:14 +08:00
|
|
|
activeHandleRender={activeHandleRender}
|
|
|
|
onChangeComplete={onInternalChangeComplete}
|
2023-05-17 10:06:44 +08:00
|
|
|
/>,
|
|
|
|
);
|
|
|
|
});
|
2020-04-22 15:58:57 +08:00
|
|
|
|
2022-06-21 10:24:52 +08:00
|
|
|
if (process.env.NODE_ENV !== 'production') {
|
|
|
|
Slider.displayName = 'Slider';
|
|
|
|
}
|
2020-04-25 22:46:21 +08:00
|
|
|
|
2020-04-22 15:58:57 +08:00
|
|
|
export default Slider;
|