@douyinfe/semi-foundation 2.36.0-alpha.0 → 2.36.0

package/lib/es/timePicker/foundation.js

@@ -1,37 +1,32 @@
 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,
@@ -48,13 +43,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');
@@ -67,8 +58,6 @@ class TimePickerFoundation extends BaseFoundation {
   /**
    * User input value => save timestamp
    */
-
-
   initDataFromDefaultValue() {
     const defaultValue = this.getProp('defaultValue');
     let value = this.getProp('value');
@@ -79,41 +68,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,
@@ -121,21 +102,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);
@@ -145,20 +121,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({
@@ -168,13 +141,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 {
@@ -184,12 +155,10 @@ class TimePickerFoundation extends BaseFoundation {
     } = props;
     let dates = this.parseValue(value);
     const invalid = this.validateDates(dates);
-
     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,
@@ -198,62 +167,44 @@ class TimePickerFoundation extends BaseFoundation {
       });
     }
   }
-
   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则不进行下一步操作，以免输入过程被打断
@@ -264,11 +215,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 = {
@@ -276,43 +225,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(),
@@ -320,15 +260,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({
@@ -348,80 +285,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)) {
       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));
@@ -430,16 +349,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] : [];
@@ -447,15 +363,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,49 @@
 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
-
-
+  }
+  // eslint-disable-next-line @typescript-eslint/no-empty-function
+  init() {}
+  // eslint-disable-next-line @typescript-eslint/no-empty-function
   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;

package/lib/es/timePicker/utils/index.js

@@ -1,5 +1,4 @@
 import _toNumber from "lodash/toNumber";
-
 /* eslint-disable max-len */
 import { format, parse } from 'date-fns';
 import { strings } from '../constants';
@@ -12,25 +11,22 @@ import { zhCN as defaultLocale } from 'date-fns/locale';
  * @param {object} dateFnsLocale
  * @returns {Date}
  */
-
 export const parseToDate = function (input) {
   let formatToken = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : strings.DEFAULT_FORMAT;
   let dateFnsLocale = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : defaultLocale;
-
   if (input instanceof Date) {
     return input;
   } else if (typeof input === 'number' || !isNaN(Number(input))) {
     return new Date(_toNumber(input));
   } else if (typeof input === 'string') {
-    let curDate = new Date(); // console.log(input, formatToken);
-
+    let curDate = new Date();
+    // console.log(input, formatToken);
     curDate = parse(input, formatToken, curDate, {
       locale: dateFnsLocale
-    }); // console.log(curDate, formatToken);
-
+    });
+    // console.log(curDate, formatToken);
     return curDate;
   }
-
   return new Date();
 };
 /**
@@ -38,7 +34,6 @@ export const parseToDate = function (input) {
  * @param {string|Date|number} input
  * @returns {number}
  */
-
 export const parseToTimestamp = function (input) {
   let formatToken = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : strings.DEFAULT_FORMAT;
   let dateFnsLocale = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : defaultLocale;
@@ -50,7 +45,6 @@ export const parseToTimestamp = function (input) {
  * @param {string} formatToken
  * @returns {string}
  */
-
 export const formatToString = function (dateOrTimestamp) {
   let formatToken = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : strings.DEFAULT_FORMAT;
   let dateFnsLocale = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : defaultLocale;
@@ -61,34 +55,28 @@ export const formatToString = function (dateOrTimestamp) {
 export const hourIsDisabled = (disabledHours, hour) => {
   if (typeof disabledHours === 'function') {
     const disabledOptions = disabledHours();
-
     if (Array.isArray(disabledOptions) && !isNullOrUndefined(hour) && disabledOptions.some(v => _toNumber(v) === _toNumber(hour))) {
       return true;
     }
   }
-
   return false;
 };
 export const minuteIsDisabled = (disabledMinutes, hour, minute) => {
   if (typeof disabledMinutes === 'function') {
     const disabledOptions = disabledMinutes(hour);
-
     if (Array.isArray(disabledOptions) && !isNullOrUndefined(hour) && !isNullOrUndefined(minute) && disabledOptions.some(v => _toNumber(v) === _toNumber(minute))) {
       return true;
     }
   }
-
   return false;
 };
 export const secondIsDisabled = (disabledSeconds, hour, minute, second) => {
   if (typeof disabledSeconds === 'function') {
     const disabledOptions = disabledSeconds(hour, minute);
-
     if (Array.isArray(disabledOptions) && !isNullOrUndefined(hour) && !isNullOrUndefined(minute) && !isNullOrUndefined(second) && disabledOptions.some(v => _toNumber(v) === _toNumber(second))) {
       return true;
     }
   }
-
   return false;
 };
 export const transformToArray = value => {
@@ -113,36 +101,29 @@ export const transformToArray = value => {
  * @param {String} formatToken e.g. HH:mm
  * @returns {Boolean}
  */
-
 export const isTimeFormatLike = (time, formatToken) => {
   let isLike = true;
   const dateFnsSupportFormatCh = 'BDEGHKLMOPQRSTXYabcehimopqstuwxyz'; // dateFns support format character
-
   const formatSupportChReg = new RegExp(`[${dateFnsSupportFormatCh}]`, 'g');
   const formatNotSupportChReg = new RegExp(`[^${dateFnsSupportFormatCh}]`, 'g');
   const hmsReg = /[H|m|s]{1,2}/;
   const formatSplitted = formatToken.split(formatNotSupportChReg); // => ['HH', 'mm'];
-
   const timeSeparator = formatToken.replace(formatSupportChReg, ''); // => :
-
   const timeReg = new RegExp(`[${timeSeparator}]`, 'g'); // => /[:]/g
-
   const timeSplitted = time.split(timeReg); // => ['12', '0]
-
   if (formatSplitted.length !== timeSplitted.length) {
     isLike = false;
   } else {
     for (let i = 0, len = timeSplitted.length; i < len; i++) {
       const formatStr = formatSplitted[i];
-      const timeStr = timeSplitted[i]; // Returns false if the current character corresponds to minutes and seconds and the length is less than format
+      const timeStr = timeSplitted[i];
+      // Returns false if the current character corresponds to minutes and seconds and the length is less than format
       // when i=1 => '0'.length < 'mm'.length
-
       if (hmsReg.test(formatStr) && timeStr.length < formatStr.length) {
         isLike = false;
         break;
       }
     }
   }
-
   return isLike;
 };

package/lib/es/timePicker/utils/localeDate.js

@@ -1,20 +1,15 @@
 import { format as dateFnsFormat, parse as dateFnsParse } from 'date-fns';
 /* istanbul ignore next */
-
 const replace = function replace(str, replacements) {
   let _str = str;
-
   for (const key of Object.keys(replacements)) {
     if (typeof replacements[key] === 'string') {
       _str = _str.replace(key, replacements[key]);
     }
   }
-
   return _str;
 };
 /* istanbul ignore next */
-
-
 export function localeFormat(date, format) {
   let locale = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : {};
   let options = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : {};
@@ -23,14 +18,11 @@ export function localeFormat(date, format) {
   return str;
 }
 /* istanbul ignore next */
-
 export function localeParse(dateString, format) {
   let locale = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : {};
   let defaultDate = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : null;
   let options = arguments.length > 4 && arguments[4] !== undefined ? arguments[4] : {};
-
   // const invertedLocale = invert(locale);
   const _dateString = replace(dateString, locale);
-
   return dateFnsParse(_dateString, format, defaultDate, options);
 }

package/lib/es/timeline/timeline.css

@@ -126,42 +126,6 @@
   width: calc(100% - 28px);
 }
 
-.semi-timeline-item-alternate .semi-timeline-item-tail, .semi-timeline-item-alternate .semi-timeline-item-head, .semi-timeline-item-alternate .semi-timeline-item-head-custom, .semi-timeline-item-mode-right .semi-timeline-item-tail, .semi-timeline-item-mode-right .semi-timeline-item-head, .semi-timeline-item-mode-right .semi-timeline-item-head-custom, .semi-timeline-item-center .semi-timeline-item-tail, .semi-timeline-item-center .semi-timeline-item-head, .semi-timeline-item-center .semi-timeline-item-head-custom {
-  left: 50%;
-}
-.semi-timeline-item-alternate .semi-timeline-item-head.semi-timeline-item-head-custom, .semi-timeline-item-mode-right .semi-timeline-item-head.semi-timeline-item-head-custom, .semi-timeline-item-center .semi-timeline-item-head.semi-timeline-item-head-custom {
-  margin-left: 0;
-}
-.semi-timeline-item-alternate .semi-timeline-item-head, .semi-timeline-item-mode-right .semi-timeline-item-head, .semi-timeline-item-center .semi-timeline-item-head {
-  margin-left: -4px;
-}
-.semi-timeline-item-alternate.semi-timeline-item-left .semi-timeline-item-content, .semi-timeline-item-mode-right.semi-timeline-item-left .semi-timeline-item-content, .semi-timeline-item-center.semi-timeline-item-left .semi-timeline-item-content {
-  left: calc(50% - 4px);
-  width: calc(50% - 14px);
-  text-align: left;
-}
-.semi-timeline-item-alternate.semi-timeline-item-right .semi-timeline-item-content, .semi-timeline-item-mode-right.semi-timeline-item-right .semi-timeline-item-content, .semi-timeline-item-center.semi-timeline-item-right .semi-timeline-item-content {
-  width: calc(50% - 20px);
-  margin: 0;
-  text-align: right;
-}
-.semi-timeline-item-alternate.semi-timeline-item.semi-timeline-item-not-last-child > .semi-timeline-item-tail, .semi-timeline-item-mode-right.semi-timeline-item.semi-timeline-item-not-last-child > .semi-timeline-item-tail, .semi-timeline-item-center.semi-timeline-item.semi-timeline-item-not-last-child > .semi-timeline-item-tail, .semi-timeline-item-left.semi-timeline-item.semi-timeline-item-not-last-child > .semi-timeline-item-tail {
-  border-left: 1px solid var(--semi-color-text-3);
-}
-.semi-timeline-item-center .semi-timeline-item-content-time {
-  position: absolute;
-  top: -2px;
-  margin-left: calc(-40px - 100%);
-  width: 100%;
-  text-align: right;
-}
-.semi-timeline-item-mode-right.semi-timeline-item-right .semi-timeline-item-tail, .semi-timeline-item-mode-right.semi-timeline-item-right .semi-timeline-item-head, .semi-timeline-item-mode-right.semi-timeline-item-right .semi-timeline-item-head-custom {
-  left: calc(100% - 9px);
-}
-.semi-timeline-item-mode-right.semi-timeline-item-right .semi-timeline-item-content {
-  width: calc(100% - 28px);
-}
-
 .semi-rtl .semi-timeline,
 .semi-portal-rtl .semi-timeline {
   direction: rtl;