amis 2.0.0-rc.10 → 2.0.0-rc.16

package/esm/renderers/Form/InputMonthRange.d.ts

@@ -0,0 +1,22 @@
+/// <reference types="react" />
+import InputDateRange, { DateRangeControlSchema } from './InputDateRange';
+/**
+ * MonthRange 月范围控件
+ * 文档：https://baidu.gitee.io/amis/docs/components/form/month-range
+ */
+export interface MonthRangeControlSchema extends Omit<DateRangeControlSchema, 'type'> {
+    type: 'input-month-range';
+}
+export default class MonthRangeControl extends InputDateRange {
+    render(): JSX.Element;
+}
+export declare class MonthRangeControlRenderer extends MonthRangeControl {
+    static defaultProps: {
+        format: string;
+        inputFormat: string;
+        joinValues: boolean;
+        delimiter: string;
+        timeFormat: string;
+        ranges: string;
+    };
+}

package/esm/renderers/Form/InputMonthRange.js

@@ -0,0 +1,46 @@
+/**
+ * amis v2.0.0-rc.16
+ * Copyright 2018-2022 baidu
+ */
+
+import { __extends, __rest, __assign, __decorate } from 'tslib';
+import React from 'react';
+import { filterDate, parseDuration, FormItem } from 'amis-core';
+import cx from 'classnames';
+import DateRangeControl from './InputDateRange.js';
+import { DateRangePicker } from 'amis-ui';
+
+var MonthRangeControl = /** @class */ (function (_super) {
+    __extends(MonthRangeControl, _super);
+    function MonthRangeControl() {
+        return _super !== null && _super.apply(this, arguments) || this;
+    }
+    MonthRangeControl.prototype.render = function () {
+        var _a = this.props, className = _a.className, ns = _a.classPrefix, minDate = _a.minDate, maxDate = _a.maxDate, minDuration = _a.minDuration, maxDuration = _a.maxDuration, data = _a.data, format = _a.format; _a.env; var rest = __rest(_a, ["className", "classPrefix", "minDate", "maxDate", "minDuration", "maxDuration", "data", "format", "env"]);
+        return (React.createElement("div", { className: cx("".concat(ns, "DateRangeControl"), className) },
+            React.createElement(DateRangePicker, __assign({ viewMode: "months", format: format, classPrefix: ns, data: data }, rest, { minDate: minDate ? filterDate(minDate, data, format) : undefined, maxDate: maxDate ? filterDate(maxDate, data, format) : undefined, minDuration: minDuration ? parseDuration(minDuration) : undefined, maxDuration: maxDuration ? parseDuration(maxDuration) : undefined, onChange: this.handleChange, onFocus: this.dispatchEvent, onBlur: this.dispatchEvent }))));
+    };
+    return MonthRangeControl;
+}(DateRangeControl));
+/** @class */ ((function (_super) {
+    __extends(MonthRangeControlRenderer, _super);
+    function MonthRangeControlRenderer() {
+        return _super !== null && _super.apply(this, arguments) || this;
+    }
+    MonthRangeControlRenderer.defaultProps = {
+        format: 'X',
+        inputFormat: 'YYYY-MM',
+        joinValues: true,
+        delimiter: ',',
+        timeFormat: '',
+        ranges: 'thismonth,prevmonth'
+    };
+    MonthRangeControlRenderer = __decorate([
+        FormItem({
+            type: 'input-month-range'
+        })
+    ], MonthRangeControlRenderer);
+    return MonthRangeControlRenderer;
+})(MonthRangeControl));
+
+export { MonthRangeControl as default };

package/esm/renderers/Form/InputNumber.d.ts

@@ -0,0 +1,128 @@
+import React from 'react';
+import { FormControlProps } from 'amis-core';
+import { Option } from 'amis-core';
+import { PlainObject, ActionObject } from 'amis-core';
+import { FormBaseControlSchema } from '../../Schema';
+/**
+ * 数字输入框
+ * 文档：https://baidu.gitee.io/amis/docs/components/form/number
+ */
+export interface NumberControlSchema extends FormBaseControlSchema {
+    type: 'input-number';
+    /**
+     * 最大值
+     */
+    max?: number;
+    /**
+     * 最小值
+     */
+    min?: number;
+    /**
+     * 步长
+     */
+    step?: number;
+    /**
+     * 精度
+     */
+    precision?: number;
+    /**
+     * 默认当然是
+     */
+    showSteps?: boolean;
+    /**
+     * 边框模式，全边框，还是半边框，或者没边框。
+     */
+    borderMode?: 'full' | 'half' | 'none';
+    /**
+     * 前缀
+     */
+    prefix?: string;
+    /**
+     * 后缀
+     */
+    suffix?: string;
+    /**
+     * 单位列表
+     */
+    unitOptions?: string | Array<Option> | string[] | PlainObject;
+    /**
+     * 是否千分分隔
+     */
+    kilobitSeparator?: boolean;
+    /**
+     * 只读
+     */
+    readOnly?: boolean;
+    /**
+     * 是否启用键盘行为
+     */
+    keyboard?: boolean;
+    /**
+     * 输入框为基础输入框还是加强输入框
+     */
+    displayMode?: 'base' | 'enhance';
+}
+export interface NumberProps extends FormControlProps {
+    placeholder?: string;
+    max?: number | string;
+    min?: number | string;
+    step?: number;
+    precision?: number;
+    /**
+     * 边框模式，全边框，还是半边框，或者没边框。
+     */
+    borderMode?: 'full' | 'half' | 'none';
+    /**
+     * 前缀
+     */
+    prefix?: string;
+    /**
+     * 后缀
+     */
+    suffix?: string;
+    /**
+     * 是否千分分隔
+     */
+    kilobitSeparator?: boolean;
+    /**
+     * 只读
+     */
+    readOnly?: boolean;
+    /**
+     * 启用键盘行为，即通过上下方向键控制是否生效
+     */
+    keyboard?: boolean;
+    /**
+     * 输入框为基础输入框还是加强输入框
+     */
+    displayMode?: 'base' | 'enhance';
+}
+interface NumberState {
+    unit?: string;
+    unitOptions?: Option[];
+}
+export declare type InputNumberRendererEvent = 'blur' | 'focus' | 'change';
+export declare type InputNumberRendererAction = 'clear';
+export default class NumberControl extends React.Component<NumberProps, NumberState> {
+    input?: HTMLInputElement;
+    static defaultProps: Partial<NumberProps>;
+    constructor(props: NumberProps);
+    /**
+     * 动作处理
+     */
+    doAction(action: ActionObject, args: any): void;
+    getUnit(): any;
+    getValue(inputValue: any): any;
+    dispatchEvent(eventName: string): Promise<void>;
+    handleChange(inputValue: any): Promise<void>;
+    filterNum(value: number | string | undefined): number | undefined;
+    handleChangeUnit(option: Option): void;
+    componentDidUpdate(prevProps: NumberProps): void;
+    inputRef(ref: any): void;
+    focus(): void;
+    render(): JSX.Element;
+}
+export declare class NumberControlRenderer extends NumberControl {
+    static defaultProps: Partial<FormControlProps>;
+}
+export {};

package/esm/renderers/Form/InputNumber.js

@@ -0,0 +1,210 @@
+/**
+ * amis v2.0.0-rc.16
+ * Copyright 2018-2022 baidu
+ */
+
+import { __extends, __awaiter, __generator, __decorate, __metadata, __assign } from 'tslib';
+import React from 'react';
+import { normalizeOptions, createObject, filter, autobind, FormItem } from 'amis-core';
+import cx from 'classnames';
+import { NumberInput, Select } from 'amis-ui';
+
+var NumberControl = /** @class */ (function (_super) {
+    __extends(NumberControl, _super);
+    function NumberControl(props) {
+        var _this = _super.call(this, props) || this;
+        _this.handleChange = _this.handleChange.bind(_this);
+        _this.handleChangeUnit = _this.handleChangeUnit.bind(_this);
+        var unit = _this.getUnit();
+        var unitOptions = normalizeOptions(props.unitOptions);
+        _this.state = { unit: unit, unitOptions: unitOptions };
+        return _this;
+    }
+    /**
+     * 动作处理
+     */
+    NumberControl.prototype.doAction = function (action, args) {
+        var actionType = action === null || action === void 0 ? void 0 : action.actionType;
+        var _a = this.props, resetValue = _a.resetValue, onChange = _a.onChange;
+        if (actionType === 'clear') {
+            onChange === null || onChange === void 0 ? void 0 : onChange('');
+        }
+        else if (actionType === 'reset') {
+            var value = this.getValue(resetValue !== null && resetValue !== void 0 ? resetValue : '');
+            onChange === null || onChange === void 0 ? void 0 : onChange(value);
+        }
+    };
+    // 解析出单位
+    NumberControl.prototype.getUnit = function () {
+        var props = this.props;
+        if (props.unitOptions && props.unitOptions.length) {
+            var optionValues = normalizeOptions(props.unitOptions).map(function (option) { return option.value; });
+            // 如果有值就解析出来作为单位
+            if (props.value && typeof props.value === 'string') {
+                var unit = optionValues[0];
+                // 先找长的字符，这样如果有 ab 和 b 两种后缀相同的也能识别
+                optionValues.sort(function (a, b) { return b.length - a.length; });
+                for (var _i = 0, optionValues_1 = optionValues; _i < optionValues_1.length; _i++) {
+                    var optionValue = optionValues_1[_i];
+                    if (props.value.endsWith(optionValue)) {
+                        unit = optionValue;
+                        break;
+                    }
+                }
+                return unit;
+            }
+            else {
+                // 没有值就使用第一个单位
+                return optionValues[0];
+            }
+        }
+        return undefined;
+    };
+    NumberControl.prototype.getValue = function (inputValue) {
+        var _a = this.props, resetValue = _a.resetValue, unitOptions = _a.unitOptions;
+        if (inputValue && typeof inputValue !== 'number') {
+            return;
+        }
+        if (inputValue !== null && unitOptions && this.state.unit) {
+            inputValue = inputValue + this.state.unit;
+        }
+        return inputValue === null ? resetValue !== null && resetValue !== void 0 ? resetValue : null : inputValue;
+    };
+    // 派发有event的事件
+    NumberControl.prototype.dispatchEvent = function (eventName) {
+        return __awaiter(this, void 0, void 0, function () {
+            var _a, dispatchEvent, data, value;
+            return __generator(this, function (_b) {
+                _a = this.props, dispatchEvent = _a.dispatchEvent, data = _a.data, value = _a.value;
+                dispatchEvent(eventName, createObject(data, {
+                    value: value
+                }));
+                return [2 /*return*/];
+            });
+        });
+    };
+    NumberControl.prototype.handleChange = function (inputValue) {
+        return __awaiter(this, void 0, void 0, function () {
+            var _a, onChange, data, dispatchEvent, value, rendererEvent;
+            return __generator(this, function (_b) {
+                switch (_b.label) {
+                    case 0:
+                        _a = this.props, onChange = _a.onChange, data = _a.data, dispatchEvent = _a.dispatchEvent;
+                        value = this.getValue(inputValue);
+                        return [4 /*yield*/, dispatchEvent('change', createObject(data, {
+                                value: value
+                            }))];
+                    case 1:
+                        rendererEvent = _b.sent();
+                        if (rendererEvent === null || rendererEvent === void 0 ? void 0 : rendererEvent.prevented) {
+                            return [2 /*return*/];
+                        }
+                        onChange(value);
+                        return [2 /*return*/];
+                }
+            });
+        });
+    };
+    NumberControl.prototype.filterNum = function (value) {
+        if (typeof value !== 'number') {
+            value = filter(value, this.props.data);
+            value = /^[-]?\d+/.test(value) ? +value : undefined;
+        }
+        return value;
+    };
+    // 单位选项的变更
+    NumberControl.prototype.handleChangeUnit = function (option) {
+        var _this = this;
+        var value = this.props.value;
+        var prevUnitValue = this.state.unit;
+        this.setState({ unit: option.value }, function () {
+            if (value) {
+                value = value.replace(prevUnitValue, '');
+                _this.props.onChange(value + _this.state.unit);
+            }
+        });
+    };
+    NumberControl.prototype.componentDidUpdate = function (prevProps) {
+        if (this.props.value !== prevProps.value) {
+            var unit = this.getUnit();
+            this.setState({ unit: unit });
+        }
+        if (this.props.unitOptions !== prevProps.unitOptions) {
+            this.setState({ unitOptions: normalizeOptions(this.props.unitOptions) });
+        }
+    };
+    NumberControl.prototype.inputRef = function (ref) {
+        this.input = ref;
+    };
+    NumberControl.prototype.focus = function () {
+        if (!this.input) {
+            return;
+        }
+        this.input.focus();
+    };
+    NumberControl.prototype.render = function () {
+        var _a;
+        var _this = this;
+        var _b;
+        var _c = this.props, className = _c.className, ns = _c.classPrefix, value = _c.value, step = _c.step, precision = _c.precision, max = _c.max, min = _c.min, disabled = _c.disabled, placeholder = _c.placeholder, showSteps = _c.showSteps, borderMode = _c.borderMode, suffix = _c.suffix, prefix = _c.prefix, kilobitSeparator = _c.kilobitSeparator, unitOptions = _c.unitOptions, readOnly = _c.readOnly, keyboard = _c.keyboard, displayMode = _c.displayMode;
+        var finalPrecision = this.filterNum(precision);
+        var unit = (_b = this.state) === null || _b === void 0 ? void 0 : _b.unit;
+        // 数据格式化
+        var formatter = function (value) {
+            // 增加千分分隔
+            if (kilobitSeparator && value) {
+                value = (value + '').replace(/\B(?=(\d{3})+(?!\d))/g, ',');
+            }
+            return (prefix ? prefix : '') + value + (suffix ? suffix : '');
+        };
+        // 将数字还原
+        var parser = function (value) {
+            if (value) {
+                prefix && (value = value.replace(prefix, ''));
+                suffix && (value = value.replace(suffix, ''));
+                kilobitSeparator && (value = value.replace(/,/g, ''));
+            }
+            return value;
+        };
+        var finalValue = unit && value && typeof value === 'string'
+            ? value.replace(unit, '')
+            : value;
+        return (React.createElement("div", { className: cx("".concat(ns, "NumberControl"), (_a = {},
+                _a["".concat(ns, "NumberControl--withUnit")] = unitOptions,
+                _a), className) },
+            React.createElement(NumberInput, { inputRef: this.inputRef, value: finalValue, step: step, max: this.filterNum(max), min: this.filterNum(min), formatter: formatter, parser: parser, onChange: this.handleChange, disabled: disabled, placeholder: placeholder, precision: finalPrecision, showSteps: showSteps, borderMode: borderMode, readOnly: readOnly, onFocus: function () { return _this.dispatchEvent('focus'); }, onBlur: function () { return _this.dispatchEvent('blur'); }, keyboard: keyboard, displayMode: displayMode }),
+            unitOptions ? (React.createElement(Select, { value: unit, clearable: false, options: this.state.unitOptions || [], onChange: this.handleChangeUnit })) : null));
+    };
+    NumberControl.defaultProps = {
+        step: 1,
+        resetValue: ''
+    };
+    __decorate([
+        autobind,
+        __metadata("design:type", Function),
+        __metadata("design:paramtypes", [String]),
+        __metadata("design:returntype", Promise)
+    ], NumberControl.prototype, "dispatchEvent", null);
+    __decorate([
+        autobind,
+        __metadata("design:type", Function),
+        __metadata("design:paramtypes", [Object]),
+        __metadata("design:returntype", void 0)
+    ], NumberControl.prototype, "inputRef", null);
+    return NumberControl;
+}(React.Component));
+/** @class */ ((function (_super) {
+    __extends(NumberControlRenderer, _super);
+    function NumberControlRenderer() {
+        return _super !== null && _super.apply(this, arguments) || this;
+    }
+    NumberControlRenderer.defaultProps = __assign({ validations: 'isNumeric' }, NumberControl.defaultProps);
+    NumberControlRenderer = __decorate([
+        FormItem({
+            type: 'input-number'
+        })
+    ], NumberControlRenderer);
+    return NumberControlRenderer;
+})(NumberControl));
+
+export { NumberControl as default };

package/esm/renderers/Form/InputQuarterRange.d.ts

@@ -0,0 +1,22 @@
+/// <reference types="react" />
+import InputDateRange, { DateRangeControlSchema } from './InputDateRange';
+/**
+ * QuarterRange 季度范围控件
+ * 文档：https://baidu.gitee.io/amis/docs/components/form/input-quarter-range
+ */
+export interface QuarterRangeControlSchema extends Omit<DateRangeControlSchema, 'type'> {
+    type: 'input-quarter-range';
+}
+export default class QuarterRangeControl extends InputDateRange {
+    render(): JSX.Element;
+}
+export declare class QuarterRangeControlRenderer extends QuarterRangeControl {
+    static defaultProps: {
+        format: string;
+        inputFormat: string;
+        joinValues: boolean;
+        delimiter: string;
+        timeFormat: string;
+        ranges: string;
+    };
+}

package/esm/renderers/Form/InputQuarterRange.js

@@ -0,0 +1,46 @@
+/**
+ * amis v2.0.0-rc.16
+ * Copyright 2018-2022 baidu
+ */
+
+import { __extends, __rest, __assign, __decorate } from 'tslib';
+import React from 'react';
+import { filterDate, parseDuration, FormItem } from 'amis-core';
+import cx from 'classnames';
+import DateRangeControl from './InputDateRange.js';
+import { DateRangePicker } from 'amis-ui';
+
+var QuarterRangeControl = /** @class */ (function (_super) {
+    __extends(QuarterRangeControl, _super);
+    function QuarterRangeControl() {
+        return _super !== null && _super.apply(this, arguments) || this;
+    }
+    QuarterRangeControl.prototype.render = function () {
+        var _a = this.props, className = _a.className, ns = _a.classPrefix, minDate = _a.minDate, maxDate = _a.maxDate, minDuration = _a.minDuration, maxDuration = _a.maxDuration, data = _a.data, format = _a.format; _a.env; var rest = __rest(_a, ["className", "classPrefix", "minDate", "maxDate", "minDuration", "maxDuration", "data", "format", "env"]);
+        return (React.createElement("div", { className: cx("".concat(ns, "DateRangeControl"), className) },
+            React.createElement(DateRangePicker, __assign({ viewMode: "quarters", format: format, classPrefix: ns, data: data }, rest, { minDate: minDate ? filterDate(minDate, data, format) : undefined, maxDate: maxDate ? filterDate(maxDate, data, format) : undefined, minDuration: minDuration ? parseDuration(minDuration) : undefined, maxDuration: maxDuration ? parseDuration(maxDuration) : undefined, onChange: this.handleChange, onFocus: this.dispatchEvent, onBlur: this.dispatchEvent }))));
+    };
+    return QuarterRangeControl;
+}(DateRangeControl));
+/** @class */ ((function (_super) {
+    __extends(QuarterRangeControlRenderer, _super);
+    function QuarterRangeControlRenderer() {
+        return _super !== null && _super.apply(this, arguments) || this;
+    }
+    QuarterRangeControlRenderer.defaultProps = {
+        format: 'X',
+        inputFormat: 'YYYY-[Q]Q',
+        joinValues: true,
+        delimiter: ',',
+        timeFormat: '',
+        ranges: 'thisquarter,prevquarter'
+    };
+    QuarterRangeControlRenderer = __decorate([
+        FormItem({
+            type: 'input-quarter-range'
+        })
+    ], QuarterRangeControlRenderer);
+    return QuarterRangeControlRenderer;
+})(QuarterRangeControl));
+
+export { QuarterRangeControl as default };