@pisell/materials 6.7.4 → 6.8.2

package/es/components/PisellCards/components/PisellImageCard/PisellImageCard.js

@@ -0,0 +1,182 @@
+var _excluded = ["dataSource", "fillMode", "lazy", "active", "disabled", "loading", "children", "onClick", "aliWidth"];
+function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
+function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
+import React, { useMemo, useCallback } from 'react';
+import { useImageLoad, usePisellImageCardStyle } from "./hooks";
+import { getImageObjectFit, getTruncatedText } from "./utils";
+import "./PisellImageCard.less";
+import { image as imageAli } from '@pisell/utils';
+
+/**
+ * PisellImageCard 图片卡片组件
+ * 用于展示图片，支持占位图、失败兜底、文字降级、懒加载等功能
+ *
+ * @component
+ * @example
+ * ```tsx
+ * // 基础用法
+ * <PisellImageCard
+ *   dataSource={{
+ *     src: 'https://example.com/image.png',
+ *     alt: '商品图片'
+ *   }}
+ * />
+ *
+ * // 带占位图和失败兜底
+ * <PisellImageCard
+ *   dataSource={{
+ *     src: 'https://example.com/image.png',
+ *     alt: '商品图片',
+ *     fallbackSrc: 'https://example.com/placeholder.png',
+ *     errorSrc: 'https://example.com/error.png'
+ *   }}
+ * />
+ *
+ * // 自定义尺寸和填充模式
+ * <PisellImageCard
+ *   dataSource={{ src: 'https://example.com/image.png' }}
+ *   width={200}
+ *   height={200}
+ *   fillMode="contain"
+ * />
+ *
+ * // 启用懒加载
+ * <PisellImageCard
+ *   dataSource={{ src: 'https://example.com/image.png' }}
+ *   lazy
+ * />
+ *
+ * // 激活状态
+ * <PisellImageCard
+ *   dataSource={{ src: 'https://example.com/image.png' }}
+ *   active={{ value: true }}
+ * />
+ * ```
+ */
+var PisellImageCard = function PisellImageCard(props) {
+  var _props$dataSource = props.dataSource,
+    dataSource = _props$dataSource === void 0 ? {} : _props$dataSource,
+    _props$fillMode = props.fillMode,
+    fillMode = _props$fillMode === void 0 ? 'cover' : _props$fillMode,
+    _props$lazy = props.lazy,
+    lazy = _props$lazy === void 0 ? false : _props$lazy,
+    active = props.active,
+    disabled = props.disabled,
+    loadingState = props.loading,
+    children = props.children,
+    onClick = props.onClick,
+    aliWidth = props.aliWidth,
+    restProps = _objectWithoutProperties(props, _excluded);
+  var src = dataSource.src,
+    alt = dataSource.alt,
+    errorSrc = dataSource.errorSrc,
+    fallbackSrc = dataSource.fallbackSrc,
+    text = dataSource.text;
+
+  // 使用图片加载 Hook
+  var _useImageLoad = useImageLoad(src, lazy),
+    imageLoading = _useImageLoad.loading,
+    imageError = _useImageLoad.error,
+    imgRef = _useImageLoad.imgRef;
+
+  // 使用样式合并 Hook
+  var _usePisellImageCardSt = usePisellImageCardStyle(props),
+    mergedStyle = _usePisellImageCardSt.mergedStyle,
+    mergedClassName = _usePisellImageCardSt.mergedClassName;
+
+  /**
+   * 获取当前应该显示的图片地址
+   * 优先级：loading(fallbackSrc) > error(errorSrc) > src
+   */
+  var displaySource = useMemo(function () {
+    if (imageLoading && fallbackSrc) {
+      return fallbackSrc;
+    }
+    if (imageError && errorSrc) {
+      return errorSrc;
+    }
+    if (src) {
+      return src;
+    }
+    return null;
+  }, [imageLoading, imageError, src, errorSrc, fallbackSrc]);
+
+  /**
+   * 是否显示文字降级
+   * 当没有任何图片可显示时，显示 alt 的前 2 个字符
+   */
+  var showTextFallback = useMemo(function () {
+    return alt;
+  }, [displaySource, alt]);
+  /**
+   * 截取后的文字
+   */
+  var truncatedText = useMemo(function () {
+    if (text) {
+      return text;
+    }
+    return getTruncatedText(alt, 2);
+  }, [alt, text]);
+
+  /**
+   * 处理点击事件
+   */
+  var handleClick = useCallback(function (e) {
+    // 如果禁用或加载中，不触发点击事件
+    if (disabled !== null && disabled !== void 0 && disabled.value || loadingState !== null && loadingState !== void 0 && loadingState.value) {
+      return;
+    }
+    onClick === null || onClick === void 0 || onClick(e);
+  }, [disabled, loadingState, onClick]);
+
+  /**
+   * 渲染状态的 extra 内容
+   * 优先级：loading > disabled > active
+   */
+  var renderExtra = useCallback(function () {
+    if (loadingState !== null && loadingState !== void 0 && loadingState.value && loadingState !== null && loadingState !== void 0 && loadingState.extra) {
+      return /*#__PURE__*/React.createElement("div", {
+        className: "pisell-image-card__extra"
+      }, loadingState.extra);
+    }
+    if (disabled !== null && disabled !== void 0 && disabled.value && disabled !== null && disabled !== void 0 && disabled.extra) {
+      return /*#__PURE__*/React.createElement("div", {
+        className: "pisell-image-card__extra"
+      }, disabled.extra);
+    }
+    if (active !== null && active !== void 0 && active.value && active !== null && active !== void 0 && active.extra) {
+      return /*#__PURE__*/React.createElement("div", {
+        className: "pisell-image-card__extra"
+      }, active.extra);
+    }
+    return null;
+  }, [active, disabled, loadingState]);
+  return /*#__PURE__*/React.createElement("div", _extends({
+    ref: imgRef,
+    className: mergedClassName,
+    style: mergedStyle,
+    onClick: handleClick,
+    "data-active": active === null || active === void 0 ? void 0 : active.value,
+    "data-disabled": disabled === null || disabled === void 0 ? void 0 : disabled.value,
+    "data-loading": (loadingState === null || loadingState === void 0 ? void 0 : loadingState.value) || imageLoading
+  }, restProps), displaySource && /*#__PURE__*/React.createElement("img", {
+    src: imageAli.ali(displaySource, aliWidth),
+    alt: alt || '',
+    className: "pisell-image-card__image",
+    style: {
+      objectFit: getImageObjectFit(fillMode)
+    }
+  }), showTextFallback && /*#__PURE__*/React.createElement("div", {
+    className: "pisell-image-card__text-fallback"
+  }, truncatedText), renderExtra(), children);
+};
+
+/**
+ * Provider 包装器
+ * 兼容 PisellCards 系统的 props 传递方式
+ */
+var Provider = function Provider(props) {
+  return /*#__PURE__*/React.createElement(PisellImageCard, _extends({}, props === null || props === void 0 ? void 0 : props.props, props));
+};
+export default Provider;

package/es/components/PisellCards/components/PisellImageCard/PisellImageCard.less

@@ -0,0 +1,94 @@
+@prefix: pisell-image-card;
+
+// 默认尺寸
+@default-width: 100%;
+@default-height: 100%;
+
+// 状态颜色
+@active-border-color: #1890ff;
+@disabled-opacity: 0.6;
+
+// 文字降级样式
+@text-fallback-bg: #f0f0f0;
+@text-fallback-color: #999;
+@text-fallback-font-size: 24px;
+
+.@{prefix} {
+  position: relative;
+  display: inline-block;
+  overflow: hidden;
+  box-sizing: border-box;
+
+  // 图片元素
+  &__image {
+    width: 100%;
+    height: 100%;
+    display: block;
+  }
+
+  // 文字降级展示
+  &__text-fallback {
+    width: 100%;
+    height: 100%;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    background-color: @text-fallback-bg;
+    color: @text-fallback-color;
+    font-size: @text-fallback-font-size;
+    font-weight: 500;
+    user-select: none;
+    white-space: nowrap;
+    overflow: hidden;
+    text-overflow: ellipsis;
+  }
+
+  // 填充模式：cover
+  &--cover &__image {
+    object-fit: cover;
+  }
+
+  // 填充模式：contain
+  &--contain &__image {
+    object-fit: contain;
+  }
+
+  // 填充模式：fill
+  &--fill &__image {
+    object-fit: fill;
+  }
+
+  // 填充模式：none
+  &--none &__image {
+    object-fit: none;
+  }
+
+  // 激活状态
+  &--active {
+    border: 2px solid @active-border-color;
+  }
+
+  // 禁用状态
+  &--disabled {
+    opacity: @disabled-opacity;
+    cursor: not-allowed;
+    pointer-events: none;
+  }
+
+  // 加载状态
+  &--loading {
+    cursor: wait;
+  }
+
+  // 状态 extra 内容
+  &__extra {
+    position: absolute;
+    top: 0;
+    left: 0;
+    width: 100%;
+    height: 100%;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+  }
+}

package/es/components/PisellCards/components/PisellImageCard/components/index.js

@@ -0,0 +1 @@
+// 子组件

package/es/components/PisellCards/components/PisellImageCard/hooks/index.d.ts

@@ -0,0 +1,5 @@
+/**
+ * PisellImageCard Hooks 导出
+ */
+export { useImageLoad } from './useImageLoad';
+export { usePisellImageCardStyle } from './usePisellImageCardStyle';

package/es/components/PisellCards/components/PisellImageCard/hooks/index.js

@@ -0,0 +1,6 @@
+/**
+ * PisellImageCard Hooks 导出
+ */
+
+export { useImageLoad } from "./useImageLoad";
+export { usePisellImageCardStyle } from "./usePisellImageCardStyle";

package/es/components/PisellCards/components/PisellImageCard/hooks/useImageLoad.d.ts

@@ -0,0 +1,12 @@
+/// <reference types="react" />
+/**
+ * 图片加载状态管理 Hook
+ * @param src - 图片地址
+ * @param lazy - 是否启用懒加载
+ * @returns 加载状态对象
+ */
+export declare const useImageLoad: (src?: string, lazy?: boolean) => {
+    loading: boolean;
+    error: boolean;
+    imgRef: import("react").RefObject<HTMLImageElement>;
+};

package/es/components/PisellCards/components/PisellImageCard/hooks/useImageLoad.js

@@ -0,0 +1,86 @@
+function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
+function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
+function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
+function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }
+function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t.return && (u = t.return(), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
+function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
+import { useState, useEffect, useRef } from 'react';
+
+/**
+ * 图片加载状态管理 Hook
+ * @param src - 图片地址
+ * @param lazy - 是否启用懒加载
+ * @returns 加载状态对象
+ */
+export var useImageLoad = function useImageLoad(src, lazy) {
+  var _useState = useState(!!src),
+    _useState2 = _slicedToArray(_useState, 2),
+    loading = _useState2[0],
+    setLoading = _useState2[1];
+  var _useState3 = useState(false),
+    _useState4 = _slicedToArray(_useState3, 2),
+    error = _useState4[0],
+    setError = _useState4[1];
+  var imgRef = useRef(null);
+  var observerRef = useRef(null);
+  useEffect(function () {
+    // 如果没有图片地址，直接设置为非加载状态
+    if (!src) {
+      setLoading(false);
+      setError(false);
+      return;
+    }
+
+    // 重置状态
+    setLoading(true);
+    setError(false);
+
+    // 如果启用懒加载且浏览器支持 IntersectionObserver
+    if (lazy && 'IntersectionObserver' in window && imgRef.current) {
+      observerRef.current = new IntersectionObserver(function (entries) {
+        entries.forEach(function (entry) {
+          if (entry.isIntersecting) {
+            var _observerRef$current;
+            loadImage();
+            // 加载后断开观察
+            (_observerRef$current = observerRef.current) === null || _observerRef$current === void 0 || _observerRef$current.disconnect();
+          }
+        });
+      }, {
+        rootMargin: '50px' // 提前 50px 开始加载
+      });
+      observerRef.current.observe(imgRef.current);
+      return function () {
+        var _observerRef$current2;
+        (_observerRef$current2 = observerRef.current) === null || _observerRef$current2 === void 0 || _observerRef$current2.disconnect();
+      };
+    } else {
+      // 不使用懒加载，直接加载
+      loadImage();
+    }
+
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, [src, lazy]);
+
+  /**
+   * 加载图片
+   */
+  var loadImage = function loadImage() {
+    if (!src) return;
+    var img = new Image();
+    img.src = src;
+    img.onload = function () {
+      setLoading(false);
+      setError(false);
+    };
+    img.onerror = function () {
+      setLoading(false);
+      setError(true);
+    };
+  };
+  return {
+    loading: loading,
+    error: error,
+    imgRef: imgRef
+  };
+};

package/es/components/PisellCards/components/PisellImageCard/hooks/usePisellImageCardStyle.d.ts

@@ -0,0 +1,10 @@
+import { PisellImageCardProps } from '../types';
+/**
+ * 样式合并 Hook
+ * @param props - 组件 Props
+ * @returns 合并后的样式和类名
+ */
+export declare const usePisellImageCardStyle: (props: PisellImageCardProps) => {
+    mergedStyle: React.CSSProperties;
+    mergedClassName: string;
+};

package/es/components/PisellCards/components/PisellImageCard/hooks/usePisellImageCardStyle.js

@@ -0,0 +1,61 @@
+function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
+function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : String(i); }
+function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
+import { useMemo } from 'react';
+import classNames from 'classnames';
+/**
+ * 样式合并 Hook
+ * @param props - 组件 Props
+ * @returns 合并后的样式和类名
+ */
+export var usePisellImageCardStyle = function usePisellImageCardStyle(props) {
+  var style = props.style,
+    className = props.className,
+    active = props.active,
+    disabled = props.disabled,
+    loading = props.loading,
+    _props$fillMode = props.fillMode,
+    fillMode = _props$fillMode === void 0 ? 'cover' : _props$fillMode,
+    _props$width = props.width,
+    width = _props$width === void 0 ? '100%' : _props$width,
+    _props$height = props.height,
+    height = _props$height === void 0 ? '100%' : _props$height;
+
+  /**
+   * 合并样式
+   */
+  var mergedStyle = useMemo(function () {
+    var finalStyle = _objectSpread({
+      width: width,
+      height: height
+    }, style);
+
+    // 合并状态样式，优先级：loading > disabled > active
+    if (loading !== null && loading !== void 0 && loading.value && loading !== null && loading !== void 0 && loading.style) {
+      finalStyle = _objectSpread(_objectSpread({}, finalStyle), loading.style);
+    } else if (disabled !== null && disabled !== void 0 && disabled.value && disabled !== null && disabled !== void 0 && disabled.style) {
+      finalStyle = _objectSpread(_objectSpread({}, finalStyle), disabled.style);
+    } else if (active !== null && active !== void 0 && active.value && active !== null && active !== void 0 && active.style) {
+      finalStyle = _objectSpread(_objectSpread({}, finalStyle), active.style);
+    }
+    return finalStyle;
+  }, [style, active, disabled, loading, width, height]);
+
+  /**
+   * 合并类名
+   */
+  var mergedClassName = useMemo(function () {
+    return classNames('pisell-image-card', className, "pisell-image-card--".concat(fillMode), {
+      'pisell-image-card--active': active === null || active === void 0 ? void 0 : active.value,
+      'pisell-image-card--disabled': disabled === null || disabled === void 0 ? void 0 : disabled.value,
+      'pisell-image-card--loading': loading === null || loading === void 0 ? void 0 : loading.value
+    }, (active === null || active === void 0 ? void 0 : active.value) && (active === null || active === void 0 ? void 0 : active.className), (disabled === null || disabled === void 0 ? void 0 : disabled.value) && (disabled === null || disabled === void 0 ? void 0 : disabled.className), (loading === null || loading === void 0 ? void 0 : loading.value) && (loading === null || loading === void 0 ? void 0 : loading.className));
+  }, [className, active, disabled, loading, fillMode]);
+  return {
+    mergedStyle: mergedStyle,
+    mergedClassName: mergedClassName
+  };
+};

package/es/components/PisellCards/components/PisellImageCard/index.d.ts

@@ -0,0 +1,5 @@
+/**
+ * PisellImageCard 组件导出
+ */
+export { default } from './PisellImageCard';
+export type { PisellImageCardProps, ImageDataSource, ImageFillMode, } from './types';

package/es/components/PisellCards/components/PisellImageCard/index.js

@@ -0,0 +1,4 @@
+/**
+ * PisellImageCard 组件导出
+ */
+export { default } from "./PisellImageCard";

package/es/components/PisellCards/components/PisellImageCard/types.d.ts

@@ -0,0 +1,74 @@
+import { CSSProperties } from 'react';
+import { PisellBasicCardProps } from '../../types';
+/**
+ * 图片填充模式类型
+ */
+export declare type ImageFillMode = 'cover' | 'contain' | 'fill' | 'none';
+/**
+ * 图片数据源配置
+ */
+export interface ImageDataSource {
+    /**
+     * 图片地址
+     * 支持相对路径和绝对路径
+     */
+    src?: string;
+    /**
+     * 图片替换文本
+     * 当图片未设置或加载失败时，显示 alt 的前 2 个字符
+     */
+    alt?: string;
+    /**
+     * 图片加载失败后的兜底图地址
+     */
+    errorSrc?: string;
+    /**
+     * 首次加载时的占位图地址
+     */
+    fallbackSrc?: string;
+    text?: string;
+}
+/**
+ * PisellImageCard 组件 Props
+ * 基于 PisellBasicCardProps 扩展
+ * 注意：重写 onClick 为可选属性
+ */
+export interface PisellImageCardProps extends Omit<PisellBasicCardProps, 'onClick'> {
+    /**
+     * 图片数据源配置
+     */
+    dataSource?: ImageDataSource;
+    /**
+     * 图片填充模式
+     * - cover: 覆盖容器，保持比例，可能裁剪
+     * - contain: 完整显示，保持比例，可能留白
+     * - fill: 拉伸填充，不保持比例
+     * - none: 原始尺寸，不缩放
+     * @default 'cover'
+     */
+    fillMode?: ImageFillMode;
+    /**
+     * 图片宽度
+     * 支持任意 CSS 合法值（px、%、rem 等）
+     * @default '100%'
+     */
+    width?: CSSProperties['width'];
+    aliWidth?: number;
+    /**
+     * 图片高度
+     * 支持任意 CSS 合法值（px、%、rem 等）
+     * @default '100%'
+     */
+    height?: CSSProperties['height'];
+    /**
+     * 是否启用图片懒加载
+     * 仅当图片进入视口时才加载
+     * @default false
+     */
+    lazy?: boolean;
+    /**
+     * 点击事件
+     * 注意：PisellBasicCardProps 中的 onClick 是必填的，这里重新定义为可选
+     */
+    onClick?: (e: React.MouseEvent<HTMLDivElement, MouseEvent>) => void;
+}

package/es/components/PisellCards/components/PisellImageCard/types.js

@@ -0,0 +1 @@
+export {};

package/es/components/PisellCards/components/PisellImageCard/utils/getImageObjectFit.d.ts

@@ -0,0 +1,7 @@
+import { ImageFillMode } from '../types';
+/**
+ * 根据填充模式获取对应的 CSS object-fit 值
+ * @param fillMode - 填充模式
+ * @returns CSS object-fit 值
+ */
+export declare const getImageObjectFit: (fillMode?: ImageFillMode) => string;

package/es/components/PisellCards/components/PisellImageCard/utils/getImageObjectFit.js

@@ -0,0 +1,15 @@
+/**
+ * 根据填充模式获取对应的 CSS object-fit 值
+ * @param fillMode - 填充模式
+ * @returns CSS object-fit 值
+ */
+export var getImageObjectFit = function getImageObjectFit() {
+  var fillMode = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : 'cover';
+  var modeMap = {
+    cover: 'cover',
+    contain: 'contain',
+    fill: 'fill',
+    none: 'none'
+  };
+  return modeMap[fillMode] || 'cover';
+};

package/es/components/PisellCards/components/PisellImageCard/utils/getTruncatedText.d.ts

@@ -0,0 +1,7 @@
+/**
+ * 截取文本前 N 个字符
+ * @param text - 原始文本
+ * @param maxLength - 最大长度，默认 2
+ * @returns 截取后的文本
+ */
+export declare const getTruncatedText: (text?: string, maxLength?: number) => string;

package/es/components/PisellCards/components/PisellImageCard/utils/getTruncatedText.js

@@ -0,0 +1,13 @@
+/**
+ * 截取文本前 N 个字符
+ * @param text - 原始文本
+ * @param maxLength - 最大长度，默认 2
+ * @returns 截取后的文本
+ */
+export var getTruncatedText = function getTruncatedText(text) {
+  var maxLength = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 2;
+  if (!text) return '';
+
+  // 使用 substring 截取前 N 个字符
+  return text.substring(0, maxLength);
+};

package/es/components/PisellCards/components/PisellImageCard/utils/index.d.ts

@@ -0,0 +1,5 @@
+/**
+ * PisellImageCard 工具函数导出
+ */
+export { getImageObjectFit } from './getImageObjectFit';
+export { getTruncatedText } from './getTruncatedText';

package/es/components/PisellCards/components/PisellImageCard/utils/index.js

@@ -0,0 +1,6 @@
+/**
+ * PisellImageCard 工具函数导出
+ */
+
+export { getImageObjectFit } from "./getImageObjectFit";
+export { getTruncatedText } from "./getTruncatedText";

package/es/components/PisellCards/components/TabCard/TabCard.d.ts

@@ -0,0 +1,4 @@
+import React from 'react';
+import './TabCard.less';
+declare const Provider: (props: any) => React.JSX.Element;
+export default Provider;