@douyinfe/semi-foundation 2.43.0-beta.0 → 2.43.1

package/dropdown/constants.ts

@@ -9,7 +9,7 @@ const cssClasses = {
 
 const strings = {
     POSITION_SET: tooltipStrings.POSITION_SET,
-    TRIGGER_SET: ['hover', 'focus', 'click', 'custom'],
+    TRIGGER_SET: ['hover', 'focus', 'click', 'custom', 'contextMenu'],
     DEFAULT_LEAVE_DELAY: 100,
     ITEM_TYPE: ['primary', 'secondary', 'tertiary', 'warning', 'danger'],
 };

package/lib/cjs/dropdown/constants.js

@@ -14,7 +14,7 @@ const cssClasses = {
 exports.cssClasses = cssClasses;
 const strings = {
   POSITION_SET: _constants.strings.POSITION_SET,
-  TRIGGER_SET: ['hover', 'focus', 'click', 'custom'],
+  TRIGGER_SET: ['hover', 'focus', 'click', 'custom', 'contextMenu'],
   DEFAULT_LEAVE_DELAY: 100,
   ITEM_TYPE: ['primary', 'secondary', 'tertiary', 'warning', 'danger']
 };

package/lib/cjs/popover/constants.d.ts

@@ -4,7 +4,7 @@ declare const cssClasses: {
 };
 declare const strings: {
     readonly POSITION_SET: readonly ["top", "topLeft", "topRight", "left", "leftTop", "leftBottom", "right", "rightTop", "rightBottom", "bottom", "bottomLeft", "bottomRight", "leftTopOver", "rightTopOver"];
-    readonly TRIGGER_SET: readonly ["hover", "focus", "click", "custom"];
+    readonly TRIGGER_SET: readonly ["hover", "focus", "click", "custom", "contextMenu"];
     readonly DEFAULT_ARROW_STYLE: {
         readonly borderOpacity: "1";
         readonly backgroundColor: "var(--semi-color-bg-3)";

package/lib/cjs/popover/constants.js

@@ -13,7 +13,7 @@ const cssClasses = {
 exports.cssClasses = cssClasses;
 const strings = {
   POSITION_SET: ['top', 'topLeft', 'topRight', 'left', 'leftTop', 'leftBottom', 'right', 'rightTop', 'rightBottom', 'bottom', 'bottomLeft', 'bottomRight', 'leftTopOver', 'rightTopOver'],
-  TRIGGER_SET: ['hover', 'focus', 'click', 'custom'],
+  TRIGGER_SET: ['hover', 'focus', 'click', 'custom', 'contextMenu'],
   DEFAULT_ARROW_STYLE: {
     borderOpacity: '1',
     backgroundColor: 'var(--semi-color-bg-3)',

package/lib/cjs/tagInput/foundation.js

@@ -41,10 +41,15 @@ class TagInputFoundation extends _foundation.default {
       }
     };
     this.handleInputCompositionStart = e => {
+      const {
+        maxLength
+      } = this.getProps();
+      if (!(0, _isNumber2.default)(maxLength)) {
+        return;
+      }
       this._adapter.setEntering(true);
     };
     this.handleInputCompositionEnd = e => {
-      this._adapter.setEntering(false);
       const {
         value
       } = e.target;
@@ -53,27 +58,31 @@ class TagInputFoundation extends _foundation.default {
         onInputExceed,
         separator
       } = this.getProps();
+      if (!(0, _isNumber2.default)(maxLength)) {
+        return;
+      }
+      this._adapter.setEntering(false);
       let allowChange = true;
-      const {
-        inputValue
-      } = this.getStates();
-      if ((0, _isNumber2.default)(maxLength)) {
-        const inputArr = (0, _getSplitedArray.default)(inputValue, separator);
-        let index = 0;
-        for (; index < inputArr.length; index++) {
-          if (inputArr[index].length > maxLength) {
-            allowChange = false;
-            (0, _isFunction2.default)(onInputExceed) && onInputExceed(value);
-            break;
-          }
+      const inputArr = (0, _getSplitedArray.default)(value, separator);
+      let index = 0;
+      for (; index < inputArr.length; index++) {
+        if (inputArr[index].length > maxLength) {
+          allowChange = false;
+          (0, _isFunction2.default)(onInputExceed) && onInputExceed(value);
+          break;
         }
-        if (!allowChange) {
-          const newInputArr = inputArr.slice(0, index);
-          if (index < inputArr.length) {
-            newInputArr.push(inputArr[index].slice(0, maxLength));
-          }
-          this._adapter.setInputValue(newInputArr.join(separator));
+      }
+      if (!allowChange) {
+        const newInputArr = inputArr.slice(0, index);
+        if (index < inputArr.length) {
+          newInputArr.push(inputArr[index].slice(0, maxLength));
         }
+        this._adapter.setInputValue(newInputArr.join(separator));
+      } else {
+        // Why does it need to be updated here instead of in onChange when the value meets the maxLength limit?
+        // Because in firefox, the state change in InputCompositionEnd causes onChange to not be triggered after 
+        // the composition input completes input.
+        this._adapter.setInputValue(value);
       }
     };
     /**

package/lib/cjs/tree/foundation.d.ts

@@ -169,7 +169,7 @@ export interface BasicTreeProps {
     onLoad?: (loadedKeys?: Set<string>, treeNode?: BasicTreeNodeData) => void;
     onContextMenu?: (e: any, node: BasicTreeNodeData) => void;
     onSearch?: (sunInput: string, filteredExpandedKeys: string[]) => void;
-    onSelect?: (selectedKeys: string, selected: boolean, selectedNode: BasicTreeNodeData) => void;
+    onSelect?: (selectedKey: string, selected: boolean, selectedNode: BasicTreeNodeData) => void;
     preventScroll?: boolean;
     renderDraggingNode?: (nodeInstance: HTMLElement, node: BasicTreeNodeData) => HTMLElement;
     renderFullLabel?: (renderFullLabelProps: BasicRenderFullLabelProps) => any;

package/lib/cjs/treeSelect/foundation.d.ts

@@ -64,7 +64,7 @@ export interface BasicTreeSelectProps extends Pick<BasicTreeProps, 'virtualize'
     restTagsPopoverProps?: any;
     clickTriggerToHide?: boolean;
     loadData?: (data: BasicTreeNodeData) => Promise<void>;
-    onSelect?: (selectedKeys: string, selected: boolean, selectedNode: BasicTreeNodeData) => void;
+    onSelect?: (selectedKey: string, selected: boolean, selectedNode: BasicTreeNodeData) => void;
     searchRender?: (inputProps: any) => any;
     renderSelectedItem?: BasicRenderSelectedItem;
     getPopupContainer?: () => HTMLElement;
@@ -89,7 +89,7 @@ export interface TreeSelectAdapter<P = Record<string, any>, S = Record<string, a
     unregisterClickOutsideHandler: () => void;
     rePositionDropdown: () => void;
     updateState: (states: Partial<BasicTreeSelectInnerData>) => void;
-    notifySelect: (selectedKeys: string, selected: boolean, selectedNode: BasicTreeNodeData) => void;
+    notifySelect: (selectedKey: string, selected: boolean, selectedNode: BasicTreeNodeData) => void;
     notifySearch: (input: string, filteredExpandedKeys: string[]) => void;
     cacheFlattenNodes: (bool: boolean) => void;
     openMenu: () => void;

package/lib/es/dropdown/constants.js

@@ -7,7 +7,7 @@ const cssClasses = {
 };
 const strings = {
   POSITION_SET: tooltipStrings.POSITION_SET,
-  TRIGGER_SET: ['hover', 'focus', 'click', 'custom'],
+  TRIGGER_SET: ['hover', 'focus', 'click', 'custom', 'contextMenu'],
   DEFAULT_LEAVE_DELAY: 100,
   ITEM_TYPE: ['primary', 'secondary', 'tertiary', 'warning', 'danger']
 };

package/lib/es/popover/constants.d.ts

@@ -4,7 +4,7 @@ declare const cssClasses: {
 };
 declare const strings: {
     readonly POSITION_SET: readonly ["top", "topLeft", "topRight", "left", "leftTop", "leftBottom", "right", "rightTop", "rightBottom", "bottom", "bottomLeft", "bottomRight", "leftTopOver", "rightTopOver"];
-    readonly TRIGGER_SET: readonly ["hover", "focus", "click", "custom"];
+    readonly TRIGGER_SET: readonly ["hover", "focus", "click", "custom", "contextMenu"];
     readonly DEFAULT_ARROW_STYLE: {
         readonly borderOpacity: "1";
         readonly backgroundColor: "var(--semi-color-bg-3)";

package/lib/es/popover/constants.js

@@ -6,7 +6,7 @@ const cssClasses = {
 };
 const strings = {
   POSITION_SET: ['top', 'topLeft', 'topRight', 'left', 'leftTop', 'leftBottom', 'right', 'rightTop', 'rightBottom', 'bottom', 'bottomLeft', 'bottomRight', 'leftTopOver', 'rightTopOver'],
-  TRIGGER_SET: ['hover', 'focus', 'click', 'custom'],
+  TRIGGER_SET: ['hover', 'focus', 'click', 'custom', 'contextMenu'],
   DEFAULT_ARROW_STYLE: {
     borderOpacity: '1',
     backgroundColor: 'var(--semi-color-bg-3)',

package/lib/es/tagInput/foundation.js

@@ -34,10 +34,15 @@ class TagInputFoundation extends BaseFoundation {
       }
     };
     this.handleInputCompositionStart = e => {
+      const {
+        maxLength
+      } = this.getProps();
+      if (!_isNumber(maxLength)) {
+        return;
+      }
       this._adapter.setEntering(true);
     };
     this.handleInputCompositionEnd = e => {
-      this._adapter.setEntering(false);
       const {
         value
       } = e.target;
@@ -46,27 +51,31 @@ class TagInputFoundation extends BaseFoundation {
         onInputExceed,
         separator
       } = this.getProps();
+      if (!_isNumber(maxLength)) {
+        return;
+      }
+      this._adapter.setEntering(false);
       let allowChange = true;
-      const {
-        inputValue
-      } = this.getStates();
-      if (_isNumber(maxLength)) {
-        const inputArr = getSplitedArray(inputValue, separator);
-        let index = 0;
-        for (; index < inputArr.length; index++) {
-          if (inputArr[index].length > maxLength) {
-            allowChange = false;
-            _isFunction(onInputExceed) && onInputExceed(value);
-            break;
-          }
+      const inputArr = getSplitedArray(value, separator);
+      let index = 0;
+      for (; index < inputArr.length; index++) {
+        if (inputArr[index].length > maxLength) {
+          allowChange = false;
+          _isFunction(onInputExceed) && onInputExceed(value);
+          break;
         }
-        if (!allowChange) {
-          const newInputArr = inputArr.slice(0, index);
-          if (index < inputArr.length) {
-            newInputArr.push(inputArr[index].slice(0, maxLength));
-          }
-          this._adapter.setInputValue(newInputArr.join(separator));
+      }
+      if (!allowChange) {
+        const newInputArr = inputArr.slice(0, index);
+        if (index < inputArr.length) {
+          newInputArr.push(inputArr[index].slice(0, maxLength));
         }
+        this._adapter.setInputValue(newInputArr.join(separator));
+      } else {
+        // Why does it need to be updated here instead of in onChange when the value meets the maxLength limit?
+        // Because in firefox, the state change in InputCompositionEnd causes onChange to not be triggered after 
+        // the composition input completes input.
+        this._adapter.setInputValue(value);
       }
     };
     /**

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

@@ -169,7 +169,7 @@ export interface BasicTreeProps {
     onLoad?: (loadedKeys?: Set<string>, treeNode?: BasicTreeNodeData) => void;
     onContextMenu?: (e: any, node: BasicTreeNodeData) => void;
     onSearch?: (sunInput: string, filteredExpandedKeys: string[]) => void;
-    onSelect?: (selectedKeys: string, selected: boolean, selectedNode: BasicTreeNodeData) => void;
+    onSelect?: (selectedKey: string, selected: boolean, selectedNode: BasicTreeNodeData) => void;
     preventScroll?: boolean;
     renderDraggingNode?: (nodeInstance: HTMLElement, node: BasicTreeNodeData) => HTMLElement;
     renderFullLabel?: (renderFullLabelProps: BasicRenderFullLabelProps) => any;

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

@@ -64,7 +64,7 @@ export interface BasicTreeSelectProps extends Pick<BasicTreeProps, 'virtualize'
     restTagsPopoverProps?: any;
     clickTriggerToHide?: boolean;
     loadData?: (data: BasicTreeNodeData) => Promise<void>;
-    onSelect?: (selectedKeys: string, selected: boolean, selectedNode: BasicTreeNodeData) => void;
+    onSelect?: (selectedKey: string, selected: boolean, selectedNode: BasicTreeNodeData) => void;
     searchRender?: (inputProps: any) => any;
     renderSelectedItem?: BasicRenderSelectedItem;
     getPopupContainer?: () => HTMLElement;
@@ -89,7 +89,7 @@ export interface TreeSelectAdapter<P = Record<string, any>, S = Record<string, a
     unregisterClickOutsideHandler: () => void;
     rePositionDropdown: () => void;
     updateState: (states: Partial<BasicTreeSelectInnerData>) => void;
-    notifySelect: (selectedKeys: string, selected: boolean, selectedNode: BasicTreeNodeData) => void;
+    notifySelect: (selectedKey: string, selected: boolean, selectedNode: BasicTreeNodeData) => void;
     notifySearch: (input: string, filteredExpandedKeys: string[]) => void;
     cacheFlattenNodes: (bool: boolean) => void;
     openMenu: () => void;

package/package.json

@@ -1,13 +1,13 @@
 {
     "name": "@douyinfe/semi-foundation",
-    "version": "2.43.0-beta.0",
+    "version": "2.43.1",
     "description": "",
     "scripts": {
         "build:lib": "node ./scripts/compileLib.js",
         "prepublishOnly": "npm run build:lib"
     },
     "dependencies": {
-        "@douyinfe/semi-animation": "2.43.0-beta.0",
+        "@douyinfe/semi-animation": "2.43.1",
         "async-validator": "^3.5.0",
         "classnames": "^2.2.6",
         "date-fns": "^2.29.3",
@@ -23,7 +23,7 @@
         "*.scss",
         "*.css"
     ],
-    "gitHead": "48acb39a658ce8078194ef761a655f7c2215e2b2",
+    "gitHead": "84abaef26e42768a44ba5db31b9891bf508a314e",
     "devDependencies": {
         "@babel/plugin-transform-runtime": "^7.15.8",
         "@babel/preset-env": "^7.15.8",

package/popover/constants.ts

@@ -23,7 +23,7 @@ const strings = {
         'leftTopOver',
         'rightTopOver',
     ],
-    TRIGGER_SET: ['hover', 'focus', 'click', 'custom'],
+    TRIGGER_SET: ['hover', 'focus', 'click', 'custom', 'contextMenu'],
     DEFAULT_ARROW_STYLE: {
         borderOpacity: '1',
         backgroundColor: 'var(--semi-color-bg-3)',

package/tagInput/foundation.ts

@@ -66,36 +66,45 @@ class TagInputFoundation extends BaseFoundation<TagInputAdapter> {
     };
 
     handleInputCompositionStart = (e: any) => {
+        const { maxLength } = this.getProps();
+        if (!isNumber(maxLength)) {
+            return;
+        }
         this._adapter.setEntering(true);
     }
 
     handleInputCompositionEnd = (e: any) => {
-        this._adapter.setEntering(false);
         const { value } = e.target;
         const {
             maxLength, 
             onInputExceed,
             separator
         } = this.getProps();
+        if (!isNumber(maxLength)) {
+            return;
+        }
+        this._adapter.setEntering(false);
         let allowChange = true;
-        const { inputValue } = this.getStates();
-        if (isNumber(maxLength)) {
-            const inputArr = getSplitedArray(inputValue, separator);
-            let index = 0;
-            for (; index < inputArr.length; index++) {
-                if (inputArr[index].length > maxLength) {
-                    allowChange = false;
-                    isFunction(onInputExceed) && onInputExceed(value);
-                    break;
-                }
+        const inputArr = getSplitedArray(value, separator);
+        let index = 0;
+        for (; index < inputArr.length; index++) {
+            if (inputArr[index].length > maxLength) {
+                allowChange = false;
+                isFunction(onInputExceed) && onInputExceed(value);
+                break;
             }
-            if (!allowChange) {
-                const newInputArr = inputArr.slice(0, index);
-                if (index < inputArr.length) {
-                    newInputArr.push(inputArr[index].slice(0, maxLength));
-                }
-                this._adapter.setInputValue(newInputArr.join(separator));
+        }
+        if (!allowChange) {
+            const newInputArr = inputArr.slice(0, index);
+            if (index < inputArr.length) {
+                newInputArr.push(inputArr[index].slice(0, maxLength));
             }
+            this._adapter.setInputValue(newInputArr.join(separator));
+        } else {
+            // Why does it need to be updated here instead of in onChange when the value meets the maxLength limit?
+            // Because in firefox, the state change in InputCompositionEnd causes onChange to not be triggered after 
+            // the composition input completes input.
+            this._adapter.setInputValue(value);
         }
     }
 

package/tree/foundation.ts

@@ -222,7 +222,7 @@ export interface BasicTreeProps {
     onLoad?: (loadedKeys?: Set<string>, treeNode?: BasicTreeNodeData) => void;
     onContextMenu?: (e: any, node: BasicTreeNodeData) => void;
     onSearch?: (sunInput: string, filteredExpandedKeys: string[]) => void;
-    onSelect?: (selectedKeys: string, selected: boolean, selectedNode: BasicTreeNodeData) => void;
+    onSelect?: (selectedKey: string, selected: boolean, selectedNode: BasicTreeNodeData) => void;
     preventScroll?: boolean;
     renderDraggingNode?: (nodeInstance: HTMLElement, node: BasicTreeNodeData) => HTMLElement;
     renderFullLabel?: (renderFullLabelProps: BasicRenderFullLabelProps) => any;

package/treeSelect/foundation.ts

@@ -133,7 +133,7 @@ export interface BasicTreeSelectProps extends Pick<BasicTreeProps,
     restTagsPopoverProps?: any;
     clickTriggerToHide?: boolean;
     loadData?: (data: BasicTreeNodeData) => Promise<void>;
-    onSelect?: (selectedKeys: string, selected: boolean, selectedNode: BasicTreeNodeData) => void;
+    onSelect?: (selectedKey: string, selected: boolean, selectedNode: BasicTreeNodeData) => void;
     searchRender?: (inputProps: any) => any;
     renderSelectedItem?: BasicRenderSelectedItem;
     getPopupContainer?: () => HTMLElement;
@@ -181,7 +181,7 @@ export interface TreeSelectAdapter<P = Record<string, any>, S = Record<string, a
     unregisterClickOutsideHandler: () => void;
     rePositionDropdown: () => void;
     updateState: (states: Partial<BasicTreeSelectInnerData>) => void;
-    notifySelect: (selectedKeys: string, selected: boolean, selectedNode: BasicTreeNodeData) => void;
+    notifySelect: (selectedKey: string, selected: boolean, selectedNode: BasicTreeNodeData) => void;
     notifySearch: (input: string, filteredExpandedKeys: string[]) => void;
     cacheFlattenNodes: (bool: boolean) => void;
     openMenu: () => void;