@qn-pandora/pandora-component 3.0.2 → 3.1.0

package/es/components/DateTimePicker/Base/index.js

@@ -38,11 +38,14 @@ import * as _ from 'lodash';
 import { observable, action, computed } from 'mobx';
 import { observer } from 'mobx-react';
 import { DatePicker } from 'antd';
+import { ConfigContext } from 'antd/es/config-provider';
 import bind from '../../../utils/bind';
+import { formatString } from '../../../utils/language';
 import { SDK_PREFIX } from '../../../constants/style';
 import { timeFormat } from '../../../constants/time';
+import { DateTimeLocale } from '../../../constants/language/datetime/type';
 import Button from '../../Button';
-import Collapse from '../../Collapse';
+import Collapse from '../Collapse';
 import Selector from '../../Selector';
 import NameLimiter from '../../NameLimiter';
 import RelativeTimePicker from './relativeTimePicker';
@@ -238,6 +241,7 @@ var Base = /** @class */ (function (_super) {
     Base.prototype.getAllPresetItems = function () {
         var _this = this;
         var _a = this.props, presets = _a.presets, presetMode = _a.presetMode, value = _a.value;
+        var locale = this.context.locale;
         var allPresets = presetMode === EPresetMode.COVER
             ? _.concat(presets || [])
             : _.concat(defaultPresets, presets || []);
@@ -246,7 +250,7 @@ var Base = /** @class */ (function (_super) {
             return (React.createElement("div", { key: preset.value, className: classnames(SDK_PREFIX + "-datetime-pick-item", (_a = {},
                     _a['active'] = value && preset.value === value.preset,
                     _a)), onClick: function () { return _this.handlePresetClick(preset); } },
-                React.createElement(NameLimiter, { name: preset.text })));
+                React.createElement(NameLimiter, { name: formatString(DateTimeLocale.preset[preset.value], locale) })));
         });
     };
     Base.prototype.handlePresetClick = function (preset) {
@@ -324,6 +328,7 @@ var Base = /** @class */ (function (_super) {
     };
     Base.prototype.renderRelativeContent = function () {
         var _a;
+        var locale = this.context.locale;
         var fromNum = _.get(this.relative, 'from.num', RELATIVE_DEFAULT_VALUE.FROM_NUM);
         var fromUnit = _.get(this.relative, 'from.unit', RELATIVE_DEFAULT_VALUE.FROM_UNIT);
         var toNum = _.get(this.relative, 'to.num', RELATIVE_DEFAULT_VALUE.TO_NUM);
@@ -332,20 +337,20 @@ var Base = /** @class */ (function (_super) {
             return (React.createElement("div", { className: SDK_PREFIX + "-datetime-pick-content" },
                 React.createElement("div", { className: SDK_PREFIX + "-datetime-pick-relative-container" },
                     React.createElement(RelativeTimePicker, { className: SDK_PREFIX + "-datetime-pick-relative", num: fromNum, unit: fromUnit, onChange: this.handleRetiveTimeFromChange, relativeTimeUnits: this.props.relativeTimeUnits }),
-                    React.createElement(Button, { disabled: !this.isRelativeTimeValid, className: SDK_PREFIX + "-datetime-pick-relative-confirm", onClick: this.handleRelativeChange }, "\u786E\u8BA4"))));
+                    React.createElement(Button, { disabled: !this.isRelativeTimeValid, className: SDK_PREFIX + "-datetime-pick-relative-confirm", onClick: this.handleRelativeChange }, formatString(DateTimeLocale.confirm, locale)))));
         }
         return (React.createElement("div", { className: SDK_PREFIX + "-datetime-pick-content" },
             React.createElement("div", { className: SDK_PREFIX + "-datetime-pick-relative-container" },
                 React.createElement(RelativeTimePicker, { className: SDK_PREFIX + "-datetime-pick-relative-timepicker", num: fromNum, unit: fromUnit, onChange: this.handleRetiveTimeFromChange, relativeTimeUnits: this.props.relativeTimeUnits, withoutNow: true }),
-                React.createElement("span", { className: SDK_PREFIX + "-datetime-pick-relative-container-to" }, "\u81F3"),
+                React.createElement("span", { className: SDK_PREFIX + "-datetime-pick-relative-container-to" }, formatString(DateTimeLocale.to, locale)),
                 React.createElement(RelativeTimePicker, { className: SDK_PREFIX + "-datetime-pick-relative-timepicker", num: toNum, unit: toUnit, onChange: this.handleRetiveTimeToChange, relativeTimeUnits: this.props.relativeTimeUnits })),
             React.createElement("div", { className: classnames(SDK_PREFIX + "-datetime-pick-relative-footer", (_a = {},
                     _a[SDK_PREFIX + "-datetime-pick-relative-footer-witNow"] = toUnit === RelativeUnitValue.NowStatic,
                     _a)) },
                 React.createElement("span", { className: classnames(SDK_PREFIX + "-error") }, this.relativeTimeInValid !== RelativeInvalid.Valid
-                    ? '起始时间不能大于终止时间'
+                    ? formatString(DateTimeLocale.error, locale)
                     : ''),
-                React.createElement(Button, { disabled: !this.isRelativeTimeValid, onClick: this.handleRelativeChange }, "\u786E\u8BA4"))));
+                React.createElement(Button, { disabled: !this.isRelativeTimeValid, onClick: this.handleRelativeChange }, formatString(DateTimeLocale.confirm, locale)))));
     };
     Base.prototype.render = function () {
         var _this = this;
@@ -359,17 +364,27 @@ var Base = /** @class */ (function (_super) {
             showTimeType = [TimeType.Absolute, TimeType.Relative, TimeType.Preset];
         }
         var _c = this.props, quarterTitle = _c.quarterTitle, presetTitle = _c.presetTitle, relativeTitle = _c.relativeTitle, absoluteTitle = _c.absoluteTitle;
+        var locale = this.context.locale;
+        var rangeOptions = rangePresetOptions.map(function (option) {
+            return {
+                value: option.value,
+                text: formatString(option.text, locale)
+            };
+        });
         return (React.createElement("div", { className: this.props.className },
             React.createElement(Collapse, { defaultActiveKey: this.activeKeys },
-                showTimeType.indexOf(TimeType.Preset) > -1 && (React.createElement(Panel, { title: presetTitle || '预设', key: TimeType.Preset, titleClassName: SDK_PREFIX + "-datetime-pick-title", contentClassName: SDK_PREFIX + "-datetime-pick-panel-content", className: SDK_PREFIX + "-datetime-pick-panel", disableToggle: this.props.disableToggle, onToggle: this.panelOnToggle },
+                showTimeType.indexOf(TimeType.Preset) > -1 && (React.createElement(Panel, { title: presetTitle || formatString(DateTimeLocale.preset.title, locale), key: TimeType.Preset, titleClassName: SDK_PREFIX + "-datetime-pick-title", contentClassName: SDK_PREFIX + "-datetime-pick-panel-content", className: SDK_PREFIX + "-datetime-pick-panel", disableToggle: this.props.disableToggle, onToggle: this.panelOnToggle },
                     React.createElement("div", { className: SDK_PREFIX + "-datetime-pick-preset" }, this.getAllPresetItems()))),
-                showTimeType.indexOf(TimeType.Relative) > -1 && (React.createElement(Panel, { title: relativeTitle || '相对时间', key: TimeType.Relative, titleClassName: SDK_PREFIX + "-datetime-pick-title", contentClassName: SDK_PREFIX + "-datetime-pick-panel-content", className: SDK_PREFIX + "-datetime-pick-panel", disableToggle: this.props.disableToggle, onToggle: this.panelOnToggle }, this.renderRelativeContent())),
-                showTimeType.indexOf(TimeType.Absolute) > -1 && (React.createElement(Panel, { title: absoluteTitle || '绝对时间', key: TimeType.Absolute, titleClassName: SDK_PREFIX + "-datetime-pick-title", contentClassName: SDK_PREFIX + "-datetime-pick-panel-content", className: SDK_PREFIX + "-datetime-pick-panel", disableToggle: this.props.disableToggle, onToggle: this.panelOnToggle },
+                showTimeType.indexOf(TimeType.Relative) > -1 && (React.createElement(Panel, { title: relativeTitle ||
+                        formatString(DateTimeLocale.relative.title, locale), key: TimeType.Relative, titleClassName: SDK_PREFIX + "-datetime-pick-title", contentClassName: SDK_PREFIX + "-datetime-pick-panel-content", className: SDK_PREFIX + "-datetime-pick-panel", disableToggle: this.props.disableToggle, onToggle: this.panelOnToggle }, this.renderRelativeContent())),
+                showTimeType.indexOf(TimeType.Absolute) > -1 && (React.createElement(Panel, { title: absoluteTitle ||
+                        formatString(DateTimeLocale.range.title, locale), key: TimeType.Absolute, titleClassName: SDK_PREFIX + "-datetime-pick-title", contentClassName: SDK_PREFIX + "-datetime-pick-panel-content", className: SDK_PREFIX + "-datetime-pick-panel", disableToggle: this.props.disableToggle, onToggle: this.panelOnToggle },
                     React.createElement("div", { className: classnames(SDK_PREFIX + "-datetime-pick-content", SDK_PREFIX + "-datetime-pick-absolute-content"), ref: function (ref) { return (_this.containerRef = ref); } },
-                        React.createElement(Selector, { getPopupContainer: this.getPopupContainer, options: rangePresetOptions, value: this.rangePreset, onChange: this.setRangePreset, className: SDK_PREFIX + "-datetime-pick-absolute-selector" }),
+                        React.createElement(Selector, { getPopupContainer: this.getPopupContainer, options: rangeOptions, value: this.rangePreset, onChange: this.setRangePreset, className: SDK_PREFIX + "-datetime-pick-absolute-selector" }),
                         React.createElement(DatePickerComponent, { className: classnames('range-picker', SDK_PREFIX + "-datetime-pick-absolute-date-picker"), showTime: this.props.showTime, format: this.props.timeFormat, onChange: isRangePick ? this.handleRangeChange : this.setValue, value: this.rangePickerValue, getCalendarContainer: this.getCalendarContainer, getPopupContainer: this.getPopupContainer }),
-                        React.createElement(Button, { onClick: this.handlePickerOk }, "\u786E\u8BA4")))),
-                showTimeType.indexOf(TimeType.Quarter) > -1 && (React.createElement(Panel, { title: quarterTitle || '季度', key: TimeType.Quarter, titleClassName: SDK_PREFIX + "-datetime-pick-title", contentClassName: SDK_PREFIX + "-datetime-pick-panel-content", className: classnames(SDK_PREFIX + "-datetime-pick-panel", SDK_PREFIX + "-quarter-datetime-pick-panel"), disableToggle: this.props.disableToggle, onToggle: this.panelOnToggle },
+                        React.createElement(Button, { onClick: this.handlePickerOk }, formatString(DateTimeLocale.confirm, locale))))),
+                showTimeType.indexOf(TimeType.Quarter) > -1 && (React.createElement(Panel, { title: quarterTitle ||
+                        formatString(DateTimeLocale.quarter.title, locale), key: TimeType.Quarter, titleClassName: SDK_PREFIX + "-datetime-pick-title", contentClassName: SDK_PREFIX + "-datetime-pick-panel-content", className: classnames(SDK_PREFIX + "-datetime-pick-panel", SDK_PREFIX + "-quarter-datetime-pick-panel"), disableToggle: this.props.disableToggle, onToggle: this.panelOnToggle },
                     React.createElement("div", { className: classnames(SDK_PREFIX + "-datetime-pick-quarter-content "), ref: function (ref) { return (_this.containerRef = ref); } },
                         React.createElement(Selector, { getPopupContainer: this.getPopupContainer, options: this.props.yearOptions || this.getYears(), value: (_a = this.quarterTime) === null || _a === void 0 ? void 0 : _a.year, className: SDK_PREFIX + "-selector", onChange: function (value) {
                                 _this.handleQuqrterlyTimeChange('year', value);
@@ -378,7 +393,7 @@ var Base = /** @class */ (function (_super) {
                                 _this.handleQuqrterlyTimeChange('quarter', value);
                             } })),
                     React.createElement("div", { className: SDK_PREFIX + "-datetime-pick-footer" },
-                        React.createElement(Button, { className: SDK_PREFIX + "-datetime-pick-footer-botton", onClick: this.handleQuarterlyOk, type: "primary" }, "\u786E\u8BA4")))),
+                        React.createElement(Button, { className: SDK_PREFIX + "-datetime-pick-footer-botton", onClick: this.handleQuarterlyOk, type: "primary" }, formatString(DateTimeLocale.confirm, locale))))),
                 (this.props.customTimeContents || []).map(function (content) {
                     return (React.createElement(Panel, { title: content.title, key: content.title, titleClassName: SDK_PREFIX + "-datetime-pick-title", contentClassName: SDK_PREFIX + "-datetime-pick-panel-content", className: SDK_PREFIX + "-datetime-pick-panel", disableToggle: _this.props.disableToggle, onToggle: _this.panelOnToggle }, content.Component));
                 }))));
@@ -390,6 +405,7 @@ var Base = /** @class */ (function (_super) {
         placement: 'bottom',
         showTimeType: [TimeType.Absolute, TimeType.Preset, TimeType.Relative]
     };
+    Base.contextType = ConfigContext;
     __decorate([
         observable.ref,
         __metadata("design:type", Object)

package/es/components/DateTimePicker/Base/relativeTimePicker.d.ts

@@ -17,6 +17,7 @@ interface IRetiveTimePickerProps extends ICompositedTime {
     withoutNow?: boolean;
 }
 export default class RetiveTimePicker extends React.Component<IRetiveTimePickerProps, {}> {
+    static contextType: React.Context<import("antd/es/config-provider").ConfigConsumerProps>;
     containerRef: React.RefObject<HTMLDivElement>;
     handleNumChange: (value: string | number | undefined) => void;
     handleUnitChange: (value: any) => void;

package/es/components/DateTimePicker/Base/relativeTimePicker.js

@@ -13,9 +13,12 @@ var __extends = (this && this.__extends) || (function () {
 })();
 import * as React from 'react';
 import { InputNumber } from 'antd';
+import { ConfigContext } from 'antd/es/config-provider';
 import { isNil } from 'lodash';
 import classnames from 'classnames';
+import { formatString } from '../../../utils/language';
 import { SDK_PREFIX } from '../../../constants/style';
+import { DateTimeLocale } from '../../../constants/language/datetime/type';
 import { toFormatTime } from '../../../utils/time';
 import Selector from '../../Selector';
 import { relativeTimeUnits, RelativeUnitValue } from '../constants';
@@ -64,7 +67,16 @@ var RetiveTimePicker = /** @class */ (function (_super) {
     }
     RetiveTimePicker.prototype.render = function () {
         var _a = this.props, num = _a.num, unit = _a.unit, className = _a.className, withoutNow = _a.withoutNow;
-        var options = this.props.relativeTimeUnits || relativeTimeUnits || [];
+        var locale = this.context.locale;
+        var options = this.props.relativeTimeUnits ||
+            relativeTimeUnits.map(function (option) {
+                return {
+                    text: formatString(option.text, locale),
+                    value: option.value,
+                    time: option.time
+                };
+            }) ||
+            [];
         if (withoutNow) {
             options = options.filter(function (option) {
                 return option.value !== RelativeUnitValue.Now &&
@@ -77,9 +89,10 @@ var RetiveTimePicker = /** @class */ (function (_super) {
                 React.createElement(Selector, { options: options, value: unit, showSearch: true, getPopupContainer: this.getPopupContainer, onChange: this.handleUnitChange, className: SDK_PREFIX + "-datetime-pick-unit-selector", dropdownMatchSelectWidth: false })),
             unit === RelativeUnitValue.NowStatic && (React.createElement("p", { className: SDK_PREFIX + "-datetime-pick-relative-tip" },
                 toFormatTime(num),
-                " ",
-                React.createElement("a", { onClick: this.handleNowChange }, "\u6539\u53D8\u65F6\u95F4")))));
+                ' ',
+                React.createElement("a", { onClick: this.handleNowChange }, formatString(DateTimeLocale.relative.change_time, locale))))));
     };
+    RetiveTimePicker.contextType = ConfigContext;
     return RetiveTimePicker;
 }(React.Component));
 export default RetiveTimePicker;

package/es/components/DateTimePicker/BaseMobile/Absolute/index.d.ts

@@ -20,6 +20,7 @@ interface IAbsoluteProps {
     onChancle: () => void;
 }
 export default class Absolute extends React.Component<IAbsoluteProps, any> {
+    static contextType: React.Context<import("antd/es/config-provider").ConfigConsumerProps>;
     containerRef: HTMLElement | null;
     rangePreset: RangePreset;
     range: RangePickerValue;

package/es/components/DateTimePicker/BaseMobile/Absolute/index.js

@@ -24,11 +24,14 @@ import React from 'react';
 import { observable, action, computed } from 'mobx';
 import { observer } from 'mobx-react';
 import { Divider } from 'antd';
+import { ConfigContext } from 'antd/es/config-provider';
 import moment from 'moment';
 import { get } from 'lodash';
 import DatePickerView from 'antd-mobile/es/date-picker-view';
 import Selector from '../../../../components/Selector';
+import { formatString } from '../../../../utils/language';
 import { SDK_PREFIX } from '../../../../constants/style';
+import { DateTimeLocale } from '../../../../constants/language/datetime/type';
 import { rangePresetOptions, RangePreset } from '../../../../components/DateTimePicker/constants';
 import bind from '../../../../utils/bind';
 import Button from '../../../../components/Button';
@@ -124,18 +127,19 @@ var Absolute = /** @class */ (function (_super) {
     };
     Absolute.prototype.render = function () {
         var _this = this;
+        var locale = this.context.locale;
         return (React.createElement("div", { ref: function (ref) { return (_this.containerRef = ref); } },
             React.createElement("div", { className: SDK_PREFIX + "-datetime-mobile-pick-range-div-containter" },
                 React.createElement(Divider, { className: SDK_PREFIX + "-datetime-mobile-pick-range-div" })),
             React.createElement("div", { className: SDK_PREFIX + "-datetime-mobile-pick-range-preset-head" },
                 React.createElement(Selector, { getPopupContainer: this.getPopupContainer, options: rangePresetOptions, value: this.rangePreset, onChange: this.setRangePreset, className: SDK_PREFIX + "-datetime-mobile-pick-range-preset-head-selector" }),
-                React.createElement(Button, { onClick: this.handleAbsoluteOk, className: SDK_PREFIX + "-datetime-mobile-pick-range-preset-head-button" }, "\u786E\u8BA4")),
+                React.createElement(Button, { onClick: this.handleAbsoluteOk, className: SDK_PREFIX + "-datetime-mobile-pick-range-preset-head-button" }, formatString(DateTimeLocale.confirm, locale))),
             this.isBetweenTime && (React.createElement(React.Fragment, null,
-                React.createElement("div", { className: SDK_PREFIX + "-datetime-mobile-pick-range-sub-title" }, "\u5F00\u59CB\u65F6\u95F4"),
+                React.createElement("div", { className: SDK_PREFIX + "-datetime-mobile-pick-range-sub-title" }, formatString(DateTimeLocale.mobile.start_time, locale)),
                 React.createElement(DatePickerView, { value: this.range[0], minDate: minDate, onChange: function (date) {
                         _this.handleAbsoluteChange(date, 0);
                     } }),
-                React.createElement("div", { className: SDK_PREFIX + "-datetime-mobile-pick-range-sub-title" }, "\u7ED3\u675F\u65F6\u95F4"),
+                React.createElement("div", { className: SDK_PREFIX + "-datetime-mobile-pick-range-sub-title" }, formatString(DateTimeLocale.mobile.end_time)),
                 React.createElement(DatePickerView, { value: this.range[1], minDate: minDate, onChange: function (date) {
                         _this.handleAbsoluteChange(date, 1);
                     } }))),
@@ -146,6 +150,7 @@ var Absolute = /** @class */ (function (_super) {
                     _this.handleAbsoluteChange(date, 1);
                 } }))));
     };
+    Absolute.contextType = ConfigContext;
     __decorate([
         observable,
         __metadata("design:type", String)

package/es/components/DateTimePicker/BaseMobile/index.d.ts

@@ -20,6 +20,7 @@ declare type IGetData = Array<{
     label: string;
 }>> | undefined;
 interface IBaseMobileProps extends IBaseProps {
+    locale?: string;
     buttonType: EButtonType;
     contentClassName?: string;
 }
@@ -30,6 +31,7 @@ export default class BaseMobile extends React.Component<IBaseMobileProps, any> {
         presetMode: EPresetMode;
         buttonType: EButtonType;
     };
+    static contextType: React.Context<import("antd/es/config-provider").ConfigConsumerProps>;
     containerRef: HTMLElement | null;
     showModal: boolean;
     setShowModal(showModal: boolean): void;

package/es/components/DateTimePicker/BaseMobile/index.js

@@ -47,9 +47,12 @@ import Modal from 'antd-mobile/es/modal';
 import { observer } from 'mobx-react';
 import { CalendarOutlined } from '@ant-design/icons';
 import { Divider } from 'antd';
+import { ConfigContext } from 'antd/es/config-provider';
 import { observable } from 'mobx';
 import bind from '../../../utils/bind';
+import { formatString } from '../../../utils/language';
 import { SDK_PREFIX } from '../../../constants/style';
+import { DateTimeLocale } from '../../../constants/language/datetime/type';
 import { TimeType, EPresetMode, defaultPresets } from '../constants';
 import CustomButton from './CustomButton';
 import { Quarters, EButtonType } from './constants';
@@ -152,16 +155,17 @@ var BaseMobile = /** @class */ (function (_super) {
     };
     BaseMobile.prototype.render = function () {
         var _a = this.props, showTimeType = _a.showTimeType, buttonType = _a.buttonType, contentClassName = _a.contentClassName;
+        var locale = this.context.locale;
         var title = (React.createElement("div", { className: SDK_PREFIX + "-datetime-mobile-picker-title" },
             React.createElement("div", { className: SDK_PREFIX + "-datetime-mobile-picker-title-div-containter" },
                 React.createElement(Divider, { className: SDK_PREFIX + "-datetime-mobile-picker-title-div" })),
-            React.createElement("div", null, "\u65E5\u671F\u9009\u62E9")));
+            React.createElement("div", null, formatString(DateTimeLocale.mobile.title, locale))));
         var showPicker = showTimeType &&
             (showTimeType.indexOf(TimeType.Preset) > -1 ||
                 showTimeType.indexOf(TimeType.Quarter) > -1);
         var _b = this.props, onChange = _b.onChange, value = _b.value, defaultValue = _b.defaultValue;
         return (React.createElement(React.Fragment, null,
-            showPicker && (React.createElement(Picker, { data: this.getData() || [], title: title, extra: "\u65E5\u671F\u9009\u62E9", cascade: showTimeType && showTimeType.indexOf(TimeType.Preset) > -1, cols: this.getCols(), value: this.getValue(), onOk: this.handleOk, className: SDK_PREFIX + "-datetime-mobile-picker" },
+            showPicker && (React.createElement(Picker, { data: this.getData() || [], title: title, extra: formatString(DateTimeLocale.mobile.title, locale), cascade: showTimeType && showTimeType.indexOf(TimeType.Preset) > -1, cols: this.getCols(), value: this.getValue(), onOk: this.handleOk, className: SDK_PREFIX + "-datetime-mobile-picker" },
                 React.createElement(CustomButton, { type: buttonType, className: contentClassName }))),
             !showPicker && (React.createElement(React.Fragment, null,
                 React.createElement(CalendarOutlined, { onClick: this.handleShow }),
@@ -173,6 +177,7 @@ var BaseMobile = /** @class */ (function (_super) {
         presetMode: EPresetMode.EXTRA,
         buttonType: EButtonType.Normal
     };
+    BaseMobile.contextType = ConfigContext;
     __decorate([
         observable,
         __metadata("design:type", Boolean)

package/es/components/DateTimePicker/Collapse/Panel/index.d.ts

@@ -0,0 +1,41 @@
+import * as React from 'react';
+interface IPanelProps {
+    /**
+     * 当前panel的key
+     */
+    panelKey?: string;
+    /**
+     * tab的标题
+     */
+    title: string;
+    /**
+     * 当前panel是都激活
+     * @default true
+     */
+    isActive?: boolean;
+    /**
+     * title的样式
+     */
+    titleClassName?: string;
+    /**
+     * content的样式
+     */
+    contentClassName?: string;
+    /**
+     * 容器样式
+     */
+    className?: string;
+    /**
+     * panel折叠状态发生变化
+     */
+    onToggle?: (isActive: boolean, key?: string) => void;
+    /**
+     * 是否禁止toggle
+     */
+    disableToggle?: boolean;
+}
+/**
+ * 折叠面板组件封装
+ */
+export default function Panel(props: React.PropsWithChildren<IPanelProps>): JSX.Element;
+export {};

package/es/components/DateTimePicker/Collapse/Panel/index.js

@@ -0,0 +1,51 @@
+var __read = (this && this.__read) || function (o, n) {
+    var m = typeof Symbol === "function" && o[Symbol.iterator];
+    if (!m) return o;
+    var i = m.call(o), r, ar = [], e;
+    try {
+        while ((n === void 0 || n-- > 0) && !(r = i.next()).done) ar.push(r.value);
+    }
+    catch (error) { e = { error: error }; }
+    finally {
+        try {
+            if (r && !r.done && (m = i["return"])) m.call(i);
+        }
+        finally { if (e) throw e.error; }
+    }
+    return ar;
+};
+import * as React from 'react';
+import classnames from 'classnames';
+import { Icon as LegacyIcon } from '@ant-design/compatible';
+import { SDK_PREFIX } from '../../../../constants/style';
+var useEffect = React.useEffect, useCallback = React.useCallback, useState = React.useState;
+/**
+ * 折叠面板组件封装
+ */
+export default function Panel(props) {
+    var _a, _b;
+    var _c = props.isActive, baseIsActive = _c === void 0 ? true : _c, disableToggle = props.disableToggle, onToggle = props.onToggle, panelKey = props.panelKey, title = props.title, titleClassName = props.titleClassName, className = props.className, contentClassName = props.contentClassName;
+    var _d = __read(useState(baseIsActive || false), 2), isActive = _d[0], setIsActive = _d[1];
+    useEffect(function () {
+        if (baseIsActive !== isActive) {
+            setIsActive(baseIsActive || false);
+        }
+        // eslint-disable-next-line react-hooks/exhaustive-deps
+    }, [baseIsActive]);
+    var onTogglePanel = useCallback(function () {
+        if (disableToggle) {
+            return;
+        }
+        setIsActive(!isActive);
+        if (onToggle) {
+            onToggle(!isActive, panelKey);
+        }
+    }, [disableToggle, panelKey, isActive, onToggle]);
+    return (React.createElement("div", { className: classnames(SDK_PREFIX + "-panel", className), key: panelKey },
+        React.createElement("div", { className: classnames(titleClassName, (_a = {}, _a[SDK_PREFIX + "-panel-disable"] = disableToggle, _a), SDK_PREFIX + "-panel-title"), onClick: onTogglePanel },
+            React.createElement("span", null, title),
+            disableToggle ? null : (React.createElement(LegacyIcon, { type: isActive ? 'down' : 'up', className: SDK_PREFIX + "-panel-icon" }))),
+        React.createElement("div", { className: classnames(SDK_PREFIX + "-panel-content", contentClassName, (_b = {},
+                _b[SDK_PREFIX + "-panel-hidden"] = !isActive,
+                _b)) }, props.children)));
+}

package/es/components/{Collapse → DateTimePicker/Collapse}/Panel/style.less

@@ -1,4 +1,4 @@
-@import '../../../style/theme.less';
+@import '../../../../style/theme.less';
 
 .@{sdk-prefix}-panel-title {
   display: flex;

package/es/components/DateTimePicker/Collapse/index.d.ts

@@ -0,0 +1,24 @@
+import * as React from 'react';
+interface ICollapseProps {
+    /**
+     * 根节点 class name
+     */
+    className?: string;
+    /**
+     * 默认展开的panel的keys
+     */
+    defaultActiveKey?: string[] | 'all' | 'none';
+    /**
+     * 手风琴模式，最多智能打开一个折叠板
+     * @default false
+     */
+    accordion?: boolean;
+}
+/**
+ * 折叠面板组件封装
+ */
+declare function Collapse(props: React.PropsWithChildren<ICollapseProps>): JSX.Element;
+declare namespace Collapse {
+    var Panel: typeof import("./Panel").default;
+}
+export default Collapse;

package/es/components/DateTimePicker/Collapse/index.js

@@ -0,0 +1,42 @@
+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);
+};
+import * as React from 'react';
+import { get } from 'lodash';
+import Panel from './Panel';
+/**
+ * 折叠面板组件封装
+ */
+function Collapse(props) {
+    var children = props.children, defaultActiveKey = props.defaultActiveKey, className = props.className;
+    var getPanels = React.useCallback(function () {
+        var newChildren = [];
+        React.Children.forEach(children, function (child, index) {
+            if (!child) {
+                return;
+            }
+            var key = get(child, 'key') || "" + index;
+            var isActive = false;
+            if (defaultActiveKey && typeof defaultActiveKey === 'string') {
+                isActive = defaultActiveKey === 'none' ? false : true;
+            }
+            else {
+                isActive = (defaultActiveKey || []).indexOf(key) > -1;
+            }
+            var props = __assign(__assign({}, child.props), { panelKey: key, isActive: isActive });
+            newChildren.push(React.cloneElement(child, props));
+        });
+        return newChildren;
+    }, [children, defaultActiveKey]);
+    return React.createElement("div", { className: className }, getPanels());
+}
+Collapse.Panel = Panel;
+export default Collapse;

package/es/components/DateTimePicker/DisplayInput/index.d.ts

@@ -7,5 +7,6 @@ export interface IInputProps extends InputProps {
     presets?: IPreset[];
 }
 export default class DisplayInput extends React.PureComponent<IInputProps, any> {
+    static contextType: React.Context<import("antd/es/config-provider").ConfigConsumerProps>;
     render(): JSX.Element;
 }

package/es/components/DateTimePicker/DisplayInput/index.js

@@ -36,6 +36,7 @@ var __rest = (this && this.__rest) || function (s, e) {
 import * as React from 'react';
 import { CalendarOutlined } from '@ant-design/icons';
 import { Input } from 'antd';
+import { ConfigContext } from 'antd/es/config-provider';
 import Time from '../time';
 var DisplayInput = /** @class */ (function (_super) {
     __extends(DisplayInput, _super);
@@ -44,9 +45,11 @@ var DisplayInput = /** @class */ (function (_super) {
     }
     DisplayInput.prototype.render = function () {
         var _a = this.props, className = _a.className, value = _a.value, timeFormat = _a.timeFormat, presets = _a.presets, otherProps = __rest(_a, ["className", "value", "timeFormat", "presets"]);
-        var text = new Time(value || {}, { presets: presets }).getDisplayText(timeFormat);
+        var locale = this.context.locale;
+        var text = new Time(value || {}, { presets: presets }).getDisplayText(timeFormat, locale);
         return (React.createElement(Input, __assign({ readOnly: true, className: className, suffix: React.createElement(CalendarOutlined, { onClick: this.props.onClick }), value: text }, otherProps)));
     };
+    DisplayInput.contextType = ConfigContext;
     return DisplayInput;
 }(React.PureComponent));
 export default DisplayInput;

package/es/components/DateTimePicker/constants.d.ts

@@ -17,11 +17,6 @@ export declare enum RangePreset {
     AfterTime = "afterTime",
     BetweenTime = "betweenTime"
 }
-export declare const rangePresetMapping: {
-    beforeTime: string;
-    afterTime: string;
-    betweenTime: string;
-};
 export declare const rangePresetOptions: {
     value: RangePreset;
     text: string;
@@ -197,6 +192,10 @@ export interface IBaseProps {
      * 绝对时间的标题
      */
     absoluteTitle?: string;
+    /**
+     * 语言
+     */
+    locale?: string;
 }
 export interface ITimeRange {
     relative?: IRelativeTime;