@pisell/materials 2.2.47 → 2.2.49

package/lib/components/pisellAnchor/index.js

@@ -39,12 +39,38 @@ var import_ChevronLeft = __toESM(require("@pisell/icon/es/ChevronLeft"));
 var import_ChevronRight = __toESM(require("@pisell/icon/es/ChevronRight"));
 var import_index = require("./index.less");
 var PisellAnchor = (0, import_react.forwardRef)((props, ref) => {
-  const { options = [], tab, className, style, onChange } = props;
+  const {
+    options = [],
+    tab,
+    className,
+    style,
+    onChange,
+    onTabClick,
+    containerRef,
+    platform = "pc"
+  } = props;
   const contentRef = (0, import_react.useRef)(null);
-  const [isShowButton, setIsShowButton] = (0, import_react.useState)(true);
+  const scrollTimeoutRef = (0, import_react.useRef)(null);
+  const isClickScrolling = (0, import_react.useRef)(false);
+  const clickedTabRef = (0, import_react.useRef)(null);
   const [leftWidth, setLeftWidth] = (0, import_react.useState)(0);
   const [rightWidth, setRightWidth] = (0, import_react.useState)(40);
-  const { run: onScroll } = (0, import_ahooks.useDebounceFn)(
+  const [showButtons, setShowButtons] = (0, import_react.useState)(false);
+  const [hoveredTab, setHoveredTab] = (0, import_react.useState)(null);
+  (0, import_react.useEffect)(() => {
+    if (contentRef.current) {
+      const { scrollWidth, clientWidth } = contentRef.current;
+      setShowButtons(scrollWidth > clientWidth);
+    }
+  }, [options]);
+  (0, import_react.useEffect)(() => {
+    return () => {
+      if (scrollTimeoutRef.current) {
+        clearTimeout(scrollTimeoutRef.current);
+      }
+    };
+  }, []);
+  const { run: onScrollDebounced } = (0, import_ahooks.useDebounceFn)(
     (e) => {
       const { scrollLeft, scrollWidth, clientWidth } = e.target;
       setLeftWidth(scrollLeft > 0 ? 40 : 0);
@@ -52,69 +78,179 @@ var PisellAnchor = (0, import_react.forwardRef)((props, ref) => {
     },
     { wait: 200 }
   );
-  const setTabScroll = (offsetLeft) => {
-    if (contentRef.current) {
-      contentRef.current.scrollTo({
-        left: offsetLeft,
-        behavior: "smooth"
-      });
-    }
-  };
-  (0, import_react.useImperativeHandle)(ref, () => ({
-    scroll: (tab2) => {
-      if (tab2) {
-        const dom = document.querySelector(`#tab-${tab2}`);
-        if (dom) {
-          setTabScroll(dom.offsetLeft);
+  const { run: handleScrollThrottled } = (0, import_ahooks.useThrottleFn)(
+    () => {
+      if (isClickScrolling.current)
+        return;
+      if (!(containerRef == null ? void 0 : containerRef.current))
+        return;
+      const container = containerRef.current;
+      const headerHeight = 65;
+      const containerRect = container.getBoundingClientRect();
+      const scrollTop = container.scrollTop;
+      const containerHeight = containerRect.height;
+      const scrollHeight = container.scrollHeight;
+      const isAtBottom = scrollTop + containerHeight >= scrollHeight - 50;
+      if (isAtBottom) {
+        const lastOption = options[options.length - 1];
+        if (tab !== lastOption.id && lastOption.id !== clickedTabRef.current) {
+          onChange == null ? void 0 : onChange(lastOption.id);
+        }
+        return;
+      }
+      let closestOption = null;
+      let minDistance = Infinity;
+      for (const option of options) {
+        const elementById = document.getElementById(option.id);
+        const elementByDataAttr = document.querySelector(`[data-section="${option.id}"]`);
+        const element = elementById || elementByDataAttr;
+        if (element) {
+          const htmlElement = element;
+          const elementOffsetTop = htmlElement.offsetTop;
+          const elementHeight = htmlElement.offsetHeight;
+          const elementTopRelativeToViewport = elementOffsetTop - scrollTop;
+          const isTopVisible = elementTopRelativeToViewport >= headerHeight && elementTopRelativeToViewport <= containerHeight;
+          const isBottomVisible = elementTopRelativeToViewport + elementHeight >= headerHeight && elementTopRelativeToViewport + elementHeight <= containerHeight;
+          const isElementPartiallyVisible = isTopVisible || isBottomVisible || elementTopRelativeToViewport < headerHeight && elementTopRelativeToViewport + elementHeight > containerHeight;
+          const distance = Math.abs(elementTopRelativeToViewport - headerHeight);
+          if (distance < minDistance) {
+            minDistance = distance;
+            closestOption = option;
+          }
         }
       }
+      if (closestOption && tab !== closestOption.id && closestOption.id !== clickedTabRef.current && minDistance < 50) {
+        onChange == null ? void 0 : onChange(closestOption.id);
+      }
+    },
+    { wait: 150 }
+  );
+  (0, import_react.useEffect)(() => {
+    if (!(containerRef == null ? void 0 : containerRef.current))
+      return;
+    const handleScroll = () => {
+      if (!isClickScrolling.current) {
+        handleScrollThrottled();
+      }
+    };
+    const container = containerRef.current;
+    container.addEventListener("scroll", handleScroll);
+    return () => {
+      container.removeEventListener("scroll", handleScroll);
+    };
+  }, [handleScrollThrottled]);
+  const handleOptionClick = (item) => {
+    console.log("PisellAnchor: Tab clicked", item.id);
+    if (scrollTimeoutRef.current) {
+      clearTimeout(scrollTimeoutRef.current);
+    }
+    onChange == null ? void 0 : onChange(item.id);
+    onTabClick == null ? void 0 : onTabClick();
+    const elementById = document.getElementById(String(item.id));
+    const elementByDataAttr = document.querySelector(`[data-section="${String(item.id)}"]`);
+    const element = elementById || elementByDataAttr;
+    console.log("PisellAnchor: Target element found?", !!element);
+    console.log("PisellAnchor: Container ref exists?", !!(containerRef == null ? void 0 : containerRef.current));
+    if (element && (containerRef == null ? void 0 : containerRef.current)) {
+      isClickScrolling.current = true;
+      clickedTabRef.current = item.id;
+      requestAnimationFrame(() => {
+        if (!(containerRef == null ? void 0 : containerRef.current))
+          return;
+        const htmlElement = element;
+        const headerHeight = 65;
+        const elementOffsetTop = htmlElement.offsetTop;
+        console.log("PisellAnchor: Scrolling using offsetTop", {
+          elementOffsetTop,
+          targetScrollTop: elementOffsetTop - headerHeight
+        });
+        containerRef.current.scrollTo({
+          top: elementOffsetTop - headerHeight,
+          behavior: "smooth"
+        });
+        setTimeout(() => {
+          if (!(containerRef == null ? void 0 : containerRef.current))
+            return;
+          containerRef.current.scrollTo({
+            top: elementOffsetTop - headerHeight,
+            behavior: "auto"
+            // 使用即时滚动确保位置准确
+          });
+        }, 300);
+      });
+      scrollTimeoutRef.current = setTimeout(() => {
+        isClickScrolling.current = false;
+        clickedTabRef.current = null;
+      }, 1e3);
+    } else {
+      console.warn("PisellAnchor: Cannot scroll, element or container not found", {
+        elementId: item.id,
+        elementByIdExists: !!elementById,
+        elementByDataAttrExists: !!elementByDataAttr,
+        containerExists: !!(containerRef == null ? void 0 : containerRef.current)
+      });
     }
-  }));
+  };
   const onPageChange = (type) => {
     if (contentRef.current) {
       const { scrollLeft, clientWidth } = contentRef.current;
+      const newScrollLeft = scrollLeft + (type === "left" ? -clientWidth : clientWidth);
       contentRef.current.scrollTo({
-        left: scrollLeft + (type === "left" ? -clientWidth : clientWidth),
+        left: newScrollLeft,
         behavior: "smooth"
       });
     }
   };
-  return /* @__PURE__ */ import_react.default.createElement("div", { className: (0, import_classnames.default)("pisell-tabs", className), style }, /* @__PURE__ */ import_react.default.createElement(
+  return /* @__PURE__ */ import_react.default.createElement("div", { className: (0, import_classnames.default)("pisell-anchor-tabs", className), style }, showButtons && /* @__PURE__ */ import_react.default.createElement(
     "div",
     {
-      className: "pisell-tabs-btn-left",
+      className: "pisell-anchor-tabs-btn-left",
       style: { width: leftWidth },
       onClick: () => onPageChange("left")
     },
-    /* @__PURE__ */ import_react.default.createElement(import_ChevronLeft.default, { className: "pisell-tabs-btn-icon" })
+    /* @__PURE__ */ import_react.default.createElement(import_ChevronLeft.default, { className: "pisell-anchor-tabs-btn-icon" })
   ), /* @__PURE__ */ import_react.default.createElement(
     "div",
     {
       ref: contentRef,
-      className: "pisell-tabs-content",
+      className: "pisell-anchor-tabs-content",
       id: `tab-${tab}-content`,
-      onScroll
+      onScroll: onScrollDebounced
     },
     options.map((item) => /* @__PURE__ */ import_react.default.createElement(
       "div",
       {
         key: item.id,
         id: `tab-${item.id}`,
-        className: (0, import_classnames.default)("pisell-tabs-tab", {
-          "pisell-tabs-tab-active": tab === item.id
+        className: (0, import_classnames.default)("pisell-anchor-tabs-tab", {
+          "pisell-anchor-tabs-tab-active": tab === item.id
         }),
-        onClick: () => onChange == null ? void 0 : onChange(item.id)
+        onClick: () => {
+          console.log("PisellAnchor: Tab div clicked", item.id);
+          handleOptionClick(item);
+        }
       },
-      /* @__PURE__ */ import_react.default.createElement("div", { className: "pisell-tabs-tab-content" }, item.name)
+      /* @__PURE__ */ import_react.default.createElement(
+        "span",
+        {
+          className: "pisell-anchor-tabs-tab-content",
+          onClick: (e) => {
+            e.stopPropagation();
+            console.log("PisellAnchor: Tab span clicked", item.id);
+            handleOptionClick(item);
+          }
+        },
+        item.name
+      )
     ))
-  ), /* @__PURE__ */ import_react.default.createElement(
+  ), showButtons && /* @__PURE__ */ import_react.default.createElement(
     "div",
     {
-      className: "pisell-tabs-btn-right",
+      className: "pisell-anchor-tabs-btn-right",
       style: { width: rightWidth },
       onClick: () => onPageChange("right")
     },
-    /* @__PURE__ */ import_react.default.createElement(import_ChevronRight.default, { className: "pisell-tabs-btn-icon" })
+    /* @__PURE__ */ import_react.default.createElement(import_ChevronRight.default, { className: "pisell-anchor-tabs-btn-icon" })
   ));
 });
 var pisellAnchor_default = PisellAnchor;

package/lib/components/pisellAnchor/index.less

@@ -92,7 +92,7 @@
   }
 }
 
-.pisell-tabs {
+.pisell-anchor-tabs {
   display: flex;
   align-items: center;
   width: 100%;
@@ -103,8 +103,8 @@
   cursor: default;
   position: relative;
 
-  .pisell-tabs-btn-left,
-  .pisell-tabs-btn-right {
+  .pisell-anchor-tabs-btn-left,
+  .pisell-anchor-tabs-btn-right {
     position: absolute;
     top: 50%;
     transform: translateY(-50%);
@@ -119,7 +119,7 @@
     transition: width 300ms ease;
     user-select: none;
 
-    .pisell-tabs-btn-icon {
+    .pisell-anchor-tabs-btn-icon {
       width: 24px;
       height: 24px;
       background: #f1f1f1;
@@ -132,17 +132,17 @@
     }
   }
 
-  .pisell-tabs-btn-left {
+  .pisell-anchor-tabs-btn-left {
     left: 0;
     background: linear-gradient(270deg, rgba(255, 255, 255, 0.8) 0%, #fff 70%);
   }
 
-  .pisell-tabs-btn-right {
+  .pisell-anchor-tabs-btn-right {
     right: 0;
     background: linear-gradient(90deg, rgba(255, 255, 255, 0.8) 0%, #fff 70%);
   }
 
-  .pisell-tabs-content {
+  .pisell-anchor-tabs-content {
     flex: 1;
     display: flex;
     overflow-x: auto;
@@ -152,26 +152,46 @@
     scrollbar-width: none;
     -ms-overflow-style: none;
     padding: 0;
+    gap: 16px;
 
     &::-webkit-scrollbar {
       display: none;
     }
 
-    .pisell-tabs-tab {
+    .pisell-anchor-tabs-tab {
       flex: 0 0 auto;
-      padding: 8px 16px;
+      padding: 0 16px;
       cursor: pointer;
       white-space: nowrap;
       transition: all 0.3s;
+      height: 48px;
+      display: flex;
+      align-items: center;
+      justify-content: center;
+      font-size: 16px;
+      border-radius: 100px;
 
-      &:hover {
-        color: #1677ff;
+      &:hover:not(.pisell-anchor-tabs-tab-active) {
+        color: var(--theme-color, #7f56d9);
       }
 
-      &.pisell-tabs-tab-active {
-        color: #1677ff;
+      &.pisell-anchor-tabs-tab-active {
+        color: #fff;
         font-weight: 600;
+        background-color: var(--theme-color, #7f56d9);
+      }
+
+      .pisell-anchor-tabs-tab-content {
+        line-height: 24px;
       }
     }
   }
 }
+
+.pisell-anchor {
+  border-bottom: 1px solid #EAECF0;
+
+  &.pisell-anchor-no-border {
+    border-bottom: none;
+  }
+}

package/lib/components/pisellAppCard/PisellAppCard.d.ts

@@ -0,0 +1,5 @@
+import React from 'react';
+import { PisellAppCardProps } from './types';
+import './PisellAppCard.less';
+declare const PisellAppCard: React.FC<PisellAppCardProps>;
+export default PisellAppCard;

package/lib/components/pisellAppCard/PisellAppCard.js

@@ -0,0 +1,107 @@
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/components/pisellAppCard/PisellAppCard.tsx
+var PisellAppCard_exports = {};
+__export(PisellAppCard_exports, {
+  default: () => PisellAppCard_default
+});
+module.exports = __toCommonJS(PisellAppCard_exports);
+var import_react = __toESM(require("react"));
+var import_antd = require("antd");
+var import_classnames = __toESM(require("classnames"));
+var import_pisellTags = __toESM(require("../pisellTags"));
+var import_pisellCard = __toESM(require("../pisellCard"));
+var import_pisellAvatar = __toESM(require("../pisellAvatar"));
+var import_PisellAppCard = require("./PisellAppCard.less");
+var import_icon = __toESM(require("../icon"));
+var PisellAppCard = ({
+  className,
+  style,
+  avatar,
+  tags,
+  title,
+  description,
+  bottomButtons,
+  moreActions,
+  icon
+}) => {
+  return /* @__PURE__ */ import_react.default.createElement(
+    import_pisellCard.default,
+    {
+      className: (0, import_classnames.default)("pisell-lowcode-app-card", className),
+      style
+    },
+    /* @__PURE__ */ import_react.default.createElement("div", { className: "pisell-lowcode-app-card-header" }, /* @__PURE__ */ import_react.default.createElement("div", { className: "pisell-lowcode-app-card-header-left" }, (avatar || icon) && /* @__PURE__ */ import_react.default.createElement(
+      import_pisellAvatar.default,
+      {
+        icon: icon && /* @__PURE__ */ import_react.default.createElement(import_icon.default, { type: icon }),
+        src: avatar || void 0,
+        alt: title,
+        size: "xl",
+        shape: "square",
+        style: { border: "none" },
+        borderRadius: 10
+      }
+    )), /* @__PURE__ */ import_react.default.createElement("div", null, moreActions && moreActions.length > 0 && /* @__PURE__ */ import_react.default.createElement(
+      import_antd.Dropdown,
+      {
+        menu: {
+          items: moreActions.map((action, index) => ({
+            key: index,
+            label: action.label,
+            onClick: action.onClick
+          }))
+        },
+        placement: "bottomRight",
+        trigger: ["click"]
+      },
+      /* @__PURE__ */ import_react.default.createElement(
+        import_antd.Button,
+        {
+          icon: /* @__PURE__ */ import_react.default.createElement(import_icon.default, { type: "pisell2-dots-vertical" }),
+          size: "large"
+        }
+      )
+    ))),
+    /* @__PURE__ */ import_react.default.createElement("div", { className: "pisell-lowcode-app-card-content" }, tags && tags.length > 0 && /* @__PURE__ */ import_react.default.createElement("div", { className: "pisell-lowcode-app-card-content-tags" }, tags.map((tag, index) => /* @__PURE__ */ import_react.default.createElement(import_pisellTags.default, { key: index, type: tag.type, color: tag.color }, tag.label))), /* @__PURE__ */ import_react.default.createElement("div", null, /* @__PURE__ */ import_react.default.createElement("div", { className: "pisell-lowcode-app-card-content-title" }, title), description && /* @__PURE__ */ import_react.default.createElement("div", { className: "pisell-lowcode-app-card-content-description" }, description))),
+    bottomButtons && bottomButtons.length > 0 && /* @__PURE__ */ import_react.default.createElement("div", { className: "pisell-lowcode-app-card-footer" }, bottomButtons.map(
+      (button, index) => !button.hidden && /* @__PURE__ */ import_react.default.createElement(
+        import_antd.Button,
+        {
+          type: button.type,
+          onClick: button.onClick,
+          key: index,
+          size: "large"
+        },
+        button.label
+      )
+    ))
+  );
+};
+var PisellAppCard_default = PisellAppCard;

package/lib/components/pisellAppCard/PisellAppCard.less

@@ -0,0 +1,55 @@
+.pisell-lowcode-app-card {
+  background: #fff;
+  border: 1px solid #f0f0f0;
+  cursor: auto;
+
+  .pisell-lowcode-card-body {
+    display: flex;
+    flex-direction: column;
+    gap: 16px;
+    &::before {
+        display: none;
+    }
+    &::after {
+        display: none;
+    }
+  }
+
+  .pisell-lowcode-app-card-header {
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+    .pisell-lowcode-app-card-header-left {
+      .anticon {
+        font-size: 32px !important;
+      }
+    }
+  }
+
+  .pisell-lowcode-app-card-content {
+    display: flex;
+    flex-direction: column;
+    gap: 8px;
+    .pisell-lowcode-app-card-content-title {
+      color: var(--Gray-900, #101828);
+      font-size: 18px;
+      font-weight: 600;
+      line-height: 28px; /* 155.556% */
+    }
+    .pisell-lowcode-app-card-content-description {
+        color: var(--Gray-600, #475467);
+        font-size: 14px;
+        font-weight: 400;
+        line-height: 20px; /* 142.857% */
+    }
+    .pisell-lowcode-app-card-content-tags {
+        display: flex;
+        gap: 8px;
+    }
+  }
+
+  .pisell-lowcode-app-card-footer {
+    display: flex;
+    gap: 12px;
+  }
+}

package/lib/components/pisellAppCard/index.d.ts

@@ -0,0 +1,3 @@
+import PisellAppCard from './PisellAppCard';
+export default PisellAppCard;
+export type { PisellAppCardProps } from './types';

package/lib/components/pisellAppCard/index.js

@@ -0,0 +1,36 @@
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/components/pisellAppCard/index.tsx
+var pisellAppCard_exports = {};
+__export(pisellAppCard_exports, {
+  default: () => pisellAppCard_default
+});
+module.exports = __toCommonJS(pisellAppCard_exports);
+var import_PisellAppCard = __toESM(require("./PisellAppCard"));
+var pisellAppCard_default = import_PisellAppCard.default;

package/lib/components/pisellAppCard/types.d.ts

@@ -0,0 +1,34 @@
+import { CSSProperties } from 'react';
+export interface PisellAppCardProps {
+    /** 类名 */
+    className?: string;
+    /** 样式 */
+    style?: CSSProperties;
+    /** 头像地址 */
+    avatar?: string;
+    /** icon */
+    icon?: string;
+    /** 标签列表 */
+    tags?: Array<{
+        label: string;
+        color?: 'success' | 'warning' | 'error' | 'gray';
+        type: 'pill_color' | 'pill_outline';
+    }>;
+    /** 标题 */
+    title: string;
+    /** 描述 */
+    description?: string;
+    /** 底部按钮列表 */
+    bottomButtons?: Array<{
+        label: string;
+        onClick?: () => void;
+        type?: 'primary' | 'default' | 'dashed' | 'link' | 'text';
+        hidden: boolean;
+    }>;
+    /** 右侧更多操作列表 */
+    moreActions?: Array<{
+        label: string;
+        onClick?: () => void;
+        icon?: React.ReactNode;
+    }>;
+}

package/lib/components/pisellAppCard/types.js

@@ -0,0 +1,17 @@
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/components/pisellAppCard/types.ts
+var types_exports = {};
+module.exports = __toCommonJS(types_exports);

package/lib/components/pisellAvatar/index.js

@@ -80,7 +80,7 @@ var PisellAvatar = ({
     ...style,
     width: sizeMap[size],
     height: sizeMap[size],
-    fontSize: fontSizeMap[size],
+    fontSize: children || icon ? fontSizeMap[size] : void 0,
     lineHeight: `${sizeMap[size]}px`,
     borderRadius: shape === "square" ? `${borderRadius}px` : "50%"
   };
@@ -88,7 +88,7 @@ var PisellAvatar = ({
     if (useTextAvatar && children) {
       return children;
     }
-    return /* @__PURE__ */ import_react.default.createElement(import_iconfont.default, { type: "pisell2-user-01", className: "pisell-avatar-icon" });
+    return /* @__PURE__ */ import_react.default.createElement(import_iconfont.default, { type: "pisell2-user-01" });
   }, [useTextAvatar, children]);
   return /* @__PURE__ */ import_react.default.createElement(
     import_antd.Avatar,

package/lib/components/pisellAvatar/index.less

@@ -5,7 +5,8 @@
   align-items: center;
   justify-content: center;
   background: var(--Gray-100, #f2f4f7); // 默认背景色
-  border: none; // 移除默认边框
+  border: 1px solid #D0D5DD; // 移除默认边框
+  box-sizing: border-box;
 
   img {
     object-fit: cover;
@@ -13,7 +14,6 @@
 
   .anticon {
     font-size: inherit !important;
-    color: var(--Gray-600, #475467) !important;
   }
 
   // 文本头像样式

package/lib/components/pisellCard/index.d.ts

@@ -1,4 +1,4 @@
-import React from 'react';
+/// <reference types="react" />
 import { CardProps } from 'antd';
 import './index.less';
 export interface PisellCardProps extends CardProps {
@@ -16,5 +16,5 @@ export interface PisellCardProps extends CardProps {
  * @param props
  * @constructor
  */
-declare const PisellCard: (props: PisellCardProps) => React.JSX.Element;
+declare const PisellCard: (props: PisellCardProps) => JSX.Element;
 export default PisellCard;

package/lib/components/pisellCardList/index.d.ts

@@ -39,5 +39,5 @@ export interface PisellCardListProps extends Omit<PisellCheckboxGroupProps, 'opt
     /** 是否余额货币单位 */
     showBalanceSymbol?: boolean;
 }
-declare const _default: React.MemoExoticComponent<(props: PisellCardListProps) => React.JSX.Element>;
+declare const _default: React.MemoExoticComponent<(props: PisellCardListProps) => JSX.Element>;
 export default _default;