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

package/lib/cjs/radio/radioInnerFoundation.js

@@ -4,46 +4,34 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
-
 var _foundation = _interopRequireDefault(require("../base/foundation"));
-
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-
 class RadioInnerFoundation extends _foundation.default {
   constructor(adapter) {
     super(Object.assign({}, adapter));
   }
-
   init() {
     const checked = this._adapter.getProp('checked');
-
     const defaultChecked = this._adapter.getProp('defaultChecked');
-
     this.setChecked(checked || defaultChecked);
   }
-
   setChecked(checked) {
     this._adapter.setNativeControlChecked(checked);
   }
-
   getChecked() {
     return this._adapter.getProp('checked');
   }
-
   handleChange(e) {
     const isControlledMode = ('checked' in this.getProps());
     const {
       checked
     } = e.target;
-
     const stopPropagation = () => {
       e.stopPropagation();
     };
-
     const preventDefault = () => {
       e.preventDefault();
     };
-
     const cbValue = {
       target: Object.assign(Object.assign({}, this.getProps()), {
         checked
@@ -51,19 +39,13 @@ class RadioInnerFoundation extends _foundation.default {
       stopPropagation,
       preventDefault
     };
-
     if (isControlledMode) {
       this._adapter.notifyChange(cbValue);
     } else {
       this.setChecked(checked);
-
       this._adapter.notifyChange(cbValue);
     }
-  } // eslint-disable-next-line @typescript-eslint/no-empty-function
-
-
+  }
   destroy() {}
-
 }
-
 exports.default = RadioInnerFoundation;

package/lib/cjs/radio/variables.scss

@@ -32,10 +32,13 @@ $color-radio_buttonRadio-text-disabled: var(--semi-color-disabled-text); // 按
 $color-radio_addon_buttonRadio-bg-hover: var(--semi-color-fill-1); // 按钮样式单选悬浮态背景色
 $color-radio_addon_buttonRadio-text-checked: var(--semi-color-primary); // 按钮样式单选选中项文字颜色
 $color-radio_addon_buttonRadio-bg-checked: var(--semi-color-bg-3); // 按钮样式单选选中项背景颜色
+$color-radio_cardRadioGroup-bg-default: transparent; // 卡片样式单选默认背景色
 $color-radio_cardRadioGroup-bg-checked: var(--semi-color-primary-light-default); // 卡片样式单选选中态背景色
 $color-radio_cardRadioGroup_disabled-bg-checked: var(--semi-color-primary-light-default); // 卡片样式单选选中且禁用时的背景色
+$color-radio_cardRadioGroup_disabled-bg-active: transparent; // 卡片样式单选禁用时的背景色 - 按下态
 $color-radio_cardRadioGroup-bg-hover: var(--semi-color-fill-0); // 卡片样式单选悬浮态背景色
 $color-radio_cardRadioGroup-bg-active: var(--semi-color-fill-1); // 卡片样式单选按下态背景色
+$color-radio_cardRadioGroup_border-default: transparent; // 卡片样式单选默认描边颜色
 $color-radio_cardRadioGroup_border-active: var(--semi-color-primary); // 卡片样式单选选中态描边颜色
 $color-radio_cardRadioGroup_checked_border-active: var(--semi-color-primary-active); // 卡片样式单选选中态描边颜色 - 按下态
 $color-radio_cardRadioGroup_checked_border-hover: var(--semi-color-primary-hover); // 卡片样式单选选中态描边颜色 - 悬浮态
@@ -74,6 +77,7 @@ $spacing-radio_addon_buttonRadio_middle-paddingX: $spacing-base; // 中尺寸按
 $spacing-radio_addon_buttonRadio_middle-paddingY: $spacing-extra-tight; // 中尺寸按钮式单选按钮垂直内边距
 $spacing-radio_addon_buttonRadio_marginLeft: $spacing-none; // 按钮式单选按钮左侧外边距
 $spacing-radio_extra-paddingLeft: $width-radio_inner + $spacing-tight; // 单选副标题左侧内边距
+$spacing-radio_content-rowGap: 4px; // 内容行间距
 
 $spacing-radio_group_vertical-marginBottom: $spacing-base-tight; // 垂直布局单选框组底部外边距
 $spacing-radio_card_group_vertical-marginBottom: $spacing-base; // 垂直布局卡片式单选框组底部外边距

package/lib/cjs/rating/constants.js

@@ -4,11 +4,9 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.strings = exports.cssClasses = void 0;
-
 var _constants = require("../base/constants");
-
 const cssClasses = {
-  PREFIX: "".concat(_constants.BASE_CLASS_PREFIX, "-rating")
+  PREFIX: `${_constants.BASE_CLASS_PREFIX}-rating`
 };
 exports.cssClasses = cssClasses;
 const strings = {

package/lib/cjs/rating/foundation.js

@@ -4,26 +4,20 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = exports.RatingItemFoundation = void 0;
-
 var _foundation = _interopRequireDefault(require("../base/foundation"));
-
 var _warning = _interopRequireDefault(require("../utils/warning"));
-
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-
-/* eslint-disable no-param-reassign */
 class RatingFoundation extends _foundation.default {
   constructor(adapter) {
     super(Object.assign(Object.assign({}, RatingFoundation.defaultAdapter), adapter));
-
     this.handleStarFocusVisible = event => {
       const {
         target
       } = event;
       const {
         count
-      } = this.getProps(); // when rating 0 is focus visible
-
+      } = this.getProps();
+      // when rating 0 is focus visible
       try {
         if (target.matches(':focus-visible')) {
           this._adapter.setEmptyStarFocusVisible(true);
@@ -31,49 +25,40 @@ class RatingFoundation extends _foundation.default {
       } catch (error) {
         (0, _warning.default)(true, 'Warning: [Semi Rating] The current browser does not support the focus-visible');
       }
-    }; // e: FocusEvent
-
-
+    };
+    // e: FocusEvent
     this.handleStarBlur = e => {
       const {
         emptyStarFocusVisible
       } = this.getStates();
-
       if (emptyStarFocusVisible) {
         this._adapter.setEmptyStarFocusVisible(false);
       }
     };
   }
-
   init() {
     const {
       autoFocus,
       disabled
     } = this.getProps();
-
     if (autoFocus && !disabled) {
       this._adapter.focus();
     }
   }
-
   _getScroll(w, top) {
     let ret = top ? w.pageYOffset : w.pageXOffset;
     const method = top ? 'scrollTop' : 'scrollLeft';
-
     if (typeof ret !== 'number') {
-      const d = w.document; // ie6,7,8 standard mode
-
+      const d = w.document;
+      // ie6,7,8 standard mode
       ret = d.documentElement[method];
-
       if (typeof ret !== 'number') {
         // quirks mode
         ret = d.body[method];
       }
     }
-
     return ret;
   }
-
   _getClientPosition(elem) {
     let x, y;
     const doc = elem.ownerDocument;
@@ -91,59 +76,45 @@ class RatingFoundation extends _foundation.default {
       top: y
     };
   }
-
   _getOffsetLeft(el) {
     const pos = this._getClientPosition(el);
-
     const doc = el.ownerDocument;
     const w = doc.defaultView || doc.parentWindow;
     pos.left += this._getScroll(w);
     return pos.left;
   }
-
   getStarValue(index, pos) {
     const {
       allowHalf
     } = this.getProps();
-
     const direction = this._adapter.getContext('direction');
-
     const reverse = direction === 'rtl';
     let value = index + 1;
-
     if (allowHalf) {
       const starEle = this._adapter.getStarDOM(index);
-
       const leftDis = this._getOffsetLeft(starEle);
-
       const width = starEle.clientWidth;
-
       if (reverse && pos - leftDis > width / 2) {
         value -= 0.5;
       } else if (!reverse && pos - leftDis < width / 2) {
         value -= 0.5;
       }
     }
-
     return value;
   }
-
   handleHover(event, index) {
     const currValue = this.getStarValue(index, event.pageX);
     const {
       clearedValue,
       hoverValue
     } = this.getStates();
-
     if (currValue !== hoverValue && currValue !== clearedValue) {
       this._adapter.notifyHoverChange(currValue, null);
     }
   }
-
   handleMouseLeave() {
     this._adapter.notifyHoverChange(undefined, null);
   }
-
   handleClick(event, index) {
     const {
       allowClear
@@ -153,24 +124,19 @@ class RatingFoundation extends _foundation.default {
     } = this.getStates();
     const newValue = this.getStarValue(index, event.pageX);
     const isReset = allowClear ? newValue === value : false;
-
     this._adapter.updateValue(isReset ? 0 : newValue);
-
     if (isReset) {
       this._adapter.notifyHoverChange(undefined, newValue);
     } else {
       this._adapter.clearValue(null);
     }
   }
-
   handleFocus(e) {
     this._adapter.notifyFocus(e);
   }
-
   handleBlur(e) {
     this._adapter.notifyBlur(e);
   }
-
   handleKeyDown(event, value) {
     const {
       key
@@ -179,20 +145,16 @@ class RatingFoundation extends _foundation.default {
       count,
       allowHalf
     } = this.getProps();
-
     const direction = this._adapter.getContext('direction');
-
     const reverse = direction === 'rtl';
     const step = allowHalf ? 0.5 : 1;
     let tempValue;
     let newValue;
-
     if (key === 'ArrowRight' || key === 'ArrowUp') {
       tempValue = value + (reverse ? -step : step);
     } else if (key === 'ArrowLeft' || key === 'ArrowDown') {
       tempValue = value + (reverse ? step : -step);
     }
-
     if (tempValue > count) {
       newValue = 0;
     } else if (tempValue < 0) {
@@ -200,19 +162,14 @@ class RatingFoundation extends _foundation.default {
     } else {
       newValue = tempValue;
     }
-
     if (['ArrowRight', 'ArrowUp', 'ArrowLeft', 'ArrowDown'].includes(key)) {
       this._adapter.notifyKeyDown(event);
-
       this._adapter.updateValue(newValue);
-
       this.changeFocusStar(newValue, event);
       event.preventDefault();
-
       this._adapter.notifyHoverChange(undefined, null);
     }
   }
-
   changeFocusStar(value, event) {
     const {
       count,
@@ -221,7 +178,6 @@ class RatingFoundation extends _foundation.default {
     } = this.getProps();
     const index = Math.ceil(value) - 1;
     const starElement = [...event.currentTarget.childNodes].map(item => item.childNodes[0].childNodes);
-
     if (index < 0) {
       starElement[count][0].focus({
         preventScroll
@@ -232,20 +188,16 @@ class RatingFoundation extends _foundation.default {
       });
     }
   }
-
 }
-
 exports.default = RatingFoundation;
-
 class RatingItemFoundation extends _foundation.default {
   constructor(adapter) {
     super(Object.assign(Object.assign({}, RatingItemFoundation.defaultAdapter), adapter));
-
     this.handleFocusVisible = (event, star) => {
       const {
         target
-      } = event; // when rating 0 is focus visible
-
+      } = event;
+      // when rating 0 is focus visible
       try {
         if (target.matches(':focus-visible')) {
           if (star === 'first') {
@@ -257,15 +209,13 @@ class RatingItemFoundation extends _foundation.default {
       } catch (error) {
         (0, _warning.default)(true, 'Warning: [Semi Rating] The current browser does not support the focus-visible');
       }
-    }; // e: FocusEvent
-
-
+    };
+    // e: FocusEvent
     this.handleBlur = (e, star) => {
       const {
         firstStarFocus,
         secondStarFocus
       } = this.getStates();
-
       if (star === 'first') {
         firstStarFocus && this._adapter.setFirstStarFocus(false);
       } else {
@@ -273,7 +223,5 @@ class RatingItemFoundation extends _foundation.default {
       }
     };
   }
-
 }
-
 exports.RatingItemFoundation = RatingItemFoundation;

package/lib/cjs/scrollList/constants.js

@@ -4,12 +4,10 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.strings = exports.numbers = exports.cssClasses = void 0;
-
 var _constants = require("../base/constants");
-
 const cssClasses = {
-  PREFIX: "".concat(_constants.BASE_CLASS_PREFIX, "-scrolllist"),
-  SELECTED: "".concat(_constants.BASE_CLASS_PREFIX, "-scrolllist-item-selected")
+  PREFIX: `${_constants.BASE_CLASS_PREFIX}-scrolllist`,
+  SELECTED: `${_constants.BASE_CLASS_PREFIX}-scrolllist-item-selected`
 };
 exports.cssClasses = cssClasses;
 const strings = {

package/lib/cjs/scrollList/foundation.js

@@ -4,11 +4,7 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
-
 var _foundation = _interopRequireDefault(require("../base/foundation"));
-
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-
 class ScrollListFoundation extends _foundation.default {}
-
 exports.default = ScrollListFoundation;

package/lib/cjs/scrollList/itemFoundation.js

@@ -4,40 +4,28 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
-
 var _findIndex2 = _interopRequireDefault(require("lodash/findIndex"));
-
 var _find2 = _interopRequireDefault(require("lodash/find"));
-
 var _slice2 = _interopRequireDefault(require("lodash/slice"));
-
 var _foundation = _interopRequireDefault(require("../base/foundation"));
-
 var _isElement = _interopRequireDefault(require("../utils/isElement"));
-
 var _dom = require("../utils/dom");
-
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-
 class ItemFoundation extends _foundation.default {
   constructor() {
     super(...arguments);
     this._cachedSelectedNode = null;
   }
-
   selectIndex(index, listWrapper) {
     const {
       type,
       list
     } = this.getProps();
-
     if (index > -1 && Array.isArray(list) && list.length && (0, _isElement.default)(listWrapper)) {
       const indexInData = index % list.length;
       const item = list[indexInData];
       const node = listWrapper.children[index];
-
       this._adapter.setSelectedNode(node);
-
       this._adapter.notifySelectItem(Object.assign(Object.assign({}, item), {
         value: item.value,
         type,
@@ -45,30 +33,24 @@ class ItemFoundation extends _foundation.default {
       }));
     }
   }
-
   selectNode(node, listWrapper) {
     const {
       type,
       list: data
     } = this.getProps();
-
     if ((0, _isElement.default)(node) && (0, _isElement.default)(listWrapper)) {
       const indexInList = (0, _findIndex2.default)(listWrapper.children, ele => ele === node);
       const indexInData = indexInList % data.length;
       const cachedIndexInList = (0, _findIndex2.default)(listWrapper.children, ele => ele === this._cachedSelectedNode);
       const cachedIndexData = cachedIndexInList % data.length;
       const item = data[indexInData];
-
       this._adapter.setSelectedNode(node);
-
-      this._adapter.scrollToCenter(node); // Avoid triggerring notifySelectItem twice,
+      this._adapter.scrollToCenter(node);
+      // Avoid triggerring notifySelectItem twice,
       // because that scroll event will be trigger
       // when you click to select an item.
-
-
       if (this._cachedSelectedNode !== node) {
         this._cachedSelectedNode = node;
-
         if (cachedIndexData !== indexInData) {
           this._adapter.notifySelectItem(Object.assign(Object.assign({}, item), {
             value: item.value,
@@ -86,35 +68,28 @@ class ItemFoundation extends _foundation.default {
    * @param {number} ratio
    * @returns {boolean}
    */
-
-
   shouldAppend(listWrapper, scrollWrapper) {
     let ratio = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : 2;
     const tag = 'li';
-
     if ((0, _isElement.default)(listWrapper) && (0, _isElement.default)(scrollWrapper)) {
       const itemNodes = listWrapper.querySelectorAll(tag);
       const lastNode = itemNodes[itemNodes.length - 1];
       const {
         list
       } = this.getProps();
-
       if (lastNode) {
         const scrollRect = scrollWrapper.getBoundingClientRect();
         const lastRect = lastNode.getBoundingClientRect();
         const listHeight = lastRect.height * list.length;
         let baseTop = lastRect.top;
         let count = 0;
-
         while (baseTop <= scrollRect.top + scrollRect.height * ratio) {
           count += 1;
           baseTop += listHeight;
         }
-
         return count;
       }
     }
-
     return false;
   }
   /**
@@ -125,35 +100,28 @@ class ItemFoundation extends _foundation.default {
    *
    * @returns {boolean}
    */
-
-
   shouldPrepend(listWrapper, scrollWrapper) {
     let ratio = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : 2;
     const tag = 'li';
-
     if ((0, _isElement.default)(listWrapper) && (0, _isElement.default)(scrollWrapper)) {
       const itemNodes = listWrapper.querySelectorAll(tag);
       const firstNode = itemNodes[0];
       const {
         list
       } = this.getProps();
-
       if (firstNode) {
         const scrollRect = scrollWrapper.getBoundingClientRect();
         const firstRect = firstNode.getBoundingClientRect();
         const listHeight = firstRect.height * list.length;
         let baseTop = firstRect.top;
         let count = 0;
-
         while (baseTop + firstRect.height >= scrollRect.top - scrollRect.height * ratio) {
           count += 1;
           baseTop -= listHeight;
         }
-
         return count;
       }
     }
-
     return 0;
   }
   /**
@@ -162,20 +130,17 @@ class ItemFoundation extends _foundation.default {
    * @param {HTMLElement} wrapper
    * @param {Function} [callback]
    */
-
-
   initWheelList(listWrapper, wrapper, callback) {
     const {
       list
     } = this.getProps();
-
     if ((0, _isElement.default)(wrapper) && (0, _isElement.default)(listWrapper) && list && list.length) {
       const allNodes = listWrapper.children;
       const baseNodes = (0, _slice2.default)(allNodes, 0, list.length);
       const prependCount = this.shouldPrepend(listWrapper, wrapper);
-      const appendCount = this.shouldAppend(listWrapper, wrapper); // this._adapter.setPrependCount(prependCount);
+      const appendCount = this.shouldAppend(listWrapper, wrapper);
+      // this._adapter.setPrependCount(prependCount);
       // this._adapter.setAppendCount(appendCount);
-
       this._adapter.setState({
         prependCount,
         appendCount
@@ -188,30 +153,26 @@ class ItemFoundation extends _foundation.default {
    * @param {HTMLElement} wrapper
    * @param {HTMLElement} [nearestNode]
    */
-
-
   adjustInfiniteList(listWrapper, wrapper, nearestNode) {
     const {
       list
     } = this.getProps();
     const nodeTag = 'li';
-
     if ((0, _isElement.default)(wrapper) && (0, _isElement.default)(listWrapper) && list && list.length) {
       const allNodes = listWrapper.querySelectorAll(nodeTag);
       const total = allNodes.length;
       const ratio = 1;
       const prependCount = this.shouldPrepend(listWrapper, wrapper, ratio);
-      const appendCount = this.shouldAppend(listWrapper, wrapper, ratio); // while (this.shouldPrepend(listWrapper, wrapper, nearestNode)) {
-
+      const appendCount = this.shouldAppend(listWrapper, wrapper, ratio);
+      // while (this.shouldPrepend(listWrapper, wrapper, nearestNode)) {
       if (prependCount) {
         // move last nodes to first position
         for (let i = 0; i < prependCount; i++) {
           const nodes = (0, _slice2.default)(allNodes, total - list.length * (i + 1), total - list.length * i);
           (0, _dom.prepend)(listWrapper, ...nodes);
         }
-      } // while (this.shouldAppend(listWrapper, wrapper, nearestNode)) {
-
-
+      }
+      // while (this.shouldAppend(listWrapper, wrapper, nearestNode)) {
       if (appendCount) {
         for (let i = 0; i < appendCount; i++) {
           const nodes = (0, _slice2.default)(allNodes, i * list.length, (i + 1) * list.length);
@@ -226,8 +187,6 @@ class ItemFoundation extends _foundation.default {
    * @param {HTMLElement} selector
    *
    */
-
-
   getNearestNodeInfo(listWrapper, selector) {
     if ((0, _isElement.default)(listWrapper) && (0, _isElement.default)(selector)) {
       const selectorRect = selector.getBoundingClientRect();
@@ -240,7 +199,6 @@ class ItemFoundation extends _foundation.default {
         const rect = node.getBoundingClientRect();
         const rectTop = rect.top;
         const absDistance = Math.abs(rectTop - selectorTop);
-
         if (absDistance < nearestDistance && !this._adapter.isDisabledIndex(index)) {
           nearestDistance = absDistance;
           nearestNode = node;
@@ -252,7 +210,6 @@ class ItemFoundation extends _foundation.default {
         nearestIndex
       };
     }
-
     return undefined;
   }
   /**
@@ -261,8 +218,6 @@ class ItemFoundation extends _foundation.default {
    *
    * @param {HTMLElement|null}
    */
-
-
   getTargetNode(e, listWrapper) {
     if (e && (0, _isElement.default)(listWrapper)) {
       const targetTagName = 'li';
@@ -276,21 +231,16 @@ class ItemFoundation extends _foundation.default {
       const targetNode = (0, _find2.default)(itemNodes, (node, index) => {
         if (node === currentTarget || node.contains(currentTarget)) {
           targetIndex = index;
-
           if (length > 0) {
             indexInList = index % length;
           }
-
           return true;
         }
-
         return undefined;
       });
-
       if (indexInList > -1) {
         infoInList = list[indexInList];
       }
-
       return {
         targetNode,
         targetIndex,
@@ -298,10 +248,7 @@ class ItemFoundation extends _foundation.default {
         infoInList
       };
     }
-
     return null;
   }
-
 }
-
 exports.default = ItemFoundation;

package/lib/cjs/scrollList/scrollTo.js

@@ -4,9 +4,7 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
-
 var _semiAnimation = require("@douyinfe/semi-animation");
-
 const scrollTo = (element, to, duration) => {
   const animation = new _semiAnimation.Animation({
     from: {
@@ -23,10 +21,9 @@ const scrollTo = (element, to, duration) => {
       scrollTop
     } = _ref;
     element.scrollTop = scrollTop;
-  }); // animation.start();
-
+  });
+  // animation.start();
   return animation;
 };
-
 var _default = scrollTo;
 exports.default = _default;