@pisell/materials 1.0.997 → 1.0.999

package/es/components/PisellCards/components/TextCard/components/BadgeWrapper.d.ts

@@ -3,6 +3,7 @@ import { BadgeWrapperProps } from '../types';
 /**
  * BadgeWrapper 角标包装组件
  * 负责角标的渲染和定位，支持红点、数字、文本三种类型
+ * 位置通过 offset 控制，大小通过 size 控制
  *
  * @example
  * ```tsx

package/es/components/PisellCards/components/TextCard/components/BadgeWrapper.js

@@ -1,8 +1,13 @@
+var _excluded = ["type", "content", "offset", "size", "color", "style", "showZero"];
+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 from 'react';
 import { Badge } from 'antd';
 /**
  * BadgeWrapper 角标包装组件
  * 负责角标的渲染和定位，支持红点、数字、文本三种类型
+ * 位置通过 offset 控制，大小通过 size 控制
  *
  * @example
  * ```tsx
@@ -33,11 +38,13 @@ var BadgeWrapper = function BadgeWrapper(props) {
   var _badge$type = badge.type,
     type = _badge$type === void 0 ? 'dot' : _badge$type,
     content = badge.content,
-    _badge$position = badge.position,
-    position = _badge$position === void 0 ? 'top-right' : _badge$position,
     offset = badge.offset,
+    size = badge.size,
     color = badge.color,
-    style = badge.style;
+    style = badge.style,
+    _badge$showZero = badge.showZero,
+    showZero = _badge$showZero === void 0 ? false : _badge$showZero,
+    rest = _objectWithoutProperties(badge, _excluded);
 
   /**
    * 根据角标类型渲染不同的 Badge
@@ -45,23 +52,25 @@ var BadgeWrapper = function BadgeWrapper(props) {
   var renderBadge = function renderBadge() {
     // 红点类型
     if (type === 'dot') {
-      return /*#__PURE__*/React.createElement(Badge, {
+      return /*#__PURE__*/React.createElement(Badge, _extends({
         dot: true,
         color: color,
         offset: offset,
+        size: size,
         style: style
-      }, children);
+      }, rest), children);
     }
 
     // 数字或文本类型
     if (type === 'number' || type === 'text') {
-      return /*#__PURE__*/React.createElement(Badge, {
+      return /*#__PURE__*/React.createElement(Badge, _extends({
         count: content,
         color: color,
         offset: offset,
+        size: size,
         style: style,
-        showZero: type === 'number'
-      }, children);
+        showZero: showZero
+      }, rest), children);
     }
     return /*#__PURE__*/React.createElement(React.Fragment, null, children);
   };

package/es/components/PisellCards/components/TextCard/components/TextContent.js

@@ -77,7 +77,7 @@ var TextContent = function TextContent(props) {
       style.whiteSpace = 'normal';
     }
     return style;
-  }, [active, fontSize, fontWeight, color, ellipsis, maxLines]);
+  }, [active, fontSize, fontWeight, color, ellipsis, maxLines, textAlign, flex]);
   if (active !== null && active !== void 0 && active.value) {
     console.log('textStyle11', textStyle);
   }

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

@@ -43,9 +43,9 @@ export interface TagConfig {
  */
 export declare type BadgeType = 'dot' | 'number' | 'text';
 /**
- * 角标位置
+ * 角标大小
  */
-export declare type BadgePosition = 'top-right' | 'top-left' | 'bottom-right' | 'bottom-left';
+export declare type BadgeSize = 'small' | 'default';
 /**
  * 角标配置
  */
@@ -60,11 +60,6 @@ export interface BadgeConfig {
      * 当 type 为 'number' 或 'text' 时有效
      */
     content?: ReactNode;
-    /**
-     * 角标位置
-     * @default 'top-right'
-     */
-    position?: BadgePosition;
     /**
      * 角标偏移量 [x, y]
      * 正数向右/下偏移，负数向左/上偏移
@@ -78,6 +73,18 @@ export interface BadgeConfig {
      * 角标自定义样式
      */
     style?: CSSProperties;
+    /**
+     * 角标大小
+     */
+    size?: BadgeSize;
+    /**
+     * 角标是否显示零值
+     */
+    showZero?: boolean;
+    /**
+     * 角标其他属性
+     */
+    [key: string]: any;
 }
 /**
  * 文本配置

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

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 declare const PisellCards: {
     TabCard: (props: any) => JSX.Element;
     TextCard: (props: any) => JSX.Element;

package/es/components/PisellScrollView/hooks/useScrollEvents.js

@@ -41,10 +41,19 @@ export var useScrollEvents = function useScrollEvents(_ref) {
     // 简单的方向计算需要依赖上一次状态，这里暂简化
     // 实际使用中 scrollState 的更新会有延迟，所以 callback 中的 data 最好实时计算
 
-    var maxScrollTop = scrollHeight - clientHeight;
-    var maxScrollLeft = scrollWidth - clientWidth;
+    var maxScrollTop = Math.max(0, scrollHeight - clientHeight);
+    var maxScrollLeft = Math.max(0, scrollWidth - clientWidth);
     var percentY = maxScrollTop > 0 ? scrollTop / maxScrollTop * 100 : 0;
     var percentX = maxScrollLeft > 0 ? scrollLeft / maxScrollLeft * 100 : 0;
+
+    // 计算边界状态
+    var isScrollToTop = scrollTop <= reachThreshold;
+    var isScrollToBottom = scrollTop + clientHeight >= scrollHeight - reachThreshold;
+    var isScrollToLeft = scrollLeft <= reachThreshold;
+    var isScrollToRight = scrollLeft + clientWidth >= scrollWidth - reachThreshold;
+
+    // 计算是否溢出
+    var isOverflows = scrollHeight > clientHeight || scrollWidth > clientWidth;
     var currentData = {
       scrollTop: scrollTop,
       scrollLeft: scrollLeft,
@@ -54,7 +63,13 @@ export var useScrollEvents = function useScrollEvents(_ref) {
       clientWidth: clientWidth,
       percentY: percentY,
       percentX: percentX,
-      direction: null // 在这里计算方向比较麻烦，可以使用 scrollState 中的（虽然有一点延迟）
+      direction: null,
+      // 在这里计算方向比较麻烦，可以使用 scrollState 中的（虽然有一点延迟）
+      isScrollToTop: isScrollToTop,
+      isScrollToBottom: isScrollToBottom,
+      isScrollToLeft: isScrollToLeft,
+      isScrollToRight: isScrollToRight,
+      isOverflows: isOverflows
     };
 
     // 触发 ScrollStart

package/es/components/PisellScrollView/index.d.ts

@@ -1,2 +1,3 @@
-export { default as PisellScrollView } from './PisellScrollView';
+import PisellScrollView from './PisellScrollView';
 export type { PisellScrollViewProps, PisellScrollViewRef } from './types';
+export default PisellScrollView;

package/es/components/PisellScrollView/index.js

@@ -1 +1,2 @@
-export { default as PisellScrollView } from "./PisellScrollView";
+import PisellScrollView from "./PisellScrollView";
+export default PisellScrollView;

package/es/components/PisellSuperTabs/PisellSuperTabs.d.ts

@@ -1,13 +1,8 @@
-/// <reference types="react" />
+import React from 'react';
 import type { PisellSuperTabsProps } from './types';
 import './PisellSuperTabs.less';
-/**
- * PisellSuperTabs 组件
- * @description 通用导航框架封装的全能型 Tab 组件
- * @template T - 数据源项的类型
- */
-declare const PisellSuperTabs: {
-    <T>(props: PisellSuperTabsProps<T>): JSX.Element;
-    displayName: string;
-};
-export default PisellSuperTabs;
+interface PisellSuperTabsRef {
+    scrollItemByRowKey: (key: string) => void;
+}
+declare const _default: React.ForwardRefExoticComponent<PisellSuperTabsProps<unknown> & React.RefAttributes<PisellSuperTabsRef>>;
+export default _default;

package/es/components/PisellSuperTabs/PisellSuperTabs.js

@@ -1,18 +1,17 @@
 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); }
-import React from 'react';
+import React, { useImperativeHandle, useRef, forwardRef } from 'react';
 import classNames from 'classnames';
 import { useTabsState } from "./hooks";
 import { getRowKey } from "./utils";
 import PisellBasicGrid from "../PisellBasicGrid";
-import { PisellScrollView } from "../PisellScrollView";
+import PisellScrollView from "../PisellScrollView";
 import "./PisellSuperTabs.less";
-
 /**
  * PisellSuperTabs 组件
  * @description 通用导航框架封装的全能型 Tab 组件
  * @template T - 数据源项的类型
  */
-var PisellSuperTabs = function PisellSuperTabs(props) {
+var PisellSuperTabs = function PisellSuperTabs(props, ref) {
   var className = props.className,
     style = props.style,
     _props$dataSource = props.dataSource,
@@ -42,7 +41,9 @@ var PisellSuperTabs = function PisellSuperTabs(props) {
     slotLeftStyle = props.slotLeftStyle,
     slotRightStyle = props.slotRightStyle,
     slotTopStyle = props.slotTopStyle,
-    slotBottomStyle = props.slotBottomStyle;
+    slotBottomStyle = props.slotBottomStyle,
+    __designMode = props.__designMode;
+  var containerRef = useRef(null);
 
   // 状态管理：处理受控/非受控模式
   var _useTabsState = useTabsState({
@@ -52,10 +53,29 @@ var PisellSuperTabs = function PisellSuperTabs(props) {
     }),
     activeKey = _useTabsState.activeKey,
     handleTabChange = _useTabsState.handleTabChange;
+  var scrollItemByRowKey = function scrollItemByRowKey(key) {
+    var item = document.querySelector(".pisell-super-tabs-item-".concat(id, "-").concat(key));
+    console.log(".pisell-super-tabs-item-".concat(id, "-").concat(key));
+    if (item) {
+      item.scrollIntoView({
+        behavior: 'smooth'
+      });
+    }
+  };
+  useImperativeHandle(ref, function () {
+    if (__designMode) {
+      //@ts-ignore
+      return containerRef.current;
+    }
+    return {
+      scrollItemByRowKey: scrollItemByRowKey
+    };
+  });
   return /*#__PURE__*/React.createElement("div", {
     className: classNames('pisell-super-tabs', className),
     style: style,
-    id: id
+    id: id,
+    ref: containerRef
   }, /*#__PURE__*/React.createElement("div", {
     className: classNames('pisell-super-tabs-slot-top-' + id, slotTopClassName),
     style: slotTopStyle
@@ -107,7 +127,7 @@ var PisellSuperTabs = function PisellSuperTabs(props) {
       // 包裹点击事件处理
       return /*#__PURE__*/React.createElement("div", {
         key: key,
-        className: classNames('pisell-super-tabs-item', {
+        className: classNames('pisell-super-tabs-item', "pisell-super-tabs-item-".concat(id, "-").concat(key), {
           'pisell-super-tabs-item--active': active
         }, tabItemClassName),
         style: tabItemStyle
@@ -124,4 +144,4 @@ var PisellSuperTabs = function PisellSuperTabs(props) {
   }, slotBottom));
 };
 PisellSuperTabs.displayName = 'PisellSuperTabs';
-export default PisellSuperTabs;
+export default /*#__PURE__*/forwardRef(PisellSuperTabs);

package/es/components/PisellSuperTabs/types.d.ts

@@ -166,6 +166,7 @@ export interface PisellSuperTabsProps<T = any> {
     slotBottom?: ReactNode;
     slotBottomClassName?: string;
     slotBottomStyle?: CSSProperties;
+    __designMode?: boolean;
 }
 /**
  * 数据项基础类型

package/es/components/PisellTabbar/constants.d.ts

@@ -12,15 +12,15 @@ export declare const getExpandConfig: () => ExpandConfig;
  */
 export declare const DEFAULT_ITEMS: {
     all: {
-        id: number;
+        id: string;
         shop_id: number;
         parent_id: number;
-        name: string;
+        name: any;
         slug: string;
         icon: string;
     };
     search: {
-        id: number;
+        id: string;
         shop_id: number;
         parent_id: number;
         name: string;
@@ -30,7 +30,7 @@ export declare const DEFAULT_ITEMS: {
         customClick: boolean;
     };
     expand: {
-        id: number;
+        id: string;
         shop_id: number;
         parent_id: number;
         key: string;

package/es/components/PisellTabbar/constants.js

@@ -45,15 +45,15 @@ export var getExpandConfig = function getExpandConfig() {
  */
 export var DEFAULT_ITEMS = {
   all: {
-    id: 0,
+    id: '0',
     shop_id: 9,
     parent_id: 0,
-    name: 'All',
-    slug: 'All',
+    name: getText('pisell-tabbar-all'),
+    slug: 'all',
     icon: ''
   },
   search: {
-    id: -1,
+    id: '-1',
     shop_id: 9,
     parent_id: 0,
     name: 'Search',
@@ -63,7 +63,7 @@ export var DEFAULT_ITEMS = {
     customClick: true
   },
   expand: {
-    id: -2,
+    id: '-2',
     shop_id: 9,
     parent_id: 0,
     key: 'expand',

package/es/components/PisellTabbar/index.d.ts

@@ -3,5 +3,7 @@
  * @module PisellTabbar
  */
 import PisellTabbar from './PisellTabbar';
+import PisellTabbarTemplate1 from './template/Template1';
 export type { PisellTabbarProps, TabbarDataSource, LevelType } from './types';
+export { PisellTabbarTemplate1 };
 export default PisellTabbar;

package/es/components/PisellTabbar/index.js

@@ -4,4 +4,6 @@
  */
 
 import PisellTabbar from "./PisellTabbar";
+import PisellTabbarTemplate1 from "./template/Template1";
+export { PisellTabbarTemplate1 };
 export default PisellTabbar;

package/es/components/PisellTabbar/template/Template1/PisellTabbar.d.ts

@@ -0,0 +1,20 @@
+import React from 'react';
+import { PisellTabbarProps } from '../../types';
+import '../../PisellTabbar.less';
+/**
+ * PisellTabbar - 多层级 Tabbar 组件
+ *
+ * 支持最多 3 层级的 Tab 导航，每层级可独立展开/收起
+ *
+ * @component
+ * @example
+ * ```tsx
+ * <PisellTabbar
+ *   dataSource={categoryData}
+ *   value={[1, 10, 100]}
+ *   onChange={(value) => console.log('当前选中:', value)}
+ * />
+ * ```
+ */
+declare const PisellTabbar: React.FC<PisellTabbarProps>;
+export default PisellTabbar;