yootd 0.0.59 → 0.0.61

package/dist/Preview/index.js

@@ -14,11 +14,11 @@ import { Background, ReactFlow } from '@xyflow/react';
 import '@xyflow/react/dist/style.css';
 import React, { useEffect, useState } from 'react';
 import { useBem } from "../hooks/useBem";
+import "./index.scss";
 import Phone from "./components/preview/phone";
 import Web from "./components/preview/web";
 import Controls from "./components/reactflow/Controls";
 import TopPreview from "./components/reactflow/TopPreview";
-import "./index.scss";
 export var Preview = function Preview(_ref) {
   var _ref$controls = _ref.controls,
     controls = _ref$controls === void 0 ? true : _ref$controls,

package/dist/areas/index.js

@@ -7,8 +7,8 @@ function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
 import { useQuery } from '@tanstack/react-query';
 import React, { useEffect, useMemo, useState } from 'react';
 import { Select } from "./..";
-import { useRequest } from "../hooks/useRequest";
 import { useBem } from "../hooks/useBem";
+import { useRequest } from "../hooks/useRequest";
 import "./index.scss";
 export var Areas = function Areas(_ref) {
   var style = _ref.style,

package/dist/areas-treeSelect/index.js

@@ -15,10 +15,10 @@ function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) r
 import { useQuery } from '@tanstack/react-query';
 import { TreeSelect } from 'antd';
 import React, { useMemo, useState } from 'react';
+var SHOW_PARENT = TreeSelect.SHOW_PARENT;
 import { useBem } from "../hooks/useBem";
 import { useRequest } from "../hooks/useRequest";
 import "./index.scss";
-var SHOW_PARENT = TreeSelect.SHOW_PARENT;
 export var AreasTreeSelect = function AreasTreeSelect(_ref) {
   var _ref$depth = _ref.depth,
     depth = _ref$depth === void 0 ? 5 : _ref$depth,

package/dist/aside/components/SortableItem.js

@@ -53,7 +53,12 @@ var SortableItem = function SortableItem(_ref) {
     className: "".concat(mb.b('content'), " ").concat(id === activeKey ? "".concat(mb.e('content-active')) : ''),
     key: id,
     onClick: function onClick() {
-      _onClick === null || _onClick === void 0 || _onClick(id);
+      _onClick === null || _onClick === void 0 || _onClick(id, {
+        key: id,
+        title: title,
+        extra: extra,
+        checked: checked
+      });
     }
   }, /*#__PURE__*/React.createElement("div", {
     className: "".concat(top)
@@ -86,8 +91,17 @@ var SortableItem = function SortableItem(_ref) {
       opacity: id === activeKey ? 1 : 0,
       display: editBtnIcon ? 'block' : 'none'
     },
-    onClick: function onClick() {
-      return onEdit === null || onEdit === void 0 ? void 0 : onEdit(id);
+    onClick: function onClick(e) {
+      if (id !== activeKey) {
+        return;
+      }
+      e.stopPropagation();
+      onEdit === null || onEdit === void 0 || onEdit(id, {
+        key: id,
+        title: title,
+        extra: extra,
+        checked: checked
+      });
     }
   }, /*#__PURE__*/React.createElement(EditBtnIcon, {
     className: "".concat(top.b('top-middle').b('top-edit-btn-icon').e('edit-btn-icon-svg'))
@@ -97,8 +111,17 @@ var SortableItem = function SortableItem(_ref) {
       opacity: id === activeKey ? 1 : 0,
       display: delBtnIcon ? 'block' : 'none'
     },
-    onClick: function onClick() {
-      return onDel === null || onDel === void 0 ? void 0 : onDel(id);
+    onClick: function onClick(e) {
+      if (id !== activeKey) {
+        return;
+      }
+      e.stopPropagation();
+      onDel === null || onDel === void 0 || onDel(id, {
+        key: id,
+        title: title,
+        extra: extra,
+        checked: checked
+      });
     }
   }, /*#__PURE__*/React.createElement(DelBtnIcon, {
     className: "".concat(top.b('top-middle').b('top-del-btn-icon').e('del-btn-icon-svg'))

package/dist/aside/components/SortableItem.scss

@@ -4,6 +4,7 @@
     padding: 12px 16px;
     box-sizing: border-box;
     cursor: pointer;
+    background-color: #fff;
     &-top {
       display: flex;
       justify-content: space-between;
@@ -77,6 +78,7 @@
     right: 16px;
     height: 1px;
     background-color: #e5e5e5;
+    z-index: 100;
   }
   &__content-active {
     background-color: #d1eaff;
@@ -89,5 +91,6 @@
     width: 4px;
     height: 100%;
     background-color: #4d8de2;
+
   }
 }

package/dist/aside/index.js

@@ -12,7 +12,7 @@ function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" !=
 function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
 import { DndContext, KeyboardSensor, PointerSensor, closestCenter, useSensor, useSensors } from '@dnd-kit/core';
 import { SortableContext, arrayMove, sortableKeyboardCoordinates, verticalListSortingStrategy } from '@dnd-kit/sortable';
-import React, { useEffect, useState } from 'react';
+import React, { useCallback, useEffect, useRef, useState } from 'react';
 import { useBem } from "../hooks/useBem";
 import { AddBtnIcon } from "./components/AddBtnIcon";
 import SortableItem from "./components/SortableItem";
@@ -26,6 +26,8 @@ export var Aside = function Aside(_ref) {
     activeKey = _ref.activeKey,
     title = _ref.title,
     data = _ref.data,
+    _ref$overflow = _ref.overflow,
+    overflow = _ref$overflow === void 0 ? false : _ref$overflow,
     _ref$titleShow = _ref.titleShow,
     titleShow = _ref$titleShow === void 0 ? true : _ref$titleShow,
     _ref$addBtnIcon = _ref.addBtnIcon,
@@ -43,8 +45,12 @@ export var Aside = function Aside(_ref) {
     onEdit = _ref.onEdit,
     onDel = _ref.onDel,
     onSwitch = _ref.onSwitch,
-    onDragEnd = _ref.onDragEnd;
+    onDragEnd = _ref.onDragEnd,
+    onScrollBottom = _ref.onScrollBottom,
+    _ref$bottomThreshold = _ref.bottomThreshold,
+    bottomThreshold = _ref$bottomThreshold === void 0 ? 50 : _ref$bottomThreshold;
   var mb = useBem('aside');
+  var asideRef = useRef(null);
   // 当前选择的key
   var _useState = useState(),
     _useState2 = _slicedToArray(_useState, 2),
@@ -64,10 +70,10 @@ export var Aside = function Aside(_ref) {
     coordinateGetter: sortableKeyboardCoordinates
   }));
   // 切换选中项
-  var handleClick = function handleClick(key) {
+  var handleClick = function handleClick(key, e) {
     if (key != null) {
       setKey(key);
-      onClick === null || onClick === void 0 || onClick(key);
+      onClick === null || onClick === void 0 || onClick(key, e);
     }
   };
   // 添加
@@ -75,12 +81,12 @@ export var Aside = function Aside(_ref) {
     onAdd === null || onAdd === void 0 || onAdd();
   };
   // 编辑
-  var handleEdit = function handleEdit(key) {
-    onEdit === null || onEdit === void 0 || onEdit(key);
+  var handleEdit = function handleEdit(key, e) {
+    onEdit === null || onEdit === void 0 || onEdit(key, e);
   };
   // 删除
-  var handleDel = function handleDel(key) {
-    onDel === null || onDel === void 0 || onDel(key);
+  var handleDel = function handleDel(key, e) {
+    onDel === null || onDel === void 0 || onDel(key, e);
   };
   // 开关
   var handleSwitch = function handleSwitch(key, e) {
@@ -121,6 +127,28 @@ export var Aside = function Aside(_ref) {
     }
   };
 
+  // 添加滚动处理函数
+  var handleScroll = useCallback(function () {
+    if (!asideRef.current || !onScrollBottom) return;
+    var _asideRef$current = asideRef.current,
+      scrollTop = _asideRef$current.scrollTop,
+      scrollHeight = _asideRef$current.scrollHeight,
+      clientHeight = _asideRef$current.clientHeight;
+    if (scrollTop + clientHeight + bottomThreshold >= scrollHeight) {
+      onScrollBottom();
+    }
+  }, [onScrollBottom, bottomThreshold]);
+
+  // 添加滚动监听
+  useEffect(function () {
+    var asideElement = asideRef.current;
+    if (!asideElement || !overflow) return;
+    asideElement.addEventListener('scroll', handleScroll);
+    return function () {
+      asideElement.removeEventListener('scroll', handleScroll);
+    };
+  }, [handleScroll, overflow]);
+
   // 给key设置初始值
   useEffect(function () {
     if (activeKey) {
@@ -137,10 +165,13 @@ export var Aside = function Aside(_ref) {
     }
   }, [data]);
   return /*#__PURE__*/React.createElement("div", {
+    ref: asideRef,
     className: "".concat(mb),
     style: _objectSpread(_objectSpread({}, style), {}, {
       width: width,
-      height: height
+      height: height,
+      overflowX: overflow ? 'hidden' : 'visible',
+      overflowY: overflow ? 'auto' : 'visible'
     })
   }, titleShow && /*#__PURE__*/React.createElement("div", {
     className: "".concat(mb.b('title'))

package/dist/aside/index.scss

@@ -4,12 +4,15 @@
   box-sizing: border-box;
   &-title {
     border-bottom: 1px solid #e5e5e5;
-    padding: 16px 0px;
-    margin: 0px 16px;
+    padding: 16px 16px;
     box-sizing: border-box;
     display: flex;
     align-items: start;
     justify-content: space-between;
+    background-color: #fff;
+    position: sticky;
+    top: 0;
+    z-index: 999;
     &__title-text {
       font-size: 18px;
       font-weight: bold;
@@ -23,3 +26,21 @@
     }
   }
 }
+// 滚动条宽度
+.yot-aside::-webkit-scrollbar {
+  width: 6px;
+  height: 10px;
+}
+// 滚动条轨道
+.yot-aside::-webkit-scrollbar-track {
+  background: white;
+  border-radius: 2px;
+  height: 10px;
+}
+// 小滑块
+.yot-aside::-webkit-scrollbar-thumb {
+  background: rgba(0, 0, 0, 0.15);
+  border-radius: 10px;
+  height: 10px;
+}
+

package/dist/aside/types/types.d.ts

@@ -1,44 +1,47 @@
-type IdataItem = {
-  key: string;
-  title: string;
-  extra?: string;
-  checked?: boolean;
-};
-export type AsideProps = {
-  width?: number;
-  height?: number | string;
-  style?: React.CSSProperties;
-  activeKey?: string;
-  title?: string;
-  data: IdataItem[];
-  titleShow?: boolean;
-  addBtnIcon?: boolean;
-  editBtnIcon?: boolean;
-  delBtnIcon?: boolean;
-  switchBtnIcon?: boolean;
-  dragBtnIcon?: boolean;
-  onClick?: (key: string) => void;
-  onAdd?: () => void;
-  onEdit?: (key: string) => void;
-  onDel?: (key: string) => void;
-  onSwitch?: (
-    changeValue: { key: string; checked: boolean },
-    data: IdataItem[],
-  ) => void;
-  onDragEnd?: (data: IdataItem[]) => void;
-};
-export type AsideItemProps = {
-  activeKey: string;
-  id: string;
-  title: string;
-  editBtnIcon?: boolean;
-  delBtnIcon?: boolean;
-  switchBtnIcon?: boolean;
-  dragBtnIcon?: boolean;
-  checked?: boolean;
-  extra?: string;
-  onClick?: (key: string) => void;
-  onEdit?: (key: string) => void;
-  onDel?: (key: string) => void;
-  onSwitch?: (key: string, e: boolean) => void;
-};
+type IdataItem = {
+  key: string;
+  title: string;
+  extra?: string;
+  checked?: boolean;
+};
+export type AsideProps = {
+  width?: number;
+  height?: number | string;
+  style?: React.CSSProperties;
+  activeKey?: string;
+  title?: string;
+  data: IdataItem[];
+  overflow?: boolean;
+  titleShow?: boolean;
+  addBtnIcon?: boolean;
+  editBtnIcon?: boolean;
+  delBtnIcon?: boolean;
+  switchBtnIcon?: boolean;
+  dragBtnIcon?: boolean;
+  onClick?: (key: string, e: IdataItem) => void;
+  onAdd?: () => void;
+  onEdit?: (key: string, e: IdataItem) => void;
+  onDel?: (key: string, e: IdataItem) => void;
+  onSwitch?: (
+    changeValue: { key: string; checked: boolean },
+    data: IdataItem[],
+  ) => void;
+  onDragEnd?: (data: IdataItem[]) => void;
+  onScrollBottom?: () => void;
+  bottomThreshold?: number;
+};
+export type AsideItemProps = {
+  activeKey: string;
+  id: string;
+  title: string;
+  editBtnIcon?: boolean;
+  delBtnIcon?: boolean;
+  switchBtnIcon?: boolean;
+  dragBtnIcon?: boolean;
+  checked?: boolean;
+  extra?: string;
+  onClick?: (key: string, e: IdataItem) => void;
+  onEdit?: (key: string, e: IdataItem) => void;
+  onDel?: (key: string, e: IdataItem) => void;
+  onSwitch?: (key: string, e: boolean) => void;
+};

package/dist/export/index.js

@@ -7,9 +7,9 @@ function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
 import { Dropdown } from 'antd';
 import React, { useState } from 'react';
 import { useBem } from "../hooks/useBem";
+import "./index.scss";
 import { DownIcon } from "./components/DownIcon";
 import { UpIcon } from "./components/UpIcon";
-import "./index.scss";
 export var Export = function Export(_ref) {
   var _ref$items = _ref.items,
     items = _ref$items === void 0 ? [{

package/dist/school/index.js

@@ -17,8 +17,8 @@ function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) r
 import { useQuery } from '@tanstack/react-query';
 import React, { useEffect, useMemo, useState } from 'react';
 import { Select } from "./..";
-import { useRequest } from "../hooks/useRequest";
 import { useBem } from "../hooks/useBem";
+import { useRequest } from "../hooks/useRequest";
 import "./index.scss";
 export var School = function School(_ref) {
   var _ref$type = _ref.type,

package/dist/year-term/index.js

@@ -11,8 +11,8 @@ function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) r
 import { useQuery } from '@tanstack/react-query';
 import React, { useEffect, useMemo, useState } from 'react';
 import { Select } from "./..";
-import { useRequest } from "../hooks/useRequest";
 import { useBem } from "../hooks/useBem";
+import { useRequest } from "../hooks/useRequest";
 import "./index.scss";
 export var YearTerm = function YearTerm(_ref) {
   var _ref$type = _ref.type,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "yootd",
-  "version": "0.0.59",
+  "version": "0.0.61",
   "description": "A react library developed with dumi",
   "license": "MIT",
   "module": "dist/index.js",