@douyinfe/semi-foundation 2.24.2 → 2.25.0-alpha.0

package/lib/es/timePicker/ComboxFoundation.js

@@ -3,49 +3,39 @@ import BaseFoundation from '../base/foundation';
 import { isValidDate } from '../datePicker/_utils/index';
 import isNullOrUndefined from '../utils/isNullOrUndefined';
 const HOUR = 1000 * 60 * 60;
-const DAY = 24 * HOUR; // TODO: move to utils
-
+const DAY = 24 * HOUR;
+// TODO: move to utils
 export const formatOption = (option, disabledOptions) => {
-  let value = "".concat(option);
-
+  let value = `${option}`;
   if (option < 10) {
-    value = "0".concat(option);
+    value = `0${option}`;
   }
-
   let disabled = false;
-
   if (disabledOptions && disabledOptions.indexOf(option) >= 0) {
     disabled = true;
   }
-
   return {
     value,
     disabled
   };
 };
-
 function generateOptions(length, disabledOptions, hideDisabledOptions) {
   let step = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : 1;
   const arr = [];
-
   for (let value = 0; value < length; value += step) {
     if (!disabledOptions || disabledOptions.indexOf(value) < 0 || !hideDisabledOptions) {
       arr.push(value);
     }
   }
-
   return arr;
 }
-
 class ComboboxFoundation extends BaseFoundation {
   constructor(adapter) {
     super(Object.assign({}, adapter));
   }
-
   isAM() {
     return this.getProp('isAM');
   }
-
   initData() {
     const {
       timeStampValue,
@@ -73,13 +63,11 @@ class ComboboxFoundation extends BaseFoundation {
       secondOptions
     };
   }
-
   getPosition() {
     const position = this.getProp('position');
     const type = this.getProp('type') || strings.DEFAULT_TYPE;
     return position || strings.DEFAULT_POSITION[type];
   }
-
   getDefaultFormatIfNeed() {
     if (this._isInProps('format')) {
       return this.getProp('format');
@@ -89,14 +77,12 @@ class ComboboxFoundation extends BaseFoundation {
       return strings.DEFAULT_FORMAT;
     }
   }
-
   disabledHours() {
     const {
       use12Hours,
       disabledHours
     } = this.getProps();
     let disabledOptions = disabledHours && disabledHours();
-
     if (use12Hours && Array.isArray(disabledOptions)) {
       if (this.isAM()) {
         disabledOptions = disabledOptions.filter(h => h < 12).map(h => h === 0 ? 12 : h);
@@ -104,15 +90,13 @@ class ComboboxFoundation extends BaseFoundation {
         disabledOptions = disabledOptions.map(h => h === 12 ? 12 : h - 12);
       }
     }
-
     return disabledOptions;
   }
-
   getValidFormat(format) {
     let _format = isNullOrUndefined(format) ? this.getProp('format') : format;
-
     _format = this.getDefaultFormatIfNeed();
-    _format = typeof _format === 'string' ? _format : strings.DEFAULT_FORMAT; // if (use12Hours) {
+    _format = typeof _format === 'string' ? _format : strings.DEFAULT_FORMAT;
+    // if (use12Hours) {
     //     format = format.replace(/H/g, 'h');
     //     if (!/(\s+)a/i.test(format)) {
     //         format += ' a';
@@ -120,37 +104,27 @@ class ComboboxFoundation extends BaseFoundation {
     //         format = format.replace(/(\s+)A/i, '$1a');
     //     }
     // }
-
     return _format;
   }
   /**
    * from 13-bit timestamp  -> get display date
    * by combobox use
    */
-
-
   getDisplayDateFromTimeStamp(timeStamp) {
     let date;
-
     if (timeStamp) {
       date = new Date(timeStamp);
     }
-
     if (!timeStamp || !isValidDate(date)) {
       return this.createDateDefault();
     }
-
     return date;
   }
   /**
    * create a date at 00:00:00
    */
-
-
   createDateDefault() {
     return new Date(parseInt(String(Date.now() / DAY), 10) * DAY - 8 * HOUR);
   }
-
 }
-
 export default ComboboxFoundation;

package/lib/es/timePicker/constants.js

@@ -5,9 +5,9 @@ const TYPE_TIME_RANGE_PICKER = 'timeRange';
 const DEFAULT_RANGE_SEPARATOR = ' ~ ';
 const DEFAULT_MULTIPLE_SEPARATOR = ',';
 const cssClasses = {
-  PREFIX: "".concat(BASE_CLASS_PREFIX, "-timepicker"),
-  RANGE_PICKER: "".concat(BASE_CLASS_PREFIX, "-timepicker-range-panel"),
-  RANGE_PANEL_LISTS: "".concat(BASE_CLASS_PREFIX, "-timepicker-lists")
+  PREFIX: `${BASE_CLASS_PREFIX}-timepicker`,
+  RANGE_PICKER: `${BASE_CLASS_PREFIX}-timepicker-range-panel`,
+  RANGE_PANEL_LISTS: `${BASE_CLASS_PREFIX}-timepicker-lists`
 };
 const strings = {
   TYPES: [TYPE_TIME_PICKER, TYPE_TIME_RANGE_PICKER],

package/lib/es/timePicker/foundation.d.ts

@@ -1,5 +1,5 @@
 import BaseFoundation, { DefaultAdapter } from '../base/foundation';
-export declare type Position = 'top' | 'topLeft' | 'topRight' | 'left' | 'leftTop' | 'leftBottom' | 'right' | 'rightTop' | 'rightBottom' | 'bottom' | 'bottomLeft' | 'bottomRight' | 'leftTopOver' | 'rightTopOver';
+export type Position = 'top' | 'topLeft' | 'topRight' | 'left' | 'leftTop' | 'leftBottom' | 'right' | 'rightTop' | 'rightBottom' | 'bottom' | 'bottomLeft' | 'bottomRight' | 'leftTopOver' | 'rightTopOver';
 export interface TimePickerAdapter<P = Record<string, any>, S = Record<string, any>> extends DefaultAdapter<P, S> {
     togglePanel: (show: boolean) => void;
     registerClickOutSide: () => void;
@@ -21,7 +21,7 @@ declare class TimePickerFoundation<P = Record<string, any>, S = Record<string, a
         minutes: number;
         seconds: number;
     }): boolean;
-    isValidTimeZone(timeZone?: string | number): boolean;
+    isValidTimeZone(timeZone: string | number): boolean;
     getDefaultFormatIfNeed(): string;
     /**
      * User input value => save timestamp

package/lib/es/timePicker/foundation.js

@@ -1,36 +1,31 @@
+import _isUndefined from "lodash/isUndefined";
 import _split from "lodash/split";
-
-/* eslint-disable max-len */
 import { strings } from './constants';
 import BaseFoundation from '../base/foundation';
 import { formatToString, parseToDate, hourIsDisabled, minuteIsDisabled, secondIsDisabled, transformToArray, isTimeFormatLike } from './utils';
 import { isValid, format, getHours } from 'date-fns';
 import { utcToZonedTime, zonedTimeToUtc } from '../utils/date-fns-extra';
-import isNullOrUndefined from '../utils/isNullOrUndefined'; // TODO: split, timePicker different components cannot share a foundation
-
+import isNullOrUndefined from '../utils/isNullOrUndefined';
+// TODO: split, timePicker different components cannot share a foundation
 class TimePickerFoundation extends BaseFoundation {
   constructor(adapter) {
     super(Object.assign({}, adapter));
   }
-
   init() {
     this.initDataFromDefaultValue();
     const open = this._isControlledComponent('open') ? this.getProp('open') : this.getProp('defaultOpen');
-
     if (open && !this._isControlledComponent('open')) {
       this._adapter.registerClickOutSide();
     }
   }
-
   getPosition() {
     const position = this.getProp('position');
-    const type = this.getProp('type') || strings.DEFAULT_TYPE; // rtl change default position
-
+    const type = this.getProp('type') || strings.DEFAULT_TYPE;
+    // rtl change default position
     const direction = this.getContext('direction');
     const rtlDirection = direction === 'rtl' ? 'bottomRight' : '';
     return position || rtlDirection || strings.DEFAULT_POSITION[type];
   }
-
   isDisabledHMS(_ref) {
     let {
       hours,
@@ -47,13 +42,9 @@ class TimePickerFoundation extends BaseFoundation {
     const sDis = !isNullOrUndefined(hours) && !isNullOrUndefined(minutes) && !isNullOrUndefined(seconds) && secondIsDisabled(disabledSeconds, hours, minutes, seconds);
     return hDis || mDis || sDis;
   }
-
   isValidTimeZone(timeZone) {
-    const _timeZone = timeZone === undefined ? this.getProp('timeZone') : timeZone;
-
-    return ['string', 'number'].includes(typeof _timeZone) && _timeZone !== '';
+    return ['string', 'number'].includes(typeof timeZone) && timeZone !== '';
   }
-
   getDefaultFormatIfNeed() {
     if (this._isInProps('format')) {
       return this.getProp('format');
@@ -66,8 +57,6 @@ class TimePickerFoundation extends BaseFoundation {
   /**
    * User input value => save timestamp
    */
-
-
   initDataFromDefaultValue() {
     const defaultValue = this.getProp('defaultValue');
     let value = this.getProp('value');
@@ -78,41 +67,33 @@ class TimePickerFoundation extends BaseFoundation {
       dateFnsLocale
     } = this.getProps();
     value = value || defaultValue;
-
     if (!Array.isArray(value)) {
       value = value ? [value] : [];
     }
-
     const parsedValues = [];
     let invalid = false;
     value.forEach(v => {
       const pv = parseToDate(v, formatToken, dateFnsLocale);
-
       if (!isNaN(pv.getTime())) {
-        parsedValues.push(this.isValidTimeZone() ? utcToZonedTime(pv, timeZone) : pv);
+        parsedValues.push(this.isValidTimeZone(timeZone) ? utcToZonedTime(pv, timeZone) : pv);
       }
     });
     const isAM = [true, false];
     parsedValues.map((item, idx) => {
       isAM[idx] = getHours(item) < 12;
     });
-
     if (parsedValues.length === value.length) {
       value = parsedValues;
     } else {
       value = [];
-
       if (value.length) {
         invalid = true;
       }
     }
-
     let inputValue = '';
-
     if (!invalid) {
       inputValue = value.map(v => formatToString(v, formatToken, dateFnsLocale)).join(rangeSeparator);
     }
-
     this.setState({
       isAM,
       value,
@@ -120,21 +101,16 @@ class TimePickerFoundation extends BaseFoundation {
       invalid
     });
   }
-
   getValidFormat(validFormat) {
     let _format = validFormat;
-
     if (isNullOrUndefined(_format)) {
       _format = this.getDefaultFormatIfNeed();
     }
-
     if (typeof _format !== 'string') {
       _format = strings.DEFAULT_FORMAT;
     }
-
     return _format;
   }
-
   handlePanelChange(result) {
     let index = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 0;
     // console.log(result, index);
@@ -144,20 +120,17 @@ class TimePickerFoundation extends BaseFoundation {
     let isAM = this.getState('isAM');
     const value = transformToArray(oldValue);
     isAM = transformToArray(isAM);
-
     if (result) {
       const panelIsAM = Boolean(result.isAM);
       const date = parseToDate(result.timeStampValue, formatToken, dateFnsLocale);
       value[index] = date;
       isAM[index] = panelIsAM;
       const inputValue = this.formatValue(value);
-
       if (this.getState('isAM')[index] !== result.isAM) {
         this.setState({
           isAM
         });
       }
-
       if (!this._isControlledComponent('value')) {
         const invalid = this.validateDates(value);
         this.setState({
@@ -167,13 +140,11 @@ class TimePickerFoundation extends BaseFoundation {
           invalid
         });
       }
-
       if (this._hasChanged(value, oldValue)) {
         this._notifyChange(value, inputValue);
       }
     }
   }
-
   refreshProps() {
     let props = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
     const {
@@ -182,77 +153,62 @@ class TimePickerFoundation extends BaseFoundation {
       __prevTimeZone
     } = props;
     let dates = this.parseValue(value);
-    const invalid = this.validateDates(dates);
-
+    let invalid = dates.some(d => isNaN(Number(d)));
     if (!invalid) {
       if (this.isValidTimeZone(timeZone)) {
         dates = dates.map(date => utcToZonedTime(this.isValidTimeZone(__prevTimeZone) ? zonedTimeToUtc(date, __prevTimeZone) : date, timeZone));
       }
-
-      const inputValue = this.formatValue(dates);
-      this.setState({
-        value: dates,
-        invalid,
-        inputValue
-      });
+      invalid = dates.some(d => this.isDisabledHMS({
+        hours: d.getHours(),
+        minutes: d.getMinutes(),
+        seconds: d.getSeconds()
+      }));
     }
+    const inputValue = this.formatValue(dates);
+    this.setState({
+      value: dates,
+      invalid,
+      inputValue
+    });
   }
-
   handleFocus(e) {
     if (!this.getState('open')) {
       this.handlePanelOpen();
     }
-
     this._adapter.notifyFocus(e);
   }
-
   setPanel(open) {
     this._adapter.togglePanel(open);
   }
-
   destroy() {
     this._adapter.unregisterClickOutSide();
   }
-
   handlePanelOpen() {
     if (!this._isControlledComponent('open')) {
       this._adapter.registerClickOutSide();
-
       this.setPanel(true);
     }
-
     this._adapter.notifyOpenChange(true);
   }
-
   handlePanelClose(clickedOutside, e) {
     if (!this._isControlledComponent('open')) {
       this._adapter.unregisterClickOutSide();
-
       this.setPanel(false);
     }
-
     this._adapter.notifyOpenChange(false);
-
     this._adapter.notifyBlur(e);
   }
   /* istanbul ignore next */
-
-
   handleVisibleChange(visible) {
     if (!this._isControlledComponent('open')) {
       this._adapter.togglePanel(visible);
     }
-
     this._adapter.notifyOpenChange(visible);
   }
-
   handleInputChange(input) {
     this._adapter.setInputValue(input);
-
     const rangeSeparator = this.getProp('rangeSeparator');
-
     const inputValues = _split(input, rangeSeparator);
-
     const formatToken = this.getValidFormat();
     /**
      * 如果输入的字符串不是formatLike则不进行下一步操作，以免输入过程被打断
@@ -263,11 +219,9 @@ class TimePickerFoundation extends BaseFoundation {
      *  special case
      *  -when emptying, the input is "', at this time you need to skip isTimeFormatLike judgment
      */
-
     if (input !== '' && inputValues.some(time => !isTimeFormatLike(time, formatToken))) {
       return;
     }
-
     const dates = this.parseInput(input);
     const invalid = this.validateDates(dates);
     const states = {
@@ -275,43 +229,34 @@ class TimePickerFoundation extends BaseFoundation {
     };
     const oldValue = this.getState('value');
     let value = transformToArray(oldValue);
-
     if (!invalid) {
       states.value = dates;
       value = [...dates];
     }
-
     if (!this._isControlledComponent('value')) {
       this.setState(states);
     }
-
     if (this._hasChanged(value, oldValue)) {
       this._notifyChange(value, input);
     }
   }
   /* istanbul ignore next */
-
-
   doValidate(args) {
     if (typeof args === 'string') {
       return this.validateStr(args);
     } else if (Array.isArray(args)) {
       return this.validateDates(args);
     }
-
     return undefined;
   }
-
   validateStr() {
     let inputValue = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : '';
     const dates = this.parseInput(inputValue);
     return this.validateDates(dates);
   }
-
   validateDates() {
     let dates = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : [];
     let invalid = dates.some(d => isNaN(Number(d)));
-
     if (!invalid) {
       invalid = dates.some(d => this.isDisabledHMS({
         hours: d.getHours(),
@@ -319,15 +264,12 @@ class TimePickerFoundation extends BaseFoundation {
         seconds: d.getSeconds()
       }));
     }
-
     return invalid;
   }
-
   handleInputBlur(e) {
     const invalid = this.getState('invalid');
     const inputValue = this.getState('inputValue');
     const value = this.getState('value');
-
     if (inputValue) {
       if (invalid) {
         this.setState({
@@ -347,68 +289,62 @@ class TimePickerFoundation extends BaseFoundation {
       });
     }
   }
-
   formatValue(dates) {
     const validFormat = this.getValidFormat();
     const rangeSeparator = this.getProp('rangeSeparator');
     const dateFnsLocale = this.getProp('dateFnsLocale');
     let _dates = dates;
-
     if (_dates && !Array.isArray(_dates)) {
       _dates = _dates[_dates];
     }
-
     if (_dates && Array.isArray(_dates)) {
-      return _dates.map(date => formatToString(date, validFormat, dateFnsLocale)).join(rangeSeparator);
+      const result = _dates.map(date => {
+        let str;
+        if (_isUndefined(date)) {
+          str = '';
+        } else {
+          str = formatToString(date, validFormat, dateFnsLocale);
+        }
+        return str;
+      });
+      return result.join(rangeSeparator);
     }
-
     return undefined;
   }
-
   parseInput(str) {
     const validFormat = this.getValidFormat();
     const rangeSeparator = this.getProp('rangeSeparator');
     const dateFnsLocale = this.getProp('dateFnsLocale');
-
     if (str && typeof str === 'string') {
       return _split(str, rangeSeparator).map(v => parseToDate(v, validFormat, dateFnsLocale));
     }
-
     return [];
   }
-
   parseValue() {
     let value = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : [];
     const formatToken = this.getValidFormat();
     const dateFnsLocale = this.getProp('dateFnsLocale');
     let _value = value;
-
     if (!Array.isArray(_value)) {
       _value = _value ? [_value] : [];
     }
-
     if (Array.isArray(_value)) {
       return _value.map(v => parseToDate(v, formatToken, dateFnsLocale));
     }
-
     return [];
   }
-
   _notifyChange(value, inputValue) {
     let str = inputValue;
     let _value = value;
     const timeZone = this.getProp('timeZone');
-
     if (this._adapter.isRangePicker()) {
       const rangeSeparator = this.getProp('rangeSeparator');
       str = _split(inputValue, rangeSeparator);
     } else {
       _value = Array.isArray(_value) ? _value[0] : _value;
     }
-
-    if (this.isValidTimeZone() && _value) {
+    if (this.isValidTimeZone(timeZone) && _value) {
       const formatToken = this.getValidFormat();
-
       if (Array.isArray(_value)) {
         _value = _value.map(v => zonedTimeToUtc(v, timeZone));
         str = _value.map(v => format(v, formatToken));
@@ -417,16 +353,13 @@ class TimePickerFoundation extends BaseFoundation {
         str = format(_value, formatToken);
       }
     }
-
     const onChangeWithDateFirst = this.getProp('onChangeWithDateFirst');
-
     if (onChangeWithDateFirst) {
       this._adapter.notifyChange(_value, str);
     } else {
       this._adapter.notifyChange(str, _value);
     }
   }
-
   _hasChanged() {
     let dates = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : [];
     let oldDates = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : [];
@@ -434,15 +367,11 @@ class TimePickerFoundation extends BaseFoundation {
     const dateFnsLocale = this.getProp('dateFnsLocale');
     return dates.length !== oldDates.length || dates.some((date, index) => {
       const oldDate = oldDates[index];
-
       if (isValid(date) && isValid(oldDate) && formatToString(date, formatToken, dateFnsLocale) === formatToString(oldDate, formatToken, dateFnsLocale)) {
         return false;
       }
-
       return true;
     });
   }
-
 }
-
 export default TimePickerFoundation;

package/lib/es/timePicker/inputFoundation.js

@@ -1,65 +1,47 @@
 import BaseFoundation from '../base/foundation';
 import isNullOrUndefined from '../utils/isNullOrUndefined';
-
 class TimePickerFoundation extends BaseFoundation {
   constructor(adapter) {
     super(Object.assign({}, adapter));
-  } // eslint-disable-next-line @typescript-eslint/no-empty-function
-
-
-  init() {} // eslint-disable-next-line @typescript-eslint/no-empty-function
-
-
+  }
+  init() {}
   destroy() {}
-
   handleFocus(e) {
     this.storeCursor();
-
     this._adapter.notifyFocus(e);
   }
-
   handleChange(v) {
     this.storeCursor();
-
     this._adapter.notifyChange(v);
   }
-
   handleBlur(e) {
     this.clearCursor();
-
     this._adapter.notifyBlur(e);
   }
-
   storeCursor() {
     const inputNode = this.getCache('inputNode');
-
     if (inputNode) {
       const {
         selectionStart: start
-      } = inputNode; // const beforeStr = typeof value === 'string' ? value.substr(0, start) : null;
+      } = inputNode;
+      // const beforeStr = typeof value === 'string' ? value.substr(0, start) : null;
       // const afterStr = typeof value === 'string' ? value.substr(start, value.length - start + 1) : null;
       // console.log(start, beforeStr, afterStr);
-
       this.setCache('cursorIndex', start);
     }
   }
-
   restoreCursor() {
     const inputNode = this.getCache('inputNode');
     const cursorIndex = this.getCache('cursorIndex');
-
     if (inputNode && !isNullOrUndefined(cursorIndex)) {
       inputNode.selectionStart = cursorIndex;
       inputNode.selectionEnd = cursorIndex;
     }
   }
-
   clearCursor() {
     this.setCache('cursorIndex', null);
     this.setCache('beforeStr', null);
     this.setCache('afterStr', null);
   }
-
 }
-
 export default TimePickerFoundation;