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

package/lib/cjs/input/textareaFoundation.js

@@ -48,7 +48,7 @@ class TextAreaFoundation extends _foundation.default {
       if (height !== newHeight) {
         this._adapter.notifyHeightUpdate(newHeight);
 
-        node.style.height = "".concat(newHeight, "px");
+        node.style.height = `${newHeight}px`;
         return;
       }
 

package/lib/cjs/layout/constants.js

@@ -8,7 +8,7 @@ exports.strings = exports.cssClasses = void 0;
 var _constants = require("../base/constants");
 
 const cssClasses = {
-  PREFIX: "".concat(_constants.BASE_CLASS_PREFIX, "-layout")
+  PREFIX: `${_constants.BASE_CLASS_PREFIX}-layout`
 };
 exports.cssClasses = cssClasses;
 const strings = {

package/lib/cjs/list/constants.js

@@ -8,7 +8,7 @@ exports.strings = exports.cssClasses = void 0;
 var _constants = require("../base/constants");
 
 const cssClasses = {
-  PREFIX: "".concat(_constants.BASE_CLASS_PREFIX, "-list")
+  PREFIX: `${_constants.BASE_CLASS_PREFIX}-list`
 };
 exports.cssClasses = cssClasses;
 const strings = {

package/lib/cjs/modal/constants.js

@@ -8,7 +8,7 @@ exports.strings = exports.cssClasses = void 0;
 var _constants = require("../base/constants");
 
 const cssClasses = {
-  DIALOG: "".concat(_constants.BASE_CLASS_PREFIX, "-modal")
+  DIALOG: `${_constants.BASE_CLASS_PREFIX}-modal`
 };
 exports.cssClasses = cssClasses;
 const strings = {

package/lib/cjs/navigation/constants.js

@@ -10,7 +10,7 @@ var _constants = require("../base/constants");
 const MODE_HORIZONTAL = 'horizontal';
 const MODE_VERTICAL = 'vertical';
 const cssClasses = {
-  PREFIX: "".concat(_constants.BASE_CLASS_PREFIX, "-navigation")
+  PREFIX: `${_constants.BASE_CLASS_PREFIX}-navigation`
 };
 exports.cssClasses = cssClasses;
 const strings = {

package/lib/cjs/notification/constants.js

@@ -8,9 +8,9 @@ exports.strings = exports.numbers = exports.cssClasses = void 0;
 var _constants = require("../base/constants");
 
 const cssClasses = {
-  WRAPPER: "".concat(_constants.BASE_CLASS_PREFIX, "-notification-wrapper"),
-  LIST: "".concat(_constants.BASE_CLASS_PREFIX, "-notification-list"),
-  NOTICE: "".concat(_constants.BASE_CLASS_PREFIX, "-notification-notice")
+  WRAPPER: `${_constants.BASE_CLASS_PREFIX}-notification-wrapper`,
+  LIST: `${_constants.BASE_CLASS_PREFIX}-notification-list`,
+  NOTICE: `${_constants.BASE_CLASS_PREFIX}-notification-notice`
 };
 exports.cssClasses = cssClasses;
 const strings = {

package/lib/cjs/pagination/constants.js

@@ -8,7 +8,7 @@ exports.strings = exports.numbers = exports.cssClasses = void 0;
 var _constants = require("../base/constants");
 
 const cssClasses = {
-  PREFIX: "".concat(_constants.BASE_CLASS_PREFIX, "-page")
+  PREFIX: `${_constants.BASE_CLASS_PREFIX}-page`
 };
 exports.cssClasses = cssClasses;
 const strings = {};

package/lib/cjs/popconfirm/constants.js

@@ -8,8 +8,8 @@ exports.strings = exports.numbers = exports.cssClasses = void 0;
 var _constants = require("../base/constants");
 
 const cssClasses = {
-  PREFIX: "".concat(_constants.BASE_CLASS_PREFIX, "-popconfirm"),
-  POPOVER: "".concat(_constants.BASE_CLASS_PREFIX, "-popconfirm-popover")
+  PREFIX: `${_constants.BASE_CLASS_PREFIX}-popconfirm`,
+  POPOVER: `${_constants.BASE_CLASS_PREFIX}-popconfirm-popover`
 };
 exports.cssClasses = cssClasses;
 const strings = {

package/lib/cjs/popconfirm/popconfirmFoundation.d.ts

@@ -7,6 +7,9 @@ export interface PopconfirmAdapter<P = Record<string, any>, S = Record<string, a
     notifyCancel: (e: any) => Promise<any> | void;
     notifyVisibleChange: (visible: boolean) => void;
     notifyClickOutSide: (e: any) => void;
+    focusCancelButton: () => void;
+    focusOkButton: () => void;
+    focusPrevFocusElement: () => void;
 }
 export default class PopConfirmFoundation<P = Record<string, any>, S = Record<string, any>> extends BaseFoundation<PopconfirmAdapter<P, S>, P, S> {
     init(): void;
@@ -15,4 +18,5 @@ export default class PopConfirmFoundation<P = Record<string, any>, S = Record<st
     handleConfirm(e: any): void;
     handleClickOutSide(e: any): void;
     handleVisibleChange(visible: boolean): void;
+    handleFocusOperateButton(): void;
 }

package/lib/cjs/popconfirm/popconfirmFoundation.js

@@ -5,13 +5,14 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.default = void 0;
 
+var _get2 = _interopRequireDefault(require("lodash/get"));
+
 var _foundation = _interopRequireDefault(require("../base/foundation"));
 
 var _isPromise = _interopRequireDefault(require("../utils/isPromise"));
 
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
-/* eslint-disable @typescript-eslint/no-empty-function */
 class PopConfirmFoundation extends _foundation.default {
   init() {}
 
@@ -62,9 +63,28 @@ class PopConfirmFoundation extends _foundation.default {
       this._adapter.setVisible(visible);
     }
 
+    if (visible) {
+      this.handleFocusOperateButton();
+    } else {
+      this._adapter.focusPrevFocusElement();
+    }
+
     this._adapter.notifyVisibleChange(visible);
   }
 
+  handleFocusOperateButton() {
+    const {
+      cancelButtonProps,
+      okButtonProps
+    } = this._adapter.getProps();
+
+    if ((0, _get2.default)(cancelButtonProps, 'autoFocus') && !(0, _get2.default)(cancelButtonProps, 'disabled')) {
+      this._adapter.focusCancelButton();
+    } else if ((0, _get2.default)(okButtonProps, 'autoFocus') && !(0, _get2.default)(okButtonProps, 'disabled')) {
+      this._adapter.focusOkButton();
+    }
+  }
+
 }
 
 exports.default = PopConfirmFoundation;

package/lib/cjs/popover/constants.js

@@ -10,8 +10,8 @@ var _constants = require("../tooltip/constants");
 var _constants2 = require("../base/constants");
 
 const cssClasses = {
-  PREFIX: "".concat(_constants2.BASE_CLASS_PREFIX, "-popover"),
-  ARROW: "".concat(_constants2.BASE_CLASS_PREFIX, "-popover-icon-arrow")
+  PREFIX: `${_constants2.BASE_CLASS_PREFIX}-popover`,
+  ARROW: `${_constants2.BASE_CLASS_PREFIX}-popover-icon-arrow`
 };
 exports.cssClasses = cssClasses;
 const strings = {

package/lib/cjs/progress/constants.js

@@ -8,7 +8,7 @@ exports.strings = exports.cssClasses = void 0;
 var _constants = require("../base/constants");
 
 const cssClasses = {
-  PREFIX: "".concat(_constants.BASE_CLASS_PREFIX, "-progress")
+  PREFIX: `${_constants.BASE_CLASS_PREFIX}-progress`
 };
 exports.cssClasses = cssClasses;
 const strings = {

package/lib/cjs/progress/generates.js

@@ -61,10 +61,10 @@ function generateGradients(g, index) {
   } = g;
   const sA = startColor.split('');
   const eA = endColor.split('');
-  const rC = [parseInt("".concat(sA[1]).concat(sA[2]), 16), parseInt("".concat(eA[1]).concat(eA[2]), 16)];
-  const gC = [parseInt("".concat(sA[3]).concat(sA[4]), 16), parseInt("".concat(eA[3]).concat(eA[4]), 16)];
-  const bC = [parseInt("".concat(sA[5]).concat(sA[6]), 16), parseInt("".concat(eA[5]).concat(eA[6]), 16)];
-  const aC = [parseInt("".concat(sA[7]).concat(sA[8]), 16), parseInt("".concat(eA[7]).concat(eA[8]), 16)];
+  const rC = [parseInt(`${sA[1]}${sA[2]}`, 16), parseInt(`${eA[1]}${eA[2]}`, 16)];
+  const gC = [parseInt(`${sA[3]}${sA[4]}`, 16), parseInt(`${eA[3]}${eA[4]}`, 16)];
+  const bC = [parseInt(`${sA[5]}${sA[6]}`, 16), parseInt(`${eA[5]}${eA[6]}`, 16)];
+  const aC = [parseInt(`${sA[7]}${sA[8]}`, 16), parseInt(`${eA[7]}${eA[8]}`, 16)];
   const rStep = (rC[0] - rC[1]) / (size + 1);
   const gStep = (gC[0] - gC[1]) / (size + 1);
   const bStep = (bC[0] - bC[1]) / (size + 1);
@@ -74,14 +74,14 @@ function generateGradients(g, index) {
     const rS = Math.round(rC[0] - rStep * (i + 1)).toString(16);
     const gS = Math.round(gC[0] - gStep * (i + 1)).toString(16);
     const bS = Math.round(bC[0] - bStep * (i + 1)).toString(16);
-    const h = "".concat(padTwo(rS)).concat(padTwo(gS)).concat(padTwo(bS));
+    const h = `${padTwo(rS)}${padTwo(gS)}${padTwo(bS)}`;
     const t = Math.floor(aStep * (i + 1) + aC[1]).toString(16);
-    return toHex.Hex("#".concat(h), t);
+    return toHex.Hex(`#${h}`, t);
   }
 
   function padTwo(s) {
     if (s.length === 1) {
-      return "0".concat(s);
+      return `0${s}`;
     }
 
     if (s.length === 0) {
@@ -129,10 +129,10 @@ function formatToHex(color) {
     }
 
     if (SEMI_DESIGN_TOKENS.SEQUENCE.indexOf(color) !== -1) {
-      return toHex.SemiDesignToken("".concat(color, "-5"));
+      return toHex.SemiDesignToken(`${color}-5`);
     }
 
-    return toHex.SemiDesignToken("".concat(color));
+    return toHex.SemiDesignToken(`${color}`);
   }
 
   return undefined;
@@ -141,14 +141,14 @@ function formatToHex(color) {
 const toHex = {
   Hex(color, transparency) {
     color = color.replace('#', '');
-    if (color.length === 8) return "#".concat(color);
-    if (color.length === 6) return "#".concat(color).concat(transparency || 'ff');
+    if (color.length === 8) return `#${color}`;
+    if (color.length === 6) return `#${color}${transparency || 'ff'}`;
 
     if (color.length === 3) {
       color = color.split('').map(c => c + c).join('');
     }
 
-    return "#".concat(color).concat(transparency || 'ff');
+    return `#${color}${transparency || 'ff'}`;
   },
 
   SemiDesignToken(color) {
@@ -157,9 +157,9 @@ const toHex = {
       return undefined;
     }
 
-    const variable = getComputedStyle(document.body).getPropertyValue("--semi-".concat(color));
+    const variable = getComputedStyle(document.body).getPropertyValue(`--semi-${color}`);
     if (variable === '') return undefined;
-    const rgba = "rgba(".concat(variable, ", 1)");
+    const rgba = `rgba(${variable}, 1)`;
     return toHex.RgbA(rgba);
   },
 

package/lib/cjs/radio/constants.js

@@ -8,22 +8,22 @@ exports.strings = exports.radioGroupClasses = exports.radioClasses = exports.num
 var _constants = require("../base/constants");
 
 const radioClasses = {
-  PREFIX: "".concat(_constants.BASE_CLASS_PREFIX, "-radio"),
-  INNER: "".concat(_constants.BASE_CLASS_PREFIX, "-radio-inner"),
-  TEXT: "".concat(_constants.BASE_CLASS_PREFIX, "-radio-text"),
-  INPUT: "".concat(_constants.BASE_CLASS_PREFIX, "-radio-input"),
-  CHECKED: "".concat(_constants.BASE_CLASS_PREFIX, "-radio-checked"),
-  DISABLED: "".concat(_constants.BASE_CLASS_PREFIX, "-radio-disabled"),
-  BUTTON: "".concat(_constants.BASE_CLASS_PREFIX, "-radio-button")
+  PREFIX: `${_constants.BASE_CLASS_PREFIX}-radio`,
+  INNER: `${_constants.BASE_CLASS_PREFIX}-radio-inner`,
+  TEXT: `${_constants.BASE_CLASS_PREFIX}-radio-text`,
+  INPUT: `${_constants.BASE_CLASS_PREFIX}-radio-input`,
+  CHECKED: `${_constants.BASE_CLASS_PREFIX}-radio-checked`,
+  DISABLED: `${_constants.BASE_CLASS_PREFIX}-radio-disabled`,
+  BUTTON: `${_constants.BASE_CLASS_PREFIX}-radio-button`
 };
 exports.radioClasses = radioClasses;
 const radioGroupClasses = {
-  PREFIX: "".concat(_constants.BASE_CLASS_PREFIX, "-radioGroup"),
-  INNER: "".concat(_constants.BASE_CLASS_PREFIX, "-radioGroup-inner"),
-  TEXT: "".concat(_constants.BASE_CLASS_PREFIX, "-radioGroup-text"),
-  INPUT: "".concat(_constants.BASE_CLASS_PREFIX, "-radioGroup-input"),
-  CHECKED: "".concat(_constants.BASE_CLASS_PREFIX, "-radioGroup-checked"),
-  DISABLED: "".concat(_constants.BASE_CLASS_PREFIX, "-radioGroup-disabled")
+  PREFIX: `${_constants.BASE_CLASS_PREFIX}-radioGroup`,
+  INNER: `${_constants.BASE_CLASS_PREFIX}-radioGroup-inner`,
+  TEXT: `${_constants.BASE_CLASS_PREFIX}-radioGroup-text`,
+  INPUT: `${_constants.BASE_CLASS_PREFIX}-radioGroup-input`,
+  CHECKED: `${_constants.BASE_CLASS_PREFIX}-radioGroup-checked`,
+  DISABLED: `${_constants.BASE_CLASS_PREFIX}-radioGroup-disabled`
 };
 exports.radioGroupClasses = radioGroupClasses;
 const strings = {

package/lib/cjs/rating/constants.js

@@ -8,7 +8,7 @@ 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/scrollList/constants.js

@@ -8,8 +8,8 @@ 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/select/constants.js

@@ -10,9 +10,9 @@ var _constants = require("../base/constants");
 var _constants2 = require("../tooltip/constants");
 
 const cssClasses = {
-  PREFIX: "".concat(_constants.BASE_CLASS_PREFIX, "-select"),
-  PREFIX_OPTION: "".concat(_constants.BASE_CLASS_PREFIX, "-select-option"),
-  PREFIX_GROUP: "".concat(_constants.BASE_CLASS_PREFIX, "-select-group")
+  PREFIX: `${_constants.BASE_CLASS_PREFIX}-select`,
+  PREFIX_OPTION: `${_constants.BASE_CLASS_PREFIX}-select-option`,
+  PREFIX_GROUP: `${_constants.BASE_CLASS_PREFIX}-select-group`
 };
 exports.cssClasses = cssClasses;
 const strings = {

package/lib/cjs/select/foundation.js

@@ -1367,7 +1367,8 @@ class SelectFoundation extends _foundation.default {
     const isMultiple = this._isMultiple();
 
     if (!isMultiple) {
-      console.warn("[Semi Select]: It seems that you have called the selectAll method in the single-selection Select.\n                Please note that this is not a legal way to use it");
+      console.warn(`[Semi Select]: It seems that you have called the selectAll method in the single-selection Select.
+                Please note that this is not a legal way to use it`);
       return;
     }
 

package/lib/cjs/select/select.css

@@ -92,6 +92,7 @@
 }
 .semi-select:focus {
   border: 1px solid var(--semi-color-focus-border);
+  background-color: var(--semi-color-fill-0);
   outline: 0;
 }
 .semi-select-small {

package/lib/cjs/select/select.scss

@@ -36,6 +36,7 @@ $overflowList: #{$prefix}-overflow-list;
 
     &:focus {
         border: $width-select-border-focus solid $color-select-border-focus;
+        background-color: $color-select-bg-focus;
         outline: 0;
     }
 

package/lib/cjs/select/variables.scss

@@ -2,6 +2,7 @@
 $color-select-bg-default: var(--semi-color-fill-0); // 选择器输入框背景色 - 默认态
 $color-select-bg-hover: var(--semi-color-fill-1); // 选择器输入框背景色 - 悬停态
 $color-select-bg-active: var(--semi-color-fill-2); // 选择器输入框背景色 - 按下态
+$color-select-bg-focus: var(--semi-color-fill-0); // 选择器输入框背景色 - 聚焦态
 $color-select-border-default: transparent; // 选择器输入框描边颜色
 $color-select-border-hover: $color-select-border-default;  // 选择器输入框描边颜色 - 悬浮
 $color-select-border-active: var(--semi-color-focus-border); // 选择器输入框描边颜色 - 按下态

package/lib/cjs/sideSheet/constants.js

@@ -8,8 +8,8 @@ exports.strings = exports.cssClasses = void 0;
 var _constants = require("../base/constants");
 
 const cssClasses = {
-  PREFIX: "".concat(_constants.BASE_CLASS_PREFIX, "-sidesheet"),
-  DIALOG: "".concat(_constants.BASE_CLASS_PREFIX, "-modal")
+  PREFIX: `${_constants.BASE_CLASS_PREFIX}-sidesheet`,
+  DIALOG: `${_constants.BASE_CLASS_PREFIX}-modal`
 };
 exports.cssClasses = cssClasses;
 const strings = {

package/lib/cjs/skeleton/constants.js

@@ -8,7 +8,7 @@ exports.strings = exports.cssClasses = void 0;
 var _constants = require("../base/constants");
 
 const cssClasses = {
-  PREFIX: "".concat(_constants.BASE_CLASS_PREFIX, "-skeleton")
+  PREFIX: `${_constants.BASE_CLASS_PREFIX}-skeleton`
 };
 exports.cssClasses = cssClasses;
 const strings = {};

package/lib/cjs/slider/constants.js

@@ -8,13 +8,13 @@ exports.strings = exports.cssClasses = void 0;
 var _constants = require("../base/constants");
 
 const cssClasses = {
-  PREFIX: "".concat(_constants.BASE_CLASS_PREFIX, "-slider"),
-  DISABLED: "".concat(_constants.BASE_CLASS_PREFIX, "-slider-disabled"),
-  VERTICAL: "".concat(_constants.BASE_CLASS_PREFIX, "-slider-vertical"),
-  TRACK: "".concat(_constants.BASE_CLASS_PREFIX, "-slider-track"),
-  DOTS: "".concat(_constants.BASE_CLASS_PREFIX, "-slider-dots"),
-  MARKS: "".concat(_constants.BASE_CLASS_PREFIX, "-slider-marks"),
-  HANDLE: "".concat(_constants.BASE_CLASS_PREFIX, "-slider-handle")
+  PREFIX: `${_constants.BASE_CLASS_PREFIX}-slider`,
+  DISABLED: `${_constants.BASE_CLASS_PREFIX}-slider-disabled`,
+  VERTICAL: `${_constants.BASE_CLASS_PREFIX}-slider-vertical`,
+  TRACK: `${_constants.BASE_CLASS_PREFIX}-slider-track`,
+  DOTS: `${_constants.BASE_CLASS_PREFIX}-slider-dots`,
+  MARKS: `${_constants.BASE_CLASS_PREFIX}-slider-marks`,
+  HANDLE: `${_constants.BASE_CLASS_PREFIX}-slider-handle`
 };
 exports.cssClasses = cssClasses;
 const strings = {

package/lib/cjs/space/constants.js

@@ -8,7 +8,7 @@ exports.strings = exports.cssClasses = void 0;
 var _constants = require("../base/constants");
 
 const cssClasses = {
-  PREFIX: "".concat(_constants.BASE_CLASS_PREFIX, "-space")
+  PREFIX: `${_constants.BASE_CLASS_PREFIX}-space`
 };
 exports.cssClasses = cssClasses;
 const strings = {

package/lib/cjs/spin/constants.js

@@ -7,7 +7,7 @@ exports.strings = exports.numbers = exports.cssClasses = void 0;
 
 var _constants = require("../base/constants");
 
-const PREFIX = "".concat(_constants.BASE_CLASS_PREFIX, "-spin");
+const PREFIX = `${_constants.BASE_CLASS_PREFIX}-spin`;
 const cssClasses = {
   PREFIX
 };