@fe-free/core 4.1.38 → 4.1.40

package/CHANGELOG.md

@@ -1,5 +1,21 @@
 # @fe-free/core
 
+## 4.1.40
+
+### Patch Changes
+
+- fix: ScrollFixed
+  - @fe-free/icons@4.1.40
+  - @fe-free/tool@4.1.40
+
+## 4.1.39
+
+### Patch Changes
+
+- fix: ai
+  - @fe-free/icons@4.1.39
+  - @fe-free/tool@4.1.39
+
 ## 4.1.38
 
 ### Patch Changes

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@fe-free/core",
-  "version": "4.1.38",
+  "version": "4.1.40",
   "description": "",
   "main": "./src/index.ts",
   "author": "",
@@ -50,8 +50,8 @@
     "i18next-icu": "^2.4.1",
     "react": "^19.2.0",
     "react-i18next": "^16.4.0",
-    "@fe-free/icons": "4.1.38",
-    "@fe-free/tool": "4.1.38"
+    "@fe-free/icons": "4.1.40",
+    "@fe-free/tool": "4.1.40"
   },
   "scripts": {
     "i18n-extract": "rm -rf ./src/locales/zh-CN && npx i18next-cli extract"

package/src/infinite_list/index.tsx

@@ -5,6 +5,7 @@ import { useImperativeHandle, useRef, useState } from 'react';
 import { useTranslation } from 'react-i18next';
 import stringify from 'safe-stable-stringify';
 import { useGlobalInfiniteScroll } from '../ahooks/use_global_infinite_scroll';
+import { ScrollFixed } from '../scroll';
 
 interface ActionType {
   reload: () => void;
@@ -22,6 +23,7 @@ interface InfiniteListProps<D, P> {
   gridClassName: string;
   className?: string;
   actionRef?: React.Ref<ActionType | undefined>;
+  scrollFixed?: boolean;
 }
 
 const emptyParams = {};
@@ -34,6 +36,7 @@ const InfiniteListBase = <D, P>({
   pageSize,
   gridClassName,
   className,
+  scrollFixed = false,
 }: InfiniteListProps<D, P>) => {
   const { t } = useTranslation();
   const ref = useRef<HTMLDivElement>(null);
@@ -91,7 +94,7 @@ const InfiniteListBase = <D, P>({
   }));
 
   return (
-    <div ref={ref} className={classNames('h-full overflow-y-auto', className)}>
+    <ScrollFixed refScroll={ref} className={className} disabled={!scrollFixed}>
       {loading && (
         <div className="flex h-full w-full items-center justify-center">
           <Spin />
@@ -116,7 +119,7 @@ const InfiniteListBase = <D, P>({
           </div>
         )}
       </div>
-    </div>
+    </ScrollFixed>
   );
 };
 

package/src/scroll/index.tsx

@@ -2,7 +2,13 @@ import classNames from 'classnames';
 import { useEffect, useMemo, useRef, useState } from 'react';
 import { getScrollbarWidth } from './helper';
 
-function useScrollFixed({ ref }: { ref: React.RefObject<HTMLElement | null> }) {
+function useScrollFixed({
+  ref,
+  disabled,
+}: {
+  ref: React.RefObject<HTMLElement | null>;
+  disabled?: boolean;
+}) {
   const [marginRight, setMarginRight] = useState(0);
 
   const scrollbarWidth = useMemo(() => {
@@ -10,6 +16,10 @@ function useScrollFixed({ ref }: { ref: React.RefObject<HTMLElement | null> }) {
   }, []);
 
   useEffect(() => {
+    if (disabled) {
+      return;
+    }
+
     const el = ref.current;
     if (!el) return;
 
@@ -28,28 +38,30 @@ function useScrollFixed({ ref }: { ref: React.RefObject<HTMLElement | null> }) {
       resizeObserver.disconnect();
       el.removeEventListener('scroll', updateMargin);
     };
-  }, [ref, scrollbarWidth]);
+  }, [ref, scrollbarWidth, disabled]);
 
   return { marginRight };
 }
 
-function ScrollFixed({
-  refScroll,
-  className,
-  children,
-  ...rest
-}: {
+interface ScrollFixedProps {
   refScroll?: React.RefObject<HTMLDivElement | null>;
+  disabled?: boolean;
   className?: string;
   style?: React.CSSProperties;
   children: React.ReactNode;
-}) {
+}
+
+function ScrollFixed({ refScroll, className, children, disabled, ...rest }: ScrollFixedProps) {
   const innerRef = useRef<HTMLDivElement>(null);
   const ref = refScroll || innerRef;
-  const { marginRight } = useScrollFixed({ ref });
+  const { marginRight } = useScrollFixed({ ref, disabled });
 
   return (
-    <div ref={ref} {...rest} className={classNames('h-full w-full overflow-y-auto', className)}>
+    <div
+      ref={ref}
+      {...rest}
+      className={classNames('h-full w-full overflow-y-auto overflow-x-hidden', className)}
+    >
       <div style={{ marginRight: `-${marginRight || 0}px` }}>{children}</div>
     </div>
   );