@whitesev/pops 2.5.2 → 2.5.4

package/src/components/searchSuggestion/types/index.ts

@@ -1,4 +1,5 @@
 import type { PopsCommonConfig } from "../../../types/components";
+import type { PopsPanelCommonDetails } from "../../panel/types/components-common";
 
 export type PopsSearchSuggestionData<T = any> = {
   /**
@@ -126,10 +127,10 @@ export interface PopsSearchSuggestionDetails<T = any>
    */
   data: PopsSearchSuggestionData<T>[] | (() => PopsSearchSuggestionData<T>[]);
   /**
-   * 自定义的className
+   * （可选）元素的className，值为空的话就不设置
    * @default ""
    */
-  className?: string;
+  className?: PopsPanelCommonDetails<any>["className"];
   /**
    * 建议框的position位置
    *

package/src/components/tooltip/index.ts

@@ -82,9 +82,7 @@ export class ToolTip {
     const $toolTipArrow = $toolTipContainer.querySelector<HTMLElement>(".pops-tip-arrow")!;
 
     // 处理className
-    if (typeof this.$data.config.className === "string" && this.$data.config.className.trim() !== "") {
-      popsDOMUtils.addClassName($toolTipContainer, this.$data.config.className);
-    }
+    popsDOMUtils.addClassName($toolTipContainer, this.$data.config.className);
     // 添加z-index
     $toolTipContainer.style.zIndex = PopsHandler.handleZIndex(this.$data.config.zIndex).toString();
     if (this.$data.config.style != null) {

package/src/components/tooltip/types/index.ts

@@ -1,4 +1,5 @@
 import type { PopsCommonConfig } from "../../../types/components";
+import type { PopsPanelCommonDetails } from "../../panel/types/components-common";
 
 /** tooltip的出现位置 */
 export type PopsTooltipPosition = "top" | "right" | "bottom" | "left" | "follow";
@@ -35,7 +36,7 @@ export interface PopsToolTipDetails
    * + `github-tooltip` github的样式
    * @default ""
    */
-  className?: string;
+  className?: PopsPanelCommonDetails<any>["className"];
   /**
    * 是否使用fixed定位，false则是absolute定位
    *

package/src/utils/PopsDOMUtils.ts

@@ -1575,18 +1575,31 @@ class PopsDOMUtils extends PopsDOMUtilsEvent {
    * @param $el 目标元素
    * @param className className属性
    */
-  addClassName($el: Element | undefined | null, className: string) {
-    if ($el == null) {
-      return;
+  addClassName(
+    $el: Element | undefined | null | undefined,
+    className: string | string[] | (() => string | string[]) | undefined | null
+  ) {
+    if ($el == null) return;
+    if (className == null) return;
+
+    if (typeof className === "function") {
+      className = className();
     }
-    if (typeof className !== "string") {
-      return;
+    if (!Array.isArray(className)) {
+      className = [className];
     }
-    if (className.trim() === "") {
-      return;
-    }
-    const classNameList = className.split(" ").filter((item) => item.trim() !== "");
-    $el.classList.add(...classNameList);
+    className.forEach((classNameStrItem) => {
+      if (typeof classNameStrItem !== "string") {
+        // 不是字符串
+        return;
+      }
+      if (classNameStrItem.trim() === "") {
+        // 空字符串
+        return;
+      }
+      const classNameList = classNameStrItem.split(" ").filter((item) => item.trim() !== "");
+      $el?.classList?.add?.(...classNameList);
+    });
   }
   /**
    * 删除className