shineout 1.12.2 → 1.12.3

package/esm/DatePicker/Picker.js

@@ -0,0 +1,158 @@
+import _extends from "@babel/runtime/helpers/extends";
+import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/objectWithoutPropertiesLoose";
+import _inheritsLoose from "@babel/runtime/helpers/inheritsLoose";
+import _assertThisInitialized from "@babel/runtime/helpers/assertThisInitialized";
+import _defineProperty from "@babel/runtime/helpers/defineProperty";
+import React from 'react';
+import Day from './Day';
+import Time from './Time';
+import Year from './Year';
+import Month from './Month';
+import utils from './utils';
+import Quick from './Quick';
+import Quarter from './Quarter';
+import paramUtils from './paramUtils';
+import { getLocale } from '../locale';
+import { datepickerClass } from './styles';
+import { PureComponent } from '../component';
+
+var Picker =
+/*#__PURE__*/
+function (_PureComponent) {
+  _inheritsLoose(Picker, _PureComponent);
+
+  function Picker(props) {
+    var _this;
+
+    _this = _PureComponent.call(this, props) || this;
+
+    _defineProperty(_assertThisInitialized(_assertThisInitialized(_this)), "defaultCurrent", void 0);
+
+    _defineProperty(_assertThisInitialized(_assertThisInitialized(_this)), "handleEnter", void 0);
+
+    _defineProperty(_assertThisInitialized(_assertThisInitialized(_this)), "handleLeave", void 0);
+
+    var mode;
+
+    switch (props.type) {
+      case 'year':
+        mode = 'year';
+        break;
+
+      case 'month':
+        mode = 'month';
+        break;
+
+      case 'quarter':
+        mode = 'quarter';
+        break;
+
+      case 'time':
+        mode = 'time';
+        break;
+
+      default:
+        mode = 'day';
+    }
+
+    _this.state = {
+      mode: mode
+    };
+    var format = 'yyyy-MM-dd HH:mm:ss';
+    _this.defaultCurrent = utils.toDateWithFormat(utils.formatDateWithDefaultTime(utils.newDate(undefined, _this.getOptions()), undefined, props.defaultTime[0], format, _this.getOptions()), format, undefined, _this.getOptions());
+    _this.handleModeChange = _this.handleModeChange.bind(_assertThisInitialized(_assertThisInitialized(_this)));
+    _this.handleEnter = _this.handleMouse.bind(_assertThisInitialized(_assertThisInitialized(_this)), true);
+    _this.handleLeave = _this.handleMouse.bind(_assertThisInitialized(_assertThisInitialized(_this)), false);
+    _this.handleQuick = _this.handleQuick.bind(_assertThisInitialized(_assertThisInitialized(_this)));
+    return _this;
+  }
+
+  var _proto = Picker.prototype;
+
+  _proto.getOptions = function getOptions() {
+    var timeZone = this.props.timeZone;
+    return {
+      timeZone: timeZone,
+      weekStartsOn: getLocale('startOfWeek')
+    };
+  };
+
+  _proto.handleQuick = function handleQuick(quick) {
+    var onChange = this.props.onChange;
+    onChange.apply(void 0, paramUtils.quickHandleChangeParams(quick.value[0], true, false, false, quick));
+  };
+
+  _proto.handleMouse = function handleMouse(isEnter, e) {
+    // stop
+    e.stopPropagation();
+    var _this$props = this.props,
+        index = _this$props.index,
+        handleHover = _this$props.handleHover;
+    if (handleHover && index !== undefined) handleHover(index, isEnter);
+  };
+
+  _proto.handleModeChange = function handleModeChange(mode) {
+    var _this2 = this;
+
+    setTimeout(function () {
+      _this2.setState({
+        mode: mode
+      });
+    }, 10);
+  };
+
+  _proto.render = function render() {
+    var mode = this.state.mode;
+
+    var _this$props2 = this.props,
+        current = _this$props2.current,
+        index = _this$props2.index,
+        otherProps = _objectWithoutPropertiesLoose(_this$props2, ["current", "index"]);
+
+    var Render;
+
+    switch (mode) {
+      case 'year':
+        Render = Year;
+        break;
+
+      case 'month':
+        Render = Month;
+        break;
+
+      case 'time':
+        Render = Time;
+        break;
+
+      case 'quarter':
+        Render = Quarter;
+        break;
+
+      default:
+        Render = Day;
+    } // only range has index prop
+
+
+    if (index === undefined) return React.createElement("div", {
+      className: datepickerClass('split')
+    }, React.createElement(Quick, _extends({}, otherProps, {
+      current: current || this.defaultCurrent,
+      onChange: this.handleQuick
+    })), React.createElement(Render, _extends({}, otherProps, {
+      current: current || this.defaultCurrent,
+      onModeChange: this.handleModeChange
+    })));
+    return React.createElement("div", {
+      onMouseEnter: this.handleEnter,
+      onMouseLeave: this.handleLeave
+    }, React.createElement(Render, _extends({}, otherProps, {
+      index: index,
+      current: current || this.defaultCurrent,
+      onModeChange: this.handleModeChange
+    })));
+  };
+
+  return Picker;
+}(PureComponent);
+
+export default Picker;

package/esm/DatePicker/Props.d.ts

@@ -0,0 +1,397 @@
+import React, { ReactNode } from 'react';
+import { GetTableConsumerProps } from '../Table/Props';
+import { GetInputBorderProps } from '../hoc/Props';
+import { GetInputableProps } from '../Form/Props';
+import { StandardProps, RegularAttributes } from '../@types/common';
+import { AbsoluteProps } from '../AnimationList/Props';
+export declare type DateTimeType = Date | number | string | undefined;
+export declare type DatePickerValue = DateTimeType | DateTimeType[];
+export declare type AreaType = 'year' | 'month' | 'week' | 'day' | 'time' | 'quick' | 'quarter';
+export declare type Mode = 'year' | 'month' | 'quarter' | 'time' | 'day' | 'minute' | 'second' | 'hour';
+export declare type TimeMode = 'hour' | 'minute' | 'second' | 'ampm';
+export declare type DateMode = Mode | 'date';
+export declare type vaildFn = (date: Date, ...args: any) => boolean;
+export declare type vaildFns = ((date: Date, ...args: any) => boolean)[];
+export declare type QuickType = {
+    value: Date[];
+    invalid: boolean;
+    name: string;
+};
+export interface QuickSelectType<T = Date[]> {
+    name: string;
+    value: T;
+}
+export declare type DisabledRegister = (disabled: Function, mode: 'time' | 'date' | 'week' | 'month' | 'year' | 'quarter' | 'datetime' | 'day', index?: number) => void;
+export declare type PickMouseEvent = (e: React.MouseEvent) => void;
+export declare type DisabledType = 'start' | 'end';
+export interface BaseProps<T = DatePickerValue> extends StandardProps, Pick<AbsoluteProps, 'absolute' | 'zIndex'> {
+    /**
+     * If clearable is true, show clear value icon
+     *
+     * 是否显示清除数据图标
+     *
+     * default: true
+     */
+    clearable?: boolean;
+    /**
+     * onChange get undefined while clear
+     *
+     * 清空值时抛出 undefined
+     *
+     * default: false
+     */
+    clearWithUndefined?: boolean;
+    /**
+     * show border bottom
+     *
+     * 仅仅展示下边框
+     *
+     * default: false
+     */
+    underline?: boolean;
+    /**
+     * width
+     *
+     * 宽度
+     *
+     * default: null
+     */
+    width?: number | string;
+    /**
+     * When the value is true, disabled all options; When the value is function, disable the options that this function returns true.
+     *
+     * 如果 disabled 为 true，禁用全部选项，如果 disabled 为函数，根据函数反回结果禁用选项
+     *
+     * default: false
+     */
+    disabled?: ((date: Date, type?: DisabledType, value0?: Date, value1?: Date) => boolean) | boolean;
+    /**
+     * default values for different types: 'date': 'yyyy-MM-dd'. 'time': 'HH:mm:ss'. 'week': 'RRRR II'. 'month': 'yyyy-MM'. 'week': 'RRRR II'. 'quarter': 'yyyy-[Q]Q'. 'year': 'yyyy'. 'datetime': 'yyyy-MM-dd HH:mm:ss'
+     *
+     *
+     * 不同type对应的默认值。'date': 'yyyy-MM-dd'。'time': 'HH:mm:ss'。'week': 'RRRR II'。'month': 'yyyy-MM'。'quarter': 'yyyy-[Q]Q'。 'year': 'yyyy' 。 'datetime': 'yyyy-MM-dd HH:mm:ss'
+     *
+     *
+     * default:
+     */
+    format?: string;
+    /**
+     * Format the selected time
+     *
+     * 对选中时间进行格式化
+     *
+     * default: props.format
+     */
+    formatResult?: string | ((date: Date) => string);
+    /**
+     * a callback when the value is changing
+     *
+     * 值改变回调函数
+     *
+     * default: -
+     */
+    onChange?: (value: T, quickSelect?: QuickSelectType | null) => void;
+    /**
+     * placeholder text. When the range property is not empty, it is an array of length 2.
+     *
+     * 占位文字。range 属性不为空时，为长度为2的数组
+     *
+     * default: -
+     */
+    placeholder?: string | string[];
+    /**
+     * range span，unit: **second**，When it is true, selection scope is not limited.
+     *
+     * 范围跨度，单位 **秒**，为 true 时表示不限制选择范围。
+     *
+     * default: -
+     */
+    range?: boolean | number;
+    /**
+     * type of datepicker
+     *
+     * 时间类型
+     *
+     * default: 'date'
+     */
+    type?: 'date' | 'time' | 'datetime' | 'month' | 'week' | 'quarter' | 'year';
+    /**
+     * Default time when selecting a date, the format is: 'HH:mm:ss'
+     *
+     * 选择日期时默认的时间, 格式为: 'HH:mm:ss'
+     *
+     * default: -
+     */
+    defaultTime?: DatePickerValue;
+    /**
+     * allow single select, only in range can set
+     *
+     * 是否允许单选, 仅在 range 模式下有效
+     *
+     * default: false
+     */
+    allowSingle?: boolean;
+    /**
+     * quick select, only in range can set, name: tip, value: range date
+     *
+     * 快速选择, 仅在 range 模式下有效, name: 文字提示, value: 时间范围
+     *
+     * default: false
+     */
+    quickSelect?: Array<QuickSelectType<DatePickerValue>>;
+    /**
+     * option min value
+     *
+     * 可选最小值
+     *
+     * default: none
+     */
+    min?: DateTimeType;
+    /**
+     * option max value
+     *
+     * 可选最大值
+     *
+     * default: none
+     */
+    max?: DateTimeType;
+    /**
+     * The initial month of range selection, the value is a time object, valid only in range mode, and the priority is lower than value and defaultValue
+     *
+     * 范围选择的初始月份, 值为时间对象 或者时间戳, 仅在 range 模式下生效, 优先级低于 value 和 defaultValue
+     *
+     * default: -
+     */
+    defaultRangeMonth?: Array<DateTimeType>;
+    /**
+     *
+     * default date of panel，work under has no value
+     *
+     * 面板默认时间，在未选择日期时生效
+     *
+     * default: -
+     *
+     */
+    defaultPickerValue?: DateTimeType | DateTimeType[];
+    /**
+     * hour step
+     *
+     * 小时选项步长
+     *
+     * default: none
+     */
+    hourStep?: number;
+    /**
+     * minute step
+     *
+     * 分钟选项步长
+     *
+     * default: none
+     */
+    minuteStep?: number;
+    /**
+     * second step
+     *
+     * 秒选项步长
+     *
+     * default: none
+     */
+    secondStep?: number;
+    /**
+     * Disable the specified Time.
+     *
+     * 禁用指定 Time。
+     *
+     * default: none
+     */
+    disabledTime?: string | ((time: string) => boolean);
+    /**
+     * horizontal align of the value
+     *
+     * 值水平排布方式
+     *
+     * default: center
+     *
+     */
+    align?: 'left' | 'right' | 'center';
+    /**
+     * value onchange callback (every type of date)
+     *
+     * 值改变回调，有别于 onChange, onPickerChange会在每项值改变的时候执行
+     *
+     * default: none
+     */
+    onPickerChange?: (value: DatePickerValue, quickSelect: QuickSelectType | void | undefined, areaType: AreaType) => void;
+    /**
+     * inner title
+     *
+     * 内嵌标题
+     *
+     * default: -
+     */
+    innerTitle?: ReactNode;
+    /**
+     * The name of a Form that accesses data
+     *
+     * Form 存取数据的名称
+     *
+     * default: -
+     */
+    name?: string | string[];
+    /**
+     * Allow enter something into DatePicker
+     *
+     * 可输入
+     *
+     * default: -
+     */
+    inputable?: boolean;
+    /**
+     * Set Position can control the different position of DatePicker
+     *
+     * 弹出框位置
+     *
+     * default: -
+     */
+    position?: 'left-top' | 'left-bottom' | 'right-top' | 'right-bottom';
+    /**
+     * There are three built-in size: small、default、large.
+     *
+     * 不同尺寸
+     *
+     * default: 'default'
+     */
+    size?: RegularAttributes.Size;
+    /**
+     * set timeZone
+     *
+     * 设置时区
+     *
+     * default: -
+     */
+    timeZone?: string;
+}
+export interface ContainerProps<T = DatePickerValue> extends Pick<BaseProps, 'disabled' | 'format' | 'formatResult' | 'inputable' | 'placeholder' | 'position' | 'range' | 'size' | 'type' | 'allowSingle' | 'defaultTime' | 'absolute' | 'zIndex' | 'quickSelect' | 'min' | 'max' | 'defaultRangeMonth' | 'defaultPickerValue' | 'hourStep' | 'minuteStep' | 'secondStep' | 'onPickerChange' | 'disabledTime' | 'align' | 'clearable' | 'clearWithUndefined' | 'innerTitle' | 'timeZone'> {
+    /**
+     * When the value is string, it needs to match the format attribute. When the range property is true, the value is an array of length 2.
+     *
+     * 值。为 string 时，需要和 format 属性匹配。range 属性为 true 时，值为长度为2的数组
+     *
+     * default: -
+     */
+    value: DatePickerValue;
+    children?: ReactNode;
+    onValueBlur: () => void;
+    onBlur: (e: any) => void;
+    onFocus: (e: any) => void;
+    onChange: (value: T, callback?: () => void, quickSelect?: QuickSelectType) => void;
+}
+export interface DatePickerIconProps {
+    tag: string;
+    name: string;
+    className?: string;
+    disabled?: boolean;
+    onClick?: (e?: React.MouseEvent) => void;
+}
+export interface TimeScrollProps extends Pick<UnionPannelProps, 'range' | 'disabled' | 'disabledTime'>, Pick<BaseProps, 'timeZone'> {
+    value: number;
+    total: number;
+    step?: number;
+    current: Date;
+    ampm?: boolean;
+    min?: Date | null;
+    max?: Date | null;
+    onChange: (val: number) => void;
+    mode: 'H' | 'h' | 'm' | 's' | 'ampm';
+}
+export interface TextProps {
+    value: string;
+    index: number;
+    focus: boolean;
+    timeZone?: string;
+    disabled: boolean;
+    className?: string;
+    inputable?: boolean;
+    placeholder: string;
+    focusElement: HTMLSpanElement;
+    format: string | ((date: Date) => string);
+    onTextSpanRef: (e: HTMLSpanElement) => void;
+    onChange: (date: Date | undefined, index: number, e: React.FocusEvent<Element>) => void;
+}
+declare type ChangeSyncFunc = (index: number, date: Date, change: boolean | undefined, _blur: boolean | undefined, _isEnd: boolean | undefined, _isQuickSelect: QuickSelectType | undefined, areaType: AreaType) => void;
+export interface PickerProps extends Pick<BaseProps, 'range' | 'type'> {
+    min?: Date;
+    max?: Date;
+    pos?: string;
+    index?: number;
+    format: string;
+    rangeDate?: Date[];
+    quicks?: QuickType[];
+    rangeTemp?: Date;
+    onChangeSync?: ChangeSyncFunc;
+    timeZone?: string;
+    defaultTime: Date[];
+    current: Date | Date[];
+    showTimePicker: boolean;
+    value: Date;
+    onDayHover?: (date: Date) => void;
+    handleHover?: (index: number, isEnter: boolean) => void;
+    onChange: (date: Date[] | Date, change?: boolean, blur?: boolean, isEnd?: boolean, isQuickSelect?: QuickSelectType, areaType?: AreaType) => void;
+    allowSingle?: boolean;
+    disabled?: ((date: Date, type?: DisabledType, value?: DatePickerValue) => boolean);
+    disabledRegister: DisabledRegister;
+}
+export interface RangeProps extends Pick<BaseProps, 'range' | 'hourStep' | 'minuteStep' | 'secondStep' | 'disabledTime'> {
+    max?: Date;
+    min?: Date;
+    value: Date[];
+    current: Date[];
+    rangeTemp?: Date;
+    timeZone?: string;
+    defaultTime: Date[];
+    children: React.ReactNode;
+    type: ContainerProps['type'];
+    disabled?: ((date: Date, type?: DisabledType, value?: DatePickerValue) => boolean);
+    format: string;
+    onChange: (date: Date[], change?: boolean, blur?: boolean, isEnd?: boolean, isQuickSelect?: QuickSelectType, areaType?: AreaType) => void;
+    quicks?: QuickType[];
+    allowSingle?: boolean;
+    disabledRegister: DisabledRegister;
+}
+export interface QuickProps extends Pick<BaseProps, 'type'> {
+    onChange: (quick: QuickSelectType) => void;
+    quicks?: QuickType[];
+    current: Date | Date[];
+    children?: ReactNode;
+    timeZone?: string;
+}
+export interface UnionPannelProps extends Pick<BaseProps, 'range' | 'timeZone' | 'disabled' | 'allowSingle' | 'hourStep' | 'minuteStep' | 'secondStep' | 'disabledTime'> {
+    max?: Date;
+    min?: Date;
+    value: Date;
+    type?: string;
+    index?: number;
+    current: Date;
+    format: string;
+    onDayHover?: (date: Date) => void;
+    rangeTemp?: Date;
+    rangeDate?: Date[];
+    onChangeSync?: ChangeSyncFunc;
+    defaultTime: Date[];
+    showTimePicker: boolean;
+    onModeChange: (type: Mode) => void;
+    disabledRegister: DisabledRegister;
+    onChange: (date: Date, change?: boolean, blur?: boolean, isEnd?: boolean, isQuickSelect?: QuickSelectType, areaType?: AreaType) => void;
+}
+export declare type GetDatePickerProps<Props> = Props;
+export declare type GetDatePickerValueProps<Props> = Omit<Props, 'onValueBlur' | 'onChange'> & Pick<BaseProps, 'onChange'>;
+export declare type DatePickerPropsWidthAbsolute<T = DatePickerValue> = GetTableConsumerProps<ContainerProps<T>>;
+export declare type DatePickerPropsWidthValue<T = DatePickerValue> = GetDatePickerValueProps<DatePickerPropsWidthAbsolute<T>>;
+export declare type DatePickerPropsWidthInputBorder<T = DatePickerValue> = GetInputBorderProps<DatePickerPropsWidthValue<T>>;
+export declare type DatePickerPropsWidthInputable<T = DatePickerValue> = GetInputableProps<DatePickerPropsWidthInputBorder<T>, DatePickerValue>;
+export declare type DatePickerProps<T = DatePickerValue> = GetDatePickerProps<DatePickerPropsWidthInputable<T>>;
+export declare class DatePickerClass<T = DatePickerValue> extends React.Component<DatePickerProps<T>, {}> {
+    render(): JSX.Element;
+}
+export declare type DatePickerType = typeof DatePickerClass;
+export {};

package/esm/DatePicker/Props.js

@@ -0,0 +1 @@
+import React from 'react';

package/esm/DatePicker/Quarter.d.ts

@@ -0,0 +1,18 @@
+import { PureComponent } from 'react';
+import { UnionPannelProps } from './Props';
+declare class Quarter extends PureComponent<UnionPannelProps> {
+    handleNextYear: () => void;
+    handlePrevYear: () => void;
+    constructor(props: UnionPannelProps);
+    getOptions(): {
+        timeZone: string | undefined;
+        weekStartsOn: any;
+    };
+    handleYearChange(year: number): void;
+    handleYearClick(): void;
+    handleQuarterClick(date: Date): void;
+    handleDisabled(date: Date): boolean | undefined;
+    renderQuarter(q: string, i: number): JSX.Element;
+    render(): JSX.Element;
+}
+export default Quarter;