antd-mini - npm Package Compare versions

Comparing version 2.31.0 to 2.31.1

compiled/wechat/src/Form/FormSlider/props.js

@@ -24,5 +24,5 @@ var __assign = (this && this.__assign) || function () {
 import { FormItemFunctionalProps } from '../FormItem/props';
-import { SliderFunctionalProps } from '../../Slider/props';
+import { sliderDefaultProps } from '../../Slider/props';
 // eslint-disable-next-line @typescript-eslint/no-unused-vars
-var value = SliderFunctionalProps.value, defaultValue = SliderFunctionalProps.defaultValue, rest = __rest(SliderFunctionalProps, ["value", "defaultValue"]);
+var value = sliderDefaultProps.value, defaultValue = sliderDefaultProps.defaultValue, rest = __rest(sliderDefaultProps, ["value", "defaultValue"]);
 export var FormSliderDefaultProps = __assign(__assign(__assign({}, FormItemFunctionalProps), rest), { sliderClassName: '', sliderStyle: '' });

compiled/wechat/src/Slider/index.js

@@ -1,92 +0,81 @@
-var __assign = (this && this.__assign) || function () {
-    __assign = Object.assign || function(t) {
-        for (var s, i = 1, n = arguments.length; i < n; i++) {
-            s = arguments[i];
-            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
-                t[p] = s[p];
-        }
-        return t;
-    };
-    return __assign.apply(this, arguments);
+var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
+    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
+    return new (P || (P = Promise))(function (resolve, reject) {
+        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
+        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
+        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
+        step((generator = generator.apply(thisArg, _arguments || [])).next());
+    });
 };
-import { useEvent, useMemo, useRef, useState, useComponent, } from 'functional-mini/component';
-import '../_util/assert-component2';
-import { mountComponent } from '../_util/component';
-import { useComponentEvent } from '../_util/hooks/useComponentEvent';
-import { useMixState } from '../_util/hooks/useMixState';
-import { SliderController } from './controller';
-import { sliderDefaultProps, SliderFunctionalProps, } from './props';
-var useSliderController = function (props) {
-    var controllerRef = useRef();
-    if (!controllerRef.current) {
-        controllerRef.current = new SliderController(0, props);
+var __generator = (this && this.__generator) || function (thisArg, body) {
+    var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g;
+    return g = { next: verb(0), "throw": verb(1), "return": verb(2) }, typeof Symbol === "function" && (g[Symbol.iterator] = function() { return this; }), g;
+    function verb(n) { return function (v) { return step([n, v]); }; }
+    function step(op) {
+        if (f) throw new TypeError("Generator is already executing.");
+        while (g && (g = 0, op[0] && (_ = 0)), _) try {
+            if (f = 1, y && (t = op[0] & 2 ? y["return"] : op[0] ? y["throw"] || ((t = y["return"]) && t.call(y), 0) : y.next) && !(t = t.call(y, op[1])).done) return t;
+            if (y = 0, t) op = [op[0] & 2, t.value];
+            switch (op[0]) {
+                case 0: case 1: t = op; break;
+                case 4: _.label++; return { value: op[1], done: false };
+                case 5: _.label++; y = op[1]; op = [0]; continue;
+                case 7: op = _.ops.pop(); _.trys.pop(); continue;
+                default:
+                    if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) { _ = 0; continue; }
+                    if (op[0] === 3 && (!t || (op[1] > t[0] && op[1] < t[3]))) { _.label = op[1]; break; }
+                    if (op[0] === 6 && _.label < t[1]) { _.label = t[1]; t = op; break; }
+                    if (t && _.label < t[2]) { _.label = t[2]; _.ops.push(op); break; }
+                    if (t[2]) _.ops.pop();
+                    _.trys.pop(); continue;
+            }
+            op = body.call(thisArg, _);
+        } catch (e) { op = [6, e]; y = 0; } finally { f = t = 0; }
+        if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };
     }
-    return controllerRef.current;
 };
-var Slider = function (props) {
-    var component = useComponent();
-    var sliderController = useSliderController(props);
-    var _a = useMixState(props.defaultValue, {
-        value: props.value,
-        postState: function (value) {
-            return {
-                valid: true,
-                value: sliderController.formatValue(value),
-            };
-        },
-    }), value = _a[0], _b = _a[1], update = _b.update, isControlled = _b.isControlled;
-    var _c = useState({
-        changingStart: false,
-        changingEnd: false,
-    }), moveStatus = _c[0], setMoveStatus = _c[1];
-    var triggerEvent = useComponentEvent(props).triggerEvent;
-    sliderController.updateProps(props);
-    sliderController.updateValue(value);
-    sliderController.updateMoveStatus(moveStatus);
-    sliderController.onChange(function (v, moveStatus, _a) {
-        var valueChange = _a.valueChange, moveStatusChange = _a.moveStatusChange, type = _a.type, event = _a.event;
-        if (!isControlled) {
-            update(v);
+import { Component, triggerEvent, getValueFromProps } from '../_util/simply';
+import { getInstanceBoundingClientRect } from '../_util/jsapi/get-instance-bounding-client-rect';
+import { sliderDefaultProps } from './props';
+import createValue from '../mixins/value';
+Component(sliderDefaultProps, {
+    getInstance: function () {
+        if (this.$id) {
+            return my;
         }
-        if (valueChange) {
-            triggerEvent('change', v);
+        return this;
+    },
+    formatValue: function (val) {
+        var _a = getValueFromProps(this, [
+            'min',
+            'max',
+            'step',
+            'range',
+        ]), min = _a[0], max = _a[1], step = _a[2], range = _a[3];
+        var value = this.fitSliderValue(val, min, max, step, range);
+        value = this.getRoundedValue(value, step);
+        return value;
+    },
+    getRoundedValue: function (value, step) {
+        if (step === void 0) { step = 1; }
+        if (value === undefined) {
+            return 0;
         }
-        if (moveStatusChange) {
-            setMoveStatus(function (v2) { return (__assign(__assign({}, v2), moveStatus)); });
+        if (typeof value === 'number') {
+            return Math.round(value / step) * step;
         }
-        if (value && type === 'end') {
-            triggerEvent('afterChange', v, event);
-        }
-    });
-    useEvent('handleTrackTouchStart', function (e) {
-        return sliderController.handleMove(component, e, 'start');
-    });
-    useEvent('handleTrackTouchMove', function (e) {
-        return sliderController.handleMove(component, e, 'move');
-    });
-    useEvent('handleTrackTouchEnd', function (e) {
-        return sliderController.handleMove(component, e, 'end');
-    });
-    var tickList = useMemo(function () {
-        var step = props.step, min = props.min, max = props.max, showTicks = props.showTicks;
-        if (!showTicks) {
-            return [];
-        }
-        var tickList = [];
-        var stepCount = (max - min) / step;
-        for (var i = 0; i <= stepCount; i += 1) {
-            tickList.push({
-                left: i * (100 / stepCount),
-                value: i * step + min,
-            });
-        }
-        return tickList;
-    }, [props]);
-    var _d = useMemo(function () {
-        var _a, _b;
-        var roundedValue = value;
+        return [
+            Math.round(value[0] / step) * step,
+            Math.round(value[1] / step) * step,
+        ];
+    },
+    setSliderStyleByValue: function (roundedValue) {
         var leftValue = 0;
         var rightValue = 0;
-        var max = (_a = props.max) !== null && _a !== void 0 ? _a : sliderDefaultProps.max;
-        var min = (_b = props.min) !== null && _b !== void 0 ? _b : sliderDefaultProps.min;
+        var _a = getValueFromProps(this, [
+            'min',
+            'max',
+        ]), minFromProps = _a[0], maxFromProps = _a[1];
+        var max = maxFromProps !== null && maxFromProps !== void 0 ? maxFromProps : sliderDefaultProps.max;
+        var min = minFromProps !== null && minFromProps !== void 0 ? minFromProps : sliderDefaultProps.min;
         if (roundedValue !== undefined) {
@@ -105,11 +94,210 @@ if (typeof roundedValue === 'number') {
         var left = ((leftValue - min) / (max - min)) * 100;
-        return {
+        this.setData({
             sliderLeft: left,
             sliderWidth: width,
-        };
-    }, [value]), sliderLeft = _d.sliderLeft, sliderWidth = _d.sliderWidth;
-    return __assign({ mixin: {
-            value: value,
-        }, tickList: tickList, sliderLeft: sliderLeft, sliderWidth: sliderWidth }, moveStatus);
-};
-mountComponent(Slider, SliderFunctionalProps);
+        });
+    },
+    setTickList: function () {
+        var _a = getValueFromProps(this, [
+            'step',
+            'min',
+            'max',
+            'showTicks',
+        ]), step = _a[0], min = _a[1], max = _a[2], showTicks = _a[3];
+        if (!showTicks) {
+            return;
+        }
+        var tickList = [];
+        var stepCount = (max - min) / step;
+        for (var i = 0; i <= stepCount; i += 1) {
+            tickList.push({
+                left: i * (100 / stepCount),
+                value: i * step + min,
+            });
+        }
+        this.setData({
+            tickList: tickList,
+        });
+    },
+    onTouchChanged: function (e, type) {
+        return __awaiter(this, void 0, void 0, function () {
+            var changeMoving, rect, _a, min, max, range, touchPosition, value, currentValue, leftValue, rightValue, leftDistance, rightDistance, isFarFromLeft, farValue;
+            var _this = this;
+            return __generator(this, function (_b) {
+                switch (_b.label) {
+                    case 0:
+                        if (getValueFromProps(this, 'disabled')) {
+                            return [2 /*return*/];
+                        }
+                        changeMoving = function (params) {
+                            var newParams = {};
+                            for (var key in params) {
+                                if (params[key] !== _this.data[key]) {
+                                    newParams[key] = params[key];
+                                }
+                            }
+                            if (Object.keys(newParams).length > 0) {
+                                _this.setData(newParams);
+                            }
+                        };
+                        return [4 /*yield*/, this.getRect(e)];
+                    case 1:
+                        rect = _b.sent();
+                        if (!rect)
+                            return [2 /*return*/];
+                        _a = getValueFromProps(this, [
+                            'min',
+                            'max',
+                            'range',
+                        ]), min = _a[0], max = _a[1], range = _a[2];
+                        touchPosition = (rect.touch.pageX - rect.element.left) / rect.element.width;
+                        value = min + touchPosition * (max - min);
+                        if (!range) {
+                            this.update(value, {}, !this.isControlled(), true);
+                            changeMoving({ changingEnd: true });
+                        }
+                        else {
+                            currentValue = this.getValue();
+                            leftValue = currentValue[0];
+                            rightValue = currentValue[1];
+                            leftDistance = Math.abs(leftValue - value);
+                            rightDistance = Math.abs(rightValue - value);
+                            isFarFromLeft = leftDistance > rightDistance;
+                            farValue = isFarFromLeft ? leftValue : rightValue;
+                            this.update([value, farValue], {}, !this.isControlled(), 'onChange');
+                            if (isFarFromLeft) {
+                                changeMoving({ changingEnd: true });
+                            }
+                            else {
+                                changeMoving({ changingStart: true });
+                            }
+                        }
+                        if (type === 'end') {
+                            changeMoving({ changingEnd: false, changingStart: false });
+                            triggerEvent(this, 'afterChange', this.getValue(), e);
+                        }
+                        return [2 /*return*/];
+                }
+            });
+        });
+    },
+    getRect: function (e) {
+        return __awaiter(this, void 0, void 0, function () {
+            var element, touch;
+            return __generator(this, function (_a) {
+                switch (_a.label) {
+                    case 0: return [4 /*yield*/, getInstanceBoundingClientRect(this.getInstance(), "#ant-slider-id-".concat(this.$id || ''))];
+                    case 1:
+                        element = _a.sent();
+                        touch = e.changedTouches[0];
+                        if (element) {
+                            return [2 /*return*/, {
+                                    touch: {
+                                        pageX: touch.pageX,
+                                    },
+                                    element: {
+                                        left: element.left,
+                                        width: element.width,
+                                    },
+                                }];
+                        }
+                        return [2 /*return*/];
+                }
+            });
+        });
+    },
+    cloneSliderValue: function (value) {
+        if (typeof value === 'object') {
+            return [value[0], value[1]];
+        }
+        return value;
+    },
+    isSliderValueEqual: function (value1, value2) {
+        if (value1 === value2) {
+            return true;
+        }
+        if (value1 === undefined || value2 === undefined) {
+            return false;
+        }
+        if (typeof value1 === 'number' || typeof value2 == 'number') {
+            return value1 === value2;
+        }
+        if (value1[0] === value2[0] && value1[1] === value2[1]) {
+            return true;
+        }
+        return false;
+    },
+    fitSliderValue: function (value, min, max, step, isRange) {
+        if (value === undefined || value === null) {
+            if (isRange) {
+                return [min, min];
+            }
+            else {
+                return min !== null && min !== void 0 ? min : 0;
+            }
+        }
+        if (typeof value === 'number') {
+            if (value > max) {
+                return max;
+            }
+            if (value < min) {
+                return min;
+            }
+            return value;
+        }
+        var leftValue = Math.min(value[0], value[1]);
+        var rightValue = Math.max(value[0], value[1]);
+        return [
+            Math.max(min, leftValue),
+            Math.min(max, rightValue),
+        ];
+    },
+    handleTrackTouchStart: function (e) {
+        this.onTouchChanged(e, 'start');
+    },
+    handleTrackTouchMove: function (e) {
+        this.onTouchChanged(e, 'move');
+    },
+    handleTrackTouchEnd: function (e) {
+        this.onTouchChanged(e, 'end');
+    },
+}, {
+    sliderLeft: 0,
+    sliderWidth: 0,
+    tickList: [],
+    changingStart: false,
+    changingEnd: false,
+}, [
+    createValue({
+        transformValue: function (val, extra, needUpdate, emit) {
+            if (needUpdate === void 0) { needUpdate = true; }
+            var value = this.formatValue(val);
+            if (needUpdate) {
+                this.setSliderStyleByValue(value);
+                this.setTickList();
+            }
+            this.onChangeValue =
+                typeof this.onChangeValue === 'undefined'
+                    ? this.getValue()
+                    : this.onChangeValue;
+            if (emit &&
+                getValueFromProps(this, 'onChange') &&
+                !this.isSliderValueEqual(this.onChangeValue, value)) {
+                this.onChangeValue = value;
+                triggerEvent(this, 'change', value);
+            }
+            return {
+                value: value,
+                needUpdate: needUpdate,
+            };
+        },
+    }),
+], {
+    onChangeValue: undefined,
+    observers: {
+        'min, max, step, range, showTicks': function () {
+            var value = getValueFromProps(this, 'value');
+            this.update(value);
+        },
+    },
+});

compiled/wechat/src/Slider/props.js

 export var sliderDefaultProps = {
-    min: 0,
-    max: 100,
-    step: 1,
-};
-export var SliderFunctionalProps = {
     value: null,
@@ -8,0 +3,0 @@ defaultValue: null,

es/Form/FormSlider/props.js

 import { __assign, __rest } from "tslib";
 import { FormItemFunctionalProps } from '../FormItem/props';
-import { SliderFunctionalProps } from '../../Slider/props';
+import { sliderDefaultProps } from '../../Slider/props';
 // eslint-disable-next-line @typescript-eslint/no-unused-vars
-var value = SliderFunctionalProps.value, defaultValue = SliderFunctionalProps.defaultValue, rest = __rest(SliderFunctionalProps, ["value", "defaultValue"]);
+var value = sliderDefaultProps.value, defaultValue = sliderDefaultProps.defaultValue, rest = __rest(sliderDefaultProps, ["value", "defaultValue"]);
 export var FormSliderDefaultProps = __assign(__assign(__assign({}, FormItemFunctionalProps), rest), { sliderClassName: '', sliderStyle: '' });

es/Slider/index.d.ts

@@ -1,1 +0,1 @@
-import '../_util/assert-component2';
+export {};

es/Slider/index.js

@@ -1,82 +0,47 @@
-import { __assign } from "tslib";
-import { useEvent, useMemo, useRef, useState, useComponent, } from 'functional-mini/component';
-import '../_util/assert-component2';
-import { mountComponent } from '../_util/component';
-import { useComponentEvent } from '../_util/hooks/useComponentEvent';
-import { useMixState } from '../_util/hooks/useMixState';
-import { SliderController } from './controller';
-import { sliderDefaultProps, SliderFunctionalProps, } from './props';
-var useSliderController = function (props) {
-    var controllerRef = useRef();
-    if (!controllerRef.current) {
-        controllerRef.current = new SliderController(0, props);
-    }
-    return controllerRef.current;
-};
-var Slider = function (props) {
-    var component = useComponent();
-    var sliderController = useSliderController(props);
-    var _a = useMixState(props.defaultValue, {
-        value: props.value,
-        postState: function (value) {
-            return {
-                valid: true,
-                value: sliderController.formatValue(value),
-            };
-        },
-    }), value = _a[0], _b = _a[1], update = _b.update, isControlled = _b.isControlled;
-    var _c = useState({
-        changingStart: false,
-        changingEnd: false,
-    }), moveStatus = _c[0], setMoveStatus = _c[1];
-    var triggerEvent = useComponentEvent(props).triggerEvent;
-    sliderController.updateProps(props);
-    sliderController.updateValue(value);
-    sliderController.updateMoveStatus(moveStatus);
-    sliderController.onChange(function (v, moveStatus, _a) {
-        var valueChange = _a.valueChange, moveStatusChange = _a.moveStatusChange, type = _a.type, event = _a.event;
-        if (!isControlled) {
-            update(v);
+import { __awaiter, __generator } from "tslib";
+import { Component, triggerEvent, getValueFromProps } from '../_util/simply';
+import equal from 'fast-deep-equal';
+import { getInstanceBoundingClientRect } from '../_util/jsapi/get-instance-bounding-client-rect';
+import { sliderDefaultProps } from './props';
+import createValue from '../mixins/value';
+Component(sliderDefaultProps, {
+    getInstance: function () {
+        if (this.$id) {
+            return my;
         }
-        if (valueChange) {
-            triggerEvent('change', v);
+        return this;
+    },
+    formatValue: function (val) {
+        var _a = getValueFromProps(this, [
+            'min',
+            'max',
+            'step',
+            'range',
+        ]), min = _a[0], max = _a[1], step = _a[2], range = _a[3];
+        var value = this.fitSliderValue(val, min, max, step, range);
+        value = this.getRoundedValue(value, step);
+        return value;
+    },
+    getRoundedValue: function (value, step) {
+        if (step === void 0) { step = 1; }
+        if (value === undefined) {
+            return 0;
         }
-        if (moveStatusChange) {
-            setMoveStatus(function (v2) { return (__assign(__assign({}, v2), moveStatus)); });
+        if (typeof value === 'number') {
+            return Math.round(value / step) * step;
         }
-        if (value && type === 'end') {
-            triggerEvent('afterChange', v, event);
-        }
-    });
-    useEvent('handleTrackTouchStart', function (e) {
-        return sliderController.handleMove(component, e, 'start');
-    });
-    useEvent('handleTrackTouchMove', function (e) {
-        return sliderController.handleMove(component, e, 'move');
-    });
-    useEvent('handleTrackTouchEnd', function (e) {
-        return sliderController.handleMove(component, e, 'end');
-    });
-    var tickList = useMemo(function () {
-        var step = props.step, min = props.min, max = props.max, showTicks = props.showTicks;
-        if (!showTicks) {
-            return [];
-        }
-        var tickList = [];
-        var stepCount = (max - min) / step;
-        for (var i = 0; i <= stepCount; i += 1) {
-            tickList.push({
-                left: i * (100 / stepCount),
-                value: i * step + min,
-            });
-        }
-        return tickList;
-    }, [props]);
-    var _d = useMemo(function () {
-        var _a, _b;
-        var roundedValue = value;
+        return [
+            Math.round(value[0] / step) * step,
+            Math.round(value[1] / step) * step,
+        ];
+    },
+    setSliderStyleByValue: function (roundedValue) {
         var leftValue = 0;
         var rightValue = 0;
-        var max = (_a = props.max) !== null && _a !== void 0 ? _a : sliderDefaultProps.max;
-        var min = (_b = props.min) !== null && _b !== void 0 ? _b : sliderDefaultProps.min;
+        var _a = getValueFromProps(this, [
+            'min',
+            'max',
+        ]), minFromProps = _a[0], maxFromProps = _a[1];
+        var max = maxFromProps !== null && maxFromProps !== void 0 ? maxFromProps : sliderDefaultProps.max;
+        var min = minFromProps !== null && minFromProps !== void 0 ? minFromProps : sliderDefaultProps.min;
         if (roundedValue !== undefined) {
@@ -95,11 +60,214 @@ if (typeof roundedValue === 'number') {
         var left = ((leftValue - min) / (max - min)) * 100;
-        return {
+        this.setData({
             sliderLeft: left,
             sliderWidth: width,
-        };
-    }, [value]), sliderLeft = _d.sliderLeft, sliderWidth = _d.sliderWidth;
-    return __assign({ mixin: {
-            value: value,
-        }, tickList: tickList, sliderLeft: sliderLeft, sliderWidth: sliderWidth }, moveStatus);
-};
-mountComponent(Slider, SliderFunctionalProps);
+        });
+    },
+    setTickList: function () {
+        var _a = getValueFromProps(this, [
+            'step',
+            'min',
+            'max',
+            'showTicks',
+        ]), step = _a[0], min = _a[1], max = _a[2], showTicks = _a[3];
+        if (!showTicks) {
+            return;
+        }
+        var tickList = [];
+        var stepCount = (max - min) / step;
+        for (var i = 0; i <= stepCount; i += 1) {
+            tickList.push({
+                left: i * (100 / stepCount),
+                value: i * step + min,
+            });
+        }
+        this.setData({
+            tickList: tickList,
+        });
+    },
+    onTouchChanged: function (e, type) {
+        return __awaiter(this, void 0, void 0, function () {
+            var changeMoving, rect, _a, min, max, range, touchPosition, value, currentValue, leftValue, rightValue, leftDistance, rightDistance, isFarFromLeft, farValue;
+            var _this = this;
+            return __generator(this, function (_b) {
+                switch (_b.label) {
+                    case 0:
+                        if (getValueFromProps(this, 'disabled')) {
+                            return [2 /*return*/];
+                        }
+                        changeMoving = function (params) {
+                            var newParams = {};
+                            for (var key in params) {
+                                if (params[key] !== _this.data[key]) {
+                                    newParams[key] = params[key];
+                                }
+                            }
+                            if (Object.keys(newParams).length > 0) {
+                                _this.setData(newParams);
+                            }
+                        };
+                        return [4 /*yield*/, this.getRect(e)];
+                    case 1:
+                        rect = _b.sent();
+                        if (!rect)
+                            return [2 /*return*/];
+                        _a = getValueFromProps(this, [
+                            'min',
+                            'max',
+                            'range',
+                        ]), min = _a[0], max = _a[1], range = _a[2];
+                        touchPosition = (rect.touch.pageX - rect.element.left) / rect.element.width;
+                        value = min + touchPosition * (max - min);
+                        if (!range) {
+                            this.update(value, {}, !this.isControlled(), true);
+                            changeMoving({ changingEnd: true });
+                        }
+                        else {
+                            currentValue = this.getValue();
+                            leftValue = currentValue[0];
+                            rightValue = currentValue[1];
+                            leftDistance = Math.abs(leftValue - value);
+                            rightDistance = Math.abs(rightValue - value);
+                            isFarFromLeft = leftDistance > rightDistance;
+                            farValue = isFarFromLeft ? leftValue : rightValue;
+                            this.update([value, farValue], {}, !this.isControlled(), 'onChange');
+                            if (isFarFromLeft) {
+                                changeMoving({ changingEnd: true });
+                            }
+                            else {
+                                changeMoving({ changingStart: true });
+                            }
+                        }
+                        if (type === 'end') {
+                            changeMoving({ changingEnd: false, changingStart: false });
+                            triggerEvent(this, 'afterChange', this.getValue(), e);
+                        }
+                        return [2 /*return*/];
+                }
+            });
+        });
+    },
+    getRect: function (e) {
+        return __awaiter(this, void 0, void 0, function () {
+            var element, touch;
+            return __generator(this, function (_a) {
+                switch (_a.label) {
+                    case 0: return [4 /*yield*/, getInstanceBoundingClientRect(this.getInstance(), "#ant-slider-id-".concat(this.$id || ''))];
+                    case 1:
+                        element = _a.sent();
+                        touch = e.changedTouches[0];
+                        if (element) {
+                            return [2 /*return*/, {
+                                    touch: {
+                                        pageX: touch.pageX,
+                                    },
+                                    element: {
+                                        left: element.left,
+                                        width: element.width,
+                                    },
+                                }];
+                        }
+                        return [2 /*return*/];
+                }
+            });
+        });
+    },
+    cloneSliderValue: function (value) {
+        if (typeof value === 'object') {
+            return [value[0], value[1]];
+        }
+        return value;
+    },
+    isSliderValueEqual: function (value1, value2) {
+        if (value1 === value2) {
+            return true;
+        }
+        if (value1 === undefined || value2 === undefined) {
+            return false;
+        }
+        if (typeof value1 === 'number' || typeof value2 == 'number') {
+            return value1 === value2;
+        }
+        if (value1[0] === value2[0] && value1[1] === value2[1]) {
+            return true;
+        }
+        return false;
+    },
+    fitSliderValue: function (value, min, max, step, isRange) {
+        if (value === undefined || value === null) {
+            if (isRange) {
+                return [min, min];
+            }
+            else {
+                return min !== null && min !== void 0 ? min : 0;
+            }
+        }
+        if (typeof value === 'number') {
+            if (value > max) {
+                return max;
+            }
+            if (value < min) {
+                return min;
+            }
+            return value;
+        }
+        var leftValue = Math.min(value[0], value[1]);
+        var rightValue = Math.max(value[0], value[1]);
+        return [
+            Math.max(min, leftValue),
+            Math.min(max, rightValue),
+        ];
+    },
+    handleTrackTouchStart: function (e) {
+        this.onTouchChanged(e, 'start');
+    },
+    handleTrackTouchMove: function (e) {
+        this.onTouchChanged(e, 'move');
+    },
+    handleTrackTouchEnd: function (e) {
+        this.onTouchChanged(e, 'end');
+    },
+}, {
+    sliderLeft: 0,
+    sliderWidth: 0,
+    tickList: [],
+    changingStart: false,
+    changingEnd: false,
+}, [
+    createValue({
+        transformValue: function (val, extra, needUpdate, emit) {
+            if (needUpdate === void 0) { needUpdate = true; }
+            var value = this.formatValue(val);
+            if (needUpdate) {
+                this.setSliderStyleByValue(value);
+                this.setTickList();
+            }
+            this.onChangeValue =
+                typeof this.onChangeValue === 'undefined'
+                    ? this.getValue()
+                    : this.onChangeValue;
+            if (emit &&
+                getValueFromProps(this, 'onChange') &&
+                !this.isSliderValueEqual(this.onChangeValue, value)) {
+                this.onChangeValue = value;
+                triggerEvent(this, 'change', value);
+            }
+            return {
+                value: value,
+                needUpdate: needUpdate,
+            };
+        },
+    }),
+], {
+    onChangeValue: undefined,
+    didUpdate: function (prevProps) {
+        var _a = getValueFromProps(this, ['min', 'max', 'step', 'range', 'showTicks', 'value']), min = _a[0], max = _a[1], step = _a[2], range = _a[3], showTicks = _a[4], value = _a[5];
+        if (!equal(min, prevProps.min) ||
+            !equal(max, prevProps.max) ||
+            !equal(step, prevProps.step) ||
+            !equal(range, prevProps.range) ||
+            !equal(showTicks, prevProps.showTicks)) {
+            this.update(value);
+        }
+    },
+});

es/Slider/props.d.ts

@@ -79,2 +79,1 @@ import { IBaseProps } from '../_util/base';
 export declare const sliderDefaultProps: Partial<ISliderProps>;
-export declare const SliderFunctionalProps: Partial<ISliderProps>;

es/Slider/props.js

 export var sliderDefaultProps = {
-    min: 0,
-    max: 100,
-    step: 1,
-};
-export var SliderFunctionalProps = {
     value: null,
@@ -8,0 +3,0 @@ defaultValue: null,

less/Form/FormSlider/props.js

 import { __assign, __rest } from "tslib";
 import { FormItemFunctionalProps } from '../FormItem/props';
-import { SliderFunctionalProps } from '../../Slider/props';
+import { sliderDefaultProps } from '../../Slider/props';
 // eslint-disable-next-line @typescript-eslint/no-unused-vars
-var value = SliderFunctionalProps.value, defaultValue = SliderFunctionalProps.defaultValue, rest = __rest(SliderFunctionalProps, ["value", "defaultValue"]);
+var value = sliderDefaultProps.value, defaultValue = sliderDefaultProps.defaultValue, rest = __rest(sliderDefaultProps, ["value", "defaultValue"]);
 export var FormSliderDefaultProps = __assign(__assign(__assign({}, FormItemFunctionalProps), rest), { sliderClassName: '', sliderStyle: '' });

less/Slider/index.d.ts

@@ -1,1 +0,1 @@
-import '../_util/assert-component2';
+export {};

less/Slider/index.js

@@ -1,82 +0,47 @@
-import { __assign } from "tslib";
-import { useEvent, useMemo, useRef, useState, useComponent, } from 'functional-mini/component';
-import '../_util/assert-component2';
-import { mountComponent } from '../_util/component';
-import { useComponentEvent } from '../_util/hooks/useComponentEvent';
-import { useMixState } from '../_util/hooks/useMixState';
-import { SliderController } from './controller';
-import { sliderDefaultProps, SliderFunctionalProps, } from './props';
-var useSliderController = function (props) {
-    var controllerRef = useRef();
-    if (!controllerRef.current) {
-        controllerRef.current = new SliderController(0, props);
-    }
-    return controllerRef.current;
-};
-var Slider = function (props) {
-    var component = useComponent();
-    var sliderController = useSliderController(props);
-    var _a = useMixState(props.defaultValue, {
-        value: props.value,
-        postState: function (value) {
-            return {
-                valid: true,
-                value: sliderController.formatValue(value),
-            };
-        },
-    }), value = _a[0], _b = _a[1], update = _b.update, isControlled = _b.isControlled;
-    var _c = useState({
-        changingStart: false,
-        changingEnd: false,
-    }), moveStatus = _c[0], setMoveStatus = _c[1];
-    var triggerEvent = useComponentEvent(props).triggerEvent;
-    sliderController.updateProps(props);
-    sliderController.updateValue(value);
-    sliderController.updateMoveStatus(moveStatus);
-    sliderController.onChange(function (v, moveStatus, _a) {
-        var valueChange = _a.valueChange, moveStatusChange = _a.moveStatusChange, type = _a.type, event = _a.event;
-        if (!isControlled) {
-            update(v);
+import { __awaiter, __generator } from "tslib";
+import { Component, triggerEvent, getValueFromProps } from '../_util/simply';
+import equal from 'fast-deep-equal';
+import { getInstanceBoundingClientRect } from '../_util/jsapi/get-instance-bounding-client-rect';
+import { sliderDefaultProps } from './props';
+import createValue from '../mixins/value';
+Component(sliderDefaultProps, {
+    getInstance: function () {
+        if (this.$id) {
+            return my;
         }
-        if (valueChange) {
-            triggerEvent('change', v);
+        return this;
+    },
+    formatValue: function (val) {
+        var _a = getValueFromProps(this, [
+            'min',
+            'max',
+            'step',
+            'range',
+        ]), min = _a[0], max = _a[1], step = _a[2], range = _a[3];
+        var value = this.fitSliderValue(val, min, max, step, range);
+        value = this.getRoundedValue(value, step);
+        return value;
+    },
+    getRoundedValue: function (value, step) {
+        if (step === void 0) { step = 1; }
+        if (value === undefined) {
+            return 0;
         }
-        if (moveStatusChange) {
-            setMoveStatus(function (v2) { return (__assign(__assign({}, v2), moveStatus)); });
+        if (typeof value === 'number') {
+            return Math.round(value / step) * step;
         }
-        if (value && type === 'end') {
-            triggerEvent('afterChange', v, event);
-        }
-    });
-    useEvent('handleTrackTouchStart', function (e) {
-        return sliderController.handleMove(component, e, 'start');
-    });
-    useEvent('handleTrackTouchMove', function (e) {
-        return sliderController.handleMove(component, e, 'move');
-    });
-    useEvent('handleTrackTouchEnd', function (e) {
-        return sliderController.handleMove(component, e, 'end');
-    });
-    var tickList = useMemo(function () {
-        var step = props.step, min = props.min, max = props.max, showTicks = props.showTicks;
-        if (!showTicks) {
-            return [];
-        }
-        var tickList = [];
-        var stepCount = (max - min) / step;
-        for (var i = 0; i <= stepCount; i += 1) {
-            tickList.push({
-                left: i * (100 / stepCount),
-                value: i * step + min,
-            });
-        }
-        return tickList;
-    }, [props]);
-    var _d = useMemo(function () {
-        var _a, _b;
-        var roundedValue = value;
+        return [
+            Math.round(value[0] / step) * step,
+            Math.round(value[1] / step) * step,
+        ];
+    },
+    setSliderStyleByValue: function (roundedValue) {
         var leftValue = 0;
         var rightValue = 0;
-        var max = (_a = props.max) !== null && _a !== void 0 ? _a : sliderDefaultProps.max;
-        var min = (_b = props.min) !== null && _b !== void 0 ? _b : sliderDefaultProps.min;
+        var _a = getValueFromProps(this, [
+            'min',
+            'max',
+        ]), minFromProps = _a[0], maxFromProps = _a[1];
+        var max = maxFromProps !== null && maxFromProps !== void 0 ? maxFromProps : sliderDefaultProps.max;
+        var min = minFromProps !== null && minFromProps !== void 0 ? minFromProps : sliderDefaultProps.min;
         if (roundedValue !== undefined) {
@@ -95,11 +60,214 @@ if (typeof roundedValue === 'number') {
         var left = ((leftValue - min) / (max - min)) * 100;
-        return {
+        this.setData({
             sliderLeft: left,
             sliderWidth: width,
-        };
-    }, [value]), sliderLeft = _d.sliderLeft, sliderWidth = _d.sliderWidth;
-    return __assign({ mixin: {
-            value: value,
-        }, tickList: tickList, sliderLeft: sliderLeft, sliderWidth: sliderWidth }, moveStatus);
-};
-mountComponent(Slider, SliderFunctionalProps);
+        });
+    },
+    setTickList: function () {
+        var _a = getValueFromProps(this, [
+            'step',
+            'min',
+            'max',
+            'showTicks',
+        ]), step = _a[0], min = _a[1], max = _a[2], showTicks = _a[3];
+        if (!showTicks) {
+            return;
+        }
+        var tickList = [];
+        var stepCount = (max - min) / step;
+        for (var i = 0; i <= stepCount; i += 1) {
+            tickList.push({
+                left: i * (100 / stepCount),
+                value: i * step + min,
+            });
+        }
+        this.setData({
+            tickList: tickList,
+        });
+    },
+    onTouchChanged: function (e, type) {
+        return __awaiter(this, void 0, void 0, function () {
+            var changeMoving, rect, _a, min, max, range, touchPosition, value, currentValue, leftValue, rightValue, leftDistance, rightDistance, isFarFromLeft, farValue;
+            var _this = this;
+            return __generator(this, function (_b) {
+                switch (_b.label) {
+                    case 0:
+                        if (getValueFromProps(this, 'disabled')) {
+                            return [2 /*return*/];
+                        }
+                        changeMoving = function (params) {
+                            var newParams = {};
+                            for (var key in params) {
+                                if (params[key] !== _this.data[key]) {
+                                    newParams[key] = params[key];
+                                }
+                            }
+                            if (Object.keys(newParams).length > 0) {
+                                _this.setData(newParams);
+                            }
+                        };
+                        return [4 /*yield*/, this.getRect(e)];
+                    case 1:
+                        rect = _b.sent();
+                        if (!rect)
+                            return [2 /*return*/];
+                        _a = getValueFromProps(this, [
+                            'min',
+                            'max',
+                            'range',
+                        ]), min = _a[0], max = _a[1], range = _a[2];
+                        touchPosition = (rect.touch.pageX - rect.element.left) / rect.element.width;
+                        value = min + touchPosition * (max - min);
+                        if (!range) {
+                            this.update(value, {}, !this.isControlled(), true);
+                            changeMoving({ changingEnd: true });
+                        }
+                        else {
+                            currentValue = this.getValue();
+                            leftValue = currentValue[0];
+                            rightValue = currentValue[1];
+                            leftDistance = Math.abs(leftValue - value);
+                            rightDistance = Math.abs(rightValue - value);
+                            isFarFromLeft = leftDistance > rightDistance;
+                            farValue = isFarFromLeft ? leftValue : rightValue;
+                            this.update([value, farValue], {}, !this.isControlled(), 'onChange');
+                            if (isFarFromLeft) {
+                                changeMoving({ changingEnd: true });
+                            }
+                            else {
+                                changeMoving({ changingStart: true });
+                            }
+                        }
+                        if (type === 'end') {
+                            changeMoving({ changingEnd: false, changingStart: false });
+                            triggerEvent(this, 'afterChange', this.getValue(), e);
+                        }
+                        return [2 /*return*/];
+                }
+            });
+        });
+    },
+    getRect: function (e) {
+        return __awaiter(this, void 0, void 0, function () {
+            var element, touch;
+            return __generator(this, function (_a) {
+                switch (_a.label) {
+                    case 0: return [4 /*yield*/, getInstanceBoundingClientRect(this.getInstance(), "#ant-slider-id-".concat(this.$id || ''))];
+                    case 1:
+                        element = _a.sent();
+                        touch = e.changedTouches[0];
+                        if (element) {
+                            return [2 /*return*/, {
+                                    touch: {
+                                        pageX: touch.pageX,
+                                    },
+                                    element: {
+                                        left: element.left,
+                                        width: element.width,
+                                    },
+                                }];
+                        }
+                        return [2 /*return*/];
+                }
+            });
+        });
+    },
+    cloneSliderValue: function (value) {
+        if (typeof value === 'object') {
+            return [value[0], value[1]];
+        }
+        return value;
+    },
+    isSliderValueEqual: function (value1, value2) {
+        if (value1 === value2) {
+            return true;
+        }
+        if (value1 === undefined || value2 === undefined) {
+            return false;
+        }
+        if (typeof value1 === 'number' || typeof value2 == 'number') {
+            return value1 === value2;
+        }
+        if (value1[0] === value2[0] && value1[1] === value2[1]) {
+            return true;
+        }
+        return false;
+    },
+    fitSliderValue: function (value, min, max, step, isRange) {
+        if (value === undefined || value === null) {
+            if (isRange) {
+                return [min, min];
+            }
+            else {
+                return min !== null && min !== void 0 ? min : 0;
+            }
+        }
+        if (typeof value === 'number') {
+            if (value > max) {
+                return max;
+            }
+            if (value < min) {
+                return min;
+            }
+            return value;
+        }
+        var leftValue = Math.min(value[0], value[1]);
+        var rightValue = Math.max(value[0], value[1]);
+        return [
+            Math.max(min, leftValue),
+            Math.min(max, rightValue),
+        ];
+    },
+    handleTrackTouchStart: function (e) {
+        this.onTouchChanged(e, 'start');
+    },
+    handleTrackTouchMove: function (e) {
+        this.onTouchChanged(e, 'move');
+    },
+    handleTrackTouchEnd: function (e) {
+        this.onTouchChanged(e, 'end');
+    },
+}, {
+    sliderLeft: 0,
+    sliderWidth: 0,
+    tickList: [],
+    changingStart: false,
+    changingEnd: false,
+}, [
+    createValue({
+        transformValue: function (val, extra, needUpdate, emit) {
+            if (needUpdate === void 0) { needUpdate = true; }
+            var value = this.formatValue(val);
+            if (needUpdate) {
+                this.setSliderStyleByValue(value);
+                this.setTickList();
+            }
+            this.onChangeValue =
+                typeof this.onChangeValue === 'undefined'
+                    ? this.getValue()
+                    : this.onChangeValue;
+            if (emit &&
+                getValueFromProps(this, 'onChange') &&
+                !this.isSliderValueEqual(this.onChangeValue, value)) {
+                this.onChangeValue = value;
+                triggerEvent(this, 'change', value);
+            }
+            return {
+                value: value,
+                needUpdate: needUpdate,
+            };
+        },
+    }),
+], {
+    onChangeValue: undefined,
+    didUpdate: function (prevProps) {
+        var _a = getValueFromProps(this, ['min', 'max', 'step', 'range', 'showTicks', 'value']), min = _a[0], max = _a[1], step = _a[2], range = _a[3], showTicks = _a[4], value = _a[5];
+        if (!equal(min, prevProps.min) ||
+            !equal(max, prevProps.max) ||
+            !equal(step, prevProps.step) ||
+            !equal(range, prevProps.range) ||
+            !equal(showTicks, prevProps.showTicks)) {
+            this.update(value);
+        }
+    },
+});

less/Slider/props.d.ts

@@ -79,2 +79,1 @@ import { IBaseProps } from '../_util/base';
 export declare const sliderDefaultProps: Partial<ISliderProps>;
-export declare const SliderFunctionalProps: Partial<ISliderProps>;

less/Slider/props.js

 export var sliderDefaultProps = {
-    min: 0,
-    max: 100,
-    step: 1,
-};
-export var SliderFunctionalProps = {
     value: null,
@@ -8,0 +3,0 @@ defaultValue: null,

package.json

 {
   "name": "antd-mini",
-  "version": "2.31.0",
+  "version": "2.31.1",
   "description": "antd-mini 是支付宝小程序 UI 组件库，遵循 Ant Design 规范。",
@@ -5,0 +5,0 @@ "miniprogram": "compiled/wechat/src",

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Worsened metrics

Total package byte prevSize

3729755

decreased by-0.22%

Number of package files

1811

decreased by-0.28%

Lines of code

39255

decreased by-0.62%

No dependency changes