@pisell/materials 6.0.21 → 6.1.1

package/es/components/pisellDraggable/index.js

@@ -26,6 +26,7 @@ import { DndContext, DragOverlay, MeasuringStrategy, PointerSensor, closestCente
 import { SortableContext, arrayMove, verticalListSortingStrategy } from '@dnd-kit/sortable';
 import React, { useEffect, useMemo, useRef, useState } from 'react';
 import { createPortal } from 'react-dom';
+import { useMemoizedFn } from 'ahooks';
 import { CSS } from '@dnd-kit/utilities';
 import { SortableTreeItem } from "./components";
 import { buildTree, flattenTree, getChildCount, getProjection, removeChildrenOf, removeItem, setProperty } from "./utilities";
@@ -119,12 +120,13 @@ export function SortableTree(_ref3) {
     indentationWidth = _ref3$indentationWidt === void 0 ? 50 : _ref3$indentationWidt,
     _ref3$removable = _ref3.removable,
     removable = _ref3$removable === void 0 ? true : _ref3$removable,
-    renderItem = _ref3.renderItem,
+    _renderItem = _ref3.renderItem,
     onChange = _ref3.onChange,
     onRemoveBefore = _ref3.onRemoveBefore,
     __designMode = _ref3.__designMode,
     _ref3$maxLevel = _ref3.maxLevel,
-    maxLevel = _ref3$maxLevel === void 0 ? 3 : _ref3$maxLevel;
+    maxLevel = _ref3$maxLevel === void 0 ? 3 : _ref3$maxLevel,
+    canDrop = _ref3.canDrop;
   // 状态管理
   /** 当前树形数据 */
   var _useState = useState([]),
@@ -171,6 +173,7 @@ export function SortableTree(_ref3) {
     return removeChildrenOf(flattenTreeData, activeId != null ? [activeId].concat(_toConsumableArray(collapsedItems)) : collapsedItems);
   }, [activeId, flattenTreeData]);
   console.log('flattenedItems', flattenedItems);
+
   /**
    * 计算拖拽投影
    * 根据当前拖拽状态计算目标位置和深度
@@ -192,10 +195,12 @@ export function SortableTree(_ref3) {
       return id;
     });
   }, [flattenedItems]);
-  var activeItem = activeId ? flattenedItems.find(function (_ref6) {
-    var id = _ref6.id;
-    return id === activeId;
-  }) : null;
+  var activeItem = useMemo(function () {
+    return activeId ? flattenedItems.find(function (_ref6) {
+      var id = _ref6.id;
+      return id === activeId;
+    }) : null;
+  }, [activeId, flattenedItems]);
   useEffect(function () {
     sensorContext.current = {
       items: flattenedItems,
@@ -238,74 +243,67 @@ export function SortableTree(_ref3) {
       return childNewDepth >= maxLevel || checkSubtreeDepth(items, child.id, childNewDepth);
     });
   }
-  return /*#__PURE__*/React.createElement(DndContext, {
-    sensors: sensors,
-    collisionDetection: closestCenter,
-    measuring: measuring,
-    onDragStart: handleDragStart,
-    onDragMove: handleDragMove,
-    onDragOver: handleDragOver,
-    onDragEnd: handleDragEnd,
-    onDragCancel: handleDragCancel
-  }, /*#__PURE__*/React.createElement(SortableContext, {
-    items: sortedIds,
-    strategy: verticalListSortingStrategy
-  }, flattenedItems.map(function (item) {
-    var id = item.id,
-      children = item.children,
-      collapsed = item.collapsed,
-      depth = item.depth;
-    return /*#__PURE__*/React.createElement(SortableTreeItem, {
-      key: id,
-      id: id,
-      item: item,
-      depth: id === activeId && projected ? projected.depth : depth,
-      indentationWidth: indentationWidth,
-      indicator: indicator,
-      collapsed: Boolean(collapsed && (children === null || children === void 0 ? void 0 : children.length)),
-      onCollapse: collapsible && children !== null && children !== void 0 && children.length ? function () {
-        return handleCollapse(id);
-      } : undefined,
-      onRemove: removable ? function () {
-        return handleRemove(item);
-      } : undefined,
-      renderItem: renderItem,
-      __designMode: __designMode
-    });
-  }), /*#__PURE__*/createPortal( /*#__PURE__*/React.createElement(DragOverlay, {
-    dropAnimation: dropAnimationConfig,
-    modifiers: indicator ? [adjustTranslate] : undefined
-  }, activeId && activeItem ? /*#__PURE__*/React.createElement(SortableTreeItem, {
-    id: activeId,
-    depth: activeItem.depth,
-    clone: true,
-    childCount: getChildCount(items, activeId) + 1,
-    item: activeItem,
-    indentationWidth: indentationWidth,
-    renderItem: renderItem
-  }) : null), document.body)));
 
   /**
-   * 处理拖拽开始事件
-   * 设置当前拖拽项和初始状态
+   * 处理节点删除
+   * 从树形结构中移除指定节点
    */
-  function handleDragStart(_ref7) {
-    var activeId = _ref7.active.id;
+  var handleRemove = useMemoizedFn( /*#__PURE__*/function () {
+    var _ref7 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee(item) {
+      var res;
+      return _regeneratorRuntime().wrap(function _callee$(_context) {
+        while (1) switch (_context.prev = _context.next) {
+          case 0:
+            if (!onRemoveBefore) {
+              _context.next = 6;
+              break;
+            }
+            _context.next = 3;
+            return onRemoveBefore === null || onRemoveBefore === void 0 ? void 0 : onRemoveBefore(item);
+          case 3:
+            res = _context.sent;
+            if (res) {
+              _context.next = 6;
+              break;
+            }
+            return _context.abrupt("return");
+          case 6:
+            setItems(function (items) {
+              return removeItem(items, item.id);
+            });
+            onChange === null || onChange === void 0 || onChange(items);
+          case 8:
+          case "end":
+            return _context.stop();
+        }
+      }, _callee);
+    }));
+    return function (_x) {
+      return _ref7.apply(this, arguments);
+    };
+  }());
+
+  /**
+  * 处理拖拽开始事件
+  * 设置当前拖拽项和初始状态
+  */
+  var handleDragStart = useMemoizedFn(function (_ref8) {
+    var activeId = _ref8.active.id;
     setActiveId(activeId);
     setOverId(activeId);
     document.body.style.setProperty('cursor', 'grabbing');
-  }
+  });
 
   /**
    * 处理拖拽移动事件
    * 更新水平偏移量
    */
-  function handleDragMove(_ref8) {
-    var delta = _ref8.delta;
+  var handleDragMove = useMemoizedFn(function (_ref9) {
+    var delta = _ref9.delta;
     setOffsetLeft(delta.x);
-  }
-  function handleDragOver(_ref9) {
-    var over = _ref9.over;
+  });
+  var handleDragOver = useMemoizedFn(function (_ref10) {
+    var over = _ref10.over;
     if (!projected || !over) {
       var _over$id;
       setOverId((_over$id = over === null || over === void 0 ? void 0 : over.id) !== null && _over$id !== void 0 ? _over$id : null);
@@ -331,7 +329,12 @@ export function SortableTree(_ref3) {
       return;
     }
     setOverId(over.id);
-  }
+  });
+  var parentNode = useMemo(function () {
+    return projected !== null && projected !== void 0 && projected.parentId ? flattenedItems.find(function (item) {
+      return item.id === projected.parentId;
+    }) : null;
+  }, [flattenedItems, projected === null || projected === void 0 ? void 0 : projected.parentId]);
 
   /**
    * 处理拖拽结束事件
@@ -339,22 +342,38 @@ export function SortableTree(_ref3) {
    * 2. 更新节点位置和层级
    * 3. 重建树形结构
    */
-  function handleDragEnd(_ref10) {
-    var active = _ref10.active,
-      over = _ref10.over;
+  var handleDragEnd = useMemoizedFn(function (_ref11) {
+    var active = _ref11.active,
+      over = _ref11.over;
     resetState();
     if (projected && over) {
       var depth = projected.depth,
-        parentId = projected.parentId;
+        _parentId = projected.parentId;
 
       // 检查目标父节点是否禁止拖入
-      var targetParent = parentId ? flattenedItems.find(function (item) {
-        return item.id === parentId;
+      var targetParent = _parentId ? flattenedItems.find(function (item) {
+        return item.id === _parentId;
       }) : null;
       if (targetParent !== null && targetParent !== void 0 && targetParent.disabledDrop) {
         return;
       }
 
+      // 获取拖拽元素和目标元素
+      var _dragItem = flattenedItems.find(function (item) {
+        return item.id === active.id;
+      });
+      var _dropTarget = flattenedItems.find(function (item) {
+        return item.id === over.id;
+      });
+
+      // 调用自定义拖拽判断函数
+      if (canDrop && _dragItem && _dropTarget) {
+        var canDropResult = canDrop(_dragItem, _dropTarget, _parentId, targetParent);
+        if (!canDropResult) {
+          return;
+        }
+      }
+
       // 检查是否超过最大层级限制
       if (depth >= maxLevel) {
         return;
@@ -366,84 +385,103 @@ export function SortableTree(_ref3) {
         return;
       }
       var clonedItems = JSON.parse(JSON.stringify(flattenTree(items)));
-      var overIndex = clonedItems.findIndex(function (_ref11) {
-        var id = _ref11.id;
+      var overIndex = clonedItems.findIndex(function (_ref12) {
+        var id = _ref12.id;
         return id === over.id;
       });
-      var activeIndex = clonedItems.findIndex(function (_ref12) {
-        var id = _ref12.id;
+      var activeIndex = clonedItems.findIndex(function (_ref13) {
+        var id = _ref13.id;
         return id === active.id;
       });
       var activeTreeItem = clonedItems[activeIndex];
       clonedItems[activeIndex] = _objectSpread(_objectSpread({}, activeTreeItem), {}, {
         depth: depth,
-        parentId: parentId
+        parentId: _parentId
       });
       var sortedItems = arrayMove(clonedItems, activeIndex, overIndex);
       var newItems = buildTree(sortedItems);
       setItems(newItems);
       onChange === null || onChange === void 0 || onChange(newItems);
     }
-  }
-  function handleDragCancel() {
-    resetState();
-  }
-  function resetState() {
-    setOverId(null);
-    setActiveId(null);
-    setOffsetLeft(0);
-    document.body.style.setProperty('cursor', '');
-  }
+  });
 
-  /**
-   * 处理节点删除
-   * 从树形结构中移除指定节点
-   */
-  function handleRemove(_x) {
-    return _handleRemove.apply(this, arguments);
-  }
   /**
    * 处理节点折叠/展开
    * 切换指定节点的折叠状态
    */
-  function _handleRemove() {
-    _handleRemove = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee(item) {
-      var res;
-      return _regeneratorRuntime().wrap(function _callee$(_context) {
-        while (1) switch (_context.prev = _context.next) {
-          case 0:
-            if (!onRemoveBefore) {
-              _context.next = 6;
-              break;
-            }
-            _context.next = 3;
-            return onRemoveBefore === null || onRemoveBefore === void 0 ? void 0 : onRemoveBefore(item);
-          case 3:
-            res = _context.sent;
-            if (res) {
-              _context.next = 6;
-              break;
-            }
-            return _context.abrupt("return");
-          case 6:
-            setItems(function (items) {
-              return removeItem(items, item.id);
-            });
-            onChange === null || onChange === void 0 || onChange(items);
-          case 8:
-          case "end":
-            return _context.stop();
-        }
-      }, _callee);
-    }));
-    return _handleRemove.apply(this, arguments);
-  }
-  function handleCollapse(id) {
+  var handleCollapse = useMemoizedFn(function (id) {
     setItems(function (items) {
-      return setProperty(items, id, 'collapsed', function (value) {
+      var newVal = setProperty(items, id, 'collapsed', function (value) {
         return !value;
       });
+      onChange === null || onChange === void 0 || onChange(items);
+      return newVal;
+    });
+  });
+  var isError = useMemo(function () {
+    return !(canDrop !== null && canDrop !== void 0 && canDrop(activeItem || {}, {}, projected === null || projected === void 0 ? void 0 : projected.parentId, parentNode));
+  }, [projected, activeItem, canDrop, parentNode]);
+  var renderTreeItems = useMemo(function () {
+    return flattenedItems.map(function (item) {
+      var id = item.id,
+        children = item.children,
+        collapsed = item.collapsed,
+        depth = item.depth;
+      return /*#__PURE__*/React.createElement(SortableTreeItem, {
+        key: id,
+        id: id,
+        item: item,
+        depth: id === activeId && projected ? projected.depth : depth,
+        indentationWidth: indentationWidth,
+        indicator: indicator,
+        collapsed: Boolean(collapsed && (children === null || children === void 0 ? void 0 : children.length)),
+        onCollapse: collapsible && children !== null && children !== void 0 && children.length ? function () {
+          return handleCollapse(id);
+        } : undefined,
+        onRemove: removable ? function () {
+          return handleRemove(item);
+        } : undefined,
+        renderItem: _renderItem,
+        __designMode: __designMode
+      });
     });
+  }, [flattenedItems, activeId, projected === null || projected === void 0 ? void 0 : projected.depth, indentationWidth, indicator, collapsible, handleCollapse, handleRemove, _renderItem, __designMode]);
+  return /*#__PURE__*/React.createElement(DndContext, {
+    sensors: sensors,
+    collisionDetection: closestCenter,
+    measuring: measuring,
+    onDragStart: handleDragStart,
+    onDragMove: handleDragMove,
+    onDragOver: handleDragOver,
+    onDragEnd: handleDragEnd,
+    onDragCancel: handleDragCancel
+  }, /*#__PURE__*/React.createElement(SortableContext, {
+    items: sortedIds,
+    strategy: verticalListSortingStrategy
+  }, renderTreeItems, /*#__PURE__*/createPortal( /*#__PURE__*/React.createElement(DragOverlay, {
+    dropAnimation: dropAnimationConfig,
+    modifiers: indicator ? [adjustTranslate] : undefined
+  }, activeId && activeItem ? /*#__PURE__*/React.createElement(SortableTreeItem, {
+    id: activeId,
+    depth: activeItem.depth,
+    clone: true,
+    childCount: getChildCount(items, activeId) + 1,
+    item: activeItem,
+    indentationWidth: indentationWidth,
+    renderItem: function renderItem(props, ref) {
+      return _renderItem === null || _renderItem === void 0 ? void 0 : _renderItem(_objectSpread(_objectSpread({}, props), {}, {
+        isError: isError
+      }), ref);
+    }
+  }) : null), document.body)));
+  function handleDragCancel() {
+    resetState();
+  }
+  function resetState() {
+    setOverId(null);
+    setActiveId(null);
+    setOffsetLeft(0);
+    document.body.style.setProperty('cursor', '');
   }
 }
 
@@ -451,8 +489,8 @@ export function SortableTree(_ref3) {
  * 调整拖拽项的位置
  * 对拖拽时的位置进行微调，提升视觉效果
  */
-var adjustTranslate = function adjustTranslate(_ref13) {
-  var transform = _ref13.transform;
+var adjustTranslate = function adjustTranslate(_ref14) {
+  var transform = _ref14.transform;
   return _objectSpread(_objectSpread({}, transform), {}, {
     y: transform.y - 25
   });

package/es/components/pisellDropSort/PisellDropSort.js

@@ -17,6 +17,8 @@ var PisellDropSort = function PisellDropSort(_ref) {
     allowAddChild = _ref$allowAddChild === void 0 ? true : _ref$allowAddChild,
     _ref$allowAddRoot = _ref.allowAddRoot,
     allowAddRoot = _ref$allowAddRoot === void 0 ? true : _ref$allowAddRoot,
+    _ref$allowIsShow = _ref.allowIsShow,
+    allowIsShow = _ref$allowIsShow === void 0 ? false : _ref$allowIsShow,
     _ref$disabled = _ref.disabled,
     disabled = _ref$disabled === void 0 ? false : _ref$disabled,
     _ref$spacing = _ref.spacing,
@@ -37,7 +39,9 @@ var PisellDropSort = function PisellDropSort(_ref) {
     __designMode = _ref.__designMode,
     isCustomAction = _ref.isCustomAction,
     emptyContent = _ref.emptyContent,
-    getItemStyle = _ref.getItemStyle;
+    getItemStyle = _ref.getItemStyle,
+    canDrop = _ref.canDrop,
+    indentationWidth = _ref.indentationWidth;
   // 自定义渲染节点
   var renderItem = useCallback(function (itemProps, ref) {
     return /*#__PURE__*/React.createElement(SortableItem, {
@@ -47,6 +51,7 @@ var PisellDropSort = function PisellDropSort(_ref) {
       allowAddChild: allowAddChild,
       allowDelete: allowDelete,
       allowDrag: allowDrag,
+      allowIsShow: allowIsShow,
       disabled: disabled,
       onAdd: onAdd,
       onDelete: onDelete,
@@ -85,10 +90,12 @@ var PisellDropSort = function PisellDropSort(_ref) {
     value: value,
     collapsible: true,
     indicator: false,
-    indentationWidth: 24,
+    indentationWidth: indentationWidth,
     removable: allowDelete,
     renderItem: renderItem,
-    onChange: handleChange
+    onChange: handleChange,
+    canDrop: canDrop,
+    maxLevel: maxLevel
   })));
 };
 export default PisellDropSort;

package/es/components/pisellDropSort/components/SortableItem/index.d.ts

@@ -7,6 +7,7 @@ interface SortableItemProps {
     domRef: React.RefObject<HTMLDivElement>;
     allowAddChild?: boolean;
     allowDelete?: boolean;
+    allowIsShow?: boolean;
     allowDrag?: boolean;
     disabled?: boolean;
     onAdd?: (itemProps: TreeItem) => void;

package/es/components/pisellDropSort/components/SortableItem/index.js

@@ -1,5 +1,5 @@
 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); }
-var _excluded = ["item", "depth", "clone", "ghost", "indicator", "disableSelection", "disableInteraction", "wrapperRef", "style", "onCollapse", "onRemove", "childCount", "indentationWidth", "handleProps", "collapsed"];
+var _excluded = ["item", "depth", "clone", "ghost", "indicator", "disableSelection", "disableInteraction", "wrapperRef", "style", "onCollapse", "onRemove", "childCount", "indentationWidth", "handleProps", "collapsed", "isError"];
 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 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; }
@@ -21,6 +21,7 @@ var SortableItem = function SortableItem(props) {
     allowAddChild = props.allowAddChild,
     allowDelete = props.allowDelete,
     allowDrag = props.allowDrag,
+    allowIsShow = props.allowIsShow,
     disabled = props.disabled,
     onAdd = props.onAdd,
     onDelete = props.onDelete,
@@ -45,9 +46,13 @@ var SortableItem = function SortableItem(props) {
     indentationWidth = itemProps.indentationWidth,
     handleProps = itemProps.handleProps,
     collapsed = itemProps.collapsed,
+    isError = itemProps.isError,
     otherProps = _objectWithoutProperties(itemProps, _excluded);
   var itemStyle = (getItemStyle === null || getItemStyle === void 0 ? void 0 : getItemStyle(itemProps)) || {};
   var mergedStyle = _objectSpread(_objectSpread({}, itemStyle), style);
+  if (isError) {
+    mergedStyle.backgroundColor = '#FECDCA';
+  }
   return /*#__PURE__*/React.createElement("li", _extends({
     className: classNames('pisell-lowcode-drop-sort-item', clone && 'clone', ghost && 'ghost', indicator && 'indicator', disableSelection && 'disableSelection', disableInteraction && 'disableInteraction'),
     ref: wrapperRef,

package/es/components/pisellDropSort/components/SortableItem/index.less

@@ -81,7 +81,6 @@
 
   .pisell-lowcode-drop-sort-item-content {
     flex: 1;
-    height: 48px;
   }
 
   .pisell-lowcode-drop-sort-item-button {

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

@@ -15,6 +15,8 @@ export interface PisellDropSortProps {
     allowAddChild?: boolean;
     /** 允许添加根节点 */
     allowAddRoot?: boolean;
+    /** 是否允许显示隐藏 */
+    allowIsShow?: boolean;
     /** 是否禁用 */
     disabled?: boolean;
     /** 节点间距 */
@@ -49,4 +51,8 @@ export interface PisellDropSortProps {
     isCustomAction?: boolean;
     /** 获取item样式 */
     getItemStyle?: (itemProps: TreeItem) => React.CSSProperties;
+    /** 自定义拖拽判断函数，返回false时阻止拖拽 */
+    canDrop?: (dragItem: DropSortItem, dropTarget: DropSortItem, parentId: string | number | null) => boolean;
+    /** 节点缩进宽度 */
+    indentationWidth?: number;
 }

package/es/components/pisellDropdown/index.js

@@ -0,0 +1,51 @@
+import React from 'react';
+import { Menu } from 'antd';
+import Dropdown from "../dropdown";
+import classNames from 'classnames';
+import "./index.less";
+var PisellDropdown = function PisellDropdown(_ref) {
+  var trigger = _ref.trigger,
+    _ref$items = _ref.items,
+    items = _ref$items === void 0 ? [] : _ref$items,
+    _ref$showShortcut = _ref.showShortcut,
+    showShortcut = _ref$showShortcut === void 0 ? true : _ref$showShortcut,
+    _ref$triggerType = _ref.triggerType,
+    triggerType = _ref$triggerType === void 0 ? ['click'] : _ref$triggerType,
+    className = _ref.className,
+    style = _ref.style,
+    onSelect = _ref.onSelect;
+  var renderMenuItem = function renderMenuItem(item) {
+    var menuItem = /*#__PURE__*/React.createElement("div", {
+      className: "pisell-dropdown-item"
+    }, /*#__PURE__*/React.createElement("div", {
+      className: "pisell-dropdown-item-content"
+    }, item.icon && /*#__PURE__*/React.createElement("span", {
+      className: "pisell-dropdown-item-icon"
+    }, item.icon), /*#__PURE__*/React.createElement("span", {
+      className: "pisell-dropdown-item-label"
+    }, item.label)), showShortcut && item.shortcut && /*#__PURE__*/React.createElement("span", {
+      className: "pisell-dropdown-item-shortcut"
+    }, item.shortcut));
+    return item.divider ? /*#__PURE__*/React.createElement(React.Fragment, {
+      key: item.key
+    }, /*#__PURE__*/React.createElement(Menu.Item, {
+      key: item.key
+    }, menuItem), /*#__PURE__*/React.createElement(Menu.Divider, null)) : /*#__PURE__*/React.createElement(Menu.Item, {
+      key: item.key
+    }, menuItem);
+  };
+  var menu = /*#__PURE__*/React.createElement(Menu, {
+    onClick: function onClick(_ref2) {
+      var key = _ref2.key;
+      return onSelect === null || onSelect === void 0 ? void 0 : onSelect(key);
+    },
+    className: "pisell-dropdown-menu"
+  }, items.map(renderMenuItem));
+  return /*#__PURE__*/React.createElement(Dropdown, {
+    overlay: menu,
+    trigger: triggerType,
+    className: classNames('pisell-dropdown', className),
+    style: style
+  }, trigger || /*#__PURE__*/React.createElement("span", null, "Account"));
+};
+export default PisellDropdown;

package/es/components/pisellDropdown/index.less

@@ -0,0 +1,44 @@
+.pisell-dropdown {
+  &-menu {
+    min-width: 200px;
+  }
+
+  &-item {
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+    padding: 8px 12px;
+
+    &-content {
+      display: flex;
+      align-items: center;
+      gap: 8px;
+    }
+
+    &-icon {
+      display: flex;
+      align-items: center;
+      font-size: 16px;
+      color: #666;
+    }
+
+    &-label {
+      color: #333;
+    }
+
+    &-shortcut {
+      color: #999;
+      font-size: 12px;
+    }
+  }
+}
+
+// .ant-dropdown-menu-item {
+//   padding: 0 !important;
+
+//   &:hover {
+//     .pisell-dropdown-item {
+//       background-color: #f5f5f5;
+//     }
+//   }
+// }

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

@@ -0,0 +1,49 @@
+import React from 'react';
+import './index.less';
+interface ApplicableProductDetails {
+    amount: string;
+    type: string;
+    resource_id: number;
+    title: string;
+    original_amount: string;
+}
+interface Discount {
+    id: number;
+    product_name: string;
+    encoded: string;
+    code: string;
+    tag: string;
+    expire_time?: string;
+    product_id: number;
+    relation_type: string;
+    par_value: string;
+    used_par_value: string;
+    limit_status: string;
+    limited_relation_product_data: any;
+    balance: string;
+    format_title: any;
+    product: any;
+    savedAmount: number;
+    isDisabled: boolean;
+    isSelected?: boolean;
+    isAvailable?: boolean;
+    isUsed?: boolean;
+    applicableProductIds?: number[];
+    applicableProductDetails: ApplicableProductDetails[];
+    appliedProductDetails: any[];
+}
+export interface PisellGoodPassCardProps {
+    /**数据源 */
+    dataSource: Array<Discount>;
+    /**事件 */
+    onChange?: (current: {
+        id: string | number;
+        isSelected: boolean;
+    }) => void;
+    /**样式 */
+    style: React.CSSProperties;
+    /**快捷展示排序 */
+    mixedSort?: (val: Discount[]) => Discount[];
+}
+declare const index: (props: PisellGoodPassCardProps) => JSX.Element;
+export default index;